@assure-one/design-system 1.31.0 → 1.32.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 (37) hide show
  1. package/README.md +24 -0
  2. package/codemods/0.2.0-radix-migration.mjs +315 -0
  3. package/codemods/README.md +305 -0
  4. package/codemods/lib/css-selectors.mjs +33 -0
  5. package/codemods/lib/css-values.mjs +223 -0
  6. package/codemods/lib/ds-stylesheet.mjs +168 -0
  7. package/codemods/lib/environment.mjs +72 -0
  8. package/codemods/lib/files.mjs +100 -0
  9. package/codemods/lib/jsx.mjs +0 -0
  10. package/codemods/lib/ledger.mjs +84 -0
  11. package/codemods/lib/registry.mjs +30 -0
  12. package/codemods/lib/report.mjs +119 -0
  13. package/codemods/lib/runner.mjs +164 -0
  14. package/codemods/run.mjs +161 -0
  15. package/codemods/transforms/cm-15-dom-selectors.mjs +573 -0
  16. package/codemods/transforms/cm-16-globals-css.mjs +487 -0
  17. package/dist/css/base.css +60 -0
  18. package/dist/css/legacy-aliases.css +489 -0
  19. package/dist/css/shadcn.css +155 -0
  20. package/dist/css/tailwind.css +233 -0
  21. package/dist/css/tokens.css +439 -0
  22. package/dist/index.d.ts +279 -24
  23. package/dist/index.js +1513 -584
  24. package/dist/index.js.map +1 -1
  25. package/dist/styles.css +1 -1
  26. package/dist/testing/index.cjs +458 -0
  27. package/dist/testing/index.d.cts +253 -0
  28. package/dist/testing/index.d.ts +253 -0
  29. package/dist/testing/index.js +452 -0
  30. package/dist/testing/setup.cjs +123 -0
  31. package/dist/testing/setup.js +121 -0
  32. package/dist/testing/style-stub.cjs +7 -0
  33. package/dist/testing/style-stub.js +5 -0
  34. package/dist/tokens/index.d.ts +96 -96
  35. package/dist/tokens/index.js +48 -48
  36. package/dist/tokens/index.js.map +1 -1
  37. package/package.json +73 -5
package/dist/css/legacy-aliases.css ADDED
@@ -0,0 +1,489 @@
1
+ /* GENERATED FILE — do not edit.
2
+ * Read-aliases from today's token names to the namespaced ones (ADR-004 rule 9).
3
+ * Import this for as long as the app's own CSS or inline styles read DS token
4
+ * names by their un-namespaced spelling. Writing one still needs the compat
5
+ * bridge of ADR-004 rule 7.
6
+ * Source: tokens/src (DTCG, ADR-003). Generator: tokens/build/generate-ds-css.mjs.
7
+ * Change the token files and run `pnpm tokens:build`; `pnpm tokens:check` fails
8
+ * when this file is out of date. */
9
+
10
+ @layer theme, base, ds, components, utilities;
11
+
12
+ :root {
13
+ --color-bg: var(--ds-color-canvas);
14
+ --color-bg-2: var(--ds-color-canvas-sunken);
15
+ --color-bg-3: var(--ds-color-canvas-sunken-strong);
16
+ --color-surface: var(--ds-color-surface);
17
+ --color-surface-2: var(--ds-color-surface-sunken);
18
+ --color-surface-3: var(--ds-color-surface-sunken-strong);
19
+ --color-fg: var(--ds-color-content);
20
+ --color-fg-2: var(--ds-color-content-secondary);
21
+ --color-fg-3: var(--ds-color-content-muted);
22
+ --color-fg-4: var(--ds-color-content-subtle);
23
+ --color-fg-5: var(--ds-color-content-faint);
24
+ --color-rule: var(--ds-color-border);
25
+ --color-rule-soft: var(--ds-color-border-subtle);
26
+ --color-rule-strong: var(--ds-color-border-strong);
27
+ --color-accent: var(--ds-color-action-accent-bg);
28
+ --color-accent-2: var(--ds-color-action-accent-bg-strong);
29
+ --color-accent-tint: var(--ds-color-action-accent-subtle-bg);
30
+ --color-accent-hover: var(--ds-color-action-accent-bg-hover);
31
+ --color-accent-active: var(--ds-color-action-accent-bg-active);
32
+ --color-accent-ring: var(--ds-color-action-accent-ring);
33
+ --color-suite-action: var(--ds-color-action-suite-bg);
34
+ --color-suite-action-hover: var(--ds-color-action-suite-bg-hover);
35
+ --color-suite-action-active: var(--ds-color-action-suite-bg-active);
36
+ --color-fg-on-suite-action: var(--ds-color-action-suite-fg);
37
+ --color-pro-bg: var(--ds-ref-brand-pro-bg);
38
+ --color-pro-bg-hover: var(--ds-ref-brand-pro-bg-hover);
39
+ --color-pro-bg-active: var(--ds-ref-brand-pro-bg-active);
40
+ --color-pro-fg: var(--ds-ref-brand-pro-fg);
41
+ --color-pro-hover: var(--ds-ref-brand-pro-fg-hover);
42
+ --color-pro-active: var(--ds-ref-brand-pro-fg-active);
43
+ --color-pro-disabled: var(--ds-ref-brand-pro-fg-disabled);
44
+ --color-pro-line: var(--ds-ref-brand-pro-border);
45
+ --color-pro-ring: var(--ds-ref-brand-pro-ring);
46
+ --color-brand: var(--ds-color-action-brand-bg);
47
+ --color-brand-hover: var(--ds-color-action-brand-bg-hover);
48
+ --color-brand-active: var(--ds-color-action-brand-bg-active);
49
+ --color-brand-disabled: var(--ds-color-action-brand-bg-disabled);
50
+ --color-brand-bg: var(--ds-color-action-brand-subtle-bg);
51
+ --color-brand-bg-hover: var(--ds-color-action-brand-subtle-bg-hover);
52
+ --color-brand-bg-active: var(--ds-color-action-brand-subtle-bg-active);
53
+ --color-brand-line: var(--ds-color-action-brand-border);
54
+ --color-brand-ring: var(--ds-color-action-brand-ring);
55
+ --color-fg-on-brand: var(--ds-color-action-brand-fg);
56
+ --color-brand-pro: var(--ds-ref-brand-pro-seed);
57
+ --color-brand-audit: var(--ds-ref-brand-audit-seed);
58
+ --color-brand-books: var(--ds-ref-brand-books-seed);
59
+ --color-brand-tax: var(--ds-ref-brand-tax-seed);
60
+ --color-audit-fg: var(--ds-ref-brand-audit-fg);
61
+ --color-audit-hover: var(--ds-ref-brand-audit-fg-hover);
62
+ --color-audit-active: var(--ds-ref-brand-audit-fg-active);
63
+ --color-audit-disabled: var(--ds-ref-brand-audit-fg-disabled);
64
+ --color-audit-bg: var(--ds-ref-brand-audit-bg);
65
+ --color-audit-bg-hover: var(--ds-ref-brand-audit-bg-hover);
66
+ --color-audit-bg-active: var(--ds-ref-brand-audit-bg-active);
67
+ --color-audit-line: var(--ds-ref-brand-audit-border);
68
+ --color-audit-ring: var(--ds-ref-brand-audit-ring);
69
+ --color-fg-on-audit: var(--ds-ref-brand-audit-on-fg);
70
+ --color-books-fg: var(--ds-ref-brand-books-fg);
71
+ --color-books-hover: var(--ds-ref-brand-books-fg-hover);
72
+ --color-books-active: var(--ds-ref-brand-books-fg-active);
73
+ --color-books-disabled: var(--ds-ref-brand-books-fg-disabled);
74
+ --color-books-bg: var(--ds-ref-brand-books-bg);
75
+ --color-books-bg-hover: var(--ds-ref-brand-books-bg-hover);
76
+ --color-books-bg-active: var(--ds-ref-brand-books-bg-active);
77
+ --color-books-line: var(--ds-ref-brand-books-border);
78
+ --color-books-ring: var(--ds-ref-brand-books-ring);
79
+ --color-fg-on-books: var(--ds-ref-brand-books-on-fg);
80
+ --color-tax-fg: var(--ds-ref-brand-tax-fg);
81
+ --color-tax-hover: var(--ds-ref-brand-tax-fg-hover);
82
+ --color-tax-active: var(--ds-ref-brand-tax-fg-active);
83
+ --color-tax-disabled: var(--ds-ref-brand-tax-fg-disabled);
84
+ --color-tax-bg: var(--ds-ref-brand-tax-bg);
85
+ --color-tax-bg-hover: var(--ds-ref-brand-tax-bg-hover);
86
+ --color-tax-bg-active: var(--ds-ref-brand-tax-bg-active);
87
+ --color-tax-line: var(--ds-ref-brand-tax-border);
88
+ --color-tax-ring: var(--ds-ref-brand-tax-ring);
89
+ --color-fg-on-tax: var(--ds-ref-brand-tax-on-fg);
90
+ --gradient-brand: var(--ds-gradient-brand);
91
+ --gradient-pro: var(--ds-ref-gradient-brand-pro);
92
+ --gradient-audit: var(--ds-ref-gradient-brand-audit);
93
+ --gradient-books: var(--ds-ref-gradient-brand-books);
94
+ --gradient-tax: var(--ds-ref-gradient-brand-tax);
95
+ --gradient-ai: var(--ds-gradient-ai);
96
+ --color-fg-on-accent: var(--ds-color-action-accent-fg);
97
+ --color-fg-on-pro: var(--ds-ref-brand-pro-on-fg);
98
+ --color-fg-on-danger: var(--ds-color-feedback-danger-solid-fg);
99
+ --color-fg-on-success: var(--ds-color-feedback-success-solid-fg);
100
+ --color-fg-on-selection: var(--ds-selection-fg);
101
+ --color-fg-disabled: var(--ds-color-content-disabled);
102
+ --color-bg-disabled: var(--ds-color-state-disabled-bg);
103
+ --color-overlay-hover: var(--ds-color-state-hover);
104
+ --color-overlay-active: var(--ds-color-state-active);
105
+ --color-control-bg: var(--ds-control-bg);
106
+ --color-control-fg: var(--ds-control-fg);
107
+ --color-control-muted-fg: var(--ds-control-muted-fg);
108
+ --color-control-hover-bg: var(--ds-control-hover-bg);
109
+ --color-control-hover-fg: var(--ds-control-hover-fg);
110
+ --color-control-active-bg: var(--ds-control-active-bg);
111
+ --color-control-border: var(--ds-control-border);
112
+ --color-control-border-strong: var(--ds-control-border-strong);
113
+ --color-control-border-hover: var(--ds-control-border-hover);
114
+ --color-control-secondary-bg: var(--ds-control-neutral-bg);
115
+ --color-control-destructive-fg: var(--ds-control-danger-fg);
116
+ --color-control-destructive-hover-bg: var(--ds-control-danger-hover-bg);
117
+ --color-menu-bg: var(--ds-menu-bg);
118
+ --color-menu-fg: var(--ds-menu-fg);
119
+ --color-menu-border: var(--ds-menu-border);
120
+ --color-menu-label-fg: var(--ds-menu-label-fg);
121
+ --color-menu-item-fg: var(--ds-menu-item-fg);
122
+ --color-menu-item-hover-bg: var(--ds-menu-item-hover-bg);
123
+ --color-menu-item-hover-fg: var(--ds-menu-item-hover-fg);
124
+ --color-menu-item-destructive-fg: var(--ds-menu-item-danger-fg);
125
+ --color-menu-item-destructive-hover-bg: var(--ds-menu-item-danger-hover-bg);
126
+ --color-menu-item-destructive-hover-fg: var(--ds-menu-item-danger-hover-fg);
127
+ --color-menu-shortcut-fg: var(--ds-menu-shortcut-fg);
128
+ --color-selection-floating-bg: var(--ds-selection-floating-bg);
129
+ --color-selection-floating-fg: var(--ds-selection-floating-fg);
130
+ --color-selection-floating-muted-fg: var(--ds-selection-floating-muted-fg);
131
+ --color-selection-floating-hover-bg: var(--ds-selection-floating-hover-bg);
132
+ --color-selection-floating-active-bg: var(--ds-selection-floating-active-bg);
133
+ --color-selection-floating-rule: var(--ds-selection-floating-border);
134
+ --color-success-fg: var(--ds-color-feedback-success-fg);
135
+ --color-success-fg-hover: var(--ds-color-feedback-success-fg-hover);
136
+ --color-success-fg-active: var(--ds-color-feedback-success-fg-active);
137
+ --color-success-bg: var(--ds-color-feedback-success-bg);
138
+ --color-success-line: var(--ds-color-feedback-success-border);
139
+ --color-warning-fg: var(--ds-color-feedback-warning-fg);
140
+ --color-warning-bg: var(--ds-color-feedback-warning-bg);
141
+ --color-warning-line: var(--ds-color-feedback-warning-border);
142
+ --color-danger-fg: var(--ds-color-feedback-danger-fg);
143
+ --color-danger-fg-hover: var(--ds-color-feedback-danger-fg-hover);
144
+ --color-danger-fg-active: var(--ds-color-feedback-danger-fg-active);
145
+ --color-danger-bg: var(--ds-color-feedback-danger-bg);
146
+ --color-danger-line: var(--ds-color-feedback-danger-border);
147
+ --color-priority-low: var(--ds-color-priority-low);
148
+ --color-priority-medium: var(--ds-color-priority-medium);
149
+ --color-priority-high: var(--ds-color-priority-high);
150
+ --color-priority-urgent: var(--ds-color-priority-urgent);
151
+ --focus-ring-color: var(--ds-focus-ring-color);
152
+ --focus-ring-border: var(--ds-focus-ring-border);
153
+ --color-chart-1: var(--ds-color-chart-1);
154
+ --color-chart-2: var(--ds-color-chart-2);
155
+ --color-chart-3: var(--ds-color-chart-3);
156
+ --color-chart-4: var(--ds-color-chart-4);
157
+ --color-chart-line: var(--ds-color-chart-line);
158
+ --color-chart-area-from: var(--ds-color-chart-area-from);
159
+ --color-chart-area-to: var(--ds-color-chart-area-to);
160
+ --color-service-tax: var(--ds-color-service-tax);
161
+ --color-service-tax-bg: var(--ds-color-service-tax-bg);
162
+ --color-service-audit: var(--ds-color-service-audit);
163
+ --color-service-audit-bg: var(--ds-color-service-audit-bg);
164
+ --color-service-accounting: var(--ds-color-service-accounting);
165
+ --color-service-accounting-bg: var(--ds-color-service-accounting-bg);
166
+ --shadow-focus-ring: var(--ds-shadow-focus-ring);
167
+ --shadow-quiet: var(--ds-shadow-quiet);
168
+ --shadow-card: var(--ds-shadow-card);
169
+ --shadow-pop: var(--ds-shadow-pop);
170
+ --shadow-xs: var(--ds-ref-shadow-xs);
171
+ --shadow-sm: var(--ds-ref-shadow-sm);
172
+ --shadow-md: var(--ds-ref-shadow-md);
173
+ --shadow-lg: var(--ds-ref-shadow-lg);
174
+ --shadow-xl: var(--ds-ref-shadow-xl);
175
+ --shadow-2xl: var(--ds-ref-shadow-2xl);
176
+ --font-display: var(--ds-font-display);
177
+ --font-body: var(--ds-font-body);
178
+ --font-mono: var(--ds-font-mono);
179
+ --font-sans: var(--ds-font-sans);
180
+ --font-weight-regular: var(--ds-ref-font-weight-regular);
181
+ --font-weight-medium: var(--ds-ref-font-weight-medium);
182
+ --font-weight-semibold: var(--ds-ref-font-weight-semibold);
183
+ --font-weight-bold: var(--ds-ref-font-weight-bold);
184
+ --radius-btn: var(--ds-radius-control);
185
+ --radius-input: var(--ds-radius-control);
186
+ --radius-pill: var(--ds-radius-chip);
187
+ --radius-card: var(--ds-radius-surface);
188
+ --radius-icon: var(--ds-radius-badge);
189
+ --radius-full: var(--ds-radius-full);
190
+ --ease-out-quart: var(--ds-ref-ease-enter);
191
+ --ease-out: var(--ds-ref-ease-emphasized);
192
+ --ease-in: var(--ds-ref-ease-exit);
193
+ --ease-in-out: var(--ds-ref-ease-standard);
194
+ --duration-instant: var(--ds-ref-duration-instant);
195
+ --duration-fast: var(--ds-ref-duration-fast);
196
+ --duration-overlay: var(--ds-ref-duration-moderate);
197
+ --duration-normal: var(--ds-ref-duration-slow);
198
+ --duration-slow: var(--ds-ref-duration-slower);
199
+ --motion-duration-press: var(--ds-motion-duration-press);
200
+ --motion-duration-feedback: var(--ds-motion-duration-feedback);
201
+ --motion-duration-overlay: var(--ds-motion-duration-overlay);
202
+ --motion-duration-spatial: var(--ds-motion-duration-spatial);
203
+ --motion-duration-deliberate: var(--ds-motion-duration-deliberate);
204
+ --motion-ease-enter: var(--ds-motion-ease-enter);
205
+ --motion-ease-exit: var(--ds-motion-ease-exit);
206
+ --motion-ease-move: var(--ds-motion-ease-move);
207
+ --shell-sidebar-w: var(--ds-layout-shell-sidebar-width);
208
+ --shell-sidebar-w-rail: var(--ds-layout-shell-sidebar-rail-width);
209
+ --shell-header-h: var(--ds-layout-shell-header-height);
210
+ --content-pad: var(--ds-layout-content-padding);
211
+ --animate-accordion-down: var(--ds-animate-accordion-down);
212
+ --animate-accordion-up: var(--ds-animate-accordion-up);
213
+ --animate-collapsible-down: var(--ds-animate-collapsible-down);
214
+ --animate-collapsible-up: var(--ds-animate-collapsible-up);
215
+ --z-base: var(--ds-z-base);
216
+ --z-sticky: var(--ds-z-sticky);
217
+ --z-overlay: var(--ds-z-overlay);
218
+ --z-modal: var(--ds-z-modal);
219
+ --z-dropdown: var(--ds-z-popover);
220
+ --z-toast: var(--ds-z-toast);
221
+ --z-tooltip: var(--ds-z-tooltip);
222
+ --color-background: var(--ds-color-canvas);
223
+ --color-foreground: var(--ds-color-content);
224
+ --color-card: var(--ds-color-surface);
225
+ --color-card-foreground: var(--ds-color-content);
226
+ --color-popover: var(--ds-color-surface);
227
+ --color-popover-foreground: var(--ds-color-content);
228
+ --color-primary: var(--ds-color-action-brand-bg);
229
+ --color-primary-foreground: var(--ds-color-action-brand-fg);
230
+ --color-secondary: var(--ds-color-canvas-sunken);
231
+ --color-secondary-foreground: var(--ds-color-content-secondary);
232
+ --color-muted: var(--ds-color-canvas-sunken);
233
+ --color-muted-foreground: var(--ds-color-content-muted);
234
+ --color-accent-foreground: var(--ds-color-action-accent-fg);
235
+ --color-destructive: var(--ds-color-feedback-danger-fg);
236
+ --color-destructive-foreground: var(--ds-compat-color-destructive-foreground);
237
+ --color-success: var(--ds-color-feedback-success-fg);
238
+ --color-success-foreground: var(--ds-compat-color-success-foreground);
239
+ --color-warning: var(--ds-color-feedback-warning-fg);
240
+ --color-info: var(--ds-color-feedback-info-fg);
241
+ --color-brand-foreground: var(--ds-color-action-brand-fg);
242
+ --color-brand-soft: var(--ds-compat-color-brand-soft);
243
+ --color-brand-soft-foreground: var(--ds-compat-color-brand-soft-foreground);
244
+ --color-border: var(--ds-color-border);
245
+ --color-input: var(--ds-color-border-strong);
246
+ --color-input-background: var(--ds-color-surface);
247
+ --color-ring: var(--ds-color-border-focus);
248
+ --color-switch-background: var(--ds-color-canvas-sunken-strong);
249
+ --color-menu: var(--ds-color-surface);
250
+ --color-overlay: var(--ds-color-scrim);
251
+ --color-canvas: var(--ds-color-canvas);
252
+ --color-green-action: var(--ds-color-feedback-success-fg);
253
+ --color-green-dark: var(--ds-compat-color-green-dark);
254
+ --color-green-badge-bg: var(--ds-color-feedback-success-bg);
255
+ --color-green-light-border: var(--ds-color-feedback-success-border);
256
+ --color-green-lighter-bg: var(--ds-color-feedback-success-bg);
257
+ --color-blue-link: var(--ds-color-content-link);
258
+ --color-red-action: var(--ds-color-feedback-danger-fg);
259
+ --color-amber-dark: var(--ds-color-feedback-warning-fg);
260
+ --color-app-gray-400: var(--ds-color-content-subtle);
261
+ --color-app-gray-track: var(--ds-color-canvas-sunken-strong);
262
+ --radius-md: var(--ds-compat-radius-md);
263
+ --radius-lg: var(--ds-compat-radius-lg);
264
+ --radius-xl: var(--ds-compat-radius-xl);
265
+ --radius-cards: var(--ds-radius-surface);
266
+ --radius-badges: var(--ds-radius-full);
267
+ --radius-inputs: var(--ds-radius-control);
268
+ --radius-buttons: var(--ds-radius-control);
269
+ --radius-general: var(--ds-radius-chip);
270
+ --shadow-subtle: var(--ds-shadow-quiet);
271
+ --shadow-focus: var(--ds-shadow-focus-ring);
272
+ }
273
+
274
+ [data-ds-scheme="dark"],
275
+ .dark {
276
+ --color-bg: var(--ds-color-canvas);
277
+ --color-bg-2: var(--ds-color-canvas-sunken);
278
+ --color-bg-3: var(--ds-color-canvas-sunken-strong);
279
+ --color-surface: var(--ds-color-surface);
280
+ --color-surface-2: var(--ds-color-surface-sunken);
281
+ --color-surface-3: var(--ds-color-surface-sunken-strong);
282
+ --color-fg: var(--ds-color-content);
283
+ --color-fg-2: var(--ds-color-content-secondary);
284
+ --color-fg-3: var(--ds-color-content-muted);
285
+ --color-fg-4: var(--ds-color-content-subtle);
286
+ --color-fg-5: var(--ds-color-content-faint);
287
+ --color-rule: var(--ds-color-border);
288
+ --color-rule-soft: var(--ds-color-border-subtle);
289
+ --color-rule-strong: var(--ds-color-border-strong);
290
+ --color-accent: var(--ds-color-action-accent-bg);
291
+ --color-accent-2: var(--ds-color-action-accent-bg-strong);
292
+ --color-accent-tint: var(--ds-color-action-accent-subtle-bg);
293
+ --color-accent-hover: var(--ds-color-action-accent-bg-hover);
294
+ --color-accent-active: var(--ds-color-action-accent-bg-active);
295
+ --color-suite-action: var(--ds-color-action-suite-bg);
296
+ --color-suite-action-hover: var(--ds-color-action-suite-bg-hover);
297
+ --color-suite-action-active: var(--ds-color-action-suite-bg-active);
298
+ --color-fg-on-suite-action: var(--ds-color-action-suite-fg);
299
+ --color-brand: var(--ds-color-action-brand-bg);
300
+ --color-brand-soft: var(--ds-compat-color-brand-soft);
301
+ --color-brand-soft-foreground: var(--ds-compat-color-brand-soft-foreground);
302
+ --color-pro-bg: var(--ds-ref-brand-pro-bg);
303
+ --color-pro-bg-hover: var(--ds-ref-brand-pro-bg-hover);
304
+ --color-pro-bg-active: var(--ds-ref-brand-pro-bg-active);
305
+ --color-pro-fg: var(--ds-ref-brand-pro-fg);
306
+ --color-pro-hover: var(--ds-ref-brand-pro-fg-hover);
307
+ --color-pro-active: var(--ds-ref-brand-pro-fg-active);
308
+ --color-pro-line: var(--ds-ref-brand-pro-border);
309
+ --color-brand-pro: var(--ds-ref-brand-pro-seed);
310
+ --color-brand-audit: var(--ds-ref-brand-audit-seed);
311
+ --color-brand-books: var(--ds-ref-brand-books-seed);
312
+ --color-brand-tax: var(--ds-ref-brand-tax-seed);
313
+ --color-audit-fg: var(--ds-ref-brand-audit-fg);
314
+ --color-audit-hover: var(--ds-ref-brand-audit-fg-hover);
315
+ --color-audit-active: var(--ds-ref-brand-audit-fg-active);
316
+ --color-audit-disabled: var(--ds-ref-brand-audit-fg-disabled);
317
+ --color-audit-bg: var(--ds-ref-brand-audit-bg);
318
+ --color-audit-bg-hover: var(--ds-ref-brand-audit-bg-hover);
319
+ --color-audit-bg-active: var(--ds-ref-brand-audit-bg-active);
320
+ --color-audit-line: var(--ds-ref-brand-audit-border);
321
+ --color-audit-ring: var(--ds-ref-brand-audit-ring);
322
+ --color-fg-on-audit: var(--ds-ref-brand-audit-on-fg);
323
+ --color-books-fg: var(--ds-ref-brand-books-fg);
324
+ --color-books-hover: var(--ds-ref-brand-books-fg-hover);
325
+ --color-books-active: var(--ds-ref-brand-books-fg-active);
326
+ --color-books-disabled: var(--ds-ref-brand-books-fg-disabled);
327
+ --color-books-bg: var(--ds-ref-brand-books-bg);
328
+ --color-books-bg-hover: var(--ds-ref-brand-books-bg-hover);
329
+ --color-books-bg-active: var(--ds-ref-brand-books-bg-active);
330
+ --color-books-line: var(--ds-ref-brand-books-border);
331
+ --color-books-ring: var(--ds-ref-brand-books-ring);
332
+ --color-fg-on-books: var(--ds-ref-brand-books-on-fg);
333
+ --color-tax-fg: var(--ds-ref-brand-tax-fg);
334
+ --color-tax-hover: var(--ds-ref-brand-tax-fg-hover);
335
+ --color-tax-active: var(--ds-ref-brand-tax-fg-active);
336
+ --color-tax-disabled: var(--ds-ref-brand-tax-fg-disabled);
337
+ --color-tax-bg: var(--ds-ref-brand-tax-bg);
338
+ --color-tax-bg-hover: var(--ds-ref-brand-tax-bg-hover);
339
+ --color-tax-bg-active: var(--ds-ref-brand-tax-bg-active);
340
+ --color-tax-line: var(--ds-ref-brand-tax-border);
341
+ --color-tax-ring: var(--ds-ref-brand-tax-ring);
342
+ --color-fg-on-tax: var(--ds-ref-brand-tax-on-fg);
343
+ --color-fg-disabled: var(--ds-color-content-disabled);
344
+ --color-bg-disabled: var(--ds-color-state-disabled-bg);
345
+ --color-overlay-hover: var(--ds-color-state-hover);
346
+ --color-overlay-active: var(--ds-color-state-active);
347
+ --color-fg-on-accent: var(--ds-color-action-accent-fg);
348
+ --color-fg-on-pro: var(--ds-ref-brand-pro-on-fg);
349
+ --color-fg-on-danger: var(--ds-color-feedback-danger-solid-fg);
350
+ --color-fg-on-success: var(--ds-color-feedback-success-solid-fg);
351
+ --color-success-fg: var(--ds-color-feedback-success-fg);
352
+ --color-success-fg-hover: var(--ds-color-feedback-success-fg-hover);
353
+ --color-success-fg-active: var(--ds-color-feedback-success-fg-active);
354
+ --color-success-bg: var(--ds-color-feedback-success-bg);
355
+ --color-success-line: var(--ds-color-feedback-success-border);
356
+ --color-warning-fg: var(--ds-color-feedback-warning-fg);
357
+ --color-warning-bg: var(--ds-color-feedback-warning-bg);
358
+ --color-warning-line: var(--ds-color-feedback-warning-border);
359
+ --color-danger-fg: var(--ds-color-feedback-danger-fg);
360
+ --color-danger-fg-hover: var(--ds-color-feedback-danger-fg-hover);
361
+ --color-danger-fg-active: var(--ds-color-feedback-danger-fg-active);
362
+ --color-danger-bg: var(--ds-color-feedback-danger-bg);
363
+ --color-danger-line: var(--ds-color-feedback-danger-border);
364
+ --color-priority-low: var(--ds-color-priority-low);
365
+ --color-priority-medium: var(--ds-color-priority-medium);
366
+ --color-priority-high: var(--ds-color-priority-high);
367
+ --color-chart-1: var(--ds-color-chart-1);
368
+ --color-chart-2: var(--ds-color-chart-2);
369
+ --color-chart-3: var(--ds-color-chart-3);
370
+ --color-chart-4: var(--ds-color-chart-4);
371
+ --color-chart-line: var(--ds-color-chart-line);
372
+ --color-chart-area-from: var(--ds-color-chart-area-from);
373
+ --color-chart-area-to: var(--ds-color-chart-area-to);
374
+ --color-service-tax: var(--ds-color-service-tax);
375
+ --color-service-tax-bg: var(--ds-color-service-tax-bg);
376
+ --color-service-audit: var(--ds-color-service-audit);
377
+ --color-service-audit-bg: var(--ds-color-service-audit-bg);
378
+ --color-service-accounting: var(--ds-color-service-accounting);
379
+ --color-service-accounting-bg: var(--ds-color-service-accounting-bg);
380
+ --shadow-quiet: var(--ds-shadow-quiet);
381
+ --shadow-card: var(--ds-shadow-card);
382
+ --shadow-pop: var(--ds-shadow-pop);
383
+ --shadow-xs: var(--ds-ref-shadow-xs);
384
+ --shadow-sm: var(--ds-ref-shadow-sm);
385
+ --shadow-md: var(--ds-ref-shadow-md);
386
+ --shadow-lg: var(--ds-ref-shadow-lg);
387
+ --shadow-xl: var(--ds-ref-shadow-xl);
388
+ --shadow-2xl: var(--ds-ref-shadow-2xl);
389
+ }
390
+
391
+ [data-ds-brand="pro"],
392
+ [data-brand="pro"] {
393
+ --color-brand: var(--ds-color-action-brand-bg);
394
+ --color-brand-hover: var(--ds-color-action-brand-bg-hover);
395
+ --color-brand-active: var(--ds-color-action-brand-bg-active);
396
+ --color-brand-disabled: var(--ds-color-action-brand-bg-disabled);
397
+ --color-brand-bg: var(--ds-color-action-brand-subtle-bg);
398
+ --color-brand-bg-hover: var(--ds-color-action-brand-subtle-bg-hover);
399
+ --color-brand-bg-active: var(--ds-color-action-brand-subtle-bg-active);
400
+ --color-brand-line: var(--ds-color-action-brand-border);
401
+ --color-brand-ring: var(--ds-color-action-brand-ring);
402
+ --color-fg-on-brand: var(--ds-color-action-brand-fg);
403
+ --color-accent: var(--ds-color-action-accent-bg);
404
+ --color-accent-2: var(--ds-color-action-accent-bg-strong);
405
+ --color-accent-hover: var(--ds-color-action-accent-bg-hover);
406
+ --color-accent-active: var(--ds-color-action-accent-bg-active);
407
+ --color-accent-tint: var(--ds-color-action-accent-subtle-bg);
408
+ --color-accent-ring: var(--ds-color-action-accent-ring);
409
+ --color-fg-on-accent: var(--ds-color-action-accent-fg);
410
+ --focus-ring-color: var(--ds-focus-ring-color);
411
+ --focus-ring-border: var(--ds-focus-ring-border);
412
+ --color-primary: var(--ds-color-action-brand-bg);
413
+ --color-primary-foreground: var(--ds-color-action-brand-fg);
414
+ }
415
+
416
+ [data-ds-brand="audit"],
417
+ [data-brand="audit"] {
418
+ --color-brand: var(--ds-color-action-brand-bg);
419
+ --color-brand-hover: var(--ds-color-action-brand-bg-hover);
420
+ --color-brand-active: var(--ds-color-action-brand-bg-active);
421
+ --color-brand-disabled: var(--ds-color-action-brand-bg-disabled);
422
+ --color-brand-bg: var(--ds-color-action-brand-subtle-bg);
423
+ --color-brand-bg-hover: var(--ds-color-action-brand-subtle-bg-hover);
424
+ --color-brand-bg-active: var(--ds-color-action-brand-subtle-bg-active);
425
+ --color-brand-line: var(--ds-color-action-brand-border);
426
+ --color-brand-ring: var(--ds-color-action-brand-ring);
427
+ --color-fg-on-brand: var(--ds-color-action-brand-fg);
428
+ --color-accent: var(--ds-color-action-accent-bg);
429
+ --color-accent-2: var(--ds-color-action-accent-bg-strong);
430
+ --color-accent-hover: var(--ds-color-action-accent-bg-hover);
431
+ --color-accent-active: var(--ds-color-action-accent-bg-active);
432
+ --color-accent-tint: var(--ds-color-action-accent-subtle-bg);
433
+ --color-accent-ring: var(--ds-color-action-accent-ring);
434
+ --color-fg-on-accent: var(--ds-color-action-accent-fg);
435
+ --focus-ring-color: var(--ds-focus-ring-color);
436
+ --focus-ring-border: var(--ds-focus-ring-border);
437
+ --color-primary: var(--ds-color-action-brand-bg);
438
+ --color-primary-foreground: var(--ds-color-action-brand-fg);
439
+ }
440
+
441
+ [data-ds-brand="books"],
442
+ [data-brand="books"] {
443
+ --color-brand: var(--ds-color-action-brand-bg);
444
+ --color-brand-hover: var(--ds-color-action-brand-bg-hover);
445
+ --color-brand-active: var(--ds-color-action-brand-bg-active);
446
+ --color-brand-disabled: var(--ds-color-action-brand-bg-disabled);
447
+ --color-brand-bg: var(--ds-color-action-brand-subtle-bg);
448
+ --color-brand-bg-hover: var(--ds-color-action-brand-subtle-bg-hover);
449
+ --color-brand-bg-active: var(--ds-color-action-brand-subtle-bg-active);
450
+ --color-brand-line: var(--ds-color-action-brand-border);
451
+ --color-brand-ring: var(--ds-color-action-brand-ring);
452
+ --color-fg-on-brand: var(--ds-color-action-brand-fg);
453
+ --color-accent: var(--ds-color-action-accent-bg);
454
+ --color-accent-2: var(--ds-color-action-accent-bg-strong);
455
+ --color-accent-hover: var(--ds-color-action-accent-bg-hover);
456
+ --color-accent-active: var(--ds-color-action-accent-bg-active);
457
+ --color-accent-tint: var(--ds-color-action-accent-subtle-bg);
458
+ --color-accent-ring: var(--ds-color-action-accent-ring);
459
+ --color-fg-on-accent: var(--ds-color-action-accent-fg);
460
+ --focus-ring-color: var(--ds-focus-ring-color);
461
+ --focus-ring-border: var(--ds-focus-ring-border);
462
+ --color-primary: var(--ds-color-action-brand-bg);
463
+ --color-primary-foreground: var(--ds-color-action-brand-fg);
464
+ }
465
+
466
+ [data-ds-brand="tax"],
467
+ [data-brand="tax"] {
468
+ --color-brand: var(--ds-color-action-brand-bg);
469
+ --color-brand-hover: var(--ds-color-action-brand-bg-hover);
470
+ --color-brand-active: var(--ds-color-action-brand-bg-active);
471
+ --color-brand-disabled: var(--ds-color-action-brand-bg-disabled);
472
+ --color-brand-bg: var(--ds-color-action-brand-subtle-bg);
473
+ --color-brand-bg-hover: var(--ds-color-action-brand-subtle-bg-hover);
474
+ --color-brand-bg-active: var(--ds-color-action-brand-subtle-bg-active);
475
+ --color-brand-line: var(--ds-color-action-brand-border);
476
+ --color-brand-ring: var(--ds-color-action-brand-ring);
477
+ --color-fg-on-brand: var(--ds-color-action-brand-fg);
478
+ --color-accent: var(--ds-color-action-accent-bg);
479
+ --color-accent-2: var(--ds-color-action-accent-bg-strong);
480
+ --color-accent-hover: var(--ds-color-action-accent-bg-hover);
481
+ --color-accent-active: var(--ds-color-action-accent-bg-active);
482
+ --color-accent-tint: var(--ds-color-action-accent-subtle-bg);
483
+ --color-accent-ring: var(--ds-color-action-accent-ring);
484
+ --color-fg-on-accent: var(--ds-color-action-accent-fg);
485
+ --focus-ring-color: var(--ds-focus-ring-color);
486
+ --focus-ring-border: var(--ds-focus-ring-border);
487
+ --color-primary: var(--ds-color-action-brand-bg);
488
+ --color-primary-foreground: var(--ds-color-action-brand-fg);
489
+ }
package/dist/css/shadcn.css ADDED
@@ -0,0 +1,155 @@
1
+ /* GENERATED FILE — do not edit.
2
+ * The app-vocabulary bridge (ADR-005): the shadcn-style theme keys consuming
3
+ * applications write, defined once here instead of copied into every app's
4
+ * globals.css. Each key reads one `--app-*` input and falls back to a DS token,
5
+ * so an app changes a meaning by setting that input — and nothing else.
6
+ * Optional: import it after css/tokens.css, and only if the app uses this
7
+ * vocabulary. The file declares no custom property of its own.
8
+ * Source: tokens/src/bridges/shadcn.map.json. Generator:
9
+ * tokens/build/generate-shadcn-bridge.mjs. Change the map and run
10
+ * `pnpm tokens:build`; `pnpm tokens:check` fails when this file is out of date.
11
+ *
12
+ * The inputs an app may set, and what each falls back to:
13
+ * --app-background var(--ds-color-canvas)
14
+ * --app-foreground var(--ds-color-content)
15
+ * --app-card var(--ds-color-surface)
16
+ * --app-card-foreground var(--ds-color-content)
17
+ * --app-popover var(--ds-color-surface)
18
+ * --app-popover-foreground var(--ds-color-content)
19
+ * --app-surface-2 var(--ds-color-surface-sunken)
20
+ * --app-surface-3 var(--ds-color-surface-sunken-strong)
21
+ * --app-muted var(--ds-color-canvas-sunken)
22
+ * --app-muted-foreground var(--ds-color-content-muted)
23
+ * --app-overlay var(--ds-color-scrim)
24
+ * --app-primary var(--ds-color-action-brand-bg)
25
+ * --app-primary-foreground var(--ds-color-action-brand-fg)
26
+ * --app-secondary var(--ds-color-canvas-sunken)
27
+ * --app-secondary-foreground var(--ds-color-content-secondary)
28
+ * --app-accent var(--ds-color-action-brand-subtle-bg)
29
+ * --app-accent-foreground var(--ds-compat-color-brand-soft-foreground)
30
+ * --app-brand var(--ds-color-action-brand-bg)
31
+ * --app-brand-foreground var(--ds-color-action-brand-fg)
32
+ * --app-brand-hover var(--ds-color-action-brand-bg-hover)
33
+ * --app-brand-soft var(--ds-compat-color-brand-soft)
34
+ * --app-brand-soft-foreground var(--ds-compat-color-brand-soft-foreground)
35
+ * --app-brand-soft-hover var(--ds-color-action-brand-subtle-bg-hover)
36
+ * --app-brand-ring var(--ds-color-action-brand-ring)
37
+ * --app-destructive var(--ds-color-feedback-danger-fg)
38
+ * --app-destructive-solid var(--ds-color-feedback-danger-fg)
39
+ * --app-success var(--ds-color-feedback-success-fg)
40
+ * --app-success-solid var(--ds-color-feedback-success-fg)
41
+ * --app-warning var(--ds-color-feedback-warning-fg)
42
+ * --app-warning-solid var(--ds-color-feedback-warning-fg)
43
+ * --app-info var(--ds-color-feedback-info-fg)
44
+ * --app-info-solid var(--ds-color-feedback-info-fg)
45
+ * --app-destructive-foreground var(--ds-compat-color-destructive-foreground)
46
+ * --app-success-foreground var(--ds-compat-color-success-foreground)
47
+ * --app-warning-foreground var(--ds-color-canvas)
48
+ * --app-info-foreground var(--ds-color-canvas)
49
+ * --app-border var(--ds-color-border)
50
+ * --app-input var(--ds-color-border-strong)
51
+ * --app-input-background var(--ds-color-surface)
52
+ * --app-switch-background var(--ds-color-canvas-sunken-strong)
53
+ * --app-ring var(--ds-color-border-focus)
54
+ * --app-chart-1 var(--ds-color-chart-1)
55
+ * --app-chart-2 var(--ds-color-chart-2)
56
+ * --app-chart-3 var(--ds-color-chart-3)
57
+ * --app-chart-4 var(--ds-color-chart-4)
58
+ * --app-chart-5 var(--ds-color-chart-4)
59
+ * --app-sidebar var(--ds-color-surface)
60
+ * --app-sidebar-foreground var(--ds-color-content)
61
+ * --app-sidebar-primary var(--ds-color-action-brand-bg)
62
+ * --app-sidebar-primary-foregroundvar(--ds-color-action-brand-fg)
63
+ * --app-sidebar-accent var(--ds-color-canvas-sunken)
64
+ * --app-sidebar-accent-foreground var(--ds-color-content)
65
+ * --app-sidebar-border var(--ds-color-border)
66
+ * --app-sidebar-ring var(--ds-color-border-focus)
67
+ * --app-radius var(--ds-radius-surface)
68
+ * --app-radius var(--ds-radius-surface)
69
+ * --app-radius var(--ds-radius-surface)
70
+ * --app-radius var(--ds-radius-surface)
71
+ * --app-radius var(--ds-radius-surface)
72
+ * --app-radius var(--ds-radius-surface)
73
+ * --app-radius var(--ds-radius-surface)
74
+ */
75
+
76
+ @layer theme, base, ds, components, utilities;
77
+
78
+ @theme inline {
79
+ /* Surfaces and content. */
80
+ --color-background: var(--app-background, var(--ds-color-canvas));
81
+ --color-foreground: var(--app-foreground, var(--ds-color-content));
82
+ --color-card: var(--app-card, var(--ds-color-surface));
83
+ --color-card-foreground: var(--app-card-foreground, var(--ds-color-content));
84
+ --color-popover: var(--app-popover, var(--ds-color-surface));
85
+ --color-popover-foreground: var(--app-popover-foreground, var(--ds-color-content));
86
+ --color-surface-2: var(--app-surface-2, var(--ds-color-surface-sunken));
87
+ --color-surface-3: var(--app-surface-3, var(--ds-color-surface-sunken-strong));
88
+ --color-muted: var(--app-muted, var(--ds-color-canvas-sunken));
89
+ --color-muted-foreground: var(--app-muted-foreground, var(--ds-color-content-muted));
90
+ --color-overlay: var(--app-overlay, var(--ds-color-scrim));
91
+
92
+ /* The three contested words — each app owns the meaning (D3a). */
93
+ --color-primary: var(--app-primary, var(--ds-color-action-brand-bg));
94
+ --color-primary-foreground: var(--app-primary-foreground, var(--ds-color-action-brand-fg));
95
+ --color-secondary: var(--app-secondary, var(--ds-color-canvas-sunken));
96
+ --color-secondary-foreground: var(--app-secondary-foreground, var(--ds-color-content-secondary));
97
+ --color-accent: var(--app-accent, var(--ds-color-action-brand-subtle-bg));
98
+ --color-accent-foreground: var(--app-accent-foreground, var(--ds-compat-color-brand-soft-foreground));
99
+
100
+ /* Brand. */
101
+ --color-brand: var(--app-brand, var(--ds-color-action-brand-bg));
102
+ --color-brand-foreground: var(--app-brand-foreground, var(--ds-color-action-brand-fg));
103
+ --color-brand-hover: var(--app-brand-hover, var(--ds-color-action-brand-bg-hover));
104
+ --color-brand-soft: var(--app-brand-soft, var(--ds-compat-color-brand-soft));
105
+ --color-brand-soft-foreground: var(--app-brand-soft-foreground, var(--ds-compat-color-brand-soft-foreground));
106
+ --color-brand-soft-hover: var(--app-brand-soft-hover, var(--ds-color-action-brand-subtle-bg-hover));
107
+ --color-brand-ring: var(--app-brand-ring, var(--ds-color-action-brand-ring));
108
+
109
+ /* Feedback. `<name>` is the text-safe tone, `<name>-solid` the fill (D3b). */
110
+ --color-destructive: var(--app-destructive, var(--ds-color-feedback-danger-fg));
111
+ --color-destructive-solid: var(--app-destructive-solid, var(--ds-color-feedback-danger-fg));
112
+ --color-success: var(--app-success, var(--ds-color-feedback-success-fg));
113
+ --color-success-solid: var(--app-success-solid, var(--ds-color-feedback-success-fg));
114
+ --color-warning: var(--app-warning, var(--ds-color-feedback-warning-fg));
115
+ --color-warning-solid: var(--app-warning-solid, var(--ds-color-feedback-warning-fg));
116
+ --color-info: var(--app-info, var(--ds-color-feedback-info-fg));
117
+ --color-info-solid: var(--app-info-solid, var(--ds-color-feedback-info-fg));
118
+ --color-destructive-foreground: var(--app-destructive-foreground, var(--ds-compat-color-destructive-foreground));
119
+ --color-success-foreground: var(--app-success-foreground, var(--ds-compat-color-success-foreground));
120
+ --color-warning-foreground: var(--app-warning-foreground, var(--ds-color-canvas));
121
+ --color-info-foreground: var(--app-info-foreground, var(--ds-color-canvas));
122
+
123
+ /* Lines, controls and focus. */
124
+ --color-border: var(--app-border, var(--ds-color-border));
125
+ --color-input: var(--app-input, var(--ds-color-border-strong));
126
+ --color-input-background: var(--app-input-background, var(--ds-color-surface));
127
+ --color-switch-background: var(--app-switch-background, var(--ds-color-canvas-sunken-strong));
128
+ --color-ring: var(--app-ring, var(--ds-color-border-focus));
129
+
130
+ /* Data visualisation. */
131
+ --color-chart-1: var(--app-chart-1, var(--ds-color-chart-1));
132
+ --color-chart-2: var(--app-chart-2, var(--ds-color-chart-2));
133
+ --color-chart-3: var(--app-chart-3, var(--ds-color-chart-3));
134
+ --color-chart-4: var(--app-chart-4, var(--ds-color-chart-4));
135
+ --color-chart-5: var(--app-chart-5, var(--ds-color-chart-4));
136
+
137
+ /* Shell. */
138
+ --color-sidebar: var(--app-sidebar, var(--ds-color-surface));
139
+ --color-sidebar-foreground: var(--app-sidebar-foreground, var(--ds-color-content));
140
+ --color-sidebar-primary: var(--app-sidebar-primary, var(--ds-color-action-brand-bg));
141
+ --color-sidebar-primary-foreground: var(--app-sidebar-primary-foreground, var(--ds-color-action-brand-fg));
142
+ --color-sidebar-accent: var(--app-sidebar-accent, var(--ds-color-canvas-sunken));
143
+ --color-sidebar-accent-foreground: var(--app-sidebar-accent-foreground, var(--ds-color-content));
144
+ --color-sidebar-border: var(--app-sidebar-border, var(--ds-color-border));
145
+ --color-sidebar-ring: var(--app-sidebar-ring, var(--ds-color-border-focus));
146
+
147
+ /* The app radius scale, derived from one base (D1). */
148
+ --radius-sm: calc(var(--app-radius, var(--ds-radius-surface)) - 4px);
149
+ --radius-md: calc(var(--app-radius, var(--ds-radius-surface)) - 2px);
150
+ --radius-lg: var(--app-radius, var(--ds-radius-surface));
151
+ --radius-xl: calc(var(--app-radius, var(--ds-radius-surface)) + 4px);
152
+ --radius-2xl: calc(var(--app-radius, var(--ds-radius-surface)) + 8px);
153
+ --radius-3xl: calc(var(--app-radius, var(--ds-radius-surface)) + 12px);
154
+ --radius-4xl: calc(var(--app-radius, var(--ds-radius-surface)) + 16px);
155
+ }