@kiwicom/orbit-components/lib/Card/components/CardWrapper.js

Orbit-components is a React component library which provides developers with the easiest possible way of building Kiwi.com’s products.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _styledComponents = _interopRequireWildcard(require("styled-components"));

var React = _interopRequireWildcard(require("react"));

var _mediaQuery = _interopRequireDefault(require("../../utils/mediaQuery"));

var _mixins = require("../helpers/mixins");

var _defaultTheme = _interopRequireDefault(require("../../defaultTheme"));

var _borders = require("../helpers/borders");

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; return newObj; } }

var topBorderRadius = (0, _styledComponents.css)(["border-top-left-radius:", ";border-top-right-radius:", ";", ""], function (_ref) {
  var expanded = _ref.expanded;
  return expanded && _borders.getBorderRadiusMobile;
}, function (_ref2) {
  var expanded = _ref2.expanded;
  return expanded && _borders.getBorderRadiusMobile;
}, _mediaQuery.default.tablet((0, _styledComponents.css)(["border-top-left-radius:", ";border-top-right-radius:", ";"], _borders.getBorderRadius, _borders.getBorderRadius)));
topBorderRadius.defaultTheme = {
  theme: _defaultTheme.default
};
var bottomBorderRadius = (0, _styledComponents.css)(["border-bottom-left-radius:", ";border-bottom-right-radius:", ";", ""], function (_ref3) {
  var expanded = _ref3.expanded;
  return expanded && _borders.getBorderRadiusMobile;
}, function (_ref4) {
  var expanded = _ref4.expanded;
  return expanded && _borders.getBorderRadiusMobile;
}, _mediaQuery.default.tablet((0, _styledComponents.css)(["border-bottom-left-radius:", ";border-bottom-right-radius:", ";"], _borders.getBorderRadius, _borders.getBorderRadius)));
bottomBorderRadius.defaultProps = {
  theme: _defaultTheme.default
};

var StyledCardWrapper = _styledComponents.default.div.withConfig({
  displayName: "CardWrapper__StyledCardWrapper",
  componentId: "sc-1oft6i5-0"
})(["padding:", ";", ";", ";border-bottom:", ";transition:margin ", " ease-in-out;", ";", ";", ";", " &:last-of-type{", "}", ""], function (_ref5) {
  var theme = _ref5.theme,
      noPadding = _ref5.noPadding;
  return !noPadding && theme.orbit.spaceMedium;
}, _mixins.CardElement, function (_ref6) {
  var bottomBorder = _ref6.bottomBorder;
  return bottomBorder && bottomBorderRadius;
}, function (_ref7) {
  var roundedBottom = _ref7.roundedBottom,
      bottomBorder = _ref7.bottomBorder;
  return (roundedBottom || bottomBorder) && _borders.getBorder;
}, function (_ref8) {
  var theme = _ref8.theme;
  return theme.orbit.durationFast;
}, function (_ref9) {
  var noBorderTop = _ref9.noBorderTop,
      expandable = _ref9.expandable;
  return noBorderTop && !expandable && "border-top: 1px solid transparent; padding-top: 0 !important;";
}, function (_ref10) {
  var expanded = _ref10.expanded;
  return expanded && (0, _styledComponents.css)(["margin:", " 0;border:1px solid transparent;"], function (_ref11) {
    var theme = _ref11.theme;
    return theme.orbit.spaceXSmall;
  });
}, function (_ref12) {
  var roundedTop = _ref12.roundedTop;
  return roundedTop && topBorderRadius;
}, function (_ref13) {
  var roundedBottom = _ref13.roundedBottom;
  return roundedBottom && bottomBorderRadius;
}, function (_ref14) {
  var expanded = _ref14.expanded;
  return !expanded && (0, _styledComponents.css)(["border-bottom:", ";"], _borders.getBorder);
}, _mediaQuery.default.tablet((0, _styledComponents.css)(["&:first-of-type{", ";}&:last-of-type{", ";}padding:", ";"], topBorderRadius, bottomBorderRadius, function (_ref15) {
  var theme = _ref15.theme,
      noPadding = _ref15.noPadding;
  return !noPadding && theme.orbit.spaceLarge;
})));

StyledCardWrapper.defaultProps = {
  theme: _defaultTheme.default
};

var CardWrapper = function CardWrapper(_ref16) {
  var children = _ref16.children,
      bottomBorder = _ref16.bottomBorder,
      roundedBottom = _ref16.roundedBottom,
      roundedTop = _ref16.roundedTop,
      expanded = _ref16.expanded,
      noBorderTop = _ref16.noBorderTop,
      dataTest = _ref16.dataTest,
      noPadding = _ref16.noPadding,
      expandable = _ref16.expandable,
      initialExpanded = _ref16.initialExpanded;
  return React.createElement(StyledCardWrapper, {
    bottomBorder: bottomBorder,
    expanded: expanded || initialExpanded,
    "data-test": dataTest,
    noBorderTop: noBorderTop,
    expandable: expandable,
    noPadding: noPadding,
    roundedBottom: roundedBottom,
    roundedTop: roundedTop
  }, children);
};

var _default = CardWrapper;
exports.default = _default;