@kiwicom/orbit-components/lib/Card/CardSection/components/SectionContent.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 _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

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

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

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

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

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

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

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

var _Slide = _interopRequireDefault(require("../../../utils/Slide"));

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

var _useBoundingRect3 = _interopRequireDefault(require("../../../hooks/useBoundingRect"));

var StyledCardSectionContent = _styledComponents.default.div.withConfig({
  displayName: "SectionContent__StyledCardSectionContent",
  componentId: "gtsta3-0"
})(["font-family:", ";font-size:", ";line-height:", ";color:", ";width:100%;border-top:", ";padding-top:", ";transition:", ";", ""], function (_ref) {
  var theme = _ref.theme;
  return theme.orbit.fontFamily;
}, function (_ref2) {
  var theme = _ref2.theme;
  return theme.orbit.fontSizeTextNormal;
}, function (_ref3) {
  var theme = _ref3.theme;
  return theme.orbit.lineHeightTextNormal;
}, function (_ref4) {
  var theme = _ref4.theme;
  return theme.orbit.colorTextPrimary;
}, function (_ref5) {
  var theme = _ref5.theme,
      expanded = _ref5.expanded,
      noSeparator = _ref5.noSeparator;
  return expanded && !noSeparator ? "1px solid ".concat(theme.orbit.paletteCloudNormal) : "0px solid ".concat(theme.orbit.paletteCloudNormal);
}, function (_ref6) {
  var hasPaddingTop = _ref6.hasPaddingTop,
      theme = _ref6.theme;
  return hasPaddingTop && theme.orbit.spaceMedium;
}, (0, _transition.default)(["padding", "border-top"], "fast", "linear"), _mediaQuery.default.largeMobile((0, _styledComponents.css)(["padding-top:", ";"], function (_ref7) {
  var theme = _ref7.theme,
      hasPaddingTop = _ref7.hasPaddingTop;
  return hasPaddingTop && theme.orbit.spaceLarge;
}))); // $FlowFixMe: https://github.com/flow-typed/flow-typed/issues/3653#issuecomment-568539198


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

var SectionContent = function SectionContent(_ref8) {
  var expandable = _ref8.expandable,
      expanded = _ref8.expanded,
      children = _ref8.children,
      noSeparator = _ref8.noSeparator,
      hasPaddingTop = _ref8.hasPaddingTop,
      slideID = _ref8.slideID,
      labelID = _ref8.labelID;

  var _useBoundingRect = (0, _useBoundingRect3.default)({
    height: expanded ? null : 0
  }),
      _useBoundingRect2 = (0, _slicedToArray2.default)(_useBoundingRect, 2),
      height = _useBoundingRect2[0].height,
      ref = _useBoundingRect2[1];

  return /*#__PURE__*/React.createElement(React.Fragment, null, expandable ? /*#__PURE__*/React.createElement(_Slide.default, {
    maxHeight: height,
    expanded: expanded,
    id: slideID,
    ariaLabelledBy: labelID
  }, /*#__PURE__*/React.createElement(StyledCardSectionContent, {
    noSeparator: noSeparator,
    ref: ref,
    expanded: expanded,
    hasPaddingTop: hasPaddingTop,
    expandable: expandable
  }, children)) : /*#__PURE__*/React.createElement(StyledCardSectionContent, {
    ref: ref,
    hasPaddingTop: hasPaddingTop
  }, children));
};

var _default = SectionContent;
exports.default = _default;