@vaam-apps/ui 0.1.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 (285) hide show
  1. package/CHANGELOG.md +104 -0
  2. package/LICENSE +21 -0
  3. package/README.md +286 -0
  4. package/dist/components/data/code.d.ts +37 -0
  5. package/dist/components/data/code.d.ts.map +1 -0
  6. package/dist/components/data/code.js +37 -0
  7. package/dist/components/data/code.js.map +1 -0
  8. package/dist/components/data/copy-button.d.ts +39 -0
  9. package/dist/components/data/copy-button.d.ts.map +1 -0
  10. package/dist/components/data/copy-button.js +50 -0
  11. package/dist/components/data/copy-button.js.map +1 -0
  12. package/dist/components/data/detail-row.d.ts +69 -0
  13. package/dist/components/data/detail-row.d.ts.map +1 -0
  14. package/dist/components/data/detail-row.js +27 -0
  15. package/dist/components/data/detail-row.js.map +1 -0
  16. package/dist/components/data/id-display.d.ts +33 -0
  17. package/dist/components/data/id-display.d.ts.map +1 -0
  18. package/dist/components/data/id-display.js +25 -0
  19. package/dist/components/data/id-display.js.map +1 -0
  20. package/dist/components/data/masked-value.d.ts +47 -0
  21. package/dist/components/data/masked-value.d.ts.map +1 -0
  22. package/dist/components/data/masked-value.js +46 -0
  23. package/dist/components/data/masked-value.js.map +1 -0
  24. package/dist/components/data/money.d.ts +28 -0
  25. package/dist/components/data/money.d.ts.map +1 -0
  26. package/dist/components/data/money.js +22 -0
  27. package/dist/components/data/money.js.map +1 -0
  28. package/dist/components/data/phone-display.d.ts +45 -0
  29. package/dist/components/data/phone-display.d.ts.map +1 -0
  30. package/dist/components/data/phone-display.js +23 -0
  31. package/dist/components/data/phone-display.js.map +1 -0
  32. package/dist/components/data/stat-tile.d.ts +33 -0
  33. package/dist/components/data/stat-tile.d.ts.map +1 -0
  34. package/dist/components/data/stat-tile.js +18 -0
  35. package/dist/components/data/stat-tile.js.map +1 -0
  36. package/dist/components/data/timestamp-display.d.ts +14 -0
  37. package/dist/components/data/timestamp-display.d.ts.map +1 -0
  38. package/dist/components/data/timestamp-display.js +77 -0
  39. package/dist/components/data/timestamp-display.js.map +1 -0
  40. package/dist/components/patterns/inline-banner.d.ts +22 -0
  41. package/dist/components/patterns/inline-banner.d.ts.map +1 -0
  42. package/dist/components/patterns/inline-banner.js +11 -0
  43. package/dist/components/patterns/inline-banner.js.map +1 -0
  44. package/dist/components/patterns/inline-empty-state.d.ts +20 -0
  45. package/dist/components/patterns/inline-empty-state.d.ts.map +1 -0
  46. package/dist/components/patterns/inline-empty-state.js +11 -0
  47. package/dist/components/patterns/inline-empty-state.js.map +1 -0
  48. package/dist/components/patterns/live-row.d.ts +23 -0
  49. package/dist/components/patterns/live-row.d.ts.map +1 -0
  50. package/dist/components/patterns/live-row.js +48 -0
  51. package/dist/components/patterns/live-row.js.map +1 -0
  52. package/dist/components/patterns/payload-inspector.d.ts +25 -0
  53. package/dist/components/patterns/payload-inspector.d.ts.map +1 -0
  54. package/dist/components/patterns/payload-inspector.js +33 -0
  55. package/dist/components/patterns/payload-inspector.js.map +1 -0
  56. package/dist/components/patterns/route-skeleton.d.ts +15 -0
  57. package/dist/components/patterns/route-skeleton.d.ts.map +1 -0
  58. package/dist/components/patterns/route-skeleton.js +7 -0
  59. package/dist/components/patterns/route-skeleton.js.map +1 -0
  60. package/dist/components/patterns/screen-layout.d.ts +14 -0
  61. package/dist/components/patterns/screen-layout.d.ts.map +1 -0
  62. package/dist/components/patterns/screen-layout.js +11 -0
  63. package/dist/components/patterns/screen-layout.js.map +1 -0
  64. package/dist/components/patterns/stale-write-banner.d.ts +26 -0
  65. package/dist/components/patterns/stale-write-banner.d.ts.map +1 -0
  66. package/dist/components/patterns/stale-write-banner.js +28 -0
  67. package/dist/components/patterns/stale-write-banner.js.map +1 -0
  68. package/dist/components/patterns/state-timeline.d.ts +58 -0
  69. package/dist/components/patterns/state-timeline.d.ts.map +1 -0
  70. package/dist/components/patterns/state-timeline.js +103 -0
  71. package/dist/components/patterns/state-timeline.js.map +1 -0
  72. package/dist/components/primitives/badge.d.ts +27 -0
  73. package/dist/components/primitives/badge.d.ts.map +1 -0
  74. package/dist/components/primitives/badge.js +33 -0
  75. package/dist/components/primitives/badge.js.map +1 -0
  76. package/dist/components/primitives/button.d.ts +12 -0
  77. package/dist/components/primitives/button.d.ts.map +1 -0
  78. package/dist/components/primitives/button.js +42 -0
  79. package/dist/components/primitives/button.js.map +1 -0
  80. package/dist/components/primitives/calendar.d.ts +39 -0
  81. package/dist/components/primitives/calendar.d.ts.map +1 -0
  82. package/dist/components/primitives/calendar.js +102 -0
  83. package/dist/components/primitives/calendar.js.map +1 -0
  84. package/dist/components/primitives/card.d.ts +24 -0
  85. package/dist/components/primitives/card.d.ts.map +1 -0
  86. package/dist/components/primitives/card.js +28 -0
  87. package/dist/components/primitives/card.js.map +1 -0
  88. package/dist/components/primitives/checkbox.d.ts +42 -0
  89. package/dist/components/primitives/checkbox.d.ts.map +1 -0
  90. package/dist/components/primitives/checkbox.js +31 -0
  91. package/dist/components/primitives/checkbox.js.map +1 -0
  92. package/dist/components/primitives/chip-select.d.ts +38 -0
  93. package/dist/components/primitives/chip-select.d.ts.map +1 -0
  94. package/dist/components/primitives/chip-select.js +25 -0
  95. package/dist/components/primitives/chip-select.js.map +1 -0
  96. package/dist/components/primitives/command-menu.d.ts +54 -0
  97. package/dist/components/primitives/command-menu.d.ts.map +1 -0
  98. package/dist/components/primitives/command-menu.js +24 -0
  99. package/dist/components/primitives/command-menu.js.map +1 -0
  100. package/dist/components/primitives/confirm-dialog.d.ts +52 -0
  101. package/dist/components/primitives/confirm-dialog.d.ts.map +1 -0
  102. package/dist/components/primitives/confirm-dialog.js +30 -0
  103. package/dist/components/primitives/confirm-dialog.js.map +1 -0
  104. package/dist/components/primitives/date-picker.d.ts +68 -0
  105. package/dist/components/primitives/date-picker.d.ts.map +1 -0
  106. package/dist/components/primitives/date-picker.js +107 -0
  107. package/dist/components/primitives/date-picker.js.map +1 -0
  108. package/dist/components/primitives/dialog.d.ts +50 -0
  109. package/dist/components/primitives/dialog.d.ts.map +1 -0
  110. package/dist/components/primitives/dialog.js +90 -0
  111. package/dist/components/primitives/dialog.js.map +1 -0
  112. package/dist/components/primitives/drawer.d.ts +71 -0
  113. package/dist/components/primitives/drawer.d.ts.map +1 -0
  114. package/dist/components/primitives/drawer.js +93 -0
  115. package/dist/components/primitives/drawer.js.map +1 -0
  116. package/dist/components/primitives/dropdown-menu.d.ts +40 -0
  117. package/dist/components/primitives/dropdown-menu.d.ts.map +1 -0
  118. package/dist/components/primitives/dropdown-menu.js +53 -0
  119. package/dist/components/primitives/dropdown-menu.js.map +1 -0
  120. package/dist/components/primitives/form-field.d.ts +94 -0
  121. package/dist/components/primitives/form-field.d.ts.map +1 -0
  122. package/dist/components/primitives/form-field.js +27 -0
  123. package/dist/components/primitives/form-field.js.map +1 -0
  124. package/dist/components/primitives/inline-confirm.d.ts +62 -0
  125. package/dist/components/primitives/inline-confirm.d.ts.map +1 -0
  126. package/dist/components/primitives/inline-confirm.js +11 -0
  127. package/dist/components/primitives/inline-confirm.js.map +1 -0
  128. package/dist/components/primitives/input.d.ts +4 -0
  129. package/dist/components/primitives/input.d.ts.map +1 -0
  130. package/dist/components/primitives/input.js +13 -0
  131. package/dist/components/primitives/input.js.map +1 -0
  132. package/dist/components/primitives/label.d.ts +26 -0
  133. package/dist/components/primitives/label.d.ts.map +1 -0
  134. package/dist/components/primitives/label.js +33 -0
  135. package/dist/components/primitives/label.js.map +1 -0
  136. package/dist/components/primitives/pagination.d.ts +54 -0
  137. package/dist/components/primitives/pagination.d.ts.map +1 -0
  138. package/dist/components/primitives/pagination.js +31 -0
  139. package/dist/components/primitives/pagination.js.map +1 -0
  140. package/dist/components/primitives/popover.d.ts +12 -0
  141. package/dist/components/primitives/popover.d.ts.map +1 -0
  142. package/dist/components/primitives/popover.js +22 -0
  143. package/dist/components/primitives/popover.js.map +1 -0
  144. package/dist/components/primitives/progress.d.ts +25 -0
  145. package/dist/components/primitives/progress.d.ts.map +1 -0
  146. package/dist/components/primitives/progress.js +25 -0
  147. package/dist/components/primitives/progress.js.map +1 -0
  148. package/dist/components/primitives/radio-group.d.ts +47 -0
  149. package/dist/components/primitives/radio-group.d.ts.map +1 -0
  150. package/dist/components/primitives/radio-group.js +11 -0
  151. package/dist/components/primitives/radio-group.js.map +1 -0
  152. package/dist/components/primitives/select.d.ts +39 -0
  153. package/dist/components/primitives/select.d.ts.map +1 -0
  154. package/dist/components/primitives/select.js +142 -0
  155. package/dist/components/primitives/select.js.map +1 -0
  156. package/dist/components/primitives/separator.d.ts +9 -0
  157. package/dist/components/primitives/separator.d.ts.map +1 -0
  158. package/dist/components/primitives/separator.js +16 -0
  159. package/dist/components/primitives/separator.js.map +1 -0
  160. package/dist/components/primitives/side-nav.d.ts +65 -0
  161. package/dist/components/primitives/side-nav.d.ts.map +1 -0
  162. package/dist/components/primitives/side-nav.js +100 -0
  163. package/dist/components/primitives/side-nav.js.map +1 -0
  164. package/dist/components/primitives/skeleton.d.ts +22 -0
  165. package/dist/components/primitives/skeleton.d.ts.map +1 -0
  166. package/dist/components/primitives/skeleton.js +25 -0
  167. package/dist/components/primitives/skeleton.js.map +1 -0
  168. package/dist/components/primitives/spinner.d.ts +20 -0
  169. package/dist/components/primitives/spinner.d.ts.map +1 -0
  170. package/dist/components/primitives/spinner.js +21 -0
  171. package/dist/components/primitives/spinner.js.map +1 -0
  172. package/dist/components/primitives/switch.d.ts +29 -0
  173. package/dist/components/primitives/switch.d.ts.map +1 -0
  174. package/dist/components/primitives/switch.js +24 -0
  175. package/dist/components/primitives/switch.js.map +1 -0
  176. package/dist/components/primitives/table.d.ts +23 -0
  177. package/dist/components/primitives/table.d.ts.map +1 -0
  178. package/dist/components/primitives/table.js +81 -0
  179. package/dist/components/primitives/table.js.map +1 -0
  180. package/dist/components/primitives/tabs.d.ts +38 -0
  181. package/dist/components/primitives/tabs.d.ts.map +1 -0
  182. package/dist/components/primitives/tabs.js +84 -0
  183. package/dist/components/primitives/tabs.js.map +1 -0
  184. package/dist/components/primitives/textarea.d.ts +4 -0
  185. package/dist/components/primitives/textarea.d.ts.map +1 -0
  186. package/dist/components/primitives/textarea.js +11 -0
  187. package/dist/components/primitives/textarea.js.map +1 -0
  188. package/dist/components/primitives/toast.d.ts +24 -0
  189. package/dist/components/primitives/toast.d.ts.map +1 -0
  190. package/dist/components/primitives/toast.js +58 -0
  191. package/dist/components/primitives/toast.js.map +1 -0
  192. package/dist/components/primitives/tooltip.d.ts +30 -0
  193. package/dist/components/primitives/tooltip.d.ts.map +1 -0
  194. package/dist/components/primitives/tooltip.js +6 -0
  195. package/dist/components/primitives/tooltip.js.map +1 -0
  196. package/dist/components/status/state-chip.d.ts +53 -0
  197. package/dist/components/status/state-chip.d.ts.map +1 -0
  198. package/dist/components/status/state-chip.js +8 -0
  199. package/dist/components/status/state-chip.js.map +1 -0
  200. package/dist/components/status/state-mark.d.ts +21 -0
  201. package/dist/components/status/state-mark.d.ts.map +1 -0
  202. package/dist/components/status/state-mark.js +90 -0
  203. package/dist/components/status/state-mark.js.map +1 -0
  204. package/dist/components/status/status-pill.d.ts +62 -0
  205. package/dist/components/status/status-pill.d.ts.map +1 -0
  206. package/dist/components/status/status-pill.js +65 -0
  207. package/dist/components/status/status-pill.js.map +1 -0
  208. package/dist/components/status/status-tokens.d.ts +110 -0
  209. package/dist/components/status/status-tokens.d.ts.map +1 -0
  210. package/dist/components/status/status-tokens.js +102 -0
  211. package/dist/components/status/status-tokens.js.map +1 -0
  212. package/dist/index.d.ts +76 -0
  213. package/dist/index.d.ts.map +1 -0
  214. package/dist/index.js +95 -0
  215. package/dist/index.js.map +1 -0
  216. package/dist/lib/cn.d.ts +11 -0
  217. package/dist/lib/cn.d.ts.map +1 -0
  218. package/dist/lib/cn.js +78 -0
  219. package/dist/lib/cn.js.map +1 -0
  220. package/dist/lib/money.d.ts +73 -0
  221. package/dist/lib/money.d.ts.map +1 -0
  222. package/dist/lib/money.js +123 -0
  223. package/dist/lib/money.js.map +1 -0
  224. package/dist/lib/omit-undefined.d.ts +17 -0
  225. package/dist/lib/omit-undefined.d.ts.map +1 -0
  226. package/dist/lib/omit-undefined.js +24 -0
  227. package/dist/lib/omit-undefined.js.map +1 -0
  228. package/package.json +100 -0
  229. package/src/components/data/code.tsx +43 -0
  230. package/src/components/data/copy-button.tsx +97 -0
  231. package/src/components/data/detail-row.tsx +113 -0
  232. package/src/components/data/id-display.tsx +49 -0
  233. package/src/components/data/masked-value.tsx +96 -0
  234. package/src/components/data/money.tsx +46 -0
  235. package/src/components/data/phone-display.tsx +60 -0
  236. package/src/components/data/stat-tile.tsx +68 -0
  237. package/src/components/data/timestamp-display.tsx +106 -0
  238. package/src/components/patterns/inline-banner.tsx +60 -0
  239. package/src/components/patterns/inline-empty-state.tsx +45 -0
  240. package/src/components/patterns/live-row.tsx +75 -0
  241. package/src/components/patterns/payload-inspector.tsx +157 -0
  242. package/src/components/patterns/route-skeleton.tsx +77 -0
  243. package/src/components/patterns/screen-layout.tsx +44 -0
  244. package/src/components/patterns/stale-write-banner.tsx +44 -0
  245. package/src/components/patterns/state-timeline.tsx +229 -0
  246. package/src/components/primitives/badge.tsx +40 -0
  247. package/src/components/primitives/button.tsx +54 -0
  248. package/src/components/primitives/calendar.tsx +136 -0
  249. package/src/components/primitives/card.tsx +70 -0
  250. package/src/components/primitives/checkbox.tsx +101 -0
  251. package/src/components/primitives/chip-select.tsx +105 -0
  252. package/src/components/primitives/command-menu.tsx +92 -0
  253. package/src/components/primitives/confirm-dialog.tsx +109 -0
  254. package/src/components/primitives/date-picker.tsx +271 -0
  255. package/src/components/primitives/dialog.tsx +195 -0
  256. package/src/components/primitives/drawer.tsx +326 -0
  257. package/src/components/primitives/dropdown-menu.tsx +128 -0
  258. package/src/components/primitives/form-field.tsx +136 -0
  259. package/src/components/primitives/inline-confirm.tsx +118 -0
  260. package/src/components/primitives/input.tsx +21 -0
  261. package/src/components/primitives/label.tsx +43 -0
  262. package/src/components/primitives/pagination.tsx +110 -0
  263. package/src/components/primitives/popover.tsx +41 -0
  264. package/src/components/primitives/progress.tsx +66 -0
  265. package/src/components/primitives/radio-group.tsx +90 -0
  266. package/src/components/primitives/select.tsx +254 -0
  267. package/src/components/primitives/separator.tsx +49 -0
  268. package/src/components/primitives/side-nav.tsx +253 -0
  269. package/src/components/primitives/skeleton.tsx +25 -0
  270. package/src/components/primitives/spinner.tsx +39 -0
  271. package/src/components/primitives/switch.tsx +74 -0
  272. package/src/components/primitives/table.tsx +157 -0
  273. package/src/components/primitives/tabs.tsx +163 -0
  274. package/src/components/primitives/textarea.tsx +21 -0
  275. package/src/components/primitives/toast.tsx +117 -0
  276. package/src/components/primitives/tooltip.tsx +38 -0
  277. package/src/components/status/state-chip.tsx +70 -0
  278. package/src/components/status/state-mark.tsx +154 -0
  279. package/src/components/status/status-pill.tsx +153 -0
  280. package/src/components/status/status-tokens.ts +173 -0
  281. package/src/index.ts +96 -0
  282. package/src/lib/cn.ts +168 -0
  283. package/src/lib/money.ts +164 -0
  284. package/src/lib/omit-undefined.ts +25 -0
  285. package/src/styles/theme.css +381 -0
package/src/styles/theme.css ADDED
@@ -0,0 +1,381 @@
1
+ /*
2
+ * @vaam-apps/ui design tokens (T6), redesigned per docs/design/console-redesign.md
3
+ * (the admin console redesign, Phase 0).
4
+ *
5
+ * Source of truth: docs/design/console-redesign.md §2 (decision ledger,
6
+ * D8/D9) and §1 (reference lock), superseding this file's earlier
7
+ * dashboard-design-system.md/dashboard-architecture-plan.md lineage where
8
+ * the two disagree — see D8/D9 in that document for the reasoning behind
9
+ * every change below.
10
+ *
11
+ * **Dark-only (D9).** The `"light"` `@plugin "daisyui/theme"` block and its
12
+ * paired `[data-theme="light"]` block are deleted outright, not merely
13
+ * unreferenced — constraint 2 ("no light theme, no toggle") and this
14
+ * project's own standing "no dormant code" rule (CLAUDE.md, "Delivery
15
+ * style") both rule out keeping a second, unreachable theme alive in the
16
+ * codebase. `frontends/apps/admin/app/layout.tsx` keeps `data-theme="dark"` on `<html>`
17
+ * regardless — harmless, and documents intent even with only one theme
18
+ * registered.
19
+ *
20
+ * **Radius (D8).** Rewritten from the previous near-square 2px system to a
21
+ * visibly, deliberately rounded one. This is a genuine visual-identity
22
+ * break from what shipped before, and it is intended, not a cautious
23
+ * half-step — see D8's own entry in the decision ledger for the full
24
+ * reasoning: the previous 2px system was a real, careful decision under an
25
+ * earlier brief, and this redesign replaces it outright rather than
26
+ * splitting the difference with it.
27
+ *
28
+ * daisyUI v5 is CSS-first: the `@plugin "daisyui/theme"` block below
29
+ * defines the one theme this console ships, under daisyUI's own built-in
30
+ * name "dark" (see the "Customize Built-in daisyUI Theme" pattern in
31
+ * daisyUI's own docs), so every native daisyUI class (`.btn`, `.input`,
32
+ * `.card`, `.badge`, `.table`, `.tabs`, …) themes correctly with zero
33
+ * patching.
34
+ *
35
+ * Everything daisyUI has no concept of — the extra surface-3 hover step,
36
+ * hairline border tiers, muted/subtle text tiers, focus-ring colour, and
37
+ * above all the eleven-state status system — lives in plain CSS custom
38
+ * properties scoped by `[data-theme="dark"]` immediately below the daisyUI
39
+ * theme block, then re-exposed as Tailwind utilities via `@theme inline` so
40
+ * component code can write `bg-surface-3` / `text-state-danger-fg` instead
41
+ * of `bg-[var(--surface-3)]` everywhere. This is deliberately NOT folded
42
+ * into daisyUI's own theme config: daisyUI has no vocabulary for a
43
+ * six-hue/eleven-state status system, a three-tier border ladder, or two
44
+ * distinct floating-layer shadows, so these stay hand-written CSS custom
45
+ * properties by necessity, not by omission — with only one theme left to
46
+ * maintain, this file is already substantially smaller and more
47
+ * daisyUI-driven than before (D9 alone removes the entire duplicate
48
+ * light-theme block), and every token below that daisyUI *can* express
49
+ * lives in its theme block, not out here.
50
+ *
51
+ * One deliberate rename from the design doc: its `--border` token (default
52
+ * container border colour) is called `--edge` here instead. daisyUI
53
+ * reserves `--border` for component border *width* (see the `--border: 1px`
54
+ * key inside the theme block below) — reusing the name for a colour would
55
+ * silently overwrite that width value at `[data-theme=...]` scope. `--edge`
56
+ * carries the same three-step ladder (`--edge-subtle` / `--edge` /
57
+ * `--edge-strong`) the design doc specifies, just under a collision-free
58
+ * name.
59
+ *
60
+ * Font self-hosting/subsetting (design doc F2: Inter Variable + JetBrains
61
+ * Mono Variable, latin + latin-ext, `font-display: swap`) is explicitly
62
+ * NOT done here — that is a separate, later task per the design doc's own
63
+ * build order, and no font files are checked into this repo yet. The
64
+ * family stacks below are correct and will pick the right system fallback
65
+ * (`system-ui` / `ui-monospace`) until self-hosting lands.
66
+ */
67
+
68
+ @plugin "daisyui/theme" {
69
+ name: "dark";
70
+ default: true;
71
+ prefersdark: true;
72
+ color-scheme: dark;
73
+
74
+ /* base-100/200/300 double as our --background / --surface-1 / --surface-2 —
75
+ see the surface ladder comment on the [data-theme="dark"] block below. */
76
+ --color-base-100: #0a0b0d;
77
+ --color-base-200: #101216;
78
+ --color-base-300: #16181d;
79
+ --color-base-content: #e8eaed;
80
+
81
+ /* §1.3: one accent, never a hue. Primary/secondary/accent all resolve to
82
+ the same achromatic inverse fill — there is no second brand colour to
83
+ assign them to, on purpose. */
84
+ --color-primary: #e8eaed;
85
+ --color-primary-content: #0a0b0d;
86
+ --color-secondary: #e8eaed;
87
+ --color-secondary-content: #0a0b0d;
88
+ --color-accent: #e8eaed;
89
+ --color-accent-content: #0a0b0d;
90
+ --color-neutral: #1c1f25;
91
+ --color-neutral-content: #e8eaed;
92
+
93
+ /* daisyUI's own semantic four. Not used by the eleven-state status system
94
+ (that is bespoke — §4) but kept coherent for any incidental native use
95
+ (e.g. a plain `alert-error`). info=neutral grey on purpose: blue is
96
+ selection-only per §1.3, never a status hue. */
97
+ --color-info: #9aa1ac;
98
+ --color-info-content: #0a0b0d;
99
+ --color-success: #4ade80;
100
+ --color-success-content: #06210f;
101
+ --color-warning: #fcd34d;
102
+ --color-warning-content: #241a00;
103
+ --color-error: #e5534b;
104
+ --color-error-content: #ffffff;
105
+
106
+ /* D8: a visibly rounded register, three deliberately distinct steps —
107
+ small controls (selector) noticeably tighter than fields, fields
108
+ noticeably tighter than boxes — so the progression itself reads as
109
+ intentional, not just "rounded everywhere by the same amount". Judged
110
+ against §1's reference lock (LottieFiles' filled-rounded-rectangle
111
+ active nav row, Column's selected-row fill, Polar's drawer/card
112
+ corners), not against the 2px system this replaces: every one of
113
+ those references reads as genuinely, confidently rounded, not a
114
+ restrained near-square nudge. Still short of `--radius-full` (a true
115
+ pill) — §1.1's own description of the LottieFiles active row is
116
+ explicit that it is "not fully pill-shaped either", and a data table's
117
+ own row/cell chrome would look novelty-bubbly at pill radius — but
118
+ within that ceiling this is the confident end of the range, not the
119
+ cautious one. */
120
+ --radius-selector: 8px;
121
+ --radius-field: 12px;
122
+ --radius-box: 20px;
123
+ --size-selector: 0.25rem;
124
+ --size-field: 0.25rem;
125
+ --border: 1px;
126
+ --depth: 0;
127
+ --noise: 0;
128
+ }
129
+
130
+ /*
131
+ * Surface ladder (§3.1): --color-base-100/200/300 above already carry
132
+ * background / surface-1 / surface-2. --surface-3 (row hover, pressed,
133
+ * selected fill) is one step daisyUI's own three-tier base system doesn't
134
+ * have, so it lives here as a plain extra token.
135
+ *
136
+ * D9: this used to be paired with a `[data-theme="light"]` block carrying
137
+ * the same token set under a light palette. That block is deleted, not
138
+ * merely unused — see this file's own header comment.
139
+ */
140
+ [data-theme="dark"] {
141
+ --surface-3: #1c1f25;
142
+
143
+ /* §3.6: borders, not shadows, for cards/tables/panels — only floating
144
+ layers (popover, dropdown, dialog, tooltip, sheet/drawer) get one. */
145
+ --shadow-popover: 0 8px 24px -6px rgb(0 0 0 / 0.65), 0 0 0 1px var(--edge);
146
+ --shadow-dialog: 0 24px 56px -12px rgb(0 0 0 / 0.75), 0 0 0 1px var(--edge);
147
+
148
+ --edge-subtle: #1f232a;
149
+ --edge: #2a2f37;
150
+ --edge-strong: #3d434d;
151
+
152
+ --muted-foreground: #9aa1ac;
153
+ /* `--subtle-foreground` was #6b727d, which fails WCAG AA on every
154
+ surface in this system — 4.06:1 on `--background` down to 3.40:1 on
155
+ `--surface-3`, against the 4.5:1 normal text requires. It is used in
156
+ 38 places, all of them at `--text-caption` (12px) or `--text-micro`
157
+ (11px), so the normal-text bar is the right one; none of them are
158
+ large enough for the 3:1 exception.
159
+
160
+ Found by the accessibility addon on a Storybook story, not by
161
+ inspection — the fourteen weekday headers of a two-month calendar
162
+ all failing at once is what made a token-level problem visible.
163
+
164
+ #838a95 is the minimum that clears AA on the worst case (4.74:1 on
165
+ `--surface-3`, 5.66:1 on `--background`). It does compress the
166
+ three-tier ladder: the gap to `--muted-foreground` goes from ΔE 18.2
167
+ to 8.8, still comfortably above the ~2-3 where two greys stop being
168
+ told apart, but the dimmest tier is now less dim than it was. That
169
+ is a real visual change and it is deliberate — a design system
170
+ cannot ship text below AA and call the contrast a style choice. */
171
+ --subtle-foreground: #838a95;
172
+
173
+ --ring: #5b8def;
174
+ --ring-subtle: rgb(91 141 239 / 0.24);
175
+
176
+ --destructive: #e5534b;
177
+ --destructive-foreground: #ffffff;
178
+
179
+ /* §4.4 — the eleven-state status system's only saturated colours. */
180
+ --state-neutral-fg: #9aa1ac;
181
+ --state-neutral-bg: transparent;
182
+ --state-neutral-border: transparent;
183
+
184
+ --state-success-fg: #4ade80;
185
+ --state-success-bg: transparent;
186
+ --state-success-border: transparent;
187
+
188
+ --state-danger-fg: #fca5a5;
189
+ --state-danger-bg: rgb(248 113 113 / 0.1);
190
+ --state-danger-border: rgb(248 113 113 / 0.28);
191
+
192
+ --state-uncertain-fg: #fcd34d;
193
+ --state-uncertain-bg: rgb(251 191 36 / 0.1);
194
+ --state-uncertain-border: rgb(251 191 36 / 0.28);
195
+
196
+ --state-expired-fg: #a8a29e;
197
+ --state-expired-bg: rgb(168 162 158 / 0.1);
198
+ --state-expired-border: rgb(168 162 158 / 0.26);
199
+
200
+ --state-parked-fg: #c4b5fd;
201
+ --state-parked-bg: rgb(167 139 250 / 0.1);
202
+ --state-parked-border: rgb(167 139 250 / 0.28);
203
+
204
+ /* `warning` was referenced by `StateChip`'s own `warning` tone and by
205
+ `InlineBanner`'s `warning` variant (and therefore by every
206
+ `StaleWriteBanner` in the console) from the day both shipped, but the
207
+ trio was never declared here — so `text-state-warning-fg` &c.
208
+ generated no utility at all and those surfaces rendered with no
209
+ colour. Exactly the failure this file's own `--color-surface-1`
210
+ comment above describes, found the same way: by checking the token
211
+ list against what components actually reference, not by looking at a
212
+ screen. `theme-tokens.test.ts` now fails the build on a recurrence.
213
+
214
+ Must stay visibly distinct from `uncertain` even though both read as
215
+ "attention": `uncertain` means the outcome is unknown, `warning`
216
+ means a recoverable condition needs a human. Two states that look
217
+ the same are exactly what the silhouette/mark/fill redundancy in
218
+ §4.3 exists to avoid, and a hue collision undoes it.
219
+
220
+ Measured, not eyeballed — the first value tried here was `#fbbf24`,
221
+ which is 3 degrees of hue and ΔE 13 from `uncertain`'s own
222
+ `#fcd34d`: the same colour, for practical purposes, inside a 14px
223
+ glyph, and the comment justifying it ("orange keeps them separable")
224
+ described a colour it was not. `#fdba74` (orange-300) is ΔE 29 from
225
+ `uncertain`, 35 from `danger` and 47 from `expired`, so it collides
226
+ with nothing, and it is built the way every sibling here is — a
227
+ 300-level tint for the foreground, its 400-level neighbour at
228
+ 10%/28% for the fill and border. Contrast against `--background` is
229
+ 11.7:1, in line with the 10-13 the other foreground tokens carry. */
230
+ --state-warning-fg: #fdba74;
231
+ --state-warning-bg: rgb(251 146 60 / 0.1);
232
+ --state-warning-border: rgb(251 146 60 / 0.28);
233
+ }
234
+
235
+ /*
236
+ * Re-expose the theme-varying tokens above as Tailwind utilities
237
+ * (`bg-surface-3`, `border-edge`, `text-state-danger-fg`, …). `var()`
238
+ * indirection is late-bound at computed-value time, so these correctly
239
+ * pick up whichever `[data-theme]` block is in scope.
240
+ */
241
+ @theme inline {
242
+ /* Aliases onto daisyUI's own base-100/base-content so component code can
243
+ reach for the conventional `background`/`foreground` names instead of
244
+ remembering daisyUI's base-100/base-content vocabulary. */
245
+ --color-background: var(--color-base-100);
246
+ --color-foreground: var(--color-base-content);
247
+
248
+ /* Found live while verifying Phase 1 Bucket B's `table.tsx`/`toast.tsx`
249
+ (console-redesign.md §7): `bg-surface-1`/`bg-surface-2` are used across
250
+ dozens of files in this package and in `admin/` — every dialog,
251
+ popover, tooltip, dropdown-menu, select, drawer, command-menu, this
252
+ file's own `TableHeader`, and most screens' inline info panels — but
253
+ neither alias was ever registered here, going all the way back to the
254
+ original T6 PR (#128; confirmed via `git show` on that commit's own
255
+ `theme.css`). Tailwind's `@theme inline` only generates a utility for a
256
+ token it knows about, so every one of those `bg-surface-1`/
257
+ `bg-surface-2` classes has silently resolved to no background at all
258
+ (`rgba(0,0,0,0)`, confirmed live via `getComputedStyle` against a real
259
+ render) since the component library was first built — easy to miss
260
+ because a transparent panel over this theme's own near-black page
261
+ still reads as "dark enough" at a glance. This file's own older
262
+ comments ("base-100/200/300 double as our --background / --surface-1 /
263
+ --surface-2") already stated the intended mapping; it was just never
264
+ wired into `@theme inline` to make good on it. */
265
+ --color-surface-1: var(--color-base-200);
266
+ --color-surface-2: var(--color-base-300);
267
+ --color-surface-3: var(--surface-3);
268
+
269
+ --color-edge-subtle: var(--edge-subtle);
270
+ --color-edge: var(--edge);
271
+ --color-edge-strong: var(--edge-strong);
272
+
273
+ --color-muted-foreground: var(--muted-foreground);
274
+ --color-subtle-foreground: var(--subtle-foreground);
275
+
276
+ --color-ring: var(--ring);
277
+ --color-ring-subtle: var(--ring-subtle);
278
+
279
+ --color-destructive: var(--destructive);
280
+ --color-destructive-foreground: var(--destructive-foreground);
281
+
282
+ --color-state-neutral-fg: var(--state-neutral-fg);
283
+ --color-state-neutral-bg: var(--state-neutral-bg);
284
+ --color-state-neutral-border: var(--state-neutral-border);
285
+
286
+ --color-state-success-fg: var(--state-success-fg);
287
+ --color-state-success-bg: var(--state-success-bg);
288
+ --color-state-success-border: var(--state-success-border);
289
+
290
+ --color-state-danger-fg: var(--state-danger-fg);
291
+ --color-state-danger-bg: var(--state-danger-bg);
292
+ --color-state-danger-border: var(--state-danger-border);
293
+
294
+ --color-state-uncertain-fg: var(--state-uncertain-fg);
295
+ --color-state-uncertain-bg: var(--state-uncertain-bg);
296
+ --color-state-uncertain-border: var(--state-uncertain-border);
297
+
298
+ --color-state-expired-fg: var(--state-expired-fg);
299
+ --color-state-expired-bg: var(--state-expired-bg);
300
+ --color-state-expired-border: var(--state-expired-border);
301
+
302
+ --color-state-parked-fg: var(--state-parked-fg);
303
+ --color-state-parked-bg: var(--state-parked-bg);
304
+ --color-state-parked-border: var(--state-parked-border);
305
+
306
+ --color-state-warning-fg: var(--state-warning-fg);
307
+ --color-state-warning-bg: var(--state-warning-bg);
308
+ --color-state-warning-border: var(--state-warning-border);
309
+ }
310
+
311
+ /*
312
+ * Theme-invariant tokens: radius, fonts, type scale. Redeclaring Tailwind's
313
+ * own `--radius-sm` / `--radius-md` / `--font-sans` / `--font-mono` /
314
+ * `--text-*` keys overrides Tailwind's stock scale app-wide, which is the
315
+ * point — `rounded-sm` now literally means 12px everywhere, not Tailwind's
316
+ * default 0.125rem. D8: aliased onto the same register as
317
+ * `--radius-field`/`--radius-box` above so `rounded-sm`/`rounded-md` read
318
+ * consistently with daisyUI's own `rounded-field`/`rounded-box` utilities
319
+ * rather than reintroducing a fourth, disconnected scale.
320
+ */
321
+ @theme {
322
+ --radius-sm: 12px;
323
+ --radius-md: 20px;
324
+ /* --radius-full (9999px) is already Tailwind's default; not redeclared. */
325
+
326
+ --font-sans: "Inter Variable", "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
327
+ --font-mono:
328
+ "JetBrains Mono Variable", "JetBrains Mono", ui-monospace, "SF Mono", "Cascadia Mono", Menlo,
329
+ monospace;
330
+
331
+ --text-micro: 11px;
332
+ --text-micro--line-height: 16px;
333
+ --text-caption: 12px;
334
+ --text-caption--line-height: 18px;
335
+ --text-body: 13px;
336
+ --text-body--line-height: 20px;
337
+ --text-prose: 14px;
338
+ --text-prose--line-height: 21px;
339
+ --text-title-sm: 16px;
340
+ --text-title-sm--line-height: 24px;
341
+ --text-title: 20px;
342
+ --text-title--line-height: 28px;
343
+ --text-metric: 28px;
344
+ --text-metric--line-height: 34px;
345
+ --text-metric-lg: 40px;
346
+ --text-metric-lg--line-height: 44px;
347
+ }
348
+
349
+ @layer base {
350
+ :root {
351
+ /* §3.8 motion tokens. Not Tailwind-registered (no `duration-*` utility
352
+ needs them beyond the couple of components below) — used directly
353
+ via `var()` in the status wash and inline pending states. */
354
+ --dur-instant: 90ms;
355
+ --dur-fast: 150ms;
356
+ --dur-state: 240ms;
357
+ --dur-enter: 400ms;
358
+ --ease-out: cubic-bezier(0.2, 0, 0, 1);
359
+ --ease-in: cubic-bezier(0.4, 0, 1, 1);
360
+ --ease-linear: linear;
361
+ }
362
+
363
+ html {
364
+ letter-spacing: -0.011em;
365
+ }
366
+
367
+ /* §3.3: mono is the voice of data. tabular-nums + slashed-zero everywhere
368
+ JetBrains Mono is used — an operator tells `0` from `O` in a `cs_cuid()`
369
+ at 12px only because of the slash. */
370
+ .font-mono {
371
+ font-variant-numeric: tabular-nums slashed-zero;
372
+ }
373
+
374
+ /* §3.6: one focus-ring definition, every focusable element, no exceptions.
375
+ outline (not box-shadow) so it is never clipped by an ancestor's
376
+ `overflow: hidden` — a real failure mode in sticky table headers. */
377
+ :focus-visible {
378
+ outline: 2px solid var(--color-ring);
379
+ outline-offset: 2px;
380
+ }
381
+ }