react-base-guide
Version:
react ui components
25 lines • 1.5 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const styled_components_1 = __importDefault(require("styled-components"));
const head_1 = __importDefault(require("./head"));
const body_1 = __importDefault(require("./body"));
const add_custom_style_1 = require("../../utils/add-custom-style");
const AccordionContainer = styled_components_1.default.div `
position: relative;
box-sizing: border-box;
box-shadow: ${p => p.theme.shadow.element};
${p => (0, add_custom_style_1.addCustomStyle)(p.styled$)}
`;
const Accordion = (props) => {
const { head, children } = props;
const [open, setOpen] = (0, react_1.useState)(props.open || false);
(0, react_1.useEffect)(() => setOpen(props.open), [props.open]);
return ((0, jsx_runtime_1.jsxs)(AccordionContainer, Object.assign({ className: props.className, "styled$": props.styled }, { children: [(0, jsx_runtime_1.jsx)(head_1.default, Object.assign({ open: open, disabled: props.disabled, onClick: () => setOpen(!open) }, { children: head })), (0, jsx_runtime_1.jsx)(body_1.default, Object.assign({ "$open": open, disabled: props.disabled }, { children: open ? children : null }))] })));
};
exports.default = Accordion;
//# sourceMappingURL=index.js.map