UNPKG

@mantine/core

Version:

React components library focused on usability, accessibility and developer experience

113 lines (106 loc) 3.7 kB
'use strict'; Object.defineProperty(exports, '__esModule', { value: true }); var React = require('react'); var hooks = require('@mantine/hooks'); var AccordionItem = require('./AccordionItem/AccordionItem.js'); var AccordionControl = require('./AccordionControl/AccordionControl.js'); function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e['default'] : e; } var React__default = /*#__PURE__*/_interopDefaultLegacy(React); var __defProp = Object.defineProperty; var __defProps = Object.defineProperties; var __getOwnPropDescs = Object.getOwnPropertyDescriptors; var __getOwnPropSymbols = Object.getOwnPropertySymbols; var __hasOwnProp = Object.prototype.hasOwnProperty; var __propIsEnum = Object.prototype.propertyIsEnumerable; var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value; var __spreadValues = (a, b) => { for (var prop in b || (b = {})) if (__hasOwnProp.call(b, prop)) __defNormalProp(a, prop, b[prop]); if (__getOwnPropSymbols) for (var prop of __getOwnPropSymbols(b)) { if (__propIsEnum.call(b, prop)) __defNormalProp(a, prop, b[prop]); } return a; }; var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b)); var __objRest = (source, exclude) => { var target = {}; for (var prop in source) if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0) target[prop] = source[prop]; if (source != null && __getOwnPropSymbols) for (var prop of __getOwnPropSymbols(source)) { if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop)) target[prop] = source[prop]; } return target; }; function Accordion(_a) { var _b = _a, { children, initialItem = 0, initialState, state, onChange, multiple = false, transitionDuration = 200, themeOverride, classNames, styles, id } = _b, others = __objRest(_b, [ "children", "initialItem", "initialState", "state", "onChange", "multiple", "transitionDuration", "themeOverride", "classNames", "styles", "id" ]); const uuid = hooks.useId(id); const items = React__default.Children.toArray(children).filter((item) => item.type === AccordionItem.AccordionItem); const _initialState = initialState || items.reduce((acc, item, index) => { acc[index] = index === initialItem; return acc; }, {}); const [value, setValue] = hooks.useUncontrolled({ value: state, defaultValue: _initialState, finalValue: {}, onChange, rule: (val) => val !== null && typeof val === "object" }); const handleItemToggle = (index) => { if (multiple) { setValue(__spreadProps(__spreadValues({}, value), { [index]: !value[index] })); } else { const newValues = items.reduce((acc, item, itemIndex) => { acc[itemIndex] = false; return acc; }, {}); newValues[index] = !value[index]; setValue(newValues); } }; const controls = items.map((item, index) => /* @__PURE__ */ React__default.createElement(AccordionControl.AccordionControl, __spreadProps(__spreadValues({}, item.props), { key: index, themeOverride, transitionDuration, opened: value[index], onToggle: () => handleItemToggle(index), classNames, styles, id: `${uuid}-${index}` }))); return /* @__PURE__ */ React__default.createElement("div", __spreadValues({}, others), controls); } Accordion.displayName = "@mantine/core/Accordion"; exports.AccordionItem = AccordionItem.AccordionItem; exports.Accordion = Accordion; //# sourceMappingURL=Accordion.js.map