xiod-ui 1.0.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 (224) hide show
  1. package/LICENSE +73 -0
  2. package/README.md +167 -0
  3. package/dist/components/accordion.d.ts +9 -0
  4. package/dist/components/accordion.js +46 -0
  5. package/dist/components/agent-steps.d.ts +47 -0
  6. package/dist/components/agent-steps.js +223 -0
  7. package/dist/components/alert-dialog.d.ts +21 -0
  8. package/dist/components/alert-dialog.js +74 -0
  9. package/dist/components/alert.d.ts +12 -0
  10. package/dist/components/alert.js +45 -0
  11. package/dist/components/aspect-ratio.d.ts +9 -0
  12. package/dist/components/aspect-ratio.js +22 -0
  13. package/dist/components/autocomplete.d.ts +35 -0
  14. package/dist/components/autocomplete.js +160 -0
  15. package/dist/components/avatar.d.ts +17 -0
  16. package/dist/components/avatar.js +65 -0
  17. package/dist/components/badge.d.ts +15 -0
  18. package/dist/components/badge.js +46 -0
  19. package/dist/components/breadcrumb.d.ts +12 -0
  20. package/dist/components/breadcrumb.js +75 -0
  21. package/dist/components/button-group.d.ts +14 -0
  22. package/dist/components/button-group.js +45 -0
  23. package/dist/components/button-split.d.ts +19 -0
  24. package/dist/components/button-split.js +73 -0
  25. package/dist/components/button.d.ts +15 -0
  26. package/dist/components/button.js +54 -0
  27. package/dist/components/calendar.d.ts +63 -0
  28. package/dist/components/calendar.js +425 -0
  29. package/dist/components/card.d.ts +17 -0
  30. package/dist/components/card.js +139 -0
  31. package/dist/components/carousel.d.ts +59 -0
  32. package/dist/components/carousel.js +503 -0
  33. package/dist/components/checkbox.d.ts +16 -0
  34. package/dist/components/checkbox.js +86 -0
  35. package/dist/components/circular-progress.d.ts +28 -0
  36. package/dist/components/circular-progress.js +127 -0
  37. package/dist/components/collapsible.d.ts +8 -0
  38. package/dist/components/collapsible.js +27 -0
  39. package/dist/components/color-picker.d.ts +159 -0
  40. package/dist/components/color-picker.js +1589 -0
  41. package/dist/components/combobox.d.ts +46 -0
  42. package/dist/components/combobox.js +237 -0
  43. package/dist/components/command.d.ts +22 -0
  44. package/dist/components/command.js +129 -0
  45. package/dist/components/context-menu.d.ts +38 -0
  46. package/dist/components/context-menu.js +164 -0
  47. package/dist/components/copy-to-clipboard.d.ts +32 -0
  48. package/dist/components/copy-to-clipboard.js +83 -0
  49. package/dist/components/corner-badge.d.ts +22 -0
  50. package/dist/components/corner-badge.js +84 -0
  51. package/dist/components/dashboard-grid.d.ts +83 -0
  52. package/dist/components/dashboard-grid.js +486 -0
  53. package/dist/components/date-picker.d.ts +29 -0
  54. package/dist/components/date-picker.js +261 -0
  55. package/dist/components/dialog.d.ts +26 -0
  56. package/dist/components/dialog.js +97 -0
  57. package/dist/components/dot-matrix.d.ts +32 -0
  58. package/dist/components/dot-matrix.js +707 -0
  59. package/dist/components/draggable.d.ts +42 -0
  60. package/dist/components/draggable.js +346 -0
  61. package/dist/components/drawer.d.ts +66 -0
  62. package/dist/components/drawer.js +304 -0
  63. package/dist/components/empty.d.ts +14 -0
  64. package/dist/components/empty.js +75 -0
  65. package/dist/components/field.d.ts +12 -0
  66. package/dist/components/field.js +44 -0
  67. package/dist/components/fieldset.d.ts +7 -0
  68. package/dist/components/fieldset.js +21 -0
  69. package/dist/components/file-upload.d.ts +61 -0
  70. package/dist/components/file-upload.js +482 -0
  71. package/dist/components/form.d.ts +6 -0
  72. package/dist/components/form.js +14 -0
  73. package/dist/components/frame.d.ts +10 -0
  74. package/dist/components/frame.js +47 -0
  75. package/dist/components/gauge.d.ts +27 -0
  76. package/dist/components/gauge.js +74 -0
  77. package/dist/components/grid.d.ts +26 -0
  78. package/dist/components/grid.js +204 -0
  79. package/dist/components/group.d.ts +19 -0
  80. package/dist/components/group.js +45 -0
  81. package/dist/components/input-group.d.ts +15 -0
  82. package/dist/components/input-group.js +61 -0
  83. package/dist/components/input-otp.d.ts +24 -0
  84. package/dist/components/input-otp.js +50 -0
  85. package/dist/components/input-payment.d.ts +131 -0
  86. package/dist/components/input-payment.js +1140 -0
  87. package/dist/components/input-phone.d.ts +70 -0
  88. package/dist/components/input-phone.js +657 -0
  89. package/dist/components/input-sensitive.d.ts +12 -0
  90. package/dist/components/input-sensitive.js +169 -0
  91. package/dist/components/input.d.ts +13 -0
  92. package/dist/components/input.js +26 -0
  93. package/dist/components/kbd.d.ts +6 -0
  94. package/dist/components/kbd.js +19 -0
  95. package/dist/components/kinetic-click.d.ts +48 -0
  96. package/dist/components/kinetic-click.js +1184 -0
  97. package/dist/components/label.d.ts +6 -0
  98. package/dist/components/label.js +18 -0
  99. package/dist/components/list-box.d.ts +20 -0
  100. package/dist/components/list-box.js +148 -0
  101. package/dist/components/loader.d.ts +13 -0
  102. package/dist/components/loader.js +430 -0
  103. package/dist/components/marker.d.ts +15 -0
  104. package/dist/components/marker.js +59 -0
  105. package/dist/components/menu.d.ts +42 -0
  106. package/dist/components/menu.js +186 -0
  107. package/dist/components/menubar.d.ts +40 -0
  108. package/dist/components/menubar.js +107 -0
  109. package/dist/components/message.d.ts +33 -0
  110. package/dist/components/message.js +112 -0
  111. package/dist/components/meter.d.ts +10 -0
  112. package/dist/components/meter.js +42 -0
  113. package/dist/components/morphic-toast.d.ts +61 -0
  114. package/dist/components/morphic-toast.js +916 -0
  115. package/dist/components/navigation-menu.d.ts +26 -0
  116. package/dist/components/navigation-menu.js +116 -0
  117. package/dist/components/number-field.d.ts +15 -0
  118. package/dist/components/number-field.js +86 -0
  119. package/dist/components/option-picker.d.ts +18 -0
  120. package/dist/components/option-picker.js +89 -0
  121. package/dist/components/orb.d.ts +38 -0
  122. package/dist/components/orb.js +1413 -0
  123. package/dist/components/pagination.d.ts +25 -0
  124. package/dist/components/pagination.js +147 -0
  125. package/dist/components/popover.d.ts +22 -0
  126. package/dist/components/popover.js +79 -0
  127. package/dist/components/preview-card.d.ts +16 -0
  128. package/dist/components/preview-card.js +60 -0
  129. package/dist/components/progress.d.ts +21 -0
  130. package/dist/components/progress.js +139 -0
  131. package/dist/components/radio.d.ts +16 -0
  132. package/dist/components/radio.js +68 -0
  133. package/dist/components/resizable.d.ts +58 -0
  134. package/dist/components/resizable.js +964 -0
  135. package/dist/components/ruler-picker.d.ts +27 -0
  136. package/dist/components/ruler-picker.js +253 -0
  137. package/dist/components/scroll-area.d.ts +13 -0
  138. package/dist/components/scroll-area.js +34 -0
  139. package/dist/components/scroll-bar.d.ts +13 -0
  140. package/dist/components/scroll-bar.js +47 -0
  141. package/dist/components/select.d.ts +29 -0
  142. package/dist/components/select.js +140 -0
  143. package/dist/components/separator.d.ts +6 -0
  144. package/dist/components/separator.js +15 -0
  145. package/dist/components/sidebar.d.ts +65 -0
  146. package/dist/components/sidebar.js +408 -0
  147. package/dist/components/skeleton.d.ts +5 -0
  148. package/dist/components/skeleton.js +12 -0
  149. package/dist/components/slider.d.ts +12 -0
  150. package/dist/components/slider.js +96 -0
  151. package/dist/components/sortable.d.ts +44 -0
  152. package/dist/components/sortable.js +327 -0
  153. package/dist/components/switch.d.ts +15 -0
  154. package/dist/components/switch.js +63 -0
  155. package/dist/components/table.d.ts +12 -0
  156. package/dist/components/table.js +65 -0
  157. package/dist/components/tabs.d.ts +12 -0
  158. package/dist/components/tabs.js +39 -0
  159. package/dist/components/text.d.ts +14 -0
  160. package/dist/components/text.js +69 -0
  161. package/dist/components/textarea.d.ts +9 -0
  162. package/dist/components/textarea.js +20 -0
  163. package/dist/components/theme-provider.d.ts +52 -0
  164. package/dist/components/theme-provider.js +148 -0
  165. package/dist/components/timeline.d.ts +34 -0
  166. package/dist/components/timeline.js +147 -0
  167. package/dist/components/toast.d.ts +17 -0
  168. package/dist/components/toast.js +161 -0
  169. package/dist/components/toggle-group.d.ts +14 -0
  170. package/dist/components/toggle-group.js +53 -0
  171. package/dist/components/toggle.d.ts +11 -0
  172. package/dist/components/toggle.js +36 -0
  173. package/dist/components/toolbar.d.ts +11 -0
  174. package/dist/components/toolbar.js +49 -0
  175. package/dist/components/tooltip.d.ts +17 -0
  176. package/dist/components/tooltip.js +56 -0
  177. package/dist/components/waveform.d.ts +61 -0
  178. package/dist/components/waveform.js +500 -0
  179. package/dist/components/wheel-picker.d.ts +44 -0
  180. package/dist/components/wheel-picker.js +771 -0
  181. package/dist/hooks/use-copy-to-clipboard.d.ts +9 -0
  182. package/dist/hooks/use-copy-to-clipboard.js +36 -0
  183. package/dist/hooks/use-media-query.d.ts +21 -0
  184. package/dist/hooks/use-media-query.js +58 -0
  185. package/dist/styles.css +202 -0
  186. package/dist/themes/afterglow.css +89 -0
  187. package/dist/themes/afterglow.scoped.css +90 -0
  188. package/dist/themes/blacklight.css +89 -0
  189. package/dist/themes/blacklight.scoped.css +90 -0
  190. package/dist/themes/cathode.css +89 -0
  191. package/dist/themes/cathode.scoped.css +90 -0
  192. package/dist/themes/cel.css +89 -0
  193. package/dist/themes/cel.scoped.css +90 -0
  194. package/dist/themes/cinder.css +89 -0
  195. package/dist/themes/cinder.scoped.css +90 -0
  196. package/dist/themes/clay.css +89 -0
  197. package/dist/themes/clay.scoped.css +90 -0
  198. package/dist/themes/cobalt.css +89 -0
  199. package/dist/themes/cobalt.scoped.css +90 -0
  200. package/dist/themes/crimson.css +89 -0
  201. package/dist/themes/crimson.scoped.css +90 -0
  202. package/dist/themes/ion.css +89 -0
  203. package/dist/themes/ion.scoped.css +90 -0
  204. package/dist/themes/iris.css +89 -0
  205. package/dist/themes/iris.scoped.css +90 -0
  206. package/dist/themes/lagoon.css +89 -0
  207. package/dist/themes/lagoon.scoped.css +90 -0
  208. package/dist/themes/mochi.css +89 -0
  209. package/dist/themes/mochi.scoped.css +90 -0
  210. package/dist/themes/riso.css +89 -0
  211. package/dist/themes/riso.scoped.css +90 -0
  212. package/dist/themes/roast.css +89 -0
  213. package/dist/themes/roast.scoped.css +90 -0
  214. package/dist/themes/sage.css +89 -0
  215. package/dist/themes/sage.scoped.css +90 -0
  216. package/dist/themes/sepia.css +89 -0
  217. package/dist/themes/sepia.scoped.css +90 -0
  218. package/dist/themes/sorbet.css +89 -0
  219. package/dist/themes/sorbet.scoped.css +90 -0
  220. package/dist/themes/taffy.css +89 -0
  221. package/dist/themes/taffy.scoped.css +90 -0
  222. package/dist/themes/toxin.css +89 -0
  223. package/dist/themes/toxin.scoped.css +90 -0
  224. package/package.json +140 -0
package/dist/themes/sorbet.css ADDED
@@ -0,0 +1,89 @@
1
+ /**
2
+ * Sorbet — Rose, sky and citrus.
3
+ *
4
+ * GENERATED by scripts/build-themes.ts from scripts/palettes.ts.
5
+ * Do not edit; your changes will be overwritten on the next build.
6
+ *
7
+ * Usage:
8
+ *
9
+ * @import "tailwindcss";
10
+ * @import "xiod-ui/styles";
11
+ * @import "xiod-ui/themes/sorbet";
12
+ *
13
+ * Overrides the base tokens directly, so no attribute on `<html>` is needed.
14
+ * Your own `:root` block placed after this import still wins — same
15
+ * specificity, later in source order.
16
+ */
17
+
18
+ :root {
19
+ --radius: 0.5rem;
20
+ --background: #fdfbfd;
21
+ --foreground: #2b2430;
22
+ --card: #ffffff;
23
+ --card-foreground: #2b2430;
24
+ --popover: #ffffff;
25
+ --popover-foreground: #2b2430;
26
+ --primary: #c2306b;
27
+ --primary-foreground: #ffffff;
28
+ --secondary: #cfe7f5;
29
+ --secondary-foreground: #1f3d4e;
30
+ --muted: #f1eef4;
31
+ --muted-foreground: #665c6e;
32
+ --accent: #f7e6b0;
33
+ --accent-foreground: #4a3d16;
34
+ --destructive: #c22f3a;
35
+ --destructive-foreground: #98232c;
36
+ --info: #26688f;
37
+ --info-foreground: #1a4c69;
38
+ --success: #3f7a52;
39
+ --success-foreground: #2e5a3c;
40
+ --warning: #a36a12;
41
+ --warning-foreground: #82540e;
42
+ --border: #e7e1ea;
43
+ --input: #d6cede;
44
+ --ring: #c2306b;
45
+ --sidebar: #faf6fb;
46
+ --sidebar-foreground: #4e4456;
47
+ --sidebar-primary: #c2306b;
48
+ --sidebar-primary-foreground: #ffffff;
49
+ --sidebar-accent: #f2e8f5;
50
+ --sidebar-accent-foreground: #2b2430;
51
+ --sidebar-border: #ebe4ee;
52
+ --sidebar-ring: #c2306b;
53
+ }
54
+
55
+ .dark {
56
+ --background: #1a151f;
57
+ --foreground: #f0eaf3;
58
+ --card: #221c28;
59
+ --card-foreground: #f0eaf3;
60
+ --popover: #221c28;
61
+ --popover-foreground: #f0eaf3;
62
+ --primary: #f07fae;
63
+ --primary-foreground: #2a0f1c;
64
+ --secondary: #2a3f4d;
65
+ --secondary-foreground: #cfe7f5;
66
+ --muted: #251f2b;
67
+ --muted-foreground: #a89bb0;
68
+ --accent: #4a4326;
69
+ --accent-foreground: #f7e6b0;
70
+ --destructive: #c9432f;
71
+ --destructive-foreground: #f2a294;
72
+ --info: #74b0d8;
73
+ --info-foreground: #a0cbe6;
74
+ --success: #7fb184;
75
+ --success-foreground: #a6ccaa;
76
+ --warning: #d3a24f;
77
+ --warning-foreground: #e7c68d;
78
+ --border: #2f2836;
79
+ --input: #3c3344;
80
+ --ring: #f07fae;
81
+ --sidebar: #150f19;
82
+ --sidebar-foreground: #bdb2c4;
83
+ --sidebar-primary: #f07fae;
84
+ --sidebar-primary-foreground: #2a0f1c;
85
+ --sidebar-accent: #241d2a;
86
+ --sidebar-accent-foreground: #f0eaf3;
87
+ --sidebar-border: #2a2330;
88
+ --sidebar-ring: #f07fae;
89
+ }
package/dist/themes/sorbet.scoped.css ADDED
@@ -0,0 +1,90 @@
1
+ /**
2
+ * Sorbet — Rose, sky and citrus.
3
+ *
4
+ * GENERATED by scripts/build-themes.ts from scripts/palettes.ts.
5
+ * Do not edit; your changes will be overwritten on the next build.
6
+ *
7
+ * Usage:
8
+ *
9
+ * @import "tailwindcss";
10
+ * @import "xiod-ui/styles";
11
+ * @import "xiod-ui/themes/sorbet/scoped";
12
+ *
13
+ * Applies only where `data-palette="sorbet"` is set. Use this form when your
14
+ * app switches palettes at runtime — pass `defaultPalette` to ThemeProvider
15
+ * and call `setPalette("sorbet")` from `useTheme()`. For a single fixed
16
+ * palette import "xiod-ui/themes/sorbet" instead, which needs no attribute.
17
+ */
18
+
19
+ [data-palette="sorbet"] {
20
+ --radius: 0.5rem;
21
+ --background: #fdfbfd;
22
+ --foreground: #2b2430;
23
+ --card: #ffffff;
24
+ --card-foreground: #2b2430;
25
+ --popover: #ffffff;
26
+ --popover-foreground: #2b2430;
27
+ --primary: #c2306b;
28
+ --primary-foreground: #ffffff;
29
+ --secondary: #cfe7f5;
30
+ --secondary-foreground: #1f3d4e;
31
+ --muted: #f1eef4;
32
+ --muted-foreground: #665c6e;
33
+ --accent: #f7e6b0;
34
+ --accent-foreground: #4a3d16;
35
+ --destructive: #c22f3a;
36
+ --destructive-foreground: #98232c;
37
+ --info: #26688f;
38
+ --info-foreground: #1a4c69;
39
+ --success: #3f7a52;
40
+ --success-foreground: #2e5a3c;
41
+ --warning: #a36a12;
42
+ --warning-foreground: #82540e;
43
+ --border: #e7e1ea;
44
+ --input: #d6cede;
45
+ --ring: #c2306b;
46
+ --sidebar: #faf6fb;
47
+ --sidebar-foreground: #4e4456;
48
+ --sidebar-primary: #c2306b;
49
+ --sidebar-primary-foreground: #ffffff;
50
+ --sidebar-accent: #f2e8f5;
51
+ --sidebar-accent-foreground: #2b2430;
52
+ --sidebar-border: #ebe4ee;
53
+ --sidebar-ring: #c2306b;
54
+ }
55
+
56
+ .dark[data-palette="sorbet"] {
57
+ --background: #1a151f;
58
+ --foreground: #f0eaf3;
59
+ --card: #221c28;
60
+ --card-foreground: #f0eaf3;
61
+ --popover: #221c28;
62
+ --popover-foreground: #f0eaf3;
63
+ --primary: #f07fae;
64
+ --primary-foreground: #2a0f1c;
65
+ --secondary: #2a3f4d;
66
+ --secondary-foreground: #cfe7f5;
67
+ --muted: #251f2b;
68
+ --muted-foreground: #a89bb0;
69
+ --accent: #4a4326;
70
+ --accent-foreground: #f7e6b0;
71
+ --destructive: #c9432f;
72
+ --destructive-foreground: #f2a294;
73
+ --info: #74b0d8;
74
+ --info-foreground: #a0cbe6;
75
+ --success: #7fb184;
76
+ --success-foreground: #a6ccaa;
77
+ --warning: #d3a24f;
78
+ --warning-foreground: #e7c68d;
79
+ --border: #2f2836;
80
+ --input: #3c3344;
81
+ --ring: #f07fae;
82
+ --sidebar: #150f19;
83
+ --sidebar-foreground: #bdb2c4;
84
+ --sidebar-primary: #f07fae;
85
+ --sidebar-primary-foreground: #2a0f1c;
86
+ --sidebar-accent: #241d2a;
87
+ --sidebar-accent-foreground: #f0eaf3;
88
+ --sidebar-border: #2a2330;
89
+ --sidebar-ring: #f07fae;
90
+ }
package/dist/themes/taffy.css ADDED
@@ -0,0 +1,89 @@
1
+ /**
2
+ * Taffy — Watermelon, sky and lemon.
3
+ *
4
+ * GENERATED by scripts/build-themes.ts from scripts/palettes.ts.
5
+ * Do not edit; your changes will be overwritten on the next build.
6
+ *
7
+ * Usage:
8
+ *
9
+ * @import "tailwindcss";
10
+ * @import "xiod-ui/styles";
11
+ * @import "xiod-ui/themes/taffy";
12
+ *
13
+ * Overrides the base tokens directly, so no attribute on `<html>` is needed.
14
+ * Your own `:root` block placed after this import still wins — same
15
+ * specificity, later in source order.
16
+ */
17
+
18
+ :root {
19
+ --radius: 1.25rem;
20
+ --background: #fff7fb;
21
+ --foreground: #3d1f30;
22
+ --card: #ffffff;
23
+ --card-foreground: #3d1f30;
24
+ --popover: #ffffff;
25
+ --popover-foreground: #3d1f30;
26
+ --primary: #e01e3c;
27
+ --primary-foreground: #ffffff;
28
+ --secondary: #bfe9ff;
29
+ --secondary-foreground: #0d3f5c;
30
+ --muted: #fdeef5;
31
+ --muted-foreground: #6d5060;
32
+ --accent: #fff0a8;
33
+ --accent-foreground: #5c4a00;
34
+ --destructive: #a8173a;
35
+ --destructive-foreground: #85122d;
36
+ --info: #1f7fb5;
37
+ --info-foreground: #155e87;
38
+ --success: #2e8b57;
39
+ --success-foreground: #226a42;
40
+ --warning: #b5730a;
41
+ --warning-foreground: #8f5a08;
42
+ --border: #fbe0ec;
43
+ --input: #f2c7dc;
44
+ --ring: #e01e3c;
45
+ --sidebar: #fff2f8;
46
+ --sidebar-foreground: #5c3b4c;
47
+ --sidebar-primary: #e01e3c;
48
+ --sidebar-primary-foreground: #ffffff;
49
+ --sidebar-accent: #ffe6f1;
50
+ --sidebar-accent-foreground: #3d1f30;
51
+ --sidebar-border: #fae2ee;
52
+ --sidebar-ring: #e01e3c;
53
+ }
54
+
55
+ .dark {
56
+ --background: #24121c;
57
+ --foreground: #ffe9f3;
58
+ --card: #2e1826;
59
+ --card-foreground: #ffe9f3;
60
+ --popover: #2e1826;
61
+ --popover-foreground: #ffe9f3;
62
+ --primary: #fb5f80;
63
+ --primary-foreground: #3d0022;
64
+ --secondary: #143a4d;
65
+ --secondary-foreground: #a8e4ff;
66
+ --muted: #2a1521;
67
+ --muted-foreground: #c9a3b6;
68
+ --accent: #4a3d0f;
69
+ --accent-foreground: #ffef9e;
70
+ --destructive: #c9432f;
71
+ --destructive-foreground: #f7a794;
72
+ --info: #7fd0ff;
73
+ --info-foreground: #a8e0ff;
74
+ --success: #7fd9a8;
75
+ --success-foreground: #a5e6c4;
76
+ --warning: #ffc94d;
77
+ --warning-foreground: #ffde91;
78
+ --border: #3d2130;
79
+ --input: #4d2b3d;
80
+ --ring: #fb5f80;
81
+ --sidebar: #1c0d16;
82
+ --sidebar-foreground: #d1b2c0;
83
+ --sidebar-primary: #fb5f80;
84
+ --sidebar-primary-foreground: #3d0022;
85
+ --sidebar-accent: #2a1420;
86
+ --sidebar-accent-foreground: #ffe9f3;
87
+ --sidebar-border: #2e1826;
88
+ --sidebar-ring: #fb5f80;
89
+ }
package/dist/themes/taffy.scoped.css ADDED
@@ -0,0 +1,90 @@
1
+ /**
2
+ * Taffy — Watermelon, sky and lemon.
3
+ *
4
+ * GENERATED by scripts/build-themes.ts from scripts/palettes.ts.
5
+ * Do not edit; your changes will be overwritten on the next build.
6
+ *
7
+ * Usage:
8
+ *
9
+ * @import "tailwindcss";
10
+ * @import "xiod-ui/styles";
11
+ * @import "xiod-ui/themes/taffy/scoped";
12
+ *
13
+ * Applies only where `data-palette="taffy"` is set. Use this form when your
14
+ * app switches palettes at runtime — pass `defaultPalette` to ThemeProvider
15
+ * and call `setPalette("taffy")` from `useTheme()`. For a single fixed
16
+ * palette import "xiod-ui/themes/taffy" instead, which needs no attribute.
17
+ */
18
+
19
+ [data-palette="taffy"] {
20
+ --radius: 1.25rem;
21
+ --background: #fff7fb;
22
+ --foreground: #3d1f30;
23
+ --card: #ffffff;
24
+ --card-foreground: #3d1f30;
25
+ --popover: #ffffff;
26
+ --popover-foreground: #3d1f30;
27
+ --primary: #e01e3c;
28
+ --primary-foreground: #ffffff;
29
+ --secondary: #bfe9ff;
30
+ --secondary-foreground: #0d3f5c;
31
+ --muted: #fdeef5;
32
+ --muted-foreground: #6d5060;
33
+ --accent: #fff0a8;
34
+ --accent-foreground: #5c4a00;
35
+ --destructive: #a8173a;
36
+ --destructive-foreground: #85122d;
37
+ --info: #1f7fb5;
38
+ --info-foreground: #155e87;
39
+ --success: #2e8b57;
40
+ --success-foreground: #226a42;
41
+ --warning: #b5730a;
42
+ --warning-foreground: #8f5a08;
43
+ --border: #fbe0ec;
44
+ --input: #f2c7dc;
45
+ --ring: #e01e3c;
46
+ --sidebar: #fff2f8;
47
+ --sidebar-foreground: #5c3b4c;
48
+ --sidebar-primary: #e01e3c;
49
+ --sidebar-primary-foreground: #ffffff;
50
+ --sidebar-accent: #ffe6f1;
51
+ --sidebar-accent-foreground: #3d1f30;
52
+ --sidebar-border: #fae2ee;
53
+ --sidebar-ring: #e01e3c;
54
+ }
55
+
56
+ .dark[data-palette="taffy"] {
57
+ --background: #24121c;
58
+ --foreground: #ffe9f3;
59
+ --card: #2e1826;
60
+ --card-foreground: #ffe9f3;
61
+ --popover: #2e1826;
62
+ --popover-foreground: #ffe9f3;
63
+ --primary: #fb5f80;
64
+ --primary-foreground: #3d0022;
65
+ --secondary: #143a4d;
66
+ --secondary-foreground: #a8e4ff;
67
+ --muted: #2a1521;
68
+ --muted-foreground: #c9a3b6;
69
+ --accent: #4a3d0f;
70
+ --accent-foreground: #ffef9e;
71
+ --destructive: #c9432f;
72
+ --destructive-foreground: #f7a794;
73
+ --info: #7fd0ff;
74
+ --info-foreground: #a8e0ff;
75
+ --success: #7fd9a8;
76
+ --success-foreground: #a5e6c4;
77
+ --warning: #ffc94d;
78
+ --warning-foreground: #ffde91;
79
+ --border: #3d2130;
80
+ --input: #4d2b3d;
81
+ --ring: #fb5f80;
82
+ --sidebar: #1c0d16;
83
+ --sidebar-foreground: #d1b2c0;
84
+ --sidebar-primary: #fb5f80;
85
+ --sidebar-primary-foreground: #3d0022;
86
+ --sidebar-accent: #2a1420;
87
+ --sidebar-accent-foreground: #ffe9f3;
88
+ --sidebar-border: #2e1826;
89
+ --sidebar-ring: #fb5f80;
90
+ }
package/dist/themes/toxin.css ADDED
@@ -0,0 +1,89 @@
1
+ /**
2
+ * Toxin — Biohazard green and blood on wet concrete.
3
+ *
4
+ * GENERATED by scripts/build-themes.ts from scripts/palettes.ts.
5
+ * Do not edit; your changes will be overwritten on the next build.
6
+ *
7
+ * Usage:
8
+ *
9
+ * @import "tailwindcss";
10
+ * @import "xiod-ui/styles";
11
+ * @import "xiod-ui/themes/toxin";
12
+ *
13
+ * Overrides the base tokens directly, so no attribute on `<html>` is needed.
14
+ * Your own `:root` block placed after this import still wins — same
15
+ * specificity, later in source order.
16
+ */
17
+
18
+ :root {
19
+ --radius: 0.125rem;
20
+ --background: #e8eae6;
21
+ --foreground: #16180f;
22
+ --card: #f2f4ef;
23
+ --card-foreground: #16180f;
24
+ --popover: #f2f4ef;
25
+ --popover-foreground: #16180f;
26
+ --primary: #4a6b1f;
27
+ --primary-foreground: #ffffff;
28
+ --secondary: #d2d6cc;
29
+ --secondary-foreground: #232619;
30
+ --muted: #dfe2db;
31
+ --muted-foreground: #4f5548;
32
+ --accent: #cfd9b8;
33
+ --accent-foreground: #2b3a12;
34
+ --destructive: #a51818;
35
+ --destructive-foreground: #821313;
36
+ --info: #1f5f7d;
37
+ --info-foreground: #154458;
38
+ --success: #17705e;
39
+ --success-foreground: #115345;
40
+ --warning: #8a6000;
41
+ --warning-foreground: #6e4c00;
42
+ --border: #d3d7cd;
43
+ --input: #bcc2b4;
44
+ --ring: #4a6b1f;
45
+ --sidebar: #e0e3dc;
46
+ --sidebar-foreground: #3a4033;
47
+ --sidebar-primary: #4a6b1f;
48
+ --sidebar-primary-foreground: #ffffff;
49
+ --sidebar-accent: #d5dac9;
50
+ --sidebar-accent-foreground: #16180f;
51
+ --sidebar-border: #cdd2c6;
52
+ --sidebar-ring: #4a6b1f;
53
+ }
54
+
55
+ .dark {
56
+ --background: #0e100c;
57
+ --foreground: #dfe3d8;
58
+ --card: #171a13;
59
+ --card-foreground: #dfe3d8;
60
+ --popover: #171a13;
61
+ --popover-foreground: #dfe3d8;
62
+ --primary: #9fd42f;
63
+ --primary-foreground: #17200a;
64
+ --secondary: #232a1c;
65
+ --secondary-foreground: #dfe3d8;
66
+ --muted: #14170f;
67
+ --muted-foreground: #98a08c;
68
+ --accent: #2b3a12;
69
+ --accent-foreground: #cfe89a;
70
+ --destructive: #d32f2f;
71
+ --destructive-foreground: #f09b9b;
72
+ --info: #6fb0d0;
73
+ --info-foreground: #9cc9e0;
74
+ --success: #4fc9a8;
75
+ --success-foreground: #85dcc2;
76
+ --warning: #d9a838;
77
+ --warning-foreground: #ecc880;
78
+ --border: #232619;
79
+ --input: #333a26;
80
+ --ring: #9fd42f;
81
+ --sidebar: #0a0c08;
82
+ --sidebar-foreground: #b0b8a4;
83
+ --sidebar-primary: #9fd42f;
84
+ --sidebar-primary-foreground: #17200a;
85
+ --sidebar-accent: #141710;
86
+ --sidebar-accent-foreground: #dfe3d8;
87
+ --sidebar-border: #1c2016;
88
+ --sidebar-ring: #9fd42f;
89
+ }
package/dist/themes/toxin.scoped.css ADDED
@@ -0,0 +1,90 @@
1
+ /**
2
+ * Toxin — Biohazard green and blood on wet concrete.
3
+ *
4
+ * GENERATED by scripts/build-themes.ts from scripts/palettes.ts.
5
+ * Do not edit; your changes will be overwritten on the next build.
6
+ *
7
+ * Usage:
8
+ *
9
+ * @import "tailwindcss";
10
+ * @import "xiod-ui/styles";
11
+ * @import "xiod-ui/themes/toxin/scoped";
12
+ *
13
+ * Applies only where `data-palette="toxin"` is set. Use this form when your
14
+ * app switches palettes at runtime — pass `defaultPalette` to ThemeProvider
15
+ * and call `setPalette("toxin")` from `useTheme()`. For a single fixed
16
+ * palette import "xiod-ui/themes/toxin" instead, which needs no attribute.
17
+ */
18
+
19
+ [data-palette="toxin"] {
20
+ --radius: 0.125rem;
21
+ --background: #e8eae6;
22
+ --foreground: #16180f;
23
+ --card: #f2f4ef;
24
+ --card-foreground: #16180f;
25
+ --popover: #f2f4ef;
26
+ --popover-foreground: #16180f;
27
+ --primary: #4a6b1f;
28
+ --primary-foreground: #ffffff;
29
+ --secondary: #d2d6cc;
30
+ --secondary-foreground: #232619;
31
+ --muted: #dfe2db;
32
+ --muted-foreground: #4f5548;
33
+ --accent: #cfd9b8;
34
+ --accent-foreground: #2b3a12;
35
+ --destructive: #a51818;
36
+ --destructive-foreground: #821313;
37
+ --info: #1f5f7d;
38
+ --info-foreground: #154458;
39
+ --success: #17705e;
40
+ --success-foreground: #115345;
41
+ --warning: #8a6000;
42
+ --warning-foreground: #6e4c00;
43
+ --border: #d3d7cd;
44
+ --input: #bcc2b4;
45
+ --ring: #4a6b1f;
46
+ --sidebar: #e0e3dc;
47
+ --sidebar-foreground: #3a4033;
48
+ --sidebar-primary: #4a6b1f;
49
+ --sidebar-primary-foreground: #ffffff;
50
+ --sidebar-accent: #d5dac9;
51
+ --sidebar-accent-foreground: #16180f;
52
+ --sidebar-border: #cdd2c6;
53
+ --sidebar-ring: #4a6b1f;
54
+ }
55
+
56
+ .dark[data-palette="toxin"] {
57
+ --background: #0e100c;
58
+ --foreground: #dfe3d8;
59
+ --card: #171a13;
60
+ --card-foreground: #dfe3d8;
61
+ --popover: #171a13;
62
+ --popover-foreground: #dfe3d8;
63
+ --primary: #9fd42f;
64
+ --primary-foreground: #17200a;
65
+ --secondary: #232a1c;
66
+ --secondary-foreground: #dfe3d8;
67
+ --muted: #14170f;
68
+ --muted-foreground: #98a08c;
69
+ --accent: #2b3a12;
70
+ --accent-foreground: #cfe89a;
71
+ --destructive: #d32f2f;
72
+ --destructive-foreground: #f09b9b;
73
+ --info: #6fb0d0;
74
+ --info-foreground: #9cc9e0;
75
+ --success: #4fc9a8;
76
+ --success-foreground: #85dcc2;
77
+ --warning: #d9a838;
78
+ --warning-foreground: #ecc880;
79
+ --border: #232619;
80
+ --input: #333a26;
81
+ --ring: #9fd42f;
82
+ --sidebar: #0a0c08;
83
+ --sidebar-foreground: #b0b8a4;
84
+ --sidebar-primary: #9fd42f;
85
+ --sidebar-primary-foreground: #17200a;
86
+ --sidebar-accent: #141710;
87
+ --sidebar-accent-foreground: #dfe3d8;
88
+ --sidebar-border: #1c2016;
89
+ --sidebar-ring: #9fd42f;
90
+ }
package/package.json ADDED
@@ -0,0 +1,140 @@
1
+ {
2
+ "name": "xiod-ui",
3
+ "version": "1.0.0",
4
+ "description": "89 customizable React components built with Base UI, Tailwind CSS 4, and XiodIcons. Typed props, composable APIs, and light and dark themes.",
5
+ "keywords": [
6
+ "accessible",
7
+ "accessible-components",
8
+ "base-ui",
9
+ "color-picker",
10
+ "combobox",
11
+ "component-library",
12
+ "components",
13
+ "css-variables",
14
+ "customizable",
15
+ "dark-mode",
16
+ "date-picker",
17
+ "design-system",
18
+ "dialog",
19
+ "forms",
20
+ "headless",
21
+ "react",
22
+ "react-components",
23
+ "react-ui",
24
+ "sidebar",
25
+ "tailwind",
26
+ "tailwind-components",
27
+ "tailwindcss",
28
+ "tailwindcss-v4",
29
+ "theming",
30
+ "toast",
31
+ "typescript",
32
+ "ui",
33
+ "ui-components",
34
+ "ui-library",
35
+ "xiod-ui"
36
+ ],
37
+ "homepage": "https://github.com/ImKKingshuk/XiodUI#readme",
38
+ "bugs": {
39
+ "url": "https://github.com/ImKKingshuk/XiodUI/issues"
40
+ },
41
+ "license": "SEE LICENSE IN LICENSE",
42
+ "author": "ImKKingshuk",
43
+ "repository": {
44
+ "type": "git",
45
+ "url": "git+https://github.com/ImKKingshuk/XiodUI.git"
46
+ },
47
+ "files": [
48
+ "dist",
49
+ "README.md",
50
+ "LICENSE"
51
+ ],
52
+ "type": "module",
53
+ "sideEffects": [
54
+ "**/*.css"
55
+ ],
56
+ "exports": {
57
+ "./styles": "./dist/styles.css",
58
+ "./styles.css": "./dist/styles.css",
59
+ "./package.json": "./package.json",
60
+ "./themes/*/scoped": "./dist/themes/*.scoped.css",
61
+ "./themes/*": "./dist/themes/*.css",
62
+ "./*": {
63
+ "types": "./dist/components/*.d.ts",
64
+ "default": "./dist/components/*.js"
65
+ },
66
+ "./hooks/*": {
67
+ "types": "./dist/hooks/*.d.ts",
68
+ "default": "./dist/hooks/*.js"
69
+ }
70
+ },
71
+ "publishConfig": {
72
+ "access": "public"
73
+ },
74
+ "scripts": {
75
+ "build": "bun run themes && tsdown",
76
+ "themes": "bun run themes:verify && bun scripts/build-themes.ts",
77
+ "themes:verify": "bun scripts/verify-palettes.ts",
78
+ "size": "bun scripts/size.ts",
79
+ "dev": "tsdown --watch",
80
+ "typecheck": "tsc --noEmit && tsc --noEmit -p tsconfig.test.json && tsc --noEmit -p tsconfig.release.json",
81
+ "audit": "bun scripts/audit.ts",
82
+ "lint": "oxlint --disable-nested-config --report-unused-disable-directives",
83
+ "lint:fix": "oxlint --disable-nested-config --report-unused-disable-directives --fix",
84
+ "format": "oxfmt --disable-nested-config .",
85
+ "format:check": "oxfmt --disable-nested-config --check .",
86
+ "test": "bun run test:components && bun run test:browser",
87
+ "test:components": "vitest run --config vitest.config.ts",
88
+ "test:browser": "playwright test",
89
+ "test:browser:serve": "vite --config vite.browser.config.ts --host 127.0.0.1 --port 4173",
90
+ "check": "bun run lint && bun run format:check && bun run typecheck && bun run test:components && bun run audit && bun run build",
91
+ "check:package": "bun scripts/release-check.ts",
92
+ "test:release": "vitest run --config vitest.release.config.ts",
93
+ "test:package": "bun scripts/test-package.ts",
94
+ "pack:package": "npm pack",
95
+ "pack:dry-run": "bun run check:release && npm pack --dry-run",
96
+ "publish:package": "npm publish",
97
+ "prepack": "bun run build && bun run check:package",
98
+ "check:release": "bun run check && bun run test:browser && bun run test:release && bun run test:package",
99
+ "prepublishOnly": "bun run check:release"
100
+ },
101
+ "dependencies": {
102
+ "@base-ui/react": "^1.8.0",
103
+ "class-variance-authority": "^0.7.1",
104
+ "cn": "^0.3.0",
105
+ "xiod-icons": "^1.0.0"
106
+ },
107
+ "devDependencies": {
108
+ "@arethetypeswrong/core": "^0.18.5",
109
+ "@axe-core/playwright": "^4.13.0",
110
+ "@playwright/test": "^1.63.0",
111
+ "@tailwindcss/vite": "^4.3.3",
112
+ "@testing-library/dom": "^10.4.1",
113
+ "@testing-library/jest-dom": "^7.0.1",
114
+ "@testing-library/react": "^16.3.3",
115
+ "@testing-library/user-event": "^14.6.7",
116
+ "@types/node": "^26.5.1",
117
+ "@types/react": "^19.3.0",
118
+ "@types/react-dom": "^19.3.0",
119
+ "jsdom": "^30.0.1",
120
+ "oxc-minify": "^0.149.0",
121
+ "oxfmt": "0.67.0",
122
+ "oxlint": "1.82.0",
123
+ "oxlint-tsgolint": "7.0.2001",
124
+ "publint": "^0.3.24",
125
+ "rolldown": "^1.2.8",
126
+ "tailwindcss": "^4.3.3",
127
+ "tsdown": "^0.23.0",
128
+ "typescript": "6.0.3",
129
+ "unplugin-unused": "^0.6.0",
130
+ "vite": "^8.3.0",
131
+ "vitest": "^5.0.0"
132
+ },
133
+ "peerDependencies": {
134
+ "react": "^19.3.0",
135
+ "react-dom": "^19.3.0"
136
+ },
137
+ "engines": {
138
+ "node": ">=20"
139
+ }
140
+ }