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