@zentauri-ui/zentauri-components 1.7.0 → 1.7.2

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 (136) hide show
  1. package/README.md +11 -5
  2. package/cli/index.mjs +1 -0
  3. package/cli/registry.json +3 -0
  4. package/dist/chunk-6QQUQLPB.js +107 -0
  5. package/dist/chunk-6QQUQLPB.js.map +1 -0
  6. package/dist/chunk-BC6M42HQ.mjs +251 -0
  7. package/dist/chunk-BC6M42HQ.mjs.map +1 -0
  8. package/dist/chunk-K6IZANTI.mjs +80 -0
  9. package/dist/chunk-K6IZANTI.mjs.map +1 -0
  10. package/dist/chunk-MTTXLC2V.mjs +100 -0
  11. package/dist/chunk-MTTXLC2V.mjs.map +1 -0
  12. package/dist/chunk-PHEUJ4EF.js +84 -0
  13. package/dist/chunk-PHEUJ4EF.js.map +1 -0
  14. package/dist/chunk-QSPXPU72.js +259 -0
  15. package/dist/chunk-QSPXPU72.js.map +1 -0
  16. package/dist/design-system/checkbox.d.ts +32 -0
  17. package/dist/design-system/checkbox.d.ts.map +1 -0
  18. package/dist/design-system/index.d.ts +3 -0
  19. package/dist/design-system/index.d.ts.map +1 -1
  20. package/dist/design-system/popover.d.ts +40 -0
  21. package/dist/design-system/popover.d.ts.map +1 -0
  22. package/dist/design-system/radio-group.d.ts +37 -0
  23. package/dist/design-system/radio-group.d.ts.map +1 -0
  24. package/dist/ui/checkbox/animated/animations.d.ts +32 -0
  25. package/dist/ui/checkbox/animated/animations.d.ts.map +1 -0
  26. package/dist/ui/checkbox/animated/checkbox-animated.d.ts +6 -0
  27. package/dist/ui/checkbox/animated/checkbox-animated.d.ts.map +1 -0
  28. package/dist/ui/checkbox/animated/index.d.ts +4 -0
  29. package/dist/ui/checkbox/animated/index.d.ts.map +1 -0
  30. package/dist/ui/checkbox/animated/types.d.ts +8 -0
  31. package/dist/ui/checkbox/animated/types.d.ts.map +1 -0
  32. package/dist/ui/checkbox/animated.js +153 -0
  33. package/dist/ui/checkbox/animated.js.map +1 -0
  34. package/dist/ui/checkbox/animated.mjs +150 -0
  35. package/dist/ui/checkbox/animated.mjs.map +1 -0
  36. package/dist/ui/checkbox/checkbox-base.d.ts +6 -0
  37. package/dist/ui/checkbox/checkbox-base.d.ts.map +1 -0
  38. package/dist/ui/checkbox/checkbox.d.ts +6 -0
  39. package/dist/ui/checkbox/checkbox.d.ts.map +1 -0
  40. package/dist/ui/checkbox/index.d.ts +4 -0
  41. package/dist/ui/checkbox/index.d.ts.map +1 -0
  42. package/dist/ui/checkbox/types.d.ts +19 -0
  43. package/dist/ui/checkbox/types.d.ts.map +1 -0
  44. package/dist/ui/checkbox/variants.d.ts +11 -0
  45. package/dist/ui/checkbox/variants.d.ts.map +1 -0
  46. package/dist/ui/checkbox.js +150 -0
  47. package/dist/ui/checkbox.js.map +1 -0
  48. package/dist/ui/checkbox.mjs +137 -0
  49. package/dist/ui/checkbox.mjs.map +1 -0
  50. package/dist/ui/popover/animated/animations.d.ts +3 -0
  51. package/dist/ui/popover/animated/animations.d.ts.map +1 -0
  52. package/dist/ui/popover/animated/index.d.ts +4 -0
  53. package/dist/ui/popover/animated/index.d.ts.map +1 -0
  54. package/dist/ui/popover/animated/popover-content-animated.d.ts +3 -0
  55. package/dist/ui/popover/animated/popover-content-animated.d.ts.map +1 -0
  56. package/dist/ui/popover/animated/types.d.ts +9 -0
  57. package/dist/ui/popover/animated/types.d.ts.map +1 -0
  58. package/dist/ui/popover/animated.js +67 -0
  59. package/dist/ui/popover/animated.js.map +1 -0
  60. package/dist/ui/popover/animated.mjs +64 -0
  61. package/dist/ui/popover/animated.mjs.map +1 -0
  62. package/dist/ui/popover/index.d.ts +4 -0
  63. package/dist/ui/popover/index.d.ts.map +1 -0
  64. package/dist/ui/popover/popover-base.d.ts +8 -0
  65. package/dist/ui/popover/popover-base.d.ts.map +1 -0
  66. package/dist/ui/popover/popover.d.ts +2 -0
  67. package/dist/ui/popover/popover.d.ts.map +1 -0
  68. package/dist/ui/popover/types.d.ts +34 -0
  69. package/dist/ui/popover/types.d.ts.map +1 -0
  70. package/dist/ui/popover/variants.d.ts +6 -0
  71. package/dist/ui/popover/variants.d.ts.map +1 -0
  72. package/dist/ui/popover.js +34 -0
  73. package/dist/ui/popover.js.map +1 -0
  74. package/dist/ui/popover.mjs +5 -0
  75. package/dist/ui/popover.mjs.map +1 -0
  76. package/dist/ui/radio-group/animated/animations.d.ts +32 -0
  77. package/dist/ui/radio-group/animated/animations.d.ts.map +1 -0
  78. package/dist/ui/radio-group/animated/index.d.ts +4 -0
  79. package/dist/ui/radio-group/animated/index.d.ts.map +1 -0
  80. package/dist/ui/radio-group/animated/radio-group-animated.d.ts +10 -0
  81. package/dist/ui/radio-group/animated/radio-group-animated.d.ts.map +1 -0
  82. package/dist/ui/radio-group/animated/types.d.ts +11 -0
  83. package/dist/ui/radio-group/animated/types.d.ts.map +1 -0
  84. package/dist/ui/radio-group/animated.js +177 -0
  85. package/dist/ui/radio-group/animated.js.map +1 -0
  86. package/dist/ui/radio-group/animated.mjs +173 -0
  87. package/dist/ui/radio-group/animated.mjs.map +1 -0
  88. package/dist/ui/radio-group/index.d.ts +4 -0
  89. package/dist/ui/radio-group/index.d.ts.map +1 -0
  90. package/dist/ui/radio-group/radio-group-context.d.ts +13 -0
  91. package/dist/ui/radio-group/radio-group-context.d.ts.map +1 -0
  92. package/dist/ui/radio-group/radio-group.d.ts +10 -0
  93. package/dist/ui/radio-group/radio-group.d.ts.map +1 -0
  94. package/dist/ui/radio-group/types.d.ts +26 -0
  95. package/dist/ui/radio-group/types.d.ts.map +1 -0
  96. package/dist/ui/radio-group/variants.d.ts +14 -0
  97. package/dist/ui/radio-group/variants.d.ts.map +1 -0
  98. package/dist/ui/radio-group.js +171 -0
  99. package/dist/ui/radio-group.js.map +1 -0
  100. package/dist/ui/radio-group.mjs +153 -0
  101. package/dist/ui/radio-group.mjs.map +1 -0
  102. package/package.json +1 -1
  103. package/src/design-system/checkbox.ts +47 -0
  104. package/src/design-system/index.ts +3 -0
  105. package/src/design-system/popover.ts +66 -0
  106. package/src/design-system/radio-group.ts +54 -0
  107. package/src/ui/checkbox/animated/animations.ts +12 -0
  108. package/src/ui/checkbox/animated/checkbox-animated.tsx +145 -0
  109. package/src/ui/checkbox/animated/index.ts +9 -0
  110. package/src/ui/checkbox/animated/types.ts +9 -0
  111. package/src/ui/checkbox/checkbox-base.tsx +134 -0
  112. package/src/ui/checkbox/checkbox.test.tsx +53 -0
  113. package/src/ui/checkbox/checkbox.tsx +8 -0
  114. package/src/ui/checkbox/index.ts +15 -0
  115. package/src/ui/checkbox/types.ts +40 -0
  116. package/src/ui/checkbox/variants.ts +50 -0
  117. package/src/ui/popover/animated/animations.ts +15 -0
  118. package/src/ui/popover/animated/index.ts +10 -0
  119. package/src/ui/popover/animated/popover-content-animated.tsx +54 -0
  120. package/src/ui/popover/animated/types.ts +18 -0
  121. package/src/ui/popover/index.ts +18 -0
  122. package/src/ui/popover/popover-base.tsx +261 -0
  123. package/src/ui/popover/popover.test.tsx +84 -0
  124. package/src/ui/popover/popover.tsx +8 -0
  125. package/src/ui/popover/types.ts +38 -0
  126. package/src/ui/popover/variants.ts +21 -0
  127. package/src/ui/radio-group/animated/animations.ts +12 -0
  128. package/src/ui/radio-group/animated/index.ts +10 -0
  129. package/src/ui/radio-group/animated/radio-group-animated.tsx +173 -0
  130. package/src/ui/radio-group/animated/types.ts +13 -0
  131. package/src/ui/radio-group/index.ts +19 -0
  132. package/src/ui/radio-group/radio-group-context.ts +23 -0
  133. package/src/ui/radio-group/radio-group.test.tsx +61 -0
  134. package/src/ui/radio-group/radio-group.tsx +159 -0
  135. package/src/ui/radio-group/types.ts +62 -0
  136. package/src/ui/radio-group/variants.ts +61 -0
package/README.md CHANGED
@@ -15,12 +15,12 @@ Published artifacts live under `dist/`. Imports use **per-entry subpaths**: `@ze
15
15
 
16
16
  | Metric | Result |
17
17
  | ----------- | ---------------- |
18
- | Test files | 54 passed (54) |
19
- | Tests | 337 passed (337) |
18
+ | Test files | 57 passed (57) |
19
+ | Tests | 352 passed (352) |
20
20
 
21
21
  | Area | Test files | Tests |
22
22
  | --------------------------- | ---------- | ----- |
23
- | Components and UI utilities | 26 | 243 |
23
+ | Components and UI utilities | 29 | 258 |
24
24
  | React hooks | 26 | 85 |
25
25
  | CLI and import rewriting | 2 | 9 |
26
26
 
@@ -36,10 +36,13 @@ Published artifacts live under `dist/`. Imports use **per-entry subpaths**: `@ze
36
36
  | `src/ui/buttons/button.test.tsx` | 41 |
37
37
  | `src/ui/inputs/input.test.tsx` | 40 |
38
38
  | `src/ui/card/card.test.tsx` | 7 |
39
+ | `src/ui/checkbox/checkbox.test.tsx` | 6 |
40
+ | `src/ui/popover/popover.test.tsx` | 4 |
39
41
  | `src/ui/tooltip/tooltip.test.tsx` | 4 |
40
42
  | `src/ui/dropdown/dropdown.test.tsx` | 6 |
41
43
  | `src/hooks/useFocusManagement/useFocusManagement.test.tsx` | 3 |
42
44
  | `src/ui/progress/progress.test.tsx` | 8 |
45
+ | `src/ui/radio-group/radio-group.test.tsx` | 5 |
43
46
  | `src/ui/accordion/accordion.test.tsx` | 7 |
44
47
  | `src/ui/toast/toast.test.tsx` | 5 |
45
48
  | `src/ui/pagination/pagination.test.tsx` | 15 |
@@ -103,7 +106,7 @@ Only a subset of UI areas publish a `/animated` entry (see **Components**). Some
103
106
 
104
107
  Published motion entries (same `<name>` as the base UI folder):
105
108
 
106
- `accordion`, `alert`, `avatar`, `badge`, `buttons`, `card`, `divider`, `drawer`, `empty-state`, `inputs`, `modal`, `progress`, `skeleton`, `spinner`, `table`, `tabs`, `toast`, `toggle`, `tooltip`
109
+ `accordion`, `alert`, `avatar`, `badge`, `buttons`, `card`, `checkbox`, `divider`, `drawer`, `empty-state`, `inputs`, `modal`, `popover`, `progress`, `radio-group`, `skeleton`, `spinner`, `table`, `tabs`, `toast`, `toggle`, `tooltip`
107
110
 
108
111
  **Spinner:** only the motion entry is built—import from `@zentauri-ui/zentauri-components/ui/spinner/animated` (there is no separate `ui/spinner` static bundle).
109
112
 
@@ -126,6 +129,7 @@ Import static primitives from `@zentauri-ui/zentauri-components/ui/<subpath>` wh
126
129
  | Breadcrumb | `breadcrumb` | — |
127
130
  | Button | `buttons` | `buttons/animated` |
128
131
  | Card | `card` | `card/animated` |
132
+ | Checkbox | `checkbox` | `checkbox/animated` |
129
133
  | Charts | `charts/<type>` | — |
130
134
  | Divider | `divider` | `divider/animated` |
131
135
  | Drawer | `drawer` | `drawer/animated` |
@@ -136,7 +140,9 @@ Import static primitives from `@zentauri-ui/zentauri-components/ui/<subpath>` wh
136
140
  | Input | `inputs` | `inputs/animated` |
137
141
  | Modal | `modal` | `modal/animated` |
138
142
  | Pagination | `pagination` | — |
143
+ | Popover | `popover` | `popover/animated` |
139
144
  | Progress | `progress` | `progress/animated` |
145
+ | Radio group | `radio-group` | `radio-group/animated` |
140
146
  | Search | `search` | - |
141
147
  | Select | `select` | — |
142
148
  | Skeleton | `skeleton` | `skeleton/animated` |
@@ -650,7 +656,7 @@ From this package directory in the monorepo:
650
656
 
651
657
  - `pnpm build` (or `npm run build`) — production bundle via `tsup` (Rollup treeshake + `scripts/prepend-use-client.mjs` via `onSuccess` so each UI entry under `dist/ui/`, the chart entry under `dist/charts/`, and `dist/ui/<name>/animated.*` starts with `"use client"` where needed)
652
658
  - `pnpm dev` — `tsup` watch mode (same `onSuccess` hook after each rebuild)
653
- - `pnpm test` / `pnpm test:watch` — **Vitest** and **Testing Library** unit tests // covered 300+ test cases in total
659
+ - `pnpm test` / `pnpm test:watch` — **Vitest** and **Testing Library** unit tests // covered 348 test cases in total
654
660
  - **`pnpm run generate:registry`** — runs `scripts/generate-registry.mjs`, which reads **`uiComponentNames`**, **`chartEntryNames`**, and **`hooksEntryNames`** from `tsup.config.ts`, merges in **`spinner`**, applies fixed **`nameAliases`**, and writes **`cli/registry.json`** (`components` + `hooks`). Run this after adding or renaming UI/chart areas or hook entries so the CLI stays in sync (the script prints counts).
655
661
 
656
662
  ## Github Release log
package/cli/index.mjs CHANGED
@@ -554,6 +554,7 @@ async function copyDesignSystemFolder(config, configDir, packageRoot) {
554
554
  if (isTestFile(rel)) {
555
555
  continue;
556
556
  }
557
+ const absDest = join(destRoot, rel);
557
558
  if (existsSync(absDest)) {
558
559
  continue;
559
560
  }
package/cli/registry.json CHANGED
@@ -14,6 +14,7 @@
14
14
  "charts/bubble",
15
15
  "charts/line",
16
16
  "charts/pie",
17
+ "checkbox",
17
18
  "divider",
18
19
  "drawer",
19
20
  "dropdown",
@@ -23,7 +24,9 @@
23
24
  "inputs",
24
25
  "modal",
25
26
  "pagination",
27
+ "popover",
26
28
  "progress",
29
+ "radio-group",
27
30
  "search",
28
31
  "select",
29
32
  "skeleton",
@@ -0,0 +1,107 @@
1
+ 'use strict';
2
+
3
+ var classVarianceAuthority = require('class-variance-authority');
4
+ var react = require('react');
5
+
6
+ // src/ui/radio-group/variants.ts
7
+
8
+ // src/design-system/radio-group.ts
9
+ var zuiRadioGroupRootBase = "grid gap-2";
10
+ var zuiRadioGroupItemBase = "group inline-flex w-fit items-start gap-2.5 text-sm font-medium text-[color:var(--zui-radio-label-fg,oklch(20.8%_0.042_265.755))] dark:text-[color:var(--zui-radio-label-fg-dark,oklch(98.4%_0.003_247.858))] data-[disabled=true]:cursor-not-allowed data-[disabled=true]:opacity-50";
11
+ var zuiRadioGroupControlBase = "grid shrink-0 place-items-center rounded-full border-2 border-[color:var(--zui-radio-border,#0000004d)] bg-[var(--zui-radio-bg,transparent)] transition-[background-color,border-color,box-shadow] peer-focus-visible:outline-none peer-focus-visible:ring-2 peer-focus-visible:ring-[var(--zui-radio-ring-focus,oklch(44.6%_0.043_257.281_/_0.7))] peer-focus-visible:ring-offset-2 peer-focus-visible:ring-offset-[var(--zui-radio-ring-offset-focus,oklch(98.4%_0.003_247.858))] dark:border-[color:var(--zui-radio-border-dark,#ffffff4d)] dark:peer-focus-visible:ring-[var(--zui-radio-ring-focus-dark,oklch(86.9%_0.022_252.894_/_0.7))] dark:peer-focus-visible:ring-offset-[var(--zui-radio-ring-offset-focus-dark,oklch(12.9%_0.042_264.695))] group-data-[disabled=true]:cursor-not-allowed";
12
+ var zuiRadioGroupIndicatorBase = "pointer-events-none block rounded-full opacity-0 transition-opacity duration-150 group-data-[state=checked]:opacity-100";
13
+ var zuiRadioGroupSizes = {
14
+ sm: {
15
+ item: "text-xs",
16
+ control: "mt-0.5 size-4",
17
+ indicator: "size-1.5"
18
+ },
19
+ md: {
20
+ item: "text-sm",
21
+ control: "mt-0.5 size-5",
22
+ indicator: "size-2"
23
+ },
24
+ lg: {
25
+ item: "text-base",
26
+ control: "mt-0.5 size-6",
27
+ indicator: "size-2.5"
28
+ }
29
+ };
30
+ var zuiRadioGroupAppearances = {
31
+ default: "group-data-[state=checked]:border-[color:var(--zui-radio-default-border-checked,oklch(44.6%_0.043_257.281))] [&_[data-slot=radio-group-indicator]]:bg-[var(--zui-radio-default-indicator-bg,oklch(44.6%_0.043_257.281))]",
32
+ success: "group-data-[state=checked]:border-[color:var(--zui-radio-success-border-checked,oklch(59.6%_0.145_163.225))] [&_[data-slot=radio-group-indicator]]:bg-[var(--zui-radio-success-indicator-bg,oklch(59.6%_0.145_163.225))]",
33
+ warning: "group-data-[state=checked]:border-[color:var(--zui-radio-warning-border-checked,oklch(68.1%_0.162_75.834))] [&_[data-slot=radio-group-indicator]]:bg-[var(--zui-radio-warning-indicator-bg,oklch(68.1%_0.162_75.834))]",
34
+ error: "group-data-[state=checked]:border-[color:var(--zui-radio-error-border-checked,oklch(58.6%_0.253_17.585))] [&_[data-slot=radio-group-indicator]]:bg-[var(--zui-radio-error-indicator-bg,oklch(58.6%_0.253_17.585))]",
35
+ info: "group-data-[state=checked]:border-[color:var(--zui-radio-info-border-checked,oklch(54.6%_0.245_262.881))] [&_[data-slot=radio-group-indicator]]:bg-[var(--zui-radio-info-indicator-bg,oklch(54.6%_0.245_262.881))]",
36
+ violet: "group-data-[state=checked]:border-[color:var(--zui-radio-violet-border-checked,oklch(54.1%_0.281_293.009))] [&_[data-slot=radio-group-indicator]]:bg-[var(--zui-radio-violet-indicator-bg,oklch(54.1%_0.281_293.009))]",
37
+ amber: "group-data-[state=checked]:border-[color:var(--zui-radio-amber-border-checked,oklch(66.6%_0.179_58.318))] [&_[data-slot=radio-group-indicator]]:bg-[var(--zui-radio-amber-indicator-bg,oklch(66.6%_0.179_58.318))]",
38
+ pink: "group-data-[state=checked]:border-[color:var(--zui-radio-pink-border-checked,oklch(59.2%_0.249_0.584))] [&_[data-slot=radio-group-indicator]]:bg-[var(--zui-radio-pink-indicator-bg,oklch(59.2%_0.249_0.584))]",
39
+ indigo: "group-data-[state=checked]:border-[color:var(--zui-radio-indigo-border-checked,oklch(51.1%_0.262_276.966))] [&_[data-slot=radio-group-indicator]]:bg-[var(--zui-radio-indigo-indicator-bg,oklch(51.1%_0.262_276.966))]"
40
+ };
41
+ var zuiRadioGroupOrientations = {
42
+ vertical: "grid gap-2",
43
+ horizontal: "flex flex-wrap gap-x-5 gap-y-2"
44
+ };
45
+
46
+ // src/ui/radio-group/variants.ts
47
+ var radioGroupRootVariants = classVarianceAuthority.cva(zuiRadioGroupRootBase, {
48
+ variants: {
49
+ orientation: zuiRadioGroupOrientations
50
+ },
51
+ defaultVariants: {
52
+ orientation: "vertical"
53
+ }
54
+ });
55
+ var radioGroupItemVariants = classVarianceAuthority.cva(zuiRadioGroupItemBase, {
56
+ variants: {
57
+ size: {
58
+ sm: zuiRadioGroupSizes.sm.item,
59
+ md: zuiRadioGroupSizes.md.item,
60
+ lg: zuiRadioGroupSizes.lg.item
61
+ }
62
+ },
63
+ defaultVariants: {
64
+ size: "md"
65
+ }
66
+ });
67
+ var radioGroupControlVariants = classVarianceAuthority.cva(zuiRadioGroupControlBase, {
68
+ variants: {
69
+ appearance: zuiRadioGroupAppearances,
70
+ size: {
71
+ sm: zuiRadioGroupSizes.sm.control,
72
+ md: zuiRadioGroupSizes.md.control,
73
+ lg: zuiRadioGroupSizes.lg.control
74
+ }
75
+ },
76
+ defaultVariants: {
77
+ appearance: "default",
78
+ size: "md"
79
+ }
80
+ });
81
+ var radioGroupIndicatorVariants = classVarianceAuthority.cva(zuiRadioGroupIndicatorBase, {
82
+ variants: {
83
+ size: {
84
+ sm: zuiRadioGroupSizes.sm.indicator,
85
+ md: zuiRadioGroupSizes.md.indicator,
86
+ lg: zuiRadioGroupSizes.lg.indicator
87
+ }
88
+ },
89
+ defaultVariants: {
90
+ size: "md"
91
+ }
92
+ });
93
+ var RadioGroupContext = react.createContext(
94
+ null
95
+ );
96
+ function useRadioGroupContext() {
97
+ return react.useContext(RadioGroupContext);
98
+ }
99
+
100
+ exports.RadioGroupContext = RadioGroupContext;
101
+ exports.radioGroupControlVariants = radioGroupControlVariants;
102
+ exports.radioGroupIndicatorVariants = radioGroupIndicatorVariants;
103
+ exports.radioGroupItemVariants = radioGroupItemVariants;
104
+ exports.radioGroupRootVariants = radioGroupRootVariants;
105
+ exports.useRadioGroupContext = useRadioGroupContext;
106
+ //# sourceMappingURL=chunk-6QQUQLPB.js.map
107
+ //# sourceMappingURL=chunk-6QQUQLPB.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/design-system/radio-group.ts","../src/ui/radio-group/variants.ts","../src/ui/radio-group/radio-group-context.ts"],"names":["cva","createContext","useContext"],"mappings":";;;;;;;;AAAO,IAAM,qBAAA,GAAwB,YAAA;AAE9B,IAAM,qBAAA,GACX,uRAAA;AAEK,IAAM,wBAAA,GACX,wwBAAA;AAEK,IAAM,0BAAA,GACX,yHAAA;AAEK,IAAM,kBAAA,GAAqB;AAAA,EAChC,EAAA,EAAI;AAAA,IACF,IAAA,EAAM,SAAA;AAAA,IACN,OAAA,EAAS,eAAA;AAAA,IACT,SAAA,EAAW;AAAA,GACb;AAAA,EACA,EAAA,EAAI;AAAA,IACF,IAAA,EAAM,SAAA;AAAA,IACN,OAAA,EAAS,eAAA;AAAA,IACT,SAAA,EAAW;AAAA,GACb;AAAA,EACA,EAAA,EAAI;AAAA,IACF,IAAA,EAAM,WAAA;AAAA,IACN,OAAA,EAAS,eAAA;AAAA,IACT,SAAA,EAAW;AAAA;AAEf,CAAA;AAEO,IAAM,wBAAA,GAA2B;AAAA,EACtC,OAAA,EACE,0NAAA;AAAA,EACF,OAAA,EACE,0NAAA;AAAA,EACF,OAAA,EACE,wNAAA;AAAA,EACF,KAAA,EACE,oNAAA;AAAA,EACF,IAAA,EACE,oNAAA;AAAA,EACF,MAAA,EACE,wNAAA;AAAA,EACF,KAAA,EACE,oNAAA;AAAA,EACF,IAAA,EACE,gNAAA;AAAA,EACF,MAAA,EACE;AACJ,CAAA;AAEO,IAAM,yBAAA,GAA4B;AAAA,EACvC,QAAA,EAAU,YAAA;AAAA,EACV,UAAA,EAAY;AACd,CAAA;;;ACzCO,IAAM,sBAAA,GAAyBA,2BAAI,qBAAA,EAAuB;AAAA,EAC/D,QAAA,EAAU;AAAA,IACR,WAAA,EAAa;AAAA,GACf;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,WAAA,EAAa;AAAA;AAEjB,CAAC;AAEM,IAAM,sBAAA,GAAyBA,2BAAI,qBAAA,EAAuB;AAAA,EAC/D,QAAA,EAAU;AAAA,IACR,IAAA,EAAM;AAAA,MACJ,EAAA,EAAI,mBAAmB,EAAA,CAAG,IAAA;AAAA,MAC1B,EAAA,EAAI,mBAAmB,EAAA,CAAG,IAAA;AAAA,MAC1B,EAAA,EAAI,mBAAmB,EAAA,CAAG;AAAA;AAC5B,GACF;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,IAAA,EAAM;AAAA;AAEV,CAAC;AAEM,IAAM,yBAAA,GAA4BA,2BAAI,wBAAA,EAA0B;AAAA,EACrE,QAAA,EAAU;AAAA,IACR,UAAA,EAAY,wBAAA;AAAA,IACZ,IAAA,EAAM;AAAA,MACJ,EAAA,EAAI,mBAAmB,EAAA,CAAG,OAAA;AAAA,MAC1B,EAAA,EAAI,mBAAmB,EAAA,CAAG,OAAA;AAAA,MAC1B,EAAA,EAAI,mBAAmB,EAAA,CAAG;AAAA;AAC5B,GACF;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,UAAA,EAAY,SAAA;AAAA,IACZ,IAAA,EAAM;AAAA;AAEV,CAAC;AAEM,IAAM,2BAAA,GAA8BA,2BAAI,0BAAA,EAA4B;AAAA,EACzE,QAAA,EAAU;AAAA,IACR,IAAA,EAAM;AAAA,MACJ,EAAA,EAAI,mBAAmB,EAAA,CAAG,SAAA;AAAA,MAC1B,EAAA,EAAI,mBAAmB,EAAA,CAAG,SAAA;AAAA,MAC1B,EAAA,EAAI,mBAAmB,EAAA,CAAG;AAAA;AAC5B,GACF;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,IAAA,EAAM;AAAA;AAEV,CAAC;AC5CM,IAAM,iBAAA,GAAoBC,mBAAA;AAAA,EAC/B;AACF;AAEO,SAAS,oBAAA,GAAuB;AACrC,EAAA,OAAOC,iBAAW,iBAAiB,CAAA;AACrC","file":"chunk-6QQUQLPB.js","sourcesContent":["export const zuiRadioGroupRootBase = \"grid gap-2\";\n\nexport const zuiRadioGroupItemBase =\n \"group inline-flex w-fit items-start gap-2.5 text-sm font-medium text-[color:var(--zui-radio-label-fg,oklch(20.8%_0.042_265.755))] dark:text-[color:var(--zui-radio-label-fg-dark,oklch(98.4%_0.003_247.858))] data-[disabled=true]:cursor-not-allowed data-[disabled=true]:opacity-50\";\n\nexport const zuiRadioGroupControlBase =\n \"grid shrink-0 place-items-center rounded-full border-2 border-[color:var(--zui-radio-border,#0000004d)] bg-[var(--zui-radio-bg,transparent)] transition-[background-color,border-color,box-shadow] peer-focus-visible:outline-none peer-focus-visible:ring-2 peer-focus-visible:ring-[var(--zui-radio-ring-focus,oklch(44.6%_0.043_257.281_/_0.7))] peer-focus-visible:ring-offset-2 peer-focus-visible:ring-offset-[var(--zui-radio-ring-offset-focus,oklch(98.4%_0.003_247.858))] dark:border-[color:var(--zui-radio-border-dark,#ffffff4d)] dark:peer-focus-visible:ring-[var(--zui-radio-ring-focus-dark,oklch(86.9%_0.022_252.894_/_0.7))] dark:peer-focus-visible:ring-offset-[var(--zui-radio-ring-offset-focus-dark,oklch(12.9%_0.042_264.695))] group-data-[disabled=true]:cursor-not-allowed\";\n\nexport const zuiRadioGroupIndicatorBase =\n \"pointer-events-none block rounded-full opacity-0 transition-opacity duration-150 group-data-[state=checked]:opacity-100\";\n\nexport const zuiRadioGroupSizes = {\n sm: {\n item: \"text-xs\",\n control: \"mt-0.5 size-4\",\n indicator: \"size-1.5\",\n },\n md: {\n item: \"text-sm\",\n control: \"mt-0.5 size-5\",\n indicator: \"size-2\",\n },\n lg: {\n item: \"text-base\",\n control: \"mt-0.5 size-6\",\n indicator: \"size-2.5\",\n },\n} as const;\n\nexport const zuiRadioGroupAppearances = {\n default:\n \"group-data-[state=checked]:border-[color:var(--zui-radio-default-border-checked,oklch(44.6%_0.043_257.281))] [&_[data-slot=radio-group-indicator]]:bg-[var(--zui-radio-default-indicator-bg,oklch(44.6%_0.043_257.281))]\",\n success:\n \"group-data-[state=checked]:border-[color:var(--zui-radio-success-border-checked,oklch(59.6%_0.145_163.225))] [&_[data-slot=radio-group-indicator]]:bg-[var(--zui-radio-success-indicator-bg,oklch(59.6%_0.145_163.225))]\",\n warning:\n \"group-data-[state=checked]:border-[color:var(--zui-radio-warning-border-checked,oklch(68.1%_0.162_75.834))] [&_[data-slot=radio-group-indicator]]:bg-[var(--zui-radio-warning-indicator-bg,oklch(68.1%_0.162_75.834))]\",\n error:\n \"group-data-[state=checked]:border-[color:var(--zui-radio-error-border-checked,oklch(58.6%_0.253_17.585))] [&_[data-slot=radio-group-indicator]]:bg-[var(--zui-radio-error-indicator-bg,oklch(58.6%_0.253_17.585))]\",\n info:\n \"group-data-[state=checked]:border-[color:var(--zui-radio-info-border-checked,oklch(54.6%_0.245_262.881))] [&_[data-slot=radio-group-indicator]]:bg-[var(--zui-radio-info-indicator-bg,oklch(54.6%_0.245_262.881))]\",\n violet:\n \"group-data-[state=checked]:border-[color:var(--zui-radio-violet-border-checked,oklch(54.1%_0.281_293.009))] [&_[data-slot=radio-group-indicator]]:bg-[var(--zui-radio-violet-indicator-bg,oklch(54.1%_0.281_293.009))]\",\n amber:\n \"group-data-[state=checked]:border-[color:var(--zui-radio-amber-border-checked,oklch(66.6%_0.179_58.318))] [&_[data-slot=radio-group-indicator]]:bg-[var(--zui-radio-amber-indicator-bg,oklch(66.6%_0.179_58.318))]\",\n pink:\n \"group-data-[state=checked]:border-[color:var(--zui-radio-pink-border-checked,oklch(59.2%_0.249_0.584))] [&_[data-slot=radio-group-indicator]]:bg-[var(--zui-radio-pink-indicator-bg,oklch(59.2%_0.249_0.584))]\",\n indigo:\n \"group-data-[state=checked]:border-[color:var(--zui-radio-indigo-border-checked,oklch(51.1%_0.262_276.966))] [&_[data-slot=radio-group-indicator]]:bg-[var(--zui-radio-indigo-indicator-bg,oklch(51.1%_0.262_276.966))]\",\n} as const;\n\nexport const zuiRadioGroupOrientations = {\n vertical: \"grid gap-2\",\n horizontal: \"flex flex-wrap gap-x-5 gap-y-2\",\n} as const;\n","import { cva } from \"class-variance-authority\";\n\nimport {\n zuiRadioGroupAppearances,\n zuiRadioGroupControlBase,\n zuiRadioGroupIndicatorBase,\n zuiRadioGroupItemBase,\n zuiRadioGroupOrientations,\n zuiRadioGroupRootBase,\n zuiRadioGroupSizes,\n} from \"../../design-system/radio-group\";\n\nexport const radioGroupRootVariants = cva(zuiRadioGroupRootBase, {\n variants: {\n orientation: zuiRadioGroupOrientations,\n },\n defaultVariants: {\n orientation: \"vertical\",\n },\n});\n\nexport const radioGroupItemVariants = cva(zuiRadioGroupItemBase, {\n variants: {\n size: {\n sm: zuiRadioGroupSizes.sm.item,\n md: zuiRadioGroupSizes.md.item,\n lg: zuiRadioGroupSizes.lg.item,\n },\n },\n defaultVariants: {\n size: \"md\",\n },\n});\n\nexport const radioGroupControlVariants = cva(zuiRadioGroupControlBase, {\n variants: {\n appearance: zuiRadioGroupAppearances,\n size: {\n sm: zuiRadioGroupSizes.sm.control,\n md: zuiRadioGroupSizes.md.control,\n lg: zuiRadioGroupSizes.lg.control,\n },\n },\n defaultVariants: {\n appearance: \"default\",\n size: \"md\",\n },\n});\n\nexport const radioGroupIndicatorVariants = cva(zuiRadioGroupIndicatorBase, {\n variants: {\n size: {\n sm: zuiRadioGroupSizes.sm.indicator,\n md: zuiRadioGroupSizes.md.indicator,\n lg: zuiRadioGroupSizes.lg.indicator,\n },\n },\n defaultVariants: {\n size: \"md\",\n },\n});\n","\"use client\";\n\nimport { createContext, useContext } from \"react\";\n\nimport type { RadioGroupAppearance, RadioGroupSize } from \"./types\";\n\nexport type RadioGroupContextValue = {\n value: string | undefined;\n name: string;\n disabled?: boolean;\n required?: boolean;\n appearance?: RadioGroupAppearance;\n size?: RadioGroupSize;\n onValueChange: (value: string) => void;\n};\n\nexport const RadioGroupContext = createContext<RadioGroupContextValue | null>(\n null,\n);\n\nexport function useRadioGroupContext() {\n return useContext(RadioGroupContext);\n}\n"]}
@@ -0,0 +1,251 @@
1
+ import { cn } from './chunk-4D54YOL6.mjs';
2
+ import { cva } from 'class-variance-authority';
3
+ import { createContext, useContext, useState, useId, useRef, useCallback, useEffect, useMemo, Children, isValidElement, cloneElement } from 'react';
4
+ import { jsx } from 'react/jsx-runtime';
5
+
6
+ // src/design-system/popover.ts
7
+ var zuiPopoverContentBase = "absolute z-50 rounded-lg border shadow-lg transition-all duration-200 outline-none";
8
+ var zuiPopoverContentVariants = {
9
+ default: "border-[color:var(--zui-popover-default-border,oklch(20.8%_0.042_265.755_/_0.1))] dark:border-[color:var(--zui-popover-default-border-dark,#ffffff1a)] bg-[var(--zui-popover-default-bg,#ffffff)] dark:bg-[var(--zui-popover-default-bg-dark,oklch(20.8%_0.042_265.755))] text-[color:var(--zui-popover-default-fg,oklch(20.8%_0.042_265.755))] dark:text-[color:var(--zui-popover-default-fg-dark,oklch(96.8%_0.007_247.896))]",
10
+ outline: "border-[color:var(--zui-popover-outline-border,oklch(37.3%_0.034_259.733))] dark:border-[color:var(--zui-popover-outline-border-dark,oklch(87.2%_0.01_258.338))] bg-[var(--zui-popover-outline-bg,#ffffff)] dark:bg-[var(--zui-popover-outline-bg-dark,#000000)] text-[color:var(--zui-popover-outline-fg,oklch(21%_0.034_264.665))] dark:text-[color:var(--zui-popover-outline-fg-dark,#ffffff)]",
11
+ ghost: "border-transparent bg-[var(--zui-popover-ghost-bg,oklch(96.7%_0.003_264.542))] dark:bg-[var(--zui-popover-ghost-bg-dark,oklch(27.8%_0.033_256.848))] text-[color:var(--zui-popover-ghost-fg,oklch(21%_0.034_264.665))] dark:text-[color:var(--zui-popover-ghost-fg-dark,#ffffffe6)]",
12
+ glass: "border-[color:var(--zui-popover-glass-border,#00000026)] dark:border-[color:var(--zui-popover-glass-border-dark,#ffffff26)] bg-[var(--zui-popover-glass-bg,#ffffffb3)] dark:bg-[var(--zui-popover-glass-bg-dark,#020617b3)] text-[color:var(--zui-popover-glass-fg,oklch(20.8%_0.042_265.755))] dark:text-[color:var(--zui-popover-glass-fg-dark,#ffffff)] backdrop-blur-md",
13
+ emerald: "border-[color:var(--zui-popover-emerald-border,oklch(43.2%_0.095_166.913_/_0.35))] bg-[var(--zui-popover-emerald-bg,oklch(90.5%_0.093_164.15))] text-[color:var(--zui-popover-emerald-fg,oklch(37.8%_0.077_168.94))] dark:bg-[var(--zui-popover-emerald-bg-dark,oklch(26.2%_0.051_172.552))] dark:text-[color:var(--zui-popover-emerald-fg-dark,oklch(90.5%_0.093_164.15))]",
14
+ indigo: "border-[color:var(--zui-popover-indigo-border,oklch(39.8%_0.195_277.366_/_0.35))] bg-[var(--zui-popover-indigo-bg,oklch(87%_0.065_274.039))] text-[color:var(--zui-popover-indigo-fg,oklch(35.9%_0.144_278.697))] dark:bg-[var(--zui-popover-indigo-bg-dark,oklch(25.7%_0.09_281.288))] dark:text-[color:var(--zui-popover-indigo-fg-dark,oklch(87%_0.065_274.039))]",
15
+ purple: "border-[color:var(--zui-popover-purple-border,oklch(43.8%_0.218_303.724_/_0.35))] bg-[var(--zui-popover-purple-bg,oklch(90.2%_0.063_306.703))] text-[color:var(--zui-popover-purple-fg,oklch(38.1%_0.176_304.987))] dark:bg-[var(--zui-popover-purple-bg-dark,oklch(29.1%_0.149_302.717))] dark:text-[color:var(--zui-popover-purple-fg-dark,oklch(90.2%_0.063_306.703))]",
16
+ pink: "border-[color:var(--zui-popover-pink-border,oklch(45.9%_0.187_3.815_/_0.35))] bg-[var(--zui-popover-pink-bg,oklch(89.9%_0.061_343.231))] text-[color:var(--zui-popover-pink-fg,oklch(40.8%_0.153_2.432))] dark:bg-[var(--zui-popover-pink-bg-dark,oklch(28.4%_0.109_3.907))] dark:text-[color:var(--zui-popover-pink-fg-dark,oklch(89.9%_0.061_343.231))]",
17
+ rose: "border-[color:var(--zui-popover-rose-border,oklch(45.5%_0.188_13.697_/_0.35))] bg-[var(--zui-popover-rose-bg,oklch(89.2%_0.058_10.001))] text-[color:var(--zui-popover-rose-fg,oklch(41%_0.159_10.272))] dark:bg-[var(--zui-popover-rose-bg-dark,oklch(27.1%_0.105_12.094))] dark:text-[color:var(--zui-popover-rose-fg-dark,oklch(89.2%_0.058_10.001))]",
18
+ sky: "border-[color:var(--zui-popover-sky-border,oklch(44.3%_0.11_240.79_/_0.35))] bg-[var(--zui-popover-sky-bg,oklch(90.1%_0.058_230.902))] text-[color:var(--zui-popover-sky-fg,oklch(39.1%_0.09_240.876))] dark:bg-[var(--zui-popover-sky-bg-dark,oklch(29.3%_0.066_243.157))] dark:text-[color:var(--zui-popover-sky-fg-dark,oklch(90.1%_0.058_230.902))]",
19
+ teal: "border-[color:var(--zui-popover-teal-border,oklch(43.7%_0.078_188.216_/_0.35))] bg-[var(--zui-popover-teal-bg,oklch(91%_0.096_180.426))] text-[color:var(--zui-popover-teal-fg,oklch(38.6%_0.063_188.416))] dark:bg-[var(--zui-popover-teal-bg-dark,oklch(27.7%_0.046_192.524))] dark:text-[color:var(--zui-popover-teal-fg-dark,oklch(91%_0.096_180.426))]",
20
+ yellow: "border-[color:var(--zui-popover-yellow-border,oklch(47.6%_0.114_61.907_/_0.35))] bg-[var(--zui-popover-yellow-bg,oklch(94.5%_0.129_101.54))] text-[color:var(--zui-popover-yellow-fg,oklch(42.1%_0.095_57.708))] dark:bg-[var(--zui-popover-yellow-bg-dark,oklch(28.6%_0.066_53.813))] dark:text-[color:var(--zui-popover-yellow-fg-dark,oklch(94.5%_0.129_101.54))]",
21
+ orange: "border-[color:var(--zui-popover-orange-border,oklch(47%_0.157_37.304_/_0.35))] bg-[var(--zui-popover-orange-bg,oklch(90.1%_0.076_70.697))] text-[color:var(--zui-popover-orange-fg,oklch(40.8%_0.123_38.172))] dark:bg-[var(--zui-popover-orange-bg-dark,oklch(26.6%_0.079_36.259))] dark:text-[color:var(--zui-popover-orange-fg-dark,oklch(90.1%_0.076_70.697))]",
22
+ green: "border-[color:var(--zui-popover-green-border,oklch(44.8%_0.119_151.328_/_0.35))] bg-[var(--zui-popover-green-bg,oklch(92.5%_0.084_155.995))] text-[color:var(--zui-popover-green-fg,oklch(39.3%_0.095_152.535))] dark:bg-[var(--zui-popover-green-bg-dark,oklch(26.6%_0.065_152.934))] dark:text-[color:var(--zui-popover-green-fg-dark,oklch(92.5%_0.084_155.995))]",
23
+ "gradient-blue": "border-transparent bg-linear-to-r from-[var(--zui-popover-gradient-blue-from,oklch(42.4%_0.199_265.638))] to-[var(--zui-popover-gradient-blue-to,oklch(43.8%_0.218_303.724))] text-[color:var(--zui-popover-gradient-blue-fg,#ffffff)]",
24
+ "gradient-green": "border-transparent bg-linear-to-r from-[var(--zui-popover-gradient-green-from,oklch(44.8%_0.119_151.328))] to-[var(--zui-popover-gradient-green-to,oklch(45.3%_0.124_130.933))] text-[color:var(--zui-popover-gradient-green-fg,#ffffff)]",
25
+ "gradient-red": "border-transparent bg-linear-to-r from-[var(--zui-popover-gradient-red-from,oklch(44.4%_0.177_26.899))] to-[var(--zui-popover-gradient-red-to,oklch(45.9%_0.187_3.815))] text-[color:var(--zui-popover-gradient-red-fg,#ffffff)]",
26
+ "gradient-yellow": "border-transparent bg-linear-to-r from-[var(--zui-popover-gradient-yellow-from,oklch(47.6%_0.114_61.907))] to-[var(--zui-popover-gradient-yellow-to,oklch(47%_0.157_37.304))] text-[color:var(--zui-popover-gradient-yellow-fg,#ffffff)]",
27
+ "gradient-purple": "border-transparent bg-linear-to-r from-[var(--zui-popover-gradient-purple-from,oklch(43.8%_0.218_303.724))] to-[var(--zui-popover-gradient-purple-to,oklch(45.9%_0.187_3.815))] text-[color:var(--zui-popover-gradient-purple-fg,#ffffff)]",
28
+ "gradient-teal": "border-transparent bg-linear-to-r from-[var(--zui-popover-gradient-teal-from,oklch(43.7%_0.078_188.216))] to-[var(--zui-popover-gradient-teal-to,oklch(45%_0.085_224.283))] text-[color:var(--zui-popover-gradient-teal-fg,#ffffff)]",
29
+ "gradient-indigo": "border-transparent bg-linear-to-r from-[var(--zui-popover-gradient-indigo-from,oklch(39.8%_0.195_277.366))] to-[var(--zui-popover-gradient-indigo-to,oklch(43.8%_0.218_303.724))] text-[color:var(--zui-popover-gradient-indigo-fg,#ffffff)]",
30
+ "gradient-pink": "border-transparent bg-linear-to-r from-[var(--zui-popover-gradient-pink-from,oklch(45.9%_0.187_3.815))] to-[var(--zui-popover-gradient-pink-to,oklch(45.5%_0.188_13.697))] text-[color:var(--zui-popover-gradient-pink-fg,#ffffff)]",
31
+ "gradient-orange": "border-transparent bg-linear-to-r from-[var(--zui-popover-gradient-orange-from,oklch(47%_0.157_37.304))] to-[var(--zui-popover-gradient-orange-to,oklch(44.4%_0.177_26.899))] text-[color:var(--zui-popover-gradient-orange-fg,#ffffff)]"
32
+ };
33
+ var zuiPopoverContentSizes = {
34
+ sm: "p-3 text-sm",
35
+ md: "p-4 text-sm",
36
+ lg: "p-5 text-base"
37
+ };
38
+ var zuiPopoverContentWidths = {
39
+ xs: "min-w-50 md:min-w-xs",
40
+ sm: "min-w-50 md:min-w-sm",
41
+ md: "min-w-50 md:min-w-md",
42
+ lg: "min-w-50 md:min-w-lg",
43
+ xl: "min-w-50 md:min-w-xl",
44
+ "2xl": "min-w-50 md:min-w-2xl"
45
+ };
46
+
47
+ // src/ui/popover/variants.ts
48
+ var popoverContentVariants = cva(zuiPopoverContentBase, {
49
+ variants: {
50
+ variant: zuiPopoverContentVariants,
51
+ size: zuiPopoverContentSizes,
52
+ width: zuiPopoverContentWidths
53
+ },
54
+ defaultVariants: {
55
+ variant: "default",
56
+ size: "md",
57
+ width: "xs"
58
+ }
59
+ });
60
+ var PopoverContext = createContext(null);
61
+ var usePopover = () => {
62
+ const context = useContext(PopoverContext);
63
+ if (!context) {
64
+ throw new Error("Popover components must be used within Popover");
65
+ }
66
+ return context;
67
+ };
68
+ function mergeRefs(...refs) {
69
+ return (node) => {
70
+ for (const ref of refs) {
71
+ if (typeof ref === "function") {
72
+ ref(node);
73
+ } else if (ref) {
74
+ ref.current = node;
75
+ }
76
+ }
77
+ };
78
+ }
79
+ function sideAlignClass(side, align) {
80
+ const sideClasses = {
81
+ top: "bottom-full mb-2",
82
+ bottom: "top-full mt-2",
83
+ left: "right-full mr-2",
84
+ right: "left-full ml-2"
85
+ };
86
+ const verticalAlign = {
87
+ start: "left-0",
88
+ center: "left-1/2 -translate-x-1/2",
89
+ end: "right-0"
90
+ };
91
+ const horizontalAlign = {
92
+ start: "top-0",
93
+ center: "top-1/2 -translate-y-1/2",
94
+ end: "bottom-0"
95
+ };
96
+ return cn(
97
+ sideClasses[side],
98
+ side === "top" || side === "bottom" ? verticalAlign[align] : horizontalAlign[align]
99
+ );
100
+ }
101
+ var Popover = ({
102
+ children,
103
+ defaultOpen = false,
104
+ open: controlledOpen,
105
+ onOpenChange,
106
+ closeOnEscape = true,
107
+ closeOnOutsideClick = true
108
+ }) => {
109
+ const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen);
110
+ const contentId = `${useId()}-popover`;
111
+ const triggerRef = useRef(null);
112
+ const contentRef = useRef(null);
113
+ const isControlled = controlledOpen !== void 0;
114
+ const open = isControlled ? controlledOpen : uncontrolledOpen;
115
+ const setOpen = useCallback(
116
+ (value) => {
117
+ if (!isControlled) {
118
+ setUncontrolledOpen(value);
119
+ }
120
+ onOpenChange?.(value);
121
+ },
122
+ [isControlled, onOpenChange]
123
+ );
124
+ const toggleOpen = useCallback(() => setOpen(!open), [open, setOpen]);
125
+ useEffect(() => {
126
+ if (!open) {
127
+ return void 0;
128
+ }
129
+ const onPointerDown = (event) => {
130
+ if (!closeOnOutsideClick) {
131
+ return;
132
+ }
133
+ const target = event.target;
134
+ if (contentRef.current?.contains(target) || triggerRef.current?.contains(target)) {
135
+ return;
136
+ }
137
+ setOpen(false);
138
+ };
139
+ const onKeyDown = (event) => {
140
+ if (event.key === "Escape" && closeOnEscape) {
141
+ setOpen(false);
142
+ triggerRef.current?.focus();
143
+ }
144
+ };
145
+ document.addEventListener("pointerdown", onPointerDown);
146
+ document.addEventListener("keydown", onKeyDown);
147
+ return () => {
148
+ document.removeEventListener("pointerdown", onPointerDown);
149
+ document.removeEventListener("keydown", onKeyDown);
150
+ };
151
+ }, [closeOnEscape, closeOnOutsideClick, open, setOpen]);
152
+ const contextValue = useMemo(
153
+ () => ({
154
+ open,
155
+ setOpen,
156
+ toggleOpen,
157
+ contentId,
158
+ triggerRef,
159
+ contentRef
160
+ }),
161
+ [open, setOpen, toggleOpen, contentId]
162
+ );
163
+ return /* @__PURE__ */ jsx(
164
+ PopoverContext.Provider,
165
+ {
166
+ value: contextValue,
167
+ children: /* @__PURE__ */ jsx("div", { className: "relative inline-block", children })
168
+ }
169
+ );
170
+ };
171
+ var PopoverTrigger = ({
172
+ children,
173
+ className
174
+ }) => {
175
+ const { open, toggleOpen, contentId, triggerRef } = usePopover();
176
+ const childList = Children.toArray(children).filter(
177
+ (node) => node !== null && node !== void 0 && typeof node !== "boolean"
178
+ );
179
+ const soleCandidate = childList.length === 1 && isValidElement(childList[0]) ? childList[0] : void 0;
180
+ if (soleCandidate) {
181
+ return cloneElement(soleCandidate, {
182
+ ref: mergeRefs(triggerRef, soleCandidate.props.ref),
183
+ onClick: (event) => {
184
+ soleCandidate.props.onClick?.(event);
185
+ if (!event.defaultPrevented) {
186
+ toggleOpen();
187
+ }
188
+ },
189
+ onKeyDown: (event) => {
190
+ soleCandidate.props.onKeyDown?.(event);
191
+ if (event.key === "Escape") {
192
+ event.preventDefault();
193
+ }
194
+ },
195
+ className: cn(className, soleCandidate.props.className),
196
+ "aria-expanded": open,
197
+ "aria-haspopup": "dialog",
198
+ "aria-controls": open ? contentId : void 0
199
+ });
200
+ }
201
+ return /* @__PURE__ */ jsx(
202
+ "button",
203
+ {
204
+ ref: triggerRef,
205
+ type: "button",
206
+ className,
207
+ "aria-expanded": open,
208
+ "aria-haspopup": "dialog",
209
+ "aria-controls": open ? contentId : void 0,
210
+ onClick: toggleOpen,
211
+ children
212
+ }
213
+ );
214
+ };
215
+ var PopoverContent = ({
216
+ children,
217
+ className,
218
+ variant,
219
+ size,
220
+ width,
221
+ side = "bottom",
222
+ align = "center",
223
+ role = "dialog",
224
+ ...props
225
+ }) => {
226
+ const { open, contentId, contentRef } = usePopover();
227
+ if (!open) {
228
+ return null;
229
+ }
230
+ return /* @__PURE__ */ jsx(
231
+ "div",
232
+ {
233
+ ref: contentRef,
234
+ id: contentId,
235
+ "data-open": open,
236
+ role,
237
+ tabIndex: -1,
238
+ className: cn(
239
+ popoverContentVariants({ variant, size, width }),
240
+ sideAlignClass(side, align),
241
+ className
242
+ ),
243
+ ...props,
244
+ children
245
+ }
246
+ );
247
+ };
248
+
249
+ export { Popover, PopoverContent, PopoverContext, PopoverTrigger, popoverContentVariants, sideAlignClass, usePopover };
250
+ //# sourceMappingURL=chunk-BC6M42HQ.mjs.map
251
+ //# sourceMappingURL=chunk-BC6M42HQ.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/design-system/popover.ts","../src/ui/popover/variants.ts","../src/ui/popover/popover-base.tsx"],"names":[],"mappings":"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","file":"chunk-BC6M42HQ.mjs","sourcesContent":["export const zuiPopoverContentBase =\n \"absolute z-50 rounded-lg border shadow-lg transition-all duration-200 outline-none\";\n\nexport const zuiPopoverContentVariants = {\n default:\n \"border-[color:var(--zui-popover-default-border,oklch(20.8%_0.042_265.755_/_0.1))] dark:border-[color:var(--zui-popover-default-border-dark,#ffffff1a)] bg-[var(--zui-popover-default-bg,#ffffff)] dark:bg-[var(--zui-popover-default-bg-dark,oklch(20.8%_0.042_265.755))] text-[color:var(--zui-popover-default-fg,oklch(20.8%_0.042_265.755))] dark:text-[color:var(--zui-popover-default-fg-dark,oklch(96.8%_0.007_247.896))]\",\n outline:\n \"border-[color:var(--zui-popover-outline-border,oklch(37.3%_0.034_259.733))] dark:border-[color:var(--zui-popover-outline-border-dark,oklch(87.2%_0.01_258.338))] bg-[var(--zui-popover-outline-bg,#ffffff)] dark:bg-[var(--zui-popover-outline-bg-dark,#000000)] text-[color:var(--zui-popover-outline-fg,oklch(21%_0.034_264.665))] dark:text-[color:var(--zui-popover-outline-fg-dark,#ffffff)]\",\n ghost:\n \"border-transparent bg-[var(--zui-popover-ghost-bg,oklch(96.7%_0.003_264.542))] dark:bg-[var(--zui-popover-ghost-bg-dark,oklch(27.8%_0.033_256.848))] text-[color:var(--zui-popover-ghost-fg,oklch(21%_0.034_264.665))] dark:text-[color:var(--zui-popover-ghost-fg-dark,#ffffffe6)]\",\n glass:\n \"border-[color:var(--zui-popover-glass-border,#00000026)] dark:border-[color:var(--zui-popover-glass-border-dark,#ffffff26)] bg-[var(--zui-popover-glass-bg,#ffffffb3)] dark:bg-[var(--zui-popover-glass-bg-dark,#020617b3)] text-[color:var(--zui-popover-glass-fg,oklch(20.8%_0.042_265.755))] dark:text-[color:var(--zui-popover-glass-fg-dark,#ffffff)] backdrop-blur-md\",\n emerald:\n \"border-[color:var(--zui-popover-emerald-border,oklch(43.2%_0.095_166.913_/_0.35))] bg-[var(--zui-popover-emerald-bg,oklch(90.5%_0.093_164.15))] text-[color:var(--zui-popover-emerald-fg,oklch(37.8%_0.077_168.94))] dark:bg-[var(--zui-popover-emerald-bg-dark,oklch(26.2%_0.051_172.552))] dark:text-[color:var(--zui-popover-emerald-fg-dark,oklch(90.5%_0.093_164.15))]\",\n indigo:\n \"border-[color:var(--zui-popover-indigo-border,oklch(39.8%_0.195_277.366_/_0.35))] bg-[var(--zui-popover-indigo-bg,oklch(87%_0.065_274.039))] text-[color:var(--zui-popover-indigo-fg,oklch(35.9%_0.144_278.697))] dark:bg-[var(--zui-popover-indigo-bg-dark,oklch(25.7%_0.09_281.288))] dark:text-[color:var(--zui-popover-indigo-fg-dark,oklch(87%_0.065_274.039))]\",\n purple:\n \"border-[color:var(--zui-popover-purple-border,oklch(43.8%_0.218_303.724_/_0.35))] bg-[var(--zui-popover-purple-bg,oklch(90.2%_0.063_306.703))] text-[color:var(--zui-popover-purple-fg,oklch(38.1%_0.176_304.987))] dark:bg-[var(--zui-popover-purple-bg-dark,oklch(29.1%_0.149_302.717))] dark:text-[color:var(--zui-popover-purple-fg-dark,oklch(90.2%_0.063_306.703))]\",\n pink:\n \"border-[color:var(--zui-popover-pink-border,oklch(45.9%_0.187_3.815_/_0.35))] bg-[var(--zui-popover-pink-bg,oklch(89.9%_0.061_343.231))] text-[color:var(--zui-popover-pink-fg,oklch(40.8%_0.153_2.432))] dark:bg-[var(--zui-popover-pink-bg-dark,oklch(28.4%_0.109_3.907))] dark:text-[color:var(--zui-popover-pink-fg-dark,oklch(89.9%_0.061_343.231))]\",\n rose:\n \"border-[color:var(--zui-popover-rose-border,oklch(45.5%_0.188_13.697_/_0.35))] bg-[var(--zui-popover-rose-bg,oklch(89.2%_0.058_10.001))] text-[color:var(--zui-popover-rose-fg,oklch(41%_0.159_10.272))] dark:bg-[var(--zui-popover-rose-bg-dark,oklch(27.1%_0.105_12.094))] dark:text-[color:var(--zui-popover-rose-fg-dark,oklch(89.2%_0.058_10.001))]\",\n sky:\n \"border-[color:var(--zui-popover-sky-border,oklch(44.3%_0.11_240.79_/_0.35))] bg-[var(--zui-popover-sky-bg,oklch(90.1%_0.058_230.902))] text-[color:var(--zui-popover-sky-fg,oklch(39.1%_0.09_240.876))] dark:bg-[var(--zui-popover-sky-bg-dark,oklch(29.3%_0.066_243.157))] dark:text-[color:var(--zui-popover-sky-fg-dark,oklch(90.1%_0.058_230.902))]\",\n teal:\n \"border-[color:var(--zui-popover-teal-border,oklch(43.7%_0.078_188.216_/_0.35))] bg-[var(--zui-popover-teal-bg,oklch(91%_0.096_180.426))] text-[color:var(--zui-popover-teal-fg,oklch(38.6%_0.063_188.416))] dark:bg-[var(--zui-popover-teal-bg-dark,oklch(27.7%_0.046_192.524))] dark:text-[color:var(--zui-popover-teal-fg-dark,oklch(91%_0.096_180.426))]\",\n yellow:\n \"border-[color:var(--zui-popover-yellow-border,oklch(47.6%_0.114_61.907_/_0.35))] bg-[var(--zui-popover-yellow-bg,oklch(94.5%_0.129_101.54))] text-[color:var(--zui-popover-yellow-fg,oklch(42.1%_0.095_57.708))] dark:bg-[var(--zui-popover-yellow-bg-dark,oklch(28.6%_0.066_53.813))] dark:text-[color:var(--zui-popover-yellow-fg-dark,oklch(94.5%_0.129_101.54))]\",\n orange:\n \"border-[color:var(--zui-popover-orange-border,oklch(47%_0.157_37.304_/_0.35))] bg-[var(--zui-popover-orange-bg,oklch(90.1%_0.076_70.697))] text-[color:var(--zui-popover-orange-fg,oklch(40.8%_0.123_38.172))] dark:bg-[var(--zui-popover-orange-bg-dark,oklch(26.6%_0.079_36.259))] dark:text-[color:var(--zui-popover-orange-fg-dark,oklch(90.1%_0.076_70.697))]\",\n green:\n \"border-[color:var(--zui-popover-green-border,oklch(44.8%_0.119_151.328_/_0.35))] bg-[var(--zui-popover-green-bg,oklch(92.5%_0.084_155.995))] text-[color:var(--zui-popover-green-fg,oklch(39.3%_0.095_152.535))] dark:bg-[var(--zui-popover-green-bg-dark,oklch(26.6%_0.065_152.934))] dark:text-[color:var(--zui-popover-green-fg-dark,oklch(92.5%_0.084_155.995))]\",\n \"gradient-blue\":\n \"border-transparent bg-linear-to-r from-[var(--zui-popover-gradient-blue-from,oklch(42.4%_0.199_265.638))] to-[var(--zui-popover-gradient-blue-to,oklch(43.8%_0.218_303.724))] text-[color:var(--zui-popover-gradient-blue-fg,#ffffff)]\",\n \"gradient-green\":\n \"border-transparent bg-linear-to-r from-[var(--zui-popover-gradient-green-from,oklch(44.8%_0.119_151.328))] to-[var(--zui-popover-gradient-green-to,oklch(45.3%_0.124_130.933))] text-[color:var(--zui-popover-gradient-green-fg,#ffffff)]\",\n \"gradient-red\":\n \"border-transparent bg-linear-to-r from-[var(--zui-popover-gradient-red-from,oklch(44.4%_0.177_26.899))] to-[var(--zui-popover-gradient-red-to,oklch(45.9%_0.187_3.815))] text-[color:var(--zui-popover-gradient-red-fg,#ffffff)]\",\n \"gradient-yellow\":\n \"border-transparent bg-linear-to-r from-[var(--zui-popover-gradient-yellow-from,oklch(47.6%_0.114_61.907))] to-[var(--zui-popover-gradient-yellow-to,oklch(47%_0.157_37.304))] text-[color:var(--zui-popover-gradient-yellow-fg,#ffffff)]\",\n \"gradient-purple\":\n \"border-transparent bg-linear-to-r from-[var(--zui-popover-gradient-purple-from,oklch(43.8%_0.218_303.724))] to-[var(--zui-popover-gradient-purple-to,oklch(45.9%_0.187_3.815))] text-[color:var(--zui-popover-gradient-purple-fg,#ffffff)]\",\n \"gradient-teal\":\n \"border-transparent bg-linear-to-r from-[var(--zui-popover-gradient-teal-from,oklch(43.7%_0.078_188.216))] to-[var(--zui-popover-gradient-teal-to,oklch(45%_0.085_224.283))] text-[color:var(--zui-popover-gradient-teal-fg,#ffffff)]\",\n \"gradient-indigo\":\n \"border-transparent bg-linear-to-r from-[var(--zui-popover-gradient-indigo-from,oklch(39.8%_0.195_277.366))] to-[var(--zui-popover-gradient-indigo-to,oklch(43.8%_0.218_303.724))] text-[color:var(--zui-popover-gradient-indigo-fg,#ffffff)]\",\n \"gradient-pink\":\n \"border-transparent bg-linear-to-r from-[var(--zui-popover-gradient-pink-from,oklch(45.9%_0.187_3.815))] to-[var(--zui-popover-gradient-pink-to,oklch(45.5%_0.188_13.697))] text-[color:var(--zui-popover-gradient-pink-fg,#ffffff)]\",\n \"gradient-orange\":\n \"border-transparent bg-linear-to-r from-[var(--zui-popover-gradient-orange-from,oklch(47%_0.157_37.304))] to-[var(--zui-popover-gradient-orange-to,oklch(44.4%_0.177_26.899))] text-[color:var(--zui-popover-gradient-orange-fg,#ffffff)]\",\n} as const;\n\nexport const zuiPopoverContentSizes = {\n sm: \"p-3 text-sm\",\n md: \"p-4 text-sm\",\n lg: \"p-5 text-base\",\n} as const;\n\nexport const zuiPopoverContentWidths = {\n xs: \"min-w-50 md:min-w-xs\",\n sm: \"min-w-50 md:min-w-sm\",\n md: \"min-w-50 md:min-w-md\",\n lg: \"min-w-50 md:min-w-lg\",\n xl: \"min-w-50 md:min-w-xl\",\n \"2xl\": \"min-w-50 md:min-w-2xl\",\n} as const;\n","import { cva } from \"class-variance-authority\";\n\nimport {\n zuiPopoverContentBase,\n zuiPopoverContentSizes,\n zuiPopoverContentVariants,\n zuiPopoverContentWidths,\n} from \"../../design-system/popover\";\n\nexport const popoverContentVariants = cva(zuiPopoverContentBase, {\n variants: {\n variant: zuiPopoverContentVariants,\n size: zuiPopoverContentSizes,\n width: zuiPopoverContentWidths,\n },\n defaultVariants: {\n variant: \"default\",\n size: \"md\",\n width: \"xs\",\n },\n});\n","\"use client\";\n\nimport {\n Children,\n cloneElement,\n createContext,\n isValidElement,\n useCallback,\n useContext,\n useEffect,\n useId,\n useRef,\n useState,\n type RefObject,\n type KeyboardEventHandler,\n type MouseEventHandler,\n type ReactElement,\n type Ref,\n useMemo,\n} from \"react\";\n\nimport { cn } from \"../../lib/utils\";\n\nimport type {\n PopoverAlign,\n PopoverContentProps,\n PopoverContextType,\n PopoverProps,\n PopoverSide,\n PopoverTriggerProps,\n} from \"./types\";\nimport { popoverContentVariants } from \"./variants\";\n\nexport const PopoverContext = createContext<PopoverContextType | null>(null);\n\nexport const usePopover = () => {\n const context = useContext(PopoverContext);\n if (!context) {\n throw new Error(\"Popover components must be used within Popover\");\n }\n return context;\n};\n\nfunction mergeRefs<T>(...refs: Array<Ref<T> | undefined>) {\n return (node: T) => {\n for (const ref of refs) {\n if (typeof ref === \"function\") {\n ref(node);\n } else if (ref) {\n (ref as RefObject<T | null>).current = node;\n }\n }\n };\n}\n\nexport function sideAlignClass(side: PopoverSide, align: PopoverAlign) {\n const sideClasses = {\n top: \"bottom-full mb-2\",\n bottom: \"top-full mt-2\",\n left: \"right-full mr-2\",\n right: \"left-full ml-2\",\n } satisfies Record<PopoverSide, string>;\n\n const verticalAlign = {\n start: \"left-0\",\n center: \"left-1/2 -translate-x-1/2\",\n end: \"right-0\",\n } satisfies Record<PopoverAlign, string>;\n\n const horizontalAlign = {\n start: \"top-0\",\n center: \"top-1/2 -translate-y-1/2\",\n end: \"bottom-0\",\n } satisfies Record<PopoverAlign, string>;\n\n return cn(\n sideClasses[side],\n side === \"top\" || side === \"bottom\"\n ? verticalAlign[align]\n : horizontalAlign[align],\n );\n}\n\nexport const Popover = ({\n children,\n defaultOpen = false,\n open: controlledOpen,\n onOpenChange,\n closeOnEscape = true,\n closeOnOutsideClick = true,\n}: PopoverProps) => {\n const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen);\n const contentId = `${useId()}-popover`;\n const triggerRef = useRef<HTMLElement | null>(null);\n const contentRef = useRef<HTMLDivElement | null>(null);\n\n const isControlled = controlledOpen !== undefined;\n const open = isControlled ? controlledOpen : uncontrolledOpen;\n\n const setOpen = useCallback(\n (value: boolean) => {\n if (!isControlled) {\n setUncontrolledOpen(value);\n }\n onOpenChange?.(value);\n },\n [isControlled, onOpenChange],\n );\n\n const toggleOpen = useCallback(() => setOpen(!open), [open, setOpen]);\n\n useEffect(() => {\n if (!open) {\n return undefined;\n }\n\n const onPointerDown = (event: PointerEvent) => {\n if (!closeOnOutsideClick) {\n return;\n }\n const target = event.target as Node;\n if (\n contentRef.current?.contains(target) ||\n triggerRef.current?.contains(target)\n ) {\n return;\n }\n setOpen(false);\n };\n\n const onKeyDown = (event: KeyboardEvent) => {\n if (event.key === \"Escape\" && closeOnEscape) {\n setOpen(false);\n triggerRef.current?.focus();\n }\n };\n\n document.addEventListener(\"pointerdown\", onPointerDown);\n document.addEventListener(\"keydown\", onKeyDown);\n\n return () => {\n document.removeEventListener(\"pointerdown\", onPointerDown);\n document.removeEventListener(\"keydown\", onKeyDown);\n };\n }, [closeOnEscape, closeOnOutsideClick, open, setOpen]);\n\n const contextValue = useMemo(\n () => ({\n open,\n setOpen,\n toggleOpen,\n contentId,\n triggerRef,\n contentRef,\n }),\n [open, setOpen, toggleOpen, contentId],\n );\n\n return (\n <PopoverContext.Provider\n value={contextValue}\n >\n <div className=\"relative inline-block\">{children}</div>\n </PopoverContext.Provider>\n );\n};\n\nexport const PopoverTrigger = ({\n children,\n className,\n}: PopoverTriggerProps) => {\n const { open, toggleOpen, contentId, triggerRef } = usePopover();\n const childList = Children.toArray(children).filter(\n (node) => node !== null && node !== undefined && typeof node !== \"boolean\",\n );\n\n const soleCandidate =\n childList.length === 1 && isValidElement(childList[0])\n ? (childList[0] as ReactElement<{\n className?: string;\n ref?: Ref<HTMLElement>;\n onClick?: MouseEventHandler;\n onKeyDown?: KeyboardEventHandler;\n \"aria-expanded\"?: boolean;\n \"aria-haspopup\"?: string;\n \"aria-controls\"?: string;\n }>)\n : undefined;\n\n if (soleCandidate) {\n return cloneElement(soleCandidate, {\n ref: mergeRefs(triggerRef, soleCandidate.props.ref),\n onClick: (event) => {\n soleCandidate.props.onClick?.(event);\n if (!event.defaultPrevented) {\n toggleOpen();\n }\n },\n onKeyDown: (event) => {\n soleCandidate.props.onKeyDown?.(event);\n if (event.key === \"Escape\") {\n event.preventDefault();\n }\n },\n className: cn(className, soleCandidate.props.className),\n \"aria-expanded\": open,\n \"aria-haspopup\": \"dialog\",\n \"aria-controls\": open ? contentId : undefined,\n });\n }\n\n return (\n <button\n ref={triggerRef as Ref<HTMLButtonElement>}\n type=\"button\"\n className={className}\n aria-expanded={open}\n aria-haspopup=\"dialog\"\n aria-controls={open ? contentId : undefined}\n onClick={toggleOpen}\n >\n {children}\n </button>\n );\n};\n\nexport const PopoverContent = ({\n children,\n className,\n variant,\n size,\n width,\n side = \"bottom\",\n align = \"center\",\n role = \"dialog\",\n ...props\n}: PopoverContentProps) => {\n const { open, contentId, contentRef } = usePopover();\n\n if (!open) {\n return null;\n }\n\n return (\n <div\n ref={contentRef}\n id={contentId}\n data-open={open}\n role={role}\n tabIndex={-1}\n className={cn(\n popoverContentVariants({ variant, size, width }),\n sideAlignClass(side, align),\n className,\n )}\n {...props}\n >\n {children}\n </div>\n );\n};\n"]}
@@ -0,0 +1,80 @@
1
+ import { cva } from 'class-variance-authority';
2
+
3
+ // src/ui/checkbox/variants.ts
4
+
5
+ // src/design-system/checkbox.ts
6
+ var zuiCheckboxRootBase = "group inline-flex w-fit items-start gap-2.5 text-sm font-medium text-[color:var(--zui-checkbox-label-fg,oklch(20.8%_0.042_265.755))] dark:text-[color:var(--zui-checkbox-label-fg-dark,oklch(98.4%_0.003_247.858))] data-[disabled=true]:cursor-not-allowed data-[disabled=true]:opacity-50";
7
+ var zuiCheckboxControlBase = "grid shrink-0 place-items-center rounded-md border-2 border-[color:var(--zui-checkbox-border,#0000004d)] bg-[var(--zui-checkbox-bg,transparent)] text-[color:var(--zui-checkbox-fg,oklch(44.6%_0.043_257.281))] transition-[background-color,border-color,color,box-shadow] peer-focus-visible:outline-none peer-focus-visible:ring-2 peer-focus-visible:ring-[var(--zui-checkbox-ring-focus,oklch(44.6%_0.043_257.281_/_0.7))] peer-focus-visible:ring-offset-2 peer-focus-visible:ring-offset-[var(--zui-checkbox-ring-offset-focus,oklch(98.4%_0.003_247.858))] dark:border-[color:var(--zui-checkbox-border-dark,#ffffff4d)] dark:text-[color:var(--zui-checkbox-fg-dark,oklch(92.9%_0.013_255.508))] dark:peer-focus-visible:ring-[var(--zui-checkbox-ring-focus-dark,oklch(86.9%_0.022_252.894_/_0.7))] dark:peer-focus-visible:ring-offset-[var(--zui-checkbox-ring-offset-focus-dark,oklch(12.9%_0.042_264.695))] group-data-[disabled=true]:cursor-not-allowed";
8
+ var zuiCheckboxIndicatorBase = "pointer-events-none opacity-0 transition-opacity duration-150 stroke-white group-data-[state=checked]:opacity-100 group-data-[state=indeterminate]:opacity-100";
9
+ var zuiCheckboxSizes = {
10
+ sm: {
11
+ root: "text-xs",
12
+ control: "mt-0.5 size-4 rounded-[0.35rem]",
13
+ indicator: "size-3"
14
+ },
15
+ md: {
16
+ root: "text-sm",
17
+ control: "mt-0.5 size-5",
18
+ indicator: "size-3.5"
19
+ },
20
+ lg: {
21
+ root: "text-base",
22
+ control: "mt-0.5 size-6",
23
+ indicator: "size-4"
24
+ }
25
+ };
26
+ var zuiCheckboxAppearances = {
27
+ default: "group-data-[state=checked]:border-[color:var(--zui-checkbox-default-border-checked,oklch(44.6%_0.043_257.281))] group-data-[state=checked]:bg-[var(--zui-checkbox-default-bg-checked,oklch(44.6%_0.043_257.281))] group-data-[state=checked]:text-[color:var(--zui-checkbox-default-fg-checked,#ffffff)] group-data-[state=indeterminate]:border-[color:var(--zui-checkbox-default-border-checked,oklch(44.6%_0.043_257.281))] group-data-[state=indeterminate]:bg-[var(--zui-checkbox-default-bg-checked,oklch(44.6%_0.043_257.281))] group-data-[state=indeterminate]:text-[color:var(--zui-checkbox-default-fg-checked,#ffffff)]",
28
+ success: "group-data-[state=checked]:border-[color:var(--zui-checkbox-success-border-checked,oklch(59.6%_0.145_163.225))] group-data-[state=checked]:bg-[var(--zui-checkbox-success-bg-checked,oklch(59.6%_0.145_163.225))] group-data-[state=checked]:text-[color:var(--zui-checkbox-success-fg-checked,#ffffff)] group-data-[state=indeterminate]:border-[color:var(--zui-checkbox-success-border-checked,oklch(59.6%_0.145_163.225))] group-data-[state=indeterminate]:bg-[var(--zui-checkbox-success-bg-checked,oklch(59.6%_0.145_163.225))]",
29
+ warning: "group-data-[state=checked]:border-[color:var(--zui-checkbox-warning-border-checked,oklch(68.1%_0.162_75.834))] group-data-[state=checked]:bg-[var(--zui-checkbox-warning-bg-checked,oklch(68.1%_0.162_75.834))] group-data-[state=checked]:text-[color:var(--zui-checkbox-warning-fg-checked,#ffffff)] group-data-[state=indeterminate]:border-[color:var(--zui-checkbox-warning-border-checked,oklch(68.1%_0.162_75.834))] group-data-[state=indeterminate]:bg-[var(--zui-checkbox-warning-bg-checked,oklch(68.1%_0.162_75.834))]",
30
+ error: "group-data-[state=checked]:border-[color:var(--zui-checkbox-error-border-checked,oklch(58.6%_0.253_17.585))] group-data-[state=checked]:bg-[var(--zui-checkbox-error-bg-checked,oklch(58.6%_0.253_17.585))] group-data-[state=checked]:text-[color:var(--zui-checkbox-error-fg-checked,#ffffff)] group-data-[state=indeterminate]:border-[color:var(--zui-checkbox-error-border-checked,oklch(58.6%_0.253_17.585))] group-data-[state=indeterminate]:bg-[var(--zui-checkbox-error-bg-checked,oklch(58.6%_0.253_17.585))]",
31
+ info: "group-data-[state=checked]:border-[color:var(--zui-checkbox-info-border-checked,oklch(54.6%_0.245_262.881))] group-data-[state=checked]:bg-[var(--zui-checkbox-info-bg-checked,oklch(54.6%_0.245_262.881))] group-data-[state=checked]:text-[color:var(--zui-checkbox-info-fg-checked,#ffffff)] group-data-[state=indeterminate]:border-[color:var(--zui-checkbox-info-border-checked,oklch(54.6%_0.245_262.881))] group-data-[state=indeterminate]:bg-[var(--zui-checkbox-info-bg-checked,oklch(54.6%_0.245_262.881))]",
32
+ violet: "group-data-[state=checked]:border-[color:var(--zui-checkbox-violet-border-checked,oklch(54.1%_0.281_293.009))] group-data-[state=checked]:bg-[var(--zui-checkbox-violet-bg-checked,oklch(54.1%_0.281_293.009))] group-data-[state=checked]:text-[color:var(--zui-checkbox-violet-fg-checked,#ffffff)] group-data-[state=indeterminate]:border-[color:var(--zui-checkbox-violet-border-checked,oklch(54.1%_0.281_293.009))] group-data-[state=indeterminate]:bg-[var(--zui-checkbox-violet-bg-checked,oklch(54.1%_0.281_293.009))]",
33
+ amber: "group-data-[state=checked]:border-[color:var(--zui-checkbox-amber-border-checked,oklch(66.6%_0.179_58.318))] group-data-[state=checked]:bg-[var(--zui-checkbox-amber-bg-checked,oklch(66.6%_0.179_58.318))] group-data-[state=checked]:text-[color:var(--zui-checkbox-amber-fg-checked,#ffffff)] group-data-[state=indeterminate]:border-[color:var(--zui-checkbox-amber-border-checked,oklch(66.6%_0.179_58.318))] group-data-[state=indeterminate]:bg-[var(--zui-checkbox-amber-bg-checked,oklch(66.6%_0.179_58.318))]",
34
+ pink: "group-data-[state=checked]:border-[color:var(--zui-checkbox-pink-border-checked,oklch(59.2%_0.249_0.584))] group-data-[state=checked]:bg-[var(--zui-checkbox-pink-bg-checked,oklch(59.2%_0.249_0.584))] group-data-[state=checked]:text-[color:var(--zui-checkbox-pink-fg-checked,#ffffff)] group-data-[state=indeterminate]:border-[color:var(--zui-checkbox-pink-border-checked,oklch(59.2%_0.249_0.584))] group-data-[state=indeterminate]:bg-[var(--zui-checkbox-pink-bg-checked,oklch(59.2%_0.249_0.584))]",
35
+ indigo: "group-data-[state=checked]:border-[color:var(--zui-checkbox-indigo-border-checked,oklch(51.1%_0.262_276.966))] group-data-[state=checked]:bg-[var(--zui-checkbox-indigo-bg-checked,oklch(51.1%_0.262_276.966))] group-data-[state=checked]:text-[color:var(--zui-checkbox-indigo-fg-checked,#ffffff)] group-data-[state=indeterminate]:border-[color:var(--zui-checkbox-indigo-border-checked,oklch(51.1%_0.262_276.966))] group-data-[state=indeterminate]:bg-[var(--zui-checkbox-indigo-bg-checked,oklch(51.1%_0.262_276.966))]"
36
+ };
37
+
38
+ // src/ui/checkbox/variants.ts
39
+ var checkboxRootVariants = cva(zuiCheckboxRootBase, {
40
+ variants: {
41
+ size: {
42
+ sm: zuiCheckboxSizes.sm.root,
43
+ md: zuiCheckboxSizes.md.root,
44
+ lg: zuiCheckboxSizes.lg.root
45
+ }
46
+ },
47
+ defaultVariants: {
48
+ size: "md"
49
+ }
50
+ });
51
+ var checkboxControlVariants = cva(zuiCheckboxControlBase, {
52
+ variants: {
53
+ appearance: zuiCheckboxAppearances,
54
+ size: {
55
+ sm: zuiCheckboxSizes.sm.control,
56
+ md: zuiCheckboxSizes.md.control,
57
+ lg: zuiCheckboxSizes.lg.control
58
+ }
59
+ },
60
+ defaultVariants: {
61
+ appearance: "default",
62
+ size: "md"
63
+ }
64
+ });
65
+ var checkboxIndicatorVariants = cva(zuiCheckboxIndicatorBase, {
66
+ variants: {
67
+ size: {
68
+ sm: zuiCheckboxSizes.sm.indicator,
69
+ md: zuiCheckboxSizes.md.indicator,
70
+ lg: zuiCheckboxSizes.lg.indicator
71
+ }
72
+ },
73
+ defaultVariants: {
74
+ size: "md"
75
+ }
76
+ });
77
+
78
+ export { checkboxControlVariants, checkboxIndicatorVariants, checkboxRootVariants };
79
+ //# sourceMappingURL=chunk-K6IZANTI.mjs.map
80
+ //# sourceMappingURL=chunk-K6IZANTI.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/design-system/checkbox.ts","../src/ui/checkbox/variants.ts"],"names":[],"mappings":";;;;;AAAO,IAAM,mBAAA,GACX,6RAAA;AAEK,IAAM,sBAAA,GACX,y6BAAA;AAEK,IAAM,wBAAA,GACX,gKAAA;AAEK,IAAM,gBAAA,GAAmB;AAAA,EAC9B,EAAA,EAAI;AAAA,IACF,IAAA,EAAM,SAAA;AAAA,IACN,OAAA,EAAS,iCAAA;AAAA,IACT,SAAA,EAAW;AAAA,GACb;AAAA,EACA,EAAA,EAAI;AAAA,IACF,IAAA,EAAM,SAAA;AAAA,IACN,OAAA,EAAS,eAAA;AAAA,IACT,SAAA,EAAW;AAAA,GACb;AAAA,EACA,EAAA,EAAI;AAAA,IACF,IAAA,EAAM,WAAA;AAAA,IACN,OAAA,EAAS,eAAA;AAAA,IACT,SAAA,EAAW;AAAA;AAEf,CAAA;AAEO,IAAM,sBAAA,GAAyB;AAAA,EACpC,OAAA,EACE,qmBAAA;AAAA,EACF,OAAA,EACE,wgBAAA;AAAA,EACF,OAAA,EACE,ogBAAA;AAAA,EACF,KAAA,EACE,0fAAA;AAAA,EACF,IAAA,EACE,yfAAA;AAAA,EACF,MAAA,EACE,mgBAAA;AAAA,EACF,KAAA,EACE,0fAAA;AAAA,EACF,IAAA,EACE,ifAAA;AAAA,EACF,MAAA,EACE;AACJ,CAAA;;;ACpCO,IAAM,oBAAA,GAAuB,IAAI,mBAAA,EAAqB;AAAA,EAC3D,QAAA,EAAU;AAAA,IACR,IAAA,EAAM;AAAA,MACJ,EAAA,EAAI,iBAAiB,EAAA,CAAG,IAAA;AAAA,MACxB,EAAA,EAAI,iBAAiB,EAAA,CAAG,IAAA;AAAA,MACxB,EAAA,EAAI,iBAAiB,EAAA,CAAG;AAAA;AAC1B,GACF;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,IAAA,EAAM;AAAA;AAEV,CAAC;AAEM,IAAM,uBAAA,GAA0B,IAAI,sBAAA,EAAwB;AAAA,EACjE,QAAA,EAAU;AAAA,IACR,UAAA,EAAY,sBAAA;AAAA,IACZ,IAAA,EAAM;AAAA,MACJ,EAAA,EAAI,iBAAiB,EAAA,CAAG,OAAA;AAAA,MACxB,EAAA,EAAI,iBAAiB,EAAA,CAAG,OAAA;AAAA,MACxB,EAAA,EAAI,iBAAiB,EAAA,CAAG;AAAA;AAC1B,GACF;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,UAAA,EAAY,SAAA;AAAA,IACZ,IAAA,EAAM;AAAA;AAEV,CAAC;AAEM,IAAM,yBAAA,GAA4B,IAAI,wBAAA,EAA0B;AAAA,EACrE,QAAA,EAAU;AAAA,IACR,IAAA,EAAM;AAAA,MACJ,EAAA,EAAI,iBAAiB,EAAA,CAAG,SAAA;AAAA,MACxB,EAAA,EAAI,iBAAiB,EAAA,CAAG,SAAA;AAAA,MACxB,EAAA,EAAI,iBAAiB,EAAA,CAAG;AAAA;AAC1B,GACF;AAAA,EACA,eAAA,EAAiB;AAAA,IACf,IAAA,EAAM;AAAA;AAEV,CAAC","file":"chunk-K6IZANTI.mjs","sourcesContent":["export const zuiCheckboxRootBase =\n \"group inline-flex w-fit items-start gap-2.5 text-sm font-medium text-[color:var(--zui-checkbox-label-fg,oklch(20.8%_0.042_265.755))] dark:text-[color:var(--zui-checkbox-label-fg-dark,oklch(98.4%_0.003_247.858))] data-[disabled=true]:cursor-not-allowed data-[disabled=true]:opacity-50\";\n\nexport const zuiCheckboxControlBase =\n \"grid shrink-0 place-items-center rounded-md border-2 border-[color:var(--zui-checkbox-border,#0000004d)] bg-[var(--zui-checkbox-bg,transparent)] text-[color:var(--zui-checkbox-fg,oklch(44.6%_0.043_257.281))] transition-[background-color,border-color,color,box-shadow] peer-focus-visible:outline-none peer-focus-visible:ring-2 peer-focus-visible:ring-[var(--zui-checkbox-ring-focus,oklch(44.6%_0.043_257.281_/_0.7))] peer-focus-visible:ring-offset-2 peer-focus-visible:ring-offset-[var(--zui-checkbox-ring-offset-focus,oklch(98.4%_0.003_247.858))] dark:border-[color:var(--zui-checkbox-border-dark,#ffffff4d)] dark:text-[color:var(--zui-checkbox-fg-dark,oklch(92.9%_0.013_255.508))] dark:peer-focus-visible:ring-[var(--zui-checkbox-ring-focus-dark,oklch(86.9%_0.022_252.894_/_0.7))] dark:peer-focus-visible:ring-offset-[var(--zui-checkbox-ring-offset-focus-dark,oklch(12.9%_0.042_264.695))] group-data-[disabled=true]:cursor-not-allowed\";\n\nexport const zuiCheckboxIndicatorBase =\n \"pointer-events-none opacity-0 transition-opacity duration-150 stroke-white group-data-[state=checked]:opacity-100 group-data-[state=indeterminate]:opacity-100\";\n\nexport const zuiCheckboxSizes = {\n sm: {\n root: \"text-xs\",\n control: \"mt-0.5 size-4 rounded-[0.35rem]\",\n indicator: \"size-3\",\n },\n md: {\n root: \"text-sm\",\n control: \"mt-0.5 size-5\",\n indicator: \"size-3.5\",\n },\n lg: {\n root: \"text-base\",\n control: \"mt-0.5 size-6\",\n indicator: \"size-4\",\n },\n} as const;\n\nexport const zuiCheckboxAppearances = {\n default:\n \"group-data-[state=checked]:border-[color:var(--zui-checkbox-default-border-checked,oklch(44.6%_0.043_257.281))] group-data-[state=checked]:bg-[var(--zui-checkbox-default-bg-checked,oklch(44.6%_0.043_257.281))] group-data-[state=checked]:text-[color:var(--zui-checkbox-default-fg-checked,#ffffff)] group-data-[state=indeterminate]:border-[color:var(--zui-checkbox-default-border-checked,oklch(44.6%_0.043_257.281))] group-data-[state=indeterminate]:bg-[var(--zui-checkbox-default-bg-checked,oklch(44.6%_0.043_257.281))] group-data-[state=indeterminate]:text-[color:var(--zui-checkbox-default-fg-checked,#ffffff)]\",\n success:\n \"group-data-[state=checked]:border-[color:var(--zui-checkbox-success-border-checked,oklch(59.6%_0.145_163.225))] group-data-[state=checked]:bg-[var(--zui-checkbox-success-bg-checked,oklch(59.6%_0.145_163.225))] group-data-[state=checked]:text-[color:var(--zui-checkbox-success-fg-checked,#ffffff)] group-data-[state=indeterminate]:border-[color:var(--zui-checkbox-success-border-checked,oklch(59.6%_0.145_163.225))] group-data-[state=indeterminate]:bg-[var(--zui-checkbox-success-bg-checked,oklch(59.6%_0.145_163.225))]\",\n warning:\n \"group-data-[state=checked]:border-[color:var(--zui-checkbox-warning-border-checked,oklch(68.1%_0.162_75.834))] group-data-[state=checked]:bg-[var(--zui-checkbox-warning-bg-checked,oklch(68.1%_0.162_75.834))] group-data-[state=checked]:text-[color:var(--zui-checkbox-warning-fg-checked,#ffffff)] group-data-[state=indeterminate]:border-[color:var(--zui-checkbox-warning-border-checked,oklch(68.1%_0.162_75.834))] group-data-[state=indeterminate]:bg-[var(--zui-checkbox-warning-bg-checked,oklch(68.1%_0.162_75.834))]\",\n error:\n \"group-data-[state=checked]:border-[color:var(--zui-checkbox-error-border-checked,oklch(58.6%_0.253_17.585))] group-data-[state=checked]:bg-[var(--zui-checkbox-error-bg-checked,oklch(58.6%_0.253_17.585))] group-data-[state=checked]:text-[color:var(--zui-checkbox-error-fg-checked,#ffffff)] group-data-[state=indeterminate]:border-[color:var(--zui-checkbox-error-border-checked,oklch(58.6%_0.253_17.585))] group-data-[state=indeterminate]:bg-[var(--zui-checkbox-error-bg-checked,oklch(58.6%_0.253_17.585))]\",\n info:\n \"group-data-[state=checked]:border-[color:var(--zui-checkbox-info-border-checked,oklch(54.6%_0.245_262.881))] group-data-[state=checked]:bg-[var(--zui-checkbox-info-bg-checked,oklch(54.6%_0.245_262.881))] group-data-[state=checked]:text-[color:var(--zui-checkbox-info-fg-checked,#ffffff)] group-data-[state=indeterminate]:border-[color:var(--zui-checkbox-info-border-checked,oklch(54.6%_0.245_262.881))] group-data-[state=indeterminate]:bg-[var(--zui-checkbox-info-bg-checked,oklch(54.6%_0.245_262.881))]\",\n violet:\n \"group-data-[state=checked]:border-[color:var(--zui-checkbox-violet-border-checked,oklch(54.1%_0.281_293.009))] group-data-[state=checked]:bg-[var(--zui-checkbox-violet-bg-checked,oklch(54.1%_0.281_293.009))] group-data-[state=checked]:text-[color:var(--zui-checkbox-violet-fg-checked,#ffffff)] group-data-[state=indeterminate]:border-[color:var(--zui-checkbox-violet-border-checked,oklch(54.1%_0.281_293.009))] group-data-[state=indeterminate]:bg-[var(--zui-checkbox-violet-bg-checked,oklch(54.1%_0.281_293.009))]\",\n amber:\n \"group-data-[state=checked]:border-[color:var(--zui-checkbox-amber-border-checked,oklch(66.6%_0.179_58.318))] group-data-[state=checked]:bg-[var(--zui-checkbox-amber-bg-checked,oklch(66.6%_0.179_58.318))] group-data-[state=checked]:text-[color:var(--zui-checkbox-amber-fg-checked,#ffffff)] group-data-[state=indeterminate]:border-[color:var(--zui-checkbox-amber-border-checked,oklch(66.6%_0.179_58.318))] group-data-[state=indeterminate]:bg-[var(--zui-checkbox-amber-bg-checked,oklch(66.6%_0.179_58.318))]\",\n pink:\n \"group-data-[state=checked]:border-[color:var(--zui-checkbox-pink-border-checked,oklch(59.2%_0.249_0.584))] group-data-[state=checked]:bg-[var(--zui-checkbox-pink-bg-checked,oklch(59.2%_0.249_0.584))] group-data-[state=checked]:text-[color:var(--zui-checkbox-pink-fg-checked,#ffffff)] group-data-[state=indeterminate]:border-[color:var(--zui-checkbox-pink-border-checked,oklch(59.2%_0.249_0.584))] group-data-[state=indeterminate]:bg-[var(--zui-checkbox-pink-bg-checked,oklch(59.2%_0.249_0.584))]\",\n indigo:\n \"group-data-[state=checked]:border-[color:var(--zui-checkbox-indigo-border-checked,oklch(51.1%_0.262_276.966))] group-data-[state=checked]:bg-[var(--zui-checkbox-indigo-bg-checked,oklch(51.1%_0.262_276.966))] group-data-[state=checked]:text-[color:var(--zui-checkbox-indigo-fg-checked,#ffffff)] group-data-[state=indeterminate]:border-[color:var(--zui-checkbox-indigo-border-checked,oklch(51.1%_0.262_276.966))] group-data-[state=indeterminate]:bg-[var(--zui-checkbox-indigo-bg-checked,oklch(51.1%_0.262_276.966))]\",\n} as const;\n","import { cva } from \"class-variance-authority\";\n\nimport {\n zuiCheckboxAppearances,\n zuiCheckboxControlBase,\n zuiCheckboxIndicatorBase,\n zuiCheckboxRootBase,\n zuiCheckboxSizes,\n} from \"../../design-system/checkbox\";\n\nexport const checkboxRootVariants = cva(zuiCheckboxRootBase, {\n variants: {\n size: {\n sm: zuiCheckboxSizes.sm.root,\n md: zuiCheckboxSizes.md.root,\n lg: zuiCheckboxSizes.lg.root,\n },\n },\n defaultVariants: {\n size: \"md\",\n },\n});\n\nexport const checkboxControlVariants = cva(zuiCheckboxControlBase, {\n variants: {\n appearance: zuiCheckboxAppearances,\n size: {\n sm: zuiCheckboxSizes.sm.control,\n md: zuiCheckboxSizes.md.control,\n lg: zuiCheckboxSizes.lg.control,\n },\n },\n defaultVariants: {\n appearance: \"default\",\n size: \"md\",\n },\n});\n\nexport const checkboxIndicatorVariants = cva(zuiCheckboxIndicatorBase, {\n variants: {\n size: {\n sm: zuiCheckboxSizes.sm.indicator,\n md: zuiCheckboxSizes.md.indicator,\n lg: zuiCheckboxSizes.lg.indicator,\n },\n },\n defaultVariants: {\n size: \"md\",\n },\n});\n"]}