@salesmind-ai/design-system 0.3.2 → 0.3.4

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 (215) hide show
  1. package/dist/{SectionShell-BfBw5q0Y.d.cts → SectionShell-GlglHCzz.d.cts} +1 -0
  2. package/dist/{SectionShell-BfBw5q0Y.d.ts → SectionShell-GlglHCzz.d.ts} +1 -0
  3. package/dist/StatsSection-B8iD9L-o.d.ts +68 -0
  4. package/dist/StatsSection-wgd8Vge1.d.cts +68 -0
  5. package/dist/admin/index.cjs +2928 -68
  6. package/dist/admin/index.cjs.map +1 -1
  7. package/dist/admin/index.js +2915 -5
  8. package/dist/admin/index.js.map +1 -1
  9. package/dist/blog/index.cjs +1064 -53
  10. package/dist/blog/index.cjs.map +1 -1
  11. package/dist/blog/index.d.cts +1 -1
  12. package/dist/blog/index.d.ts +1 -1
  13. package/dist/blog/index.js +1054 -8
  14. package/dist/blog/index.js.map +1 -1
  15. package/dist/charts/index.cjs +2694 -46
  16. package/dist/charts/index.cjs.map +1 -1
  17. package/dist/charts/index.js +2680 -3
  18. package/dist/charts/index.js.map +1 -1
  19. package/dist/core/index.cjs +4333 -807
  20. package/dist/core/index.cjs.map +1 -1
  21. package/dist/core/index.js +4130 -14
  22. package/dist/core/index.js.map +1 -1
  23. package/dist/i18n/index.cjs +558 -86
  24. package/dist/i18n/index.cjs.map +1 -1
  25. package/dist/i18n/index.js +544 -1
  26. package/dist/i18n/index.js.map +1 -1
  27. package/dist/index.cjs +17140 -1432
  28. package/dist/index.cjs.map +1 -1
  29. package/dist/index.css +24 -13
  30. package/dist/index.css.map +1 -1
  31. package/dist/index.d.cts +2 -2
  32. package/dist/index.d.ts +2 -2
  33. package/dist/index.js +16785 -31
  34. package/dist/index.js.map +1 -1
  35. package/dist/marketing/index.cjs +3072 -142
  36. package/dist/marketing/index.cjs.map +1 -1
  37. package/dist/marketing/index.d.cts +1 -1
  38. package/dist/marketing/index.d.ts +1 -1
  39. package/dist/marketing/index.js +3042 -11
  40. package/dist/marketing/index.js.map +1 -1
  41. package/dist/motion/index.cjs +1222 -26
  42. package/dist/motion/index.cjs.map +1 -1
  43. package/dist/motion/index.js +1215 -2
  44. package/dist/motion/index.js.map +1 -1
  45. package/dist/nav/index.cjs +1518 -101
  46. package/dist/nav/index.cjs.map +1 -1
  47. package/dist/nav/index.css +24 -13
  48. package/dist/nav/index.css.map +1 -1
  49. package/dist/nav/index.js +1498 -4
  50. package/dist/nav/index.js.map +1 -1
  51. package/dist/report/index.cjs +2403 -171
  52. package/dist/report/index.cjs.map +1 -1
  53. package/dist/report/index.js +2363 -3
  54. package/dist/report/index.js.map +1 -1
  55. package/dist/sections/index.cjs +382 -28
  56. package/dist/sections/index.cjs.map +1 -1
  57. package/dist/sections/index.d.cts +15 -69
  58. package/dist/sections/index.d.ts +15 -69
  59. package/dist/sections/index.js +376 -4
  60. package/dist/sections/index.js.map +1 -1
  61. package/dist/social-proof/index.cjs +1250 -53
  62. package/dist/social-proof/index.cjs.map +1 -1
  63. package/dist/social-proof/index.d.cts +1 -1
  64. package/dist/social-proof/index.d.ts +1 -1
  65. package/dist/social-proof/index.js +1235 -6
  66. package/dist/social-proof/index.js.map +1 -1
  67. package/dist/theme/index.cjs +565 -38
  68. package/dist/theme/index.cjs.map +1 -1
  69. package/dist/theme/index.js +555 -2
  70. package/dist/theme/index.js.map +1 -1
  71. package/dist/web/client/index.cjs +491 -38
  72. package/dist/web/client/index.cjs.map +1 -1
  73. package/dist/web/client/index.js +483 -4
  74. package/dist/web/client/index.js.map +1 -1
  75. package/dist/web/index.cjs +1346 -158
  76. package/dist/web/index.cjs.map +1 -1
  77. package/dist/web/index.js +1305 -9
  78. package/dist/web/index.js.map +1 -1
  79. package/dist/web/server/index.cjs +563 -26
  80. package/dist/web/server/index.cjs.map +1 -1
  81. package/dist/web/server/index.js +560 -1
  82. package/dist/web/server/index.js.map +1 -1
  83. package/package.json +11 -1
  84. package/dist/chunk-2GARWEJK.js +0 -17
  85. package/dist/chunk-2GARWEJK.js.map +0 -1
  86. package/dist/chunk-3NKRFUAR.js +0 -37
  87. package/dist/chunk-3NKRFUAR.js.map +0 -1
  88. package/dist/chunk-3TGSIILM.cjs +0 -201
  89. package/dist/chunk-3TGSIILM.cjs.map +0 -1
  90. package/dist/chunk-4GM5BGBN.cjs +0 -801
  91. package/dist/chunk-4GM5BGBN.cjs.map +0 -1
  92. package/dist/chunk-5LGDEZWY.cjs +0 -2434
  93. package/dist/chunk-5LGDEZWY.cjs.map +0 -1
  94. package/dist/chunk-6H4DSTXR.js +0 -786
  95. package/dist/chunk-6H4DSTXR.js.map +0 -1
  96. package/dist/chunk-6UNG76Y2.js +0 -153
  97. package/dist/chunk-6UNG76Y2.js.map +0 -1
  98. package/dist/chunk-7PX2AZ6Y.js +0 -39
  99. package/dist/chunk-7PX2AZ6Y.js.map +0 -1
  100. package/dist/chunk-B6AVAX4F.js +0 -1415
  101. package/dist/chunk-B6AVAX4F.js.map +0 -1
  102. package/dist/chunk-BILT5KD3.js +0 -264
  103. package/dist/chunk-BILT5KD3.js.map +0 -1
  104. package/dist/chunk-C2BCDNAV.js +0 -24
  105. package/dist/chunk-C2BCDNAV.js.map +0 -1
  106. package/dist/chunk-CH42VPWE.cjs +0 -421
  107. package/dist/chunk-CH42VPWE.cjs.map +0 -1
  108. package/dist/chunk-CJ2MKVAF.cjs +0 -46
  109. package/dist/chunk-CJ2MKVAF.cjs.map +0 -1
  110. package/dist/chunk-DP74LUXG.cjs +0 -98
  111. package/dist/chunk-DP74LUXG.cjs.map +0 -1
  112. package/dist/chunk-E7D6EKJ4.cjs +0 -44
  113. package/dist/chunk-E7D6EKJ4.cjs.map +0 -1
  114. package/dist/chunk-ECXBTUH6.cjs +0 -584
  115. package/dist/chunk-ECXBTUH6.cjs.map +0 -1
  116. package/dist/chunk-EFRAP5ES.js +0 -157
  117. package/dist/chunk-EFRAP5ES.js.map +0 -1
  118. package/dist/chunk-F6YYWMME.js +0 -485
  119. package/dist/chunk-F6YYWMME.js.map +0 -1
  120. package/dist/chunk-FAFAP4L5.js +0 -183
  121. package/dist/chunk-FAFAP4L5.js.map +0 -1
  122. package/dist/chunk-GUZIMHWS.js +0 -1608
  123. package/dist/chunk-GUZIMHWS.js.map +0 -1
  124. package/dist/chunk-H2Y6BSTL.cjs +0 -69
  125. package/dist/chunk-H2Y6BSTL.cjs.map +0 -1
  126. package/dist/chunk-HN4PHABT.js +0 -126
  127. package/dist/chunk-HN4PHABT.js.map +0 -1
  128. package/dist/chunk-HRENHNDJ.js +0 -211
  129. package/dist/chunk-HRENHNDJ.js.map +0 -1
  130. package/dist/chunk-I75BFEYT.cjs +0 -2561
  131. package/dist/chunk-I75BFEYT.cjs.map +0 -1
  132. package/dist/chunk-IFRATNLU.js +0 -562
  133. package/dist/chunk-IFRATNLU.js.map +0 -1
  134. package/dist/chunk-IYPXJ6YC.cjs +0 -69
  135. package/dist/chunk-IYPXJ6YC.cjs.map +0 -1
  136. package/dist/chunk-JPJN4YBC.js +0 -409
  137. package/dist/chunk-JPJN4YBC.js.map +0 -1
  138. package/dist/chunk-KBA2LFBG.js +0 -62
  139. package/dist/chunk-KBA2LFBG.js.map +0 -1
  140. package/dist/chunk-KCKUSU2M.cjs +0 -166
  141. package/dist/chunk-KCKUSU2M.cjs.map +0 -1
  142. package/dist/chunk-KJ2OXQF4.js +0 -287
  143. package/dist/chunk-KJ2OXQF4.js.map +0 -1
  144. package/dist/chunk-KNQEIU7O.cjs +0 -1202
  145. package/dist/chunk-KNQEIU7O.cjs.map +0 -1
  146. package/dist/chunk-KVGSVGRK.cjs +0 -569
  147. package/dist/chunk-KVGSVGRK.cjs.map +0 -1
  148. package/dist/chunk-L352JRV6.cjs +0 -105
  149. package/dist/chunk-L352JRV6.cjs.map +0 -1
  150. package/dist/chunk-LJADZITX.cjs +0 -298
  151. package/dist/chunk-LJADZITX.cjs.map +0 -1
  152. package/dist/chunk-LMJPWXTZ.cjs +0 -194
  153. package/dist/chunk-LMJPWXTZ.cjs.map +0 -1
  154. package/dist/chunk-LOWEAQST.js +0 -701
  155. package/dist/chunk-LOWEAQST.js.map +0 -1
  156. package/dist/chunk-MDB2WCRQ.cjs +0 -137
  157. package/dist/chunk-MDB2WCRQ.cjs.map +0 -1
  158. package/dist/chunk-MQDEE7HC.cjs +0 -283
  159. package/dist/chunk-MQDEE7HC.cjs.map +0 -1
  160. package/dist/chunk-MQRB634A.cjs +0 -34
  161. package/dist/chunk-MQRB634A.cjs.map +0 -1
  162. package/dist/chunk-MTI27RDV.js +0 -185
  163. package/dist/chunk-MTI27RDV.js.map +0 -1
  164. package/dist/chunk-MU6GW5ZV.js +0 -2317
  165. package/dist/chunk-MU6GW5ZV.js.map +0 -1
  166. package/dist/chunk-NN3TUHIH.js +0 -28
  167. package/dist/chunk-NN3TUHIH.js.map +0 -1
  168. package/dist/chunk-NT4LBP7D.cjs +0 -111
  169. package/dist/chunk-NT4LBP7D.cjs.map +0 -1
  170. package/dist/chunk-OLV7OD3X.cjs +0 -502
  171. package/dist/chunk-OLV7OD3X.cjs.map +0 -1
  172. package/dist/chunk-OXNXEQY7.js +0 -2538
  173. package/dist/chunk-OXNXEQY7.js.map +0 -1
  174. package/dist/chunk-P5BOFE5A.js +0 -546
  175. package/dist/chunk-P5BOFE5A.js.map +0 -1
  176. package/dist/chunk-Q2MFGYTE.cjs +0 -1449
  177. package/dist/chunk-Q2MFGYTE.cjs.map +0 -1
  178. package/dist/chunk-Q75DBVDY.cjs +0 -68
  179. package/dist/chunk-Q75DBVDY.cjs.map +0 -1
  180. package/dist/chunk-REQ5Q6ZI.js +0 -1022
  181. package/dist/chunk-REQ5Q6ZI.js.map +0 -1
  182. package/dist/chunk-SICKWUWB.js +0 -62
  183. package/dist/chunk-SICKWUWB.js.map +0 -1
  184. package/dist/chunk-T343CCH5.js +0 -1190
  185. package/dist/chunk-T343CCH5.js.map +0 -1
  186. package/dist/chunk-TEC62D4A.cjs +0 -1624
  187. package/dist/chunk-TEC62D4A.cjs.map +0 -1
  188. package/dist/chunk-TW5JB35D.js +0 -2122
  189. package/dist/chunk-TW5JB35D.js.map +0 -1
  190. package/dist/chunk-VC5LMUVQ.cjs +0 -20
  191. package/dist/chunk-VC5LMUVQ.cjs.map +0 -1
  192. package/dist/chunk-VM7WFMKI.cjs +0 -76
  193. package/dist/chunk-VM7WFMKI.cjs.map +0 -1
  194. package/dist/chunk-W2WTP6HS.cjs +0 -233
  195. package/dist/chunk-W2WTP6HS.cjs.map +0 -1
  196. package/dist/chunk-WH7PYHZY.cjs +0 -35
  197. package/dist/chunk-WH7PYHZY.cjs.map +0 -1
  198. package/dist/chunk-XQZVY7JJ.cjs +0 -717
  199. package/dist/chunk-XQZVY7JJ.cjs.map +0 -1
  200. package/dist/chunk-XU3OMQ7V.js +0 -98
  201. package/dist/chunk-XU3OMQ7V.js.map +0 -1
  202. package/dist/chunk-XWPDRMZG.js +0 -62
  203. package/dist/chunk-XWPDRMZG.js.map +0 -1
  204. package/dist/chunk-Y3CPKNB7.js +0 -67
  205. package/dist/chunk-Y3CPKNB7.js.map +0 -1
  206. package/dist/chunk-YNVRDD2P.js +0 -98
  207. package/dist/chunk-YNVRDD2P.js.map +0 -1
  208. package/dist/chunk-YSYR54XR.js +0 -92
  209. package/dist/chunk-YSYR54XR.js.map +0 -1
  210. package/dist/chunk-YTYDQBVY.cjs +0 -162
  211. package/dist/chunk-YTYDQBVY.cjs.map +0 -1
  212. package/dist/chunk-ZDLOA2UT.cjs +0 -1042
  213. package/dist/chunk-ZDLOA2UT.cjs.map +0 -1
  214. package/dist/chunk-ZWUKRCOJ.cjs +0 -2162
  215. package/dist/chunk-ZWUKRCOJ.cjs.map +0 -1
@@ -1,2317 +0,0 @@
1
- import { Dialog, DialogContent, DialogTitle } from './chunk-HRENHNDJ.js';
2
- import { Box } from './chunk-HN4PHABT.js';
3
- import React20, { forwardRef, useId, createContext, useContext, useState, useRef, useEffect, useCallback } from 'react';
4
- import clsx18 from 'clsx';
5
- import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
6
- import { Switch as Switch$1 } from '@base-ui/react/switch';
7
- import ReactDOM, { createPortal } from 'react-dom';
8
- import { Slot } from '@radix-ui/react-slot';
9
-
10
- var Card = React20.forwardRef(
11
- ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx18("ds-card", className), ...props })
12
- );
13
- Card.displayName = "Card";
14
- var CardHeader = React20.forwardRef(
15
- ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx18("ds-card__header", className), ...props })
16
- );
17
- CardHeader.displayName = "CardHeader";
18
- var CardTitle = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("h3", { ref, className: clsx18("ds-card__title", className), ...props }));
19
- CardTitle.displayName = "CardTitle";
20
- var CardDescription = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("p", { ref, className: clsx18("ds-card__description", className), ...props }));
21
- CardDescription.displayName = "CardDescription";
22
- var CardContent = React20.forwardRef(
23
- ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx18("ds-card__content", className), ...props })
24
- );
25
- CardContent.displayName = "CardContent";
26
- var CardFooter = React20.forwardRef(
27
- ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx18("ds-card__footer", className), ...props })
28
- );
29
- CardFooter.displayName = "CardFooter";
30
- var ButtonGroup = React20.forwardRef(
31
- ({ orientation = "horizontal", fullWidth = false, size = "md", className, children, ...props }, ref) => {
32
- return /* @__PURE__ */ jsx(
33
- "div",
34
- {
35
- ref,
36
- role: "group",
37
- className: clsx18(
38
- "ds-button-group",
39
- `ds-button-group--${orientation}`,
40
- fullWidth && "ds-button-group--full-width",
41
- className
42
- ),
43
- "data-size": size,
44
- ...props,
45
- children
46
- }
47
- );
48
- }
49
- );
50
- ButtonGroup.displayName = "ButtonGroup";
51
- var TextArea = forwardRef(
52
- ({ className, label, error, helperText, id, ...props }, ref) => {
53
- const generatedId = useId();
54
- const inputId = id || generatedId;
55
- return /* @__PURE__ */ jsxs("div", { className: clsx18("ds-textarea", className), children: [
56
- label && /* @__PURE__ */ jsx("label", { htmlFor: inputId, className: "ds-textarea__label", children: label }),
57
- /* @__PURE__ */ jsx("div", { className: "ds-textarea__input-wrapper", children: /* @__PURE__ */ jsx(
58
- "textarea",
59
- {
60
- id: inputId,
61
- ref,
62
- className: clsx18("ds-textarea__input", error && "ds-textarea__input--error"),
63
- ...props
64
- }
65
- ) }),
66
- helperText && /* @__PURE__ */ jsx("span", { className: clsx18("ds-textarea__helper", error && "ds-textarea__helper--error"), children: helperText })
67
- ] });
68
- }
69
- );
70
- TextArea.displayName = "TextArea";
71
- var RadioGroupContext = createContext(null);
72
- var RadioGroup = forwardRef(
73
- ({
74
- className,
75
- name,
76
- value,
77
- onValueChange,
78
- orientation = "vertical",
79
- children,
80
- ...props
81
- }, ref) => {
82
- const generatedName = useId();
83
- const groupName = name || generatedName;
84
- return /* @__PURE__ */ jsx(RadioGroupContext.Provider, { value: { name: groupName, value, onChange: onValueChange }, children: /* @__PURE__ */ jsx(
85
- "div",
86
- {
87
- ref,
88
- role: "radiogroup",
89
- className: clsx18(
90
- "ds-radio-group",
91
- orientation === "horizontal" && "ds-radio-group--horizontal",
92
- className
93
- ),
94
- ...props,
95
- children
96
- }
97
- ) });
98
- }
99
- );
100
- RadioGroup.displayName = "RadioGroup";
101
- var Radio = forwardRef(
102
- ({ className, label, value, disabled, id, onChange, ...props }, ref) => {
103
- const context = useContext(RadioGroupContext);
104
- const generatedId = useId();
105
- const radioId = id || generatedId;
106
- const name = context?.name || props.name;
107
- const isChecked = context?.value !== void 0 ? context.value === value : props.checked;
108
- const handleChange = (e) => {
109
- onChange?.(e);
110
- context?.onChange?.(value);
111
- };
112
- return /* @__PURE__ */ jsxs(
113
- "label",
114
- {
115
- className: clsx18("ds-radio-wrapper", disabled && "ds-radio-wrapper--disabled", className),
116
- children: [
117
- /* @__PURE__ */ jsx(
118
- "input",
119
- {
120
- ref,
121
- type: "radio",
122
- className: "ds-radio-input",
123
- id: radioId,
124
- name,
125
- value,
126
- checked: isChecked,
127
- onChange: handleChange,
128
- disabled,
129
- ...props
130
- }
131
- ),
132
- /* @__PURE__ */ jsx("div", { className: clsx18("ds-radio", isChecked && "ds-radio--checked"), children: /* @__PURE__ */ jsx("div", { className: "ds-radio__indicator" }) }),
133
- label && /* @__PURE__ */ jsx("span", { className: "ds-radio__label", children: label })
134
- ]
135
- }
136
- );
137
- }
138
- );
139
- Radio.displayName = "Radio";
140
- var Switch = React20.forwardRef(
141
- ({ className, label, id, ...props }, ref) => {
142
- const generatedId = React20.useId();
143
- const switchId = id || generatedId;
144
- return /* @__PURE__ */ jsxs("div", { className: clsx18("ds-switch-wrapper", className), children: [
145
- /* @__PURE__ */ jsx(Switch$1.Root, { id: switchId, ref, className: "ds-switch", ...props, children: /* @__PURE__ */ jsx(Switch$1.Thumb, { className: "ds-switch__thumb" }) }),
146
- label && /* @__PURE__ */ jsx("label", { htmlFor: switchId, className: "ds-switch__label", children: label })
147
- ] });
148
- }
149
- );
150
- Switch.displayName = "Switch";
151
- var AccordionContext = React20.createContext(null);
152
- function useAccordionContext() {
153
- const ctx = React20.useContext(AccordionContext);
154
- if (!ctx) {
155
- throw new Error("Accordion compound components must be used within <Accordion>");
156
- }
157
- return ctx;
158
- }
159
- var AccordionItemContext = React20.createContext(null);
160
- function useAccordionItemContext() {
161
- const ctx = React20.useContext(AccordionItemContext);
162
- if (!ctx) {
163
- throw new Error("AccordionTrigger/AccordionContent must be used within <AccordionItem>");
164
- }
165
- return ctx;
166
- }
167
- var Accordion = React20.forwardRef(
168
- ({ className, type = "single", defaultValue = [], collapsible: _collapsible, children, ...props }, ref) => {
169
- const [openItems, setOpenItems] = React20.useState(
170
- () => new Set(defaultValue)
171
- );
172
- const toggle = React20.useCallback(
173
- (value) => {
174
- setOpenItems((prev) => {
175
- const next = new Set(prev);
176
- if (next.has(value)) {
177
- next.delete(value);
178
- } else {
179
- if (type === "single") {
180
- next.clear();
181
- }
182
- next.add(value);
183
- }
184
- return next;
185
- });
186
- },
187
- [type]
188
- );
189
- const contextValue = React20.useMemo(
190
- () => ({ openItems, toggle }),
191
- [openItems, toggle]
192
- );
193
- return /* @__PURE__ */ jsx(AccordionContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx("div", { ref, className: clsx18("ds-accordion", className), ...props, children }) });
194
- }
195
- );
196
- Accordion.displayName = "Accordion";
197
- var AccordionItem = React20.forwardRef(
198
- ({ className, value, children, ...props }, ref) => {
199
- const { openItems } = useAccordionContext();
200
- const isOpen = openItems.has(value);
201
- const contextValue = React20.useMemo(
202
- () => ({ value, isOpen }),
203
- [value, isOpen]
204
- );
205
- return /* @__PURE__ */ jsx(AccordionItemContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
206
- "div",
207
- {
208
- ref,
209
- className: clsx18("ds-accordion__item", className),
210
- "data-state": isOpen ? "open" : "closed",
211
- ...props,
212
- children
213
- }
214
- ) });
215
- }
216
- );
217
- AccordionItem.displayName = "AccordionItem";
218
- var AccordionTrigger = React20.forwardRef(({ className, children, ...props }, ref) => {
219
- const { toggle } = useAccordionContext();
220
- const { value, isOpen } = useAccordionItemContext();
221
- return /* @__PURE__ */ jsxs(
222
- "button",
223
- {
224
- ref,
225
- type: "button",
226
- className: clsx18("ds-accordion__trigger", className),
227
- "aria-expanded": isOpen,
228
- onClick: () => toggle(value),
229
- ...props,
230
- children: [
231
- /* @__PURE__ */ jsx("span", { className: "ds-accordion__trigger-text", children }),
232
- /* @__PURE__ */ jsx(
233
- "svg",
234
- {
235
- className: "ds-accordion__chevron",
236
- width: "16",
237
- height: "16",
238
- viewBox: "0 0 24 24",
239
- fill: "none",
240
- stroke: "currentColor",
241
- strokeWidth: "2",
242
- strokeLinecap: "round",
243
- strokeLinejoin: "round",
244
- "aria-hidden": "true",
245
- children: /* @__PURE__ */ jsx("polyline", { points: "6 9 12 15 18 9" })
246
- }
247
- )
248
- ]
249
- }
250
- );
251
- });
252
- AccordionTrigger.displayName = "AccordionTrigger";
253
- var AccordionContent = React20.forwardRef(({ className, children, ...props }, ref) => {
254
- const { isOpen } = useAccordionItemContext();
255
- const contentRef = React20.useRef(null);
256
- const [height, setHeight] = React20.useState(
257
- isOpen ? void 0 : 0
258
- );
259
- React20.useEffect(() => {
260
- const el = contentRef.current;
261
- if (!el) return;
262
- if (isOpen) {
263
- const scrollHeight = el.scrollHeight;
264
- setHeight(scrollHeight);
265
- const timer = setTimeout(() => setHeight(void 0), 200);
266
- return () => clearTimeout(timer);
267
- } else {
268
- const scrollHeight = el.scrollHeight;
269
- setHeight(scrollHeight);
270
- requestAnimationFrame(() => {
271
- requestAnimationFrame(() => {
272
- setHeight(0);
273
- });
274
- });
275
- }
276
- }, [isOpen]);
277
- return /* @__PURE__ */ jsx(
278
- "div",
279
- {
280
- ref: contentRef,
281
- className: clsx18("ds-accordion__content", className),
282
- style: {
283
- height: height !== void 0 ? `${height}px` : "auto"
284
- },
285
- hidden: !isOpen && height === 0,
286
- ...props,
287
- children: /* @__PURE__ */ jsx("div", { ref, className: "ds-accordion__content-inner", children })
288
- }
289
- );
290
- });
291
- AccordionContent.displayName = "AccordionContent";
292
- var Label = React20.forwardRef(
293
- ({ className, disabled, ...props }, ref) => {
294
- return /* @__PURE__ */ jsx(
295
- "label",
296
- {
297
- ref,
298
- className: clsx18("ds-label", disabled && "ds-label--disabled", className),
299
- "data-disabled": disabled || void 0,
300
- ...props
301
- }
302
- );
303
- }
304
- );
305
- Label.displayName = "Label";
306
- var Skeleton = React20.forwardRef(
307
- ({ className, ...props }, ref) => {
308
- return /* @__PURE__ */ jsx(
309
- "div",
310
- {
311
- ref,
312
- className: clsx18("ds-skeleton", className),
313
- ...props
314
- }
315
- );
316
- }
317
- );
318
- Skeleton.displayName = "Skeleton";
319
- var Separator = React20.forwardRef(
320
- ({ className, orientation = "horizontal", ...props }, ref) => {
321
- return /* @__PURE__ */ jsx(
322
- "div",
323
- {
324
- ref,
325
- role: "separator",
326
- "aria-orientation": orientation,
327
- className: clsx18(
328
- "ds-separator",
329
- `ds-separator--${orientation}`,
330
- className
331
- ),
332
- ...props
333
- }
334
- );
335
- }
336
- );
337
- Separator.displayName = "Separator";
338
- var SheetContext = React20.createContext(void 0);
339
- function useSheetContext() {
340
- const ctx = React20.useContext(SheetContext);
341
- if (!ctx) {
342
- throw new Error("Sheet compound components must be used within a <Sheet> parent.");
343
- }
344
- return ctx;
345
- }
346
- var Sheet = ({ open: controlledOpen, onOpenChange, children }) => {
347
- const [uncontrolledOpen, setUncontrolledOpen] = React20.useState(false);
348
- const isControlled = controlledOpen !== void 0;
349
- const open = isControlled ? controlledOpen : uncontrolledOpen;
350
- const handleOpenChange = React20.useCallback(
351
- (next) => {
352
- if (!isControlled) {
353
- setUncontrolledOpen(next);
354
- }
355
- onOpenChange?.(next);
356
- },
357
- [isControlled, onOpenChange]
358
- );
359
- return /* @__PURE__ */ jsx(SheetContext.Provider, { value: { open, onOpenChange: handleOpenChange }, children });
360
- };
361
- Sheet.displayName = "Sheet";
362
- var SheetTrigger = React20.forwardRef(
363
- ({ onClick, asChild = false, ...props }, ref) => {
364
- const { onOpenChange } = useSheetContext();
365
- const handleClick = (e) => {
366
- onOpenChange(true);
367
- onClick?.(e);
368
- };
369
- const Comp = asChild ? Slot : "button";
370
- return /* @__PURE__ */ jsx(Comp, { ref, type: "button", onClick: handleClick, ...props });
371
- }
372
- );
373
- SheetTrigger.displayName = "SheetTrigger";
374
- var SheetClose = React20.forwardRef(
375
- ({ onClick, asChild = false, ...props }, ref) => {
376
- const { onOpenChange } = useSheetContext();
377
- const handleClick = (e) => {
378
- onOpenChange(false);
379
- onClick?.(e);
380
- };
381
- const Comp = asChild ? Slot : "button";
382
- return /* @__PURE__ */ jsx(Comp, { ref, type: "button", onClick: handleClick, ...props });
383
- }
384
- );
385
- SheetClose.displayName = "SheetClose";
386
- var SheetContent = React20.forwardRef(
387
- ({ side = "right", className, children, ...props }, ref) => {
388
- const { open, onOpenChange } = useSheetContext();
389
- if (!open) return null;
390
- return createPortal(
391
- /* @__PURE__ */ jsxs(Fragment, { children: [
392
- /* @__PURE__ */ jsx(
393
- "div",
394
- {
395
- className: "ds-sheet__backdrop",
396
- onClick: () => onOpenChange(false),
397
- "aria-hidden": "true"
398
- }
399
- ),
400
- /* @__PURE__ */ jsx(
401
- "div",
402
- {
403
- ref,
404
- role: "dialog",
405
- className: clsx18("ds-sheet__content", `ds-sheet__content--${side}`, className),
406
- ...props,
407
- children
408
- }
409
- )
410
- ] }),
411
- document.body
412
- );
413
- }
414
- );
415
- SheetContent.displayName = "SheetContent";
416
- var SheetHeader = React20.forwardRef(
417
- ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx18("ds-sheet__header", className), ...props })
418
- );
419
- SheetHeader.displayName = "SheetHeader";
420
- var SheetTitle = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("h2", { ref, className: clsx18("ds-sheet__title", className), ...props }));
421
- SheetTitle.displayName = "SheetTitle";
422
- var SheetDescription = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("p", { ref, className: clsx18("ds-sheet__description", className), ...props }));
423
- SheetDescription.displayName = "SheetDescription";
424
- var SheetFooter = React20.forwardRef(
425
- ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx18("ds-sheet__footer", className), ...props })
426
- );
427
- SheetFooter.displayName = "SheetFooter";
428
- var PopoverContext = React20.createContext(null);
429
- function usePopoverContext() {
430
- const context = React20.useContext(PopoverContext);
431
- if (!context) {
432
- throw new Error("Popover compound components must be used within <Popover>");
433
- }
434
- return context;
435
- }
436
- var Popover = ({ open: controlledOpen, onOpenChange, children }) => {
437
- const [uncontrolledOpen, setUncontrolledOpen] = React20.useState(false);
438
- const isControlled = controlledOpen !== void 0;
439
- const open = isControlled ? controlledOpen : uncontrolledOpen;
440
- const setOpen = React20.useCallback(
441
- (value) => {
442
- if (!isControlled) {
443
- setUncontrolledOpen(value);
444
- }
445
- onOpenChange?.(value);
446
- },
447
- [isControlled, onOpenChange]
448
- );
449
- const toggle = React20.useCallback(() => {
450
- setOpen(!open);
451
- }, [open, setOpen]);
452
- const contextValue = React20.useMemo(
453
- () => ({ open, setOpen, toggle }),
454
- [open, setOpen, toggle]
455
- );
456
- return /* @__PURE__ */ jsx(PopoverContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx("div", { className: "ds-popover", children }) });
457
- };
458
- Popover.displayName = "Popover";
459
- var PopoverTrigger = React20.forwardRef(
460
- ({ className, onClick, asChild = false, ...props }, ref) => {
461
- const { toggle } = usePopoverContext();
462
- const handleClick = (e) => {
463
- toggle();
464
- onClick?.(e);
465
- };
466
- const Comp = asChild ? Slot : "button";
467
- return /* @__PURE__ */ jsx(
468
- Comp,
469
- {
470
- ref,
471
- type: "button",
472
- className: clsx18("ds-popover__trigger", className),
473
- onClick: handleClick,
474
- ...props
475
- }
476
- );
477
- }
478
- );
479
- PopoverTrigger.displayName = "PopoverTrigger";
480
- var PopoverContent = React20.forwardRef(
481
- ({ className, side = "bottom", align = "center", ...props }, ref) => {
482
- const { open } = usePopoverContext();
483
- if (!open) return null;
484
- return /* @__PURE__ */ jsx(
485
- "div",
486
- {
487
- ref,
488
- className: clsx18(
489
- "ds-popover__content",
490
- `ds-popover__content--${side}`,
491
- `ds-popover__content--align-${align}`,
492
- className
493
- ),
494
- ...props
495
- }
496
- );
497
- }
498
- );
499
- PopoverContent.displayName = "PopoverContent";
500
- var PopoverClose = React20.forwardRef(({ className, onClick, ...props }, ref) => {
501
- const { setOpen } = usePopoverContext();
502
- const handleClick = (e) => {
503
- setOpen(false);
504
- onClick?.(e);
505
- };
506
- return /* @__PURE__ */ jsx(
507
- "button",
508
- {
509
- ref,
510
- type: "button",
511
- className: clsx18("ds-popover__close", className),
512
- onClick: handleClick,
513
- ...props
514
- }
515
- );
516
- });
517
- PopoverClose.displayName = "PopoverClose";
518
- var Progress = React20.forwardRef(
519
- ({ className, value = 0, max = 100, ...props }, ref) => {
520
- const percentage = max > 0 ? Math.min(100, Math.max(0, value / max * 100)) : 0;
521
- return /* @__PURE__ */ jsx(
522
- "div",
523
- {
524
- ref,
525
- role: "progressbar",
526
- "aria-valuenow": value,
527
- "aria-valuemin": 0,
528
- "aria-valuemax": max,
529
- className: clsx18("ds-progress", className),
530
- ...props,
531
- children: /* @__PURE__ */ jsx(
532
- "div",
533
- {
534
- className: "ds-progress__indicator",
535
- style: { width: `${percentage}%` }
536
- }
537
- )
538
- }
539
- );
540
- }
541
- );
542
- Progress.displayName = "Progress";
543
- var ScrollArea = React20.forwardRef(
544
- ({ className, children, ...props }, ref) => {
545
- return /* @__PURE__ */ jsx("div", { ref, className: clsx18("ds-scroll-area", className), ...props, children: /* @__PURE__ */ jsx("div", { className: "ds-scroll-area__viewport", children }) });
546
- }
547
- );
548
- ScrollArea.displayName = "ScrollArea";
549
- var ScrollBar = React20.forwardRef(
550
- ({ className, orientation = "vertical", ...props }, ref) => {
551
- return /* @__PURE__ */ jsx(
552
- "div",
553
- {
554
- ref,
555
- className: clsx18(
556
- "ds-scroll-area__scrollbar",
557
- `ds-scroll-area__scrollbar--${orientation}`,
558
- className
559
- ),
560
- ...props
561
- }
562
- );
563
- }
564
- );
565
- ScrollBar.displayName = "ScrollBar";
566
- var Toggle = React20.forwardRef(
567
- ({
568
- className,
569
- pressed: controlledPressed,
570
- onPressedChange,
571
- variant = "default",
572
- size = "md",
573
- onClick,
574
- ...props
575
- }, ref) => {
576
- const [uncontrolledPressed, setUncontrolledPressed] = React20.useState(false);
577
- const isControlled = controlledPressed !== void 0;
578
- const pressed = isControlled ? controlledPressed : uncontrolledPressed;
579
- const handleClick = (e) => {
580
- const next = !pressed;
581
- if (!isControlled) {
582
- setUncontrolledPressed(next);
583
- }
584
- onPressedChange?.(next);
585
- onClick?.(e);
586
- };
587
- return /* @__PURE__ */ jsx(
588
- "button",
589
- {
590
- ref,
591
- type: "button",
592
- className: clsx18(
593
- "ds-toggle",
594
- `ds-toggle--${variant}`,
595
- `ds-toggle--${size}`,
596
- className
597
- ),
598
- "aria-pressed": pressed,
599
- "data-state": pressed ? "on" : "off",
600
- onClick: handleClick,
601
- ...props
602
- }
603
- );
604
- }
605
- );
606
- Toggle.displayName = "Toggle";
607
- var CollapsibleContext = React20.createContext(null);
608
- function useCollapsibleContext() {
609
- const context = React20.useContext(CollapsibleContext);
610
- if (!context) {
611
- throw new Error("Collapsible compound components must be used within <Collapsible>");
612
- }
613
- return context;
614
- }
615
- var Collapsible = React20.forwardRef(
616
- ({ className, open: controlledOpen, onOpenChange, children, ...props }, ref) => {
617
- const [uncontrolledOpen, setUncontrolledOpen] = React20.useState(false);
618
- const isControlled = controlledOpen !== void 0;
619
- const open = isControlled ? controlledOpen : uncontrolledOpen;
620
- const toggle = React20.useCallback(() => {
621
- const next = !open;
622
- if (!isControlled) {
623
- setUncontrolledOpen(next);
624
- }
625
- onOpenChange?.(next);
626
- }, [open, isControlled, onOpenChange]);
627
- const contextValue = React20.useMemo(
628
- () => ({ open, toggle }),
629
- [open, toggle]
630
- );
631
- return /* @__PURE__ */ jsx(CollapsibleContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
632
- "div",
633
- {
634
- ref,
635
- className: clsx18("ds-collapsible", className),
636
- "data-state": open ? "open" : "closed",
637
- ...props,
638
- children
639
- }
640
- ) });
641
- }
642
- );
643
- Collapsible.displayName = "Collapsible";
644
- var CollapsibleTrigger = React20.forwardRef(({ className, onClick, ...props }, ref) => {
645
- const { toggle } = useCollapsibleContext();
646
- const handleClick = (e) => {
647
- toggle();
648
- onClick?.(e);
649
- };
650
- return /* @__PURE__ */ jsx(
651
- "button",
652
- {
653
- ref,
654
- type: "button",
655
- className: clsx18("ds-collapsible__trigger", className),
656
- onClick: handleClick,
657
- ...props
658
- }
659
- );
660
- });
661
- CollapsibleTrigger.displayName = "CollapsibleTrigger";
662
- var CollapsibleContent = React20.forwardRef(({ className, children, ...props }, ref) => {
663
- const { open } = useCollapsibleContext();
664
- const contentRef = React20.useRef(null);
665
- const [maxHeight, setMaxHeight] = React20.useState(
666
- open ? void 0 : 0
667
- );
668
- React20.useEffect(() => {
669
- const el = contentRef.current;
670
- if (!el) return;
671
- if (open) {
672
- const scrollHeight = el.scrollHeight;
673
- setMaxHeight(scrollHeight);
674
- const timer = setTimeout(() => setMaxHeight(void 0), 200);
675
- return () => clearTimeout(timer);
676
- } else {
677
- const scrollHeight = el.scrollHeight;
678
- setMaxHeight(scrollHeight);
679
- requestAnimationFrame(() => {
680
- requestAnimationFrame(() => {
681
- setMaxHeight(0);
682
- });
683
- });
684
- }
685
- }, [open]);
686
- return /* @__PURE__ */ jsx(
687
- "div",
688
- {
689
- ref: contentRef,
690
- className: clsx18("ds-collapsible__content", className),
691
- "data-state": open ? "open" : "closed",
692
- style: {
693
- maxHeight: maxHeight !== void 0 ? `${maxHeight}px` : "none"
694
- },
695
- hidden: !open && maxHeight === 0,
696
- ...props,
697
- children: /* @__PURE__ */ jsx("div", { ref, className: "ds-collapsible__content-inner", children })
698
- }
699
- );
700
- });
701
- CollapsibleContent.displayName = "CollapsibleContent";
702
- var HoverCardContext = React20.createContext(null);
703
- function useHoverCardContext() {
704
- const context = React20.useContext(HoverCardContext);
705
- if (!context) {
706
- throw new Error("HoverCard compound components must be used within <HoverCard>");
707
- }
708
- return context;
709
- }
710
- var HoverCard = ({
711
- openDelay = 200,
712
- closeDelay = 100,
713
- children
714
- }) => {
715
- const [open, setOpen] = React20.useState(false);
716
- const openTimerRef = React20.useRef();
717
- const closeTimerRef = React20.useRef();
718
- const onOpen = React20.useCallback(() => {
719
- clearTimeout(closeTimerRef.current);
720
- openTimerRef.current = setTimeout(() => setOpen(true), openDelay);
721
- }, [openDelay]);
722
- const onClose = React20.useCallback(() => {
723
- clearTimeout(openTimerRef.current);
724
- closeTimerRef.current = setTimeout(() => setOpen(false), closeDelay);
725
- }, [closeDelay]);
726
- React20.useEffect(() => {
727
- return () => {
728
- clearTimeout(openTimerRef.current);
729
- clearTimeout(closeTimerRef.current);
730
- };
731
- }, []);
732
- const contextValue = React20.useMemo(
733
- () => ({ open, onOpen, onClose }),
734
- [open, onOpen, onClose]
735
- );
736
- return /* @__PURE__ */ jsx(HoverCardContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx("div", { className: "ds-hover-card", children }) });
737
- };
738
- HoverCard.displayName = "HoverCard";
739
- var HoverCardTrigger = React20.forwardRef(({ className, onMouseEnter, onMouseLeave, ...props }, ref) => {
740
- const { onOpen, onClose } = useHoverCardContext();
741
- const handleMouseEnter = (e) => {
742
- onOpen();
743
- onMouseEnter?.(e);
744
- };
745
- const handleMouseLeave = (e) => {
746
- onClose();
747
- onMouseLeave?.(e);
748
- };
749
- return /* @__PURE__ */ jsx(
750
- "span",
751
- {
752
- ref,
753
- className: clsx18("ds-hover-card__trigger", className),
754
- onMouseEnter: handleMouseEnter,
755
- onMouseLeave: handleMouseLeave,
756
- ...props
757
- }
758
- );
759
- });
760
- HoverCardTrigger.displayName = "HoverCardTrigger";
761
- var HoverCardContent = React20.forwardRef(
762
- ({ className, side = "bottom", align = "center", onMouseEnter, onMouseLeave, ...props }, ref) => {
763
- const { open, onOpen, onClose } = useHoverCardContext();
764
- const handleMouseEnter = (e) => {
765
- onOpen();
766
- onMouseEnter?.(e);
767
- };
768
- const handleMouseLeave = (e) => {
769
- onClose();
770
- onMouseLeave?.(e);
771
- };
772
- if (!open) return null;
773
- return /* @__PURE__ */ jsx(
774
- "div",
775
- {
776
- ref,
777
- className: clsx18(
778
- "ds-hover-card__content",
779
- `ds-hover-card__content--${side}`,
780
- `ds-hover-card__content--align-${align}`,
781
- className
782
- ),
783
- onMouseEnter: handleMouseEnter,
784
- onMouseLeave: handleMouseLeave,
785
- ...props
786
- }
787
- );
788
- }
789
- );
790
- HoverCardContent.displayName = "HoverCardContent";
791
- var AspectRatio = React20.forwardRef(
792
- ({ className, ratio = 1, style, children, ...props }, ref) => {
793
- return /* @__PURE__ */ jsx(
794
- "div",
795
- {
796
- ref,
797
- className: clsx18("ds-aspect-ratio", className),
798
- style: { ...style, paddingBottom: `${1 / ratio * 100}%` },
799
- ...props,
800
- children
801
- }
802
- );
803
- }
804
- );
805
- AspectRatio.displayName = "AspectRatio";
806
- var Pagination = React20.forwardRef(
807
- ({ className, "aria-label": ariaLabel = "pagination", ...props }, ref) => {
808
- return /* @__PURE__ */ jsx(
809
- "nav",
810
- {
811
- ref,
812
- role: "navigation",
813
- "aria-label": ariaLabel,
814
- className: clsx18("ds-pagination", className),
815
- ...props
816
- }
817
- );
818
- }
819
- );
820
- Pagination.displayName = "Pagination";
821
- var PaginationContent = React20.forwardRef(({ className, ...props }, ref) => {
822
- return /* @__PURE__ */ jsx(
823
- "ul",
824
- {
825
- ref,
826
- className: clsx18("ds-pagination__content", className),
827
- ...props
828
- }
829
- );
830
- });
831
- PaginationContent.displayName = "PaginationContent";
832
- var PaginationItem = React20.forwardRef(({ className, ...props }, ref) => {
833
- return /* @__PURE__ */ jsx(
834
- "li",
835
- {
836
- ref,
837
- className: clsx18("ds-pagination__item", className),
838
- ...props
839
- }
840
- );
841
- });
842
- PaginationItem.displayName = "PaginationItem";
843
- var PaginationLink = React20.forwardRef(({ className, isActive = false, size = "md", asChild = false, ...props }, ref) => {
844
- const Comp = asChild ? Slot : "button";
845
- return /* @__PURE__ */ jsx(
846
- Comp,
847
- {
848
- ref,
849
- "aria-current": isActive ? "page" : void 0,
850
- className: clsx18(
851
- "ds-pagination__link",
852
- `ds-pagination__link--${size}`,
853
- isActive && "ds-pagination__link--active",
854
- className
855
- ),
856
- ...props
857
- }
858
- );
859
- });
860
- PaginationLink.displayName = "PaginationLink";
861
- var PaginationPrevious = React20.forwardRef(({ className, label = "Previous", "aria-label": ariaLabel = "Go to previous page", ...props }, ref) => {
862
- return /* @__PURE__ */ jsxs(
863
- PaginationLink,
864
- {
865
- ref,
866
- "aria-label": ariaLabel,
867
- className: clsx18("ds-pagination__prev", className),
868
- ...props,
869
- children: [
870
- /* @__PURE__ */ jsx(
871
- "svg",
872
- {
873
- xmlns: "http://www.w3.org/2000/svg",
874
- width: "16",
875
- height: "16",
876
- viewBox: "0 0 24 24",
877
- fill: "none",
878
- stroke: "currentColor",
879
- strokeWidth: "2",
880
- strokeLinecap: "round",
881
- strokeLinejoin: "round",
882
- "aria-hidden": "true",
883
- children: /* @__PURE__ */ jsx("path", { d: "m15 18-6-6 6-6" })
884
- }
885
- ),
886
- /* @__PURE__ */ jsx("span", { children: label })
887
- ]
888
- }
889
- );
890
- });
891
- PaginationPrevious.displayName = "PaginationPrevious";
892
- var PaginationNext = React20.forwardRef(({ className, label = "Next", "aria-label": ariaLabel = "Go to next page", ...props }, ref) => {
893
- return /* @__PURE__ */ jsxs(
894
- PaginationLink,
895
- {
896
- ref,
897
- "aria-label": ariaLabel,
898
- className: clsx18("ds-pagination__next", className),
899
- ...props,
900
- children: [
901
- /* @__PURE__ */ jsx("span", { children: label }),
902
- /* @__PURE__ */ jsx(
903
- "svg",
904
- {
905
- xmlns: "http://www.w3.org/2000/svg",
906
- width: "16",
907
- height: "16",
908
- viewBox: "0 0 24 24",
909
- fill: "none",
910
- stroke: "currentColor",
911
- strokeWidth: "2",
912
- strokeLinecap: "round",
913
- strokeLinejoin: "round",
914
- "aria-hidden": "true",
915
- children: /* @__PURE__ */ jsx("path", { d: "m9 18 6-6-6-6" })
916
- }
917
- )
918
- ]
919
- }
920
- );
921
- });
922
- PaginationNext.displayName = "PaginationNext";
923
- var PaginationEllipsis = React20.forwardRef(({ className, ...props }, ref) => {
924
- return /* @__PURE__ */ jsx(
925
- "span",
926
- {
927
- ref,
928
- "aria-hidden": "true",
929
- className: clsx18("ds-pagination__ellipsis", className),
930
- ...props,
931
- children: "..."
932
- }
933
- );
934
- });
935
- PaginationEllipsis.displayName = "PaginationEllipsis";
936
- var levelToElement = {
937
- display: "h1",
938
- h1: "h1",
939
- h2: "h2",
940
- h3: "h3",
941
- h4: "h4",
942
- h5: "h5",
943
- h6: "h6"
944
- };
945
- var Heading = React20.forwardRef(
946
- ({ className, level = "h2", as, children, ...props }, ref) => {
947
- const Comp = as ?? levelToElement[level];
948
- return /* @__PURE__ */ jsx(
949
- Comp,
950
- {
951
- ref,
952
- className: clsx18("ds-heading", `ds-heading--${level}`, className),
953
- ...props,
954
- children
955
- }
956
- );
957
- }
958
- );
959
- Heading.displayName = "Heading";
960
- var Text = React20.forwardRef(
961
- ({ className, variant = "body", as = "p", children, ...props }, ref) => {
962
- const Comp = as;
963
- return /* @__PURE__ */ jsx(
964
- Comp,
965
- {
966
- ref,
967
- className: clsx18("ds-text", `ds-text--${variant}`, className),
968
- ...props,
969
- children
970
- }
971
- );
972
- }
973
- );
974
- Text.displayName = "Text";
975
- var Prose = React20.forwardRef(
976
- ({ className, children, ...props }, ref) => {
977
- return /* @__PURE__ */ jsx(
978
- "div",
979
- {
980
- ref,
981
- className: clsx18("ds-prose", className),
982
- ...props,
983
- children
984
- }
985
- );
986
- }
987
- );
988
- Prose.displayName = "Prose";
989
- var CarouselContext = React20.createContext(void 0);
990
- function useCarouselContext() {
991
- const ctx = React20.useContext(CarouselContext);
992
- if (!ctx) {
993
- throw new Error("Carousel compound components must be used within a <Carousel> parent.");
994
- }
995
- return ctx;
996
- }
997
- var Carousel = React20.forwardRef(
998
- ({ className, children, ...props }, ref) => {
999
- const scrollRef = React20.useRef(null);
1000
- return /* @__PURE__ */ jsx(CarouselContext.Provider, { value: { scrollRef }, children: /* @__PURE__ */ jsx("div", { ref, className: clsx18("ds-carousel", className), ...props, children }) });
1001
- }
1002
- );
1003
- Carousel.displayName = "Carousel";
1004
- var CarouselContent = React20.forwardRef(({ className, ...props }, ref) => {
1005
- const { scrollRef } = useCarouselContext();
1006
- const mergedRef = React20.useCallback(
1007
- (node) => {
1008
- scrollRef.current = node;
1009
- if (typeof ref === "function") {
1010
- ref(node);
1011
- } else if (ref) {
1012
- ref.current = node;
1013
- }
1014
- },
1015
- [ref, scrollRef]
1016
- );
1017
- return /* @__PURE__ */ jsx("div", { ref: mergedRef, className: clsx18("ds-carousel__content", className), ...props });
1018
- });
1019
- CarouselContent.displayName = "CarouselContent";
1020
- var CarouselItem = React20.forwardRef(
1021
- ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx18("ds-carousel__item", className), ...props })
1022
- );
1023
- CarouselItem.displayName = "CarouselItem";
1024
- var CarouselPrevious = React20.forwardRef(({ className, onClick, children, "aria-label": ariaLabel = "Previous slide", ...props }, ref) => {
1025
- const { scrollRef } = useCarouselContext();
1026
- const handleClick = (e) => {
1027
- const container = scrollRef.current;
1028
- if (container) {
1029
- const firstItem = container.querySelector(".ds-carousel__item");
1030
- const scrollAmount = firstItem ? firstItem.clientWidth : container.clientWidth;
1031
- container.scrollBy({ left: -scrollAmount, behavior: "smooth" });
1032
- }
1033
- onClick?.(e);
1034
- };
1035
- return /* @__PURE__ */ jsx(
1036
- "button",
1037
- {
1038
- ref,
1039
- type: "button",
1040
- className: clsx18("ds-carousel__prev", className),
1041
- "aria-label": ariaLabel,
1042
- onClick: handleClick,
1043
- ...props,
1044
- children: children ?? /* @__PURE__ */ jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx(
1045
- "path",
1046
- {
1047
- d: "M10 12L6 8L10 4",
1048
- stroke: "currentColor",
1049
- strokeWidth: "1.5",
1050
- strokeLinecap: "round",
1051
- strokeLinejoin: "round"
1052
- }
1053
- ) })
1054
- }
1055
- );
1056
- });
1057
- CarouselPrevious.displayName = "CarouselPrevious";
1058
- var CarouselNext = React20.forwardRef(({ className, onClick, children, "aria-label": ariaLabel = "Next slide", ...props }, ref) => {
1059
- const { scrollRef } = useCarouselContext();
1060
- const handleClick = (e) => {
1061
- const container = scrollRef.current;
1062
- if (container) {
1063
- const firstItem = container.querySelector(".ds-carousel__item");
1064
- const scrollAmount = firstItem ? firstItem.clientWidth : container.clientWidth;
1065
- container.scrollBy({ left: scrollAmount, behavior: "smooth" });
1066
- }
1067
- onClick?.(e);
1068
- };
1069
- return /* @__PURE__ */ jsx(
1070
- "button",
1071
- {
1072
- ref,
1073
- type: "button",
1074
- className: clsx18("ds-carousel__next", className),
1075
- "aria-label": ariaLabel,
1076
- onClick: handleClick,
1077
- ...props,
1078
- children: children ?? /* @__PURE__ */ jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx(
1079
- "path",
1080
- {
1081
- d: "M6 4L10 8L6 12",
1082
- stroke: "currentColor",
1083
- strokeWidth: "1.5",
1084
- strokeLinecap: "round",
1085
- strokeLinejoin: "round"
1086
- }
1087
- ) })
1088
- }
1089
- );
1090
- });
1091
- CarouselNext.displayName = "CarouselNext";
1092
- function mergeRefs(...refs) {
1093
- return (node) => {
1094
- refs.forEach((ref) => {
1095
- if (typeof ref === "function") ref(node);
1096
- else if (ref) ref.current = node;
1097
- });
1098
- };
1099
- }
1100
- var CommandContext = React20.createContext(void 0);
1101
- function useCommandContext() {
1102
- const ctx = React20.useContext(CommandContext);
1103
- if (!ctx) {
1104
- throw new Error("Command compound components must be used within a <Command> parent.");
1105
- }
1106
- return ctx;
1107
- }
1108
- function getOptionElements(listEl) {
1109
- if (!listEl) return [];
1110
- return Array.from(listEl.querySelectorAll('[role="option"]'));
1111
- }
1112
- var Command = React20.forwardRef(
1113
- ({ className, value: controlledValue, onValueChange, onKeyDown, children, ...props }, ref) => {
1114
- const [uncontrolledValue, setUncontrolledValue] = React20.useState("");
1115
- const [activeId, setActiveId] = React20.useState(null);
1116
- const listRef = React20.useRef(null);
1117
- const isControlled = controlledValue !== void 0;
1118
- const search = isControlled ? controlledValue : uncontrolledValue;
1119
- const inputId = React20.useId();
1120
- const listId = React20.useId();
1121
- const setSearch = React20.useCallback(
1122
- (next) => {
1123
- if (!isControlled) {
1124
- setUncontrolledValue(next);
1125
- }
1126
- onValueChange?.(next);
1127
- },
1128
- [isControlled, onValueChange]
1129
- );
1130
- React20.useEffect(() => {
1131
- const frame = requestAnimationFrame(() => {
1132
- const items = getOptionElements(listRef.current);
1133
- if (items.length > 0) {
1134
- setActiveId(items[0].id);
1135
- } else {
1136
- setActiveId(null);
1137
- }
1138
- });
1139
- return () => cancelAnimationFrame(frame);
1140
- }, [search]);
1141
- const handleKeyDown = React20.useCallback(
1142
- (e) => {
1143
- const items = getOptionElements(listRef.current);
1144
- if (items.length === 0) {
1145
- onKeyDown?.(e);
1146
- return;
1147
- }
1148
- const currentIndex = items.findIndex((el) => el.id === activeId);
1149
- switch (e.key) {
1150
- case "ArrowDown": {
1151
- e.preventDefault();
1152
- const nextIndex = currentIndex < items.length - 1 ? currentIndex + 1 : 0;
1153
- setActiveId(items[nextIndex].id);
1154
- items[nextIndex].scrollIntoView?.({ block: "nearest" });
1155
- break;
1156
- }
1157
- case "ArrowUp": {
1158
- e.preventDefault();
1159
- const prevIndex = currentIndex > 0 ? currentIndex - 1 : items.length - 1;
1160
- setActiveId(items[prevIndex].id);
1161
- items[prevIndex].scrollIntoView?.({ block: "nearest" });
1162
- break;
1163
- }
1164
- case "Home": {
1165
- e.preventDefault();
1166
- setActiveId(items[0].id);
1167
- items[0].scrollIntoView?.({ block: "nearest" });
1168
- break;
1169
- }
1170
- case "End": {
1171
- e.preventDefault();
1172
- const lastItem = items[items.length - 1];
1173
- setActiveId(lastItem.id);
1174
- lastItem.scrollIntoView?.({ block: "nearest" });
1175
- break;
1176
- }
1177
- case "Enter": {
1178
- const target = e.target;
1179
- if (target.getAttribute("role") === "option") break;
1180
- const activeEl = activeId ? document.getElementById(activeId) : null;
1181
- if (activeEl) {
1182
- e.preventDefault();
1183
- activeEl.click();
1184
- }
1185
- break;
1186
- }
1187
- }
1188
- onKeyDown?.(e);
1189
- },
1190
- [activeId, onKeyDown]
1191
- );
1192
- const ctx = React20.useMemo(
1193
- () => ({ search, setSearch, activeId, setActiveId, listRef, inputId, listId }),
1194
- [search, setSearch, activeId, inputId, listId]
1195
- );
1196
- return /* @__PURE__ */ jsx(CommandContext.Provider, { value: ctx, children: /* @__PURE__ */ jsx(
1197
- "div",
1198
- {
1199
- ref,
1200
- className: clsx18("ds-command", className),
1201
- onKeyDown: handleKeyDown,
1202
- ...props,
1203
- children
1204
- }
1205
- ) });
1206
- }
1207
- );
1208
- Command.displayName = "Command";
1209
- var CommandInput = React20.forwardRef(({ className, onChange, ...props }, ref) => {
1210
- const { search, setSearch, activeId, inputId, listId } = useCommandContext();
1211
- const handleChange = (e) => {
1212
- setSearch(e.target.value);
1213
- onChange?.(e);
1214
- };
1215
- return /* @__PURE__ */ jsxs("div", { className: "ds-command__input-wrapper", children: [
1216
- /* @__PURE__ */ jsxs(
1217
- "svg",
1218
- {
1219
- className: "ds-command__input-icon",
1220
- width: "16",
1221
- height: "16",
1222
- viewBox: "0 0 16 16",
1223
- fill: "none",
1224
- "aria-hidden": "true",
1225
- children: [
1226
- /* @__PURE__ */ jsx("circle", { cx: "7", cy: "7", r: "5", stroke: "currentColor", strokeWidth: "1.5" }),
1227
- /* @__PURE__ */ jsx(
1228
- "path",
1229
- {
1230
- d: "M11 11L14 14",
1231
- stroke: "currentColor",
1232
- strokeWidth: "1.5",
1233
- strokeLinecap: "round"
1234
- }
1235
- )
1236
- ]
1237
- }
1238
- ),
1239
- /* @__PURE__ */ jsx(
1240
- "input",
1241
- {
1242
- ref,
1243
- id: inputId,
1244
- type: "text",
1245
- role: "combobox",
1246
- "aria-expanded": "true",
1247
- "aria-controls": listId,
1248
- "aria-activedescendant": activeId ?? void 0,
1249
- "aria-autocomplete": "list",
1250
- autoComplete: "off",
1251
- className: clsx18("ds-command__input", className),
1252
- value: search,
1253
- onChange: handleChange,
1254
- ...props
1255
- }
1256
- )
1257
- ] });
1258
- });
1259
- CommandInput.displayName = "CommandInput";
1260
- var CommandList = React20.forwardRef(
1261
- ({ className, ...props }, ref) => {
1262
- const { listRef, listId } = useCommandContext();
1263
- return /* @__PURE__ */ jsx(
1264
- "div",
1265
- {
1266
- ref: mergeRefs(ref, listRef),
1267
- id: listId,
1268
- role: "listbox",
1269
- className: clsx18("ds-command__list", className),
1270
- ...props
1271
- }
1272
- );
1273
- }
1274
- );
1275
- CommandList.displayName = "CommandList";
1276
- var CommandEmpty = React20.forwardRef(
1277
- ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx18("ds-command__empty", className), ...props })
1278
- );
1279
- CommandEmpty.displayName = "CommandEmpty";
1280
- var CommandGroup = React20.forwardRef(
1281
- ({ className, heading, children, ...props }, ref) => /* @__PURE__ */ jsxs("div", { ref, className: clsx18("ds-command__group", className), ...props, children: [
1282
- heading && /* @__PURE__ */ jsx("div", { className: "ds-command__group-heading", children: heading }),
1283
- children
1284
- ] })
1285
- );
1286
- CommandGroup.displayName = "CommandGroup";
1287
- var CommandItem = React20.forwardRef(
1288
- ({ className, onSelect, onClick, onKeyDown, onPointerEnter, id: externalId, ...props }, ref) => {
1289
- const generatedId = React20.useId();
1290
- const { activeId, setActiveId } = useCommandContext();
1291
- const itemId = externalId || generatedId;
1292
- const isActive = activeId === itemId;
1293
- const handleClick = (e) => {
1294
- onSelect?.();
1295
- onClick?.(e);
1296
- };
1297
- const handleKeyDown = (e) => {
1298
- if (e.key === "Enter") {
1299
- onSelect?.();
1300
- }
1301
- onKeyDown?.(e);
1302
- };
1303
- const handlePointerEnter = (e) => {
1304
- setActiveId(itemId);
1305
- onPointerEnter?.(e);
1306
- };
1307
- return /* @__PURE__ */ jsx(
1308
- "div",
1309
- {
1310
- ref,
1311
- id: itemId,
1312
- role: "option",
1313
- tabIndex: 0,
1314
- "aria-selected": isActive,
1315
- "data-active": isActive || void 0,
1316
- className: clsx18("ds-command__item", className),
1317
- onClick: handleClick,
1318
- onKeyDown: handleKeyDown,
1319
- onPointerEnter: handlePointerEnter,
1320
- ...props
1321
- }
1322
- );
1323
- }
1324
- );
1325
- CommandItem.displayName = "CommandItem";
1326
- var CommandSeparator = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx18("ds-command__separator", className), ...props }));
1327
- CommandSeparator.displayName = "CommandSeparator";
1328
- var SIZE_CLASSES = {
1329
- sm: "ds-dialog__content--sm",
1330
- lg: "ds-dialog__content--lg",
1331
- xl: "ds-dialog__content--xl"
1332
- };
1333
- var CommandDialog = ({
1334
- open,
1335
- onOpenChange,
1336
- title = "Search",
1337
- size = "lg",
1338
- className,
1339
- children
1340
- }) => /* @__PURE__ */ jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs(
1341
- DialogContent,
1342
- {
1343
- className: clsx18("ds-command-dialog", SIZE_CLASSES[size], className),
1344
- children: [
1345
- /* @__PURE__ */ jsx(DialogTitle, { className: "ds-command-dialog__sr-title", children: title }),
1346
- children
1347
- ]
1348
- }
1349
- ) });
1350
- CommandDialog.displayName = "CommandDialog";
1351
- var DrawerContext = React20.createContext(void 0);
1352
- function useDrawerContext() {
1353
- const ctx = React20.useContext(DrawerContext);
1354
- if (!ctx) {
1355
- throw new Error("Drawer compound components must be used within a <Drawer> parent.");
1356
- }
1357
- return ctx;
1358
- }
1359
- var Drawer = ({ open: controlledOpen, onOpenChange, children }) => {
1360
- const [uncontrolledOpen, setUncontrolledOpen] = React20.useState(false);
1361
- const isControlled = controlledOpen !== void 0;
1362
- const open = isControlled ? controlledOpen : uncontrolledOpen;
1363
- const handleOpenChange = React20.useCallback(
1364
- (next) => {
1365
- if (!isControlled) {
1366
- setUncontrolledOpen(next);
1367
- }
1368
- onOpenChange?.(next);
1369
- },
1370
- [isControlled, onOpenChange]
1371
- );
1372
- return /* @__PURE__ */ jsx(DrawerContext.Provider, { value: { open, onOpenChange: handleOpenChange }, children });
1373
- };
1374
- Drawer.displayName = "Drawer";
1375
- var DrawerTrigger = React20.forwardRef(({ onClick, ...props }, ref) => {
1376
- const { onOpenChange } = useDrawerContext();
1377
- const handleClick = (e) => {
1378
- onOpenChange(true);
1379
- onClick?.(e);
1380
- };
1381
- return /* @__PURE__ */ jsx("button", { ref, type: "button", onClick: handleClick, ...props });
1382
- });
1383
- DrawerTrigger.displayName = "DrawerTrigger";
1384
- var DrawerClose = React20.forwardRef(({ onClick, ...props }, ref) => {
1385
- const { onOpenChange } = useDrawerContext();
1386
- const handleClick = (e) => {
1387
- onOpenChange(false);
1388
- onClick?.(e);
1389
- };
1390
- return /* @__PURE__ */ jsx("button", { ref, type: "button", onClick: handleClick, ...props });
1391
- });
1392
- DrawerClose.displayName = "DrawerClose";
1393
- var DrawerContent = React20.forwardRef(
1394
- ({ className, children, ...props }, ref) => {
1395
- const { open, onOpenChange } = useDrawerContext();
1396
- if (!open) return null;
1397
- return createPortal(
1398
- /* @__PURE__ */ jsxs(Fragment, { children: [
1399
- /* @__PURE__ */ jsx(
1400
- "div",
1401
- {
1402
- className: "ds-drawer__backdrop",
1403
- onClick: () => onOpenChange(false),
1404
- "aria-hidden": "true"
1405
- }
1406
- ),
1407
- /* @__PURE__ */ jsxs(
1408
- "div",
1409
- {
1410
- ref,
1411
- role: "dialog",
1412
- className: clsx18("ds-drawer__content", className),
1413
- ...props,
1414
- children: [
1415
- /* @__PURE__ */ jsx("div", { className: "ds-drawer__handle", "aria-hidden": "true", children: /* @__PURE__ */ jsx("div", { className: "ds-drawer__handle-bar" }) }),
1416
- children
1417
- ]
1418
- }
1419
- )
1420
- ] }),
1421
- document.body
1422
- );
1423
- }
1424
- );
1425
- DrawerContent.displayName = "DrawerContent";
1426
- var DrawerHeader = React20.forwardRef(
1427
- ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx18("ds-drawer__header", className), ...props })
1428
- );
1429
- DrawerHeader.displayName = "DrawerHeader";
1430
- var DrawerTitle = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("h2", { ref, className: clsx18("ds-drawer__title", className), ...props }));
1431
- DrawerTitle.displayName = "DrawerTitle";
1432
- var DrawerDescription = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("p", { ref, className: clsx18("ds-drawer__description", className), ...props }));
1433
- DrawerDescription.displayName = "DrawerDescription";
1434
- var DrawerFooter = React20.forwardRef(
1435
- ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx18("ds-drawer__footer", className), ...props })
1436
- );
1437
- DrawerFooter.displayName = "DrawerFooter";
1438
- var DEFAULT_WEEKDAY_LABELS = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
1439
- var DEFAULT_MONTH_NAMES = [
1440
- "January",
1441
- "February",
1442
- "March",
1443
- "April",
1444
- "May",
1445
- "June",
1446
- "July",
1447
- "August",
1448
- "September",
1449
- "October",
1450
- "November",
1451
- "December"
1452
- ];
1453
- function isSameDay(a, b) {
1454
- return a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();
1455
- }
1456
- function getDaysInMonth(year, month) {
1457
- return new Date(year, month + 1, 0).getDate();
1458
- }
1459
- function getCalendarGrid(year, month) {
1460
- const firstDay = new Date(year, month, 1).getDay();
1461
- const daysInMonth = getDaysInMonth(year, month);
1462
- const daysInPrevMonth = getDaysInMonth(year, month - 1);
1463
- const days = [];
1464
- for (let i = firstDay - 1; i >= 0; i--) {
1465
- days.push(new Date(year, month - 1, daysInPrevMonth - i));
1466
- }
1467
- for (let d = 1; d <= daysInMonth; d++) {
1468
- days.push(new Date(year, month, d));
1469
- }
1470
- const remaining = 7 - days.length % 7;
1471
- if (remaining < 7) {
1472
- for (let d = 1; d <= remaining; d++) {
1473
- days.push(new Date(year, month + 1, d));
1474
- }
1475
- }
1476
- const weeks = [];
1477
- for (let i = 0; i < days.length; i += 7) {
1478
- weeks.push(days.slice(i, i + 7));
1479
- }
1480
- return weeks;
1481
- }
1482
- var Calendar = React20.forwardRef(
1483
- ({ className, selected, onSelect, month, onMonthChange, labels, ...props }, ref) => {
1484
- const weekdayLabels = labels?.weekdays ?? DEFAULT_WEEKDAY_LABELS;
1485
- const monthNames = labels?.months ?? DEFAULT_MONTH_NAMES;
1486
- const formatDayLabel = labels?.formatDayLabel ?? ((d) => d.toDateString());
1487
- const today = /* @__PURE__ */ new Date();
1488
- const [internalMonth, setInternalMonth] = React20.useState(
1489
- () => month ?? selected ?? /* @__PURE__ */ new Date()
1490
- );
1491
- const displayedMonth = month ?? internalMonth;
1492
- const displayYear = displayedMonth.getFullYear();
1493
- const displayMonthIndex = displayedMonth.getMonth();
1494
- const weeks = getCalendarGrid(displayYear, displayMonthIndex);
1495
- const navigateMonth = (delta) => {
1496
- const next = new Date(displayYear, displayMonthIndex + delta, 1);
1497
- if (onMonthChange) {
1498
- onMonthChange(next);
1499
- } else {
1500
- setInternalMonth(next);
1501
- }
1502
- };
1503
- const handleDayClick = (date) => {
1504
- onSelect?.(date);
1505
- };
1506
- return /* @__PURE__ */ jsxs("div", { ref, className: clsx18("ds-calendar", className), ...props, children: [
1507
- /* @__PURE__ */ jsxs("div", { className: "ds-calendar__header", children: [
1508
- /* @__PURE__ */ jsx(
1509
- "button",
1510
- {
1511
- type: "button",
1512
- className: "ds-calendar__nav-button",
1513
- onClick: () => navigateMonth(-1),
1514
- "aria-label": labels?.previousMonth ?? "Previous month",
1515
- children: /* @__PURE__ */ jsx(
1516
- "svg",
1517
- {
1518
- width: "16",
1519
- height: "16",
1520
- viewBox: "0 0 24 24",
1521
- fill: "none",
1522
- stroke: "currentColor",
1523
- strokeWidth: "2",
1524
- strokeLinecap: "round",
1525
- strokeLinejoin: "round",
1526
- children: /* @__PURE__ */ jsx("polyline", { points: "15 18 9 12 15 6" })
1527
- }
1528
- )
1529
- }
1530
- ),
1531
- /* @__PURE__ */ jsxs("div", { className: "ds-calendar__title", children: [
1532
- monthNames[displayMonthIndex],
1533
- " ",
1534
- displayYear
1535
- ] }),
1536
- /* @__PURE__ */ jsx(
1537
- "button",
1538
- {
1539
- type: "button",
1540
- className: "ds-calendar__nav-button",
1541
- onClick: () => navigateMonth(1),
1542
- "aria-label": labels?.nextMonth ?? "Next month",
1543
- children: /* @__PURE__ */ jsx(
1544
- "svg",
1545
- {
1546
- width: "16",
1547
- height: "16",
1548
- viewBox: "0 0 24 24",
1549
- fill: "none",
1550
- stroke: "currentColor",
1551
- strokeWidth: "2",
1552
- strokeLinecap: "round",
1553
- strokeLinejoin: "round",
1554
- children: /* @__PURE__ */ jsx("polyline", { points: "9 18 15 12 9 6" })
1555
- }
1556
- )
1557
- }
1558
- )
1559
- ] }),
1560
- /* @__PURE__ */ jsxs("div", { className: "ds-calendar__grid", role: "grid", children: [
1561
- /* @__PURE__ */ jsx("div", { className: "ds-calendar__head-row", role: "row", children: weekdayLabels.map((wdLabel) => /* @__PURE__ */ jsx("div", { className: "ds-calendar__head-cell", role: "columnheader", children: wdLabel }, wdLabel)) }),
1562
- /* @__PURE__ */ jsx("div", { className: "ds-calendar__body", children: weeks.map((week, wi) => /* @__PURE__ */ jsx("div", { className: "ds-calendar__row", role: "row", children: week.map((date, di) => {
1563
- const isOutside = date.getMonth() !== displayMonthIndex;
1564
- const isSelected = selected ? isSameDay(date, selected) : false;
1565
- const isToday = isSameDay(date, today);
1566
- return /* @__PURE__ */ jsx("div", { className: "ds-calendar__cell", role: "gridcell", children: /* @__PURE__ */ jsx(
1567
- "button",
1568
- {
1569
- type: "button",
1570
- className: clsx18(
1571
- "ds-calendar__day",
1572
- isSelected && "ds-calendar__day--selected",
1573
- isToday && "ds-calendar__day--today",
1574
- isOutside && "ds-calendar__day--outside"
1575
- ),
1576
- onClick: () => handleDayClick(date),
1577
- tabIndex: isOutside ? -1 : 0,
1578
- "aria-label": formatDayLabel(date),
1579
- children: date.getDate()
1580
- }
1581
- ) }, di);
1582
- }) }, wi)) })
1583
- ] })
1584
- ] });
1585
- }
1586
- );
1587
- Calendar.displayName = "Calendar";
1588
- var InputOTPContext = React20.createContext({
1589
- value: "",
1590
- activeIndex: -1
1591
- });
1592
- var InputOTP = React20.forwardRef(
1593
- ({ className, length = 6, value = "", onChange, children, "aria-label": ariaLabel = "One-time password", ...props }, ref) => {
1594
- const inputRef = React20.useRef(null);
1595
- const [activeIndex, setActiveIndex] = React20.useState(-1);
1596
- const handleChange = (e) => {
1597
- const newValue = e.target.value.replace(/[^0-9]/g, "").slice(0, length);
1598
- onChange?.(newValue);
1599
- };
1600
- const handleFocus = () => {
1601
- setActiveIndex(Math.min(value.length, length - 1));
1602
- };
1603
- const handleBlur = () => {
1604
- setActiveIndex(-1);
1605
- };
1606
- const handleKeyDown = (e) => {
1607
- if (e.key === "Backspace" && value.length > 0) {
1608
- onChange?.(value.slice(0, -1));
1609
- }
1610
- };
1611
- const handleContainerClick = () => {
1612
- inputRef.current?.focus();
1613
- };
1614
- const contextValue = React20.useMemo(
1615
- () => ({ value, activeIndex }),
1616
- [value, activeIndex]
1617
- );
1618
- return /* @__PURE__ */ jsx(InputOTPContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxs(
1619
- "div",
1620
- {
1621
- ref,
1622
- className: clsx18("ds-input-otp", className),
1623
- onClick: handleContainerClick,
1624
- ...props,
1625
- children: [
1626
- /* @__PURE__ */ jsx(
1627
- "input",
1628
- {
1629
- ref: inputRef,
1630
- type: "text",
1631
- inputMode: "numeric",
1632
- autoComplete: "one-time-code",
1633
- pattern: "[0-9]*",
1634
- maxLength: length,
1635
- value,
1636
- onChange: handleChange,
1637
- onFocus: handleFocus,
1638
- onBlur: handleBlur,
1639
- onKeyDown: handleKeyDown,
1640
- className: "ds-input-otp__hidden-input",
1641
- "aria-label": ariaLabel
1642
- }
1643
- ),
1644
- children
1645
- ]
1646
- }
1647
- ) });
1648
- }
1649
- );
1650
- InputOTP.displayName = "InputOTP";
1651
- var InputOTPGroup = React20.forwardRef(({ className, ...props }, ref) => {
1652
- return /* @__PURE__ */ jsx("div", { ref, className: clsx18("ds-input-otp__group", className), ...props });
1653
- });
1654
- InputOTPGroup.displayName = "InputOTPGroup";
1655
- var InputOTPSlot = React20.forwardRef(
1656
- ({ className, index, ...props }, ref) => {
1657
- const { value, activeIndex } = React20.useContext(InputOTPContext);
1658
- const char = value[index] ?? "";
1659
- const isActive = activeIndex === index;
1660
- const isFilled = char !== "";
1661
- return /* @__PURE__ */ jsx(
1662
- "div",
1663
- {
1664
- ref,
1665
- className: clsx18(
1666
- "ds-input-otp__slot",
1667
- isActive && "ds-input-otp__slot--active",
1668
- isFilled && "ds-input-otp__slot--filled",
1669
- className
1670
- ),
1671
- ...props,
1672
- children: char
1673
- }
1674
- );
1675
- }
1676
- );
1677
- InputOTPSlot.displayName = "InputOTPSlot";
1678
- var InputOTPSeparator = React20.forwardRef(({ className, ...props }, ref) => {
1679
- return /* @__PURE__ */ jsx("div", { ref, className: clsx18("ds-input-otp__separator", className), role: "separator", ...props, children: /* @__PURE__ */ jsx(
1680
- "svg",
1681
- {
1682
- width: "8",
1683
- height: "8",
1684
- viewBox: "0 0 8 8",
1685
- fill: "currentColor",
1686
- children: /* @__PURE__ */ jsx("circle", { cx: "4", cy: "4", r: "2" })
1687
- }
1688
- ) });
1689
- });
1690
- InputOTPSeparator.displayName = "InputOTPSeparator";
1691
- var ContextMenuContext = React20.createContext({
1692
- open: false,
1693
- position: { x: 0, y: 0 },
1694
- onClose: () => {
1695
- }
1696
- });
1697
- function ContextMenu({ children }) {
1698
- const [open, setOpen] = React20.useState(false);
1699
- const [position, setPosition] = React20.useState({ x: 0, y: 0 });
1700
- const handleOpen = React20.useCallback((x, y) => {
1701
- setPosition({ x, y });
1702
- setOpen(true);
1703
- }, []);
1704
- const handleClose = React20.useCallback(() => {
1705
- setOpen(false);
1706
- }, []);
1707
- const contextValue = React20.useMemo(
1708
- () => ({ open, position, onClose: handleClose }),
1709
- [open, position, handleClose]
1710
- );
1711
- return /* @__PURE__ */ jsx(ContextMenuInternalContext.Provider, { value: { onOpen: handleOpen }, children: /* @__PURE__ */ jsx(ContextMenuContext.Provider, { value: contextValue, children }) });
1712
- }
1713
- ContextMenu.displayName = "ContextMenu";
1714
- var ContextMenuInternalContext = React20.createContext({ onOpen: () => {
1715
- } });
1716
- var ContextMenuTrigger = React20.forwardRef(({ className, onContextMenu, ...props }, ref) => {
1717
- const { onOpen } = React20.useContext(ContextMenuInternalContext);
1718
- const handleContextMenu = (e) => {
1719
- e.preventDefault();
1720
- onOpen(e.clientX, e.clientY);
1721
- onContextMenu?.(e);
1722
- };
1723
- return /* @__PURE__ */ jsx(
1724
- "div",
1725
- {
1726
- ref,
1727
- className: clsx18("ds-context-menu__trigger", className),
1728
- onContextMenu: handleContextMenu,
1729
- ...props
1730
- }
1731
- );
1732
- });
1733
- ContextMenuTrigger.displayName = "ContextMenuTrigger";
1734
- var ContextMenuContent = React20.forwardRef(({ className, ...props }, ref) => {
1735
- const { open, position, onClose } = React20.useContext(ContextMenuContext);
1736
- const contentRef = React20.useRef(null);
1737
- const mergedRef = React20.useCallback(
1738
- (node) => {
1739
- contentRef.current = node;
1740
- if (typeof ref === "function") ref(node);
1741
- else if (ref) ref.current = node;
1742
- },
1743
- [ref]
1744
- );
1745
- React20.useEffect(() => {
1746
- if (!open) return;
1747
- const handleClickOutside = (e) => {
1748
- if (contentRef.current && !contentRef.current.contains(e.target)) {
1749
- onClose();
1750
- }
1751
- };
1752
- const handleEscape = (e) => {
1753
- if (e.key === "Escape") {
1754
- onClose();
1755
- }
1756
- };
1757
- const timer = setTimeout(() => {
1758
- document.addEventListener("mousedown", handleClickOutside);
1759
- }, 0);
1760
- document.addEventListener("keydown", handleEscape);
1761
- return () => {
1762
- clearTimeout(timer);
1763
- document.removeEventListener("mousedown", handleClickOutside);
1764
- document.removeEventListener("keydown", handleEscape);
1765
- };
1766
- }, [open, onClose]);
1767
- if (!open) return null;
1768
- return ReactDOM.createPortal(
1769
- /* @__PURE__ */ jsx(
1770
- "div",
1771
- {
1772
- ref: mergedRef,
1773
- role: "menu",
1774
- className: clsx18("ds-context-menu__content", className),
1775
- style: { top: position.y, left: position.x },
1776
- ...props
1777
- }
1778
- ),
1779
- document.body
1780
- );
1781
- });
1782
- ContextMenuContent.displayName = "ContextMenuContent";
1783
- var ContextMenuItem = React20.forwardRef(
1784
- ({ className, onSelect, onClick, ...props }, ref) => {
1785
- const { onClose } = React20.useContext(ContextMenuContext);
1786
- const handleClick = (e) => {
1787
- onSelect?.();
1788
- onClose();
1789
- onClick?.(e);
1790
- };
1791
- return /* @__PURE__ */ jsx(
1792
- "div",
1793
- {
1794
- ref,
1795
- role: "menuitem",
1796
- className: clsx18("ds-context-menu__item", className),
1797
- onClick: handleClick,
1798
- ...props
1799
- }
1800
- );
1801
- }
1802
- );
1803
- ContextMenuItem.displayName = "ContextMenuItem";
1804
- var ContextMenuSeparator = React20.forwardRef(({ className, ...props }, ref) => {
1805
- return /* @__PURE__ */ jsx(
1806
- "div",
1807
- {
1808
- ref,
1809
- role: "separator",
1810
- className: clsx18("ds-context-menu__separator", className),
1811
- ...props
1812
- }
1813
- );
1814
- });
1815
- ContextMenuSeparator.displayName = "ContextMenuSeparator";
1816
- var ContextMenuLabel = React20.forwardRef(({ className, ...props }, ref) => {
1817
- return /* @__PURE__ */ jsx(
1818
- "div",
1819
- {
1820
- ref,
1821
- className: clsx18("ds-context-menu__label", className),
1822
- ...props
1823
- }
1824
- );
1825
- });
1826
- ContextMenuLabel.displayName = "ContextMenuLabel";
1827
- var FormFieldContext = React20.createContext(void 0);
1828
- function useFormField() {
1829
- const ctx = React20.useContext(FormFieldContext);
1830
- if (!ctx) {
1831
- throw new Error("useFormField must be used within a <FormField>");
1832
- }
1833
- return ctx;
1834
- }
1835
- var FormItemContext = React20.createContext(void 0);
1836
- function FormField({ name, children, value, onChange, onBlur, error }) {
1837
- const id = React20.useId();
1838
- const contextValue = React20.useMemo(
1839
- () => ({ id: `${id}-form-item`, name, error }),
1840
- [id, name, error]
1841
- );
1842
- const fieldProps = React20.useMemo(
1843
- () => ({
1844
- value: value ?? "",
1845
- onChange: onChange ?? (() => {
1846
- }),
1847
- onBlur: onBlur ?? (() => {
1848
- }),
1849
- error,
1850
- id: `${id}-form-item`
1851
- }),
1852
- [value, onChange, onBlur, error, id]
1853
- );
1854
- return /* @__PURE__ */ jsx(FormFieldContext.Provider, { value: contextValue, children: children(fieldProps) });
1855
- }
1856
- FormField.displayName = "FormField";
1857
- var FormItem = React20.forwardRef(
1858
- ({ className, ...props }, ref) => {
1859
- const id = React20.useId();
1860
- const contextValue = React20.useMemo(() => ({ id }), [id]);
1861
- return /* @__PURE__ */ jsx(FormItemContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx("div", { ref, className: clsx18("ds-form__item", className), ...props }) });
1862
- }
1863
- );
1864
- FormItem.displayName = "FormItem";
1865
- var FormLabel = React20.forwardRef(({ className, ...props }, ref) => {
1866
- const fieldCtx = React20.useContext(FormFieldContext);
1867
- const hasError = !!fieldCtx?.error;
1868
- return /* @__PURE__ */ jsx(
1869
- "label",
1870
- {
1871
- ref,
1872
- htmlFor: fieldCtx?.id,
1873
- className: clsx18("ds-form__label", hasError && "ds-form__label--error", className),
1874
- ...props
1875
- }
1876
- );
1877
- });
1878
- FormLabel.displayName = "FormLabel";
1879
- var FormControl = React20.forwardRef(
1880
- ({ className, children, ...props }, ref) => {
1881
- const fieldCtx = React20.useContext(FormFieldContext);
1882
- const descriptionId = fieldCtx ? `${fieldCtx.id}-description` : void 0;
1883
- const messageId = fieldCtx ? `${fieldCtx.id}-message` : void 0;
1884
- const hasError = !!fieldCtx?.error;
1885
- return /* @__PURE__ */ jsx("div", { ref, className: clsx18("ds-form__control", className), ...props, children: React20.isValidElement(children) ? React20.cloneElement(children, {
1886
- id: fieldCtx?.id,
1887
- "aria-describedby": descriptionId,
1888
- "aria-invalid": hasError || void 0,
1889
- "aria-errormessage": hasError ? messageId : void 0
1890
- }) : children });
1891
- }
1892
- );
1893
- FormControl.displayName = "FormControl";
1894
- var FormDescription = React20.forwardRef(({ className, ...props }, ref) => {
1895
- const fieldCtx = React20.useContext(FormFieldContext);
1896
- return /* @__PURE__ */ jsx(
1897
- "p",
1898
- {
1899
- ref,
1900
- id: fieldCtx ? `${fieldCtx.id}-description` : void 0,
1901
- className: clsx18("ds-form__description", className),
1902
- ...props
1903
- }
1904
- );
1905
- });
1906
- FormDescription.displayName = "FormDescription";
1907
- var FormMessage = React20.forwardRef(({ className, children, ...props }, ref) => {
1908
- const fieldCtx = React20.useContext(FormFieldContext);
1909
- const message = children ?? fieldCtx?.error;
1910
- if (!message) return null;
1911
- return /* @__PURE__ */ jsx(
1912
- "p",
1913
- {
1914
- ref,
1915
- id: fieldCtx ? `${fieldCtx.id}-message` : void 0,
1916
- role: "alert",
1917
- className: clsx18("ds-form__message", className),
1918
- ...props,
1919
- children: message
1920
- }
1921
- );
1922
- });
1923
- FormMessage.displayName = "FormMessage";
1924
- var MAX_RESPONSIVE_COLS = 6;
1925
- var Grid = forwardRef(
1926
- ({ columns, rows, align, justify, fixed, className, style, ...props }, ref) => {
1927
- const useColClass = typeof columns === "number" && columns >= 1 && columns <= MAX_RESPONSIVE_COLS;
1928
- return /* @__PURE__ */ jsx(
1929
- Box,
1930
- {
1931
- ref,
1932
- className: clsx18(
1933
- "ds-grid",
1934
- useColClass && `ds-grid--cols-${columns}`,
1935
- fixed && "ds-grid--fixed",
1936
- className
1937
- ),
1938
- style: {
1939
- gridTemplateColumns: useColClass ? void 0 : typeof columns === "number" ? `repeat(${columns}, 1fr)` : columns,
1940
- gridTemplateRows: typeof rows === "number" ? `repeat(${rows}, 1fr)` : rows,
1941
- alignItems: align,
1942
- justifyItems: justify,
1943
- ...style
1944
- },
1945
- ...props
1946
- }
1947
- );
1948
- }
1949
- );
1950
- Grid.displayName = "Grid";
1951
- var Section = forwardRef(
1952
- ({ padding = "md", className, children, ...props }, ref) => {
1953
- return /* @__PURE__ */ jsx(
1954
- "section",
1955
- {
1956
- ref,
1957
- className: clsx18("ds-section-block", `ds-section-block--${padding}`, className),
1958
- ...props,
1959
- children
1960
- }
1961
- );
1962
- }
1963
- );
1964
- Section.displayName = "Section";
1965
- var VisuallyHidden = forwardRef(
1966
- ({ className, ...props }, ref) => {
1967
- return /* @__PURE__ */ jsx("span", { ref, className: clsx18("ds-visually-hidden", className), ...props });
1968
- }
1969
- );
1970
- VisuallyHidden.displayName = "VisuallyHidden";
1971
- var StatusBadge = React20.forwardRef(
1972
- ({ variant = "default", size = "md", dot = false, className, children }, ref) => {
1973
- return /* @__PURE__ */ jsxs(
1974
- "span",
1975
- {
1976
- ref,
1977
- className: clsx18(
1978
- "ds-status-badge",
1979
- `ds-status-badge--${variant}`,
1980
- `ds-status-badge--${size}`,
1981
- dot && "ds-status-badge--dot",
1982
- className
1983
- ),
1984
- children: [
1985
- dot && /* @__PURE__ */ jsx("span", { className: "ds-status-badge__dot" }),
1986
- children
1987
- ]
1988
- }
1989
- );
1990
- }
1991
- );
1992
- StatusBadge.displayName = "StatusBadge";
1993
- var DefaultIcons = {
1994
- info: /* @__PURE__ */ jsxs(
1995
- "svg",
1996
- {
1997
- width: "20",
1998
- height: "20",
1999
- viewBox: "0 0 24 24",
2000
- fill: "none",
2001
- stroke: "currentColor",
2002
- strokeWidth: "2",
2003
- strokeLinecap: "round",
2004
- strokeLinejoin: "round",
2005
- children: [
2006
- /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
2007
- /* @__PURE__ */ jsx("line", { x1: "12", y1: "16", x2: "12", y2: "12" }),
2008
- /* @__PURE__ */ jsx("line", { x1: "12", y1: "8", x2: "12.01", y2: "8" })
2009
- ]
2010
- }
2011
- ),
2012
- success: /* @__PURE__ */ jsxs(
2013
- "svg",
2014
- {
2015
- width: "20",
2016
- height: "20",
2017
- viewBox: "0 0 24 24",
2018
- fill: "none",
2019
- stroke: "currentColor",
2020
- strokeWidth: "2",
2021
- strokeLinecap: "round",
2022
- strokeLinejoin: "round",
2023
- children: [
2024
- /* @__PURE__ */ jsx("path", { d: "M22 11.08V12a10 10 0 1 1-5.93-9.14" }),
2025
- /* @__PURE__ */ jsx("polyline", { points: "22 4 12 14.01 9 11.01" })
2026
- ]
2027
- }
2028
- ),
2029
- warning: /* @__PURE__ */ jsxs(
2030
- "svg",
2031
- {
2032
- width: "20",
2033
- height: "20",
2034
- viewBox: "0 0 24 24",
2035
- fill: "none",
2036
- stroke: "currentColor",
2037
- strokeWidth: "2",
2038
- strokeLinecap: "round",
2039
- strokeLinejoin: "round",
2040
- children: [
2041
- /* @__PURE__ */ jsx("path", { d: "M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z" }),
2042
- /* @__PURE__ */ jsx("line", { x1: "12", y1: "9", x2: "12", y2: "13" }),
2043
- /* @__PURE__ */ jsx("line", { x1: "12", y1: "17", x2: "12.01", y2: "17" })
2044
- ]
2045
- }
2046
- ),
2047
- error: /* @__PURE__ */ jsxs(
2048
- "svg",
2049
- {
2050
- width: "20",
2051
- height: "20",
2052
- viewBox: "0 0 24 24",
2053
- fill: "none",
2054
- stroke: "currentColor",
2055
- strokeWidth: "2",
2056
- strokeLinecap: "round",
2057
- strokeLinejoin: "round",
2058
- children: [
2059
- /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
2060
- /* @__PURE__ */ jsx("line", { x1: "15", y1: "9", x2: "9", y2: "15" }),
2061
- /* @__PURE__ */ jsx("line", { x1: "9", y1: "9", x2: "15", y2: "15" })
2062
- ]
2063
- }
2064
- )
2065
- };
2066
- var Alert = React20.forwardRef(
2067
- ({ className, variant = "info", title, icon, children, ...props }, ref) => {
2068
- const renderedIcon = icon || DefaultIcons[variant];
2069
- return /* @__PURE__ */ jsxs(
2070
- "div",
2071
- {
2072
- ref,
2073
- role: "alert",
2074
- className: clsx18("ds-alert", `ds-alert--${variant}`, className),
2075
- ...props,
2076
- children: [
2077
- /* @__PURE__ */ jsx("div", { className: "ds-alert__icon", "aria-hidden": "true", children: renderedIcon }),
2078
- /* @__PURE__ */ jsxs("div", { className: "ds-alert__content", children: [
2079
- title && /* @__PURE__ */ jsx("div", { className: "ds-alert__title", children: title }),
2080
- children && /* @__PURE__ */ jsx("div", { className: "ds-alert__description", children })
2081
- ] })
2082
- ]
2083
- }
2084
- );
2085
- }
2086
- );
2087
- Alert.displayName = "Alert";
2088
- var ToastContext = createContext(void 0);
2089
- var useToast = () => {
2090
- const context = useContext(ToastContext);
2091
- if (!context) {
2092
- throw new Error("useToast must be used within a ToastProvider");
2093
- }
2094
- return context;
2095
- };
2096
- var ToastItem = ({
2097
- title,
2098
- description,
2099
- variant = "info",
2100
- action,
2101
- onDismiss,
2102
- dismissLabel = "Close"
2103
- }) => {
2104
- return /* @__PURE__ */ jsxs("div", { className: clsx18("ds-toast-root", `ds-toast--${variant}`), "data-state": "open", role: "alert", children: [
2105
- title && /* @__PURE__ */ jsx("div", { className: "ds-toast-title", children: title }),
2106
- description && /* @__PURE__ */ jsx("div", { className: "ds-toast-description", children: description }),
2107
- action && /* @__PURE__ */ jsx("div", { className: "ds-toast-action", children: action }),
2108
- /* @__PURE__ */ jsx(
2109
- "button",
2110
- {
2111
- onClick: onDismiss,
2112
- style: {
2113
- background: "transparent",
2114
- border: "none",
2115
- color: "var(--text-tertiary)",
2116
- cursor: "pointer",
2117
- padding: "4px",
2118
- marginLeft: "auto",
2119
- gridColumn: "action",
2120
- alignSelf: "start"
2121
- },
2122
- "aria-label": dismissLabel,
2123
- children: /* @__PURE__ */ jsxs(
2124
- "svg",
2125
- {
2126
- width: "14",
2127
- height: "14",
2128
- viewBox: "0 0 24 24",
2129
- fill: "none",
2130
- stroke: "currentColor",
2131
- strokeWidth: "2",
2132
- strokeLinecap: "round",
2133
- strokeLinejoin: "round",
2134
- children: [
2135
- /* @__PURE__ */ jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
2136
- /* @__PURE__ */ jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
2137
- ]
2138
- }
2139
- )
2140
- }
2141
- )
2142
- ] });
2143
- };
2144
- var ToastProvider = ({ children }) => {
2145
- const [toasts, setToasts] = useState([]);
2146
- const [mounted, setMounted] = useState(false);
2147
- const idCounter = useRef(0);
2148
- useEffect(() => setMounted(true), []);
2149
- const removeToast = useCallback((id) => {
2150
- setToasts((prev) => prev.filter((t) => t.id !== id));
2151
- }, []);
2152
- const addToast = useCallback(
2153
- ({ duration = 5e3, ...props }) => {
2154
- const id = `toast-${++idCounter.current}`;
2155
- const newToast = { ...props, id, duration };
2156
- setToasts((prev) => [...prev, newToast]);
2157
- if (duration !== Infinity) {
2158
- setTimeout(() => {
2159
- removeToast(id);
2160
- }, duration);
2161
- }
2162
- },
2163
- [removeToast]
2164
- );
2165
- return /* @__PURE__ */ jsxs(ToastContext.Provider, { value: { addToast, removeToast }, children: [
2166
- children,
2167
- mounted && createPortal(
2168
- /* @__PURE__ */ jsx("div", { className: "ds-toast-viewport", children: toasts.map((toast) => /* @__PURE__ */ jsx(ToastItem, { ...toast, onDismiss: () => removeToast(toast.id) }, toast.id)) }),
2169
- document.body
2170
- )
2171
- ] });
2172
- };
2173
- var EmptyState = React20.forwardRef(
2174
- ({ icon, title, description, action, className, ...props }, ref) => {
2175
- return /* @__PURE__ */ jsxs("div", { ref, className: clsx18("ds-empty-state", className), ...props, children: [
2176
- icon && /* @__PURE__ */ jsx("div", { className: "ds-empty-state__icon", children: icon }),
2177
- /* @__PURE__ */ jsx("h3", { className: "ds-empty-state__title", children: title }),
2178
- description && /* @__PURE__ */ jsx("p", { className: "ds-empty-state__description", children: description }),
2179
- action && /* @__PURE__ */ jsx("div", { className: "ds-empty-state__action", children: action })
2180
- ] });
2181
- }
2182
- );
2183
- EmptyState.displayName = "EmptyState";
2184
-
2185
- // src/tokens/colors.ts
2186
- var COLORS = {
2187
- text: {
2188
- primary: "var(--text-primary)",
2189
- secondary: "var(--text-secondary)",
2190
- tertiary: "var(--text-tertiary)",
2191
- disabled: "var(--text-disabled)"
2192
- },
2193
- glass: {
2194
- base: "var(--glass-base)",
2195
- baseHover: "var(--glass-base-hover)",
2196
- baseActive: "var(--glass-base-active)",
2197
- backdrop: "var(--glass-backdrop)"
2198
- },
2199
- rim: {
2200
- top: "var(--rim-light-top)",
2201
- bottom: "var(--rim-light-bottom)"
2202
- },
2203
- brand: {
2204
- pink: "var(--brand-pink)",
2205
- yellow: "var(--brand-yellow)",
2206
- pinkGlow: "var(--brand-pink-glow)"
2207
- },
2208
- status: {
2209
- success: "var(--status-success)",
2210
- warning: "var(--status-warning)",
2211
- error: "var(--status-error)",
2212
- info: "var(--status-info)"
2213
- },
2214
- button: {
2215
- primaryBg: "var(--btn-primary-bg)",
2216
- primaryBgHover: "var(--btn-primary-bg-hover)",
2217
- secondaryBg: "var(--btn-secondary-bg)",
2218
- secondaryBgHover: "var(--btn-secondary-bg-hover)"
2219
- }
2220
- };
2221
-
2222
- // src/tokens/typography.ts
2223
- var FONT_FAMILY = {
2224
- sans: "var(--font-family)",
2225
- mono: "var(--font-family-mono)"
2226
- };
2227
- var FONT_SIZE = {
2228
- xs: "var(--font-size-xs)",
2229
- sm: "var(--font-size-sm)",
2230
- base: "var(--font-size-base)",
2231
- lg: "var(--font-size-lg)",
2232
- xl: "var(--font-size-xl)",
2233
- "2xl": "var(--font-size-2xl)",
2234
- "3xl": "var(--font-size-3xl)"
2235
- };
2236
- var FONT_WEIGHT = {
2237
- normal: "var(--font-weight-normal)",
2238
- medium: "var(--font-weight-medium)",
2239
- semibold: "var(--font-weight-semibold)",
2240
- bold: "var(--font-weight-bold)"
2241
- };
2242
- var LINE_HEIGHT = {
2243
- tight: "var(--line-height-tight)",
2244
- normal: "var(--line-height-normal)",
2245
- relaxed: "var(--line-height-relaxed)"
2246
- };
2247
-
2248
- // src/tokens/radius.ts
2249
- var RADIUS = {
2250
- panel: "var(--radius-panel)",
2251
- card: "var(--radius-card)",
2252
- button: "var(--radius-button)",
2253
- badge: "var(--radius-badge)",
2254
- pill: "var(--radius-pill)"
2255
- };
2256
-
2257
- // src/tokens/shadows.ts
2258
- var SHADOWS = {
2259
- glass: {
2260
- outer: "var(--glass-shadow-outer)",
2261
- inner: "var(--glass-shadow-inner)",
2262
- combined: "var(--glass-shadow-combined)",
2263
- elevated: "var(--glass-shadow-elevated)",
2264
- elevatedCombined: "var(--glass-shadow-elevated-combined)"
2265
- },
2266
- interactive: {
2267
- rest: "var(--shadow-interactive-rest)",
2268
- restSubtle: "var(--shadow-interactive-rest-subtle)",
2269
- restLight: "var(--shadow-interactive-rest-light)",
2270
- hover: "var(--shadow-interactive-hover)",
2271
- hoverSubtle: "var(--shadow-interactive-hover-subtle)",
2272
- active: "var(--shadow-interactive-active)"
2273
- }
2274
- };
2275
-
2276
- // src/tokens/z-index.ts
2277
- var Z_INDEX = {
2278
- void: "var(--z-void)",
2279
- glassPanel: "var(--z-glass-panel)",
2280
- ornament: "var(--z-ornament)",
2281
- dropdown: "var(--z-dropdown)",
2282
- modalBackdrop: "var(--z-modal-backdrop)",
2283
- modal: "var(--z-modal)",
2284
- tooltip: "var(--z-tooltip)"
2285
- };
2286
-
2287
- // src/tokens/breakpoints.ts
2288
- var BREAKPOINTS = {
2289
- "3xs": 320,
2290
- "2xs": 375,
2291
- xs: 480,
2292
- sm: 640,
2293
- md: 768,
2294
- lg: 1024,
2295
- xl: 1280,
2296
- "2xl": 1536,
2297
- "3xl": 1920,
2298
- "4xl": 2560,
2299
- "5xl": 3840
2300
- };
2301
- var MEDIA_QUERIES = {
2302
- "3xs": `(min-width: ${BREAKPOINTS["3xs"]}px)`,
2303
- "2xs": `(min-width: ${BREAKPOINTS["2xs"]}px)`,
2304
- xs: `(min-width: ${BREAKPOINTS.xs}px)`,
2305
- sm: `(min-width: ${BREAKPOINTS.sm}px)`,
2306
- md: `(min-width: ${BREAKPOINTS.md}px)`,
2307
- lg: `(min-width: ${BREAKPOINTS.lg}px)`,
2308
- xl: `(min-width: ${BREAKPOINTS.xl}px)`,
2309
- "2xl": `(min-width: ${BREAKPOINTS["2xl"]}px)`,
2310
- "3xl": `(min-width: ${BREAKPOINTS["3xl"]}px)`,
2311
- "4xl": `(min-width: ${BREAKPOINTS["4xl"]}px)`,
2312
- "5xl": `(min-width: ${BREAKPOINTS["5xl"]}px)`
2313
- };
2314
-
2315
- export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AspectRatio, BREAKPOINTS, ButtonGroup, COLORS, Calendar, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, Collapsible, CollapsibleContent, CollapsibleTrigger, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, ContextMenu, ContextMenuContent, ContextMenuItem, ContextMenuLabel, ContextMenuSeparator, ContextMenuTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerTitle, DrawerTrigger, EmptyState, FONT_FAMILY, FONT_SIZE, FONT_WEIGHT, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, Grid, Heading, HoverCard, HoverCardContent, HoverCardTrigger, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, LINE_HEIGHT, Label, MEDIA_QUERIES, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, Popover, PopoverClose, PopoverContent, PopoverTrigger, Progress, Prose, RADIUS, Radio, RadioGroup, SHADOWS, ScrollArea, ScrollBar, Section, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Skeleton, StatusBadge, Switch, Text, TextArea, ToastContext, ToastItem, ToastProvider, Toggle, VisuallyHidden, Z_INDEX, useFormField, useToast };
2316
- //# sourceMappingURL=out.js.map
2317
- //# sourceMappingURL=chunk-MU6GW5ZV.js.map