@rowkit/tokens 0.3.0 → 1.0.0-beta.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (14) hide show
  1. package/README.md +16 -12
  2. package/dist/color.d.ts +134 -495
  3. package/dist/css.d.ts +2 -4
  4. package/dist/index.d.ts +142 -352
  5. package/dist/index.js +212 -369
  6. package/dist/index.js.map +1 -1
  7. package/dist/motion.d.ts +1 -1
  8. package/dist/radius.d.ts +15 -17
  9. package/dist/shadow.d.ts +42 -20
  10. package/dist/tokens.css +111 -232
  11. package/dist/typography.d.ts +63 -46
  12. package/package.json +3 -4
  13. package/dist/blur.d.ts +0 -18
  14. package/dist/reference.html +0 -1275
package/dist/css.d.ts CHANGED
@@ -5,10 +5,8 @@
5
5
  * the stylesheet from them, so the two cannot drift. `css.test.ts` asserts that
6
6
  * every token in every scale reaches the output.
7
7
  *
8
- * Dark mode works by repointing *semantic* tokens under `.dark`. Primitives are
9
- * emitted once and never change — `--color-primary-600` is the same colour in
10
- * both themes; what changes is which primitive `--color-primary-solid` points
11
- * at. That is why the theme can flip without a single hardcoded colour moving.
8
+ * There is one theme. Semantic tokens point at primitives, so a consumer
9
+ * rebrands by repointing a semantic token rather than editing a literal colour.
12
10
  *
13
11
  * @returns The complete stylesheet, ready to write to disk.
14
12
  */
package/dist/index.d.ts CHANGED
@@ -9,7 +9,7 @@
9
9
  * @example Typed access to a primitive
10
10
  * ```ts
11
11
  * import { tokens } from '@rowkit/tokens'
12
- * tokens.color.primary[800] // 'oklch(0.31 0.038 48)' — warm espresso
12
+ * tokens.color.vga.silver // '#c0c0c0' — the face of every window
13
13
  * ```
14
14
  *
15
15
  * @example The stylesheet
@@ -18,16 +18,14 @@
18
18
  * @import '@rowkit/tokens/css';
19
19
  * ```
20
20
  */
21
- export { amber, colorPrimitives, colorSteps, danger, gray, green, neutral, primary, red, semanticColorDark, semanticColorLight, success, warning, whiteAlpha, } from './color.js';
22
- export type { ColorRef, ColorStep, SemanticColorName } from './color.js';
23
- export { blur } from './blur.js';
24
- export type { BlurName } from './blur.js';
21
+ export { colorPrimitives, semanticColor, vga, win98 } from './color.js';
22
+ export type { ColorRef, SemanticColorName } from './color.js';
25
23
  export { duration, easing } from './motion.js';
26
24
  export type { DurationName, EasingName } from './motion.js';
27
25
  export { radius, radiusBase } from './radius.js';
28
26
  export type { RadiusName } from './radius.js';
29
- export { shadow } from './shadow.js';
30
- export type { ShadowName } from './shadow.js';
27
+ export { shadow, textShadow } from './shadow.js';
28
+ export type { ShadowName, TextShadowName } from './shadow.js';
31
29
  export { spacing, spacingBase } from './spacing.js';
32
30
  export type { SpacingName } from './spacing.js';
33
31
  export { fontFamily, fontSize, fontWeight, letterSpacing, lineHeight } from './typography.js';
@@ -38,330 +36,119 @@ export { buildThemeCss } from './css.js';
38
36
  /**
39
37
  * Every rowkit token in one object.
40
38
  *
41
- * Grouped by scale rather than flattened, so `tokens.color.primary[600]`
42
- * narrows to its literal type and autocompletes each level.
39
+ * Grouped by scale rather than flattened, so `tokens.color.vga.navy` narrows
40
+ * to its literal type and autocompletes each level.
43
41
  */
44
42
  export declare const tokens: {
45
43
  readonly color: {
46
- readonly gray: {
47
- readonly 988: "oklch(0.988 0.002 264)";
48
- readonly 985: "oklch(0.985 0 0)";
49
- readonly 972: "oklch(0.972 0.003 264)";
50
- readonly 970: "oklch(0.97 0 0)";
51
- readonly 940: "oklch(0.940 0.004 264)";
52
- readonly 922: "oklch(0.922 0 0)";
53
- readonly 905: "oklch(0.905 0.006 264)";
54
- readonly 870: "oklch(0.87 0 0)";
55
- readonly 708: "oklch(0.708 0 0)";
56
- readonly 635: "oklch(0.635 0 0)";
57
- readonly 642: "oklch(0.642 0.012 264)";
58
- readonly 556: "oklch(0.556 0 0)";
59
- readonly 535: "oklch(0.535 0 0)";
60
- readonly 371: "oklch(0.371 0 0)";
61
- readonly 269: "oklch(0.269 0 0)";
62
- readonly 205: "oklch(0.205 0 0)";
63
- readonly 145: "oklch(0.145 0 0)";
44
+ /** The VGA palette Windows 98 is drawn in. */
45
+ readonly vga: {
46
+ readonly black: "#000000";
47
+ readonly white: "#ffffff";
48
+ readonly silver: "#c0c0c0";
49
+ readonly gray: "#808080";
50
+ readonly navy: "#000080";
51
+ readonly blue: "#0000ff";
52
+ readonly teal: "#008080";
53
+ readonly green: "#008000";
54
+ readonly olive: "#808000";
55
+ readonly yellow: "#ffff00";
56
+ readonly maroon: "#800000";
57
+ readonly red: "#ff0000";
64
58
  };
65
- readonly green: {
66
- readonly 950: "oklch(0.95 0.05 152)";
67
- readonly 880: "oklch(0.88 0.05 152)";
68
- readonly 850: "oklch(0.85 0.12 152)";
69
- readonly 550: "oklch(0.55 0.144 152)";
70
- readonly 520: "oklch(0.52 0.136 152)";
71
- readonly 400: "oklch(0.4 0.105 152)";
72
- readonly 350: "oklch(0.35 0.092 152)";
73
- readonly 260: "oklch(0.26 0.068 152)";
74
- };
75
- readonly amber: {
76
- readonly 950: "oklch(0.95 0.04 75)";
77
- readonly 880: "oklch(0.88 0.05 75)";
78
- readonly 850: "oklch(0.85 0.12 75)";
79
- readonly 550: "oklch(0.55 0.116 75)";
80
- readonly 520: "oklch(0.52 0.109 75)";
81
- readonly 400: "oklch(0.4 0.084 75)";
82
- readonly 350: "oklch(0.35 0.074 75)";
83
- readonly 260: "oklch(0.26 0.055 75)";
84
- };
85
- readonly whiteAlpha: {
86
- readonly 8: "oklch(1 0 0 / 8%)";
87
- readonly 10: "oklch(1 0 0 / 10%)";
88
- readonly 15: "oklch(1 0 0 / 15%)";
89
- };
90
- readonly neutral: {
91
- readonly 50: "oklch(0.984 0.003 264)";
92
- readonly 100: "oklch(0.968 0.004 264)";
93
- readonly 200: "oklch(0.928 0.006 264)";
94
- readonly 300: "oklch(0.869 0.01 264)";
95
- readonly 400: "oklch(0.704 0.018 264)";
96
- readonly 500: "oklch(0.551 0.024 264)";
97
- readonly 600: "oklch(0.446 0.027 264)";
98
- readonly 700: "oklch(0.373 0.028 264)";
99
- readonly 800: "oklch(0.279 0.03 264)";
100
- readonly 900: "oklch(0.21 0.033 264)";
101
- readonly 950: "oklch(0.13 0.036 264)";
102
- };
103
- readonly primary: {
104
- readonly 50: "oklch(0.975 0.01 48)";
105
- readonly 100: "oklch(0.95 0.014 48)";
106
- readonly 200: "oklch(0.90 0.02 48)";
107
- readonly 300: "oklch(0.80 0.026 48)";
108
- readonly 400: "oklch(0.68 0.032 48)";
109
- readonly 500: "oklch(0.50 0.036 48)";
110
- readonly 600: "oklch(0.40 0.037 48)";
111
- readonly 700: "oklch(0.35 0.037 48)";
112
- readonly 800: "oklch(0.31 0.038 48)";
113
- readonly 900: "oklch(0.26 0.032 48)";
114
- readonly 950: "oklch(0.18 0.024 48)";
115
- };
116
- readonly red: {
117
- readonly 850: "oklch(0.85 0.08 25)";
118
- readonly 577: "oklch(0.577 0.235 27.325)";
119
- readonly 520: "oklch(0.52 0.212 27.325)";
120
- readonly 350: "oklch(0.38 0.055 25)";
121
- readonly 260: "oklch(0.32 0.045 25)";
122
- };
123
- readonly success: {
124
- readonly 50: "oklch(0.97 0.014 152)";
125
- readonly 100: "oklch(0.936 0.036 152)";
126
- readonly 200: "oklch(0.885 0.064 152)";
127
- readonly 300: "oklch(0.809 0.097 152)";
128
- readonly 400: "oklch(0.715 0.145 152)";
129
- readonly 500: "oklch(0.623 0.162 152)";
130
- readonly 600: "oklch(0.546 0.142 152)";
131
- readonly 700: "oklch(0.488 0.127 152)";
132
- readonly 800: "oklch(0.442 0.115 152)";
133
- readonly 900: "oklch(0.396 0.103 152)";
134
- readonly 950: "oklch(0.282 0.073 152)";
135
- };
136
- readonly warning: {
137
- readonly 50: "oklch(0.97 0.016 75)";
138
- readonly 100: "oklch(0.936 0.04 75)";
139
- readonly 200: "oklch(0.885 0.071 75)";
140
- readonly 300: "oklch(0.849 0.108 75)";
141
- readonly 400: "oklch(0.785 0.162 75)";
142
- readonly 500: "oklch(0.723 0.15 75)";
143
- readonly 600: "oklch(0.616 0.128 75)";
144
- readonly 700: "oklch(0.528 0.11 75)";
145
- readonly 800: "oklch(0.442 0.092 75)";
146
- readonly 900: "oklch(0.396 0.082 75)";
147
- readonly 950: "oklch(0.282 0.059 75)";
148
- };
149
- readonly danger: {
150
- readonly 50: "oklch(0.97 0.014 25)";
151
- readonly 100: "oklch(0.936 0.032 25)";
152
- readonly 200: "oklch(0.885 0.06 25)";
153
- readonly 300: "oklch(0.809 0.107 25)";
154
- readonly 400: "oklch(0.715 0.17 25)";
155
- readonly 500: "oklch(0.623 0.214 25)";
156
- readonly 600: "oklch(0.546 0.218 25)";
157
- readonly 700: "oklch(0.488 0.195 25)";
158
- readonly 800: "oklch(0.442 0.165 25)";
159
- readonly 900: "oklch(0.396 0.135 25)";
160
- readonly 950: "oklch(0.282 0.086 25)";
59
+ /** The system colours Windows 98 added to it. */
60
+ readonly win98: {
61
+ readonly light: "#dfdfdf";
62
+ readonly 'dark-gray': "#404040";
63
+ readonly 'title-blue': "#1084d0";
64
+ readonly 'title-gray': "#b5b5b5";
65
+ readonly info: "#ffffe1";
161
66
  };
162
67
  /** Flat map of every primitive, keyed by CSS custom property suffix. */
163
68
  readonly primitives: {
164
- readonly "danger-50": string;
165
- readonly "danger-100": string;
166
- readonly "danger-200": string;
167
- readonly "danger-300": string;
168
- readonly "danger-400": string;
169
- readonly "danger-500": string;
170
- readonly "danger-600": string;
171
- readonly "danger-700": string;
172
- readonly "danger-800": string;
173
- readonly "danger-900": string;
174
- readonly "danger-950": string;
175
- readonly "warning-50": string;
176
- readonly "warning-100": string;
177
- readonly "warning-200": string;
178
- readonly "warning-300": string;
179
- readonly "warning-400": string;
180
- readonly "warning-500": string;
181
- readonly "warning-600": string;
182
- readonly "warning-700": string;
183
- readonly "warning-800": string;
184
- readonly "warning-900": string;
185
- readonly "warning-950": string;
186
- readonly "success-50": string;
187
- readonly "success-100": string;
188
- readonly "success-200": string;
189
- readonly "success-300": string;
190
- readonly "success-400": string;
191
- readonly "success-500": string;
192
- readonly "success-600": string;
193
- readonly "success-700": string;
194
- readonly "success-800": string;
195
- readonly "success-900": string;
196
- readonly "success-950": string;
197
- readonly "primary-50": string;
198
- readonly "primary-100": string;
199
- readonly "primary-200": string;
200
- readonly "primary-300": string;
201
- readonly "primary-400": string;
202
- readonly "primary-500": string;
203
- readonly "primary-600": string;
204
- readonly "primary-700": string;
205
- readonly "primary-800": string;
206
- readonly "primary-900": string;
207
- readonly "primary-950": string;
208
- readonly "neutral-50": string;
209
- readonly "neutral-100": string;
210
- readonly "neutral-200": string;
211
- readonly "neutral-300": string;
212
- readonly "neutral-400": string;
213
- readonly "neutral-500": string;
214
- readonly "neutral-600": string;
215
- readonly "neutral-700": string;
216
- readonly "neutral-800": string;
217
- readonly "neutral-900": string;
218
- readonly "neutral-950": string;
219
- readonly "white-alpha-8": string;
220
- readonly "white-alpha-10": string;
221
- readonly "white-alpha-15": string;
222
- readonly "amber-400": string;
223
- readonly "amber-950": string;
224
- readonly "amber-850": string;
225
- readonly "amber-520": string;
226
- readonly "amber-350": string;
227
- readonly "amber-260": string;
228
- readonly "amber-880": string;
229
- readonly "amber-550": string;
230
- readonly "green-400": string;
231
- readonly "green-950": string;
232
- readonly "green-850": string;
233
- readonly "green-520": string;
234
- readonly "green-350": string;
235
- readonly "green-260": string;
236
- readonly "green-880": string;
237
- readonly "green-550": string;
238
- readonly "red-850": string;
239
- readonly "red-577": string;
240
- readonly "red-520": string;
241
- readonly "red-350": string;
242
- readonly "red-260": string;
243
- readonly "gray-988": string;
244
- readonly "gray-985": string;
245
- readonly "gray-972": string;
246
- readonly "gray-970": string;
247
- readonly "gray-940": string;
248
- readonly "gray-922": string;
249
- readonly "gray-905": string;
250
- readonly "gray-870": string;
251
- readonly "gray-708": string;
252
- readonly "gray-635": string;
253
- readonly "gray-642": string;
254
- readonly "gray-556": string;
255
- readonly "gray-535": string;
256
- readonly "gray-371": string;
257
- readonly "gray-269": string;
258
- readonly "gray-205": string;
259
- readonly "gray-145": string;
260
- readonly white: "oklch(1 0 0)";
261
- readonly black: "oklch(0 0 0)";
69
+ readonly "win98-light": "#dfdfdf";
70
+ readonly "win98-dark-gray": "#404040";
71
+ readonly "win98-title-blue": "#1084d0";
72
+ readonly "win98-title-gray": "#b5b5b5";
73
+ readonly "win98-info": "#ffffe1";
74
+ readonly "vga-black": "#000000";
75
+ readonly "vga-white": "#ffffff";
76
+ readonly "vga-silver": "#c0c0c0";
77
+ readonly "vga-gray": "#808080";
78
+ readonly "vga-navy": "#000080";
79
+ readonly "vga-blue": "#0000ff";
80
+ readonly "vga-teal": "#008080";
81
+ readonly "vga-green": "#008000";
82
+ readonly "vga-olive": "#808000";
83
+ readonly "vga-yellow": "#ffff00";
84
+ readonly "vga-maroon": "#800000";
85
+ readonly "vga-red": "#ff0000";
262
86
  };
263
87
  /** Semantic tokens, which reference primitives via `var()`. */
264
88
  readonly semantic: {
265
- readonly light: {
266
- readonly background: `var(--color-${string})`;
267
- readonly card: `var(--color-${string})`;
268
- readonly muted: `var(--color-${string})`;
269
- readonly accent: `var(--color-${string})`;
270
- readonly 'surface-active': `var(--color-${string})`;
271
- readonly 'surface-selected': `var(--color-${string})`;
272
- readonly 'surface-disabled': `var(--color-${string})`;
273
- readonly skeleton: `var(--color-${string})`;
274
- readonly foreground: `var(--color-${string})`;
275
- readonly 'muted-foreground': `var(--color-${string})`;
276
- readonly 'text-subtle': `var(--color-${string})`;
277
- readonly 'text-disabled': `var(--color-${string})`;
278
- readonly border: `var(--color-${string})`;
279
- readonly 'border-strong': `var(--color-${string})`;
280
- readonly 'border-subtle': `var(--color-${string})`;
281
- readonly input: `var(--color-${string})`;
282
- readonly ring: `var(--color-${string})`;
283
- readonly shadow: `var(--color-${string})`;
284
- readonly 'neutral-solid': `var(--color-${string})`;
285
- readonly 'neutral-solid-hover': `var(--color-${string})`;
286
- readonly 'neutral-on-solid': `var(--color-${string})`;
287
- readonly 'neutral-subtle': `var(--color-${string})`;
288
- readonly 'neutral-on-subtle': `var(--color-${string})`;
289
- readonly 'neutral-border': `var(--color-${string})`;
290
- readonly 'primary-solid': `var(--color-${string})`;
291
- readonly 'primary-solid-hover': `var(--color-${string})`;
292
- readonly 'primary-on-solid': `var(--color-${string})`;
293
- readonly 'primary-subtle': `var(--color-${string})`;
294
- readonly 'primary-on-subtle': `var(--color-${string})`;
295
- readonly 'primary-border': `var(--color-${string})`;
296
- readonly 'success-solid': `var(--color-${string})`;
297
- readonly 'success-solid-hover': `var(--color-${string})`;
298
- readonly 'success-on-solid': `var(--color-${string})`;
299
- readonly 'success-subtle': `var(--color-${string})`;
300
- readonly 'success-on-subtle': `var(--color-${string})`;
301
- readonly 'success-border': `var(--color-${string})`;
302
- readonly 'warning-solid': `var(--color-${string})`;
303
- readonly 'warning-solid-hover': `var(--color-${string})`;
304
- readonly 'warning-on-solid': `var(--color-${string})`;
305
- readonly 'warning-subtle': `var(--color-${string})`;
306
- readonly 'warning-on-subtle': `var(--color-${string})`;
307
- readonly 'warning-border': `var(--color-${string})`;
308
- readonly 'danger-solid': `var(--color-${string})`;
309
- readonly 'danger-solid-hover': `var(--color-${string})`;
310
- readonly 'danger-on-solid': `var(--color-${string})`;
311
- readonly 'danger-subtle': `var(--color-${string})`;
312
- readonly 'danger-on-subtle': `var(--color-${string})`;
313
- readonly 'danger-border': `var(--color-${string})`;
314
- };
315
- readonly dark: {
316
- readonly background: `var(--color-${string})`;
317
- readonly card: `var(--color-${string})`;
318
- readonly muted: `var(--color-${string})`;
319
- readonly accent: `var(--color-${string})`;
320
- readonly 'surface-active': `var(--color-${string})`;
321
- readonly 'surface-selected': `var(--color-${string})`;
322
- readonly 'surface-disabled': `var(--color-${string})`;
323
- readonly skeleton: `var(--color-${string})`;
324
- readonly foreground: `var(--color-${string})`;
325
- readonly 'muted-foreground': `var(--color-${string})`;
326
- readonly 'text-subtle': `var(--color-${string})`;
327
- readonly 'text-disabled': `var(--color-${string})`;
328
- readonly border: `var(--color-${string})`;
329
- readonly 'border-strong': `var(--color-${string})`;
330
- readonly 'border-subtle': `var(--color-${string})`;
331
- readonly input: `var(--color-${string})`;
332
- readonly ring: `var(--color-${string})`;
333
- readonly shadow: `var(--color-${string})`;
334
- readonly 'neutral-solid': `var(--color-${string})`;
335
- readonly 'neutral-solid-hover': `var(--color-${string})`;
336
- readonly 'neutral-on-solid': `var(--color-${string})`;
337
- readonly 'neutral-subtle': `var(--color-${string})`;
338
- readonly 'neutral-on-subtle': `var(--color-${string})`;
339
- readonly 'neutral-border': `var(--color-${string})`;
340
- readonly 'primary-solid': `var(--color-${string})`;
341
- readonly 'primary-solid-hover': `var(--color-${string})`;
342
- readonly 'primary-on-solid': `var(--color-${string})`;
343
- readonly 'primary-subtle': `var(--color-${string})`;
344
- readonly 'primary-on-subtle': `var(--color-${string})`;
345
- readonly 'primary-border': `var(--color-${string})`;
346
- readonly 'success-solid': `var(--color-${string})`;
347
- readonly 'success-solid-hover': `var(--color-${string})`;
348
- readonly 'success-on-solid': `var(--color-${string})`;
349
- readonly 'success-subtle': `var(--color-${string})`;
350
- readonly 'success-on-subtle': `var(--color-${string})`;
351
- readonly 'success-border': `var(--color-${string})`;
352
- readonly 'warning-solid': `var(--color-${string})`;
353
- readonly 'warning-solid-hover': `var(--color-${string})`;
354
- readonly 'warning-on-solid': `var(--color-${string})`;
355
- readonly 'warning-subtle': `var(--color-${string})`;
356
- readonly 'warning-on-subtle': `var(--color-${string})`;
357
- readonly 'warning-border': `var(--color-${string})`;
358
- readonly 'danger-solid': `var(--color-${string})`;
359
- readonly 'danger-solid-hover': `var(--color-${string})`;
360
- readonly 'danger-on-solid': `var(--color-${string})`;
361
- readonly 'danger-subtle': `var(--color-${string})`;
362
- readonly 'danger-on-subtle': `var(--color-${string})`;
363
- readonly 'danger-border': `var(--color-${string})`;
364
- };
89
+ readonly background: `var(--color-${string})`;
90
+ readonly desktop: `var(--color-${string})`;
91
+ readonly card: `var(--color-${string})`;
92
+ readonly muted: `var(--color-${string})`;
93
+ readonly accent: `var(--color-${string})`;
94
+ readonly 'surface-active': `var(--color-${string})`;
95
+ readonly 'surface-selected': `var(--color-${string})`;
96
+ readonly 'surface-disabled': `var(--color-${string})`;
97
+ readonly skeleton: `var(--color-${string})`;
98
+ readonly input: `var(--color-${string})`;
99
+ readonly 'tooltip-bg': `var(--color-${string})`;
100
+ readonly foreground: `var(--color-${string})`;
101
+ readonly 'muted-foreground': `var(--color-${string})`;
102
+ readonly 'text-subtle': `var(--color-${string})`;
103
+ readonly 'text-disabled': `var(--color-${string})`;
104
+ readonly 'text-disabled-emboss': `var(--color-${string})`;
105
+ readonly 'on-selected': `var(--color-${string})`;
106
+ readonly link: `var(--color-${string})`;
107
+ readonly border: `var(--color-${string})`;
108
+ readonly 'border-strong': `var(--color-${string})`;
109
+ readonly 'border-subtle': `var(--color-${string})`;
110
+ readonly ring: `var(--color-${string})`;
111
+ readonly shadow: `var(--color-${string})`;
112
+ readonly 'bevel-highlight': `var(--color-${string})`;
113
+ readonly 'bevel-light': `var(--color-${string})`;
114
+ readonly 'bevel-shadow': `var(--color-${string})`;
115
+ readonly 'bevel-dark': `var(--color-${string})`;
116
+ readonly 'titlebar-from': `var(--color-${string})`;
117
+ readonly 'titlebar-to': `var(--color-${string})`;
118
+ readonly 'titlebar-inactive-from': `var(--color-${string})`;
119
+ readonly 'titlebar-inactive-to': `var(--color-${string})`;
120
+ readonly 'titlebar-foreground': `var(--color-${string})`;
121
+ readonly 'titlebar-inactive-foreground': `var(--color-${string})`;
122
+ readonly 'neutral-solid': `var(--color-${string})`;
123
+ readonly 'neutral-solid-hover': `var(--color-${string})`;
124
+ readonly 'neutral-on-solid': `var(--color-${string})`;
125
+ readonly 'neutral-subtle': `var(--color-${string})`;
126
+ readonly 'neutral-on-subtle': `var(--color-${string})`;
127
+ readonly 'neutral-border': `var(--color-${string})`;
128
+ readonly 'primary-solid': `var(--color-${string})`;
129
+ readonly 'primary-solid-hover': `var(--color-${string})`;
130
+ readonly 'primary-on-solid': `var(--color-${string})`;
131
+ readonly 'primary-subtle': `var(--color-${string})`;
132
+ readonly 'primary-on-subtle': `var(--color-${string})`;
133
+ readonly 'primary-border': `var(--color-${string})`;
134
+ readonly 'success-solid': `var(--color-${string})`;
135
+ readonly 'success-solid-hover': `var(--color-${string})`;
136
+ readonly 'success-on-solid': `var(--color-${string})`;
137
+ readonly 'success-subtle': `var(--color-${string})`;
138
+ readonly 'success-on-subtle': `var(--color-${string})`;
139
+ readonly 'success-border': `var(--color-${string})`;
140
+ readonly 'warning-solid': `var(--color-${string})`;
141
+ readonly 'warning-solid-hover': `var(--color-${string})`;
142
+ readonly 'warning-on-solid': `var(--color-${string})`;
143
+ readonly 'warning-subtle': `var(--color-${string})`;
144
+ readonly 'warning-on-subtle': `var(--color-${string})`;
145
+ readonly 'warning-border': `var(--color-${string})`;
146
+ readonly 'danger-solid': `var(--color-${string})`;
147
+ readonly 'danger-solid-hover': `var(--color-${string})`;
148
+ readonly 'danger-on-solid': `var(--color-${string})`;
149
+ readonly 'danger-subtle': `var(--color-${string})`;
150
+ readonly 'danger-on-subtle': `var(--color-${string})`;
151
+ readonly 'danger-border': `var(--color-${string})`;
365
152
  };
366
153
  };
367
154
  readonly spacing: {
@@ -387,45 +174,45 @@ export declare const tokens: {
387
174
  readonly mono: string;
388
175
  };
389
176
  readonly size: {
390
- readonly xs: {
391
- readonly size: "0.75rem";
177
+ readonly ui: {
178
+ readonly size: "0.8125rem";
392
179
  readonly lineHeight: "1rem";
393
180
  };
394
- readonly sm: {
395
- readonly size: "0.875rem";
181
+ readonly heading: {
182
+ readonly size: "1rem";
396
183
  readonly lineHeight: "1.25rem";
397
184
  };
398
- readonly base: {
185
+ readonly mono: {
399
186
  readonly size: "1rem";
400
- readonly lineHeight: "1.5rem";
187
+ readonly lineHeight: "1rem";
401
188
  };
402
- readonly lg: {
403
- readonly size: "1.125rem";
404
- readonly lineHeight: "1.75rem";
189
+ readonly doc: {
190
+ readonly size: "1rem";
191
+ readonly lineHeight: "1.625rem";
405
192
  };
406
- readonly xl: {
193
+ readonly 'doc-mono': {
407
194
  readonly size: "1.25rem";
408
- readonly lineHeight: "1.75rem";
195
+ readonly lineHeight: "1.25rem";
409
196
  };
410
- readonly '2xl': {
411
- readonly size: "1.5rem";
412
- readonly lineHeight: "2rem";
197
+ readonly 'doc-h1': {
198
+ readonly size: "1.625rem";
199
+ readonly lineHeight: "1.875rem";
413
200
  };
414
- readonly '3xl': {
415
- readonly size: "1.875rem";
416
- readonly lineHeight: "2.25rem";
201
+ readonly 'doc-h2': {
202
+ readonly size: "1.1875rem";
203
+ readonly lineHeight: "1.5rem";
204
+ };
205
+ readonly 'doc-h3': {
206
+ readonly size: "0.9375rem";
207
+ readonly lineHeight: "1.25rem";
417
208
  };
418
209
  };
419
210
  readonly weight: {
420
211
  readonly normal: "400";
421
- readonly medium: "500";
422
- readonly semibold: "600";
423
212
  readonly bold: "700";
424
213
  };
425
214
  readonly letterSpacing: {
426
- readonly tight: "-0.015em";
427
215
  readonly normal: "0em";
428
- readonly wide: "0.04em";
429
216
  };
430
217
  readonly lineHeight: {
431
218
  readonly none: "1";
@@ -444,20 +231,23 @@ export declare const tokens: {
444
231
  readonly lg: string;
445
232
  readonly xl: string;
446
233
  };
447
- readonly radiusBase: "0.5rem";
448
- readonly blur: {
449
- readonly overlay: "4px";
450
- };
234
+ readonly radiusBase: "0rem";
451
235
  readonly shadow: {
452
236
  readonly none: "none";
453
- readonly xs: "0 1px 2px 0 color-mix(in oklab, var(--color-shadow) 6%, transparent)";
454
- readonly sm: "0 1px 3px 0 color-mix(in oklab, var(--color-shadow) 8%, transparent), 0 1px 2px -1px color-mix(in oklab, var(--color-shadow) 8%, transparent)";
455
- readonly md: "0 4px 6px -1px color-mix(in oklab, var(--color-shadow) 9%, transparent), 0 2px 4px -2px color-mix(in oklab, var(--color-shadow) 9%, transparent)";
456
- readonly lg: "0 10px 15px -3px color-mix(in oklab, var(--color-shadow) 10%, transparent), 0 4px 6px -4px color-mix(in oklab, var(--color-shadow) 10%, transparent)";
457
- readonly xl: "0 20px 25px -5px color-mix(in oklab, var(--color-shadow) 12%, transparent), 0 8px 10px -6px color-mix(in oklab, var(--color-shadow) 12%, transparent)";
458
- readonly 'scroll-x': "12px 0 16px -8px color-mix(in oklab, var(--color-shadow) 22%, transparent)";
237
+ readonly raised: string;
238
+ readonly window: string;
239
+ readonly 'raised-default': string;
240
+ readonly pressed: string;
241
+ readonly sunken: string;
242
+ readonly status: string;
243
+ readonly etched: string;
244
+ readonly 'raised-thin': string;
245
+ readonly 'scroll-x': "inset -1px 0 var(--color-bevel-shadow)";
459
246
  readonly 'sticky-header': "inset 0 -1px 0 var(--color-border)";
460
247
  };
248
+ readonly textShadow: {
249
+ readonly disabled: "1px 1px 0 var(--color-text-disabled-emboss)";
250
+ };
461
251
  readonly zIndex: {
462
252
  readonly base: "0";
463
253
  readonly sticky: "100";