@radix-ui/react-accordion 1.1.2 → 1.2.0-rc.2
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.
- package/dist/index.d.mts +42 -29
- package/dist/index.d.ts +42 -29
- package/dist/index.js +335 -320
- package/dist/index.js.map +7 -1
- package/dist/index.mjs +312 -298
- package/dist/index.mjs.map +7 -1
- package/package.json +12 -12
- package/dist/index.d.ts.map +0 -1
package/dist/index.js
CHANGED
|
@@ -1,342 +1,357 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
var
|
|
5
|
-
var
|
|
6
|
-
var
|
|
7
|
-
var
|
|
8
|
-
var
|
|
9
|
-
var
|
|
10
|
-
var
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
"use client";
|
|
3
|
+
(() => {
|
|
4
|
+
var __create = Object.create;
|
|
5
|
+
var __defProp = Object.defineProperty;
|
|
6
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
7
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
8
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
9
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
10
|
+
var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
|
|
11
|
+
get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
|
|
12
|
+
}) : x)(function(x) {
|
|
13
|
+
if (typeof require !== "undefined") return require.apply(this, arguments);
|
|
14
|
+
throw Error('Dynamic require of "' + x + '" is not supported');
|
|
15
|
+
});
|
|
16
|
+
var __copyProps = (to, from, except, desc) => {
|
|
17
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
18
|
+
for (let key of __getOwnPropNames(from))
|
|
19
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
20
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
21
|
+
}
|
|
22
|
+
return to;
|
|
23
|
+
};
|
|
24
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
25
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
26
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
27
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
28
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
29
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
30
|
+
mod
|
|
31
|
+
));
|
|
42
32
|
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
]);
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
})));
|
|
71
|
-
});
|
|
72
|
-
/*#__PURE__*/ Object.assign($0f4a20de0660bfd8$export$a766cd26d0d69044, {
|
|
73
|
-
displayName: $0f4a20de0660bfd8$var$ACCORDION_NAME
|
|
74
|
-
});
|
|
75
|
-
$0f4a20de0660bfd8$export$a766cd26d0d69044.propTypes = {
|
|
76
|
-
type (props) {
|
|
77
|
-
const value = props.value || props.defaultValue;
|
|
78
|
-
if (props.type && ![
|
|
79
|
-
'single',
|
|
80
|
-
'multiple'
|
|
81
|
-
].includes(props.type)) return new Error('Invalid prop `type` supplied to `Accordion`. Expected one of `single | multiple`.');
|
|
82
|
-
if (props.type === 'multiple' && typeof value === 'string') return new Error('Invalid prop `type` supplied to `Accordion`. Expected `single` when `defaultValue` or `value` is type `string`.');
|
|
83
|
-
if (props.type === 'single' && Array.isArray(value)) return new Error('Invalid prop `type` supplied to `Accordion`. Expected `multiple` when `defaultValue` or `value` is type `string[]`.');
|
|
84
|
-
return null;
|
|
33
|
+
// packages/react/accordion/src/Accordion.tsx
|
|
34
|
+
var import_react = __toESM(__require("react"));
|
|
35
|
+
var import_react_context = __require("@radix-ui/react-context");
|
|
36
|
+
var import_react_collection = __require("@radix-ui/react-collection");
|
|
37
|
+
var import_react_compose_refs = __require("@radix-ui/react-compose-refs");
|
|
38
|
+
var import_primitive = __require("@radix-ui/primitive");
|
|
39
|
+
var import_react_use_controllable_state = __require("@radix-ui/react-use-controllable-state");
|
|
40
|
+
var import_react_primitive = __require("@radix-ui/react-primitive");
|
|
41
|
+
var CollapsiblePrimitive = __toESM(__require("@radix-ui/react-collapsible"));
|
|
42
|
+
var import_react_collapsible = __require("@radix-ui/react-collapsible");
|
|
43
|
+
var import_react_id = __require("@radix-ui/react-id");
|
|
44
|
+
var import_react_direction = __require("@radix-ui/react-direction");
|
|
45
|
+
var import_jsx_runtime = __require("react/jsx-runtime");
|
|
46
|
+
var ACCORDION_NAME = "Accordion";
|
|
47
|
+
var ACCORDION_KEYS = ["Home", "End", "ArrowDown", "ArrowUp", "ArrowLeft", "ArrowRight"];
|
|
48
|
+
var [Collection, useCollection, createCollectionScope] = (0, import_react_collection.createCollection)(ACCORDION_NAME);
|
|
49
|
+
var [createAccordionContext, createAccordionScope] = (0, import_react_context.createContextScope)(ACCORDION_NAME, [
|
|
50
|
+
createCollectionScope,
|
|
51
|
+
import_react_collapsible.createCollapsibleScope
|
|
52
|
+
]);
|
|
53
|
+
var useCollapsibleScope = (0, import_react_collapsible.createCollapsibleScope)();
|
|
54
|
+
var Accordion = import_react.default.forwardRef(
|
|
55
|
+
(props, forwardedRef) => {
|
|
56
|
+
const { type, ...accordionProps } = props;
|
|
57
|
+
const singleProps = accordionProps;
|
|
58
|
+
const multipleProps = accordionProps;
|
|
59
|
+
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 }) });
|
|
85
60
|
}
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
61
|
+
);
|
|
62
|
+
Accordion.displayName = ACCORDION_NAME;
|
|
63
|
+
Accordion.propTypes = {
|
|
64
|
+
type(props) {
|
|
65
|
+
const value = props.value || props.defaultValue;
|
|
66
|
+
if (props.type && !["single", "multiple"].includes(props.type)) {
|
|
67
|
+
return new Error(
|
|
68
|
+
"Invalid prop `type` supplied to `Accordion`. Expected one of `single | multiple`."
|
|
69
|
+
);
|
|
70
|
+
}
|
|
71
|
+
if (props.type === "multiple" && typeof value === "string") {
|
|
72
|
+
return new Error(
|
|
73
|
+
"Invalid prop `type` supplied to `Accordion`. Expected `single` when `defaultValue` or `value` is type `string`."
|
|
74
|
+
);
|
|
75
|
+
}
|
|
76
|
+
if (props.type === "single" && Array.isArray(value)) {
|
|
77
|
+
return new Error(
|
|
78
|
+
"Invalid prop `type` supplied to `Accordion`. Expected `multiple` when `defaultValue` or `value` is type `string[]`."
|
|
79
|
+
);
|
|
80
|
+
}
|
|
81
|
+
return null;
|
|
82
|
+
}
|
|
83
|
+
};
|
|
84
|
+
var [AccordionValueProvider, useAccordionValueContext] = createAccordionContext(ACCORDION_NAME);
|
|
85
|
+
var [AccordionCollapsibleProvider, useAccordionCollapsibleContext] = createAccordionContext(
|
|
86
|
+
ACCORDION_NAME,
|
|
87
|
+
{ collapsible: false }
|
|
88
|
+
);
|
|
89
|
+
var AccordionImplSingle = import_react.default.forwardRef(
|
|
90
|
+
(props, forwardedRef) => {
|
|
91
|
+
const {
|
|
92
|
+
value: valueProp,
|
|
93
|
+
defaultValue,
|
|
94
|
+
onValueChange = () => {
|
|
95
|
+
},
|
|
96
|
+
collapsible = false,
|
|
97
|
+
...accordionSingleProps
|
|
98
|
+
} = props;
|
|
99
|
+
const [value, setValue] = (0, import_react_use_controllable_state.useControllableState)({
|
|
119
100
|
prop: valueProp,
|
|
120
101
|
defaultProp: defaultValue,
|
|
121
102
|
onChange: onValueChange
|
|
103
|
+
});
|
|
104
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
105
|
+
AccordionValueProvider,
|
|
106
|
+
{
|
|
107
|
+
scope: props.__scopeAccordion,
|
|
108
|
+
value: value ? [value] : [],
|
|
109
|
+
onItemOpen: setValue,
|
|
110
|
+
onItemClose: import_react.default.useCallback(() => collapsible && setValue(""), [collapsible, setValue]),
|
|
111
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionCollapsibleProvider, { scope: props.__scopeAccordion, collapsible, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionImpl, { ...accordionSingleProps, ref: forwardedRef }) })
|
|
112
|
+
}
|
|
113
|
+
);
|
|
114
|
+
}
|
|
115
|
+
);
|
|
116
|
+
var AccordionImplMultiple = import_react.default.forwardRef((props, forwardedRef) => {
|
|
117
|
+
const {
|
|
118
|
+
value: valueProp,
|
|
119
|
+
defaultValue,
|
|
120
|
+
onValueChange = () => {
|
|
121
|
+
},
|
|
122
|
+
...accordionMultipleProps
|
|
123
|
+
} = props;
|
|
124
|
+
const [value = [], setValue] = (0, import_react_use_controllable_state.useControllableState)({
|
|
125
|
+
prop: valueProp,
|
|
126
|
+
defaultProp: defaultValue,
|
|
127
|
+
onChange: onValueChange
|
|
122
128
|
});
|
|
123
|
-
const handleItemOpen =
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
, [
|
|
135
|
-
setValue
|
|
136
|
-
]);
|
|
137
|
-
return /*#__PURE__*/ ($parcel$interopDefault($47SRi$react)).createElement($0f4a20de0660bfd8$var$AccordionValueProvider, {
|
|
129
|
+
const handleItemOpen = import_react.default.useCallback(
|
|
130
|
+
(itemValue) => setValue((prevValue = []) => [...prevValue, itemValue]),
|
|
131
|
+
[setValue]
|
|
132
|
+
);
|
|
133
|
+
const handleItemClose = import_react.default.useCallback(
|
|
134
|
+
(itemValue) => setValue((prevValue = []) => prevValue.filter((value2) => value2 !== itemValue)),
|
|
135
|
+
[setValue]
|
|
136
|
+
);
|
|
137
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
138
|
+
AccordionValueProvider,
|
|
139
|
+
{
|
|
138
140
|
scope: props.__scopeAccordion,
|
|
139
|
-
value
|
|
141
|
+
value,
|
|
140
142
|
onItemOpen: handleItemOpen,
|
|
141
|
-
onItemClose: handleItemClose
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
const
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
const handleKeyDown = $47SRi$radixuiprimitive.composeEventHandlers(props.onKeyDown, (event)=>{
|
|
158
|
-
var _triggerCollection$cl;
|
|
159
|
-
if (!$0f4a20de0660bfd8$var$ACCORDION_KEYS.includes(event.key)) return;
|
|
143
|
+
onItemClose: handleItemClose,
|
|
144
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionCollapsibleProvider, { scope: props.__scopeAccordion, collapsible: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AccordionImpl, { ...accordionMultipleProps, ref: forwardedRef }) })
|
|
145
|
+
}
|
|
146
|
+
);
|
|
147
|
+
});
|
|
148
|
+
var [AccordionImplProvider, useAccordionContext] = createAccordionContext(ACCORDION_NAME);
|
|
149
|
+
var AccordionImpl = import_react.default.forwardRef(
|
|
150
|
+
(props, forwardedRef) => {
|
|
151
|
+
const { __scopeAccordion, disabled, dir, orientation = "vertical", ...accordionProps } = props;
|
|
152
|
+
const accordionRef = import_react.default.useRef(null);
|
|
153
|
+
const composedRefs = (0, import_react_compose_refs.useComposedRefs)(accordionRef, forwardedRef);
|
|
154
|
+
const getItems = useCollection(__scopeAccordion);
|
|
155
|
+
const direction = (0, import_react_direction.useDirection)(dir);
|
|
156
|
+
const isDirectionLTR = direction === "ltr";
|
|
157
|
+
const handleKeyDown = (0, import_primitive.composeEventHandlers)(props.onKeyDown, (event) => {
|
|
158
|
+
if (!ACCORDION_KEYS.includes(event.key)) return;
|
|
160
159
|
const target = event.target;
|
|
161
|
-
const triggerCollection = getItems().filter((item)=>
|
|
162
|
-
|
|
163
|
-
return !((_item$ref$current = item.ref.current) !== null && _item$ref$current !== void 0 && _item$ref$current.disabled);
|
|
164
|
-
});
|
|
165
|
-
const triggerIndex = triggerCollection.findIndex((item)=>item.ref.current === target
|
|
166
|
-
);
|
|
160
|
+
const triggerCollection = getItems().filter((item) => !item.ref.current?.disabled);
|
|
161
|
+
const triggerIndex = triggerCollection.findIndex((item) => item.ref.current === target);
|
|
167
162
|
const triggerCount = triggerCollection.length;
|
|
168
|
-
if (triggerIndex === -1) return;
|
|
163
|
+
if (triggerIndex === -1) return;
|
|
169
164
|
event.preventDefault();
|
|
170
165
|
let nextIndex = triggerIndex;
|
|
171
166
|
const homeIndex = 0;
|
|
172
167
|
const endIndex = triggerCount - 1;
|
|
173
|
-
const moveNext = ()=>{
|
|
174
|
-
|
|
175
|
-
|
|
168
|
+
const moveNext = () => {
|
|
169
|
+
nextIndex = triggerIndex + 1;
|
|
170
|
+
if (nextIndex > endIndex) {
|
|
171
|
+
nextIndex = homeIndex;
|
|
172
|
+
}
|
|
176
173
|
};
|
|
177
|
-
const movePrev = ()=>{
|
|
178
|
-
|
|
179
|
-
|
|
174
|
+
const movePrev = () => {
|
|
175
|
+
nextIndex = triggerIndex - 1;
|
|
176
|
+
if (nextIndex < homeIndex) {
|
|
177
|
+
nextIndex = endIndex;
|
|
178
|
+
}
|
|
180
179
|
};
|
|
181
|
-
switch(event.key){
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
180
|
+
switch (event.key) {
|
|
181
|
+
case "Home":
|
|
182
|
+
nextIndex = homeIndex;
|
|
183
|
+
break;
|
|
184
|
+
case "End":
|
|
185
|
+
nextIndex = endIndex;
|
|
186
|
+
break;
|
|
187
|
+
case "ArrowRight":
|
|
188
|
+
if (orientation === "horizontal") {
|
|
189
|
+
if (isDirectionLTR) {
|
|
190
|
+
moveNext();
|
|
191
|
+
} else {
|
|
192
|
+
movePrev();
|
|
193
|
+
}
|
|
194
|
+
}
|
|
195
|
+
break;
|
|
196
|
+
case "ArrowDown":
|
|
197
|
+
if (orientation === "vertical") {
|
|
198
|
+
moveNext();
|
|
199
|
+
}
|
|
200
|
+
break;
|
|
201
|
+
case "ArrowLeft":
|
|
202
|
+
if (orientation === "horizontal") {
|
|
203
|
+
if (isDirectionLTR) {
|
|
204
|
+
movePrev();
|
|
205
|
+
} else {
|
|
206
|
+
moveNext();
|
|
207
|
+
}
|
|
208
|
+
}
|
|
209
|
+
break;
|
|
210
|
+
case "ArrowUp":
|
|
211
|
+
if (orientation === "vertical") {
|
|
212
|
+
movePrev();
|
|
213
|
+
}
|
|
214
|
+
break;
|
|
206
215
|
}
|
|
207
216
|
const clampedIndex = nextIndex % triggerCount;
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
217
|
+
triggerCollection[clampedIndex].ref.current?.focus();
|
|
218
|
+
});
|
|
219
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
220
|
+
AccordionImplProvider,
|
|
221
|
+
{
|
|
222
|
+
scope: __scopeAccordion,
|
|
223
|
+
disabled,
|
|
224
|
+
direction: dir,
|
|
225
|
+
orientation,
|
|
226
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Collection.Slot, { scope: __scopeAccordion, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
227
|
+
import_react_primitive.Primitive.div,
|
|
228
|
+
{
|
|
229
|
+
...accordionProps,
|
|
230
|
+
"data-orientation": orientation,
|
|
231
|
+
ref: composedRefs,
|
|
232
|
+
onKeyDown: disabled ? void 0 : handleKeyDown
|
|
233
|
+
}
|
|
234
|
+
) })
|
|
235
|
+
}
|
|
236
|
+
);
|
|
237
|
+
}
|
|
238
|
+
);
|
|
239
|
+
var ITEM_NAME = "AccordionItem";
|
|
240
|
+
var [AccordionItemProvider, useAccordionItemContext] = createAccordionContext(ITEM_NAME);
|
|
241
|
+
var AccordionItem = import_react.default.forwardRef(
|
|
242
|
+
(props, forwardedRef) => {
|
|
243
|
+
const { __scopeAccordion, value, ...accordionItemProps } = props;
|
|
244
|
+
const accordionContext = useAccordionContext(ITEM_NAME, __scopeAccordion);
|
|
245
|
+
const valueContext = useAccordionValueContext(ITEM_NAME, __scopeAccordion);
|
|
246
|
+
const collapsibleScope = useCollapsibleScope(__scopeAccordion);
|
|
247
|
+
const triggerId = (0, import_react_id.useId)();
|
|
248
|
+
const open = value && valueContext.value.includes(value) || false;
|
|
249
|
+
const disabled = accordionContext.disabled || props.disabled;
|
|
250
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
251
|
+
AccordionItemProvider,
|
|
252
|
+
{
|
|
253
|
+
scope: __scopeAccordion,
|
|
254
|
+
open,
|
|
255
|
+
disabled,
|
|
256
|
+
triggerId,
|
|
257
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
258
|
+
CollapsiblePrimitive.Root,
|
|
259
|
+
{
|
|
260
|
+
"data-orientation": accordionContext.orientation,
|
|
261
|
+
"data-state": getState(open),
|
|
262
|
+
...collapsibleScope,
|
|
263
|
+
...accordionItemProps,
|
|
264
|
+
ref: forwardedRef,
|
|
265
|
+
disabled,
|
|
266
|
+
open,
|
|
267
|
+
onOpenChange: (open2) => {
|
|
268
|
+
if (open2) {
|
|
269
|
+
valueContext.onItemOpen(value);
|
|
270
|
+
} else {
|
|
271
|
+
valueContext.onItemClose(value);
|
|
272
|
+
}
|
|
273
|
+
}
|
|
274
|
+
}
|
|
275
|
+
)
|
|
276
|
+
}
|
|
277
|
+
);
|
|
278
|
+
}
|
|
279
|
+
);
|
|
280
|
+
AccordionItem.displayName = ITEM_NAME;
|
|
281
|
+
var HEADER_NAME = "AccordionHeader";
|
|
282
|
+
var AccordionHeader = import_react.default.forwardRef(
|
|
283
|
+
(props, forwardedRef) => {
|
|
284
|
+
const { __scopeAccordion, ...headerProps } = props;
|
|
285
|
+
const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);
|
|
286
|
+
const itemContext = useAccordionItemContext(HEADER_NAME, __scopeAccordion);
|
|
287
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
288
|
+
import_react_primitive.Primitive.h3,
|
|
289
|
+
{
|
|
290
|
+
"data-orientation": accordionContext.orientation,
|
|
291
|
+
"data-state": getState(itemContext.open),
|
|
292
|
+
"data-disabled": itemContext.disabled ? "" : void 0,
|
|
293
|
+
...headerProps,
|
|
294
|
+
ref: forwardedRef
|
|
252
295
|
}
|
|
253
|
-
|
|
254
|
-
}
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
});
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
ref: forwardedRef
|
|
299
|
-
})));
|
|
300
|
-
});
|
|
301
|
-
/*#__PURE__*/ Object.assign($0f4a20de0660bfd8$export$94e939b1f85bdd73, {
|
|
302
|
-
displayName: $0f4a20de0660bfd8$var$TRIGGER_NAME
|
|
303
|
-
});
|
|
304
|
-
/* -------------------------------------------------------------------------------------------------
|
|
305
|
-
* AccordionContent
|
|
306
|
-
* -----------------------------------------------------------------------------------------------*/ const $0f4a20de0660bfd8$var$CONTENT_NAME = 'AccordionContent';
|
|
307
|
-
/**
|
|
308
|
-
* `AccordionContent` contains the collapsible content for an `AccordionItem`.
|
|
309
|
-
*/ const $0f4a20de0660bfd8$export$985b9a77379b54a0 = /*#__PURE__*/ ($parcel$interopDefault($47SRi$react)).forwardRef((props, forwardedRef)=>{
|
|
310
|
-
const { __scopeAccordion: __scopeAccordion , ...contentProps } = props;
|
|
311
|
-
const accordionContext = $0f4a20de0660bfd8$var$useAccordionContext($0f4a20de0660bfd8$var$ACCORDION_NAME, __scopeAccordion);
|
|
312
|
-
const itemContext = $0f4a20de0660bfd8$var$useAccordionItemContext($0f4a20de0660bfd8$var$CONTENT_NAME, __scopeAccordion);
|
|
313
|
-
const collapsibleScope = $0f4a20de0660bfd8$var$useCollapsibleScope(__scopeAccordion);
|
|
314
|
-
return /*#__PURE__*/ ($parcel$interopDefault($47SRi$react)).createElement($47SRi$radixuireactcollapsible.Content, ($parcel$interopDefault($47SRi$babelruntimehelpersextends))({
|
|
315
|
-
role: "region",
|
|
316
|
-
"aria-labelledby": itemContext.triggerId,
|
|
317
|
-
"data-orientation": accordionContext.orientation
|
|
318
|
-
}, collapsibleScope, contentProps, {
|
|
319
|
-
ref: forwardedRef,
|
|
320
|
-
style: {
|
|
321
|
-
['--radix-accordion-content-height']: 'var(--radix-collapsible-content-height)',
|
|
322
|
-
['--radix-accordion-content-width']: 'var(--radix-collapsible-content-width)',
|
|
296
|
+
);
|
|
297
|
+
}
|
|
298
|
+
);
|
|
299
|
+
AccordionHeader.displayName = HEADER_NAME;
|
|
300
|
+
var TRIGGER_NAME = "AccordionTrigger";
|
|
301
|
+
var AccordionTrigger = import_react.default.forwardRef(
|
|
302
|
+
(props, forwardedRef) => {
|
|
303
|
+
const { __scopeAccordion, ...triggerProps } = props;
|
|
304
|
+
const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);
|
|
305
|
+
const itemContext = useAccordionItemContext(TRIGGER_NAME, __scopeAccordion);
|
|
306
|
+
const collapsibleContext = useAccordionCollapsibleContext(TRIGGER_NAME, __scopeAccordion);
|
|
307
|
+
const collapsibleScope = useCollapsibleScope(__scopeAccordion);
|
|
308
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Collection.ItemSlot, { scope: __scopeAccordion, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
309
|
+
CollapsiblePrimitive.Trigger,
|
|
310
|
+
{
|
|
311
|
+
"aria-disabled": itemContext.open && !collapsibleContext.collapsible || void 0,
|
|
312
|
+
"data-orientation": accordionContext.orientation,
|
|
313
|
+
id: itemContext.triggerId,
|
|
314
|
+
...collapsibleScope,
|
|
315
|
+
...triggerProps,
|
|
316
|
+
ref: forwardedRef
|
|
317
|
+
}
|
|
318
|
+
) });
|
|
319
|
+
}
|
|
320
|
+
);
|
|
321
|
+
AccordionTrigger.displayName = TRIGGER_NAME;
|
|
322
|
+
var CONTENT_NAME = "AccordionContent";
|
|
323
|
+
var AccordionContent = import_react.default.forwardRef(
|
|
324
|
+
(props, forwardedRef) => {
|
|
325
|
+
const { __scopeAccordion, ...contentProps } = props;
|
|
326
|
+
const accordionContext = useAccordionContext(ACCORDION_NAME, __scopeAccordion);
|
|
327
|
+
const itemContext = useAccordionItemContext(CONTENT_NAME, __scopeAccordion);
|
|
328
|
+
const collapsibleScope = useCollapsibleScope(__scopeAccordion);
|
|
329
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
330
|
+
CollapsiblePrimitive.Content,
|
|
331
|
+
{
|
|
332
|
+
role: "region",
|
|
333
|
+
"aria-labelledby": itemContext.triggerId,
|
|
334
|
+
"data-orientation": accordionContext.orientation,
|
|
335
|
+
...collapsibleScope,
|
|
336
|
+
...contentProps,
|
|
337
|
+
ref: forwardedRef,
|
|
338
|
+
style: {
|
|
339
|
+
["--radix-accordion-content-height"]: "var(--radix-collapsible-content-height)",
|
|
340
|
+
["--radix-accordion-content-width"]: "var(--radix-collapsible-content-width)",
|
|
323
341
|
...props.style
|
|
342
|
+
}
|
|
324
343
|
}
|
|
325
|
-
|
|
326
|
-
}
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
344
|
+
);
|
|
345
|
+
}
|
|
346
|
+
);
|
|
347
|
+
AccordionContent.displayName = CONTENT_NAME;
|
|
348
|
+
function getState(open) {
|
|
349
|
+
return open ? "open" : "closed";
|
|
350
|
+
}
|
|
351
|
+
var Root2 = Accordion;
|
|
352
|
+
var Item = AccordionItem;
|
|
353
|
+
var Header = AccordionHeader;
|
|
354
|
+
var Trigger2 = AccordionTrigger;
|
|
355
|
+
var Content2 = AccordionContent;
|
|
356
|
+
})();
|
|
342
357
|
//# sourceMappingURL=index.js.map
|