@spark-ui/components 17.2.3 → 17.2.4-beta.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 (302) hide show
  1. package/dist/DialogContent.styles-BSxCCi-u.mjs +62 -0
  2. package/dist/DialogContent.styles-BSxCCi-u.mjs.map +1 -0
  3. package/dist/DialogContent.styles-CAhJtUud.js +2 -0
  4. package/dist/DialogContent.styles-CAhJtUud.js.map +1 -0
  5. package/dist/FormFieldRequiredIndicator-CtgkvPZo.js +2 -0
  6. package/dist/FormFieldRequiredIndicator-CtgkvPZo.js.map +1 -0
  7. package/dist/FormFieldRequiredIndicator-DOGQ_HxO.mjs +14 -0
  8. package/dist/FormFieldRequiredIndicator-DOGQ_HxO.mjs.map +1 -0
  9. package/dist/accordion/index.js +2 -2
  10. package/dist/accordion/index.js.map +1 -1
  11. package/dist/accordion/index.mjs +99 -161
  12. package/dist/accordion/index.mjs.map +1 -1
  13. package/dist/alert-dialog/index.js +2 -2
  14. package/dist/alert-dialog/index.js.map +1 -1
  15. package/dist/alert-dialog/index.mjs +169 -235
  16. package/dist/alert-dialog/index.mjs.map +1 -1
  17. package/dist/avatar/index.js +2 -2
  18. package/dist/avatar/index.js.map +1 -1
  19. package/dist/avatar/index.mjs +187 -224
  20. package/dist/avatar/index.mjs.map +1 -1
  21. package/dist/badge/index.js +2 -2
  22. package/dist/badge/index.js.map +1 -1
  23. package/dist/badge/index.mjs +115 -81
  24. package/dist/badge/index.mjs.map +1 -1
  25. package/dist/breadcrumb/index.js +2 -2
  26. package/dist/breadcrumb/index.js.map +1 -1
  27. package/dist/breadcrumb/index.mjs +73 -106
  28. package/dist/breadcrumb/index.mjs.map +1 -1
  29. package/dist/button/index.js +1 -2
  30. package/dist/button/index.mjs +2 -5
  31. package/dist/button-BTDRzvpB.js +2 -0
  32. package/dist/button-BTDRzvpB.js.map +1 -0
  33. package/dist/button-_YZ_4J42.mjs +643 -0
  34. package/dist/button-_YZ_4J42.mjs.map +1 -0
  35. package/dist/card/index.js +2 -2
  36. package/dist/card/index.js.map +1 -1
  37. package/dist/card/index.mjs +327 -394
  38. package/dist/card/index.mjs.map +1 -1
  39. package/dist/carousel/index.js +2 -2
  40. package/dist/carousel/index.js.map +1 -1
  41. package/dist/carousel/index.mjs +515 -618
  42. package/dist/carousel/index.mjs.map +1 -1
  43. package/dist/checkbox/index.js +2 -2
  44. package/dist/checkbox/index.js.map +1 -1
  45. package/dist/checkbox/index.mjs +213 -246
  46. package/dist/checkbox/index.mjs.map +1 -1
  47. package/dist/chip/index.js +2 -2
  48. package/dist/chip/index.js.map +1 -1
  49. package/dist/chip/index.mjs +601 -652
  50. package/dist/chip/index.mjs.map +1 -1
  51. package/dist/chunk-C91j1N6u.js +1 -0
  52. package/dist/circular-meter/index.js +2 -2
  53. package/dist/circular-meter/index.js.map +1 -1
  54. package/dist/circular-meter/index.mjs +354 -309
  55. package/dist/circular-meter/index.mjs.map +1 -1
  56. package/dist/collapsible/index.js +2 -2
  57. package/dist/collapsible/index.js.map +1 -1
  58. package/dist/collapsible/index.mjs +53 -53
  59. package/dist/collapsible/index.mjs.map +1 -1
  60. package/dist/combobox/index.js +2 -2
  61. package/dist/combobox/index.js.map +1 -1
  62. package/dist/combobox/index.mjs +721 -876
  63. package/dist/combobox/index.mjs.map +1 -1
  64. package/dist/dialog/index.js +2 -2
  65. package/dist/dialog/index.js.map +1 -1
  66. package/dist/dialog/index.mjs +181 -206
  67. package/dist/dialog/index.mjs.map +1 -1
  68. package/dist/divider/index.js +2 -2
  69. package/dist/divider/index.js.map +1 -1
  70. package/dist/divider/index.mjs +178 -183
  71. package/dist/divider/index.mjs.map +1 -1
  72. package/dist/drawer/index.js +2 -2
  73. package/dist/drawer/index.js.map +1 -1
  74. package/dist/drawer/index.mjs +277 -309
  75. package/dist/drawer/index.mjs.map +1 -1
  76. package/dist/dropdown/index.js +2 -2
  77. package/dist/dropdown/index.js.map +1 -1
  78. package/dist/dropdown/index.mjs +429 -492
  79. package/dist/dropdown/index.mjs.map +1 -1
  80. package/dist/file-upload/index.js +2 -2
  81. package/dist/file-upload/index.js.map +1 -1
  82. package/dist/file-upload/index.mjs +540 -677
  83. package/dist/file-upload/index.mjs.map +1 -1
  84. package/dist/form-field/index.js +1 -2
  85. package/dist/form-field/index.mjs +2 -284
  86. package/dist/form-field-B8QzM655.mjs +231 -0
  87. package/dist/form-field-B8QzM655.mjs.map +1 -0
  88. package/dist/form-field-Bu_0E9tb.js +2 -0
  89. package/dist/form-field-Bu_0E9tb.js.map +1 -0
  90. package/dist/icon/index.js +1 -2
  91. package/dist/icon/index.mjs +2 -5
  92. package/dist/icon-CRPcdgYp.js +2 -0
  93. package/dist/icon-CRPcdgYp.js.map +1 -0
  94. package/dist/icon-D05Uqh8_.mjs +41 -0
  95. package/dist/icon-D05Uqh8_.mjs.map +1 -0
  96. package/dist/icon-button/index.js +1 -2
  97. package/dist/icon-button/index.mjs +2 -5
  98. package/dist/icon-button-6p3O7NIm.mjs +28 -0
  99. package/dist/icon-button-6p3O7NIm.mjs.map +1 -0
  100. package/dist/icon-button-CykysbgJ.js +2 -0
  101. package/dist/icon-button-CykysbgJ.js.map +1 -0
  102. package/dist/input/index.js +1 -2
  103. package/dist/input/index.mjs +2 -455
  104. package/dist/input-CmYeHYWQ.mjs +355 -0
  105. package/dist/input-CmYeHYWQ.mjs.map +1 -0
  106. package/dist/input-DNr40G2Z.js +2 -0
  107. package/dist/input-DNr40G2Z.js.map +1 -0
  108. package/dist/input-otp/index.js +2 -2
  109. package/dist/input-otp/index.js.map +1 -1
  110. package/dist/input-otp/index.mjs +344 -407
  111. package/dist/input-otp/index.mjs.map +1 -1
  112. package/dist/kbd/index.js +2 -2
  113. package/dist/kbd/index.js.map +1 -1
  114. package/dist/kbd/index.mjs +12 -17
  115. package/dist/kbd/index.mjs.map +1 -1
  116. package/dist/label/index.js +1 -2
  117. package/dist/label/index.mjs +2 -40
  118. package/dist/label-BqRlrca0.mjs +31 -0
  119. package/dist/label-BqRlrca0.mjs.map +1 -0
  120. package/dist/label-DU0p0d-f.js +2 -0
  121. package/dist/label-DU0p0d-f.js.map +1 -0
  122. package/dist/link-box/index.js +2 -2
  123. package/dist/link-box/index.js.map +1 -1
  124. package/dist/link-box/index.mjs +36 -34
  125. package/dist/link-box/index.mjs.map +1 -1
  126. package/dist/meter/index.js +2 -2
  127. package/dist/meter/index.js.map +1 -1
  128. package/dist/meter/index.mjs +149 -171
  129. package/dist/meter/index.mjs.map +1 -1
  130. package/dist/pagination/index.js +2 -2
  131. package/dist/pagination/index.js.map +1 -1
  132. package/dist/pagination/index.mjs +253 -214
  133. package/dist/pagination/index.mjs.map +1 -1
  134. package/dist/popover/index.js +1 -2
  135. package/dist/popover/index.mjs +2 -239
  136. package/dist/popover-CxZAQmw6.mjs +211 -0
  137. package/dist/popover-CxZAQmw6.mjs.map +1 -0
  138. package/dist/popover-GOovJ27J.js +2 -0
  139. package/dist/popover-GOovJ27J.js.map +1 -0
  140. package/dist/portal/index.js +2 -2
  141. package/dist/portal/index.js.map +1 -1
  142. package/dist/portal/index.mjs +8 -7
  143. package/dist/portal/index.mjs.map +1 -1
  144. package/dist/progress/index.js +1 -2
  145. package/dist/progress/index.mjs +2 -178
  146. package/dist/progress-cEf3tFbn.mjs +132 -0
  147. package/dist/progress-cEf3tFbn.mjs.map +1 -0
  148. package/dist/progress-rJZcPJsZ.js +2 -0
  149. package/dist/progress-rJZcPJsZ.js.map +1 -0
  150. package/dist/progress-tracker/index.js +2 -2
  151. package/dist/progress-tracker/index.js.map +1 -1
  152. package/dist/progress-tracker/index.mjs +303 -380
  153. package/dist/progress-tracker/index.mjs.map +1 -1
  154. package/dist/radio-group/index.js +2 -2
  155. package/dist/radio-group/index.js.map +1 -1
  156. package/dist/radio-group/index.mjs +204 -213
  157. package/dist/radio-group/index.mjs.map +1 -1
  158. package/dist/rating/index.js +2 -2
  159. package/dist/rating/index.js.map +1 -1
  160. package/dist/rating/index.mjs +189 -244
  161. package/dist/rating/index.mjs.map +1 -1
  162. package/dist/rating-display/index.js +2 -2
  163. package/dist/rating-display/index.js.map +1 -1
  164. package/dist/rating-display/index.mjs +165 -166
  165. package/dist/rating-display/index.mjs.map +1 -1
  166. package/dist/scrolling-list/index.js +2 -2
  167. package/dist/scrolling-list/index.js.map +1 -1
  168. package/dist/scrolling-list/index.mjs +216 -273
  169. package/dist/scrolling-list/index.mjs.map +1 -1
  170. package/dist/segmented-control/index.js +2 -2
  171. package/dist/segmented-control/index.js.map +1 -1
  172. package/dist/segmented-control/index.mjs +146 -180
  173. package/dist/segmented-control/index.mjs.map +1 -1
  174. package/dist/segmented-gauge/index.js +2 -2
  175. package/dist/segmented-gauge/index.js.map +1 -1
  176. package/dist/segmented-gauge/index.mjs +146 -195
  177. package/dist/segmented-gauge/index.mjs.map +1 -1
  178. package/dist/select/index.js +2 -2
  179. package/dist/select/index.js.map +1 -1
  180. package/dist/select/index.mjs +279 -327
  181. package/dist/select/index.mjs.map +1 -1
  182. package/dist/skeleton/index.js +2 -2
  183. package/dist/skeleton/index.js.map +1 -1
  184. package/dist/skeleton/index.mjs +92 -114
  185. package/dist/skeleton/index.mjs.map +1 -1
  186. package/dist/slider/index.js +2 -2
  187. package/dist/slider/index.js.map +1 -1
  188. package/dist/slider/index.mjs +259 -326
  189. package/dist/slider/index.mjs.map +1 -1
  190. package/dist/slot/index.js +2 -2
  191. package/dist/slot/index.js.map +1 -1
  192. package/dist/slot/index.mjs +12 -7
  193. package/dist/slot/index.mjs.map +1 -1
  194. package/dist/snackbar/index.js +2 -2
  195. package/dist/snackbar/index.js.map +1 -1
  196. package/dist/snackbar/index.mjs +404 -529
  197. package/dist/snackbar/index.mjs.map +1 -1
  198. package/dist/spinner/index.js +1 -2
  199. package/dist/spinner/index.mjs +2 -5
  200. package/dist/spinner-DFUoYvmm.js +2 -0
  201. package/dist/spinner-DFUoYvmm.js.map +1 -0
  202. package/dist/spinner-DULLiM6a.mjs +56 -0
  203. package/dist/spinner-DULLiM6a.mjs.map +1 -0
  204. package/dist/src/avatar/index.d.mts +2 -2
  205. package/dist/src/avatar/index.d.ts +2 -2
  206. package/dist/src/file-upload/index.d.mts +1 -1
  207. package/dist/src/file-upload/index.d.ts +1 -1
  208. package/dist/stepper/index.js +2 -2
  209. package/dist/stepper/index.js.map +1 -1
  210. package/dist/stepper/index.mjs +139 -176
  211. package/dist/stepper/index.mjs.map +1 -1
  212. package/dist/switch/index.js +2 -2
  213. package/dist/switch/index.js.map +1 -1
  214. package/dist/switch/index.mjs +194 -197
  215. package/dist/switch/index.mjs.map +1 -1
  216. package/dist/tabs/index.js +2 -2
  217. package/dist/tabs/index.js.map +1 -1
  218. package/dist/tabs/index.mjs +337 -389
  219. package/dist/tabs/index.mjs.map +1 -1
  220. package/dist/tag/index.js +2 -2
  221. package/dist/tag/index.js.map +1 -1
  222. package/dist/tag/index.mjs +192 -211
  223. package/dist/tag/index.mjs.map +1 -1
  224. package/dist/text-link/index.js +2 -2
  225. package/dist/text-link/index.js.map +1 -1
  226. package/dist/text-link/index.mjs +44 -5
  227. package/dist/text-link/index.mjs.map +1 -1
  228. package/dist/textarea/index.js +2 -2
  229. package/dist/textarea/index.js.map +1 -1
  230. package/dist/textarea/index.mjs +51 -50
  231. package/dist/textarea/index.mjs.map +1 -1
  232. package/dist/toast/index.js +2 -2
  233. package/dist/toast/index.js.map +1 -1
  234. package/dist/toast/index.mjs +314 -367
  235. package/dist/toast/index.mjs.map +1 -1
  236. package/dist/useRenderSlot-DP4fYerF.mjs +11 -0
  237. package/dist/useRenderSlot-DP4fYerF.mjs.map +1 -0
  238. package/dist/useRenderSlot-Xxf_s88b.js +2 -0
  239. package/dist/useRenderSlot-Xxf_s88b.js.map +1 -0
  240. package/dist/visually-hidden/index.js +2 -2
  241. package/dist/visually-hidden/index.js.map +1 -1
  242. package/dist/visually-hidden/index.mjs +25 -5
  243. package/dist/visually-hidden/index.mjs.map +1 -1
  244. package/package.json +4 -4
  245. package/dist/Button-1M9DcZl0.mjs +0 -704
  246. package/dist/Button-1M9DcZl0.mjs.map +0 -1
  247. package/dist/Button-FZceRWG2.js +0 -2
  248. package/dist/Button-FZceRWG2.js.map +0 -1
  249. package/dist/DialogContent.styles-CziMQtYr.js +0 -2
  250. package/dist/DialogContent.styles-CziMQtYr.js.map +0 -1
  251. package/dist/DialogContent.styles-Du7_Dkde.mjs +0 -60
  252. package/dist/DialogContent.styles-Du7_Dkde.mjs.map +0 -1
  253. package/dist/FormFieldRequiredIndicator-CHfcoT2y.js +0 -2
  254. package/dist/FormFieldRequiredIndicator-CHfcoT2y.js.map +0 -1
  255. package/dist/FormFieldRequiredIndicator-DTnCGiX2.mjs +0 -13
  256. package/dist/FormFieldRequiredIndicator-DTnCGiX2.mjs.map +0 -1
  257. package/dist/Icon-BO327oHU.mjs +0 -57
  258. package/dist/Icon-BO327oHU.mjs.map +0 -1
  259. package/dist/Icon-C-cNTnzd.js +0 -2
  260. package/dist/Icon-C-cNTnzd.js.map +0 -1
  261. package/dist/IconButton-BR1bJSQA.js +0 -2
  262. package/dist/IconButton-BR1bJSQA.js.map +0 -1
  263. package/dist/IconButton-DdB3Pq13.mjs +0 -43
  264. package/dist/IconButton-DdB3Pq13.mjs.map +0 -1
  265. package/dist/Slot-DLY1rJrG.mjs +0 -14
  266. package/dist/Slot-DLY1rJrG.mjs.map +0 -1
  267. package/dist/Slot-DQ8z2zsy.js +0 -2
  268. package/dist/Slot-DQ8z2zsy.js.map +0 -1
  269. package/dist/Spinner-Br4Rp9V2.js +0 -2
  270. package/dist/Spinner-Br4Rp9V2.js.map +0 -1
  271. package/dist/Spinner-Co3AjkQV.mjs +0 -68
  272. package/dist/Spinner-Co3AjkQV.mjs.map +0 -1
  273. package/dist/TextLink-5MvP0P8D.js +0 -2
  274. package/dist/TextLink-5MvP0P8D.js.map +0 -1
  275. package/dist/TextLink-Cc_LeVcx.mjs +0 -57
  276. package/dist/TextLink-Cc_LeVcx.mjs.map +0 -1
  277. package/dist/VisuallyHidden-CB6Nx76j.js +0 -2
  278. package/dist/VisuallyHidden-CB6Nx76j.js.map +0 -1
  279. package/dist/VisuallyHidden-DjlV0-CW.mjs +0 -28
  280. package/dist/VisuallyHidden-DjlV0-CW.mjs.map +0 -1
  281. package/dist/button/index.js.map +0 -1
  282. package/dist/button/index.mjs.map +0 -1
  283. package/dist/form-field/index.js.map +0 -1
  284. package/dist/form-field/index.mjs.map +0 -1
  285. package/dist/icon/index.js.map +0 -1
  286. package/dist/icon/index.mjs.map +0 -1
  287. package/dist/icon-button/index.js.map +0 -1
  288. package/dist/icon-button/index.mjs.map +0 -1
  289. package/dist/input/index.js.map +0 -1
  290. package/dist/input/index.mjs.map +0 -1
  291. package/dist/label/index.js.map +0 -1
  292. package/dist/label/index.mjs.map +0 -1
  293. package/dist/popover/index.js.map +0 -1
  294. package/dist/popover/index.mjs.map +0 -1
  295. package/dist/progress/index.js.map +0 -1
  296. package/dist/progress/index.mjs.map +0 -1
  297. package/dist/spinner/index.js.map +0 -1
  298. package/dist/spinner/index.mjs.map +0 -1
  299. package/dist/useRenderSlot-Bta2kdp4.mjs +0 -10
  300. package/dist/useRenderSlot-Bta2kdp4.mjs.map +0 -1
  301. package/dist/useRenderSlot-DATwjgpo.js +0 -2
  302. package/dist/useRenderSlot-DATwjgpo.js.map +0 -1
@@ -1,212 +1,187 @@
1
- import { jsx as t } from "react/jsx-runtime";
2
- import { Dialog as n } from "@base-ui/react/dialog";
3
- import { createContext as B, useState as I, useContext as P, useRef as R, useEffect as F } from "react";
4
- import { useMergeRefs as O } from "@spark-ui/hooks/use-merge-refs";
5
- import { useScrollOverflow as T } from "@spark-ui/hooks/use-scroll-overflow";
6
- import { cx as s } from "class-variance-authority";
7
- import { u as g } from "../useRenderSlot-Bta2kdp4.mjs";
8
- import { Close as $ } from "@spark-ui/icons/Close";
9
- import { I as H } from "../Icon-BO327oHU.mjs";
10
- import { I as j } from "../IconButton-DdB3Pq13.mjs";
11
- import { d as z } from "../DialogContent.styles-Du7_Dkde.mjs";
12
- const u = B(null), E = ({
13
- children: o,
14
- withFade: e = !1
15
- }) => {
16
- const [a, r] = I(!1);
17
- return /* @__PURE__ */ t(
18
- u.Provider,
19
- {
20
- value: {
21
- isFullScreen: a,
22
- setIsFullScreen: r,
23
- withFade: e
24
- },
25
- children: o
26
- }
27
- );
28
- }, f = () => {
29
- const o = P(u);
30
- if (!o)
31
- throw Error("useDialog must be used within a Dialog provider");
32
- return o;
33
- }, m = ({ withFade: o = !1, onOpenChange: e, ...a }) => {
34
- const r = e ? (i, l) => {
35
- e(i);
36
- } : void 0;
37
- return /* @__PURE__ */ t(E, { withFade: o, children: /* @__PURE__ */ t(n.Root, { "data-spark-component": "dialog", onOpenChange: r, ...a }) });
1
+ import { t as e } from "../icon-D05Uqh8_.mjs";
2
+ import { t } from "../DialogContent.styles-BSxCCi-u.mjs";
3
+ import { t as n } from "../icon-button-6p3O7NIm.mjs";
4
+ import { t as r } from "../useRenderSlot-DP4fYerF.mjs";
5
+ import { cx as i } from "class-variance-authority";
6
+ import { createContext as a, useContext as o, useEffect as s, useRef as c, useState as l } from "react";
7
+ import { jsx as u } from "react/jsx-runtime";
8
+ import { useMergeRefs as d } from "@spark-ui/hooks/use-merge-refs";
9
+ import { useScrollOverflow as f } from "@spark-ui/hooks/use-scroll-overflow";
10
+ import { Close as p } from "@spark-ui/icons/Close";
11
+ import { Dialog as m } from "@base-ui/react/dialog";
12
+ //#region src/dialog/DialogContext.tsx
13
+ var h = a(null), g = ({ children: e, withFade: t = !1 }) => {
14
+ let [n, r] = l(!1);
15
+ return /* @__PURE__ */ u(h.Provider, {
16
+ value: {
17
+ isFullScreen: n,
18
+ setIsFullScreen: r,
19
+ withFade: t
20
+ },
21
+ children: e
22
+ });
23
+ }, _ = () => {
24
+ let e = o(h);
25
+ if (!e) throw Error("useDialog must be used within a Dialog provider");
26
+ return e;
27
+ }, v = ({ withFade: e = !1, onOpenChange: t, ...n }) => {
28
+ let r = t ? (e, n) => {
29
+ t(e);
30
+ } : void 0;
31
+ return /* @__PURE__ */ u(g, {
32
+ withFade: e,
33
+ children: /* @__PURE__ */ u(m.Root, {
34
+ "data-spark-component": "dialog",
35
+ onOpenChange: r,
36
+ ...n
37
+ })
38
+ });
38
39
  };
39
- m.createHandle = n.createHandle;
40
- m.displayName = "Dialog.Root";
41
- const y = ({
42
- children: o,
43
- className: e,
44
- inset: a = !1,
45
- ref: r,
46
- ...i
47
- }) => {
48
- const l = R(null), d = O(r, l), { withFade: c } = f(), { overflow: p } = T(l);
49
- return /* @__PURE__ */ t(
50
- "div",
51
- {
52
- "data-spark-component": "dialog-body",
53
- ref: d,
54
- className: s(
55
- "focus-visible:u-outline relative grow overflow-y-auto outline-hidden",
56
- "transition-all duration-300",
57
- {
58
- "px-xl py-lg": !a
59
- },
60
- e
61
- ),
62
- style: {
63
- ...c && {
64
- maskImage: "linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))",
65
- maskSize: `100% calc(100% + ${p.top ? "0px" : "44px"} + ${p.bottom ? "0px" : "44px"})`,
66
- maskPosition: `0 ${p.top ? "0px" : "-44px"}`
67
- }
68
- },
69
- ...i,
70
- children: o
71
- }
72
- );
40
+ v.createHandle = m.createHandle, v.displayName = "Dialog.Root";
41
+ //#endregion
42
+ //#region src/dialog/DialogBody.tsx
43
+ var y = ({ children: e, className: t, inset: n = !1, ref: r, ...a }) => {
44
+ let o = c(null), s = d(r, o), { withFade: l } = _(), { overflow: p } = f(o);
45
+ return /* @__PURE__ */ u("div", {
46
+ "data-spark-component": "dialog-body",
47
+ ref: s,
48
+ className: i("focus-visible:u-outline relative grow overflow-y-auto outline-hidden", "transition-all duration-300", { "px-xl py-lg": !n }, t),
49
+ style: { ...l && {
50
+ maskImage: "linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))",
51
+ maskSize: `100% calc(100% + ${p.top ? "0px" : "44px"} + ${p.bottom ? "0px" : "44px"})`,
52
+ maskPosition: `0 ${p.top ? "0px" : "-44px"}`
53
+ } },
54
+ ...a,
55
+ children: e
56
+ });
73
57
  };
74
58
  y.displayName = "Dialog.Body";
75
- const x = ({ asChild: o = !1, ...e }) => {
76
- const a = g(o, "button");
77
- return /* @__PURE__ */ t(n.Close, { "data-spark-component": "dialog-close", render: a, ...e });
78
- }, D = ({
79
- "aria-label": o,
80
- className: e,
81
- size: a = "md",
82
- intent: r = "neutral",
83
- design: i = "ghost",
84
- children: l = /* @__PURE__ */ t($, {}),
85
- ref: d,
86
- ...c
87
- }) => /* @__PURE__ */ t(
88
- x,
89
- {
90
- "data-spark-component": "dialog-close-button",
91
- "data-part": "close",
92
- ref: d,
93
- className: s(["absolute", "top-md", "right-xl"], e),
94
- asChild: !0,
95
- ...c,
96
- children: /* @__PURE__ */ t(j, { intent: r, size: a, design: i, "aria-label": o, children: /* @__PURE__ */ t(H, { children: l }) })
97
- }
98
- ), A = Object.assign(D, {
99
- id: "CloseButton"
100
- });
101
- D.displayName = "Dialog.CloseButton";
102
- const b = ({
103
- className: o,
104
- isNarrow: e = !1,
105
- size: a = "md",
106
- ref: r,
107
- ...i
108
- }) => {
109
- const { setIsFullScreen: l } = f();
110
- return F(() => (a === "fullscreen" && l(!0), () => l(!1)), [l, a]), /* @__PURE__ */ t(
111
- n.Popup,
112
- {
113
- ref: r,
114
- "data-spark-component": "dialog-content",
115
- role: "dialog",
116
- className: (d) => s(
117
- z({
118
- isNarrow: e,
119
- size: a,
120
- className: typeof o == "function" ? o(d) : o
121
- })
122
- ),
123
- ...i
124
- }
125
- );
126
- };
127
- b.displayName = "Dialog.Content";
128
- const h = (o) => /* @__PURE__ */ t(n.Description, { "data-spark-component": "dialog-description", ...o });
129
- h.displayName = "Dialog.Description";
130
- const v = ({ children: o, className: e, ref: a, ...r }) => /* @__PURE__ */ t(
131
- "footer",
132
- {
133
- "data-spark-component": "dialog-footer",
134
- ref: a,
135
- className: s(e, ["px-xl", "py-lg"]),
136
- ...r,
137
- children: o
138
- }
139
- );
140
- v.displayName = "Dialog.Footer";
141
- const N = ({ children: o, className: e, ref: a, ...r }) => /* @__PURE__ */ t(
142
- "header",
143
- {
144
- "data-spark-component": "dialog-header",
145
- ref: a,
146
- className: s(e, ["px-xl", "py-lg"]),
147
- ...r,
148
- children: o
149
- }
150
- );
151
- N.displayName = "Dialog.Header";
152
- const k = ({ className: o, ...e }) => /* @__PURE__ */ t(
153
- n.Backdrop,
154
- {
155
- "data-spark-component": "dialog-overlay",
156
- className: (a) => s(
157
- "z-overlay size-screen fixed inset-0",
158
- "bg-overlay/dim-1",
159
- "data-starting-style:animate-fade-in",
160
- "data-ending-style:animate-fade-out",
161
- typeof o == "function" ? o(a) : o
162
- ),
163
- ...e
164
- }
165
- );
166
- k.displayName = "Dialog.Overlay";
167
- const C = ({ className: o, ...e }) => /* @__PURE__ */ t(
168
- n.Portal,
169
- {
170
- "data-spark-component": "dialog-portal",
171
- className: s(o, "z-modal absolute"),
172
- ...e
173
- }
174
- );
175
- C.displayName = "Dialog.Portal";
176
- const S = ({ className: o, ref: e, ...a }) => /* @__PURE__ */ t(
177
- n.Title,
178
- {
179
- "data-spark-component": "dialog-title",
180
- ref: e,
181
- className: s(
182
- "text-headline-1 text-on-surface",
183
- "group-has-data-[part=close]:pr-3xl",
184
- o
185
- ),
186
- ...a
187
- }
188
- );
189
- S.displayName = "Dialog.Title";
190
- const w = ({ asChild: o = !1, ...e }) => {
191
- const a = g(o, "button");
192
- return /* @__PURE__ */ t(n.Trigger, { "data-spark-component": "dialog-trigger", render: a, ...e });
59
+ //#endregion
60
+ //#region src/dialog/DialogClose.tsx
61
+ var b = ({ asChild: e = !1, ...t }) => {
62
+ let n = r(e, "button");
63
+ return /* @__PURE__ */ u(m.Close, {
64
+ "data-spark-component": "dialog-close",
65
+ render: n,
66
+ ...t
67
+ });
68
+ }, x = ({ "aria-label": t, className: r, size: a = "md", intent: o = "neutral", design: s = "ghost", children: c = /* @__PURE__ */ u(p, {}), ref: l, ...d }) => /* @__PURE__ */ u(b, {
69
+ "data-spark-component": "dialog-close-button",
70
+ "data-part": "close",
71
+ ref: l,
72
+ className: i([
73
+ "absolute",
74
+ "top-md",
75
+ "right-xl"
76
+ ], r),
77
+ asChild: !0,
78
+ ...d,
79
+ children: /* @__PURE__ */ u(n, {
80
+ intent: o,
81
+ size: a,
82
+ design: s,
83
+ "aria-label": t,
84
+ children: /* @__PURE__ */ u(e, { children: c })
85
+ })
86
+ }), S = Object.assign(x, { id: "CloseButton" });
87
+ x.displayName = "Dialog.CloseButton";
88
+ //#endregion
89
+ //#region src/dialog/DialogContent.tsx
90
+ var C = ({ className: e, isNarrow: n = !1, size: r = "md", ref: a, ...o }) => {
91
+ let { setIsFullScreen: c } = _();
92
+ return s(() => (r === "fullscreen" && c(!0), () => c(!1)), [c, r]), /* @__PURE__ */ u(m.Popup, {
93
+ ref: a,
94
+ "data-spark-component": "dialog-content",
95
+ role: "dialog",
96
+ className: (a) => i(t({
97
+ isNarrow: n,
98
+ size: r,
99
+ className: typeof e == "function" ? e(a) : e
100
+ })),
101
+ ...o
102
+ });
193
103
  };
194
- w.displayName = "Dialog.Trigger";
195
- const M = Object.assign(m, {
196
- Trigger: w,
197
- Portal: C,
198
- Overlay: k,
199
- Content: b,
200
- Header: N,
201
- Body: y,
202
- Footer: v,
203
- Close: x,
204
- CloseButton: A,
205
- Title: S,
206
- Description: h
104
+ C.displayName = "Dialog.Content";
105
+ //#endregion
106
+ //#region src/dialog/DialogDescription.tsx
107
+ var w = (e) => /* @__PURE__ */ u(m.Description, {
108
+ "data-spark-component": "dialog-description",
109
+ ...e
110
+ });
111
+ w.displayName = "Dialog.Description";
112
+ //#endregion
113
+ //#region src/dialog/DialogFooter.tsx
114
+ var T = ({ children: e, className: t, ref: n, ...r }) => /* @__PURE__ */ u("footer", {
115
+ "data-spark-component": "dialog-footer",
116
+ ref: n,
117
+ className: i(t, ["px-xl", "py-lg"]),
118
+ ...r,
119
+ children: e
120
+ });
121
+ T.displayName = "Dialog.Footer";
122
+ //#endregion
123
+ //#region src/dialog/DialogHeader.tsx
124
+ var E = ({ children: e, className: t, ref: n, ...r }) => /* @__PURE__ */ u("header", {
125
+ "data-spark-component": "dialog-header",
126
+ ref: n,
127
+ className: i(t, ["px-xl", "py-lg"]),
128
+ ...r,
129
+ children: e
207
130
  });
208
- M.displayName = "Dialog";
209
- export {
210
- M as Dialog
131
+ E.displayName = "Dialog.Header";
132
+ //#endregion
133
+ //#region src/dialog/DialogOverlay.tsx
134
+ var D = ({ className: e, ...t }) => /* @__PURE__ */ u(m.Backdrop, {
135
+ "data-spark-component": "dialog-overlay",
136
+ className: (t) => i("z-overlay size-screen fixed inset-0", "bg-overlay/dim-1", "data-starting-style:animate-fade-in", "data-ending-style:animate-fade-out", typeof e == "function" ? e(t) : e),
137
+ ...t
138
+ });
139
+ D.displayName = "Dialog.Overlay";
140
+ //#endregion
141
+ //#region src/dialog/DialogPortal.tsx
142
+ var O = ({ className: e, ...t }) => /* @__PURE__ */ u(m.Portal, {
143
+ "data-spark-component": "dialog-portal",
144
+ className: i(e, "z-modal absolute"),
145
+ ...t
146
+ });
147
+ O.displayName = "Dialog.Portal";
148
+ //#endregion
149
+ //#region src/dialog/DialogTitle.tsx
150
+ var k = ({ className: e, ref: t, ...n }) => /* @__PURE__ */ u(m.Title, {
151
+ "data-spark-component": "dialog-title",
152
+ ref: t,
153
+ className: i("text-headline-1 text-on-surface", "group-has-data-[part=close]:pr-3xl", e),
154
+ ...n
155
+ });
156
+ k.displayName = "Dialog.Title";
157
+ //#endregion
158
+ //#region src/dialog/DialogTrigger.tsx
159
+ var A = ({ asChild: e = !1, ...t }) => {
160
+ let n = r(e, "button");
161
+ return /* @__PURE__ */ u(m.Trigger, {
162
+ "data-spark-component": "dialog-trigger",
163
+ render: n,
164
+ ...t
165
+ });
211
166
  };
212
- //# sourceMappingURL=index.mjs.map
167
+ A.displayName = "Dialog.Trigger";
168
+ //#endregion
169
+ //#region src/dialog/index.ts
170
+ var j = Object.assign(v, {
171
+ Trigger: A,
172
+ Portal: O,
173
+ Overlay: D,
174
+ Content: C,
175
+ Header: E,
176
+ Body: y,
177
+ Footer: T,
178
+ Close: b,
179
+ CloseButton: S,
180
+ Title: k,
181
+ Description: w
182
+ });
183
+ j.displayName = "Dialog";
184
+ //#endregion
185
+ export { j as Dialog };
186
+
187
+ //# sourceMappingURL=index.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.mjs","sources":["../../src/dialog/DialogContext.tsx","../../src/dialog/Dialog.tsx","../../src/dialog/DialogBody.tsx","../../src/dialog/DialogClose.tsx","../../src/dialog/DialogCloseButton.tsx","../../src/dialog/DialogContent.tsx","../../src/dialog/DialogDescription.tsx","../../src/dialog/DialogFooter.tsx","../../src/dialog/DialogHeader.tsx","../../src/dialog/DialogOverlay.tsx","../../src/dialog/DialogPortal.tsx","../../src/dialog/DialogTitle.tsx","../../src/dialog/DialogTrigger.tsx","../../src/dialog/index.ts"],"sourcesContent":["import { createContext, type ReactNode, useContext, useState } from 'react'\n\nexport interface DialogContextState {\n isFullScreen: boolean\n setIsFullScreen: (value: boolean) => void\n withFade: boolean\n}\n\nconst DialogContext = createContext<DialogContextState | null>(null)\n\nexport const DialogProvider = ({\n children: childrenProp,\n withFade = false,\n}: {\n children: ReactNode\n withFade?: boolean\n}) => {\n const [isFullScreen, setIsFullScreen] = useState(false)\n\n return (\n <DialogContext.Provider\n value={{\n isFullScreen,\n setIsFullScreen,\n withFade,\n }}\n >\n {childrenProp}\n </DialogContext.Provider>\n )\n}\n\nexport const useDialog = () => {\n const context = useContext(DialogContext)\n\n if (!context) {\n throw Error('useDialog must be used within a Dialog provider')\n }\n\n return context\n}\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { ComponentProps, type ReactElement } from 'react'\n\nimport { DialogProvider } from './DialogContext'\n\nexport interface DialogProps\n extends Omit<ComponentProps<typeof BaseDialog.Root>, 'onOpenChange' | 'render'> {\n /**\n * Specifies if the dialog is open or not.\n */\n open?: boolean\n /**\n * Default open state.\n */\n defaultOpen?: boolean\n /**\n * Handler executed on every dialog open state change.\n */\n onOpenChange?: (open: boolean) => void\n /**\n * Specifies if the dialog is a modal.\n */\n modal?: boolean\n /**\n * Specifies if the dialog should have a fade animation on its body (in case it is scrollable).\n */\n withFade?: boolean\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n}\n\nexport const Dialog = ({ withFade = false, onOpenChange, ...props }: DialogProps): ReactElement => {\n const handleOpenChange = onOpenChange\n ? (open: boolean, _eventDetails: unknown) => {\n onOpenChange(open)\n }\n : undefined\n\n return (\n <DialogProvider withFade={withFade}>\n <BaseDialog.Root data-spark-component=\"dialog\" onOpenChange={handleOpenChange} {...props} />\n </DialogProvider>\n )\n}\n\nDialog.createHandle = BaseDialog.createHandle\nDialog.displayName = 'Dialog.Root'\n","import { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { useScrollOverflow } from '@spark-ui/hooks/use-scroll-overflow'\nimport { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref, useRef } from 'react'\n\nimport { useDialog } from './DialogContext'\n\nexport interface BodyProps {\n children: ReactNode\n className?: string\n tabIndex?: number\n ref?: Ref<HTMLDivElement>\n inset?: boolean\n}\n\nexport const Body = ({\n children,\n className,\n inset = false,\n ref: forwardedRef,\n ...rest\n}: BodyProps): ReactElement => {\n const scrollAreaRef = useRef<HTMLDivElement>(null)\n const ref = useMergeRefs(forwardedRef, scrollAreaRef)\n\n const { withFade } = useDialog()\n\n const { overflow } = useScrollOverflow(scrollAreaRef)\n\n return (\n <div\n data-spark-component=\"dialog-body\"\n ref={ref}\n className={cx(\n 'focus-visible:u-outline relative grow overflow-y-auto outline-hidden',\n 'transition-all duration-300',\n {\n ['px-xl py-lg']: !inset,\n },\n className\n )}\n style={{\n ...(withFade && {\n maskImage:\n 'linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))',\n maskSize: `100% calc(100% + ${overflow.top ? '0px' : '44px'} + ${overflow.bottom ? '0px' : '44px'})`,\n maskPosition: `0 ${overflow.top ? '0px' : '-44px'}`,\n }),\n }}\n {...rest}\n >\n {children}\n </div>\n )\n}\n\nBody.displayName = 'Dialog.Body'\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useRenderSlot } from '../drawer/useRenderSlot'\n\nexport interface CloseProps extends Omit<ComponentProps<typeof BaseDialog.Close>, 'render'> {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const Close = ({ asChild = false, ...props }: CloseProps) => {\n const renderSlot = useRenderSlot(asChild, 'button')\n\n return <BaseDialog.Close data-spark-component=\"dialog-close\" render={renderSlot} {...props} />\n}\n","import { Close as CloseSVG } from '@spark-ui/icons/Close'\nimport { cx } from 'class-variance-authority'\n\nimport { Icon } from '../icon'\nimport { IconButton, type IconButtonProps } from '../icon-button'\nimport { Close, CloseProps } from './DialogClose'\n\nexport type CloseButtonProps = CloseProps &\n Pick<IconButtonProps, 'size' | 'intent' | 'design' | 'aria-label'>\n\nconst Root = ({\n 'aria-label': ariaLabel,\n className,\n size = 'md',\n intent = 'neutral',\n design = 'ghost',\n children = <CloseSVG />,\n ref,\n ...rest\n}: CloseButtonProps) => {\n return (\n <Close\n data-spark-component=\"dialog-close-button\"\n data-part=\"close\"\n ref={ref}\n className={cx(['absolute', 'top-md', 'right-xl'], className)}\n asChild\n {...rest}\n >\n <IconButton intent={intent} size={size} design={design} aria-label={ariaLabel}>\n <Icon>{children}</Icon>\n </IconButton>\n </Close>\n )\n}\n\nexport const CloseButton = Object.assign(Root, {\n id: 'CloseButton',\n})\n\nRoot.displayName = 'Dialog.CloseButton'\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref, useEffect } from 'react'\n\nimport { dialogContentStyles, type DialogContentStylesProps } from './DialogContent.styles'\nimport { useDialog } from './DialogContext'\n\nexport interface ContentProps\n extends Omit<ComponentProps<typeof BaseDialog.Popup>, 'render'>,\n DialogContentStylesProps {\n /**\n * When set to true, the content will adjust its width to fit the content rather than taking up the full available width.\n */\n isNarrow?: boolean\n ref?: Ref<HTMLDivElement>\n}\n\nexport const Content = ({\n className,\n isNarrow = false,\n size = 'md',\n ref,\n ...rest\n}: ContentProps) => {\n const { setIsFullScreen } = useDialog()\n\n useEffect(() => {\n if (size === 'fullscreen') setIsFullScreen(true)\n\n return () => setIsFullScreen(false)\n }, [setIsFullScreen, size])\n\n return (\n <BaseDialog.Popup\n ref={ref}\n data-spark-component=\"dialog-content\"\n role=\"dialog\"\n className={state =>\n cx(\n dialogContentStyles({\n isNarrow,\n size,\n className: typeof className === 'function' ? className(state) : className,\n })\n )\n }\n {...rest}\n />\n )\n}\n\nContent.displayName = 'Dialog.Content'\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { ComponentProps, Ref } from 'react'\n\nexport type DescriptionProps = ComponentProps<typeof BaseDialog.Description> & {\n ref?: Ref<HTMLParagraphElement>\n}\n\nexport const Description = (props: DescriptionProps) => (\n <BaseDialog.Description data-spark-component=\"dialog-description\" {...props} />\n)\n\nDescription.displayName = 'Dialog.Description'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface FooterProps {\n children: ReactNode\n className?: string\n ref?: Ref<HTMLDivElement>\n}\n\nexport const Footer = ({ children, className, ref, ...rest }: FooterProps): ReactElement => (\n <footer\n data-spark-component=\"dialog-footer\"\n ref={ref}\n className={cx(className, ['px-xl', 'py-lg'])}\n {...rest}\n >\n {children}\n </footer>\n)\n\nFooter.displayName = 'Dialog.Footer'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface HeaderProps {\n children: ReactNode\n className?: string\n ref?: Ref<HTMLDivElement>\n}\n\nexport const Header = ({ children, className, ref, ...rest }: HeaderProps): ReactElement => (\n <header\n data-spark-component=\"dialog-header\"\n ref={ref}\n className={cx(className, ['px-xl', 'py-lg'])}\n {...rest}\n >\n {children}\n </header>\n)\n\nHeader.displayName = 'Dialog.Header'\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface OverlayProps extends Omit<ComponentProps<typeof BaseDialog.Backdrop>, 'render'> {\n ref?: Ref<HTMLDivElement>\n}\n\nexport const Overlay = ({ className, ...props }: OverlayProps) => {\n return (\n <BaseDialog.Backdrop\n data-spark-component=\"dialog-overlay\"\n className={state =>\n cx(\n 'z-overlay size-screen fixed inset-0',\n 'bg-overlay/dim-1',\n 'data-starting-style:animate-fade-in',\n 'data-ending-style:animate-fade-out',\n typeof className === 'function' ? className(state) : className\n )\n }\n {...props}\n />\n )\n}\n\nOverlay.displayName = 'Dialog.Overlay'\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps } from 'react'\n\nexport type PortalProps = ComponentProps<typeof BaseDialog.Portal>\n\nexport const Portal = ({ className, ...props }: PortalProps) => {\n return (\n <BaseDialog.Portal\n data-spark-component=\"dialog-portal\"\n className={cx(className, 'z-modal absolute')}\n {...props}\n />\n )\n}\n\nPortal.displayName = 'Dialog.Portal'\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport type TitleProps = ComponentProps<typeof BaseDialog.Title> & {\n ref?: Ref<HTMLHeadingElement>\n}\n\nexport const Title = ({ className, ref, ...others }: TitleProps) => {\n return (\n <BaseDialog.Title\n data-spark-component=\"dialog-title\"\n ref={ref}\n className={cx(\n 'text-headline-1 text-on-surface',\n 'group-has-data-[part=close]:pr-3xl',\n className\n )}\n {...others}\n />\n )\n}\n\nTitle.displayName = 'Dialog.Title'\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useRenderSlot } from '../drawer/useRenderSlot'\n\nexport interface TriggerProps extends Omit<ComponentProps<typeof BaseDialog.Trigger>, 'render'> {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const Trigger = ({ asChild = false, ...props }: TriggerProps) => {\n const renderSlot = useRenderSlot(asChild, 'button')\n\n return <BaseDialog.Trigger data-spark-component=\"dialog-trigger\" render={renderSlot} {...props} />\n}\n\nTrigger.displayName = 'Dialog.Trigger'\n","import { Dialog as Root } from './Dialog'\nimport { Body } from './DialogBody'\nimport { Close } from './DialogClose'\nimport { CloseButton } from './DialogCloseButton'\nimport { Content } from './DialogContent'\nimport { Description } from './DialogDescription' // aria-describedby\nimport { Footer } from './DialogFooter'\nimport { Header } from './DialogHeader'\nimport { Overlay } from './DialogOverlay'\nimport { Portal } from './DialogPortal'\nimport { Title } from './DialogTitle' // aria-labelledby\nimport { Trigger } from './DialogTrigger'\n\nexport const Dialog: typeof Root & {\n Trigger: typeof Trigger\n Portal: typeof Portal\n Overlay: typeof Overlay\n Content: typeof Content\n Header: typeof Header\n Body: typeof Body\n Footer: typeof Footer\n Close: typeof Close\n CloseButton: typeof CloseButton\n Title: typeof Title\n Description: typeof Description\n} = Object.assign(Root, {\n Trigger,\n Portal,\n Overlay,\n Content,\n Header,\n Body,\n Footer,\n Close,\n CloseButton,\n Title,\n Description,\n})\n\nDialog.displayName = 'Dialog'\n\nexport { type DialogProps } from './Dialog'\nexport { type ContentProps as DialogContentProps } from './DialogContent'\nexport { type HeaderProps as DialogHeaderProps } from './DialogHeader'\nexport { type BodyProps as DialogBodyProps } from './DialogBody'\nexport { type FooterProps as DialogFooterProps } from './DialogFooter'\nexport { type TriggerProps as DialogTriggerProps } from './DialogTrigger'\nexport { type OverlayProps as DialogOverlayProps } from './DialogOverlay'\nexport { type PortalProps as DialogPortalProps } from './DialogPortal'\nexport { type TitleProps as DialogTitleProps } from './DialogTitle'\nexport { type DescriptionProps as DialogDescriptionProps } from './DialogDescription'\nexport { type CloseProps as DialogCloseProps } from './DialogClose'\nexport { type CloseButtonProps as DialogCloseButtonProps } from './DialogCloseButton'\n"],"names":["DialogContext","createContext","DialogProvider","childrenProp","withFade","isFullScreen","setIsFullScreen","useState","jsx","useDialog","context","useContext","Dialog","onOpenChange","props","handleOpenChange","open","_eventDetails","BaseDialog","Body","children","className","inset","forwardedRef","rest","scrollAreaRef","useRef","ref","useMergeRefs","overflow","useScrollOverflow","cx","Close","asChild","renderSlot","useRenderSlot","Root","ariaLabel","size","intent","design","CloseSVG","IconButton","Icon","CloseButton","Content","isNarrow","useEffect","state","dialogContentStyles","Description","Footer","Header","Overlay","Portal","Title","others","Trigger"],"mappings":"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"}
1
+ {"version":3,"file":"index.mjs","names":[],"sources":["../../src/dialog/DialogContext.tsx","../../src/dialog/Dialog.tsx","../../src/dialog/DialogBody.tsx","../../src/dialog/DialogClose.tsx","../../src/dialog/DialogCloseButton.tsx","../../src/dialog/DialogContent.tsx","../../src/dialog/DialogDescription.tsx","../../src/dialog/DialogFooter.tsx","../../src/dialog/DialogHeader.tsx","../../src/dialog/DialogOverlay.tsx","../../src/dialog/DialogPortal.tsx","../../src/dialog/DialogTitle.tsx","../../src/dialog/DialogTrigger.tsx","../../src/dialog/index.ts"],"sourcesContent":["import { createContext, type ReactNode, useContext, useState } from 'react'\n\nexport interface DialogContextState {\n isFullScreen: boolean\n setIsFullScreen: (value: boolean) => void\n withFade: boolean\n}\n\nconst DialogContext = createContext<DialogContextState | null>(null)\n\nexport const DialogProvider = ({\n children: childrenProp,\n withFade = false,\n}: {\n children: ReactNode\n withFade?: boolean\n}) => {\n const [isFullScreen, setIsFullScreen] = useState(false)\n\n return (\n <DialogContext.Provider\n value={{\n isFullScreen,\n setIsFullScreen,\n withFade,\n }}\n >\n {childrenProp}\n </DialogContext.Provider>\n )\n}\n\nexport const useDialog = () => {\n const context = useContext(DialogContext)\n\n if (!context) {\n throw Error('useDialog must be used within a Dialog provider')\n }\n\n return context\n}\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { ComponentProps, type ReactElement } from 'react'\n\nimport { DialogProvider } from './DialogContext'\n\nexport interface DialogProps extends Omit<\n ComponentProps<typeof BaseDialog.Root>,\n 'onOpenChange' | 'render'\n> {\n /**\n * Specifies if the dialog is open or not.\n */\n open?: boolean\n /**\n * Default open state.\n */\n defaultOpen?: boolean\n /**\n * Handler executed on every dialog open state change.\n */\n onOpenChange?: (open: boolean) => void\n /**\n * Specifies if the dialog is a modal.\n */\n modal?: boolean\n /**\n * Specifies if the dialog should have a fade animation on its body (in case it is scrollable).\n */\n withFade?: boolean\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n}\n\nexport const Dialog = ({ withFade = false, onOpenChange, ...props }: DialogProps): ReactElement => {\n const handleOpenChange = onOpenChange\n ? (open: boolean, _eventDetails: unknown) => {\n onOpenChange(open)\n }\n : undefined\n\n return (\n <DialogProvider withFade={withFade}>\n <BaseDialog.Root data-spark-component=\"dialog\" onOpenChange={handleOpenChange} {...props} />\n </DialogProvider>\n )\n}\n\nDialog.createHandle = BaseDialog.createHandle\nDialog.displayName = 'Dialog.Root'\n","import { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { useScrollOverflow } from '@spark-ui/hooks/use-scroll-overflow'\nimport { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref, useRef } from 'react'\n\nimport { useDialog } from './DialogContext'\n\nexport interface BodyProps {\n children: ReactNode\n className?: string\n tabIndex?: number\n ref?: Ref<HTMLDivElement>\n inset?: boolean\n}\n\nexport const Body = ({\n children,\n className,\n inset = false,\n ref: forwardedRef,\n ...rest\n}: BodyProps): ReactElement => {\n const scrollAreaRef = useRef<HTMLDivElement>(null)\n const ref = useMergeRefs(forwardedRef, scrollAreaRef)\n\n const { withFade } = useDialog()\n\n const { overflow } = useScrollOverflow(scrollAreaRef)\n\n return (\n <div\n data-spark-component=\"dialog-body\"\n ref={ref}\n className={cx(\n 'focus-visible:u-outline relative grow overflow-y-auto outline-hidden',\n 'transition-all duration-300',\n {\n ['px-xl py-lg']: !inset,\n },\n className\n )}\n style={{\n ...(withFade && {\n maskImage:\n 'linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 44px, rgba(0, 0, 0, 1) calc(100% - 44px), rgba(0, 0, 0, 0))',\n maskSize: `100% calc(100% + ${overflow.top ? '0px' : '44px'} + ${overflow.bottom ? '0px' : '44px'})`,\n maskPosition: `0 ${overflow.top ? '0px' : '-44px'}`,\n }),\n }}\n {...rest}\n >\n {children}\n </div>\n )\n}\n\nBody.displayName = 'Dialog.Body'\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useRenderSlot } from '../drawer/useRenderSlot'\n\nexport interface CloseProps extends Omit<ComponentProps<typeof BaseDialog.Close>, 'render'> {\n /**\n * Change the default rendered element for the one passed as a child, merging their props and behavior.\n */\n asChild?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const Close = ({ asChild = false, ...props }: CloseProps) => {\n const renderSlot = useRenderSlot(asChild, 'button')\n\n return <BaseDialog.Close data-spark-component=\"dialog-close\" render={renderSlot} {...props} />\n}\n","import { Close as CloseSVG } from '@spark-ui/icons/Close'\nimport { cx } from 'class-variance-authority'\n\nimport { Icon } from '../icon'\nimport { IconButton, type IconButtonProps } from '../icon-button'\nimport { Close, CloseProps } from './DialogClose'\n\nexport type CloseButtonProps = CloseProps &\n Pick<IconButtonProps, 'size' | 'intent' | 'design' | 'aria-label'>\n\nconst Root = ({\n 'aria-label': ariaLabel,\n className,\n size = 'md',\n intent = 'neutral',\n design = 'ghost',\n children = <CloseSVG />,\n ref,\n ...rest\n}: CloseButtonProps) => {\n return (\n <Close\n data-spark-component=\"dialog-close-button\"\n data-part=\"close\"\n ref={ref}\n className={cx(['absolute', 'top-md', 'right-xl'], className)}\n asChild\n {...rest}\n >\n <IconButton intent={intent} size={size} design={design} aria-label={ariaLabel}>\n <Icon>{children}</Icon>\n </IconButton>\n </Close>\n )\n}\n\nexport const CloseButton = Object.assign(Root, {\n id: 'CloseButton',\n})\n\nRoot.displayName = 'Dialog.CloseButton'\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref, useEffect } from 'react'\n\nimport { dialogContentStyles, type DialogContentStylesProps } from './DialogContent.styles'\nimport { useDialog } from './DialogContext'\n\nexport interface ContentProps\n extends Omit<ComponentProps<typeof BaseDialog.Popup>, 'render'>, DialogContentStylesProps {\n /**\n * When set to true, the content will adjust its width to fit the content rather than taking up the full available width.\n */\n isNarrow?: boolean\n ref?: Ref<HTMLDivElement>\n}\n\nexport const Content = ({\n className,\n isNarrow = false,\n size = 'md',\n ref,\n ...rest\n}: ContentProps) => {\n const { setIsFullScreen } = useDialog()\n\n useEffect(() => {\n if (size === 'fullscreen') setIsFullScreen(true)\n\n return () => setIsFullScreen(false)\n }, [setIsFullScreen, size])\n\n return (\n <BaseDialog.Popup\n ref={ref}\n data-spark-component=\"dialog-content\"\n role=\"dialog\"\n className={state =>\n cx(\n dialogContentStyles({\n isNarrow,\n size,\n className: typeof className === 'function' ? className(state) : className,\n })\n )\n }\n {...rest}\n />\n )\n}\n\nContent.displayName = 'Dialog.Content'\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { ComponentProps, Ref } from 'react'\n\nexport type DescriptionProps = ComponentProps<typeof BaseDialog.Description> & {\n ref?: Ref<HTMLParagraphElement>\n}\n\nexport const Description = (props: DescriptionProps) => (\n <BaseDialog.Description data-spark-component=\"dialog-description\" {...props} />\n)\n\nDescription.displayName = 'Dialog.Description'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface FooterProps {\n children: ReactNode\n className?: string\n ref?: Ref<HTMLDivElement>\n}\n\nexport const Footer = ({ children, className, ref, ...rest }: FooterProps): ReactElement => (\n <footer\n data-spark-component=\"dialog-footer\"\n ref={ref}\n className={cx(className, ['px-xl', 'py-lg'])}\n {...rest}\n >\n {children}\n </footer>\n)\n\nFooter.displayName = 'Dialog.Footer'\n","import { cx } from 'class-variance-authority'\nimport { type ReactElement, type ReactNode, Ref } from 'react'\n\nexport interface HeaderProps {\n children: ReactNode\n className?: string\n ref?: Ref<HTMLDivElement>\n}\n\nexport const Header = ({ children, className, ref, ...rest }: HeaderProps): ReactElement => (\n <header\n data-spark-component=\"dialog-header\"\n ref={ref}\n className={cx(className, ['px-xl', 'py-lg'])}\n {...rest}\n >\n {children}\n </header>\n)\n\nHeader.displayName = 'Dialog.Header'\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport interface OverlayProps extends Omit<ComponentProps<typeof BaseDialog.Backdrop>, 'render'> {\n ref?: Ref<HTMLDivElement>\n}\n\nexport const Overlay = ({ className, ...props }: OverlayProps) => {\n return (\n <BaseDialog.Backdrop\n data-spark-component=\"dialog-overlay\"\n className={state =>\n cx(\n 'z-overlay size-screen fixed inset-0',\n 'bg-overlay/dim-1',\n 'data-starting-style:animate-fade-in',\n 'data-ending-style:animate-fade-out',\n typeof className === 'function' ? className(state) : className\n )\n }\n {...props}\n />\n )\n}\n\nOverlay.displayName = 'Dialog.Overlay'\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps } from 'react'\n\nexport type PortalProps = ComponentProps<typeof BaseDialog.Portal>\n\nexport const Portal = ({ className, ...props }: PortalProps) => {\n return (\n <BaseDialog.Portal\n data-spark-component=\"dialog-portal\"\n className={cx(className, 'z-modal absolute')}\n {...props}\n />\n )\n}\n\nPortal.displayName = 'Dialog.Portal'\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { cx } from 'class-variance-authority'\nimport { ComponentProps, Ref } from 'react'\n\nexport type TitleProps = ComponentProps<typeof BaseDialog.Title> & {\n ref?: Ref<HTMLHeadingElement>\n}\n\nexport const Title = ({ className, ref, ...others }: TitleProps) => {\n return (\n <BaseDialog.Title\n data-spark-component=\"dialog-title\"\n ref={ref}\n className={cx(\n 'text-headline-1 text-on-surface',\n 'group-has-data-[part=close]:pr-3xl',\n className\n )}\n {...others}\n />\n )\n}\n\nTitle.displayName = 'Dialog.Title'\n","import { Dialog as BaseDialog } from '@base-ui/react/dialog'\nimport { ComponentProps, Ref } from 'react'\n\nimport { useRenderSlot } from '../drawer/useRenderSlot'\n\nexport interface TriggerProps extends Omit<ComponentProps<typeof BaseDialog.Trigger>, 'render'> {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n ref?: Ref<HTMLButtonElement>\n}\n\nexport const Trigger = ({ asChild = false, ...props }: TriggerProps) => {\n const renderSlot = useRenderSlot(asChild, 'button')\n\n return <BaseDialog.Trigger data-spark-component=\"dialog-trigger\" render={renderSlot} {...props} />\n}\n\nTrigger.displayName = 'Dialog.Trigger'\n","import { Dialog as Root } from './Dialog'\nimport { Body } from './DialogBody'\nimport { Close } from './DialogClose'\nimport { CloseButton } from './DialogCloseButton'\nimport { Content } from './DialogContent'\nimport { Description } from './DialogDescription' // aria-describedby\nimport { Footer } from './DialogFooter'\nimport { Header } from './DialogHeader'\nimport { Overlay } from './DialogOverlay'\nimport { Portal } from './DialogPortal'\nimport { Title } from './DialogTitle' // aria-labelledby\nimport { Trigger } from './DialogTrigger'\n\nexport const Dialog: typeof Root & {\n Trigger: typeof Trigger\n Portal: typeof Portal\n Overlay: typeof Overlay\n Content: typeof Content\n Header: typeof Header\n Body: typeof Body\n Footer: typeof Footer\n Close: typeof Close\n CloseButton: typeof CloseButton\n Title: typeof Title\n Description: typeof Description\n} = Object.assign(Root, {\n Trigger,\n Portal,\n Overlay,\n Content,\n Header,\n Body,\n Footer,\n Close,\n CloseButton,\n Title,\n Description,\n})\n\nDialog.displayName = 'Dialog'\n\nexport { type DialogProps } from './Dialog'\nexport { type ContentProps as DialogContentProps } from './DialogContent'\nexport { type HeaderProps as DialogHeaderProps } from './DialogHeader'\nexport { type BodyProps as DialogBodyProps } from './DialogBody'\nexport { type FooterProps as DialogFooterProps } from './DialogFooter'\nexport { type TriggerProps as DialogTriggerProps } from './DialogTrigger'\nexport { type OverlayProps as DialogOverlayProps } from './DialogOverlay'\nexport { type PortalProps as DialogPortalProps } from './DialogPortal'\nexport { type TitleProps as DialogTitleProps } from './DialogTitle'\nexport { type DescriptionProps as DialogDescriptionProps } from './DialogDescription'\nexport { type CloseProps as DialogCloseProps } from './DialogClose'\nexport { type CloseButtonProps as DialogCloseButtonProps } from './DialogCloseButton'\n"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),h=require("@base-ui/react/separator"),s=require("class-variance-authority"),E=require("../Slot-DQ8z2zsy.js"),e=require("@spark-ui/internal-utils"),x=[{intent:"current",isEmpty:!0,class:e.tw(["border-current"])},{intent:"current",isEmpty:!1,class:e.tw(["before:border-current after:border-current"])},{intent:"outline",isEmpty:!0,class:e.tw(["border-outline"])},{intent:"outline",isEmpty:!1,class:e.tw(["before:border-outline after:border-outline"])}],j=s.cva(["overflow-hidden group"],{variants:{isEmpty:{true:["border-solid"],false:["inline-flex items-center","after:border-solid before:border-solid"]},orientation:{vertical:["w-fit inline-flex"],horizontal:["w-full"]},writingMode:{"horizontal-tb":[],"vertical-lr":[]},alignment:{start:[],end:[],center:[]},intent:{current:[],outline:[]}},defaultVariants:{orientation:"horizontal",writingMode:"horizontal-tb",alignment:"center",intent:"outline"},compoundVariants:[{isEmpty:!0,orientation:"horizontal",class:e.tw(["my-lg border-t-sm"])},{isEmpty:!0,orientation:"vertical",class:e.tw(["mx-lg min-h-sz-24 border-l-sm"])},{isEmpty:!1,orientation:"horizontal",writingMode:"horizontal-tb",class:e.tw(["flex-row my-sm grow-0","before:border-t-sm","after:border-t-sm","*:px-lg"])},{isEmpty:!1,orientation:"vertical",writingMode:"horizontal-tb",class:e.tw(["flex-col mx-sm","before:border-l-sm","after:border-l-sm","*:py-lg"])},{isEmpty:!1,orientation:"vertical",writingMode:"vertical-lr",class:e.tw(["flex-col mx-sm","before:border-l-sm","after:border-l-sm","*:px-lg"])},{isEmpty:!1,orientation:"horizontal",alignment:"end",class:e.tw(["after:w-sz-40 before:grow after:grow-0"])},{isEmpty:!1,orientation:"horizontal",alignment:"start",class:e.tw(["before:w-sz-40 before:grow-0 after:grow"])},{isEmpty:!1,orientation:"horizontal",alignment:"center",class:e.tw(["justify-center before:grow after:grow"])},{isEmpty:!1,orientation:"vertical",alignment:"end",class:e.tw(["after:h-sz-40 before:grow after:grow-0 before:min-h-sz-40"])},{isEmpty:!1,orientation:"vertical",alignment:"start",class:e.tw(["before:h-sz-40 before:grow-0 after:grow after:min-h-sz-40"])},{isEmpty:!1,orientation:"vertical",alignment:"center",class:e.tw(["justify-center before:grow after:grow before:min-h-sz-40 after:min-h-sz-40"])},...x]}),f=({asChild:t,className:i,isDecorative:o=!1,children:r,orientation:c="horizontal",writingMode:m="horizontal-tb",alignment:w="center",intent:u="outline",ref:g,role:d,...p})=>{const y=t?!r?.props?.children:!r;let n;o?n={role:"none"}:d!==void 0&&(n={role:d});const v=t?(z=>a.jsx(E.Slot,{...z})):void 0;return a.jsx(h.Separator,{"data-spark-component":"divider",className:s.cx(j({isEmpty:y,orientation:c,alignment:w,intent:u,writingMode:m}),i),orientation:c,ref:g,...p,render:v,...n,"data-writing-mode":m,children:r})};f.displayName="Divider";const b=({children:t,ref:i,className:o,...r})=>t?a.jsx("span",{"data-spark-component":"divider-content",ref:i,...r,className:s.cx("group-data-[writing-mode=vertical-lr]:[writing-mode:vertical-lr]",o),children:t}):null;b.displayName="Divider.Content";const l=Object.assign(f,{Content:b});l.displayName="Divider";l.Content.displayName="Divider.Content";exports.Divider=l;
2
- //# sourceMappingURL=index.js.map
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../chunk-C91j1N6u.js`);const e=require(`../slot/index.js`);let t=require(`class-variance-authority`),n=require(`react/jsx-runtime`),r=require(`@spark-ui/internal-utils`),i=require(`@base-ui/react/separator`);var a=[{intent:`current`,isEmpty:!0,class:(0,r.tw)([`border-current`])},{intent:`current`,isEmpty:!1,class:(0,r.tw)([`before:border-current after:border-current`])},{intent:`outline`,isEmpty:!0,class:(0,r.tw)([`border-outline`])},{intent:`outline`,isEmpty:!1,class:(0,r.tw)([`before:border-outline after:border-outline`])}],o=(0,t.cva)([`overflow-hidden group`],{variants:{isEmpty:{true:[`border-solid`],false:[`inline-flex items-center`,`after:border-solid before:border-solid`]},orientation:{vertical:[`w-fit inline-flex`],horizontal:[`w-full`]},writingMode:{"horizontal-tb":[],"vertical-lr":[]},alignment:{start:[],end:[],center:[]},intent:{current:[],outline:[]}},defaultVariants:{orientation:`horizontal`,writingMode:`horizontal-tb`,alignment:`center`,intent:`outline`},compoundVariants:[{isEmpty:!0,orientation:`horizontal`,class:(0,r.tw)([`my-lg border-t-sm`])},{isEmpty:!0,orientation:`vertical`,class:(0,r.tw)([`mx-lg min-h-sz-24 border-l-sm`])},{isEmpty:!1,orientation:`horizontal`,writingMode:`horizontal-tb`,class:(0,r.tw)([`flex-row my-sm grow-0`,`before:border-t-sm`,`after:border-t-sm`,`*:px-lg`])},{isEmpty:!1,orientation:`vertical`,writingMode:`horizontal-tb`,class:(0,r.tw)([`flex-col mx-sm`,`before:border-l-sm`,`after:border-l-sm`,`*:py-lg`])},{isEmpty:!1,orientation:`vertical`,writingMode:`vertical-lr`,class:(0,r.tw)([`flex-col mx-sm`,`before:border-l-sm`,`after:border-l-sm`,`*:px-lg`])},{isEmpty:!1,orientation:`horizontal`,alignment:`end`,class:(0,r.tw)([`after:w-sz-40 before:grow after:grow-0`])},{isEmpty:!1,orientation:`horizontal`,alignment:`start`,class:(0,r.tw)([`before:w-sz-40 before:grow-0 after:grow`])},{isEmpty:!1,orientation:`horizontal`,alignment:`center`,class:(0,r.tw)([`justify-center before:grow after:grow`])},{isEmpty:!1,orientation:`vertical`,alignment:`end`,class:(0,r.tw)([`after:h-sz-40 before:grow after:grow-0 before:min-h-sz-40`])},{isEmpty:!1,orientation:`vertical`,alignment:`start`,class:(0,r.tw)([`before:h-sz-40 before:grow-0 after:grow after:min-h-sz-40`])},{isEmpty:!1,orientation:`vertical`,alignment:`center`,class:(0,r.tw)([`justify-center before:grow after:grow before:min-h-sz-40 after:min-h-sz-40`])},...a]}),s=({asChild:r,className:a,isDecorative:s=!1,children:c,orientation:l=`horizontal`,writingMode:u=`horizontal-tb`,alignment:d=`center`,intent:f=`outline`,ref:p,role:m,...h})=>{let g=r?!c?.props?.children:!c,_;s?_={role:`none`}:m!==void 0&&(_={role:m});let v=r?t=>(0,n.jsx)(e.Slot,{...t}):void 0;return(0,n.jsx)(i.Separator,{"data-spark-component":`divider`,className:(0,t.cx)(o({isEmpty:g,orientation:l,alignment:d,intent:f,writingMode:u}),a),orientation:l,ref:p,...h,render:v,..._,"data-writing-mode":u,children:c})};s.displayName=`Divider`;var c=({children:e,ref:r,className:i,...a})=>e?(0,n.jsx)(`span`,{"data-spark-component":`divider-content`,ref:r,...a,className:(0,t.cx)(`group-data-[writing-mode=vertical-lr]:[writing-mode:vertical-lr]`,i),children:e}):null;c.displayName=`Divider.Content`;var l=Object.assign(s,{Content:c});l.displayName=`Divider`,l.Content.displayName=`Divider.Content`,exports.Divider=l;
2
+ //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../src/divider/variants/intents.tsx","../../src/divider/Divider.styles.ts","../../src/divider/Divider.tsx","../../src/divider/DividerContent.tsx","../../src/divider/index.ts"],"sourcesContent":["import { tw } from '@spark-ui/internal-utils'\n\nexport const intentVariants = [\n // current\n {\n intent: 'current',\n isEmpty: true,\n class: tw(['border-current']),\n },\n {\n intent: 'current',\n isEmpty: false,\n class: tw(['before:border-current after:border-current']),\n },\n // outline\n {\n intent: 'outline',\n isEmpty: true,\n class: tw(['border-outline']),\n },\n {\n intent: 'outline',\n isEmpty: false,\n class: tw(['before:border-outline after:border-outline']),\n },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nimport { intentVariants } from './variants/intents'\n\nexport const dividerStyles = cva(['overflow-hidden group'], {\n variants: {\n isEmpty: {\n true: ['border-solid'],\n false: ['inline-flex items-center', 'after:border-solid before:border-solid'],\n },\n orientation: {\n vertical: ['w-fit inline-flex'],\n horizontal: ['w-full'],\n },\n writingMode: {\n 'horizontal-tb': [],\n 'vertical-lr': [],\n },\n alignment: {\n start: [],\n end: [],\n center: [],\n },\n intent: {\n current: [],\n outline: [],\n },\n },\n defaultVariants: {\n orientation: 'horizontal',\n writingMode: 'horizontal-tb',\n alignment: 'center',\n intent: 'outline',\n },\n compoundVariants: [\n {\n isEmpty: true,\n orientation: 'horizontal',\n class: tw(['my-lg border-t-sm']),\n },\n {\n isEmpty: true,\n orientation: 'vertical',\n class: tw(['mx-lg min-h-sz-24 border-l-sm']),\n },\n {\n isEmpty: false,\n orientation: 'horizontal',\n writingMode: 'horizontal-tb',\n class: tw(['flex-row my-sm grow-0', 'before:border-t-sm', 'after:border-t-sm', '*:px-lg']),\n },\n {\n isEmpty: false,\n orientation: 'vertical',\n writingMode: 'horizontal-tb',\n class: tw(['flex-col mx-sm', 'before:border-l-sm', 'after:border-l-sm', '*:py-lg']),\n },\n {\n isEmpty: false,\n orientation: 'vertical',\n writingMode: 'vertical-lr',\n class: tw(['flex-col mx-sm', 'before:border-l-sm', 'after:border-l-sm', '*:px-lg']),\n },\n {\n isEmpty: false,\n orientation: 'horizontal',\n alignment: 'end',\n class: tw(['after:w-sz-40 before:grow after:grow-0']),\n },\n {\n isEmpty: false,\n orientation: 'horizontal',\n alignment: 'start',\n class: tw(['before:w-sz-40 before:grow-0 after:grow']),\n },\n {\n isEmpty: false,\n orientation: 'horizontal',\n alignment: 'center',\n class: tw(['justify-center before:grow after:grow']),\n },\n {\n isEmpty: false,\n orientation: 'vertical',\n alignment: 'end',\n class: tw(['after:h-sz-40 before:grow after:grow-0 before:min-h-sz-40']),\n },\n {\n isEmpty: false,\n orientation: 'vertical',\n alignment: 'start',\n class: tw(['before:h-sz-40 before:grow-0 after:grow after:min-h-sz-40']),\n },\n {\n isEmpty: false,\n orientation: 'vertical',\n alignment: 'center',\n class: tw(['justify-center before:grow after:grow before:min-h-sz-40 after:min-h-sz-40']),\n },\n ...intentVariants,\n ],\n})\n\nexport type DividerStylesProps = VariantProps<typeof dividerStyles>\n","import { Separator as BaseSeparator } from '@base-ui/react/separator'\nimport { cx } from 'class-variance-authority'\nimport { HTMLAttributes, ReactElement, ReactNode, Ref } from 'react'\n\nimport { Slot } from '../slot'\nimport { dividerStyles, type DividerStylesProps } from './Divider.styles'\n\nexport interface DividerProps\n extends HTMLAttributes<HTMLDivElement>,\n Omit<DividerStylesProps, 'isEmpty'> {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n children?: ReactElement\n /**\n * The orientation of the inner content.\n */\n alignment?: 'start' | 'end' | 'center'\n /**\n * The orientation of the separator.\n */\n orientation?: 'vertical' | 'horizontal'\n /**\n * When true, signifies that it is purely visual, carries no semantic meaning, and ensures it is not present in the accessibility tree.\n */\n isDecorative?: boolean\n /**\n * Color scheme of the divider.\n */\n intent?: 'outline' | 'current'\n ref?: Ref<HTMLDivElement>\n}\n\nexport const Divider = ({\n asChild,\n className,\n isDecorative = false,\n children,\n orientation = 'horizontal',\n writingMode = 'horizontal-tb',\n alignment = 'center',\n intent = 'outline',\n ref,\n role: roleProp,\n ...props\n}: DividerProps) => {\n const isEmpty = asChild ? !(children?.props as { children: ReactNode })?.children : !children\n\n let roleProps: { role: string } | undefined\n if (isDecorative) {\n roleProps = { role: 'none' }\n } else if (roleProp !== undefined) {\n roleProps = { role: roleProp }\n }\n\n const renderSlot = asChild\n ? // Base UI uses its `render` prop to swap the underlying element.\n // We rely on Spark's `Slot` to mimic Radix's `asChild` behavior.\n (slotProps: any) => <Slot {...slotProps} />\n : undefined\n\n return (\n <BaseSeparator\n data-spark-component=\"divider\"\n className={cx(\n dividerStyles({ isEmpty, orientation, alignment, intent, writingMode }),\n className\n )}\n orientation={orientation}\n ref={ref}\n {...props}\n render={renderSlot}\n {...roleProps}\n data-writing-mode={writingMode}\n >\n {children}\n </BaseSeparator>\n )\n}\n\nDivider.displayName = 'Divider'\n","import { cx } from 'class-variance-authority'\nimport { HTMLAttributes, ReactNode, Ref } from 'react'\n\nexport interface DividerContentProps extends HTMLAttributes<HTMLSpanElement> {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n children?: ReactNode\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const DividerContent = ({ children, ref, className, ...props }: DividerContentProps) => {\n return children ? (\n <span\n data-spark-component=\"divider-content\"\n ref={ref}\n {...props}\n className={cx('group-data-[writing-mode=vertical-lr]:[writing-mode:vertical-lr]', className)}\n >\n {children}\n </span>\n ) : null\n}\n\nDividerContent.displayName = 'Divider.Content'\n","import { Divider as Root } from './Divider'\nimport { DividerContent } from './DividerContent'\n\nexport { type DividerContentProps } from './DividerContent'\n\nexport const Divider: typeof Root & {\n Content: typeof DividerContent\n} = Object.assign(Root, {\n Content: DividerContent,\n})\n\nDivider.displayName = 'Divider'\nDivider.Content.displayName = 'Divider.Content'\n"],"names":["intentVariants","tw","dividerStyles","cva","Divider","asChild","className","isDecorative","children","orientation","writingMode","alignment","intent","ref","roleProp","props","isEmpty","roleProps","renderSlot","slotProps","jsx","Slot","BaseSeparator","cx","DividerContent","Root"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","names":[],"sources":["../../src/divider/variants/intents.tsx","../../src/divider/Divider.styles.ts","../../src/divider/Divider.tsx","../../src/divider/DividerContent.tsx","../../src/divider/index.ts"],"sourcesContent":["import { tw } from '@spark-ui/internal-utils'\n\nexport const intentVariants = [\n // current\n {\n intent: 'current',\n isEmpty: true,\n class: tw(['border-current']),\n },\n {\n intent: 'current',\n isEmpty: false,\n class: tw(['before:border-current after:border-current']),\n },\n // outline\n {\n intent: 'outline',\n isEmpty: true,\n class: tw(['border-outline']),\n },\n {\n intent: 'outline',\n isEmpty: false,\n class: tw(['before:border-outline after:border-outline']),\n },\n] as const\n","import { tw } from '@spark-ui/internal-utils'\nimport { cva, VariantProps } from 'class-variance-authority'\n\nimport { intentVariants } from './variants/intents'\n\nexport const dividerStyles = cva(['overflow-hidden group'], {\n variants: {\n isEmpty: {\n true: ['border-solid'],\n false: ['inline-flex items-center', 'after:border-solid before:border-solid'],\n },\n orientation: {\n vertical: ['w-fit inline-flex'],\n horizontal: ['w-full'],\n },\n writingMode: {\n 'horizontal-tb': [],\n 'vertical-lr': [],\n },\n alignment: {\n start: [],\n end: [],\n center: [],\n },\n intent: {\n current: [],\n outline: [],\n },\n },\n defaultVariants: {\n orientation: 'horizontal',\n writingMode: 'horizontal-tb',\n alignment: 'center',\n intent: 'outline',\n },\n compoundVariants: [\n {\n isEmpty: true,\n orientation: 'horizontal',\n class: tw(['my-lg border-t-sm']),\n },\n {\n isEmpty: true,\n orientation: 'vertical',\n class: tw(['mx-lg min-h-sz-24 border-l-sm']),\n },\n {\n isEmpty: false,\n orientation: 'horizontal',\n writingMode: 'horizontal-tb',\n class: tw(['flex-row my-sm grow-0', 'before:border-t-sm', 'after:border-t-sm', '*:px-lg']),\n },\n {\n isEmpty: false,\n orientation: 'vertical',\n writingMode: 'horizontal-tb',\n class: tw(['flex-col mx-sm', 'before:border-l-sm', 'after:border-l-sm', '*:py-lg']),\n },\n {\n isEmpty: false,\n orientation: 'vertical',\n writingMode: 'vertical-lr',\n class: tw(['flex-col mx-sm', 'before:border-l-sm', 'after:border-l-sm', '*:px-lg']),\n },\n {\n isEmpty: false,\n orientation: 'horizontal',\n alignment: 'end',\n class: tw(['after:w-sz-40 before:grow after:grow-0']),\n },\n {\n isEmpty: false,\n orientation: 'horizontal',\n alignment: 'start',\n class: tw(['before:w-sz-40 before:grow-0 after:grow']),\n },\n {\n isEmpty: false,\n orientation: 'horizontal',\n alignment: 'center',\n class: tw(['justify-center before:grow after:grow']),\n },\n {\n isEmpty: false,\n orientation: 'vertical',\n alignment: 'end',\n class: tw(['after:h-sz-40 before:grow after:grow-0 before:min-h-sz-40']),\n },\n {\n isEmpty: false,\n orientation: 'vertical',\n alignment: 'start',\n class: tw(['before:h-sz-40 before:grow-0 after:grow after:min-h-sz-40']),\n },\n {\n isEmpty: false,\n orientation: 'vertical',\n alignment: 'center',\n class: tw(['justify-center before:grow after:grow before:min-h-sz-40 after:min-h-sz-40']),\n },\n ...intentVariants,\n ],\n})\n\nexport type DividerStylesProps = VariantProps<typeof dividerStyles>\n","import { Separator as BaseSeparator } from '@base-ui/react/separator'\nimport { cx } from 'class-variance-authority'\nimport { HTMLAttributes, ReactElement, ReactNode, Ref } from 'react'\n\nimport { Slot } from '../slot'\nimport { dividerStyles, type DividerStylesProps } from './Divider.styles'\n\nexport interface DividerProps\n extends HTMLAttributes<HTMLDivElement>, Omit<DividerStylesProps, 'isEmpty'> {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n children?: ReactElement\n /**\n * The orientation of the inner content.\n */\n alignment?: 'start' | 'end' | 'center'\n /**\n * The orientation of the separator.\n */\n orientation?: 'vertical' | 'horizontal'\n /**\n * When true, signifies that it is purely visual, carries no semantic meaning, and ensures it is not present in the accessibility tree.\n */\n isDecorative?: boolean\n /**\n * Color scheme of the divider.\n */\n intent?: 'outline' | 'current'\n ref?: Ref<HTMLDivElement>\n}\n\nexport const Divider = ({\n asChild,\n className,\n isDecorative = false,\n children,\n orientation = 'horizontal',\n writingMode = 'horizontal-tb',\n alignment = 'center',\n intent = 'outline',\n ref,\n role: roleProp,\n ...props\n}: DividerProps) => {\n const isEmpty = asChild ? !(children?.props as { children: ReactNode })?.children : !children\n\n let roleProps: { role: string } | undefined\n if (isDecorative) {\n roleProps = { role: 'none' }\n } else if (roleProp !== undefined) {\n roleProps = { role: roleProp }\n }\n\n const renderSlot = asChild\n ? // Base UI uses its `render` prop to swap the underlying element.\n // We rely on Spark's `Slot` to mimic Radix's `asChild` behavior.\n (slotProps: any) => <Slot {...slotProps} />\n : undefined\n\n return (\n <BaseSeparator\n data-spark-component=\"divider\"\n className={cx(\n dividerStyles({ isEmpty, orientation, alignment, intent, writingMode }),\n className\n )}\n orientation={orientation}\n ref={ref}\n {...props}\n render={renderSlot}\n {...roleProps}\n data-writing-mode={writingMode}\n >\n {children}\n </BaseSeparator>\n )\n}\n\nDivider.displayName = 'Divider'\n","import { cx } from 'class-variance-authority'\nimport { HTMLAttributes, ReactNode, Ref } from 'react'\n\nexport interface DividerContentProps extends HTMLAttributes<HTMLSpanElement> {\n /**\n * Change the component to the HTML tag or custom component of the only child.\n */\n asChild?: boolean\n children?: ReactNode\n ref?: Ref<HTMLSpanElement>\n}\n\nexport const DividerContent = ({ children, ref, className, ...props }: DividerContentProps) => {\n return children ? (\n <span\n data-spark-component=\"divider-content\"\n ref={ref}\n {...props}\n className={cx('group-data-[writing-mode=vertical-lr]:[writing-mode:vertical-lr]', className)}\n >\n {children}\n </span>\n ) : null\n}\n\nDividerContent.displayName = 'Divider.Content'\n","import { Divider as Root } from './Divider'\nimport { DividerContent } from './DividerContent'\n\nexport { type DividerContentProps } from './DividerContent'\n\nexport const Divider: typeof Root & {\n Content: typeof DividerContent\n} = Object.assign(Root, {\n Content: DividerContent,\n})\n\nDivider.displayName = 'Divider'\nDivider.Content.displayName = 'Divider.Content'\n"],"mappings":"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"}