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

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

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

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

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

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

var _transition = _interopRequireDefault(require("../../../utils/transition"));

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

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

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

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

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.largeMobile((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.largeMobile((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-1u526f5-0"
})(["padding:", ";", ";", ";border-bottom:", ";transition:", ";", ";", ";", ";", " &: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;
}, (0, _transition.default)(["margin"], "fast", "ease-in-out"), function (_ref8) {
  var noBorderTop = _ref8.noBorderTop,
      expandable = _ref8.expandable;
  return noBorderTop && !expandable && "border-top: 1px solid transparent; padding-top: 0 !important;";
}, function (_ref9) {
  var expanded = _ref9.expanded;
  return expanded && (0, _styledComponents.css)(["margin:", " 0;border:1px solid transparent;"], function (_ref10) {
    var theme = _ref10.theme;
    return theme.orbit.spaceXSmall;
  });
}, function (_ref11) {
  var roundedTop = _ref11.roundedTop;
  return roundedTop && topBorderRadius;
}, function (_ref12) {
  var roundedBottom = _ref12.roundedBottom;
  return roundedBottom && bottomBorderRadius;
}, function (_ref13) {
  var expanded = _ref13.expanded;
  return !expanded && (0, _styledComponents.css)(["border-bottom:", ";"], _borders.getBorder);
}, _mediaQuery.default.largeMobile((0, _styledComponents.css)(["&:first-of-type{", ";}&:last-of-type{", ";}padding:", ";"], topBorderRadius, bottomBorderRadius, function (_ref14) {
  var theme = _ref14.theme,
      noPadding = _ref14.noPadding;
  return !noPadding && theme.orbit.spaceLarge;
})));

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

var CardWrapper = function CardWrapper(_ref15) {
  var children = _ref15.children,
      bottomBorder = _ref15.bottomBorder,
      roundedBottom = _ref15.roundedBottom,
      roundedTop = _ref15.roundedTop,
      expanded = _ref15.expanded,
      noBorderTop = _ref15.noBorderTop,
      dataTest = _ref15.dataTest,
      noPadding = _ref15.noPadding,
      expandable = _ref15.expandable,
      initialExpanded = _ref15.initialExpanded;
  return /*#__PURE__*/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;