@kiwicom/orbit-components
Version:
Orbit-components is a React component library which provides developers with the easiest possible way of building Kiwi.com’s products.
50 lines • 1.98 kB
JavaScript
import * as React from "react";
import styled, { css } from "styled-components";
import transition from "../../../utils/transition";
import defaultTheme from "../../../defaultTheme";
import Slide from "../../../utils/Slide";
import mq from "../../../utils/mediaQuery";
import useBoundingRect from "../../../hooks/useBoundingRect";
const StyledCardSectionContent = styled.div.withConfig({
displayName: "SectionContent__StyledCardSectionContent",
componentId: "sc-fc25b1-0"
})(["", ";"], ({
theme,
expanded,
noSeparator,
hasPaddingTop
}) => css(["font-family:", ";font-size:", ";line-height:", ";color:", ";width:100%;border-top:", ";padding-top:", ";transition:", ";", ""], theme.orbit.fontFamily, theme.orbit.fontSizeTextNormal, theme.orbit.lineHeightTextNormal, theme.orbit.colorTextPrimary, expanded && !noSeparator ? `1px solid ${theme.orbit.paletteCloudNormal}` : `0px solid ${theme.orbit.paletteCloudNormal}`, hasPaddingTop && theme.orbit.spaceMedium, transition(["padding", "border-top"], "fast", "linear"), mq.largeMobile(css(["padding-top:", ";"], hasPaddingTop && theme.orbit.spaceLarge))));
StyledCardSectionContent.defaultProps = {
theme: defaultTheme
};
const SectionContent = ({
expandable,
expanded,
children,
noSeparator,
hasPaddingTop,
slideID,
labelID
}) => {
const [{
height
}, ref] = useBoundingRect({
height: expanded ? null : 0
});
return /*#__PURE__*/React.createElement(React.Fragment, null, expandable ? /*#__PURE__*/React.createElement(Slide, {
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));
};
export default SectionContent;