@radix-ui/react-accordion 0.0.0-20250116175529

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/README.md +13 -0
  2. package/dist/index.d.mts +114 -0
  3. package/dist/index.d.ts +114 -0
  4. package/dist/index.js +350 -0
  5. package/dist/index.js.map +7 -0
  6. package/dist/index.mjs +318 -0
  7. package/dist/index.mjs.map +7 -0
  8. package/package.json +62 -0
package/README.md ADDED
@@ -0,0 +1,13 @@
1
+ # `react-accordion`
2
+
3
+ ## Installation
4
+
5
+ ```sh
6
+ $ yarn add @radix-ui/react-accordion
7
+ # or
8
+ $ npm install @radix-ui/react-accordion
9
+ ```
10
+
11
+ ## Usage
12
+
13
+ View docs [here](https://radix-ui.com/primitives/docs/components/accordion).
package/dist/index.d.mts ADDED
@@ -0,0 +1,114 @@
1
+ import * as _radix_ui_react_context from '@radix-ui/react-context';
2
+ import React from 'react';
3
+ import { Primitive } from '@radix-ui/react-primitive';
4
+ import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
5
+
6
+ type Direction = 'ltr' | 'rtl';
7
+ declare const createAccordionScope: _radix_ui_react_context.CreateScope;
8
+ interface AccordionSingleProps extends AccordionImplSingleProps {
9
+ type: 'single';
10
+ }
11
+ interface AccordionMultipleProps extends AccordionImplMultipleProps {
12
+ type: 'multiple';
13
+ }
14
+ declare const Accordion: React.ForwardRefExoticComponent<(AccordionSingleProps | AccordionMultipleProps) & React.RefAttributes<HTMLDivElement>>;
15
+ interface AccordionImplSingleProps extends AccordionImplProps {
16
+ /**
17
+ * The controlled stateful value of the accordion item whose content is expanded.
18
+ */
19
+ value?: string;
20
+ /**
21
+ * The value of the item whose content is expanded when the accordion is initially rendered. Use
22
+ * `defaultValue` if you do not need to control the state of an accordion.
23
+ */
24
+ defaultValue?: string;
25
+ /**
26
+ * The callback that fires when the state of the accordion changes.
27
+ */
28
+ onValueChange?(value: string): void;
29
+ /**
30
+ * Whether an accordion item can be collapsed after it has been opened.
31
+ * @default false
32
+ */
33
+ collapsible?: boolean;
34
+ }
35
+ interface AccordionImplMultipleProps extends AccordionImplProps {
36
+ /**
37
+ * The controlled stateful value of the accordion items whose contents are expanded.
38
+ */
39
+ value?: string[];
40
+ /**
41
+ * The value of the items whose contents are expanded when the accordion is initially rendered. Use
42
+ * `defaultValue` if you do not need to control the state of an accordion.
43
+ */
44
+ defaultValue?: string[];
45
+ /**
46
+ * The callback that fires when the state of the accordion changes.
47
+ */
48
+ onValueChange?(value: string[]): void;
49
+ }
50
+ type PrimitiveDivProps = React.ComponentPropsWithoutRef<typeof Primitive.div>;
51
+ interface AccordionImplProps extends PrimitiveDivProps {
52
+ /**
53
+ * Whether or not an accordion is disabled from user interaction.
54
+ *
55
+ * @defaultValue false
56
+ */
57
+ disabled?: boolean;
58
+ /**
59
+ * The layout in which the Accordion operates.
60
+ * @default vertical
61
+ */
62
+ orientation?: React.AriaAttributes['aria-orientation'];
63
+ /**
64
+ * The language read direction.
65
+ */
66
+ dir?: Direction;
67
+ }
68
+ type CollapsibleProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Root>;
69
+ interface AccordionItemProps extends Omit<CollapsibleProps, 'open' | 'defaultOpen' | 'onOpenChange'> {
70
+ /**
71
+ * Whether or not an accordion item is disabled from user interaction.
72
+ *
73
+ * @defaultValue false
74
+ */
75
+ disabled?: boolean;
76
+ /**
77
+ * A string value for the accordion item. All items within an accordion should use a unique value.
78
+ */
79
+ value: string;
80
+ }
81
+ /**
82
+ * `AccordionItem` contains all of the parts of a collapsible section inside of an `Accordion`.
83
+ */
84
+ declare const AccordionItem: React.ForwardRefExoticComponent<AccordionItemProps & React.RefAttributes<HTMLDivElement>>;
85
+ type PrimitiveHeading3Props = React.ComponentPropsWithoutRef<typeof Primitive.h3>;
86
+ interface AccordionHeaderProps extends PrimitiveHeading3Props {
87
+ }
88
+ /**
89
+ * `AccordionHeader` contains the content for the parts of an `AccordionItem` that will be visible
90
+ * whether or not its content is collapsed.
91
+ */
92
+ declare const AccordionHeader: React.ForwardRefExoticComponent<AccordionHeaderProps & React.RefAttributes<HTMLHeadingElement>>;
93
+ type CollapsibleTriggerProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Trigger>;
94
+ interface AccordionTriggerProps extends CollapsibleTriggerProps {
95
+ }
96
+ /**
97
+ * `AccordionTrigger` is the trigger that toggles the collapsed state of an `AccordionItem`. It
98
+ * should always be nested inside of an `AccordionHeader`.
99
+ */
100
+ declare const AccordionTrigger: React.ForwardRefExoticComponent<AccordionTriggerProps & React.RefAttributes<HTMLButtonElement>>;
101
+ type CollapsibleContentProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Content>;
102
+ interface AccordionContentProps extends CollapsibleContentProps {
103
+ }
104
+ /**
105
+ * `AccordionContent` contains the collapsible content for an `AccordionItem`.
106
+ */
107
+ declare const AccordionContent: React.ForwardRefExoticComponent<AccordionContentProps & React.RefAttributes<HTMLDivElement>>;
108
+ declare const Root: React.ForwardRefExoticComponent<(AccordionSingleProps | AccordionMultipleProps) & React.RefAttributes<HTMLDivElement>>;
109
+ declare const Item: React.ForwardRefExoticComponent<AccordionItemProps & React.RefAttributes<HTMLDivElement>>;
110
+ declare const Header: React.ForwardRefExoticComponent<AccordionHeaderProps & React.RefAttributes<HTMLHeadingElement>>;
111
+ declare const Trigger: React.ForwardRefExoticComponent<AccordionTriggerProps & React.RefAttributes<HTMLButtonElement>>;
112
+ declare const Content: React.ForwardRefExoticComponent<AccordionContentProps & React.RefAttributes<HTMLDivElement>>;
113
+
114
+ export { Accordion, AccordionContent, type AccordionContentProps, AccordionHeader, type AccordionHeaderProps, AccordionItem, type AccordionItemProps, type AccordionMultipleProps, type AccordionSingleProps, AccordionTrigger, type AccordionTriggerProps, Content, Header, Item, Root, Trigger, createAccordionScope };
package/dist/index.d.ts ADDED
@@ -0,0 +1,114 @@
1
+ import * as _radix_ui_react_context from '@radix-ui/react-context';
2
+ import React from 'react';
3
+ import { Primitive } from '@radix-ui/react-primitive';
4
+ import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
5
+
6
+ type Direction = 'ltr' | 'rtl';
7
+ declare const createAccordionScope: _radix_ui_react_context.CreateScope;
8
+ interface AccordionSingleProps extends AccordionImplSingleProps {
9
+ type: 'single';
10
+ }
11
+ interface AccordionMultipleProps extends AccordionImplMultipleProps {
12
+ type: 'multiple';
13
+ }
14
+ declare const Accordion: React.ForwardRefExoticComponent<(AccordionSingleProps | AccordionMultipleProps) & React.RefAttributes<HTMLDivElement>>;
15
+ interface AccordionImplSingleProps extends AccordionImplProps {
16
+ /**
17
+ * The controlled stateful value of the accordion item whose content is expanded.
18
+ */
19
+ value?: string;
20
+ /**
21
+ * The value of the item whose content is expanded when the accordion is initially rendered. Use
22
+ * `defaultValue` if you do not need to control the state of an accordion.
23
+ */
24
+ defaultValue?: string;
25
+ /**
26
+ * The callback that fires when the state of the accordion changes.
27
+ */
28
+ onValueChange?(value: string): void;
29
+ /**
30
+ * Whether an accordion item can be collapsed after it has been opened.
31
+ * @default false
32
+ */
33
+ collapsible?: boolean;
34
+ }
35
+ interface AccordionImplMultipleProps extends AccordionImplProps {
36
+ /**
37
+ * The controlled stateful value of the accordion items whose contents are expanded.
38
+ */
39
+ value?: string[];
40
+ /**
41
+ * The value of the items whose contents are expanded when the accordion is initially rendered. Use
42
+ * `defaultValue` if you do not need to control the state of an accordion.
43
+ */
44
+ defaultValue?: string[];
45
+ /**
46
+ * The callback that fires when the state of the accordion changes.
47
+ */
48
+ onValueChange?(value: string[]): void;
49
+ }
50
+ type PrimitiveDivProps = React.ComponentPropsWithoutRef<typeof Primitive.div>;
51
+ interface AccordionImplProps extends PrimitiveDivProps {
52
+ /**
53
+ * Whether or not an accordion is disabled from user interaction.
54
+ *
55
+ * @defaultValue false
56
+ */
57
+ disabled?: boolean;
58
+ /**
59
+ * The layout in which the Accordion operates.
60
+ * @default vertical
61
+ */
62
+ orientation?: React.AriaAttributes['aria-orientation'];
63
+ /**
64
+ * The language read direction.
65
+ */
66
+ dir?: Direction;
67
+ }
68
+ type CollapsibleProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Root>;
69
+ interface AccordionItemProps extends Omit<CollapsibleProps, 'open' | 'defaultOpen' | 'onOpenChange'> {
70
+ /**
71
+ * Whether or not an accordion item is disabled from user interaction.
72
+ *
73
+ * @defaultValue false
74
+ */
75
+ disabled?: boolean;
76
+ /**
77
+ * A string value for the accordion item. All items within an accordion should use a unique value.
78
+ */
79
+ value: string;
80
+ }
81
+ /**
82
+ * `AccordionItem` contains all of the parts of a collapsible section inside of an `Accordion`.
83
+ */
84
+ declare const AccordionItem: React.ForwardRefExoticComponent<AccordionItemProps & React.RefAttributes<HTMLDivElement>>;
85
+ type PrimitiveHeading3Props = React.ComponentPropsWithoutRef<typeof Primitive.h3>;
86
+ interface AccordionHeaderProps extends PrimitiveHeading3Props {
87
+ }
88
+ /**
89
+ * `AccordionHeader` contains the content for the parts of an `AccordionItem` that will be visible
90
+ * whether or not its content is collapsed.
91
+ */
92
+ declare const AccordionHeader: React.ForwardRefExoticComponent<AccordionHeaderProps & React.RefAttributes<HTMLHeadingElement>>;
93
+ type CollapsibleTriggerProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Trigger>;
94
+ interface AccordionTriggerProps extends CollapsibleTriggerProps {
95
+ }
96
+ /**
97
+ * `AccordionTrigger` is the trigger that toggles the collapsed state of an `AccordionItem`. It
98
+ * should always be nested inside of an `AccordionHeader`.
99
+ */
100
+ declare const AccordionTrigger: React.ForwardRefExoticComponent<AccordionTriggerProps & React.RefAttributes<HTMLButtonElement>>;
101
+ type CollapsibleContentProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Content>;
102
+ interface AccordionContentProps extends CollapsibleContentProps {
103
+ }
104
+ /**
105
+ * `AccordionContent` contains the collapsible content for an `AccordionItem`.
106
+ */
107
+ declare const AccordionContent: React.ForwardRefExoticComponent<AccordionContentProps & React.RefAttributes<HTMLDivElement>>;
108
+ declare const Root: React.ForwardRefExoticComponent<(AccordionSingleProps | AccordionMultipleProps) & React.RefAttributes<HTMLDivElement>>;
109
+ declare const Item: React.ForwardRefExoticComponent<AccordionItemProps & React.RefAttributes<HTMLDivElement>>;
110
+ declare const Header: React.ForwardRefExoticComponent<AccordionHeaderProps & React.RefAttributes<HTMLHeadingElement>>;
111
+ declare const Trigger: React.ForwardRefExoticComponent<AccordionTriggerProps & React.RefAttributes<HTMLButtonElement>>;
112
+ declare const Content: React.ForwardRefExoticComponent<AccordionContentProps & React.RefAttributes<HTMLDivElement>>;
113
+
114
+ export { Accordion, AccordionContent, type AccordionContentProps, AccordionHeader, type AccordionHeaderProps, AccordionItem, type AccordionItemProps, type AccordionMultipleProps, type AccordionSingleProps, AccordionTrigger, type AccordionTriggerProps, Content, Header, Item, Root, Trigger, createAccordionScope };
package/dist/index.js ADDED
@@ -0,0 +1,350 @@
1
+ "use strict";
2
+ "use client";
3
+ var __create = Object.create;
4
+ var __defProp = Object.defineProperty;
5
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
6
+ var __getOwnPropNames = Object.getOwnPropertyNames;
7
+ var __getProtoOf = Object.getPrototypeOf;
8
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
9
+ var __export = (target, all) => {
10
+ for (var name in all)
11
+ __defProp(target, name, { get: all[name], enumerable: true });
12
+ };
13
+ var __copyProps = (to, from, except, desc) => {
14
+ if (from && typeof from === "object" || typeof from === "function") {
15
+ for (let key of __getOwnPropNames(from))
16
+ if (!__hasOwnProp.call(to, key) && key !== except)
17
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
18
+ }
19
+ return to;
20
+ };
21
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
22
+ // If the importer is in node compatibility mode or this is not an ESM
23
+ // file that has been converted to a CommonJS file using a Babel-
24
+ // compatible transform (i.e. "__esModule" has not been set), then set
25
+ // "default" to the CommonJS "module.exports" for node compatibility.
26
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
27
+ mod
28
+ ));
29
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
30
+
31
+ // packages/react/accordion/src/index.ts
32
+ var src_exports = {};
33
+ __export(src_exports, {
34
+ Accordion: () => Accordion,
35
+ AccordionContent: () => AccordionContent,
36
+ AccordionHeader: () => AccordionHeader,
37
+ AccordionItem: () => AccordionItem,
38
+ AccordionTrigger: () => AccordionTrigger,
39
+ Content: () => Content2,
40
+ Header: () => Header,
41
+ Item: () => Item,
42
+ Root: () => Root2,
43
+ Trigger: () => Trigger2,
44
+ createAccordionScope: () => createAccordionScope
45
+ });
46
+ module.exports = __toCommonJS(src_exports);
47
+
48
+ // packages/react/accordion/src/Accordion.tsx
49
+ var import_react = __toESM(require("react"));
50
+ var import_react_context = require("@radix-ui/react-context");
51
+ var import_react_collection = require("@radix-ui/react-collection");
52
+ var import_react_compose_refs = require("@radix-ui/react-compose-refs");
53
+ var import_primitive = require("@radix-ui/primitive");
54
+ var import_react_use_controllable_state = require("@radix-ui/react-use-controllable-state");
55
+ var import_react_primitive = require("@radix-ui/react-primitive");
56
+ var CollapsiblePrimitive = __toESM(require("@radix-ui/react-collapsible"));
57
+ var import_react_collapsible = require("@radix-ui/react-collapsible");
58
+ var import_react_id = require("@radix-ui/react-id");
59
+ var import_react_direction = require("@radix-ui/react-direction");
60
+ var import_jsx_runtime = require("react/jsx-runtime");
61
+ var ACCORDION_NAME = "Accordion";
62
+ var ACCORDION_KEYS = ["Home", "End", "ArrowDown", "ArrowUp", "ArrowLeft", "ArrowRight"];
63
+ var [Collection, useCollection, createCollectionScope] = (0, import_react_collection.createCollection)(ACCORDION_NAME);
64
+ var [createAccordionContext, createAccordionScope] = (0, import_react_context.createContextScope)(ACCORDION_NAME, [
65
+ createCollectionScope,
66
+ import_react_collapsible.createCollapsibleScope
67
+ ]);
68
+ var useCollapsibleScope = (0, import_react_collapsible.createCollapsibleScope)();
69
+ var Accordion = import_react.default.forwardRef(
70
+ (props, forwardedRef) => {
71
+ const { type, ...accordionProps } = props;
72
+ const singleProps = accordionProps;
73
+ const multipleProps = accordionProps;
74
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Collection.Provider, { scope: props.__scopeAccordion, children: type === "multiple" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionImplMultiple, { ...multipleProps, ref: forwardedRef }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionImplSingle, { ...singleProps, ref: forwardedRef }) });
75
+ }
76
+ );
77
+ Accordion.displayName = ACCORDION_NAME;
78
+ var [AccordionValueProvider, useAccordionValueContext] = createAccordionContext(ACCORDION_NAME);
79
+ var [AccordionCollapsibleProvider, useAccordionCollapsibleContext] = createAccordionContext(
80
+ ACCORDION_NAME,
81
+ { collapsible: false }
82
+ );
83
+ var AccordionImplSingle = import_react.default.forwardRef(
84
+ (props, forwardedRef) => {
85
+ const {
86
+ value: valueProp,
87
+ defaultValue,
88
+ onValueChange = () => {
89
+ },
90
+ collapsible = false,
91
+ ...accordionSingleProps
92
+ } = props;
93
+ const [value, setValue] = (0, import_react_use_controllable_state.useControllableState)({
94
+ prop: valueProp,
95
+ defaultProp: defaultValue,
96
+ onChange: onValueChange
97
+ });
98
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
99
+ AccordionValueProvider,
100
+ {
101
+ scope: props.__scopeAccordion,
102
+ value: value ? [value] : [],
103
+ onItemOpen: setValue,
104
+ onItemClose: import_react.default.useCallback(() => collapsible && setValue(""), [collapsible, setValue]),
105
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionCollapsibleProvider, { scope: props.__scopeAccordion, collapsible, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionImpl, { ...accordionSingleProps, ref: forwardedRef }) })
106
+ }
107
+ );
108
+ }
109
+ );
110
+ var AccordionImplMultiple = import_react.default.forwardRef((props, forwardedRef) => {
111
+ const {
112
+ value: valueProp,
113
+ defaultValue,
114
+ onValueChange = () => {
115
+ },
116
+ ...accordionMultipleProps
117
+ } = props;
118
+ const [value = [], setValue] = (0, import_react_use_controllable_state.useControllableState)({
119
+ prop: valueProp,
120
+ defaultProp: defaultValue,
121
+ onChange: onValueChange
122
+ });
123
+ const handleItemOpen = import_react.default.useCallback(
124
+ (itemValue) => setValue((prevValue = []) => [...prevValue, itemValue]),
125
+ [setValue]
126
+ );
127
+ const handleItemClose = import_react.default.useCallback(
128
+ (itemValue) => setValue((prevValue = []) => prevValue.filter((value2) => value2 !== itemValue)),
129
+ [setValue]
130
+ );
131
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
132
+ AccordionValueProvider,
133
+ {
134
+ scope: props.__scopeAccordion,
135
+ value,
136
+ onItemOpen: handleItemOpen,
137
+ onItemClose: handleItemClose,
138
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionCollapsibleProvider, { scope: props.__scopeAccordion, collapsible: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionImpl, { ...accordionMultipleProps, ref: forwardedRef }) })
139
+ }
140
+ );
141
+ });
142
+ var [AccordionImplProvider, useAccordionContext] = createAccordionContext(ACCORDION_NAME);
143
+ var AccordionImpl = import_react.default.forwardRef(
144
+ (props, forwardedRef) => {
145
+ const { __scopeAccordion, disabled, dir, orientation = "vertical", ...accordionProps } = props;
146
+ const accordionRef = import_react.default.useRef(null);
147
+ const composedRefs = (0, import_react_compose_refs.useComposedRefs)(accordionRef, forwardedRef);
148
+ const getItems = useCollection(__scopeAccordion);
149
+ const direction = (0, import_react_direction.useDirection)(dir);
150
+ const isDirectionLTR = direction === "ltr";
151
+ const handleKeyDown = (0, import_primitive.composeEventHandlers)(props.onKeyDown, (event) => {
152
+ if (!ACCORDION_KEYS.includes(event.key)) return;
153
+ const target = event.target;
154
+ const triggerCollection = getItems().filter((item) => !item.ref.current?.disabled);
155
+ const triggerIndex = triggerCollection.findIndex((item) => item.ref.current === target);
156
+ const triggerCount = triggerCollection.length;
157
+ if (triggerIndex === -1) return;
158
+ event.preventDefault();
159
+ let nextIndex = triggerIndex;
160
+ const homeIndex = 0;
161
+ const endIndex = triggerCount - 1;
162
+ const moveNext = () => {
163
+ nextIndex = triggerIndex + 1;
164
+ if (nextIndex > endIndex) {
165
+ nextIndex = homeIndex;
166
+ }
167
+ };
168
+ const movePrev = () => {
169
+ nextIndex = triggerIndex - 1;
170
+ if (nextIndex < homeIndex) {
171
+ nextIndex = endIndex;
172
+ }
173
+ };
174
+ switch (event.key) {
175
+ case "Home":
176
+ nextIndex = homeIndex;
177
+ break;
178
+ case "End":
179
+ nextIndex = endIndex;
180
+ break;
181
+ case "ArrowRight":
182
+ if (orientation === "horizontal") {
183
+ if (isDirectionLTR) {
184
+ moveNext();
185
+ } else {
186
+ movePrev();
187
+ }
188
+ }
189
+ break;
190
+ case "ArrowDown":
191
+ if (orientation === "vertical") {
192
+ moveNext();
193
+ }
194
+ break;
195
+ case "ArrowLeft":
196
+ if (orientation === "horizontal") {
197
+ if (isDirectionLTR) {
198
+ movePrev();
199
+ } else {
200
+ moveNext();
201
+ }
202
+ }
203
+ break;
204
+ case "ArrowUp":
205
+ if (orientation === "vertical") {
206
+ movePrev();
207
+ }
208
+ break;
209
+ }
210
+ const clampedIndex = nextIndex % triggerCount;
211
+ triggerCollection[clampedIndex].ref.current?.focus();
212
+ });
213
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
214
+ AccordionImplProvider,
215
+ {
216
+ scope: __scopeAccordion,
217
+ disabled,
218
+ direction: dir,
219
+ orientation,
220
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Collection.Slot, { scope: __scopeAccordion, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
221
+ import_react_primitive.Primitive.div,
222
+ {
223
+ ...accordionProps,
224
+ "data-orientation": orientation,
225
+ ref: composedRefs,
226
+ onKeyDown: disabled ? void 0 : handleKeyDown
227
+ }
228
+ ) })
229
+ }
230
+ );
231
+ }
232
+ );
233
+ var ITEM_NAME = "AccordionItem";
234
+ var [AccordionItemProvider, useAccordionItemContext] = createAccordionContext(ITEM_NAME);
235
+ var AccordionItem = import_react.default.forwardRef(
236
+ (props, forwardedRef) => {
237
+ const { __scopeAccordion, value, ...accordionItemProps } = props;
238
+ const accordionContext = useAccordionContext(ITEM_NAME, __scopeAccordion);
239
+ const valueContext = useAccordionValueContext(ITEM_NAME, __scopeAccordion);
240
+ const collapsibleScope = useCollapsibleScope(__scopeAccordion);
241
+ const triggerId = (0, import_react_id.useId)();
242
+ const open = value && valueContext.value.includes(value) || false;
243
+ const disabled = accordionContext.disabled || props.disabled;
244
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
245
+ AccordionItemProvider,
246
+ {
247
+ scope: __scopeAccordion,
248
+ open,
249
+ disabled,
250
+ triggerId,
251
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
252
+ CollapsiblePrimitive.Root,
253
+ {
254
+ "data-orientation": accordionContext.orientation,
255
+ "data-state": getState(open),
256
+ ...collapsibleScope,
257
+ ...accordionItemProps,
258
+ ref: forwardedRef,
259
+ disabled,
260
+ open,
261
+ onOpenChange: (open2) => {
262
+ if (open2) {
263
+ valueContext.onItemOpen(value);
264
+ } else {
265
+ valueContext.onItemClose(value);
266
+ }
267
+ }
268
+ }
269
+ )
270
+ }
271
+ );
272
+ }
273
+ );
274
+ AccordionItem.displayName = ITEM_NAME;
275
+ var HEADER_NAME = "AccordionHeader";
276
+ var AccordionHeader = import_react.default.forwardRef(
277
+ (props, forwardedRef) => {
278
+ const { __scopeAccordion, ...headerProps } = props;
279
+ const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);
280
+ const itemContext = useAccordionItemContext(HEADER_NAME, __scopeAccordion);
281
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
282
+ import_react_primitive.Primitive.h3,
283
+ {
284
+ "data-orientation": accordionContext.orientation,
285
+ "data-state": getState(itemContext.open),
286
+ "data-disabled": itemContext.disabled ? "" : void 0,
287
+ ...headerProps,
288
+ ref: forwardedRef
289
+ }
290
+ );
291
+ }
292
+ );
293
+ AccordionHeader.displayName = HEADER_NAME;
294
+ var TRIGGER_NAME = "AccordionTrigger";
295
+ var AccordionTrigger = import_react.default.forwardRef(
296
+ (props, forwardedRef) => {
297
+ const { __scopeAccordion, ...triggerProps } = props;
298
+ const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);
299
+ const itemContext = useAccordionItemContext(TRIGGER_NAME, __scopeAccordion);
300
+ const collapsibleContext = useAccordionCollapsibleContext(TRIGGER_NAME, __scopeAccordion);
301
+ const collapsibleScope = useCollapsibleScope(__scopeAccordion);
302
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Collection.ItemSlot, { scope: __scopeAccordion, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
303
+ CollapsiblePrimitive.Trigger,
304
+ {
305
+ "aria-disabled": itemContext.open && !collapsibleContext.collapsible || void 0,
306
+ "data-orientation": accordionContext.orientation,
307
+ id: itemContext.triggerId,
308
+ ...collapsibleScope,
309
+ ...triggerProps,
310
+ ref: forwardedRef
311
+ }
312
+ ) });
313
+ }
314
+ );
315
+ AccordionTrigger.displayName = TRIGGER_NAME;
316
+ var CONTENT_NAME = "AccordionContent";
317
+ var AccordionContent = import_react.default.forwardRef(
318
+ (props, forwardedRef) => {
319
+ const { __scopeAccordion, ...contentProps } = props;
320
+ const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);
321
+ const itemContext = useAccordionItemContext(CONTENT_NAME, __scopeAccordion);
322
+ const collapsibleScope = useCollapsibleScope(__scopeAccordion);
323
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
324
+ CollapsiblePrimitive.Content,
325
+ {
326
+ role: "region",
327
+ "aria-labelledby": itemContext.triggerId,
328
+ "data-orientation": accordionContext.orientation,
329
+ ...collapsibleScope,
330
+ ...contentProps,
331
+ ref: forwardedRef,
332
+ style: {
333
+ ["--radix-accordion-content-height"]: "var(--radix-collapsible-content-height)",
334
+ ["--radix-accordion-content-width"]: "var(--radix-collapsible-content-width)",
335
+ ...props.style
336
+ }
337
+ }
338
+ );
339
+ }
340
+ );
341
+ AccordionContent.displayName = CONTENT_NAME;
342
+ function getState(open) {
343
+ return open ? "open" : "closed";
344
+ }
345
+ var Root2 = Accordion;
346
+ var Item = AccordionItem;
347
+ var Header = AccordionHeader;
348
+ var Trigger2 = AccordionTrigger;
349
+ var Content2 = AccordionContent;
350
+ //# sourceMappingURL=index.js.map
package/dist/index.js.map ADDED
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../src/index.ts", "../src/Accordion.tsx"],
4
+ "sourcesContent": ["'use client';\nexport {\n createAccordionScope,\n //\n Accordion,\n AccordionItem,\n AccordionHeader,\n AccordionTrigger,\n AccordionContent,\n //\n Root,\n Item,\n Header,\n Trigger,\n Content,\n} from './Accordion';\nexport type {\n AccordionSingleProps,\n AccordionMultipleProps,\n AccordionItemProps,\n AccordionHeaderProps,\n AccordionTriggerProps,\n AccordionContentProps,\n} from './Accordion';\n", "import React from 'react';\nimport { createContextScope } from '@radix-ui/react-context';\nimport { createCollection } from '@radix-ui/react-collection';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport * as CollapsiblePrimitive from '@radix-ui/react-collapsible';\nimport { createCollapsibleScope } from '@radix-ui/react-collapsible';\nimport { useId } from '@radix-ui/react-id';\n\nimport type { Scope } from '@radix-ui/react-context';\nimport { useDirection } from '@radix-ui/react-direction';\n\ntype Direction = 'ltr' | 'rtl';\n\n/* -------------------------------------------------------------------------------------------------\n * Accordion\n * -----------------------------------------------------------------------------------------------*/\n\nconst ACCORDION_NAME = 'Accordion';\nconst ACCORDION_KEYS = ['Home', 'End', 'ArrowDown', 'ArrowUp', 'ArrowLeft', 'ArrowRight'];\n\nconst [Collection, useCollection, createCollectionScope] =\n createCollection<AccordionTriggerElement>(ACCORDION_NAME);\n\ntype ScopedProps<P> = P & { __scopeAccordion?: Scope };\nconst [createAccordionContext, createAccordionScope] = createContextScope(ACCORDION_NAME, [\n createCollectionScope,\n createCollapsibleScope,\n]);\nconst useCollapsibleScope = createCollapsibleScope();\n\ntype AccordionElement = AccordionImplMultipleElement | AccordionImplSingleElement;\ninterface AccordionSingleProps extends AccordionImplSingleProps {\n type: 'single';\n}\ninterface AccordionMultipleProps extends AccordionImplMultipleProps {\n type: 'multiple';\n}\n\nconst Accordion = React.forwardRef<AccordionElement, AccordionSingleProps | AccordionMultipleProps>(\n (props: ScopedProps<AccordionSingleProps | AccordionMultipleProps>, forwardedRef) => {\n const { type, ...accordionProps } = props;\n const singleProps = accordionProps as AccordionImplSingleProps;\n const multipleProps = accordionProps as AccordionImplMultipleProps;\n return (\n <Collection.Provider scope={props.__scopeAccordion}>\n {type === 'multiple' ? (\n <AccordionImplMultiple {...multipleProps} ref={forwardedRef} />\n ) : (\n <AccordionImplSingle {...singleProps} ref={forwardedRef} />\n )}\n </Collection.Provider>\n );\n }\n);\n\nAccordion.displayName = ACCORDION_NAME;\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype AccordionValueContextValue = {\n value: string[];\n onItemOpen(value: string): void;\n onItemClose(value: string): void;\n};\n\nconst [AccordionValueProvider, useAccordionValueContext] =\n createAccordionContext<AccordionValueContextValue>(ACCORDION_NAME);\n\nconst [AccordionCollapsibleProvider, useAccordionCollapsibleContext] = createAccordionContext(\n ACCORDION_NAME,\n { collapsible: false }\n);\n\ntype AccordionImplSingleElement = AccordionImplElement;\ninterface AccordionImplSingleProps extends AccordionImplProps {\n /**\n * The controlled stateful value of the accordion item whose content is expanded.\n */\n value?: string;\n /**\n * The value of the item whose content is expanded when the accordion is initially rendered. Use\n * `defaultValue` if you do not need to control the state of an accordion.\n */\n defaultValue?: string;\n /**\n * The callback that fires when the state of the accordion changes.\n */\n onValueChange?(value: string): void;\n /**\n * Whether an accordion item can be collapsed after it has been opened.\n * @default false\n */\n collapsible?: boolean;\n}\n\nconst AccordionImplSingle = React.forwardRef<AccordionImplSingleElement, AccordionImplSingleProps>(\n (props: ScopedProps<AccordionImplSingleProps>, forwardedRef) => {\n const {\n value: valueProp,\n defaultValue,\n onValueChange = () => {},\n collapsible = false,\n ...accordionSingleProps\n } = props;\n\n const [value, setValue] = useControllableState({\n prop: valueProp,\n defaultProp: defaultValue,\n onChange: onValueChange,\n });\n\n return (\n <AccordionValueProvider\n scope={props.__scopeAccordion}\n value={value ? [value] : []}\n onItemOpen={setValue}\n onItemClose={React.useCallback(() => collapsible && setValue(''), [collapsible, setValue])}\n >\n <AccordionCollapsibleProvider scope={props.__scopeAccordion} collapsible={collapsible}>\n <AccordionImpl {...accordionSingleProps} ref={forwardedRef} />\n </AccordionCollapsibleProvider>\n </AccordionValueProvider>\n );\n }\n);\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype AccordionImplMultipleElement = AccordionImplElement;\ninterface AccordionImplMultipleProps extends AccordionImplProps {\n /**\n * The controlled stateful value of the accordion items whose contents are expanded.\n */\n value?: string[];\n /**\n * The value of the items whose contents are expanded when the accordion is initially rendered. Use\n * `defaultValue` if you do not need to control the state of an accordion.\n */\n defaultValue?: string[];\n /**\n * The callback that fires when the state of the accordion changes.\n */\n onValueChange?(value: string[]): void;\n}\n\nconst AccordionImplMultiple = React.forwardRef<\n AccordionImplMultipleElement,\n AccordionImplMultipleProps\n>((props: ScopedProps<AccordionImplMultipleProps>, forwardedRef) => {\n const {\n value: valueProp,\n defaultValue,\n onValueChange = () => {},\n ...accordionMultipleProps\n } = props;\n\n const [value = [], setValue] = useControllableState({\n prop: valueProp,\n defaultProp: defaultValue,\n onChange: onValueChange,\n });\n\n const handleItemOpen = React.useCallback(\n (itemValue: string) => setValue((prevValue = []) => [...prevValue, itemValue]),\n [setValue]\n );\n\n const handleItemClose = React.useCallback(\n (itemValue: string) =>\n setValue((prevValue = []) => prevValue.filter((value) => value !== itemValue)),\n [setValue]\n );\n\n return (\n <AccordionValueProvider\n scope={props.__scopeAccordion}\n value={value}\n onItemOpen={handleItemOpen}\n onItemClose={handleItemClose}\n >\n <AccordionCollapsibleProvider scope={props.__scopeAccordion} collapsible={true}>\n <AccordionImpl {...accordionMultipleProps} ref={forwardedRef} />\n </AccordionCollapsibleProvider>\n </AccordionValueProvider>\n );\n});\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype AccordionImplContextValue = {\n disabled?: boolean;\n direction: AccordionImplProps['dir'];\n orientation: AccordionImplProps['orientation'];\n};\n\nconst [AccordionImplProvider, useAccordionContext] =\n createAccordionContext<AccordionImplContextValue>(ACCORDION_NAME);\n\ntype AccordionImplElement = React.ElementRef<typeof Primitive.div>;\ntype PrimitiveDivProps = React.ComponentPropsWithoutRef<typeof Primitive.div>;\ninterface AccordionImplProps extends PrimitiveDivProps {\n /**\n * Whether or not an accordion is disabled from user interaction.\n *\n * @defaultValue false\n */\n disabled?: boolean;\n /**\n * The layout in which the Accordion operates.\n * @default vertical\n */\n orientation?: React.AriaAttributes['aria-orientation'];\n /**\n * The language read direction.\n */\n dir?: Direction;\n}\n\nconst AccordionImpl = React.forwardRef<AccordionImplElement, AccordionImplProps>(\n (props: ScopedProps<AccordionImplProps>, forwardedRef) => {\n const { __scopeAccordion, disabled, dir, orientation = 'vertical', ...accordionProps } = props;\n const accordionRef = React.useRef<AccordionImplElement>(null);\n const composedRefs = useComposedRefs(accordionRef, forwardedRef);\n const getItems = useCollection(__scopeAccordion);\n const direction = useDirection(dir);\n const isDirectionLTR = direction === 'ltr';\n\n const handleKeyDown = composeEventHandlers(props.onKeyDown, (event) => {\n if (!ACCORDION_KEYS.includes(event.key)) return;\n const target = event.target as HTMLElement;\n const triggerCollection = getItems().filter((item) => !item.ref.current?.disabled);\n const triggerIndex = triggerCollection.findIndex((item) => item.ref.current === target);\n const triggerCount = triggerCollection.length;\n\n if (triggerIndex === -1) return;\n\n // Prevents page scroll while user is navigating\n event.preventDefault();\n\n let nextIndex = triggerIndex;\n const homeIndex = 0;\n const endIndex = triggerCount - 1;\n\n const moveNext = () => {\n nextIndex = triggerIndex + 1;\n if (nextIndex > endIndex) {\n nextIndex = homeIndex;\n }\n };\n\n const movePrev = () => {\n nextIndex = triggerIndex - 1;\n if (nextIndex < homeIndex) {\n nextIndex = endIndex;\n }\n };\n\n switch (event.key) {\n case 'Home':\n nextIndex = homeIndex;\n break;\n case 'End':\n nextIndex = endIndex;\n break;\n case 'ArrowRight':\n if (orientation === 'horizontal') {\n if (isDirectionLTR) {\n moveNext();\n } else {\n movePrev();\n }\n }\n break;\n case 'ArrowDown':\n if (orientation === 'vertical') {\n moveNext();\n }\n break;\n case 'ArrowLeft':\n if (orientation === 'horizontal') {\n if (isDirectionLTR) {\n movePrev();\n } else {\n moveNext();\n }\n }\n break;\n case 'ArrowUp':\n if (orientation === 'vertical') {\n movePrev();\n }\n break;\n }\n\n const clampedIndex = nextIndex % triggerCount;\n triggerCollection[clampedIndex].ref.current?.focus();\n });\n\n return (\n <AccordionImplProvider\n scope={__scopeAccordion}\n disabled={disabled}\n direction={dir}\n orientation={orientation}\n >\n <Collection.Slot scope={__scopeAccordion}>\n <Primitive.div\n {...accordionProps}\n data-orientation={orientation}\n ref={composedRefs}\n onKeyDown={disabled ? undefined : handleKeyDown}\n />\n </Collection.Slot>\n </AccordionImplProvider>\n );\n }\n);\n\n/* -------------------------------------------------------------------------------------------------\n * AccordionItem\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_NAME = 'AccordionItem';\n\ntype AccordionItemContextValue = { open?: boolean; disabled?: boolean; triggerId: string };\nconst [AccordionItemProvider, useAccordionItemContext] =\n createAccordionContext<AccordionItemContextValue>(ITEM_NAME);\n\ntype AccordionItemElement = React.ElementRef<typeof CollapsiblePrimitive.Root>;\ntype CollapsibleProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Root>;\ninterface AccordionItemProps\n extends Omit<CollapsibleProps, 'open' | 'defaultOpen' | 'onOpenChange'> {\n /**\n * Whether or not an accordion item is disabled from user interaction.\n *\n * @defaultValue false\n */\n disabled?: boolean;\n /**\n * A string value for the accordion item. All items within an accordion should use a unique value.\n */\n value: string;\n}\n\n/**\n * `AccordionItem` contains all of the parts of a collapsible section inside of an `Accordion`.\n */\nconst AccordionItem = React.forwardRef<AccordionItemElement, AccordionItemProps>(\n (props: ScopedProps<AccordionItemProps>, forwardedRef) => {\n const { __scopeAccordion, value, ...accordionItemProps } = props;\n const accordionContext = useAccordionContext(ITEM_NAME, __scopeAccordion);\n const valueContext = useAccordionValueContext(ITEM_NAME, __scopeAccordion);\n const collapsibleScope = useCollapsibleScope(__scopeAccordion);\n const triggerId = useId();\n const open = (value && valueContext.value.includes(value)) || false;\n const disabled = accordionContext.disabled || props.disabled;\n\n return (\n <AccordionItemProvider\n scope={__scopeAccordion}\n open={open}\n disabled={disabled}\n triggerId={triggerId}\n >\n <CollapsiblePrimitive.Root\n data-orientation={accordionContext.orientation}\n data-state={getState(open)}\n {...collapsibleScope}\n {...accordionItemProps}\n ref={forwardedRef}\n disabled={disabled}\n open={open}\n onOpenChange={(open) => {\n if (open) {\n valueContext.onItemOpen(value);\n } else {\n valueContext.onItemClose(value);\n }\n }}\n />\n </AccordionItemProvider>\n );\n }\n);\n\nAccordionItem.displayName = ITEM_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AccordionHeader\n * -----------------------------------------------------------------------------------------------*/\n\nconst HEADER_NAME = 'AccordionHeader';\n\ntype AccordionHeaderElement = React.ElementRef<typeof Primitive.h3>;\ntype PrimitiveHeading3Props = React.ComponentPropsWithoutRef<typeof Primitive.h3>;\ninterface AccordionHeaderProps extends PrimitiveHeading3Props {}\n\n/**\n * `AccordionHeader` contains the content for the parts of an `AccordionItem` that will be visible\n * whether or not its content is collapsed.\n */\nconst AccordionHeader = React.forwardRef<AccordionHeaderElement, AccordionHeaderProps>(\n (props: ScopedProps<AccordionHeaderProps>, forwardedRef) => {\n const { __scopeAccordion, ...headerProps } = props;\n const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);\n const itemContext = useAccordionItemContext(HEADER_NAME, __scopeAccordion);\n return (\n <Primitive.h3\n data-orientation={accordionContext.orientation}\n data-state={getState(itemContext.open)}\n data-disabled={itemContext.disabled ? '' : undefined}\n {...headerProps}\n ref={forwardedRef}\n />\n );\n }\n);\n\nAccordionHeader.displayName = HEADER_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AccordionTrigger\n * -----------------------------------------------------------------------------------------------*/\n\nconst TRIGGER_NAME = 'AccordionTrigger';\n\ntype AccordionTriggerElement = React.ElementRef<typeof CollapsiblePrimitive.Trigger>;\ntype CollapsibleTriggerProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Trigger>;\ninterface AccordionTriggerProps extends CollapsibleTriggerProps {}\n\n/**\n * `AccordionTrigger` is the trigger that toggles the collapsed state of an `AccordionItem`. It\n * should always be nested inside of an `AccordionHeader`.\n */\nconst AccordionTrigger = React.forwardRef<AccordionTriggerElement, AccordionTriggerProps>(\n (props: ScopedProps<AccordionTriggerProps>, forwardedRef) => {\n const { __scopeAccordion, ...triggerProps } = props;\n const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);\n const itemContext = useAccordionItemContext(TRIGGER_NAME, __scopeAccordion);\n const collapsibleContext = useAccordionCollapsibleContext(TRIGGER_NAME, __scopeAccordion);\n const collapsibleScope = useCollapsibleScope(__scopeAccordion);\n return (\n <Collection.ItemSlot scope={__scopeAccordion}>\n <CollapsiblePrimitive.Trigger\n aria-disabled={(itemContext.open && !collapsibleContext.collapsible) || undefined}\n data-orientation={accordionContext.orientation}\n id={itemContext.triggerId}\n {...collapsibleScope}\n {...triggerProps}\n ref={forwardedRef}\n />\n </Collection.ItemSlot>\n );\n }\n);\n\nAccordionTrigger.displayName = TRIGGER_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AccordionContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'AccordionContent';\n\ntype AccordionContentElement = React.ElementRef<typeof CollapsiblePrimitive.Content>;\ntype CollapsibleContentProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Content>;\ninterface AccordionContentProps extends CollapsibleContentProps {}\n\n/**\n * `AccordionContent` contains the collapsible content for an `AccordionItem`.\n */\nconst AccordionContent = React.forwardRef<AccordionContentElement, AccordionContentProps>(\n (props: ScopedProps<AccordionContentProps>, forwardedRef) => {\n const { __scopeAccordion, ...contentProps } = props;\n const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);\n const itemContext = useAccordionItemContext(CONTENT_NAME, __scopeAccordion);\n const collapsibleScope = useCollapsibleScope(__scopeAccordion);\n return (\n <CollapsiblePrimitive.Content\n role=\"region\"\n aria-labelledby={itemContext.triggerId}\n data-orientation={accordionContext.orientation}\n {...collapsibleScope}\n {...contentProps}\n ref={forwardedRef}\n style={{\n ['--radix-accordion-content-height' as any]: 'var(--radix-collapsible-content-height)',\n ['--radix-accordion-content-width' as any]: 'var(--radix-collapsible-content-width)',\n ...props.style,\n }}\n />\n );\n }\n);\n\nAccordionContent.displayName = CONTENT_NAME;\n\n/* -----------------------------------------------------------------------------------------------*/\n\nfunction getState(open?: boolean) {\n return open ? 'open' : 'closed';\n}\n\nconst Root = Accordion;\nconst Item = AccordionItem;\nconst Header = AccordionHeader;\nconst Trigger = AccordionTrigger;\nconst Content = AccordionContent;\n\nexport {\n createAccordionScope,\n //\n Accordion,\n AccordionItem,\n AccordionHeader,\n AccordionTrigger,\n AccordionContent,\n //\n Root,\n Item,\n Header,\n Trigger,\n Content,\n};\nexport type {\n AccordionSingleProps,\n AccordionMultipleProps,\n AccordionItemProps,\n AccordionHeaderProps,\n AccordionTriggerProps,\n AccordionContentProps,\n};\n"],
5
+ "mappings": "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",
6
+ "names": ["Content", "Root", "Trigger", "React", "value", "open", "Root", "Trigger", "Content"]
7
+ }
package/dist/index.mjs ADDED
@@ -0,0 +1,318 @@
1
+ "use client";
2
+
3
+ // packages/react/accordion/src/Accordion.tsx
4
+ import React from "react";
5
+ import { createContextScope } from "@radix-ui/react-context";
6
+ import { createCollection } from "@radix-ui/react-collection";
7
+ import { useComposedRefs } from "@radix-ui/react-compose-refs";
8
+ import { composeEventHandlers } from "@radix-ui/primitive";
9
+ import { useControllableState } from "@radix-ui/react-use-controllable-state";
10
+ import { Primitive } from "@radix-ui/react-primitive";
11
+ import * as CollapsiblePrimitive from "@radix-ui/react-collapsible";
12
+ import { createCollapsibleScope } from "@radix-ui/react-collapsible";
13
+ import { useId } from "@radix-ui/react-id";
14
+ import { useDirection } from "@radix-ui/react-direction";
15
+ import { jsx } from "react/jsx-runtime";
16
+ var ACCORDION_NAME = "Accordion";
17
+ var ACCORDION_KEYS = ["Home", "End", "ArrowDown", "ArrowUp", "ArrowLeft", "ArrowRight"];
18
+ var [Collection, useCollection, createCollectionScope] = createCollection(ACCORDION_NAME);
19
+ var [createAccordionContext, createAccordionScope] = createContextScope(ACCORDION_NAME, [
20
+ createCollectionScope,
21
+ createCollapsibleScope
22
+ ]);
23
+ var useCollapsibleScope = createCollapsibleScope();
24
+ var Accordion = React.forwardRef(
25
+ (props, forwardedRef) => {
26
+ const { type, ...accordionProps } = props;
27
+ const singleProps = accordionProps;
28
+ const multipleProps = accordionProps;
29
+ return /* @__PURE__ */ jsx(Collection.Provider, { scope: props.__scopeAccordion, children: type === "multiple" ? /* @__PURE__ */ jsx(AccordionImplMultiple, { ...multipleProps, ref: forwardedRef }) : /* @__PURE__ */ jsx(AccordionImplSingle, { ...singleProps, ref: forwardedRef }) });
30
+ }
31
+ );
32
+ Accordion.displayName = ACCORDION_NAME;
33
+ var [AccordionValueProvider, useAccordionValueContext] = createAccordionContext(ACCORDION_NAME);
34
+ var [AccordionCollapsibleProvider, useAccordionCollapsibleContext] = createAccordionContext(
35
+ ACCORDION_NAME,
36
+ { collapsible: false }
37
+ );
38
+ var AccordionImplSingle = React.forwardRef(
39
+ (props, forwardedRef) => {
40
+ const {
41
+ value: valueProp,
42
+ defaultValue,
43
+ onValueChange = () => {
44
+ },
45
+ collapsible = false,
46
+ ...accordionSingleProps
47
+ } = props;
48
+ const [value, setValue] = useControllableState({
49
+ prop: valueProp,
50
+ defaultProp: defaultValue,
51
+ onChange: onValueChange
52
+ });
53
+ return /* @__PURE__ */ jsx(
54
+ AccordionValueProvider,
55
+ {
56
+ scope: props.__scopeAccordion,
57
+ value: value ? [value] : [],
58
+ onItemOpen: setValue,
59
+ onItemClose: React.useCallback(() => collapsible && setValue(""), [collapsible, setValue]),
60
+ children: /* @__PURE__ */ jsx(AccordionCollapsibleProvider, { scope: props.__scopeAccordion, collapsible, children: /* @__PURE__ */ jsx(AccordionImpl, { ...accordionSingleProps, ref: forwardedRef }) })
61
+ }
62
+ );
63
+ }
64
+ );
65
+ var AccordionImplMultiple = React.forwardRef((props, forwardedRef) => {
66
+ const {
67
+ value: valueProp,
68
+ defaultValue,
69
+ onValueChange = () => {
70
+ },
71
+ ...accordionMultipleProps
72
+ } = props;
73
+ const [value = [], setValue] = useControllableState({
74
+ prop: valueProp,
75
+ defaultProp: defaultValue,
76
+ onChange: onValueChange
77
+ });
78
+ const handleItemOpen = React.useCallback(
79
+ (itemValue) => setValue((prevValue = []) => [...prevValue, itemValue]),
80
+ [setValue]
81
+ );
82
+ const handleItemClose = React.useCallback(
83
+ (itemValue) => setValue((prevValue = []) => prevValue.filter((value2) => value2 !== itemValue)),
84
+ [setValue]
85
+ );
86
+ return /* @__PURE__ */ jsx(
87
+ AccordionValueProvider,
88
+ {
89
+ scope: props.__scopeAccordion,
90
+ value,
91
+ onItemOpen: handleItemOpen,
92
+ onItemClose: handleItemClose,
93
+ children: /* @__PURE__ */ jsx(AccordionCollapsibleProvider, { scope: props.__scopeAccordion, collapsible: true, children: /* @__PURE__ */ jsx(AccordionImpl, { ...accordionMultipleProps, ref: forwardedRef }) })
94
+ }
95
+ );
96
+ });
97
+ var [AccordionImplProvider, useAccordionContext] = createAccordionContext(ACCORDION_NAME);
98
+ var AccordionImpl = React.forwardRef(
99
+ (props, forwardedRef) => {
100
+ const { __scopeAccordion, disabled, dir, orientation = "vertical", ...accordionProps } = props;
101
+ const accordionRef = React.useRef(null);
102
+ const composedRefs = useComposedRefs(accordionRef, forwardedRef);
103
+ const getItems = useCollection(__scopeAccordion);
104
+ const direction = useDirection(dir);
105
+ const isDirectionLTR = direction === "ltr";
106
+ const handleKeyDown = composeEventHandlers(props.onKeyDown, (event) => {
107
+ if (!ACCORDION_KEYS.includes(event.key)) return;
108
+ const target = event.target;
109
+ const triggerCollection = getItems().filter((item) => !item.ref.current?.disabled);
110
+ const triggerIndex = triggerCollection.findIndex((item) => item.ref.current === target);
111
+ const triggerCount = triggerCollection.length;
112
+ if (triggerIndex === -1) return;
113
+ event.preventDefault();
114
+ let nextIndex = triggerIndex;
115
+ const homeIndex = 0;
116
+ const endIndex = triggerCount - 1;
117
+ const moveNext = () => {
118
+ nextIndex = triggerIndex + 1;
119
+ if (nextIndex > endIndex) {
120
+ nextIndex = homeIndex;
121
+ }
122
+ };
123
+ const movePrev = () => {
124
+ nextIndex = triggerIndex - 1;
125
+ if (nextIndex < homeIndex) {
126
+ nextIndex = endIndex;
127
+ }
128
+ };
129
+ switch (event.key) {
130
+ case "Home":
131
+ nextIndex = homeIndex;
132
+ break;
133
+ case "End":
134
+ nextIndex = endIndex;
135
+ break;
136
+ case "ArrowRight":
137
+ if (orientation === "horizontal") {
138
+ if (isDirectionLTR) {
139
+ moveNext();
140
+ } else {
141
+ movePrev();
142
+ }
143
+ }
144
+ break;
145
+ case "ArrowDown":
146
+ if (orientation === "vertical") {
147
+ moveNext();
148
+ }
149
+ break;
150
+ case "ArrowLeft":
151
+ if (orientation === "horizontal") {
152
+ if (isDirectionLTR) {
153
+ movePrev();
154
+ } else {
155
+ moveNext();
156
+ }
157
+ }
158
+ break;
159
+ case "ArrowUp":
160
+ if (orientation === "vertical") {
161
+ movePrev();
162
+ }
163
+ break;
164
+ }
165
+ const clampedIndex = nextIndex % triggerCount;
166
+ triggerCollection[clampedIndex].ref.current?.focus();
167
+ });
168
+ return /* @__PURE__ */ jsx(
169
+ AccordionImplProvider,
170
+ {
171
+ scope: __scopeAccordion,
172
+ disabled,
173
+ direction: dir,
174
+ orientation,
175
+ children: /* @__PURE__ */ jsx(Collection.Slot, { scope: __scopeAccordion, children: /* @__PURE__ */ jsx(
176
+ Primitive.div,
177
+ {
178
+ ...accordionProps,
179
+ "data-orientation": orientation,
180
+ ref: composedRefs,
181
+ onKeyDown: disabled ? void 0 : handleKeyDown
182
+ }
183
+ ) })
184
+ }
185
+ );
186
+ }
187
+ );
188
+ var ITEM_NAME = "AccordionItem";
189
+ var [AccordionItemProvider, useAccordionItemContext] = createAccordionContext(ITEM_NAME);
190
+ var AccordionItem = React.forwardRef(
191
+ (props, forwardedRef) => {
192
+ const { __scopeAccordion, value, ...accordionItemProps } = props;
193
+ const accordionContext = useAccordionContext(ITEM_NAME, __scopeAccordion);
194
+ const valueContext = useAccordionValueContext(ITEM_NAME, __scopeAccordion);
195
+ const collapsibleScope = useCollapsibleScope(__scopeAccordion);
196
+ const triggerId = useId();
197
+ const open = value && valueContext.value.includes(value) || false;
198
+ const disabled = accordionContext.disabled || props.disabled;
199
+ return /* @__PURE__ */ jsx(
200
+ AccordionItemProvider,
201
+ {
202
+ scope: __scopeAccordion,
203
+ open,
204
+ disabled,
205
+ triggerId,
206
+ children: /* @__PURE__ */ jsx(
207
+ CollapsiblePrimitive.Root,
208
+ {
209
+ "data-orientation": accordionContext.orientation,
210
+ "data-state": getState(open),
211
+ ...collapsibleScope,
212
+ ...accordionItemProps,
213
+ ref: forwardedRef,
214
+ disabled,
215
+ open,
216
+ onOpenChange: (open2) => {
217
+ if (open2) {
218
+ valueContext.onItemOpen(value);
219
+ } else {
220
+ valueContext.onItemClose(value);
221
+ }
222
+ }
223
+ }
224
+ )
225
+ }
226
+ );
227
+ }
228
+ );
229
+ AccordionItem.displayName = ITEM_NAME;
230
+ var HEADER_NAME = "AccordionHeader";
231
+ var AccordionHeader = React.forwardRef(
232
+ (props, forwardedRef) => {
233
+ const { __scopeAccordion, ...headerProps } = props;
234
+ const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);
235
+ const itemContext = useAccordionItemContext(HEADER_NAME, __scopeAccordion);
236
+ return /* @__PURE__ */ jsx(
237
+ Primitive.h3,
238
+ {
239
+ "data-orientation": accordionContext.orientation,
240
+ "data-state": getState(itemContext.open),
241
+ "data-disabled": itemContext.disabled ? "" : void 0,
242
+ ...headerProps,
243
+ ref: forwardedRef
244
+ }
245
+ );
246
+ }
247
+ );
248
+ AccordionHeader.displayName = HEADER_NAME;
249
+ var TRIGGER_NAME = "AccordionTrigger";
250
+ var AccordionTrigger = React.forwardRef(
251
+ (props, forwardedRef) => {
252
+ const { __scopeAccordion, ...triggerProps } = props;
253
+ const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);
254
+ const itemContext = useAccordionItemContext(TRIGGER_NAME, __scopeAccordion);
255
+ const collapsibleContext = useAccordionCollapsibleContext(TRIGGER_NAME, __scopeAccordion);
256
+ const collapsibleScope = useCollapsibleScope(__scopeAccordion);
257
+ return /* @__PURE__ */ jsx(Collection.ItemSlot, { scope: __scopeAccordion, children: /* @__PURE__ */ jsx(
258
+ CollapsiblePrimitive.Trigger,
259
+ {
260
+ "aria-disabled": itemContext.open && !collapsibleContext.collapsible || void 0,
261
+ "data-orientation": accordionContext.orientation,
262
+ id: itemContext.triggerId,
263
+ ...collapsibleScope,
264
+ ...triggerProps,
265
+ ref: forwardedRef
266
+ }
267
+ ) });
268
+ }
269
+ );
270
+ AccordionTrigger.displayName = TRIGGER_NAME;
271
+ var CONTENT_NAME = "AccordionContent";
272
+ var AccordionContent = React.forwardRef(
273
+ (props, forwardedRef) => {
274
+ const { __scopeAccordion, ...contentProps } = props;
275
+ const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);
276
+ const itemContext = useAccordionItemContext(CONTENT_NAME, __scopeAccordion);
277
+ const collapsibleScope = useCollapsibleScope(__scopeAccordion);
278
+ return /* @__PURE__ */ jsx(
279
+ CollapsiblePrimitive.Content,
280
+ {
281
+ role: "region",
282
+ "aria-labelledby": itemContext.triggerId,
283
+ "data-orientation": accordionContext.orientation,
284
+ ...collapsibleScope,
285
+ ...contentProps,
286
+ ref: forwardedRef,
287
+ style: {
288
+ ["--radix-accordion-content-height"]: "var(--radix-collapsible-content-height)",
289
+ ["--radix-accordion-content-width"]: "var(--radix-collapsible-content-width)",
290
+ ...props.style
291
+ }
292
+ }
293
+ );
294
+ }
295
+ );
296
+ AccordionContent.displayName = CONTENT_NAME;
297
+ function getState(open) {
298
+ return open ? "open" : "closed";
299
+ }
300
+ var Root2 = Accordion;
301
+ var Item = AccordionItem;
302
+ var Header = AccordionHeader;
303
+ var Trigger2 = AccordionTrigger;
304
+ var Content2 = AccordionContent;
305
+ export {
306
+ Accordion,
307
+ AccordionContent,
308
+ AccordionHeader,
309
+ AccordionItem,
310
+ AccordionTrigger,
311
+ Content2 as Content,
312
+ Header,
313
+ Item,
314
+ Root2 as Root,
315
+ Trigger2 as Trigger,
316
+ createAccordionScope
317
+ };
318
+ //# sourceMappingURL=index.mjs.map
package/dist/index.mjs.map ADDED
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../src/Accordion.tsx"],
4
+ "sourcesContent": ["import React from 'react';\nimport { createContextScope } from '@radix-ui/react-context';\nimport { createCollection } from '@radix-ui/react-collection';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport * as CollapsiblePrimitive from '@radix-ui/react-collapsible';\nimport { createCollapsibleScope } from '@radix-ui/react-collapsible';\nimport { useId } from '@radix-ui/react-id';\n\nimport type { Scope } from '@radix-ui/react-context';\nimport { useDirection } from '@radix-ui/react-direction';\n\ntype Direction = 'ltr' | 'rtl';\n\n/* -------------------------------------------------------------------------------------------------\n * Accordion\n * -----------------------------------------------------------------------------------------------*/\n\nconst ACCORDION_NAME = 'Accordion';\nconst ACCORDION_KEYS = ['Home', 'End', 'ArrowDown', 'ArrowUp', 'ArrowLeft', 'ArrowRight'];\n\nconst [Collection, useCollection, createCollectionScope] =\n createCollection<AccordionTriggerElement>(ACCORDION_NAME);\n\ntype ScopedProps<P> = P & { __scopeAccordion?: Scope };\nconst [createAccordionContext, createAccordionScope] = createContextScope(ACCORDION_NAME, [\n createCollectionScope,\n createCollapsibleScope,\n]);\nconst useCollapsibleScope = createCollapsibleScope();\n\ntype AccordionElement = AccordionImplMultipleElement | AccordionImplSingleElement;\ninterface AccordionSingleProps extends AccordionImplSingleProps {\n type: 'single';\n}\ninterface AccordionMultipleProps extends AccordionImplMultipleProps {\n type: 'multiple';\n}\n\nconst Accordion = React.forwardRef<AccordionElement, AccordionSingleProps | AccordionMultipleProps>(\n (props: ScopedProps<AccordionSingleProps | AccordionMultipleProps>, forwardedRef) => {\n const { type, ...accordionProps } = props;\n const singleProps = accordionProps as AccordionImplSingleProps;\n const multipleProps = accordionProps as AccordionImplMultipleProps;\n return (\n <Collection.Provider scope={props.__scopeAccordion}>\n {type === 'multiple' ? (\n <AccordionImplMultiple {...multipleProps} ref={forwardedRef} />\n ) : (\n <AccordionImplSingle {...singleProps} ref={forwardedRef} />\n )}\n </Collection.Provider>\n );\n }\n);\n\nAccordion.displayName = ACCORDION_NAME;\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype AccordionValueContextValue = {\n value: string[];\n onItemOpen(value: string): void;\n onItemClose(value: string): void;\n};\n\nconst [AccordionValueProvider, useAccordionValueContext] =\n createAccordionContext<AccordionValueContextValue>(ACCORDION_NAME);\n\nconst [AccordionCollapsibleProvider, useAccordionCollapsibleContext] = createAccordionContext(\n ACCORDION_NAME,\n { collapsible: false }\n);\n\ntype AccordionImplSingleElement = AccordionImplElement;\ninterface AccordionImplSingleProps extends AccordionImplProps {\n /**\n * The controlled stateful value of the accordion item whose content is expanded.\n */\n value?: string;\n /**\n * The value of the item whose content is expanded when the accordion is initially rendered. Use\n * `defaultValue` if you do not need to control the state of an accordion.\n */\n defaultValue?: string;\n /**\n * The callback that fires when the state of the accordion changes.\n */\n onValueChange?(value: string): void;\n /**\n * Whether an accordion item can be collapsed after it has been opened.\n * @default false\n */\n collapsible?: boolean;\n}\n\nconst AccordionImplSingle = React.forwardRef<AccordionImplSingleElement, AccordionImplSingleProps>(\n (props: ScopedProps<AccordionImplSingleProps>, forwardedRef) => {\n const {\n value: valueProp,\n defaultValue,\n onValueChange = () => {},\n collapsible = false,\n ...accordionSingleProps\n } = props;\n\n const [value, setValue] = useControllableState({\n prop: valueProp,\n defaultProp: defaultValue,\n onChange: onValueChange,\n });\n\n return (\n <AccordionValueProvider\n scope={props.__scopeAccordion}\n value={value ? [value] : []}\n onItemOpen={setValue}\n onItemClose={React.useCallback(() => collapsible && setValue(''), [collapsible, setValue])}\n >\n <AccordionCollapsibleProvider scope={props.__scopeAccordion} collapsible={collapsible}>\n <AccordionImpl {...accordionSingleProps} ref={forwardedRef} />\n </AccordionCollapsibleProvider>\n </AccordionValueProvider>\n );\n }\n);\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype AccordionImplMultipleElement = AccordionImplElement;\ninterface AccordionImplMultipleProps extends AccordionImplProps {\n /**\n * The controlled stateful value of the accordion items whose contents are expanded.\n */\n value?: string[];\n /**\n * The value of the items whose contents are expanded when the accordion is initially rendered. Use\n * `defaultValue` if you do not need to control the state of an accordion.\n */\n defaultValue?: string[];\n /**\n * The callback that fires when the state of the accordion changes.\n */\n onValueChange?(value: string[]): void;\n}\n\nconst AccordionImplMultiple = React.forwardRef<\n AccordionImplMultipleElement,\n AccordionImplMultipleProps\n>((props: ScopedProps<AccordionImplMultipleProps>, forwardedRef) => {\n const {\n value: valueProp,\n defaultValue,\n onValueChange = () => {},\n ...accordionMultipleProps\n } = props;\n\n const [value = [], setValue] = useControllableState({\n prop: valueProp,\n defaultProp: defaultValue,\n onChange: onValueChange,\n });\n\n const handleItemOpen = React.useCallback(\n (itemValue: string) => setValue((prevValue = []) => [...prevValue, itemValue]),\n [setValue]\n );\n\n const handleItemClose = React.useCallback(\n (itemValue: string) =>\n setValue((prevValue = []) => prevValue.filter((value) => value !== itemValue)),\n [setValue]\n );\n\n return (\n <AccordionValueProvider\n scope={props.__scopeAccordion}\n value={value}\n onItemOpen={handleItemOpen}\n onItemClose={handleItemClose}\n >\n <AccordionCollapsibleProvider scope={props.__scopeAccordion} collapsible={true}>\n <AccordionImpl {...accordionMultipleProps} ref={forwardedRef} />\n </AccordionCollapsibleProvider>\n </AccordionValueProvider>\n );\n});\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype AccordionImplContextValue = {\n disabled?: boolean;\n direction: AccordionImplProps['dir'];\n orientation: AccordionImplProps['orientation'];\n};\n\nconst [AccordionImplProvider, useAccordionContext] =\n createAccordionContext<AccordionImplContextValue>(ACCORDION_NAME);\n\ntype AccordionImplElement = React.ElementRef<typeof Primitive.div>;\ntype PrimitiveDivProps = React.ComponentPropsWithoutRef<typeof Primitive.div>;\ninterface AccordionImplProps extends PrimitiveDivProps {\n /**\n * Whether or not an accordion is disabled from user interaction.\n *\n * @defaultValue false\n */\n disabled?: boolean;\n /**\n * The layout in which the Accordion operates.\n * @default vertical\n */\n orientation?: React.AriaAttributes['aria-orientation'];\n /**\n * The language read direction.\n */\n dir?: Direction;\n}\n\nconst AccordionImpl = React.forwardRef<AccordionImplElement, AccordionImplProps>(\n (props: ScopedProps<AccordionImplProps>, forwardedRef) => {\n const { __scopeAccordion, disabled, dir, orientation = 'vertical', ...accordionProps } = props;\n const accordionRef = React.useRef<AccordionImplElement>(null);\n const composedRefs = useComposedRefs(accordionRef, forwardedRef);\n const getItems = useCollection(__scopeAccordion);\n const direction = useDirection(dir);\n const isDirectionLTR = direction === 'ltr';\n\n const handleKeyDown = composeEventHandlers(props.onKeyDown, (event) => {\n if (!ACCORDION_KEYS.includes(event.key)) return;\n const target = event.target as HTMLElement;\n const triggerCollection = getItems().filter((item) => !item.ref.current?.disabled);\n const triggerIndex = triggerCollection.findIndex((item) => item.ref.current === target);\n const triggerCount = triggerCollection.length;\n\n if (triggerIndex === -1) return;\n\n // Prevents page scroll while user is navigating\n event.preventDefault();\n\n let nextIndex = triggerIndex;\n const homeIndex = 0;\n const endIndex = triggerCount - 1;\n\n const moveNext = () => {\n nextIndex = triggerIndex + 1;\n if (nextIndex > endIndex) {\n nextIndex = homeIndex;\n }\n };\n\n const movePrev = () => {\n nextIndex = triggerIndex - 1;\n if (nextIndex < homeIndex) {\n nextIndex = endIndex;\n }\n };\n\n switch (event.key) {\n case 'Home':\n nextIndex = homeIndex;\n break;\n case 'End':\n nextIndex = endIndex;\n break;\n case 'ArrowRight':\n if (orientation === 'horizontal') {\n if (isDirectionLTR) {\n moveNext();\n } else {\n movePrev();\n }\n }\n break;\n case 'ArrowDown':\n if (orientation === 'vertical') {\n moveNext();\n }\n break;\n case 'ArrowLeft':\n if (orientation === 'horizontal') {\n if (isDirectionLTR) {\n movePrev();\n } else {\n moveNext();\n }\n }\n break;\n case 'ArrowUp':\n if (orientation === 'vertical') {\n movePrev();\n }\n break;\n }\n\n const clampedIndex = nextIndex % triggerCount;\n triggerCollection[clampedIndex].ref.current?.focus();\n });\n\n return (\n <AccordionImplProvider\n scope={__scopeAccordion}\n disabled={disabled}\n direction={dir}\n orientation={orientation}\n >\n <Collection.Slot scope={__scopeAccordion}>\n <Primitive.div\n {...accordionProps}\n data-orientation={orientation}\n ref={composedRefs}\n onKeyDown={disabled ? undefined : handleKeyDown}\n />\n </Collection.Slot>\n </AccordionImplProvider>\n );\n }\n);\n\n/* -------------------------------------------------------------------------------------------------\n * AccordionItem\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_NAME = 'AccordionItem';\n\ntype AccordionItemContextValue = { open?: boolean; disabled?: boolean; triggerId: string };\nconst [AccordionItemProvider, useAccordionItemContext] =\n createAccordionContext<AccordionItemContextValue>(ITEM_NAME);\n\ntype AccordionItemElement = React.ElementRef<typeof CollapsiblePrimitive.Root>;\ntype CollapsibleProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Root>;\ninterface AccordionItemProps\n extends Omit<CollapsibleProps, 'open' | 'defaultOpen' | 'onOpenChange'> {\n /**\n * Whether or not an accordion item is disabled from user interaction.\n *\n * @defaultValue false\n */\n disabled?: boolean;\n /**\n * A string value for the accordion item. All items within an accordion should use a unique value.\n */\n value: string;\n}\n\n/**\n * `AccordionItem` contains all of the parts of a collapsible section inside of an `Accordion`.\n */\nconst AccordionItem = React.forwardRef<AccordionItemElement, AccordionItemProps>(\n (props: ScopedProps<AccordionItemProps>, forwardedRef) => {\n const { __scopeAccordion, value, ...accordionItemProps } = props;\n const accordionContext = useAccordionContext(ITEM_NAME, __scopeAccordion);\n const valueContext = useAccordionValueContext(ITEM_NAME, __scopeAccordion);\n const collapsibleScope = useCollapsibleScope(__scopeAccordion);\n const triggerId = useId();\n const open = (value && valueContext.value.includes(value)) || false;\n const disabled = accordionContext.disabled || props.disabled;\n\n return (\n <AccordionItemProvider\n scope={__scopeAccordion}\n open={open}\n disabled={disabled}\n triggerId={triggerId}\n >\n <CollapsiblePrimitive.Root\n data-orientation={accordionContext.orientation}\n data-state={getState(open)}\n {...collapsibleScope}\n {...accordionItemProps}\n ref={forwardedRef}\n disabled={disabled}\n open={open}\n onOpenChange={(open) => {\n if (open) {\n valueContext.onItemOpen(value);\n } else {\n valueContext.onItemClose(value);\n }\n }}\n />\n </AccordionItemProvider>\n );\n }\n);\n\nAccordionItem.displayName = ITEM_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AccordionHeader\n * -----------------------------------------------------------------------------------------------*/\n\nconst HEADER_NAME = 'AccordionHeader';\n\ntype AccordionHeaderElement = React.ElementRef<typeof Primitive.h3>;\ntype PrimitiveHeading3Props = React.ComponentPropsWithoutRef<typeof Primitive.h3>;\ninterface AccordionHeaderProps extends PrimitiveHeading3Props {}\n\n/**\n * `AccordionHeader` contains the content for the parts of an `AccordionItem` that will be visible\n * whether or not its content is collapsed.\n */\nconst AccordionHeader = React.forwardRef<AccordionHeaderElement, AccordionHeaderProps>(\n (props: ScopedProps<AccordionHeaderProps>, forwardedRef) => {\n const { __scopeAccordion, ...headerProps } = props;\n const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);\n const itemContext = useAccordionItemContext(HEADER_NAME, __scopeAccordion);\n return (\n <Primitive.h3\n data-orientation={accordionContext.orientation}\n data-state={getState(itemContext.open)}\n data-disabled={itemContext.disabled ? '' : undefined}\n {...headerProps}\n ref={forwardedRef}\n />\n );\n }\n);\n\nAccordionHeader.displayName = HEADER_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AccordionTrigger\n * -----------------------------------------------------------------------------------------------*/\n\nconst TRIGGER_NAME = 'AccordionTrigger';\n\ntype AccordionTriggerElement = React.ElementRef<typeof CollapsiblePrimitive.Trigger>;\ntype CollapsibleTriggerProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Trigger>;\ninterface AccordionTriggerProps extends CollapsibleTriggerProps {}\n\n/**\n * `AccordionTrigger` is the trigger that toggles the collapsed state of an `AccordionItem`. It\n * should always be nested inside of an `AccordionHeader`.\n */\nconst AccordionTrigger = React.forwardRef<AccordionTriggerElement, AccordionTriggerProps>(\n (props: ScopedProps<AccordionTriggerProps>, forwardedRef) => {\n const { __scopeAccordion, ...triggerProps } = props;\n const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);\n const itemContext = useAccordionItemContext(TRIGGER_NAME, __scopeAccordion);\n const collapsibleContext = useAccordionCollapsibleContext(TRIGGER_NAME, __scopeAccordion);\n const collapsibleScope = useCollapsibleScope(__scopeAccordion);\n return (\n <Collection.ItemSlot scope={__scopeAccordion}>\n <CollapsiblePrimitive.Trigger\n aria-disabled={(itemContext.open && !collapsibleContext.collapsible) || undefined}\n data-orientation={accordionContext.orientation}\n id={itemContext.triggerId}\n {...collapsibleScope}\n {...triggerProps}\n ref={forwardedRef}\n />\n </Collection.ItemSlot>\n );\n }\n);\n\nAccordionTrigger.displayName = TRIGGER_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * AccordionContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'AccordionContent';\n\ntype AccordionContentElement = React.ElementRef<typeof CollapsiblePrimitive.Content>;\ntype CollapsibleContentProps = React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Content>;\ninterface AccordionContentProps extends CollapsibleContentProps {}\n\n/**\n * `AccordionContent` contains the collapsible content for an `AccordionItem`.\n */\nconst AccordionContent = React.forwardRef<AccordionContentElement, AccordionContentProps>(\n (props: ScopedProps<AccordionContentProps>, forwardedRef) => {\n const { __scopeAccordion, ...contentProps } = props;\n const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);\n const itemContext = useAccordionItemContext(CONTENT_NAME, __scopeAccordion);\n const collapsibleScope = useCollapsibleScope(__scopeAccordion);\n return (\n <CollapsiblePrimitive.Content\n role=\"region\"\n aria-labelledby={itemContext.triggerId}\n data-orientation={accordionContext.orientation}\n {...collapsibleScope}\n {...contentProps}\n ref={forwardedRef}\n style={{\n ['--radix-accordion-content-height' as any]: 'var(--radix-collapsible-content-height)',\n ['--radix-accordion-content-width' as any]: 'var(--radix-collapsible-content-width)',\n ...props.style,\n }}\n />\n );\n }\n);\n\nAccordionContent.displayName = CONTENT_NAME;\n\n/* -----------------------------------------------------------------------------------------------*/\n\nfunction getState(open?: boolean) {\n return open ? 'open' : 'closed';\n}\n\nconst Root = Accordion;\nconst Item = AccordionItem;\nconst Header = AccordionHeader;\nconst Trigger = AccordionTrigger;\nconst Content = AccordionContent;\n\nexport {\n createAccordionScope,\n //\n Accordion,\n AccordionItem,\n AccordionHeader,\n AccordionTrigger,\n AccordionContent,\n //\n Root,\n Item,\n Header,\n Trigger,\n Content,\n};\nexport type {\n AccordionSingleProps,\n AccordionMultipleProps,\n AccordionItemProps,\n AccordionHeaderProps,\n AccordionTriggerProps,\n AccordionContentProps,\n};\n"],
5
+ "mappings": ";;;AAAA,OAAO,WAAW;AAClB,SAAS,0BAA0B;AACnC,SAAS,wBAAwB;AACjC,SAAS,uBAAuB;AAChC,SAAS,4BAA4B;AACrC,SAAS,4BAA4B;AACrC,SAAS,iBAAiB;AAC1B,YAAY,0BAA0B;AACtC,SAAS,8BAA8B;AACvC,SAAS,aAAa;AAGtB,SAAS,oBAAoB;AAqCnB;AA7BV,IAAM,iBAAiB;AACvB,IAAM,iBAAiB,CAAC,QAAQ,OAAO,aAAa,WAAW,aAAa,YAAY;AAExF,IAAM,CAAC,YAAY,eAAe,qBAAqB,IACrD,iBAA0C,cAAc;AAG1D,IAAM,CAAC,wBAAwB,oBAAoB,IAAI,mBAAmB,gBAAgB;AAAA,EACxF;AAAA,EACA;AACF,CAAC;AACD,IAAM,sBAAsB,uBAAuB;AAUnD,IAAM,YAAY,MAAM;AAAA,EACtB,CAAC,OAAmE,iBAAiB;AACnF,UAAM,EAAE,MAAM,GAAG,eAAe,IAAI;AACpC,UAAM,cAAc;AACpB,UAAM,gBAAgB;AACtB,WACE,oBAAC,WAAW,UAAX,EAAoB,OAAO,MAAM,kBAC/B,mBAAS,aACR,oBAAC,yBAAuB,GAAG,eAAe,KAAK,cAAc,IAE7D,oBAAC,uBAAqB,GAAG,aAAa,KAAK,cAAc,GAE7D;AAAA,EAEJ;AACF;AAEA,UAAU,cAAc;AAUxB,IAAM,CAAC,wBAAwB,wBAAwB,IACrD,uBAAmD,cAAc;AAEnE,IAAM,CAAC,8BAA8B,8BAA8B,IAAI;AAAA,EACrE;AAAA,EACA,EAAE,aAAa,MAAM;AACvB;AAwBA,IAAM,sBAAsB,MAAM;AAAA,EAChC,CAAC,OAA8C,iBAAiB;AAC9D,UAAM;AAAA,MACJ,OAAO;AAAA,MACP;AAAA,MACA,gBAAgB,MAAM;AAAA,MAAC;AAAA,MACvB,cAAc;AAAA,MACd,GAAG;AAAA,IACL,IAAI;AAEJ,UAAM,CAAC,OAAO,QAAQ,IAAI,qBAAqB;AAAA,MAC7C,MAAM;AAAA,MACN,aAAa;AAAA,MACb,UAAU;AAAA,IACZ,CAAC;AAED,WACE;AAAA,MAAC;AAAA;AAAA,QACC,OAAO,MAAM;AAAA,QACb,OAAO,QAAQ,CAAC,KAAK,IAAI,CAAC;AAAA,QAC1B,YAAY;AAAA,QACZ,aAAa,MAAM,YAAY,MAAM,eAAe,SAAS,EAAE,GAAG,CAAC,aAAa,QAAQ,CAAC;AAAA,QAEzF,8BAAC,gCAA6B,OAAO,MAAM,kBAAkB,aAC3D,8BAAC,iBAAe,GAAG,sBAAsB,KAAK,cAAc,GAC9D;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAqBA,IAAM,wBAAwB,MAAM,WAGlC,CAAC,OAAgD,iBAAiB;AAClE,QAAM;AAAA,IACJ,OAAO;AAAA,IACP;AAAA,IACA,gBAAgB,MAAM;AAAA,IAAC;AAAA,IACvB,GAAG;AAAA,EACL,IAAI;AAEJ,QAAM,CAAC,QAAQ,CAAC,GAAG,QAAQ,IAAI,qBAAqB;AAAA,IAClD,MAAM;AAAA,IACN,aAAa;AAAA,IACb,UAAU;AAAA,EACZ,CAAC;AAED,QAAM,iBAAiB,MAAM;AAAA,IAC3B,CAAC,cAAsB,SAAS,CAAC,YAAY,CAAC,MAAM,CAAC,GAAG,WAAW,SAAS,CAAC;AAAA,IAC7E,CAAC,QAAQ;AAAA,EACX;AAEA,QAAM,kBAAkB,MAAM;AAAA,IAC5B,CAAC,cACC,SAAS,CAAC,YAAY,CAAC,MAAM,UAAU,OAAO,CAACA,WAAUA,WAAU,SAAS,CAAC;AAAA,IAC/E,CAAC,QAAQ;AAAA,EACX;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO,MAAM;AAAA,MACb;AAAA,MACA,YAAY;AAAA,MACZ,aAAa;AAAA,MAEb,8BAAC,gCAA6B,OAAO,MAAM,kBAAkB,aAAa,MACxE,8BAAC,iBAAe,GAAG,wBAAwB,KAAK,cAAc,GAChE;AAAA;AAAA,EACF;AAEJ,CAAC;AAUD,IAAM,CAAC,uBAAuB,mBAAmB,IAC/C,uBAAkD,cAAc;AAsBlE,IAAM,gBAAgB,MAAM;AAAA,EAC1B,CAAC,OAAwC,iBAAiB;AACxD,UAAM,EAAE,kBAAkB,UAAU,KAAK,cAAc,YAAY,GAAG,eAAe,IAAI;AACzF,UAAM,eAAe,MAAM,OAA6B,IAAI;AAC5D,UAAM,eAAe,gBAAgB,cAAc,YAAY;AAC/D,UAAM,WAAW,cAAc,gBAAgB;AAC/C,UAAM,YAAY,aAAa,GAAG;AAClC,UAAM,iBAAiB,cAAc;AAErC,UAAM,gBAAgB,qBAAqB,MAAM,WAAW,CAAC,UAAU;AACrE,UAAI,CAAC,eAAe,SAAS,MAAM,GAAG,EAAG;AACzC,YAAM,SAAS,MAAM;AACrB,YAAM,oBAAoB,SAAS,EAAE,OAAO,CAAC,SAAS,CAAC,KAAK,IAAI,SAAS,QAAQ;AACjF,YAAM,eAAe,kBAAkB,UAAU,CAAC,SAAS,KAAK,IAAI,YAAY,MAAM;AACtF,YAAM,eAAe,kBAAkB;AAEvC,UAAI,iBAAiB,GAAI;AAGzB,YAAM,eAAe;AAErB,UAAI,YAAY;AAChB,YAAM,YAAY;AAClB,YAAM,WAAW,eAAe;AAEhC,YAAM,WAAW,MAAM;AACrB,oBAAY,eAAe;AAC3B,YAAI,YAAY,UAAU;AACxB,sBAAY;AAAA,QACd;AAAA,MACF;AAEA,YAAM,WAAW,MAAM;AACrB,oBAAY,eAAe;AAC3B,YAAI,YAAY,WAAW;AACzB,sBAAY;AAAA,QACd;AAAA,MACF;AAEA,cAAQ,MAAM,KAAK;AAAA,QACjB,KAAK;AACH,sBAAY;AACZ;AAAA,QACF,KAAK;AACH,sBAAY;AACZ;AAAA,QACF,KAAK;AACH,cAAI,gBAAgB,cAAc;AAChC,gBAAI,gBAAgB;AAClB,uBAAS;AAAA,YACX,OAAO;AACL,uBAAS;AAAA,YACX;AAAA,UACF;AACA;AAAA,QACF,KAAK;AACH,cAAI,gBAAgB,YAAY;AAC9B,qBAAS;AAAA,UACX;AACA;AAAA,QACF,KAAK;AACH,cAAI,gBAAgB,cAAc;AAChC,gBAAI,gBAAgB;AAClB,uBAAS;AAAA,YACX,OAAO;AACL,uBAAS;AAAA,YACX;AAAA,UACF;AACA;AAAA,QACF,KAAK;AACH,cAAI,gBAAgB,YAAY;AAC9B,qBAAS;AAAA,UACX;AACA;AAAA,MACJ;AAEA,YAAM,eAAe,YAAY;AACjC,wBAAkB,YAAY,EAAE,IAAI,SAAS,MAAM;AAAA,IACrD,CAAC;AAED,WACE;AAAA,MAAC;AAAA;AAAA,QACC,OAAO;AAAA,QACP;AAAA,QACA,WAAW;AAAA,QACX;AAAA,QAEA,8BAAC,WAAW,MAAX,EAAgB,OAAO,kBACtB;AAAA,UAAC,UAAU;AAAA,UAAV;AAAA,YACE,GAAG;AAAA,YACJ,oBAAkB;AAAA,YAClB,KAAK;AAAA,YACL,WAAW,WAAW,SAAY;AAAA;AAAA,QACpC,GACF;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAMA,IAAM,YAAY;AAGlB,IAAM,CAAC,uBAAuB,uBAAuB,IACnD,uBAAkD,SAAS;AAqB7D,IAAM,gBAAgB,MAAM;AAAA,EAC1B,CAAC,OAAwC,iBAAiB;AACxD,UAAM,EAAE,kBAAkB,OAAO,GAAG,mBAAmB,IAAI;AAC3D,UAAM,mBAAmB,oBAAoB,WAAW,gBAAgB;AACxE,UAAM,eAAe,yBAAyB,WAAW,gBAAgB;AACzE,UAAM,mBAAmB,oBAAoB,gBAAgB;AAC7D,UAAM,YAAY,MAAM;AACxB,UAAM,OAAQ,SAAS,aAAa,MAAM,SAAS,KAAK,KAAM;AAC9D,UAAM,WAAW,iBAAiB,YAAY,MAAM;AAEpD,WACE;AAAA,MAAC;AAAA;AAAA,QACC,OAAO;AAAA,QACP;AAAA,QACA;AAAA,QACA;AAAA,QAEA;AAAA,UAAsB;AAAA,UAArB;AAAA,YACC,oBAAkB,iBAAiB;AAAA,YACnC,cAAY,SAAS,IAAI;AAAA,YACxB,GAAG;AAAA,YACH,GAAG;AAAA,YACJ,KAAK;AAAA,YACL;AAAA,YACA;AAAA,YACA,cAAc,CAACC,UAAS;AACtB,kBAAIA,OAAM;AACR,6BAAa,WAAW,KAAK;AAAA,cAC/B,OAAO;AACL,6BAAa,YAAY,KAAK;AAAA,cAChC;AAAA,YACF;AAAA;AAAA,QACF;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,cAAc,cAAc;AAM5B,IAAM,cAAc;AAUpB,IAAM,kBAAkB,MAAM;AAAA,EAC5B,CAAC,OAA0C,iBAAiB;AAC1D,UAAM,EAAE,kBAAkB,GAAG,YAAY,IAAI;AAC7C,UAAM,mBAAmB,oBAAoB,gBAAgB,gBAAgB;AAC7E,UAAM,cAAc,wBAAwB,aAAa,gBAAgB;AACzE,WACE;AAAA,MAAC,UAAU;AAAA,MAAV;AAAA,QACC,oBAAkB,iBAAiB;AAAA,QACnC,cAAY,SAAS,YAAY,IAAI;AAAA,QACrC,iBAAe,YAAY,WAAW,KAAK;AAAA,QAC1C,GAAG;AAAA,QACJ,KAAK;AAAA;AAAA,IACP;AAAA,EAEJ;AACF;AAEA,gBAAgB,cAAc;AAM9B,IAAM,eAAe;AAUrB,IAAM,mBAAmB,MAAM;AAAA,EAC7B,CAAC,OAA2C,iBAAiB;AAC3D,UAAM,EAAE,kBAAkB,GAAG,aAAa,IAAI;AAC9C,UAAM,mBAAmB,oBAAoB,gBAAgB,gBAAgB;AAC7E,UAAM,cAAc,wBAAwB,cAAc,gBAAgB;AAC1E,UAAM,qBAAqB,+BAA+B,cAAc,gBAAgB;AACxF,UAAM,mBAAmB,oBAAoB,gBAAgB;AAC7D,WACE,oBAAC,WAAW,UAAX,EAAoB,OAAO,kBAC1B;AAAA,MAAsB;AAAA,MAArB;AAAA,QACC,iBAAgB,YAAY,QAAQ,CAAC,mBAAmB,eAAgB;AAAA,QACxE,oBAAkB,iBAAiB;AAAA,QACnC,IAAI,YAAY;AAAA,QACf,GAAG;AAAA,QACH,GAAG;AAAA,QACJ,KAAK;AAAA;AAAA,IACP,GACF;AAAA,EAEJ;AACF;AAEA,iBAAiB,cAAc;AAM/B,IAAM,eAAe;AASrB,IAAM,mBAAmB,MAAM;AAAA,EAC7B,CAAC,OAA2C,iBAAiB;AAC3D,UAAM,EAAE,kBAAkB,GAAG,aAAa,IAAI;AAC9C,UAAM,mBAAmB,oBAAoB,gBAAgB,gBAAgB;AAC7E,UAAM,cAAc,wBAAwB,cAAc,gBAAgB;AAC1E,UAAM,mBAAmB,oBAAoB,gBAAgB;AAC7D,WACE;AAAA,MAAsB;AAAA,MAArB;AAAA,QACC,MAAK;AAAA,QACL,mBAAiB,YAAY;AAAA,QAC7B,oBAAkB,iBAAiB;AAAA,QAClC,GAAG;AAAA,QACH,GAAG;AAAA,QACJ,KAAK;AAAA,QACL,OAAO;AAAA,UACL,CAAC,kCAAyC,GAAG;AAAA,UAC7C,CAAC,iCAAwC,GAAG;AAAA,UAC5C,GAAG,MAAM;AAAA,QACX;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,iBAAiB,cAAc;AAI/B,SAAS,SAAS,MAAgB;AAChC,SAAO,OAAO,SAAS;AACzB;AAEA,IAAMC,QAAO;AACb,IAAM,OAAO;AACb,IAAM,SAAS;AACf,IAAMC,WAAU;AAChB,IAAMC,WAAU;",
6
+ "names": ["value", "open", "Root", "Trigger", "Content"]
7
+ }
package/package.json ADDED
@@ -0,0 +1,62 @@
1
+ {
2
+ "name": "@radix-ui/react-accordion",
3
+ "version": "0.0.0-20250116175529",
4
+ "license": "MIT",
5
+ "exports": {
6
+ ".": {
7
+ "import": {
8
+ "types": "./dist/index.d.mts",
9
+ "default": "./dist/index.mjs"
10
+ },
11
+ "require": {
12
+ "types": "./dist/index.d.ts",
13
+ "default": "./dist/index.js"
14
+ }
15
+ }
16
+ },
17
+ "source": "./src/index.ts",
18
+ "main": "./dist/index.js",
19
+ "module": "./dist/index.mjs",
20
+ "types": "./dist/index.d.ts",
21
+ "files": [
22
+ "dist",
23
+ "README.md"
24
+ ],
25
+ "sideEffects": false,
26
+ "scripts": {
27
+ "clean": "rm -rf dist"
28
+ },
29
+ "dependencies": {
30
+ "@radix-ui/primitive": "workspace:*",
31
+ "@radix-ui/react-collapsible": "workspace:*",
32
+ "@radix-ui/react-collection": "workspace:*",
33
+ "@radix-ui/react-compose-refs": "workspace:*",
34
+ "@radix-ui/react-context": "workspace:*",
35
+ "@radix-ui/react-direction": "workspace:*",
36
+ "@radix-ui/react-id": "workspace:*",
37
+ "@radix-ui/react-primitive": "workspace:*",
38
+ "@radix-ui/react-use-controllable-state": "workspace:*"
39
+ },
40
+ "peerDependencies": {
41
+ "@types/react": "*",
42
+ "@types/react-dom": "*",
43
+ "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
44
+ "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
45
+ },
46
+ "peerDependenciesMeta": {
47
+ "@types/react": {
48
+ "optional": true
49
+ },
50
+ "@types/react-dom": {
51
+ "optional": true
52
+ }
53
+ },
54
+ "homepage": "https://radix-ui.com/primitives",
55
+ "repository": {
56
+ "type": "git",
57
+ "url": "git+https://github.com/radix-ui/primitives.git"
58
+ },
59
+ "bugs": {
60
+ "url": "https://github.com/radix-ui/primitives/issues"
61
+ }
62
+ }