@spark-ui/components 10.8.2 → 10.10.0

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 (45) hide show
  1. package/CHANGELOG.md +13 -0
  2. package/dist/{DialogTrigger-5SI4dvpK.d.mts → DialogTrigger-woU7vsJi.d.mts} +9 -9
  3. package/dist/{DialogTrigger-5SI4dvpK.d.ts → DialogTrigger-woU7vsJi.d.ts} +9 -9
  4. package/dist/accordion/index.d.mts +13 -25
  5. package/dist/accordion/index.d.ts +13 -25
  6. package/dist/accordion/index.js +114 -250
  7. package/dist/accordion/index.js.map +1 -1
  8. package/dist/accordion/index.mjs +92 -134
  9. package/dist/accordion/index.mjs.map +1 -1
  10. package/dist/alert-dialog/index.d.mts +1 -1
  11. package/dist/alert-dialog/index.d.ts +1 -1
  12. package/dist/alert-dialog/index.js +60 -46
  13. package/dist/alert-dialog/index.js.map +1 -1
  14. package/dist/alert-dialog/index.mjs +1 -1
  15. package/dist/{chunk-T26TYEWV.mjs → chunk-I7UIKCZK.mjs} +56 -42
  16. package/dist/chunk-I7UIKCZK.mjs.map +1 -0
  17. package/dist/collapsible/index.d.mts +18 -35
  18. package/dist/collapsible/index.d.ts +18 -35
  19. package/dist/collapsible/index.js +47 -78
  20. package/dist/collapsible/index.js.map +1 -1
  21. package/dist/collapsible/index.mjs +73 -4
  22. package/dist/collapsible/index.mjs.map +1 -1
  23. package/dist/dialog/index.d.mts +2 -2
  24. package/dist/dialog/index.d.ts +2 -2
  25. package/dist/dialog/index.js +52 -38
  26. package/dist/dialog/index.js.map +1 -1
  27. package/dist/dialog/index.mjs +1 -1
  28. package/dist/drawer/index.d.mts +6 -2
  29. package/dist/drawer/index.d.ts +6 -2
  30. package/dist/drawer/index.js +105 -59
  31. package/dist/drawer/index.js.map +1 -1
  32. package/dist/drawer/index.mjs +81 -35
  33. package/dist/drawer/index.mjs.map +1 -1
  34. package/dist/scrolling-list/index.d.mts +2 -2
  35. package/dist/scrolling-list/index.d.ts +2 -2
  36. package/dist/scrolling-list/index.js +32 -68
  37. package/dist/scrolling-list/index.js.map +1 -1
  38. package/dist/scrolling-list/index.mjs +7 -43
  39. package/dist/scrolling-list/index.mjs.map +1 -1
  40. package/dist/spinner/index.d.mts +1 -1
  41. package/dist/spinner/index.d.ts +1 -1
  42. package/package.json +6 -7
  43. package/dist/chunk-3LEFXZNI.mjs +0 -97
  44. package/dist/chunk-3LEFXZNI.mjs.map +0 -1
  45. package/dist/chunk-T26TYEWV.mjs.map +0 -1
@@ -1,9 +1,7 @@
1
1
  "use strict";
2
- var __create = Object.create;
3
2
  var __defProp = Object.defineProperty;
4
3
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
4
  var __getOwnPropNames = Object.getOwnPropertyNames;
6
- var __getProtoOf = Object.getPrototypeOf;
7
5
  var __hasOwnProp = Object.prototype.hasOwnProperty;
8
6
  var __export = (target, all) => {
9
7
  for (var name in all)
@@ -17,14 +15,6 @@ var __copyProps = (to, from, except, desc) => {
17
15
  }
18
16
  return to;
19
17
  };
20
- var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
- // If the importer is in node compatibility mode or this is not an ESM
22
- // file that has been converted to a CommonJS file using a Babel-
23
- // compatible transform (i.e. "__esModule" has not been set), then set
24
- // "default" to the CommonJS "module.exports" for node compatibility.
25
- isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
- mod
27
- ));
28
18
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
19
 
30
20
  // src/accordion/index.ts
@@ -35,10 +25,9 @@ __export(accordion_exports, {
35
25
  module.exports = __toCommonJS(accordion_exports);
36
26
 
37
27
  // src/accordion/Accordion.tsx
38
- var accordion = __toESM(require("@zag-js/accordion"));
39
- var import_react2 = require("@zag-js/react");
28
+ var import_accordion = require("@base-ui-components/react/accordion");
40
29
  var import_class_variance_authority = require("class-variance-authority");
41
- var import_react3 = require("react");
30
+ var import_react2 = require("react");
42
31
 
43
32
  // src/slot/Slot.tsx
44
33
  var import_radix_ui = require("radix-ui");
@@ -49,49 +38,44 @@ var Slot = ({ ref, ...props }) => {
49
38
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Slot.Root, { ref, ...props });
50
39
  };
51
40
 
52
- // src/accordion/Accordion.tsx
41
+ // src/accordion/useRenderSlot.tsx
53
42
  var import_jsx_runtime2 = require("react/jsx-runtime");
54
- var AccordionContext = (0, import_react3.createContext)(null);
43
+ function useRenderSlot(asChild, defaultTag) {
44
+ const Component = asChild ? Slot : defaultTag;
45
+ return asChild ? ({ ...props }) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Component, { ...props }) : void 0;
46
+ }
47
+
48
+ // src/accordion/Accordion.tsx
49
+ var import_jsx_runtime3 = require("react/jsx-runtime");
50
+ var AccordionContext = (0, import_react2.createContext)(null);
55
51
  var Accordion = ({
56
52
  asChild = false,
57
53
  children,
58
- collapsible: collapsible2 = true,
59
- className,
60
- defaultValue,
61
54
  design = "outlined",
62
- disabled = false,
55
+ hiddenUntilFound = true,
63
56
  multiple = false,
64
- value,
65
- onValueChange,
57
+ className,
66
58
  ref,
67
59
  ...props
68
60
  }) => {
69
- const [machineProps, localProps] = accordion.splitProps({
70
- children,
71
- multiple,
72
- collapsible: collapsible2,
73
- value,
74
- disabled,
75
- className: (0, import_class_variance_authority.cx)("bg-surface rounded-lg h-fit", className),
76
- ...props
77
- });
78
- const service = (0, import_react2.useMachine)(accordion.machine, {
79
- ...machineProps,
80
- defaultValue,
81
- value,
82
- id: (0, import_react3.useId)(),
83
- onValueChange(details) {
84
- onValueChange?.(details.value);
61
+ const renderSlot = useRenderSlot(asChild, "div");
62
+ return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(AccordionContext.Provider, { value: { design }, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
63
+ import_accordion.Accordion.Root,
64
+ {
65
+ "data-spark-component": "accordion",
66
+ ref,
67
+ openMultiple: multiple,
68
+ hiddenUntilFound,
69
+ className: (0, import_class_variance_authority.cx)("bg-surface h-fit rounded-lg", className),
70
+ render: renderSlot,
71
+ ...props,
72
+ children
85
73
  }
86
- });
87
- const Component = asChild ? Slot : "div";
88
- const api = accordion.connect(service, import_react2.normalizeProps);
89
- const mergedProps = (0, import_react2.mergeProps)(api.getRootProps(), localProps);
90
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(AccordionContext.Provider, { value: { ...api, design }, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Component, { "data-spark-component": "accordion", ref, ...mergedProps, children }) });
74
+ ) });
91
75
  };
92
76
  Accordion.displayName = "Accordion";
93
77
  var useAccordionContext = () => {
94
- const context = (0, import_react3.useContext)(AccordionContext);
78
+ const context = (0, import_react2.useContext)(AccordionContext);
95
79
  if (!context) {
96
80
  throw Error("useAccordionContext must be used within a Accordion provider");
97
81
  }
@@ -99,165 +83,41 @@ var useAccordionContext = () => {
99
83
  };
100
84
 
101
85
  // src/accordion/AccordionItem.tsx
102
- var import_react9 = require("@zag-js/react");
103
- var import_class_variance_authority3 = require("class-variance-authority");
104
-
105
- // src/collapsible/Collapsible.tsx
106
- var collapsible = __toESM(require("@zag-js/collapsible"));
107
- var import_react4 = require("@zag-js/react");
108
- var import_react5 = require("react");
109
- var import_jsx_runtime3 = require("react/jsx-runtime");
110
- var CollapsibleContext = (0, import_react5.createContext)(null);
111
- var Collapsible = ({
112
- asChild = false,
113
- children,
114
- defaultOpen = false,
115
- disabled = false,
116
- onOpenChange,
117
- open,
118
- ids,
119
- ref,
120
- ...props
121
- }) => {
122
- const service = (0, import_react4.useMachine)(collapsible.machine, {
123
- open,
124
- defaultOpen,
125
- disabled,
126
- id: (0, import_react5.useId)(),
127
- ids,
128
- onOpenChange(details) {
129
- onOpenChange?.(details.open);
130
- }
131
- });
132
- const api = collapsible.connect(service, import_react4.normalizeProps);
133
- const Component = asChild ? Slot : "div";
134
- const mergedProps = (0, import_react4.mergeProps)(api.getRootProps(), props);
135
- return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(CollapsibleContext.Provider, { value: api, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Component, { "data-spark-component": "collapsible", ref, ...mergedProps, children }) });
136
- };
137
- Collapsible.displayName = "Collapsible";
138
- var useCollapsibleContext = () => {
139
- const context = (0, import_react5.useContext)(CollapsibleContext);
140
- if (!context) {
141
- throw Error("useCollapsibleContext must be used within a Collapsible provider");
142
- }
143
- return context;
144
- };
145
-
146
- // src/collapsible/CollapsibleContent.tsx
147
- var import_react6 = require("@zag-js/react");
86
+ var import_accordion2 = require("@base-ui-components/react/accordion");
148
87
  var import_class_variance_authority2 = require("class-variance-authority");
149
88
  var import_jsx_runtime4 = require("react/jsx-runtime");
150
- var Content = ({
151
- asChild = false,
152
- className,
153
- children,
154
- ref,
155
- ...props
156
- }) => {
157
- const { getContentProps } = useCollapsibleContext();
158
- const Component = asChild ? Slot : "div";
159
- const contentProps = getContentProps();
160
- const mergedProps = (0, import_react6.mergeProps)(contentProps, {
161
- className: (0, import_class_variance_authority2.cx)(
162
- "overflow-hidden",
163
- "motion-reduce:animate-none!",
164
- "[&[hidden]]:hidden",
165
- "data-[state=open]:animate-standalone-collapse-in data-[state=closed]:animate-standalone-collapse-out",
166
- className
167
- ),
168
- ...props
169
- });
170
- return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Component, { ref, "data-spark-component": "collapsible-content", ...mergedProps, children });
171
- };
172
- Content.displayName = "Collapsible.Content";
173
-
174
- // src/collapsible/CollapsibleTrigger.tsx
175
- var import_react7 = require("@zag-js/react");
176
- var import_jsx_runtime5 = require("react/jsx-runtime");
177
- var Trigger = ({ asChild = false, children, ref, ...props }) => {
178
- const collapsibleContext = useCollapsibleContext();
179
- const Component = asChild ? Slot : "button";
180
- const mergedProps = (0, import_react7.mergeProps)(collapsibleContext.getTriggerProps(), props);
181
- return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Component, { ref, "data-spark-component": "collapsible-trigger", ...mergedProps, children });
182
- };
183
- Trigger.displayName = "Collapsible.Trigger";
184
-
185
- // src/collapsible/index.ts
186
- var Collapsible2 = Object.assign(Collapsible, {
187
- Trigger,
188
- Content
189
- });
190
- Collapsible2.displayName = "Collapsible";
191
- Trigger.displayName = "Collapsible.Trigger";
192
- Content.displayName = "Collapsible.Content";
193
-
194
- // src/accordion/AccordionItemContext.tsx
195
- var import_react8 = require("react");
196
- var import_jsx_runtime6 = require("react/jsx-runtime");
197
- var AccordionItemContext = (0, import_react8.createContext)(null);
198
- var AccordionItemProvider = ({
199
- value: valueProp,
200
- disabled: disabledProp = false,
201
- children
202
- }) => {
203
- const [value, setValue] = (0, import_react8.useState)(valueProp);
204
- const [disabled, setDisabled] = (0, import_react8.useState)(disabledProp);
205
- return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(AccordionItemContext.Provider, { value: { value, setValue, disabled, setDisabled }, children });
206
- };
207
- var useAccordionItemContext = () => {
208
- const context = (0, import_react8.useContext)(AccordionItemContext);
209
- if (!context) {
210
- throw Error("useAccordionItemContext must be used within a AccordionItem provider");
211
- }
212
- return context;
213
- };
214
-
215
- // src/accordion/AccordionItem.tsx
216
- var import_jsx_runtime7 = require("react/jsx-runtime");
217
89
  var Item = ({
218
90
  asChild = false,
219
91
  className,
220
92
  children,
221
- disabled = false,
222
- value,
223
93
  ref,
224
94
  ...props
225
95
  }) => {
226
- const accordion2 = useAccordionContext();
227
- const localProps = {
228
- className: (0, import_class_variance_authority3.cx)(
229
- "relative first:rounded-t-lg last:rounded-b-lg",
230
- "not-last:border-b-0",
231
- { "border-sm border-outline": accordion2.design === "outlined" },
232
- className
233
- ),
234
- asChild,
235
- ...props
236
- };
237
- const itemProps = accordion2.getItemProps({ value, ...disabled && { disabled } });
238
- const mergedProps = (0, import_react9.mergeProps)(itemProps, localProps);
239
- const item = accordion2.getItemState({ value });
240
- const itemContentProps = accordion2.getItemContentProps({ value });
241
- return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(AccordionItemProvider, { value, disabled, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
242
- Collapsible2,
96
+ const accordion = useAccordionContext();
97
+ const renderSlot = useRenderSlot(asChild, "div");
98
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
99
+ import_accordion2.Accordion.Item,
243
100
  {
244
101
  ref,
245
- open: item.expanded,
246
102
  "data-spark-component": "accordion-item",
247
- ids: { content: itemContentProps.id },
248
- ...mergedProps,
103
+ render: renderSlot,
104
+ className: (0, import_class_variance_authority2.cx)(
105
+ "relative first:rounded-t-lg last:rounded-b-lg",
106
+ "not-last:border-b-0",
107
+ { "border-sm border-outline": accordion.design === "outlined" },
108
+ className
109
+ ),
110
+ ...props,
249
111
  children
250
112
  }
251
- ) });
113
+ );
252
114
  };
253
115
  Item.displayName = "Accordion.Item";
254
116
 
255
117
  // src/accordion/AccordionItemContent.tsx
256
- var import_internal_utils = require("@spark-ui/internal-utils");
257
- var import_react10 = require("@zag-js/react");
258
- var import_class_variance_authority4 = require("class-variance-authority");
259
- var import_jsx_runtime8 = require("react/jsx-runtime");
260
- var splitVisibilityProps = (0, import_internal_utils.createSplitProps)();
118
+ var import_accordion3 = require("@base-ui-components/react/accordion");
119
+ var import_class_variance_authority3 = require("class-variance-authority");
120
+ var import_jsx_runtime5 = require("react/jsx-runtime");
261
121
  var ItemContent = ({
262
122
  asChild = false,
263
123
  className,
@@ -265,26 +125,29 @@ var ItemContent = ({
265
125
  ref,
266
126
  ...props
267
127
  }) => {
268
- const accordion2 = useAccordionContext();
269
- const accordionItem = useAccordionItemContext();
270
- const localProps = {
271
- className: (0, import_class_variance_authority4.cx)("[&>:first-child]:p-lg", "text-body-1 text-on-surface", className),
272
- asChild,
273
- ...props
274
- };
275
- const contentProps = accordion2.getItemContentProps({
276
- value: accordionItem.value,
277
- ...accordionItem.disabled && { disabled: accordionItem.disabled }
278
- });
279
- const [, itemContentProps] = splitVisibilityProps(contentProps, ["hidden", "data-state"]);
280
- const mergedProps = (0, import_react10.mergeProps)(itemContentProps, localProps);
281
- return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Collapsible2.Content, { ref, "data-spark-component": "accordion-item-content", ...mergedProps, children });
128
+ const renderSlot = useRenderSlot(asChild, "div");
129
+ return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
130
+ import_accordion3.Accordion.Panel,
131
+ {
132
+ ref,
133
+ "data-spark-component": "accordion-item-content",
134
+ className: (0, import_class_variance_authority3.cx)(
135
+ "[&>:first-child]:p-lg overflow-hidden",
136
+ "h-[var(--accordion-panel-height)] transition-all duration-200 data-[ending-style]:h-0 data-[starting-style]:h-0",
137
+ "text-body-1 text-on-surface",
138
+ className
139
+ ),
140
+ render: renderSlot,
141
+ ...props,
142
+ children
143
+ }
144
+ );
282
145
  };
283
146
  ItemContent.displayName = "Accordion.ItemContent";
284
147
 
285
148
  // src/accordion/AccordionItemHeader.tsx
286
- var import_class_variance_authority5 = require("class-variance-authority");
287
- var import_jsx_runtime9 = require("react/jsx-runtime");
149
+ var import_class_variance_authority4 = require("class-variance-authority");
150
+ var import_jsx_runtime6 = require("react/jsx-runtime");
288
151
  var ItemHeader = ({
289
152
  asChild = false,
290
153
  children,
@@ -292,12 +155,12 @@ var ItemHeader = ({
292
155
  ref
293
156
  }) => {
294
157
  const Component = asChild ? Slot : "h3";
295
- return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
158
+ return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
296
159
  Component,
297
160
  {
298
161
  ref,
299
162
  "data-spark-component": "accordion-item-header",
300
- className: (0, import_class_variance_authority5.cx)("rounded-[inherit]", className),
163
+ className: (0, import_class_variance_authority4.cx)("rounded-[inherit]", className),
301
164
  children
302
165
  }
303
166
  );
@@ -305,18 +168,18 @@ var ItemHeader = ({
305
168
  ItemHeader.displayName = "Accordion.ItemHeader";
306
169
 
307
170
  // src/accordion/AccordionItemTrigger.tsx
171
+ var import_accordion4 = require("@base-ui-components/react/accordion");
308
172
  var import_ArrowHorizontalDown = require("@spark-ui/icons/ArrowHorizontalDown");
309
- var import_react12 = require("@zag-js/react");
310
- var import_class_variance_authority7 = require("class-variance-authority");
173
+ var import_class_variance_authority6 = require("class-variance-authority");
311
174
 
312
175
  // src/icon/Icon.tsx
313
- var import_react11 = require("react");
176
+ var import_react3 = require("react");
314
177
 
315
178
  // src/visually-hidden/VisuallyHidden.tsx
316
- var import_jsx_runtime10 = require("react/jsx-runtime");
179
+ var import_jsx_runtime7 = require("react/jsx-runtime");
317
180
  var VisuallyHidden = ({ asChild = false, ref, ...props }) => {
318
181
  const Component = asChild ? Slot : "span";
319
- return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
182
+ return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
320
183
  Component,
321
184
  {
322
185
  ...props,
@@ -341,14 +204,14 @@ var VisuallyHidden = ({ asChild = false, ref, ...props }) => {
341
204
  VisuallyHidden.displayName = "VisuallyHidden";
342
205
 
343
206
  // src/icon/Icon.styles.tsx
344
- var import_internal_utils2 = require("@spark-ui/internal-utils");
345
- var import_class_variance_authority6 = require("class-variance-authority");
346
- var iconStyles = (0, import_class_variance_authority6.cva)(["fill-current shrink-0"], {
207
+ var import_internal_utils = require("@spark-ui/internal-utils");
208
+ var import_class_variance_authority5 = require("class-variance-authority");
209
+ var iconStyles = (0, import_class_variance_authority5.cva)(["fill-current shrink-0"], {
347
210
  variants: {
348
211
  /**
349
212
  * Color scheme of the icon.
350
213
  */
351
- intent: (0, import_internal_utils2.makeVariants)({
214
+ intent: (0, import_internal_utils.makeVariants)({
352
215
  current: ["text-current"],
353
216
  main: ["text-main"],
354
217
  support: ["text-support"],
@@ -363,7 +226,7 @@ var iconStyles = (0, import_class_variance_authority6.cva)(["fill-current shrink
363
226
  /**
364
227
  * Sets the size of the icon.
365
228
  */
366
- size: (0, import_internal_utils2.makeVariants)({
229
+ size: (0, import_internal_utils.makeVariants)({
367
230
  current: ["u-current-font-size"],
368
231
  sm: ["w-sz-16", "h-sz-16"],
369
232
  md: ["w-sz-24", "h-sz-24"],
@@ -374,7 +237,7 @@ var iconStyles = (0, import_class_variance_authority6.cva)(["fill-current shrink
374
237
  });
375
238
 
376
239
  // src/icon/Icon.tsx
377
- var import_jsx_runtime11 = require("react/jsx-runtime");
240
+ var import_jsx_runtime8 = require("react/jsx-runtime");
378
241
  var Icon = ({
379
242
  label,
380
243
  className,
@@ -383,22 +246,22 @@ var Icon = ({
383
246
  children,
384
247
  ...others
385
248
  }) => {
386
- const child = import_react11.Children.only(children);
387
- return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_jsx_runtime11.Fragment, { children: [
388
- (0, import_react11.cloneElement)(child, {
249
+ const child = import_react3.Children.only(children);
250
+ return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_jsx_runtime8.Fragment, { children: [
251
+ (0, import_react3.cloneElement)(child, {
389
252
  className: iconStyles({ className, size, intent }),
390
253
  "data-spark-component": "icon",
391
254
  "aria-hidden": "true",
392
255
  focusable: "false",
393
256
  ...others
394
257
  }),
395
- label && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(VisuallyHidden, { children: label })
258
+ label && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(VisuallyHidden, { children: label })
396
259
  ] });
397
260
  };
398
261
  Icon.displayName = "Icon";
399
262
 
400
263
  // src/accordion/AccordionItemTrigger.tsx
401
- var import_jsx_runtime12 = require("react/jsx-runtime");
264
+ var import_jsx_runtime9 = require("react/jsx-runtime");
402
265
  var ItemTrigger = ({
403
266
  asChild = false,
404
267
  children,
@@ -406,39 +269,40 @@ var ItemTrigger = ({
406
269
  ref,
407
270
  ...props
408
271
  }) => {
409
- const { getItemTriggerProps } = useAccordionContext();
410
- const { value, disabled } = useAccordionItemContext();
411
- const Component = asChild ? Slot : "button";
412
- const localProps = {
413
- ...props,
414
- className: (0, import_class_variance_authority7.cx)(
415
- "relative flex gap-lg justify-between items-center min-h-sz-48",
416
- "w-full px-lg py-md text-left text-headline-2 text-on-surface rounded-[inherit] data-[state=open]:rounded-b-0",
417
- "hover:enabled:bg-surface-hovered focus:bg-surface-hovered",
418
- "focus-visible:u-outline focus-visible:outline-hidden focus-visible:z-raised",
419
- "disabled:opacity-dim-3 cursor-pointer disabled:cursor-not-allowed",
420
- className
421
- )
422
- };
423
- const mergedProps = (0, import_react12.mergeProps)(
424
- getItemTriggerProps({ value, ...disabled && { disabled } }),
425
- localProps
272
+ const renderSlot = useRenderSlot(asChild, "button");
273
+ return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
274
+ import_accordion4.Accordion.Trigger,
275
+ {
276
+ ref,
277
+ "data-spark-component": "accordion-item-trigger",
278
+ render: renderSlot,
279
+ className: (0, import_class_variance_authority6.cx)(
280
+ "group",
281
+ "gap-lg min-h-sz-48 relative flex items-center justify-between",
282
+ "px-lg py-md text-headline-2 text-on-surface data-[panel-open]:rounded-b-0 w-full rounded-[inherit] text-left",
283
+ "hover:enabled:bg-surface-hovered focus:bg-surface-hovered",
284
+ "focus-visible:u-outline focus-visible:z-raised focus-visible:outline-hidden",
285
+ "disabled:opacity-dim-3 cursor-pointer disabled:cursor-not-allowed",
286
+ className
287
+ ),
288
+ ...props,
289
+ children: [
290
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "gap-lg flex grow items-center", children }),
291
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
292
+ Icon,
293
+ {
294
+ intent: "neutral",
295
+ className: (0, import_class_variance_authority6.cx)(
296
+ "shrink-0 rotate-0 duration-100 ease-in motion-reduce:transition-none",
297
+ "group-data-[panel-open]:rotate-180"
298
+ ),
299
+ size: "sm",
300
+ children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_ArrowHorizontalDown.ArrowHorizontalDown, {})
301
+ }
302
+ )
303
+ ]
304
+ }
426
305
  );
427
- const isOpen = !!mergedProps["aria-expanded"];
428
- return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(Component, { ref, "data-spark-component": "accordion-item-trigger", ...mergedProps, children: [
429
- /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "gap-lg flex grow items-center", children }),
430
- /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
431
- Icon,
432
- {
433
- intent: "neutral",
434
- className: (0, import_class_variance_authority7.cx)("shrink-0 rotate-0 duration-100 ease-in motion-reduce:transition-none", {
435
- "rotate-180": isOpen
436
- }),
437
- size: "sm",
438
- children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_ArrowHorizontalDown.ArrowHorizontalDown, {})
439
- }
440
- )
441
- ] });
442
306
  };
443
307
  ItemTrigger.displayName = "Accordion.ItemTrigger";
444
308
 
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/accordion/index.ts","../../src/accordion/Accordion.tsx","../../src/slot/Slot.tsx","../../src/accordion/AccordionItem.tsx","../../src/collapsible/Collapsible.tsx","../../src/collapsible/CollapsibleContent.tsx","../../src/collapsible/CollapsibleTrigger.tsx","../../src/collapsible/index.ts","../../src/accordion/AccordionItemContext.tsx","../../src/accordion/AccordionItemContent.tsx","../../src/accordion/AccordionItemHeader.tsx","../../src/accordion/AccordionItemTrigger.tsx","../../src/icon/Icon.tsx","../../src/visually-hidden/VisuallyHidden.tsx","../../src/icon/Icon.styles.tsx"],"sourcesContent":["import { Accordion as Root } from './Accordion'\nimport { Item } from './AccordionItem'\nimport { ItemContent } from './AccordionItemContent'\nimport { ItemHeader } from './AccordionItemHeader'\nimport { ItemTrigger } from './AccordionItemTrigger'\n\nexport const Accordion: typeof Root & {\n Item: typeof Item\n ItemHeader: typeof ItemHeader\n ItemTrigger: typeof ItemTrigger\n ItemContent: typeof ItemContent\n} = Object.assign(Root, {\n Item,\n ItemHeader,\n ItemTrigger,\n ItemContent,\n})\n\nAccordion.displayName = 'Accordion'\nItem.displayName = 'Item'\nItemHeader.displayName = 'ItemHeader'\nItemTrigger.displayName = 'Accordion.Trigger'\nItemContent.displayName = 'Accordion.Content'\n\nexport { type AccordionProps } from './Accordion'\nexport { type AccordionItemHeaderProps } from './AccordionItemHeader'\nexport { type AccordionItemContentProps } from './AccordionItemContent'\nexport { type AccordionItemTriggerProps } from './AccordionItemTrigger'\n","import * as accordion from '@zag-js/accordion'\nimport { mergeProps, normalizeProps, type PropTypes, useMachine } from '@zag-js/react'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentPropsWithoutRef, createContext, Ref, useContext, useId } from 'react'\n\nimport { Slot } from '../slot'\n\ntype ExtentedZagInterface = Omit<\n accordion.Props,\n 'id' | 'ids' | 'orientation' | 'getRootNode' | 'onValueChange'\n> &\n Omit<ComponentPropsWithoutRef<'div'>, 'defaultChecked'>\n\nexport interface AccordionProps extends ExtentedZagInterface {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n /**\n * Whether an accordion item can be closed after it has been expanded.\n */\n collapsible?: boolean\n defaultValue?: accordion.Props['value']\n /**\n * Whether the accordion items are disabled\n */\n disabled?: boolean\n /**\n * Whether multiple accordion items can be expanded at the same time.\n */\n multiple?: boolean\n /**\n * The `value` of the accordion items that are currently being expanded.\n */\n value?: string[]\n /**\n * The callback fired when the state of expanded/collapsed accordion items changes.\n */\n onValueChange?: (value: string[]) => void\n design?: 'filled' | 'outlined'\n ref?: Ref<HTMLDivElement>\n}\n\nconst AccordionContext = createContext<\n | (accordion.Api<PropTypes> & {\n design: 'filled' | 'outlined'\n })\n | null\n>(null)\n\nexport const Accordion = ({\n asChild = false,\n children,\n collapsible = true,\n className,\n defaultValue,\n design = 'outlined',\n disabled = false,\n multiple = false,\n value,\n onValueChange,\n ref,\n ...props\n}: AccordionProps) => {\n const [machineProps, localProps] = accordion.splitProps({\n children,\n multiple,\n collapsible,\n value,\n disabled,\n className: cx('bg-surface rounded-lg h-fit', className),\n ...props,\n })\n\n const service = useMachine(accordion.machine, {\n ...machineProps,\n defaultValue,\n value,\n id: useId(),\n onValueChange(details) {\n onValueChange?.(details.value)\n },\n })\n\n const Component = asChild ? Slot : 'div'\n const api = accordion.connect(service, normalizeProps)\n\n const mergedProps = mergeProps(api.getRootProps(), localProps)\n\n return (\n <AccordionContext.Provider value={{ ...api, design }}>\n <Component data-spark-component=\"accordion\" ref={ref} {...mergedProps}>\n {children}\n </Component>\n </AccordionContext.Provider>\n )\n}\n\nAccordion.displayName = 'Accordion'\n\nexport const useAccordionContext = () => {\n const context = useContext(AccordionContext)\n\n if (!context) {\n throw Error('useAccordionContext must be used within a Accordion provider')\n }\n\n return context\n}\n","import { Slot as RadixSlot } from 'radix-ui'\nimport {\n cloneElement,\n HTMLAttributes,\n isValidElement,\n PropsWithChildren,\n ReactNode,\n Ref,\n} from 'react'\n\nexport const Slottable: typeof RadixSlot.Slottable = RadixSlot.Slottable\n\nexport type SlotProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {\n ref?: Ref<HTMLElement>\n}\n\nexport const Slot = ({ ref, ...props }: SlotProps) => {\n return <RadixSlot.Root ref={ref} {...props} />\n}\n\n/**\n * When using Radix `Slot` component, it will consider its first child to merge its props with.\n * In some cases, you might need to wrap the top child with additional markup without breaking this behaviour.\n */\nexport const wrapPolymorphicSlot = (\n asChild: boolean | undefined,\n children: ReactNode,\n callback: (children: ReactNode) => ReactNode\n) => {\n if (!asChild) return callback(children) // If polymorphic behaviour is not used, we keep the original children\n\n return isValidElement(children)\n ? cloneElement(\n children,\n undefined,\n callback((children.props as { children: ReactNode }).children)\n )\n : null\n}\n","import { mergeProps } from '@zag-js/react'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentPropsWithoutRef, Ref } from 'react'\n\nimport { Collapsible } from '../collapsible'\nimport { useAccordionContext } from './Accordion'\nimport { AccordionItemProvider } from './AccordionItemContext'\n\nexport interface AccordionItemProps extends ComponentPropsWithoutRef<'div'> {\n value: string\n asChild?: boolean\n disabled?: boolean\n ref?: Ref<HTMLDivElement>\n}\n\nexport const Item = ({\n asChild = false,\n className,\n children,\n disabled = false,\n value,\n ref,\n ...props\n}: AccordionItemProps) => {\n const accordion = useAccordionContext()\n\n const localProps = {\n className: cx(\n 'relative first:rounded-t-lg last:rounded-b-lg',\n 'not-last:border-b-0',\n { 'border-sm border-outline': accordion.design === 'outlined' },\n className\n ),\n asChild,\n ...props,\n }\n\n const itemProps = accordion.getItemProps({ value, ...(disabled && { disabled }) })\n const mergedProps = mergeProps(itemProps, localProps)\n\n const item = accordion.getItemState({ value })\n const itemContentProps = accordion.getItemContentProps({ value })\n\n return (\n <AccordionItemProvider value={value} disabled={disabled}>\n <Collapsible\n ref={ref}\n open={item.expanded}\n data-spark-component=\"accordion-item\"\n ids={{ content: itemContentProps.id }}\n {...mergedProps}\n >\n {children}\n </Collapsible>\n </AccordionItemProvider>\n )\n}\n\nItem.displayName = 'Accordion.Item'\n","import * as collapsible from '@zag-js/collapsible'\nimport { mergeProps, normalizeProps, type PropTypes, useMachine } from '@zag-js/react'\nimport { type ComponentProps, createContext, Ref, useContext, useId } from 'react'\n\nimport { Slot } from '../slot'\n\nexport interface CollapsibleProps extends ComponentProps<'div'> {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n /**\n * The open state of the collapsible when it is initially rendered. Use when you do not need to control its open state.\n */\n defaultOpen?: boolean\n /**\n * When `true`, prevents the user from interacting with the collapsible.\n */\n disabled?: boolean\n /**\n * Event handler called when the open state of the collapsible changes.\n */\n onOpenChange?: (open: boolean) => void\n /**\n * The controlled open state of the collapsible. Must be used in conjunction with `onOpenChange`.\n */\n open?: boolean\n /**\n * The ids of the elements in the collapsible. Useful for composition\n */\n ids?: collapsible.Props['ids']\n ref?: Ref<HTMLDivElement>\n}\n\nconst CollapsibleContext = createContext<collapsible.Api<PropTypes> | null>(null)\n\nexport const Collapsible = ({\n asChild = false,\n children,\n defaultOpen = false,\n disabled = false,\n onOpenChange,\n open,\n ids,\n ref,\n ...props\n}: CollapsibleProps) => {\n const service = useMachine(collapsible.machine, {\n open,\n defaultOpen,\n disabled,\n id: useId(),\n ids,\n onOpenChange(details) {\n onOpenChange?.(details.open)\n },\n })\n const api = collapsible.connect(service, normalizeProps)\n const Component = asChild ? Slot : 'div'\n\n const mergedProps = mergeProps(api.getRootProps(), props)\n\n return (\n <CollapsibleContext.Provider value={api}>\n <Component data-spark-component=\"collapsible\" ref={ref} {...mergedProps}>\n {children}\n </Component>\n </CollapsibleContext.Provider>\n )\n}\n\nCollapsible.displayName = 'Collapsible'\n\nexport const useCollapsibleContext = () => {\n const context = useContext(CollapsibleContext)\n\n if (!context) {\n throw Error('useCollapsibleContext must be used within a Collapsible provider')\n }\n\n return context\n}\n","import { mergeProps } from '@zag-js/react'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentPropsWithoutRef, Ref } from 'react'\n\nimport { Slot } from '../slot'\nimport { useCollapsibleContext } from './Collapsible'\n\nexport interface CollapsibleContentProps extends ComponentPropsWithoutRef<'div'> {\n asChild?: boolean\n ref?: Ref<HTMLDivElement>\n}\n\nexport const Content = ({\n asChild = false,\n className,\n children,\n ref,\n ...props\n}: CollapsibleContentProps) => {\n const { getContentProps } = useCollapsibleContext()\n\n const Component = asChild ? Slot : 'div'\n const contentProps = getContentProps()\n const mergedProps = mergeProps(contentProps, {\n className: cx(\n 'overflow-hidden',\n 'motion-reduce:animate-none!',\n '[&[hidden]]:hidden',\n 'data-[state=open]:animate-standalone-collapse-in data-[state=closed]:animate-standalone-collapse-out',\n className\n ),\n ...props,\n })\n\n return (\n <Component ref={ref} data-spark-component=\"collapsible-content\" {...mergedProps}>\n {children}\n </Component>\n )\n}\n\nContent.displayName = 'Collapsible.Content'\n","import { mergeProps } from '@zag-js/react'\nimport { type ComponentPropsWithoutRef, Ref } from 'react'\n\nimport { Slot } from '../slot'\nimport { useCollapsibleContext } from './Collapsible'\n\nexport interface CollapsibleTriggerProps extends ComponentPropsWithoutRef<'button'> {\n asChild?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const Trigger = ({ asChild = false, children, ref, ...props }: CollapsibleTriggerProps) => {\n const collapsibleContext = useCollapsibleContext()\n const Component = asChild ? Slot : 'button'\n const mergedProps = mergeProps(collapsibleContext.getTriggerProps(), props)\n\n return (\n <Component ref={ref} data-spark-component=\"collapsible-trigger\" {...mergedProps}>\n {children}\n </Component>\n )\n}\n\nTrigger.displayName = 'Collapsible.Trigger'\n","import { Collapsible as Root } from './Collapsible'\nimport { Content } from './CollapsibleContent'\nimport { Trigger } from './CollapsibleTrigger'\n\nexport const Collapsible: typeof Root & {\n Trigger: typeof Trigger\n Content: typeof Content\n} = Object.assign(Root, {\n Trigger,\n Content,\n})\n\nCollapsible.displayName = 'Collapsible'\nTrigger.displayName = 'Collapsible.Trigger'\nContent.displayName = 'Collapsible.Content'\n\nexport { type CollapsibleProps } from './Collapsible'\nexport { type CollapsibleContentProps } from './CollapsibleContent'\nexport { type CollapsibleTriggerProps } from './CollapsibleTrigger'\n","import {\n createContext,\n Dispatch,\n type PropsWithChildren,\n SetStateAction,\n useContext,\n useState,\n} from 'react'\n\ninterface AccordionItemContextState {\n value: string\n setValue: Dispatch<SetStateAction<string>>\n disabled: boolean\n setDisabled: Dispatch<SetStateAction<boolean>>\n}\n\nconst AccordionItemContext = createContext<AccordionItemContextState | null>(null)\n\nexport const AccordionItemProvider = ({\n value: valueProp,\n disabled: disabledProp = false,\n children,\n}: PropsWithChildren<{ value: string; disabled?: boolean }>) => {\n const [value, setValue] = useState<string>(valueProp)\n const [disabled, setDisabled] = useState<boolean>(disabledProp)\n\n return (\n <AccordionItemContext.Provider value={{ value, setValue, disabled, setDisabled }}>\n {children}\n </AccordionItemContext.Provider>\n )\n}\n\nexport const useAccordionItemContext = () => {\n const context = useContext(AccordionItemContext)\n\n if (!context) {\n throw Error('useAccordionItemContext must be used within a AccordionItem provider')\n }\n\n return context\n}\n","import { createSplitProps } from '@spark-ui/internal-utils'\nimport { mergeProps } from '@zag-js/react'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentPropsWithoutRef, Ref } from 'react'\n\nimport { Collapsible } from '../collapsible'\nimport { useAccordionContext } from './Accordion'\nimport { useAccordionItemContext } from './AccordionItemContext'\n\nexport interface AccordionItemContentProps extends ComponentPropsWithoutRef<'div'> {\n asChild?: boolean\n ref?: Ref<HTMLDivElement>\n}\n\nconst splitVisibilityProps = createSplitProps<{\n hidden?: boolean\n 'data-state'?: string\n}>()\n\nexport const ItemContent = ({\n asChild = false,\n className,\n children,\n ref,\n ...props\n}: AccordionItemContentProps) => {\n const accordion = useAccordionContext()\n const accordionItem = useAccordionItemContext()\n\n const localProps = {\n className: cx('[&>:first-child]:p-lg', 'text-body-1 text-on-surface', className),\n asChild,\n ...props,\n }\n const contentProps = accordion.getItemContentProps({\n value: accordionItem.value,\n ...(accordionItem.disabled && { disabled: accordionItem.disabled }),\n })\n\n const [, itemContentProps] = splitVisibilityProps(contentProps, ['hidden', 'data-state'])\n\n const mergedProps = mergeProps(itemContentProps, localProps)\n\n return (\n <Collapsible.Content ref={ref} data-spark-component=\"accordion-item-content\" {...mergedProps}>\n {children}\n </Collapsible.Content>\n )\n}\n\nItemContent.displayName = 'Accordion.ItemContent'\n","import { cx } from 'class-variance-authority'\nimport { type ComponentProps, Ref } from 'react'\n\nimport { Slot } from '../slot'\n\nexport interface AccordionItemHeaderProps extends ComponentProps<'h3'> {\n asChild?: boolean\n ref?: Ref<HTMLHeadingElement>\n}\n\nexport const ItemHeader = ({\n asChild = false,\n children,\n className,\n ref,\n}: AccordionItemHeaderProps) => {\n const Component = asChild ? Slot : 'h3'\n\n return (\n <Component\n ref={ref}\n data-spark-component=\"accordion-item-header\"\n className={cx('rounded-[inherit]', className)}\n >\n {children}\n </Component>\n )\n}\n\nItemHeader.displayName = 'Accordion.ItemHeader'\n","import { ArrowHorizontalDown } from '@spark-ui/icons/ArrowHorizontalDown'\nimport { mergeProps } from '@zag-js/react'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentPropsWithoutRef, Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { Slot } from '../slot'\nimport { useAccordionContext } from './Accordion'\nimport { useAccordionItemContext } from './AccordionItemContext'\n\nexport interface AccordionItemTriggerProps extends ComponentPropsWithoutRef<'button'> {\n asChild?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const ItemTrigger = ({\n asChild = false,\n children,\n className,\n ref,\n ...props\n}: AccordionItemTriggerProps) => {\n const { getItemTriggerProps } = useAccordionContext()\n const { value, disabled } = useAccordionItemContext()\n\n const Component = asChild ? Slot : 'button'\n\n const localProps = {\n ...props,\n className: cx(\n 'relative flex gap-lg justify-between items-center min-h-sz-48',\n 'w-full px-lg py-md text-left text-headline-2 text-on-surface rounded-[inherit] data-[state=open]:rounded-b-0',\n 'hover:enabled:bg-surface-hovered focus:bg-surface-hovered',\n 'focus-visible:u-outline focus-visible:outline-hidden focus-visible:z-raised',\n 'disabled:opacity-dim-3 cursor-pointer disabled:cursor-not-allowed',\n className\n ),\n }\n\n const mergedProps = mergeProps(\n getItemTriggerProps({ value, ...(disabled && { disabled }) }),\n localProps\n )\n\n const isOpen = !!mergedProps['aria-expanded']\n\n return (\n <Component ref={ref} data-spark-component=\"accordion-item-trigger\" {...mergedProps}>\n <div className=\"gap-lg flex grow items-center\">{children}</div>\n <Icon\n intent=\"neutral\"\n className={cx('shrink-0 rotate-0 duration-100 ease-in motion-reduce:transition-none', {\n 'rotate-180': isOpen,\n })}\n size=\"sm\"\n >\n <ArrowHorizontalDown />\n </Icon>\n </Component>\n )\n}\n\nItemTrigger.displayName = 'Accordion.ItemTrigger'\n","import { Children, cloneElement, ComponentPropsWithoutRef, ReactElement, ReactNode } from 'react'\n\nimport { VisuallyHidden } from '../visually-hidden'\nimport { iconStyles, IconVariantsProps } from './Icon.styles'\n\nexport interface IconProps extends IconVariantsProps, ComponentPropsWithoutRef<'svg'> {\n /**\n * The svg icon that will be wrapped\n */\n children: ReactNode\n /**\n * The accessible label for the icon. This label will be visually hidden but announced to screen\n * reader users, similar to `alt` text for `img` tags.\n */\n label?: string\n}\n\nexport const Icon = ({\n label,\n className,\n size = 'current',\n intent = 'current',\n children,\n ...others\n}: IconProps) => {\n const child = Children.only(children)\n\n return (\n <>\n {cloneElement(child as ReactElement<Record<string, any>>, {\n className: iconStyles({ className, size, intent }),\n 'data-spark-component': 'icon',\n 'aria-hidden': 'true',\n focusable: 'false',\n ...others,\n })}\n\n {label && <VisuallyHidden>{label}</VisuallyHidden>}\n </>\n )\n}\n\nIcon.displayName = 'Icon'\n","import { HTMLAttributes, PropsWithChildren, Ref } from 'react'\n\nimport { Slot } from '../slot'\n\nexport type VisuallyHiddenProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLElement>\n}\n\nexport const VisuallyHidden = ({ asChild = false, ref, ...props }: VisuallyHiddenProps) => {\n const Component = asChild ? Slot : 'span'\n\n return (\n <Component\n {...props}\n ref={ref}\n style={{\n // See: https://github.com/twbs/bootstrap/blob/main/scss/mixins/_visually-hidden.scss\n position: 'absolute',\n border: 0,\n width: 1,\n height: 1,\n padding: 0,\n margin: -1,\n overflow: 'hidden',\n clip: 'rect(0, 0, 0, 0)',\n whiteSpace: 'nowrap',\n wordWrap: 'normal',\n ...props.style,\n }}\n />\n )\n}\n\nVisuallyHidden.displayName = 'VisuallyHidden'\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const iconStyles = cva(['fill-current shrink-0'], {\n variants: {\n /**\n * Color scheme of the icon.\n */\n intent: makeVariants<\n 'intent',\n [\n 'current',\n 'main',\n 'support',\n 'accent',\n 'basic',\n 'success',\n 'alert',\n 'error',\n 'info',\n 'neutral',\n ]\n >({\n current: ['text-current'],\n main: ['text-main'],\n support: ['text-support'],\n accent: ['text-accent'],\n basic: ['text-basic'],\n success: ['text-success'],\n alert: ['text-alert'],\n error: ['text-error'],\n info: ['text-info'],\n neutral: ['text-neutral'],\n }),\n /**\n * Sets the size of the icon.\n */\n size: makeVariants<'size', ['current', 'sm', 'md', 'lg', 'xl']>({\n current: ['u-current-font-size'],\n sm: ['w-sz-16', 'h-sz-16'],\n md: ['w-sz-24', 'h-sz-24'],\n lg: ['w-sz-32', 'h-sz-32'],\n xl: ['w-sz-40', 'h-sz-40'],\n }),\n },\n})\n\nexport type IconVariantsProps = VariantProps<typeof iconStyles>\n"],"mappings":"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","names":["Accordion","import_react","RadixSlot","import_jsx_runtime","collapsible","import_react","import_class_variance_authority","import_react","import_jsx_runtime","import_react","import_class_variance_authority","import_jsx_runtime","import_react","import_jsx_runtime","Collapsible","import_react","import_jsx_runtime","import_jsx_runtime","accordion","Collapsible","import_react","import_class_variance_authority","import_jsx_runtime","accordion","Collapsible","import_class_variance_authority","import_jsx_runtime","import_react","import_class_variance_authority","import_react","import_jsx_runtime","import_internal_utils","import_class_variance_authority","import_jsx_runtime","import_jsx_runtime","Accordion"]}
1
+ {"version":3,"sources":["../../src/accordion/index.ts","../../src/accordion/Accordion.tsx","../../src/slot/Slot.tsx","../../src/accordion/useRenderSlot.tsx","../../src/accordion/AccordionItem.tsx","../../src/accordion/AccordionItemContent.tsx","../../src/accordion/AccordionItemHeader.tsx","../../src/accordion/AccordionItemTrigger.tsx","../../src/icon/Icon.tsx","../../src/visually-hidden/VisuallyHidden.tsx","../../src/icon/Icon.styles.tsx"],"sourcesContent":["import { Accordion as Root } from './Accordion'\nimport { Item } from './AccordionItem'\nimport { ItemContent } from './AccordionItemContent'\nimport { ItemHeader } from './AccordionItemHeader'\nimport { ItemTrigger } from './AccordionItemTrigger'\n\nexport const Accordion: typeof Root & {\n Item: typeof Item\n ItemHeader: typeof ItemHeader\n ItemTrigger: typeof ItemTrigger\n ItemContent: typeof ItemContent\n} = Object.assign(Root, {\n Item,\n ItemHeader,\n ItemTrigger,\n ItemContent,\n})\n\nAccordion.displayName = 'Accordion'\nItem.displayName = 'Item'\nItemHeader.displayName = 'ItemHeader'\nItemTrigger.displayName = 'Accordion.Trigger'\nItemContent.displayName = 'Accordion.Content'\n\nexport { type AccordionProps } from './Accordion'\nexport { type AccordionItemHeaderProps } from './AccordionItemHeader'\nexport { type AccordionItemContentProps } from './AccordionItemContent'\nexport { type AccordionItemTriggerProps } from './AccordionItemTrigger'\n","import { Accordion as BaseAccordion } from '@base-ui-components/react/accordion'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, createContext, Ref, useContext } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\ntype ExtentedZagInterface = Omit<\n ComponentProps<typeof BaseAccordion.Root>,\n 'openMultiple' | 'render'\n>\n\nexport interface AccordionProps extends ExtentedZagInterface {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n /**\n * Whether the accordion items are disabled\n */\n disabled?: boolean\n /**\n * Whether multiple items can be open at the same time.\n */\n multiple?: boolean\n design?: 'filled' | 'outlined'\n ref?: Ref<HTMLDivElement>\n}\n\nconst AccordionContext = createContext<{\n design: 'filled' | 'outlined'\n} | null>(null)\n\nexport const Accordion = ({\n asChild = false,\n children,\n design = 'outlined',\n hiddenUntilFound = true,\n multiple = false,\n className,\n ref,\n ...props\n}: AccordionProps) => {\n const renderSlot = useRenderSlot(asChild, 'div')\n\n return (\n <AccordionContext.Provider value={{ design }}>\n <BaseAccordion.Root\n data-spark-component=\"accordion\"\n ref={ref}\n openMultiple={multiple}\n hiddenUntilFound={hiddenUntilFound}\n className={cx('bg-surface h-fit rounded-lg', className)}\n render={renderSlot}\n {...props}\n >\n {children}\n </BaseAccordion.Root>\n </AccordionContext.Provider>\n )\n}\n\nAccordion.displayName = 'Accordion'\n\nexport const useAccordionContext = () => {\n const context = useContext(AccordionContext)\n\n if (!context) {\n throw Error('useAccordionContext must be used within a Accordion provider')\n }\n\n return context\n}\n","import { Slot as RadixSlot } from 'radix-ui'\nimport {\n cloneElement,\n HTMLAttributes,\n isValidElement,\n PropsWithChildren,\n ReactNode,\n Ref,\n} from 'react'\n\nexport const Slottable: typeof RadixSlot.Slottable = RadixSlot.Slottable\n\nexport type SlotProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {\n ref?: Ref<HTMLElement>\n}\n\nexport const Slot = ({ ref, ...props }: SlotProps) => {\n return <RadixSlot.Root ref={ref} {...props} />\n}\n\n/**\n * When using Radix `Slot` component, it will consider its first child to merge its props with.\n * In some cases, you might need to wrap the top child with additional markup without breaking this behaviour.\n */\nexport const wrapPolymorphicSlot = (\n asChild: boolean | undefined,\n children: ReactNode,\n callback: (children: ReactNode) => ReactNode\n) => {\n if (!asChild) return callback(children) // If polymorphic behaviour is not used, we keep the original children\n\n return isValidElement(children)\n ? cloneElement(\n children,\n undefined,\n callback((children.props as { children: ReactNode }).children)\n )\n : null\n}\n","import { Slot } from '../slot'\n\nexport function useRenderSlot(asChild: boolean, defaultTag: string) {\n const Component = asChild ? Slot : defaultTag\n\n return asChild ? ({ ...props }) => <Component {...props} /> : undefined\n}\n","import { Accordion as BaseAccordion } from '@base-ui-components/react/accordion'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentProps, Ref } from 'react'\n\nimport { useAccordionContext } from './Accordion'\nimport { useRenderSlot } from './useRenderSlot'\n\ntype ExtentedZagInterface = Omit<ComponentProps<typeof BaseAccordion.Item>, 'render'>\n\nexport interface AccordionItemProps extends ExtentedZagInterface {\n asChild?: boolean\n ref?: Ref<HTMLDivElement>\n}\n\nexport const Item = ({\n asChild = false,\n className,\n children,\n ref,\n ...props\n}: AccordionItemProps) => {\n const accordion = useAccordionContext()\n\n const renderSlot = useRenderSlot(asChild, 'div')\n\n return (\n <BaseAccordion.Item\n ref={ref}\n data-spark-component=\"accordion-item\"\n render={renderSlot}\n className={cx(\n 'relative first:rounded-t-lg last:rounded-b-lg',\n 'not-last:border-b-0',\n { 'border-sm border-outline': accordion.design === 'outlined' },\n className\n )}\n {...props}\n >\n {children}\n </BaseAccordion.Item>\n )\n}\n\nItem.displayName = 'Accordion.Item'\n","import { Accordion as BaseAccordion } from '@base-ui-components/react/accordion'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentProps, Ref } from 'react'\n\nimport { useRenderSlot } from './useRenderSlot'\n\ntype ExtentedZagInterface = Omit<ComponentProps<typeof BaseAccordion.Panel>, 'render'>\n\nexport interface AccordionItemContentProps extends ExtentedZagInterface {\n asChild?: boolean\n ref?: Ref<HTMLDivElement>\n}\n\nexport const ItemContent = ({\n asChild = false,\n className,\n children,\n ref,\n ...props\n}: AccordionItemContentProps) => {\n const renderSlot = useRenderSlot(asChild, 'div')\n\n return (\n <BaseAccordion.Panel\n ref={ref}\n data-spark-component=\"accordion-item-content\"\n className={cx(\n '[&>:first-child]:p-lg overflow-hidden',\n 'h-[var(--accordion-panel-height)] transition-all duration-200 data-[ending-style]:h-0 data-[starting-style]:h-0',\n 'text-body-1 text-on-surface',\n className\n )}\n render={renderSlot}\n {...props}\n >\n {children}\n </BaseAccordion.Panel>\n )\n}\n\nItemContent.displayName = 'Accordion.ItemContent'\n","import { cx } from 'class-variance-authority'\nimport { type ComponentProps, Ref } from 'react'\n\nimport { Slot } from '../slot'\n\nexport interface AccordionItemHeaderProps extends ComponentProps<'h3'> {\n asChild?: boolean\n ref?: Ref<HTMLHeadingElement>\n}\n\nexport const ItemHeader = ({\n asChild = false,\n children,\n className,\n ref,\n}: AccordionItemHeaderProps) => {\n const Component = asChild ? Slot : 'h3'\n\n return (\n <Component\n ref={ref}\n data-spark-component=\"accordion-item-header\"\n className={cx('rounded-[inherit]', className)}\n >\n {children}\n </Component>\n )\n}\n\nItemHeader.displayName = 'Accordion.ItemHeader'\n","import { Accordion as BaseAccordion } from '@base-ui-components/react/accordion'\nimport { ArrowHorizontalDown } from '@spark-ui/icons/ArrowHorizontalDown'\nimport { cx } from 'class-variance-authority'\nimport { type ComponentProps, Ref } from 'react'\n\nimport { Icon } from '../icon'\nimport { useRenderSlot } from './useRenderSlot'\n\ntype ExtentedZagInterface = Omit<ComponentProps<typeof BaseAccordion.Trigger>, 'render'>\n\nexport interface AccordionItemTriggerProps extends ExtentedZagInterface {\n asChild?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const ItemTrigger = ({\n asChild = false,\n children,\n className,\n ref,\n ...props\n}: AccordionItemTriggerProps) => {\n const renderSlot = useRenderSlot(asChild, 'button')\n\n return (\n <BaseAccordion.Trigger\n ref={ref}\n data-spark-component=\"accordion-item-trigger\"\n render={renderSlot}\n className={cx(\n 'group',\n 'gap-lg min-h-sz-48 relative flex items-center justify-between',\n 'px-lg py-md text-headline-2 text-on-surface data-[panel-open]:rounded-b-0 w-full rounded-[inherit] text-left',\n 'hover:enabled:bg-surface-hovered focus:bg-surface-hovered',\n 'focus-visible:u-outline focus-visible:z-raised focus-visible:outline-hidden',\n 'disabled:opacity-dim-3 cursor-pointer disabled:cursor-not-allowed',\n className\n )}\n {...props}\n >\n <div className=\"gap-lg flex grow items-center\">{children}</div>\n <Icon\n intent=\"neutral\"\n className={cx(\n 'shrink-0 rotate-0 duration-100 ease-in motion-reduce:transition-none',\n 'group-data-[panel-open]:rotate-180'\n )}\n size=\"sm\"\n >\n <ArrowHorizontalDown />\n </Icon>\n </BaseAccordion.Trigger>\n )\n}\n\nItemTrigger.displayName = 'Accordion.ItemTrigger'\n","import { Children, cloneElement, ComponentPropsWithoutRef, ReactElement, ReactNode } from 'react'\n\nimport { VisuallyHidden } from '../visually-hidden'\nimport { iconStyles, IconVariantsProps } from './Icon.styles'\n\nexport interface IconProps extends IconVariantsProps, ComponentPropsWithoutRef<'svg'> {\n /**\n * The svg icon that will be wrapped\n */\n children: ReactNode\n /**\n * The accessible label for the icon. This label will be visually hidden but announced to screen\n * reader users, similar to `alt` text for `img` tags.\n */\n label?: string\n}\n\nexport const Icon = ({\n label,\n className,\n size = 'current',\n intent = 'current',\n children,\n ...others\n}: IconProps) => {\n const child = Children.only(children)\n\n return (\n <>\n {cloneElement(child as ReactElement<Record<string, any>>, {\n className: iconStyles({ className, size, intent }),\n 'data-spark-component': 'icon',\n 'aria-hidden': 'true',\n focusable: 'false',\n ...others,\n })}\n\n {label && <VisuallyHidden>{label}</VisuallyHidden>}\n </>\n )\n}\n\nIcon.displayName = 'Icon'\n","import { HTMLAttributes, PropsWithChildren, Ref } from 'react'\n\nimport { Slot } from '../slot'\n\nexport type VisuallyHiddenProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLElement>\n}\n\nexport const VisuallyHidden = ({ asChild = false, ref, ...props }: VisuallyHiddenProps) => {\n const Component = asChild ? Slot : 'span'\n\n return (\n <Component\n {...props}\n ref={ref}\n style={{\n // See: https://github.com/twbs/bootstrap/blob/main/scss/mixins/_visually-hidden.scss\n position: 'absolute',\n border: 0,\n width: 1,\n height: 1,\n padding: 0,\n margin: -1,\n overflow: 'hidden',\n clip: 'rect(0, 0, 0, 0)',\n whiteSpace: 'nowrap',\n wordWrap: 'normal',\n ...props.style,\n }}\n />\n )\n}\n\nVisuallyHidden.displayName = 'VisuallyHidden'\n","import { makeVariants } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nexport const iconStyles = cva(['fill-current shrink-0'], {\n variants: {\n /**\n * Color scheme of the icon.\n */\n intent: makeVariants<\n 'intent',\n [\n 'current',\n 'main',\n 'support',\n 'accent',\n 'basic',\n 'success',\n 'alert',\n 'error',\n 'info',\n 'neutral',\n ]\n >({\n current: ['text-current'],\n main: ['text-main'],\n support: ['text-support'],\n accent: ['text-accent'],\n basic: ['text-basic'],\n success: ['text-success'],\n alert: ['text-alert'],\n error: ['text-error'],\n info: ['text-info'],\n neutral: ['text-neutral'],\n }),\n /**\n * Sets the size of the icon.\n */\n size: makeVariants<'size', ['current', 'sm', 'md', 'lg', 'xl']>({\n current: ['u-current-font-size'],\n sm: ['w-sz-16', 'h-sz-16'],\n md: ['w-sz-24', 'h-sz-24'],\n lg: ['w-sz-32', 'h-sz-32'],\n xl: ['w-sz-40', 'h-sz-40'],\n }),\n },\n})\n\nexport type IconVariantsProps = VariantProps<typeof iconStyles>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA,mBAAAA;AAAA;AAAA;;;ACAA,uBAA2C;AAC3C,sCAAmB;AACnB,IAAAC,gBAA+D;;;ACF/D,sBAAkC;AAClC,mBAOO;AASE;AAPF,IAAM,YAAwC,gBAAAC,KAAU;AAMxD,IAAM,OAAO,CAAC,EAAE,KAAK,GAAG,MAAM,MAAiB;AACpD,SAAO,4CAAC,gBAAAA,KAAU,MAAV,EAAe,KAAW,GAAG,OAAO;AAC9C;;;ACbqC,IAAAC,sBAAA;AAH9B,SAAS,cAAc,SAAkB,YAAoB;AAClE,QAAM,YAAY,UAAU,OAAO;AAEnC,SAAO,UAAU,CAAC,EAAE,GAAG,MAAM,MAAM,6CAAC,aAAW,GAAG,OAAO,IAAK;AAChE;;;AFwCM,IAAAC,sBAAA;AAlBN,IAAM,uBAAmB,6BAEf,IAAI;AAEP,IAAM,YAAY,CAAC;AAAA,EACxB,UAAU;AAAA,EACV;AAAA,EACA,SAAS;AAAA,EACT,mBAAmB;AAAA,EACnB,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAsB;AACpB,QAAM,aAAa,cAAc,SAAS,KAAK;AAE/C,SACE,6CAAC,iBAAiB,UAAjB,EAA0B,OAAO,EAAE,OAAO,GACzC;AAAA,IAAC,iBAAAC,UAAc;AAAA,IAAd;AAAA,MACC,wBAAqB;AAAA,MACrB;AAAA,MACA,cAAc;AAAA,MACd;AAAA,MACA,eAAW,oCAAG,+BAA+B,SAAS;AAAA,MACtD,QAAQ;AAAA,MACP,GAAG;AAAA,MAEH;AAAA;AAAA,EACH,GACF;AAEJ;AAEA,UAAU,cAAc;AAEjB,IAAM,sBAAsB,MAAM;AACvC,QAAM,cAAU,0BAAW,gBAAgB;AAE3C,MAAI,CAAC,SAAS;AACZ,UAAM,MAAM,8DAA8D;AAAA,EAC5E;AAEA,SAAO;AACT;;;AGvEA,IAAAC,oBAA2C;AAC3C,IAAAC,mCAAmB;AAyBf,IAAAC,sBAAA;AAZG,IAAM,OAAO,CAAC;AAAA,EACnB,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAA0B;AACxB,QAAM,YAAY,oBAAoB;AAEtC,QAAM,aAAa,cAAc,SAAS,KAAK;AAE/C,SACE;AAAA,IAAC,kBAAAC,UAAc;AAAA,IAAd;AAAA,MACC;AAAA,MACA,wBAAqB;AAAA,MACrB,QAAQ;AAAA,MACR,eAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA,EAAE,4BAA4B,UAAU,WAAW,WAAW;AAAA,QAC9D;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEH;AAAA;AAAA,EACH;AAEJ;AAEA,KAAK,cAAc;;;AC3CnB,IAAAC,oBAA2C;AAC3C,IAAAC,mCAAmB;AAsBf,IAAAC,sBAAA;AAVG,IAAM,cAAc,CAAC;AAAA,EAC1B,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAiC;AAC/B,QAAM,aAAa,cAAc,SAAS,KAAK;AAE/C,SACE;AAAA,IAAC,kBAAAC,UAAc;AAAA,IAAd;AAAA,MACC;AAAA,MACA,wBAAqB;AAAA,MACrB,eAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MACA,QAAQ;AAAA,MACP,GAAG;AAAA,MAEH;AAAA;AAAA,EACH;AAEJ;AAEA,YAAY,cAAc;;;ACxC1B,IAAAC,mCAAmB;AAmBf,IAAAC,sBAAA;AATG,IAAM,aAAa,CAAC;AAAA,EACzB,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA;AACF,MAAgC;AAC9B,QAAM,YAAY,UAAU,OAAO;AAEnC,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,wBAAqB;AAAA,MACrB,eAAW,qCAAG,qBAAqB,SAAS;AAAA,MAE3C;AAAA;AAAA,EACH;AAEJ;AAEA,WAAW,cAAc;;;AC7BzB,IAAAC,oBAA2C;AAC3C,iCAAoC;AACpC,IAAAC,mCAAmB;;;ACFnB,IAAAC,gBAA0F;;;ACgBtF,IAAAC,sBAAA;AAJG,IAAM,iBAAiB,CAAC,EAAE,UAAU,OAAO,KAAK,GAAG,MAAM,MAA2B;AACzF,QAAM,YAAY,UAAU,OAAO;AAEnC,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ;AAAA,MACA,OAAO;AAAA;AAAA,QAEL,UAAU;AAAA,QACV,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,SAAS;AAAA,QACT,QAAQ;AAAA,QACR,UAAU;AAAA,QACV,MAAM;AAAA,QACN,YAAY;AAAA,QACZ,UAAU;AAAA,QACV,GAAG,MAAM;AAAA,MACX;AAAA;AAAA,EACF;AAEJ;AAEA,eAAe,cAAc;;;ACrC7B,4BAA6B;AAC7B,IAAAC,mCAAkC;AAE3B,IAAM,iBAAa,sCAAI,CAAC,uBAAuB,GAAG;AAAA,EACvD,UAAU;AAAA;AAAA;AAAA;AAAA,IAIR,YAAQ,oCAcN;AAAA,MACA,SAAS,CAAC,cAAc;AAAA,MACxB,MAAM,CAAC,WAAW;AAAA,MAClB,SAAS,CAAC,cAAc;AAAA,MACxB,QAAQ,CAAC,aAAa;AAAA,MACtB,OAAO,CAAC,YAAY;AAAA,MACpB,SAAS,CAAC,cAAc;AAAA,MACxB,OAAO,CAAC,YAAY;AAAA,MACpB,OAAO,CAAC,YAAY;AAAA,MACpB,MAAM,CAAC,WAAW;AAAA,MAClB,SAAS,CAAC,cAAc;AAAA,IAC1B,CAAC;AAAA;AAAA;AAAA;AAAA,IAID,UAAM,oCAA0D;AAAA,MAC9D,SAAS,CAAC,qBAAqB;AAAA,MAC/B,IAAI,CAAC,WAAW,SAAS;AAAA,MACzB,IAAI,CAAC,WAAW,SAAS;AAAA,MACzB,IAAI,CAAC,WAAW,SAAS;AAAA,MACzB,IAAI,CAAC,WAAW,SAAS;AAAA,IAC3B,CAAC;AAAA,EACH;AACF,CAAC;;;AFjBG,IAAAC,sBAAA;AAXG,IAAM,OAAO,CAAC;AAAA,EACnB;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,SAAS;AAAA,EACT;AAAA,EACA,GAAG;AACL,MAAiB;AACf,QAAM,QAAQ,uBAAS,KAAK,QAAQ;AAEpC,SACE,8EACG;AAAA,oCAAa,OAA4C;AAAA,MACxD,WAAW,WAAW,EAAE,WAAW,MAAM,OAAO,CAAC;AAAA,MACjD,wBAAwB;AAAA,MACxB,eAAe;AAAA,MACf,WAAW;AAAA,MACX,GAAG;AAAA,IACL,CAAC;AAAA,IAEA,SAAS,6CAAC,kBAAgB,iBAAM;AAAA,KACnC;AAEJ;AAEA,KAAK,cAAc;;;ADjBf,IAAAC,sBAAA;AAVG,IAAM,cAAc,CAAC;AAAA,EAC1B,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAiC;AAC/B,QAAM,aAAa,cAAc,SAAS,QAAQ;AAElD,SACE;AAAA,IAAC,kBAAAC,UAAc;AAAA,IAAd;AAAA,MACC;AAAA,MACA,wBAAqB;AAAA,MACrB,QAAQ;AAAA,MACR,eAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA,MAEJ;AAAA,qDAAC,SAAI,WAAU,iCAAiC,UAAS;AAAA,QACzD;AAAA,UAAC;AAAA;AAAA,YACC,QAAO;AAAA,YACP,eAAW;AAAA,cACT;AAAA,cACA;AAAA,YACF;AAAA,YACA,MAAK;AAAA,YAEL,uDAAC,kDAAoB;AAAA;AAAA,QACvB;AAAA;AAAA;AAAA,EACF;AAEJ;AAEA,YAAY,cAAc;;;APjDnB,IAAMC,aAKT,OAAO,OAAO,WAAM;AAAA,EACtB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,CAAC;AAEDA,WAAU,cAAc;AACxB,KAAK,cAAc;AACnB,WAAW,cAAc;AACzB,YAAY,cAAc;AAC1B,YAAY,cAAc;","names":["Accordion","import_react","RadixSlot","import_jsx_runtime","import_jsx_runtime","BaseAccordion","import_accordion","import_class_variance_authority","import_jsx_runtime","BaseAccordion","import_accordion","import_class_variance_authority","import_jsx_runtime","BaseAccordion","import_class_variance_authority","import_jsx_runtime","import_accordion","import_class_variance_authority","import_react","import_jsx_runtime","import_class_variance_authority","import_jsx_runtime","import_jsx_runtime","BaseAccordion","Accordion"]}