@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 (48 loc) • 1.5 kB
JavaScript
"use client";
import React from "react";
import styled, { css } from "styled-components";
import { Provider as SectionProvider } from "./AccordionContext";
import getSpacingToken from "../common/getSpacingToken";
import defaultTheme from "../defaultTheme";
export const StyledAccordion = styled.div.withConfig({
displayName: "Accordion__StyledAccordion",
componentId: "sc-1945m7e-0"
})(["", ";"], ({
theme
}) => css(["width:100%;box-sizing:border-box;position:relative;font-family:", ";margin-bottom:", ";"], theme.orbit.fontFamily, getSpacingToken));
StyledAccordion.defaultProps = {
theme: defaultTheme
};
const Accordion = ({
children,
dataTest,
id,
spaceAfter,
expandedSection,
loading,
onExpand
}) => /*#__PURE__*/React.createElement(StyledAccordion, {
spaceAfter: spaceAfter,
id: id,
"data-test": dataTest
}, children ? React.Children.map(children, item => {
if (!item) return null;
// @ts-expect-error TODO
const {
id: innerId
} = item.props;
// Determine if section is expanded
const isExpanded = expandedSection === innerId;
// Callback with section id
// onExpand is not required prop to have easier loading use case
const handleExpand = () => onExpand && onExpand(innerId);
return /*#__PURE__*/React.createElement(SectionProvider, {
value: {
expanded: isExpanded,
onExpand: handleExpand,
loading
}
}, item);
}) : null);
export default Accordion;
export { default as AccordionSection } from "./AccordionSection";