@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 _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;

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

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

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 _useBoundingRect = _interopRequireDefault(require("../../../hooks/useBoundingRect"));

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


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

const SectionContent = ({
  expandable,
  expanded,
  children,
  noSeparator,
  hasPaddingTop,
  slideID,
  labelID
}) => {
  const [{
    height
  }, ref] = (0, _useBoundingRect.default)({
    height: expanded ? null : 0
  });
  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;