@spark-ui/components 10.22.1 → 11.0.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.
Files changed (143) hide show
  1. package/package.json +5 -5
  2. package/dist/DialogTrigger-woU7vsJi.d.ts +0 -142
  3. package/dist/Input-N8AWWSmt.d.ts +0 -41
  4. package/dist/InputTrailingIcon-ZZx8PoJy.d.ts +0 -20
  5. package/dist/LabelRequiredIndicator-DRnCzHMU.d.ts +0 -19
  6. package/dist/accordion/index.d.ts +0 -73
  7. package/dist/accordion/index.js +0 -325
  8. package/dist/accordion/index.js.map +0 -1
  9. package/dist/alert-dialog/index.d.ts +0 -119
  10. package/dist/alert-dialog/index.js +0 -1554
  11. package/dist/alert-dialog/index.js.map +0 -1
  12. package/dist/avatar/index.d.ts +0 -66
  13. package/dist/avatar/index.js +0 -1303
  14. package/dist/avatar/index.js.map +0 -1
  15. package/dist/badge/index.d.ts +0 -47
  16. package/dist/badge/index.js +0 -122
  17. package/dist/badge/index.js.map +0 -1
  18. package/dist/breadcrumb/index.d.ts +0 -64
  19. package/dist/breadcrumb/index.js +0 -327
  20. package/dist/breadcrumb/index.js.map +0 -1
  21. package/dist/button/index.d.ts +0 -41
  22. package/dist/button/index.js +0 -935
  23. package/dist/button/index.js.map +0 -1
  24. package/dist/card/index.d.ts +0 -61
  25. package/dist/card/index.js +0 -502
  26. package/dist/card/index.js.map +0 -1
  27. package/dist/carousel/index.d.ts +0 -261
  28. package/dist/carousel/index.js +0 -1801
  29. package/dist/carousel/index.js.map +0 -1
  30. package/dist/checkbox/index.d.ts +0 -120
  31. package/dist/checkbox/index.js +0 -511
  32. package/dist/checkbox/index.js.map +0 -1
  33. package/dist/chip/index.d.ts +0 -97
  34. package/dist/chip/index.js +0 -908
  35. package/dist/chip/index.js.map +0 -1
  36. package/dist/collapsible/index.d.ts +0 -43
  37. package/dist/collapsible/index.js +0 -109
  38. package/dist/collapsible/index.js.map +0 -1
  39. package/dist/combobox/index.d.ts +0 -287
  40. package/dist/combobox/index.js +0 -2588
  41. package/dist/combobox/index.js.map +0 -1
  42. package/dist/dialog/index.d.ts +0 -33
  43. package/dist/dialog/index.js +0 -1389
  44. package/dist/dialog/index.js.map +0 -1
  45. package/dist/divider/index.d.ts +0 -61
  46. package/dist/divider/index.js +0 -224
  47. package/dist/divider/index.js.map +0 -1
  48. package/dist/drawer/index.d.ts +0 -152
  49. package/dist/drawer/index.js +0 -1400
  50. package/dist/drawer/index.js.map +0 -1
  51. package/dist/dropdown/index.d.ts +0 -233
  52. package/dist/dropdown/index.js +0 -2051
  53. package/dist/dropdown/index.js.map +0 -1
  54. package/dist/form-field/index.d.ts +0 -186
  55. package/dist/form-field/index.js +0 -553
  56. package/dist/form-field/index.js.map +0 -1
  57. package/dist/icon/index.d.ts +0 -28
  58. package/dist/icon/index.js +0 -127
  59. package/dist/icon/index.js.map +0 -1
  60. package/dist/icon-button/index.d.ts +0 -16
  61. package/dist/icon-button/index.js +0 -980
  62. package/dist/icon-button/index.js.map +0 -1
  63. package/dist/input/index.d.ts +0 -78
  64. package/dist/input/index.js +0 -724
  65. package/dist/input/index.js.map +0 -1
  66. package/dist/kbd/index.d.ts +0 -9
  67. package/dist/kbd/index.js +0 -47
  68. package/dist/kbd/index.js.map +0 -1
  69. package/dist/label/index.d.ts +0 -11
  70. package/dist/label/index.js +0 -78
  71. package/dist/label/index.js.map +0 -1
  72. package/dist/link-box/index.d.ts +0 -34
  73. package/dist/link-box/index.js +0 -92
  74. package/dist/link-box/index.js.map +0 -1
  75. package/dist/pagination/index.d.ts +0 -143
  76. package/dist/pagination/index.js +0 -1353
  77. package/dist/pagination/index.js.map +0 -1
  78. package/dist/popover/index.d.ts +0 -93
  79. package/dist/popover/index.js +0 -1339
  80. package/dist/popover/index.js.map +0 -1
  81. package/dist/portal/index.d.ts +0 -13
  82. package/dist/portal/index.js +0 -37
  83. package/dist/portal/index.js.map +0 -1
  84. package/dist/progress/index.d.ts +0 -48
  85. package/dist/progress/index.js +0 -223
  86. package/dist/progress/index.js.map +0 -1
  87. package/dist/progress-tracker/index.d.ts +0 -80
  88. package/dist/progress-tracker/index.js +0 -571
  89. package/dist/progress-tracker/index.js.map +0 -1
  90. package/dist/radio-group/index.d.ts +0 -100
  91. package/dist/radio-group/index.js +0 -318
  92. package/dist/radio-group/index.js.map +0 -1
  93. package/dist/rating/index.d.ts +0 -78
  94. package/dist/rating/index.js +0 -363
  95. package/dist/rating/index.js.map +0 -1
  96. package/dist/scrolling-list/index.d.ts +0 -118
  97. package/dist/scrolling-list/index.js +0 -1426
  98. package/dist/scrolling-list/index.js.map +0 -1
  99. package/dist/segmented-gauge/index.d.ts +0 -100
  100. package/dist/segmented-gauge/index.js +0 -277
  101. package/dist/segmented-gauge/index.js.map +0 -1
  102. package/dist/select/index.d.ts +0 -167
  103. package/dist/select/index.js +0 -581
  104. package/dist/select/index.js.map +0 -1
  105. package/dist/skeleton/index.d.ts +0 -67
  106. package/dist/skeleton/index.js +0 -206
  107. package/dist/skeleton/index.js.map +0 -1
  108. package/dist/slider/index.d.ts +0 -97
  109. package/dist/slider/index.js +0 -220
  110. package/dist/slider/index.js.map +0 -1
  111. package/dist/slot/index.d.ts +0 -16
  112. package/dist/slot/index.js +0 -51
  113. package/dist/slot/index.js.map +0 -1
  114. package/dist/snackbar/index.d.ts +0 -158
  115. package/dist/snackbar/index.js +0 -1756
  116. package/dist/snackbar/index.js.map +0 -1
  117. package/dist/spinner/index.d.ts +0 -21
  118. package/dist/spinner/index.js +0 -139
  119. package/dist/spinner/index.js.map +0 -1
  120. package/dist/stepper/index.d.ts +0 -81
  121. package/dist/stepper/index.js +0 -1847
  122. package/dist/stepper/index.js.map +0 -1
  123. package/dist/switch/index.d.ts +0 -64
  124. package/dist/switch/index.js +0 -327
  125. package/dist/switch/index.js.map +0 -1
  126. package/dist/tabs/index.d.ts +0 -103
  127. package/dist/tabs/index.js +0 -1376
  128. package/dist/tabs/index.js.map +0 -1
  129. package/dist/tag/index.d.ts +0 -29
  130. package/dist/tag/index.js +0 -283
  131. package/dist/tag/index.js.map +0 -1
  132. package/dist/text-link/index.d.ts +0 -20
  133. package/dist/text-link/index.js +0 -100
  134. package/dist/text-link/index.js.map +0 -1
  135. package/dist/textarea/index.d.ts +0 -57
  136. package/dist/textarea/index.js +0 -797
  137. package/dist/textarea/index.js.map +0 -1
  138. package/dist/toast/index.d.ts +0 -56
  139. package/dist/toast/index.js +0 -1412
  140. package/dist/toast/index.js.map +0 -1
  141. package/dist/visually-hidden/index.d.ts +0 -16
  142. package/dist/visually-hidden/index.js +0 -67
  143. package/dist/visually-hidden/index.js.map +0 -1
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spark-ui/components",
3
- "version": "10.22.1",
3
+ "version": "11.0.1",
4
4
  "license": "MIT",
5
5
  "description": "Spark (Leboncoin design system) components.",
6
6
  "exports": {
@@ -53,9 +53,9 @@
53
53
  "@react-aria/toast": "^3.0.0-beta.18",
54
54
  "@react-stately/numberfield": "3.9.11",
55
55
  "@react-stately/toast": "^3.0.0-beta.7",
56
- "@spark-ui/hooks": "^10.22.1",
57
- "@spark-ui/icons": "^10.22.1",
58
- "@spark-ui/internal-utils": "^10.22.1",
56
+ "@spark-ui/hooks": "^11.0.1",
57
+ "@spark-ui/icons": "^11.0.1",
58
+ "@spark-ui/internal-utils": "^11.0.1",
59
59
  "@zag-js/pagination": "1.25.0",
60
60
  "@zag-js/react": "1.25.0",
61
61
  "class-variance-authority": "0.7.1",
@@ -82,5 +82,5 @@
82
82
  "url": "https://github.com/leboncoin/spark-web/issues?q=is%3Aopen+label%3A%22Component%3A+button%22"
83
83
  },
84
84
  "homepage": "https://sparkui.vercel.app",
85
- "gitHead": "ddfc7f3c88559d404e07d72898a04fcb9d8810b9"
85
+ "gitHead": "716ff8f4320b885dd4c38d6a4cd526aa44ae6218"
86
86
  }
@@ -1,142 +0,0 @@
1
- import { Dialog as Dialog$1 } from 'radix-ui';
2
- import { ReactElement, ReactNode, Ref } from 'react';
3
- import * as react_jsx_runtime from 'react/jsx-runtime';
4
- import * as class_variance_authority_types from 'class-variance-authority/types';
5
- import { VariantProps } from 'class-variance-authority';
6
-
7
- interface DialogProps {
8
- /**
9
- * Children of the component.
10
- */
11
- children?: Dialog$1.DialogProps['children'];
12
- /**
13
- * Specifies if the dialog is open or not.
14
- */
15
- open?: Dialog$1.DialogProps['open'];
16
- /**
17
- * Default open state.
18
- */
19
- defaultOpen?: Dialog$1.DialogProps['defaultOpen'];
20
- /**
21
- * Handler executen on every dialog open state change.
22
- */
23
- onOpenChange?: Dialog$1.DialogProps['onOpenChange'];
24
- /**
25
- * Specifies if the dialog is a modal.
26
- */
27
- modal?: Dialog$1.DialogProps['modal'];
28
- /**
29
- * Specifies if the dialog should have a fade animation on its body (in case it is scrollable).
30
- */
31
- withFade?: boolean;
32
- }
33
- declare const Dialog: {
34
- ({ children, withFade, ...rest }: DialogProps): ReactElement;
35
- displayName: string;
36
- };
37
-
38
- interface BodyProps {
39
- children: ReactNode;
40
- className?: string;
41
- tabIndex?: number;
42
- ref?: Ref<HTMLDivElement>;
43
- inset?: boolean;
44
- }
45
- declare const Body: {
46
- ({ children, className, inset, ref: forwardedRef, ...rest }: BodyProps): ReactElement;
47
- displayName: string;
48
- };
49
-
50
- type CloseProps = Dialog$1.DialogCloseProps & {
51
- ref?: Ref<HTMLButtonElement>;
52
- };
53
- declare const Close: {
54
- (props: CloseProps): react_jsx_runtime.JSX.Element;
55
- displayName: string;
56
- };
57
-
58
- declare const dialogContentStyles: (props?: ({
59
- size?: "fullscreen" | "sm" | "md" | "lg" | null | undefined;
60
- isNarrow?: boolean | null | undefined;
61
- } & class_variance_authority_types.ClassProp) | undefined) => string;
62
- type DialogContentStylesProps = VariantProps<typeof dialogContentStyles>;
63
-
64
- interface ContentProps extends Dialog$1.DialogContentProps, DialogContentStylesProps {
65
- /**
66
- * When set to true, the content will adjust its width to fit the content rather than taking up the full available width.
67
- */
68
- isNarrow?: boolean;
69
- ref?: Ref<HTMLDivElement>;
70
- }
71
- declare const Content: {
72
- ({ children, className, isNarrow, size, onInteractOutside, ref, ...rest }: ContentProps): ReactElement;
73
- displayName: string;
74
- };
75
-
76
- type DescriptionProps = Dialog$1.DialogDescriptionProps & {
77
- ref?: Ref<HTMLParagraphElement>;
78
- };
79
- declare const Description: {
80
- (props: DescriptionProps): react_jsx_runtime.JSX.Element;
81
- displayName: string;
82
- };
83
-
84
- interface FooterProps {
85
- children: ReactNode;
86
- className?: string;
87
- ref?: Ref<HTMLDivElement>;
88
- }
89
- declare const Footer: {
90
- ({ children, className, ref, ...rest }: FooterProps): ReactElement;
91
- displayName: string;
92
- };
93
-
94
- interface HeaderProps {
95
- children: ReactNode;
96
- className?: string;
97
- ref?: Ref<HTMLDivElement>;
98
- }
99
- declare const Header: {
100
- ({ children, className, ref, ...rest }: HeaderProps): ReactElement;
101
- displayName: string;
102
- };
103
-
104
- type OverlayProps = Dialog$1.DialogOverlayProps & {
105
- ref?: Ref<HTMLDivElement>;
106
- };
107
- declare const Overlay: {
108
- ({ className, ref, ...rest }: OverlayProps): ReactElement | null;
109
- displayName: string;
110
- };
111
-
112
- type PortalProps = Dialog$1.DialogPortalProps;
113
- declare const Portal: {
114
- ({ children, ...rest }: PortalProps): ReactElement;
115
- displayName: string;
116
- };
117
-
118
- type TitleProps = Dialog$1.DialogTitleProps & {
119
- ref?: Ref<HTMLHeadingElement>;
120
- };
121
- declare const Title: {
122
- ({ className, ref, ...others }: TitleProps): react_jsx_runtime.JSX.Element;
123
- displayName: string;
124
- };
125
-
126
- interface TriggerProps {
127
- /**
128
- * Children of the component.
129
- */
130
- children?: ReactNode;
131
- /**
132
- * Change the component to the HTML tag or custom component of the only child.
133
- */
134
- asChild?: Dialog$1.DialogTriggerProps['asChild'];
135
- ref?: Ref<HTMLButtonElement>;
136
- }
137
- declare const Trigger: {
138
- (props: TriggerProps): ReactElement;
139
- displayName: string;
140
- };
141
-
142
- export { Body as B, type CloseProps as C, Dialog as D, Footer as F, Header as H, Overlay as O, Portal as P, Trigger as T, Content as a, Close as b, Title as c, Description as d, type DialogProps as e, type ContentProps as f, type HeaderProps as g, type BodyProps as h, type FooterProps as i, type TriggerProps as j, type OverlayProps as k, type PortalProps as l, type TitleProps as m, type DescriptionProps as n };
@@ -1,41 +0,0 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { PropsWithChildren, ComponentPropsWithoutRef, Ref } from 'react';
3
- import * as class_variance_authority_types from 'class-variance-authority/types';
4
- import { VariantProps } from 'class-variance-authority';
5
-
6
- declare const inputGroupStyles: (props?: ({
7
- disabled?: boolean | null | undefined;
8
- readOnly?: boolean | null | undefined;
9
- } & class_variance_authority_types.ClassProp) | undefined) => string;
10
- type InputGroupStylesProps = VariantProps<typeof inputGroupStyles>;
11
-
12
- interface InputGroupProps extends ComponentPropsWithoutRef<'div'>, InputGroupStylesProps {
13
- /**
14
- * Use `state` prop to assign a specific state to the group, choosing from: `error`, `alert` and `success`. By doing so, the outline styles will be updated.
15
- */
16
- state?: 'error' | 'alert' | 'success';
17
- /**
18
- * Function handler to be executed after the input has been cleared.
19
- */
20
- onClear?: () => void;
21
- ref?: Ref<HTMLDivElement>;
22
- }
23
- declare const InputGroup: {
24
- ({ className, children: childrenProp, state: stateProp, disabled: disabledProp, readOnly: readOnlyProp, onClear, ref: forwardedRef, ...others }: PropsWithChildren<InputGroupProps>): react_jsx_runtime.JSX.Element;
25
- displayName: string;
26
- };
27
-
28
- type InputPrimitiveProps = ComponentPropsWithoutRef<'input'>;
29
- interface InputProps extends InputPrimitiveProps {
30
- asChild?: boolean;
31
- onValueChange?: (value: string) => void;
32
- ref?: Ref<HTMLInputElement>;
33
- }
34
- declare const Input: {
35
- ({ className, asChild, onValueChange, onChange, onKeyDown, disabled: disabledProp, readOnly: readOnlyProp, ref, ...others }: InputProps): react_jsx_runtime.JSX.Element;
36
- displayName: string;
37
- } & {
38
- id: string;
39
- };
40
-
41
- export { type InputGroupProps as I, type InputProps as a, InputGroup as b, Input as c };
@@ -1,20 +0,0 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { IconProps } from './icon/index.js';
3
-
4
- type InputIconProps = IconProps;
5
-
6
- type InputLeadingIconProps = InputIconProps;
7
- declare const InputLeadingIcon: {
8
- ({ className, ...others }: InputLeadingIconProps): react_jsx_runtime.JSX.Element;
9
- id: string;
10
- displayName: string;
11
- };
12
-
13
- type InputTrailingIconProps = InputIconProps;
14
- declare const InputTrailingIcon: {
15
- ({ className, ...others }: InputTrailingIconProps): react_jsx_runtime.JSX.Element;
16
- id: string;
17
- displayName: string;
18
- };
19
-
20
- export { type InputLeadingIconProps as I, type InputTrailingIconProps as a, InputLeadingIcon as b, InputTrailingIcon as c };
@@ -1,19 +0,0 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { Label as Label$1 } from 'radix-ui';
3
- import { Ref, ComponentPropsWithRef } from 'react';
4
-
5
- type LabelProps = Label$1.LabelProps & {
6
- ref?: Ref<HTMLLabelElement>;
7
- };
8
- declare const Label: {
9
- ({ className, ref, ...others }: LabelProps): react_jsx_runtime.JSX.Element;
10
- displayName: string;
11
- };
12
-
13
- type LabelRequiredIndicatorProps = ComponentPropsWithRef<'span'>;
14
- declare const LabelRequiredIndicator: {
15
- ({ className, children, ref, ...others }: LabelRequiredIndicatorProps): react_jsx_runtime.JSX.Element;
16
- displayName: string;
17
- };
18
-
19
- export { Label as L, LabelRequiredIndicator as a, type LabelProps as b, type LabelRequiredIndicatorProps as c };
@@ -1,73 +0,0 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { Accordion as Accordion$2 } from '@base-ui-components/react/accordion';
3
- import { ComponentProps, Ref } from 'react';
4
-
5
- type ExtentedZagInterface$3 = Omit<ComponentProps<typeof Accordion$2.Root>, 'openMultiple' | 'render'>;
6
- interface AccordionProps extends ExtentedZagInterface$3 {
7
- /**
8
- * Change the default rendered element for the one passed as a child, merging their props and behavior.
9
- */
10
- asChild?: boolean;
11
- /**
12
- * Whether the accordion items are disabled
13
- */
14
- disabled?: boolean;
15
- /**
16
- * Whether multiple items can be open at the same time.
17
- */
18
- multiple?: boolean;
19
- design?: 'filled' | 'outlined';
20
- ref?: Ref<HTMLDivElement>;
21
- }
22
- declare const Accordion$1: {
23
- ({ asChild, children, design, hiddenUntilFound, multiple, className, ref, ...props }: AccordionProps): react_jsx_runtime.JSX.Element;
24
- displayName: string;
25
- };
26
-
27
- type ExtentedZagInterface$2 = Omit<ComponentProps<typeof Accordion$2.Item>, 'render'>;
28
- interface AccordionItemProps extends ExtentedZagInterface$2 {
29
- asChild?: boolean;
30
- ref?: Ref<HTMLDivElement>;
31
- }
32
- declare const Item: {
33
- ({ asChild, className, children, ref, ...props }: AccordionItemProps): react_jsx_runtime.JSX.Element;
34
- displayName: string;
35
- };
36
-
37
- type ExtentedZagInterface$1 = Omit<ComponentProps<typeof Accordion$2.Panel>, 'render'>;
38
- interface AccordionItemContentProps extends ExtentedZagInterface$1 {
39
- asChild?: boolean;
40
- ref?: Ref<HTMLDivElement>;
41
- }
42
- declare const ItemContent: {
43
- ({ asChild, className, children, ref, ...props }: AccordionItemContentProps): react_jsx_runtime.JSX.Element;
44
- displayName: string;
45
- };
46
-
47
- interface AccordionItemHeaderProps extends ComponentProps<'h3'> {
48
- asChild?: boolean;
49
- ref?: Ref<HTMLHeadingElement>;
50
- }
51
- declare const ItemHeader: {
52
- ({ asChild, children, className, ref, }: AccordionItemHeaderProps): react_jsx_runtime.JSX.Element;
53
- displayName: string;
54
- };
55
-
56
- type ExtentedZagInterface = Omit<ComponentProps<typeof Accordion$2.Trigger>, 'render'>;
57
- interface AccordionItemTriggerProps extends ExtentedZagInterface {
58
- asChild?: boolean;
59
- ref?: Ref<HTMLButtonElement>;
60
- }
61
- declare const ItemTrigger: {
62
- ({ asChild, children, className, ref, ...props }: AccordionItemTriggerProps): react_jsx_runtime.JSX.Element;
63
- displayName: string;
64
- };
65
-
66
- declare const Accordion: typeof Accordion$1 & {
67
- Item: typeof Item;
68
- ItemHeader: typeof ItemHeader;
69
- ItemTrigger: typeof ItemTrigger;
70
- ItemContent: typeof ItemContent;
71
- };
72
-
73
- export { Accordion, type AccordionItemContentProps, type AccordionItemHeaderProps, type AccordionItemTriggerProps, type AccordionProps };
@@ -1,325 +0,0 @@
1
- "use strict";
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __export = (target, all) => {
7
- for (var name in all)
8
- __defProp(target, name, { get: all[name], enumerable: true });
9
- };
10
- var __copyProps = (to, from, except, desc) => {
11
- if (from && typeof from === "object" || typeof from === "function") {
12
- for (let key of __getOwnPropNames(from))
13
- if (!__hasOwnProp.call(to, key) && key !== except)
14
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
- }
16
- return to;
17
- };
18
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
-
20
- // src/accordion/index.ts
21
- var accordion_exports = {};
22
- __export(accordion_exports, {
23
- Accordion: () => Accordion2
24
- });
25
- module.exports = __toCommonJS(accordion_exports);
26
-
27
- // src/accordion/Accordion.tsx
28
- var import_accordion = require("@base-ui-components/react/accordion");
29
- var import_class_variance_authority = require("class-variance-authority");
30
- var import_react2 = require("react");
31
-
32
- // src/slot/Slot.tsx
33
- var import_radix_ui = require("radix-ui");
34
- var import_react = require("react");
35
- var import_jsx_runtime = require("react/jsx-runtime");
36
- var Slottable = import_radix_ui.Slot.Slottable;
37
- var Slot = ({ ref, ...props }) => {
38
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_radix_ui.Slot.Root, { ref, ...props });
39
- };
40
-
41
- // src/accordion/useRenderSlot.tsx
42
- var import_jsx_runtime2 = require("react/jsx-runtime");
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);
51
- var Accordion = ({
52
- asChild = false,
53
- children,
54
- design = "outlined",
55
- hiddenUntilFound = true,
56
- multiple = false,
57
- className,
58
- ref,
59
- ...props
60
- }) => {
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
73
- }
74
- ) });
75
- };
76
- Accordion.displayName = "Accordion";
77
- var useAccordionContext = () => {
78
- const context = (0, import_react2.useContext)(AccordionContext);
79
- if (!context) {
80
- throw Error("useAccordionContext must be used within a Accordion provider");
81
- }
82
- return context;
83
- };
84
-
85
- // src/accordion/AccordionItem.tsx
86
- var import_accordion2 = require("@base-ui-components/react/accordion");
87
- var import_class_variance_authority2 = require("class-variance-authority");
88
- var import_jsx_runtime4 = require("react/jsx-runtime");
89
- var Item = ({
90
- asChild = false,
91
- className,
92
- children,
93
- ref,
94
- ...props
95
- }) => {
96
- const accordion = useAccordionContext();
97
- const renderSlot = useRenderSlot(asChild, "div");
98
- return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
99
- import_accordion2.Accordion.Item,
100
- {
101
- ref,
102
- "data-spark-component": "accordion-item",
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,
111
- children
112
- }
113
- );
114
- };
115
- Item.displayName = "Accordion.Item";
116
-
117
- // src/accordion/AccordionItemContent.tsx
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");
121
- var ItemContent = ({
122
- asChild = false,
123
- className,
124
- children,
125
- ref,
126
- ...props
127
- }) => {
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
- );
145
- };
146
- ItemContent.displayName = "Accordion.ItemContent";
147
-
148
- // src/accordion/AccordionItemHeader.tsx
149
- var import_class_variance_authority4 = require("class-variance-authority");
150
- var import_jsx_runtime6 = require("react/jsx-runtime");
151
- var ItemHeader = ({
152
- asChild = false,
153
- children,
154
- className,
155
- ref
156
- }) => {
157
- const Component = asChild ? Slot : "h3";
158
- return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
159
- Component,
160
- {
161
- ref,
162
- "data-spark-component": "accordion-item-header",
163
- className: (0, import_class_variance_authority4.cx)("rounded-[inherit]", className),
164
- children
165
- }
166
- );
167
- };
168
- ItemHeader.displayName = "Accordion.ItemHeader";
169
-
170
- // src/accordion/AccordionItemTrigger.tsx
171
- var import_accordion4 = require("@base-ui-components/react/accordion");
172
- var import_ArrowHorizontalDown = require("@spark-ui/icons/ArrowHorizontalDown");
173
- var import_class_variance_authority6 = require("class-variance-authority");
174
-
175
- // src/icon/Icon.tsx
176
- var import_react3 = require("react");
177
-
178
- // src/visually-hidden/VisuallyHidden.tsx
179
- var import_jsx_runtime7 = require("react/jsx-runtime");
180
- var VisuallyHidden = ({ asChild = false, ref, ...props }) => {
181
- const Component = asChild ? Slot : "span";
182
- return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
183
- Component,
184
- {
185
- ...props,
186
- ref,
187
- style: {
188
- // See: https://github.com/twbs/bootstrap/blob/main/scss/mixins/_visually-hidden.scss
189
- position: "absolute",
190
- border: 0,
191
- width: 1,
192
- height: 1,
193
- padding: 0,
194
- margin: -1,
195
- overflow: "hidden",
196
- clip: "rect(0, 0, 0, 0)",
197
- whiteSpace: "nowrap",
198
- wordWrap: "normal",
199
- ...props.style
200
- }
201
- }
202
- );
203
- };
204
- VisuallyHidden.displayName = "VisuallyHidden";
205
-
206
- // src/icon/Icon.styles.tsx
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"], {
210
- variants: {
211
- /**
212
- * Color scheme of the icon.
213
- */
214
- intent: (0, import_internal_utils.makeVariants)({
215
- current: ["text-current"],
216
- main: ["text-main"],
217
- support: ["text-support"],
218
- accent: ["text-accent"],
219
- basic: ["text-basic"],
220
- success: ["text-success"],
221
- alert: ["text-alert"],
222
- error: ["text-error"],
223
- info: ["text-info"],
224
- neutral: ["text-neutral"]
225
- }),
226
- /**
227
- * Sets the size of the icon.
228
- */
229
- size: (0, import_internal_utils.makeVariants)({
230
- current: ["u-current-font-size"],
231
- sm: ["w-sz-16", "h-sz-16"],
232
- md: ["w-sz-24", "h-sz-24"],
233
- lg: ["w-sz-32", "h-sz-32"],
234
- xl: ["w-sz-40", "h-sz-40"]
235
- })
236
- }
237
- });
238
-
239
- // src/icon/Icon.tsx
240
- var import_jsx_runtime8 = require("react/jsx-runtime");
241
- var Icon = ({
242
- label,
243
- className,
244
- size = "current",
245
- intent = "current",
246
- children,
247
- ...others
248
- }) => {
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, {
252
- className: iconStyles({ className, size, intent }),
253
- "data-spark-component": "icon",
254
- "aria-hidden": "true",
255
- focusable: "false",
256
- ...others
257
- }),
258
- label && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(VisuallyHidden, { children: label })
259
- ] });
260
- };
261
- Icon.displayName = "Icon";
262
-
263
- // src/accordion/AccordionItemTrigger.tsx
264
- var import_jsx_runtime9 = require("react/jsx-runtime");
265
- var ItemTrigger = ({
266
- asChild = false,
267
- children,
268
- className,
269
- ref,
270
- ...props
271
- }) => {
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
- }
305
- );
306
- };
307
- ItemTrigger.displayName = "Accordion.ItemTrigger";
308
-
309
- // src/accordion/index.ts
310
- var Accordion2 = Object.assign(Accordion, {
311
- Item,
312
- ItemHeader,
313
- ItemTrigger,
314
- ItemContent
315
- });
316
- Accordion2.displayName = "Accordion";
317
- Item.displayName = "Item";
318
- ItemHeader.displayName = "ItemHeader";
319
- ItemTrigger.displayName = "Accordion.Trigger";
320
- ItemContent.displayName = "Accordion.Content";
321
- // Annotate the CommonJS export names for ESM import in node:
322
- 0 && (module.exports = {
323
- Accordion
324
- });
325
- //# sourceMappingURL=index.js.map