@salesmind-ai/design-system 0.6.0 → 0.7.0

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