@a-type/ui 6.0.80 → 6.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 (164) hide show
  1. package/dist/arbor/arbor.d.ts +637 -691
  2. package/dist/arbor/arbor.js +51 -63
  3. package/dist/arbor/arbor.js.map +1 -1
  4. package/dist/colors.module.css +14 -14
  5. package/dist/components/actions/ActionBar.module.css +1 -1
  6. package/dist/components/actions/ActionButton.module.css +1 -1
  7. package/dist/components/avatar/Avatar.module.css +5 -5
  8. package/dist/components/box/Box.module.css +19 -19
  9. package/dist/components/box/Box.stories.js +1 -1
  10. package/dist/components/box/Box.stories.js.map +1 -1
  11. package/dist/components/button/Button.module.css +9 -9
  12. package/dist/components/camera/Camera.module.css +9 -9
  13. package/dist/components/card/Card.module.css +24 -24
  14. package/dist/components/card/Card.stories.js +2 -2
  15. package/dist/components/card/Card.stories.js.map +1 -1
  16. package/dist/components/checkbox/Checkbox.module.css +8 -8
  17. package/dist/components/chip/Chip.module.css +9 -9
  18. package/dist/components/collapsible/Collapsible.module.css +2 -2
  19. package/dist/components/combobox/Combobox.module.css +26 -26
  20. package/dist/components/datePicker/Calendar.module.css +32 -32
  21. package/dist/components/datePicker/dateRangePicker.module.css +1 -1
  22. package/dist/components/dialog/Dialog.module.css +25 -25
  23. package/dist/components/dialog/Dialog.stories.js +1 -1
  24. package/dist/components/dialog/Dialog.stories.js.map +1 -1
  25. package/dist/components/divider/Divider.module.css +2 -2
  26. package/dist/components/editableText/EditableText.module.css +5 -5
  27. package/dist/components/emojiPicker/EmojiPicker.module.css +10 -10
  28. package/dist/components/forms/Field.module.css +10 -12
  29. package/dist/components/forms/Form.module.css +1 -1
  30. package/dist/components/forms/NumberStepperField.module.css +1 -1
  31. package/dist/components/forms/TextField.module.css +1 -1
  32. package/dist/components/horizontalList/HorizontalList.module.css +7 -8
  33. package/dist/components/horizontalList/HorizontalList.stories.js +5 -5
  34. package/dist/components/horizontalList/HorizontalList.stories.js.map +1 -1
  35. package/dist/components/icon/Icon.module.css +1 -1
  36. package/dist/components/icon/Icon.stories.js +1 -1
  37. package/dist/components/icon/Icon.stories.js.map +1 -1
  38. package/dist/components/imageUploader/ImageUploader.module.css +9 -9
  39. package/dist/components/input/Input.module.css +13 -13
  40. package/dist/components/layouts/PageContent.module.css +3 -3
  41. package/dist/components/layouts/PageFixedArea.module.css +1 -1
  42. package/dist/components/layouts/PageNav.module.css +4 -4
  43. package/dist/components/layouts/PageNowPlaying.module.css +4 -4
  44. package/dist/components/layouts/PageRoot.module.css +1 -1
  45. package/dist/components/layouts/PageSection.module.css +4 -4
  46. package/dist/components/layouts/layouts.stories.js +1 -1
  47. package/dist/components/layouts/layouts.stories.js.map +1 -1
  48. package/dist/components/lightbox/Lightbox.module.css +5 -5
  49. package/dist/components/lists/lists.module.css +3 -3
  50. package/dist/components/marquee/marquee.module.css +1 -1
  51. package/dist/components/navBar/NavBar.module.css +19 -19
  52. package/dist/components/note/Note.module.css +16 -16
  53. package/dist/components/numberStepper/NumberStepper.module.css +4 -4
  54. package/dist/components/peek/Peek.module.css +9 -9
  55. package/dist/components/popover/Popover.module.css +5 -5
  56. package/dist/components/popover/Popover.stories.js +1 -1
  57. package/dist/components/popover/Popover.stories.js.map +1 -1
  58. package/dist/components/primitives/menus.module.css +29 -33
  59. package/dist/components/progress/Progress.module.css +11 -11
  60. package/dist/components/provider/Provider.js +1 -1
  61. package/dist/components/provider/Provider.js.map +1 -1
  62. package/dist/components/pwaInstall/PwaInstall.module.css +4 -4
  63. package/dist/components/quickAction/QuickAction.module.css +4 -4
  64. package/dist/components/richEditor/richEditor.module.css +18 -18
  65. package/dist/components/scrollArea/ScrollArea.module.css +8 -8
  66. package/dist/components/select/Select.module.css +3 -3
  67. package/dist/components/skeletons/skeletons.module.css +3 -3
  68. package/dist/components/slider/Slider.module.css +13 -13
  69. package/dist/components/spinner/Spinner.module.css +1 -1
  70. package/dist/components/switch/Switch.module.css +9 -9
  71. package/dist/components/tabs/tabs.module.css +16 -16
  72. package/dist/components/textArea/TextArea.module.css +1 -1
  73. package/dist/components/toasts/toasts.module.css +19 -19
  74. package/dist/components/toggleGroup/toggleGroup.module.css +12 -12
  75. package/dist/components/tooltip/Tooltip.module.css +10 -10
  76. package/dist/components/typography/typography.d.ts +1 -2
  77. package/dist/components/typography/typography.js +1 -2
  78. package/dist/components/typography/typography.js.map +1 -1
  79. package/dist/components/typography/typography.module.css +6 -9
  80. package/dist/components/viewport/Viewport.module.css +9 -9
  81. package/dist/css/base.css +1 -1
  82. package/dist/css/util.css +10 -10
  83. package/dist/hooks/useTitleBarColor.stories.js +1 -1
  84. package/dist/hooks/useTitleBarColor.stories.js.map +1 -1
  85. package/dist/keyboard.stories.js +1 -1
  86. package/dist/keyboard.stories.js.map +1 -1
  87. package/dist/shadows.stories.js +1 -1
  88. package/dist/shadows.stories.js.map +1 -1
  89. package/dist/theme.stories.module.css +1 -1
  90. package/package.json +5 -4
  91. package/src/arbor/arbor.ts +54 -67
  92. package/src/colors.module.css +14 -14
  93. package/src/components/actions/ActionBar.module.css +1 -1
  94. package/src/components/actions/ActionButton.module.css +1 -1
  95. package/src/components/avatar/Avatar.module.css +5 -5
  96. package/src/components/box/Box.module.css +19 -19
  97. package/src/components/box/Box.stories.tsx +1 -1
  98. package/src/components/button/Button.module.css +9 -9
  99. package/src/components/camera/Camera.module.css +9 -9
  100. package/src/components/card/Card.module.css +24 -24
  101. package/src/components/card/Card.stories.tsx +2 -2
  102. package/src/components/checkbox/Checkbox.module.css +8 -8
  103. package/src/components/chip/Chip.module.css +9 -9
  104. package/src/components/collapsible/Collapsible.module.css +2 -2
  105. package/src/components/combobox/Combobox.module.css +26 -26
  106. package/src/components/datePicker/Calendar.module.css +32 -32
  107. package/src/components/datePicker/dateRangePicker.module.css +1 -1
  108. package/src/components/dialog/Dialog.module.css +25 -25
  109. package/src/components/dialog/Dialog.stories.tsx +1 -1
  110. package/src/components/divider/Divider.module.css +2 -2
  111. package/src/components/editableText/EditableText.module.css +5 -5
  112. package/src/components/emojiPicker/EmojiPicker.module.css +10 -10
  113. package/src/components/forms/Field.module.css +10 -12
  114. package/src/components/forms/Form.module.css +1 -1
  115. package/src/components/forms/NumberStepperField.module.css +1 -1
  116. package/src/components/forms/TextField.module.css +1 -1
  117. package/src/components/horizontalList/HorizontalList.module.css +7 -8
  118. package/src/components/horizontalList/HorizontalList.stories.tsx +5 -5
  119. package/src/components/icon/Icon.module.css +1 -1
  120. package/src/components/icon/Icon.stories.tsx +1 -1
  121. package/src/components/imageUploader/ImageUploader.module.css +9 -9
  122. package/src/components/input/Input.module.css +13 -13
  123. package/src/components/layouts/PageContent.module.css +3 -3
  124. package/src/components/layouts/PageFixedArea.module.css +1 -1
  125. package/src/components/layouts/PageNav.module.css +4 -4
  126. package/src/components/layouts/PageNowPlaying.module.css +4 -4
  127. package/src/components/layouts/PageRoot.module.css +1 -1
  128. package/src/components/layouts/PageSection.module.css +4 -4
  129. package/src/components/layouts/layouts.stories.tsx +1 -1
  130. package/src/components/lightbox/Lightbox.module.css +5 -5
  131. package/src/components/lists/lists.module.css +3 -3
  132. package/src/components/marquee/marquee.module.css +1 -1
  133. package/src/components/navBar/NavBar.module.css +19 -19
  134. package/src/components/note/Note.module.css +16 -16
  135. package/src/components/numberStepper/NumberStepper.module.css +4 -4
  136. package/src/components/peek/Peek.module.css +9 -9
  137. package/src/components/popover/Popover.module.css +5 -5
  138. package/src/components/popover/Popover.stories.tsx +1 -1
  139. package/src/components/primitives/menus.module.css +29 -33
  140. package/src/components/progress/Progress.module.css +11 -11
  141. package/src/components/provider/Provider.tsx +1 -1
  142. package/src/components/pwaInstall/PwaInstall.module.css +4 -4
  143. package/src/components/quickAction/QuickAction.module.css +4 -4
  144. package/src/components/richEditor/richEditor.module.css +18 -18
  145. package/src/components/scrollArea/ScrollArea.module.css +8 -8
  146. package/src/components/select/Select.module.css +3 -3
  147. package/src/components/skeletons/skeletons.module.css +3 -3
  148. package/src/components/slider/Slider.module.css +13 -13
  149. package/src/components/spinner/Spinner.module.css +1 -1
  150. package/src/components/switch/Switch.module.css +9 -9
  151. package/src/components/tabs/tabs.module.css +16 -16
  152. package/src/components/textArea/TextArea.module.css +1 -1
  153. package/src/components/toasts/toasts.module.css +19 -19
  154. package/src/components/toggleGroup/toggleGroup.module.css +12 -12
  155. package/src/components/tooltip/Tooltip.module.css +10 -10
  156. package/src/components/typography/typography.module.css +6 -9
  157. package/src/components/typography/typography.tsx +0 -3
  158. package/src/components/viewport/Viewport.module.css +9 -9
  159. package/src/css/base.css +1 -1
  160. package/src/css/util.css +10 -10
  161. package/src/hooks/useTitleBarColor.stories.tsx +1 -1
  162. package/src/keyboard.stories.tsx +1 -1
  163. package/src/shadows.stories.tsx +1 -1
  164. package/src/theme.stories.module.css +1 -1
@@ -1,4 +1,4 @@
1
- import { ArborPresetConfig } from '@arbor-css/core/preset-arbor';
1
+ import { ArborPresetConfig } from '@arbor-css/core/preset-v2';
2
2
  declare const defaultColors: {
3
3
  ranges: {
4
4
  lemon: {
@@ -203,7 +203,7 @@ export declare function presetAtype<TColors extends DefaultColorRangeName = Defa
203
203
  description: "An overall scaling factor for how heavy font weight tokens are.";
204
204
  };
205
205
  };
206
- easing: {
206
+ ease: {
207
207
  bounciness: {
208
208
  purpose: "scalar";
209
209
  description: "Controls the bounciness of easing functions. Higher values result in more overshoot and bounce.";
@@ -228,821 +228,618 @@ export declare function presetAtype<TColors extends DefaultColorRangeName = Defa
228
228
  };
229
229
  };
230
230
  };
231
- action: {
232
- padding: {
233
- $root: {
234
- purpose: "other";
235
- description: string;
236
- };
237
- inline: {
238
- purpose: "spacing";
239
- description: "Inline (horizontal, usually) padding";
240
- };
241
- block: {
242
- purpose: "spacing";
243
- description: "Block (vertical, usually) padding";
244
- };
245
- };
246
- roundness: {
247
- purpose: "scalar";
248
- description: "This token controls the overall roundness of actions and stacks with the root roundness token";
249
- };
250
- radius: {
251
- purpose: "border-radius";
252
- description: "This token captures the border-radius of actions, taking into account the overall roundness";
253
- };
254
- text: {
255
- size: "font-size";
256
- weight: "font-weight";
257
- lineHeight: "line-height";
258
- font: "font-family";
259
- letterSpacing: "letter-spacing";
260
- };
261
- primary: {
262
- fg: {
263
- purpose: "color";
264
- description: "Foreground color";
265
- };
266
- bg: {
267
- purpose: "background";
268
- description: "Background - can be a color or a more complex value like a gradient or image";
269
- };
270
- borderColor: {
271
- purpose: "color";
272
- };
273
- borderWidth: {
274
- purpose: "border-width";
275
- };
276
- borderStyle: {
277
- purpose: "border-style";
278
- };
279
- border: {
280
- purpose: "border";
281
- description: "Compiles the border color, width, and style into a single token for direct assignment to border.";
282
- };
283
- };
284
- secondary: {
285
- fg: {
286
- purpose: "color";
287
- description: "Foreground color";
288
- };
289
- bg: {
290
- purpose: "background";
291
- description: "Background - can be a color or a more complex value like a gradient or image";
292
- };
293
- borderColor: {
294
- purpose: "color";
295
- };
296
- borderWidth: {
297
- purpose: "border-width";
298
- };
299
- borderStyle: {
300
- purpose: "border-style";
301
- };
302
- border: {
303
- purpose: "border";
304
- description: "Compiles the border color, width, and style into a single token for direct assignment to border.";
305
- };
306
- };
307
- ambient: {
308
- fg: {
309
- purpose: "color";
310
- description: "Foreground color";
311
- };
312
- bg: {
313
- purpose: "background";
314
- description: "Background - can be a color or a more complex value like a gradient or image";
315
- };
316
- borderColor: {
317
- purpose: "color";
318
- };
319
- borderWidth: {
320
- purpose: "border-width";
321
- };
322
- borderStyle: {
323
- purpose: "border-style";
324
- };
325
- border: {
326
- purpose: "border";
327
- description: "Compiles the border color, width, and style into a single token for direct assignment to border.";
328
- };
329
- };
330
- };
331
- control: {
332
- text: {
333
- size: "font-size";
334
- weight: "font-weight";
335
- lineHeight: "line-height";
336
- font: "font-family";
337
- letterSpacing: "letter-spacing";
338
- };
339
- fg: {
231
+ tint: {
232
+ $root: {
340
233
  purpose: "color";
341
- description: "Foreground color";
342
- };
343
- bg: {
344
- purpose: "background";
345
- description: "Background - can be a color or a more complex value like a gradient or image";
234
+ description: string;
346
235
  };
347
- borderColor: {
236
+ paper: {
348
237
  purpose: "color";
238
+ description: "The lightest color in the range";
349
239
  };
350
- borderWidth: {
351
- purpose: "border-width";
352
- };
353
- borderStyle: {
354
- purpose: "border-style";
240
+ wash: {
241
+ purpose: "color";
242
+ description: "A light color in the range, lighter than the base color";
355
243
  };
356
- border: {
357
- purpose: "border";
358
- description: "Compiles the border color, width, and style into a single token for direct assignment to border.";
244
+ light: {
245
+ purpose: "color";
246
+ description: "A light color in the range, lighter than the base color";
359
247
  };
360
- padding: {
361
- $root: {
362
- purpose: "other";
363
- description: string;
364
- };
365
- inline: {
366
- purpose: "spacing";
367
- description: "Inline (horizontal, usually) padding";
368
- };
369
- block: {
370
- purpose: "spacing";
371
- description: "Block (vertical, usually) padding";
372
- };
248
+ mid: {
249
+ purpose: "color";
250
+ description: "A mid-tone color in the range, similar to the base color";
373
251
  };
374
- roundness: {
375
- purpose: "scalar";
376
- description: "This token controls the overall roundness of controls and stacks with the root roundness token";
252
+ heavy: {
253
+ purpose: "color";
254
+ description: "A dark color in the range, darker than the base color";
377
255
  };
378
- radius: {
379
- purpose: "border-radius";
380
- description: "This token captures the border-radius of controls, taking into account the overall roundness";
256
+ ink: {
257
+ purpose: "color";
258
+ description: "The darkest color in the range, usually used for text and other high-contrast elements";
381
259
  };
382
260
  };
383
- surface: {
384
- padding: {
385
- $root: {
386
- purpose: "other";
387
- description: string;
388
- };
389
- inline: {
390
- purpose: "spacing";
391
- description: "Inline (horizontal, usually) padding";
392
- };
393
- block: {
394
- purpose: "spacing";
395
- description: "Block (vertical, usually) padding";
396
- };
397
- };
398
- roundness: {
399
- purpose: "scalar";
400
- description: "This token controls the overall roundness of surfaces and stacks with the root roundness token";
401
- };
402
- radius: {
403
- purpose: "border-radius";
404
- description: "This token captures the border-radius of surfaces, taking into account the overall roundness";
405
- };
406
- text: {
407
- size: "font-size";
408
- weight: "font-weight";
409
- lineHeight: "line-height";
410
- font: "font-family";
411
- letterSpacing: "letter-spacing";
261
+ gray: {
262
+ $root: {
263
+ purpose: "color";
264
+ description: string;
412
265
  };
413
- primary: {
414
- fg: {
415
- purpose: "color";
416
- description: "Foreground color";
417
- };
418
- bg: {
419
- purpose: "background";
420
- description: "Background - can be a color or a more complex value like a gradient or image";
421
- };
422
- borderColor: {
423
- purpose: "color";
424
- };
425
- borderWidth: {
426
- purpose: "border-width";
427
- };
428
- borderStyle: {
429
- purpose: "border-style";
430
- };
431
- border: {
432
- purpose: "border";
433
- description: "Compiles the border color, width, and style into a single token for direct assignment to border.";
434
- };
266
+ paper: {
267
+ purpose: "color";
268
+ description: "The lightest color in the range";
435
269
  };
436
- secondary: {
437
- fg: {
438
- purpose: "color";
439
- description: "Foreground color";
440
- };
441
- bg: {
442
- purpose: "background";
443
- description: "Background - can be a color or a more complex value like a gradient or image";
444
- };
445
- borderColor: {
446
- purpose: "color";
447
- };
448
- borderWidth: {
449
- purpose: "border-width";
450
- };
451
- borderStyle: {
452
- purpose: "border-style";
453
- };
454
- border: {
455
- purpose: "border";
456
- description: "Compiles the border color, width, and style into a single token for direct assignment to border.";
457
- };
270
+ wash: {
271
+ purpose: "color";
272
+ description: "A light color in the range, lighter than the base color";
458
273
  };
459
- ambient: {
460
- fg: {
461
- purpose: "color";
462
- description: "Foreground color";
463
- };
464
- bg: {
465
- purpose: "background";
466
- description: "Background - can be a color or a more complex value like a gradient or image";
467
- };
468
- borderColor: {
469
- purpose: "color";
470
- };
471
- borderWidth: {
472
- purpose: "border-width";
473
- };
474
- borderStyle: {
475
- purpose: "border-style";
476
- };
477
- border: {
478
- purpose: "border";
479
- description: "Compiles the border color, width, and style into a single token for direct assignment to border.";
480
- };
274
+ light: {
275
+ purpose: "color";
276
+ description: "A light color in the range, lighter than the base color";
481
277
  };
482
- };
483
- prose: {
484
- primary: {
485
- size: "font-size";
486
- weight: "font-weight";
487
- lineHeight: "line-height";
488
- font: "font-family";
489
- letterSpacing: "letter-spacing";
278
+ mid: {
279
+ purpose: "color";
280
+ description: "A mid-tone color in the range, similar to the base color";
490
281
  };
491
- secondary: {
492
- size: "font-size";
493
- weight: "font-weight";
494
- lineHeight: "line-height";
495
- font: "font-family";
496
- letterSpacing: "letter-spacing";
282
+ heavy: {
283
+ purpose: "color";
284
+ description: "A dark color in the range, darker than the base color";
497
285
  };
498
- ambient: {
499
- size: "font-size";
500
- weight: "font-weight";
501
- lineHeight: "line-height";
502
- font: "font-family";
503
- letterSpacing: "letter-spacing";
286
+ ink: {
287
+ purpose: "color";
288
+ description: "The darkest color in the range, usually used for text and other high-contrast elements";
504
289
  };
505
290
  };
506
- color: {
507
- main: {
508
- $neutral: {
509
- $root: {
510
- purpose: "color";
511
- description: string;
512
- };
513
- paper: {
514
- purpose: "color";
515
- description: "An extremely light shade, good for backgrounds and surfaces";
516
- };
517
- wash: {
518
- purpose: "color";
519
- description: "A very faint but slightly vibrant shade, good for backgrounds and surfaces";
520
- };
521
- light: {
522
- purpose: "color";
523
- description: "A light shade, good for emphasized surfaces.";
524
- };
525
- mid: {
526
- purpose: "color";
527
- description: "The main shade, good for primary actions and decoration.";
528
- };
529
- heavy: {
530
- purpose: "color";
531
- description: "A heavy shade, good for text emphasis and accents.";
532
- };
533
- ink: {
534
- purpose: "color";
535
- description: "A very dark but still slightly vibrant shade, good for text and high contrast elements.";
536
- };
537
- };
291
+ color: Record<"tomato" | "success" | "attention" | "user" | "lemon" | "leek" | "blueberry" | "eggplant", {
292
+ gray: {
538
293
  $root: {
539
294
  purpose: "color";
540
295
  description: string;
541
296
  };
542
297
  paper: {
543
298
  purpose: "color";
544
- description: "An extremely light shade, good for backgrounds and surfaces";
299
+ description: "The lightest color in the range";
545
300
  };
546
301
  wash: {
547
302
  purpose: "color";
548
- description: "A very faint but slightly vibrant shade, good for backgrounds and surfaces";
303
+ description: "A light color in the range, lighter than the base color";
549
304
  };
550
305
  light: {
551
306
  purpose: "color";
552
- description: "A light shade, good for emphasized surfaces.";
307
+ description: "A light color in the range, lighter than the base color";
553
308
  };
554
309
  mid: {
555
310
  purpose: "color";
556
- description: "The main shade, good for primary actions and decoration.";
311
+ description: "A mid-tone color in the range, similar to the base color";
557
312
  };
558
313
  heavy: {
559
314
  purpose: "color";
560
- description: "A heavy shade, good for text emphasis and accents.";
315
+ description: "A dark color in the range, darker than the base color";
561
316
  };
562
317
  ink: {
563
318
  purpose: "color";
564
- description: "A very dark but still slightly vibrant shade, good for text and high contrast elements.";
319
+ description: "The darkest color in the range, usually used for text and other high-contrast elements";
565
320
  };
566
321
  };
567
- neutral: {
568
- $root: {
569
- purpose: "color";
570
- description: string;
571
- };
572
- paper: {
573
- purpose: "color";
574
- description: "An extremely light shade, good for backgrounds and surfaces";
575
- };
576
- wash: {
577
- purpose: "color";
578
- description: "A very faint but slightly vibrant shade, good for backgrounds and surfaces";
579
- };
580
- light: {
581
- purpose: "color";
582
- description: "A light shade, good for emphasized surfaces.";
583
- };
584
- mid: {
585
- purpose: "color";
586
- description: "The main shade, good for primary actions and decoration.";
587
- };
588
- heavy: {
589
- purpose: "color";
590
- description: "A heavy shade, good for text emphasis and accents.";
591
- };
592
- ink: {
593
- purpose: "color";
594
- description: "A very dark but still slightly vibrant shade, good for text and high contrast elements.";
595
- };
596
- };
597
- palette: Record<"tomato" | "success" | "attention" | "user" | "lemon" | "leek" | "blueberry" | "eggplant", {
598
- $neutral: {
599
- $root: {
600
- purpose: "color";
601
- description: string;
602
- };
603
- paper: {
604
- purpose: "color";
605
- description: "An extremely light shade, good for backgrounds and surfaces";
606
- };
607
- wash: {
608
- purpose: "color";
609
- description: "A very faint but slightly vibrant shade, good for backgrounds and surfaces";
610
- };
611
- light: {
612
- purpose: "color";
613
- description: "A light shade, good for emphasized surfaces.";
614
- };
615
- mid: {
616
- purpose: "color";
617
- description: "The main shade, good for primary actions and decoration.";
618
- };
619
- heavy: {
620
- purpose: "color";
621
- description: "A heavy shade, good for text emphasis and accents.";
622
- };
623
- ink: {
624
- purpose: "color";
625
- description: "A very dark but still slightly vibrant shade, good for text and high contrast elements.";
626
- };
627
- };
628
- $root: {
629
- purpose: "color";
630
- description: string;
631
- };
632
- paper: {
633
- purpose: "color";
634
- description: "An extremely light shade, good for backgrounds and surfaces";
635
- };
636
- wash: {
637
- purpose: "color";
638
- description: "A very faint but slightly vibrant shade, good for backgrounds and surfaces";
639
- };
640
- light: {
641
- purpose: "color";
642
- description: "A light shade, good for emphasized surfaces.";
643
- };
644
- mid: {
645
- purpose: "color";
646
- description: "The main shade, good for primary actions and decoration.";
647
- };
648
- heavy: {
649
- purpose: "color";
650
- description: "A heavy shade, good for text emphasis and accents.";
651
- };
652
- ink: {
653
- purpose: "color";
654
- description: "A very dark but still slightly vibrant shade, good for text and high contrast elements.";
655
- };
656
- }>;
657
- };
658
- space: {
659
322
  $root: {
660
- purpose: "spacing";
323
+ purpose: "color";
661
324
  description: string;
662
325
  };
326
+ paper: {
327
+ purpose: "color";
328
+ description: "The lightest color in the range";
329
+ };
330
+ wash: {
331
+ purpose: "color";
332
+ description: "A light color in the range, lighter than the base color";
333
+ };
334
+ light: {
335
+ purpose: "color";
336
+ description: "A light color in the range, lighter than the base color";
337
+ };
338
+ mid: {
339
+ purpose: "color";
340
+ description: "A mid-tone color in the range, similar to the base color";
341
+ };
342
+ heavy: {
343
+ purpose: "color";
344
+ description: "A dark color in the range, darker than the base color";
345
+ };
346
+ ink: {
347
+ purpose: "color";
348
+ description: "The darkest color in the range, usually used for text and other high-contrast elements";
349
+ };
350
+ }>;
351
+ sp: {
352
+ $root: "spacing";
663
353
  xs: "spacing";
664
354
  sm: "spacing";
665
355
  md: "spacing";
666
356
  lg: "spacing";
667
357
  xl: "spacing";
668
358
  };
669
- lineWidth: {
670
- $root: {
671
- purpose: "border-width";
672
- description: string;
673
- };
674
- sm: {
675
- purpose: "border-width";
676
- description: "A hairline border width. Always >= 1px. If the global border width is small, this may be the same as \"md\"";
677
- };
678
- md: {
679
- purpose: "border-width";
680
- description: "A general-purpose border width";
681
- };
682
- lg: {
683
- purpose: "border-width";
684
- description: "A thicker border, good for emphasis";
685
- };
686
- };
687
- radius: {
688
- $root: {
689
- purpose: "border-radius";
690
- description: string;
691
- };
359
+ rd: {
360
+ $root: "border-radius";
692
361
  xs: "border-radius";
693
362
  sm: "border-radius";
694
363
  md: "border-radius";
695
364
  lg: "border-radius";
365
+ xl: "border-radius";
696
366
  full: "border-radius";
697
367
  };
368
+ lw: {
369
+ $root: "border-width";
370
+ sm: "border-width";
371
+ md: "border-width";
372
+ lg: "border-width";
373
+ };
698
374
  shadow: {
699
- $root: {
700
- purpose: "shadow";
701
- description: string;
702
- };
703
- color: {
704
- purpose: "color";
705
- description: "If specified, this token overrides shadow colors from primitives";
706
- };
375
+ $root: "shadow";
707
376
  none: {
377
+ $root: {
378
+ purpose: "shadow";
379
+ description: string;
380
+ };
708
381
  x: {
709
- purpose: "size";
382
+ purpose: "shadow-x";
710
383
  description: "Horizontal offset of the shadow";
711
384
  };
712
385
  y: {
713
- purpose: "size";
386
+ purpose: "shadow-y";
714
387
  description: "Vertical offset of the shadow";
715
388
  };
716
389
  blur: {
717
- purpose: "size";
390
+ purpose: "shadow-blur";
718
391
  description: "Blur radius of the shadow";
719
392
  };
720
393
  spread: {
721
- purpose: "size";
394
+ purpose: "shadow-spread";
722
395
  description: "Spread radius of the shadow";
723
396
  };
724
397
  color: {
725
- purpose: "color";
398
+ purpose: "shadow-color";
726
399
  description: "Color of the shadow";
727
400
  };
401
+ };
402
+ sm: {
728
403
  $root: {
729
404
  purpose: "shadow";
730
405
  description: string;
731
406
  };
732
- };
733
- sm: {
734
407
  x: {
735
- purpose: "size";
408
+ purpose: "shadow-x";
736
409
  description: "Horizontal offset of the shadow";
737
410
  };
738
411
  y: {
739
- purpose: "size";
412
+ purpose: "shadow-y";
740
413
  description: "Vertical offset of the shadow";
741
414
  };
742
415
  blur: {
743
- purpose: "size";
416
+ purpose: "shadow-blur";
744
417
  description: "Blur radius of the shadow";
745
418
  };
746
419
  spread: {
747
- purpose: "size";
420
+ purpose: "shadow-spread";
748
421
  description: "Spread radius of the shadow";
749
422
  };
750
423
  color: {
751
- purpose: "color";
424
+ purpose: "shadow-color";
752
425
  description: "Color of the shadow";
753
426
  };
427
+ };
428
+ md: {
754
429
  $root: {
755
430
  purpose: "shadow";
756
431
  description: string;
757
432
  };
758
- };
759
- md: {
760
433
  x: {
761
- purpose: "size";
434
+ purpose: "shadow-x";
762
435
  description: "Horizontal offset of the shadow";
763
436
  };
764
437
  y: {
765
- purpose: "size";
438
+ purpose: "shadow-y";
766
439
  description: "Vertical offset of the shadow";
767
440
  };
768
441
  blur: {
769
- purpose: "size";
442
+ purpose: "shadow-blur";
770
443
  description: "Blur radius of the shadow";
771
444
  };
772
445
  spread: {
773
- purpose: "size";
446
+ purpose: "shadow-spread";
774
447
  description: "Spread radius of the shadow";
775
448
  };
776
449
  color: {
777
- purpose: "color";
450
+ purpose: "shadow-color";
778
451
  description: "Color of the shadow";
779
452
  };
453
+ };
454
+ lg: {
780
455
  $root: {
781
456
  purpose: "shadow";
782
457
  description: string;
783
458
  };
784
- };
785
- lg: {
786
459
  x: {
787
- purpose: "size";
460
+ purpose: "shadow-x";
788
461
  description: "Horizontal offset of the shadow";
789
462
  };
790
463
  y: {
791
- purpose: "size";
464
+ purpose: "shadow-y";
792
465
  description: "Vertical offset of the shadow";
793
466
  };
794
467
  blur: {
795
- purpose: "size";
468
+ purpose: "shadow-blur";
796
469
  description: "Blur radius of the shadow";
797
470
  };
798
471
  spread: {
799
- purpose: "size";
472
+ purpose: "shadow-spread";
800
473
  description: "Spread radius of the shadow";
801
474
  };
802
475
  color: {
803
- purpose: "color";
476
+ purpose: "shadow-color";
804
477
  description: "Color of the shadow";
805
478
  };
479
+ };
480
+ xl: {
806
481
  $root: {
807
482
  purpose: "shadow";
808
483
  description: string;
809
484
  };
810
- };
811
- xl: {
812
485
  x: {
813
- purpose: "size";
486
+ purpose: "shadow-x";
814
487
  description: "Horizontal offset of the shadow";
815
488
  };
816
489
  y: {
817
- purpose: "size";
490
+ purpose: "shadow-y";
818
491
  description: "Vertical offset of the shadow";
819
492
  };
820
493
  blur: {
821
- purpose: "size";
494
+ purpose: "shadow-blur";
822
495
  description: "Blur radius of the shadow";
823
496
  };
824
497
  spread: {
825
- purpose: "size";
498
+ purpose: "shadow-spread";
826
499
  description: "Spread radius of the shadow";
827
500
  };
828
501
  color: {
829
- purpose: "color";
502
+ purpose: "shadow-color";
830
503
  description: "Color of the shadow";
831
504
  };
505
+ };
506
+ };
507
+ fs: {
508
+ $root: "font-size";
509
+ sm: "font-size";
510
+ md: "font-size";
511
+ lg: "font-size";
512
+ };
513
+ fw: {
514
+ $root: "font-weight";
515
+ normal: "font-weight";
516
+ bold: "font-weight";
517
+ };
518
+ lh: {
519
+ $root: "line-height";
520
+ tight: "line-height";
521
+ normal: "line-height";
522
+ loose: "line-height";
523
+ };
524
+ ls: {
525
+ $root: "letter-spacing";
526
+ tight: "letter-spacing";
527
+ normal: "letter-spacing";
528
+ loose: "letter-spacing";
529
+ };
530
+ dur: {
531
+ $root: "duration";
532
+ short: "duration";
533
+ medium: "duration";
534
+ long: "duration";
535
+ };
536
+ ease: {
537
+ $root: "easing-function";
538
+ tight: "easing-function";
539
+ medium: "easing-function";
540
+ loose: "easing-function";
541
+ in: {
542
+ $root: "easing-function";
543
+ tight: "easing-function";
544
+ medium: "easing-function";
545
+ loose: "easing-function";
546
+ };
547
+ out: {
548
+ $root: "easing-function";
549
+ tight: "easing-function";
550
+ medium: "easing-function";
551
+ loose: "easing-function";
552
+ };
553
+ };
554
+ fg: {
555
+ $root: "color";
556
+ light: "color";
557
+ ink: "color";
558
+ gray: {
559
+ $root: "color";
560
+ light: "color";
561
+ ink: "color";
562
+ };
563
+ };
564
+ bg: {
565
+ $root: "color";
566
+ paper: "color";
567
+ wash: "color";
568
+ light: "color";
569
+ bold: "color";
570
+ gray: {
571
+ $root: "color";
572
+ paper: "color";
573
+ wash: "color";
574
+ light: "color";
575
+ bold: "color";
576
+ };
577
+ };
578
+ action: {
579
+ p: {
832
580
  $root: {
833
- purpose: "shadow";
581
+ purpose: "other";
834
582
  description: string;
835
583
  };
584
+ inline: {
585
+ purpose: "spacing";
586
+ description: "Inline (horizontal, usually) padding";
587
+ };
588
+ block: {
589
+ purpose: "spacing";
590
+ description: "Block (vertical, usually) padding";
591
+ };
592
+ };
593
+ rd: "border-radius";
594
+ text: {
595
+ size: "font-size";
596
+ weight: "font-weight";
597
+ lineHeight: "line-height";
598
+ font: "font-family";
599
+ letterSpacing: "letter-spacing";
600
+ };
601
+ primary: {
602
+ fg: {
603
+ purpose: "color";
604
+ description: "Foreground color";
605
+ };
606
+ bg: {
607
+ purpose: "background";
608
+ description: "Background - can be a color or a more complex value like a gradient or image";
609
+ };
610
+ b: {
611
+ $root: {
612
+ purpose: "border";
613
+ description: string;
614
+ };
615
+ color: "color";
616
+ width: "border-width";
617
+ style: "border-style";
618
+ };
836
619
  };
837
- };
838
- easing: {
839
- in: {
840
- $root: {
841
- purpose: "easing-function";
842
- description: string;
843
- };
844
- tight: {
845
- purpose: "easing-function";
846
- description: "A short, snappy easing, good for tight interactions";
620
+ secondary: {
621
+ fg: {
622
+ purpose: "color";
623
+ description: "Foreground color";
847
624
  };
848
- medium: {
849
- purpose: "easing-function";
850
- description: "A medium easing, good for general use";
625
+ bg: {
626
+ purpose: "background";
627
+ description: "Background - can be a color or a more complex value like a gradient or image";
851
628
  };
852
- loose: {
853
- purpose: "easing-function";
854
- description: "A long, relaxed easing, good for slow interactions and animations";
629
+ b: {
630
+ $root: {
631
+ purpose: "border";
632
+ description: string;
633
+ };
634
+ color: "color";
635
+ width: "border-width";
636
+ style: "border-style";
855
637
  };
856
638
  };
857
- out: {
858
- $root: {
859
- purpose: "easing-function";
860
- description: string;
861
- };
862
- tight: {
863
- purpose: "easing-function";
864
- description: "A short, snappy easing, good for tight interactions";
639
+ ambient: {
640
+ fg: {
641
+ purpose: "color";
642
+ description: "Foreground color";
865
643
  };
866
- medium: {
867
- purpose: "easing-function";
868
- description: "A medium easing, good for general use";
644
+ bg: {
645
+ purpose: "background";
646
+ description: "Background - can be a color or a more complex value like a gradient or image";
869
647
  };
870
- loose: {
871
- purpose: "easing-function";
872
- description: "A long, relaxed easing, good for slow interactions and animations";
648
+ b: {
649
+ $root: {
650
+ purpose: "border";
651
+ description: string;
652
+ };
653
+ color: "color";
654
+ width: "border-width";
655
+ style: "border-style";
873
656
  };
874
657
  };
875
- $root: {
876
- purpose: "easing-function";
877
- description: string;
878
- };
879
- tight: {
880
- purpose: "easing-function";
881
- description: "A short, snappy easing, good for tight interactions";
882
- };
883
- medium: {
884
- purpose: "easing-function";
885
- description: "A medium easing, good for general use";
886
- };
887
- loose: {
888
- purpose: "easing-function";
889
- description: "A long, relaxed easing, good for slow interactions and animations";
890
- };
891
- };
892
- duration: {
893
- $root: {
894
- purpose: "duration";
895
- description: string;
896
- };
897
- short: {
898
- purpose: "duration";
899
- description: "A short, snappy duration, good for fast interactions and large animations";
900
- };
901
- medium: {
902
- purpose: "duration";
903
- description: "A medium duration, good for general use, fast enough for interactions";
904
- };
905
- long: {
906
- purpose: "duration";
907
- description: "A long, relaxed duration, good for slow interactions and animations";
658
+ config: {
659
+ roundness: "scalar";
908
660
  };
909
661
  };
910
- text: {
911
- weight: {
662
+ surface: {
663
+ p: {
912
664
  $root: {
913
- purpose: "font-weight";
665
+ purpose: "other";
914
666
  description: string;
915
667
  };
916
- thin: {
917
- purpose: "font-weight";
918
- description: "A thin font weight, good for large or de-emphasized text";
919
- };
920
- normal: {
921
- purpose: "font-weight";
922
- description: "A normal font weight, good for general use";
668
+ inline: {
669
+ purpose: "spacing";
670
+ description: "Inline (horizontal, usually) padding";
923
671
  };
924
- bold: {
925
- purpose: "font-weight";
926
- description: "A bold font weight, good for small or emphasized text";
672
+ block: {
673
+ purpose: "spacing";
674
+ description: "Block (vertical, usually) padding";
927
675
  };
928
676
  };
929
- size: {
930
- $root: {
931
- purpose: "font-size";
932
- description: string;
933
- };
934
- sm: {
935
- purpose: "font-size";
936
- description: "A small font size, good for captions and fine print";
677
+ rd: "border-radius";
678
+ text: {
679
+ size: "font-size";
680
+ weight: "font-weight";
681
+ lineHeight: "line-height";
682
+ font: "font-family";
683
+ letterSpacing: "letter-spacing";
684
+ };
685
+ primary: {
686
+ fg: {
687
+ purpose: "color";
688
+ description: "Foreground color";
937
689
  };
938
- md: {
939
- purpose: "font-size";
940
- description: "A medium font size, good for general use";
690
+ bg: {
691
+ purpose: "background";
692
+ description: "Background - can be a color or a more complex value like a gradient or image";
941
693
  };
942
- lg: {
943
- purpose: "font-size";
944
- description: "A large font size, good for headings and emphasis";
694
+ b: {
695
+ $root: {
696
+ purpose: "border";
697
+ description: string;
698
+ };
699
+ color: "color";
700
+ width: "border-width";
701
+ style: "border-style";
945
702
  };
946
703
  };
947
- lineHeight: {
948
- $root: {
949
- purpose: "line-height";
950
- description: string;
951
- };
952
- tight: {
953
- purpose: "line-height";
954
- description: "A tight line height, good for large text or when space is limited";
704
+ secondary: {
705
+ fg: {
706
+ purpose: "color";
707
+ description: "Foreground color";
955
708
  };
956
- normal: {
957
- purpose: "line-height";
958
- description: "A normal line height, good for general use";
709
+ bg: {
710
+ purpose: "background";
711
+ description: "Background - can be a color or a more complex value like a gradient or image";
959
712
  };
960
- loose: {
961
- purpose: "line-height";
962
- description: "A loose line height, good for small text or when readability is a concern";
713
+ b: {
714
+ $root: {
715
+ purpose: "border";
716
+ description: string;
717
+ };
718
+ color: "color";
719
+ width: "border-width";
720
+ style: "border-style";
963
721
  };
964
722
  };
965
- letterSpacing: {
966
- $root: {
967
- purpose: "letter-spacing";
968
- description: string;
969
- };
970
- tight: {
971
- purpose: "letter-spacing";
972
- description: "A tight letter spacing, good for large text or when space is limited";
973
- };
974
- normal: {
975
- purpose: "letter-spacing";
976
- description: "A normal letter spacing, good for general use";
723
+ ambient: {
724
+ fg: {
725
+ purpose: "color";
726
+ description: "Foreground color";
977
727
  };
978
- loose: {
979
- purpose: "letter-spacing";
980
- description: "A loose letter spacing, good for small text or when readability is a concern";
728
+ bg: {
729
+ purpose: "background";
730
+ description: "Background - can be a color or a more complex value like a gradient or image";
981
731
  };
982
- };
983
- };
984
- } & {
985
- color: {
986
- accent: {
987
- $neutral: {
732
+ b: {
988
733
  $root: {
989
- purpose: "color";
734
+ purpose: "border";
990
735
  description: string;
991
736
  };
992
- paper: {
993
- purpose: "color";
994
- description: "An extremely light shade, good for backgrounds and surfaces";
995
- };
996
- wash: {
997
- purpose: "color";
998
- description: "A very faint but slightly vibrant shade, good for backgrounds and surfaces";
999
- };
1000
- light: {
1001
- purpose: "color";
1002
- description: "A light shade, good for emphasized surfaces.";
1003
- };
1004
- mid: {
1005
- purpose: "color";
1006
- description: "The main shade, good for primary actions and decoration.";
1007
- };
1008
- heavy: {
1009
- purpose: "color";
1010
- description: "A heavy shade, good for text emphasis and accents.";
1011
- };
1012
- ink: {
1013
- purpose: "color";
1014
- description: "A very dark but still slightly vibrant shade, good for text and high contrast elements.";
1015
- };
737
+ color: "color";
738
+ width: "border-width";
739
+ style: "border-style";
1016
740
  };
741
+ };
742
+ config: {
743
+ roundness: "scalar";
744
+ };
745
+ };
746
+ control: {
747
+ config: {
748
+ roundness: "scalar";
749
+ };
750
+ fg: {
751
+ purpose: "color";
752
+ description: "Foreground color";
753
+ };
754
+ bg: {
755
+ purpose: "background";
756
+ description: "Background - can be a color or a more complex value like a gradient or image";
757
+ };
758
+ b: {
1017
759
  $root: {
1018
- purpose: "color";
760
+ purpose: "border";
1019
761
  description: string;
1020
762
  };
1021
- paper: {
1022
- purpose: "color";
1023
- description: "An extremely light shade, good for backgrounds and surfaces";
1024
- };
1025
- wash: {
1026
- purpose: "color";
1027
- description: "A very faint but slightly vibrant shade, good for backgrounds and surfaces";
1028
- };
1029
- light: {
1030
- purpose: "color";
1031
- description: "A light shade, good for emphasized surfaces.";
1032
- };
1033
- mid: {
1034
- purpose: "color";
1035
- description: "The main shade, good for primary actions and decoration.";
763
+ color: "color";
764
+ width: "border-width";
765
+ style: "border-style";
766
+ };
767
+ p: {
768
+ $root: {
769
+ purpose: "other";
770
+ description: string;
1036
771
  };
1037
- heavy: {
1038
- purpose: "color";
1039
- description: "A heavy shade, good for text emphasis and accents.";
772
+ inline: {
773
+ purpose: "spacing";
774
+ description: "Inline (horizontal, usually) padding";
1040
775
  };
1041
- ink: {
1042
- purpose: "color";
1043
- description: "A very dark but still slightly vibrant shade, good for text and high contrast elements.";
776
+ block: {
777
+ purpose: "spacing";
778
+ description: "Block (vertical, usually) padding";
1044
779
  };
1045
780
  };
781
+ rd: "border-radius";
782
+ text: {
783
+ size: "font-size";
784
+ weight: "font-weight";
785
+ lineHeight: "line-height";
786
+ font: "font-family";
787
+ letterSpacing: "letter-spacing";
788
+ };
789
+ };
790
+ prose: {
791
+ primary: {
792
+ size: "font-size";
793
+ weight: "font-weight";
794
+ lineHeight: "line-height";
795
+ font: "font-family";
796
+ letterSpacing: "letter-spacing";
797
+ };
798
+ secondary: {
799
+ size: "font-size";
800
+ weight: "font-weight";
801
+ lineHeight: "line-height";
802
+ font: "font-family";
803
+ letterSpacing: "letter-spacing";
804
+ };
805
+ ambient: {
806
+ size: "font-size";
807
+ weight: "font-weight";
808
+ lineHeight: "line-height";
809
+ font: "font-family";
810
+ letterSpacing: "letter-spacing";
811
+ };
812
+ };
813
+ } & {
814
+ accent: {
815
+ $root: {
816
+ purpose: "color";
817
+ description: string;
818
+ };
819
+ paper: {
820
+ purpose: "color";
821
+ description: "The lightest color in the range";
822
+ };
823
+ wash: {
824
+ purpose: "color";
825
+ description: "A light color in the range, lighter than the base color";
826
+ };
827
+ light: {
828
+ purpose: "color";
829
+ description: "A light color in the range, lighter than the base color";
830
+ };
831
+ mid: {
832
+ purpose: "color";
833
+ description: "A mid-tone color in the range, similar to the base color";
834
+ };
835
+ heavy: {
836
+ purpose: "color";
837
+ description: "A dark color in the range, darker than the base color";
838
+ };
839
+ ink: {
840
+ purpose: "color";
841
+ description: "The darkest color in the range, usually used for text and other high-contrast elements";
842
+ };
1046
843
  };
1047
844
  user: {
1048
845
  hue: {
@@ -1064,18 +861,14 @@ export declare function presetAtype<TColors extends DefaultColorRangeName = Defa
1064
861
  purpose: "background";
1065
862
  description: "Background - can be a color or a more complex value like a gradient or image";
1066
863
  };
1067
- borderColor: {
1068
- purpose: "color";
1069
- };
1070
- borderWidth: {
1071
- purpose: "border-width";
1072
- };
1073
- borderStyle: {
1074
- purpose: "border-style";
1075
- };
1076
- border: {
1077
- purpose: "border";
1078
- description: "Compiles the border color, width, and style into a single token for direct assignment to border.";
864
+ b: {
865
+ $root: {
866
+ purpose: "border";
867
+ description: string;
868
+ };
869
+ color: "color";
870
+ width: "border-width";
871
+ style: "border-style";
1079
872
  };
1080
873
  };
1081
874
  };
@@ -1119,7 +912,7 @@ export declare function presetAtype<TColors extends DefaultColorRangeName = Defa
1119
912
  }]>;
1120
913
  }, "focusRing"> & {
1121
914
  focusRing: import("@arbor-css/core").ArborFunction<import("@arbor-css/core").FunctionParams>;
1122
- }, Omit<Omit<Omit<{}, "shadow" | "fill" | "stroke" | "accent" | "borderColor" | "ring" | "fg" | "bg" | "accentLighter" | "accentHeavier" | "accentDesaturated" | "accentSaturated" | "accentFaded" | "bgLighter" | "bgHeavier" | "bgDesaturated" | "bgSaturated" | "bgFaded" | "borderColorLighter" | "borderColorHeavier" | "borderColorDesaturated" | "borderColorSaturated" | "borderColorFaded" | "fillLighter" | "fillHeavier" | "fillDesaturated" | "fillSaturated" | "fillFaded" | "fgLighter" | "fgHeavier" | "fgDesaturated" | "fgSaturated" | "fgFaded" | "strokeLighter" | "strokeHeavier" | "strokeDesaturated" | "strokeSaturated" | "strokeFaded"> & {
915
+ }, Omit<Omit<Omit<{}, "shadow" | "fill" | "stroke" | "accent" | "borderColor" | "fg" | "bg" | "ring" | "accentLighter" | "accentHeavier" | "accentDesaturated" | "accentSaturated" | "accentFaded" | "bgLighter" | "bgHeavier" | "bgDesaturated" | "bgSaturated" | "bgFaded" | "borderColorLighter" | "borderColorHeavier" | "borderColorDesaturated" | "borderColorSaturated" | "borderColorFaded" | "fillLighter" | "fillHeavier" | "fillDesaturated" | "fillSaturated" | "fillFaded" | "fgLighter" | "fgHeavier" | "fgDesaturated" | "fgSaturated" | "fgFaded" | "strokeLighter" | "strokeHeavier" | "strokeDesaturated" | "strokeSaturated" | "strokeFaded"> & {
1123
916
  readonly shadow: import("@arbor-css/core").ArborMixin<readonly [{
1124
917
  readonly name: "--shadow";
1125
918
  readonly fallback: "0 0 0 0 transparent";
@@ -1415,35 +1208,50 @@ export declare function presetAtype<TColors extends DefaultColorRangeName = Defa
1415
1208
  readonly name: "--source";
1416
1209
  readonly fallback: string;
1417
1210
  }], {
1418
- [x: string]: any;
1211
+ [x: string]: {
1212
+ [x: string]: any;
1213
+ $root?: undefined;
1214
+ };
1419
1215
  $root?: undefined;
1420
1216
  }>;
1421
1217
  readonly accentHeavier: import("@arbor-css/core").ArborMixin<readonly ["--step", {
1422
1218
  readonly name: "--source";
1423
1219
  readonly fallback: string;
1424
1220
  }], {
1425
- [x: string]: any;
1221
+ [x: string]: {
1222
+ [x: string]: any;
1223
+ $root?: undefined;
1224
+ };
1426
1225
  $root?: undefined;
1427
1226
  }>;
1428
1227
  readonly accentDesaturated: import("@arbor-css/core").ArborMixin<readonly ["--step", {
1429
1228
  readonly name: "--source";
1430
1229
  readonly fallback: string;
1431
1230
  }], {
1432
- [x: string]: any;
1231
+ [x: string]: {
1232
+ [x: string]: any;
1233
+ $root?: undefined;
1234
+ };
1433
1235
  $root?: undefined;
1434
1236
  }>;
1435
1237
  readonly accentSaturated: import("@arbor-css/core").ArborMixin<readonly ["--step", {
1436
1238
  readonly name: "--source";
1437
1239
  readonly fallback: string;
1438
1240
  }], {
1439
- [x: string]: any;
1241
+ [x: string]: {
1242
+ [x: string]: any;
1243
+ $root?: undefined;
1244
+ };
1440
1245
  $root?: undefined;
1441
1246
  }>;
1442
1247
  readonly accentFaded: import("@arbor-css/core").ArborMixin<readonly ["--opacity", {
1443
1248
  readonly name: "--source";
1444
1249
  readonly fallback: string;
1445
1250
  }], {
1446
- [x: string]: any;
1251
+ [x: string]: {
1252
+ [x: string]: any;
1253
+ $root?: undefined;
1254
+ };
1447
1255
  $root?: undefined;
1448
1256
  }>;
1449
1257
  readonly bg: import("@arbor-css/core").ArborMixin<readonly ["--color"], {
@@ -1617,35 +1425,50 @@ export declare function presetAtype<TColors extends DefaultColorRangeName = Defa
1617
1425
  readonly name: "--source";
1618
1426
  readonly fallback: string;
1619
1427
  }], {
1620
- [x: string]: any;
1428
+ [x: string]: {
1429
+ [x: string]: any;
1430
+ $root?: undefined;
1431
+ };
1621
1432
  $root?: undefined;
1622
1433
  }>;
1623
1434
  readonly bgHeavier: import("@arbor-css/core").ArborMixin<readonly ["--step", {
1624
1435
  readonly name: "--source";
1625
1436
  readonly fallback: string;
1626
1437
  }], {
1627
- [x: string]: any;
1438
+ [x: string]: {
1439
+ [x: string]: any;
1440
+ $root?: undefined;
1441
+ };
1628
1442
  $root?: undefined;
1629
1443
  }>;
1630
1444
  readonly bgDesaturated: import("@arbor-css/core").ArborMixin<readonly ["--step", {
1631
1445
  readonly name: "--source";
1632
1446
  readonly fallback: string;
1633
1447
  }], {
1634
- [x: string]: any;
1448
+ [x: string]: {
1449
+ [x: string]: any;
1450
+ $root?: undefined;
1451
+ };
1635
1452
  $root?: undefined;
1636
1453
  }>;
1637
1454
  readonly bgSaturated: import("@arbor-css/core").ArborMixin<readonly ["--step", {
1638
1455
  readonly name: "--source";
1639
1456
  readonly fallback: string;
1640
1457
  }], {
1641
- [x: string]: any;
1458
+ [x: string]: {
1459
+ [x: string]: any;
1460
+ $root?: undefined;
1461
+ };
1642
1462
  $root?: undefined;
1643
1463
  }>;
1644
1464
  readonly bgFaded: import("@arbor-css/core").ArborMixin<readonly ["--opacity", {
1645
1465
  readonly name: "--source";
1646
1466
  readonly fallback: string;
1647
1467
  }], {
1648
- [x: string]: any;
1468
+ [x: string]: {
1469
+ [x: string]: any;
1470
+ $root?: undefined;
1471
+ };
1649
1472
  $root?: undefined;
1650
1473
  }>;
1651
1474
  readonly borderColor: import("@arbor-css/core").ArborMixin<readonly ["--color"], {
@@ -1819,35 +1642,50 @@ export declare function presetAtype<TColors extends DefaultColorRangeName = Defa
1819
1642
  readonly name: "--source";
1820
1643
  readonly fallback: string;
1821
1644
  }], {
1822
- [x: string]: any;
1645
+ [x: string]: {
1646
+ [x: string]: any;
1647
+ $root?: undefined;
1648
+ };
1823
1649
  $root?: undefined;
1824
1650
  }>;
1825
1651
  readonly borderColorHeavier: import("@arbor-css/core").ArborMixin<readonly ["--step", {
1826
1652
  readonly name: "--source";
1827
1653
  readonly fallback: string;
1828
1654
  }], {
1829
- [x: string]: any;
1655
+ [x: string]: {
1656
+ [x: string]: any;
1657
+ $root?: undefined;
1658
+ };
1830
1659
  $root?: undefined;
1831
1660
  }>;
1832
1661
  readonly borderColorDesaturated: import("@arbor-css/core").ArborMixin<readonly ["--step", {
1833
1662
  readonly name: "--source";
1834
1663
  readonly fallback: string;
1835
1664
  }], {
1836
- [x: string]: any;
1665
+ [x: string]: {
1666
+ [x: string]: any;
1667
+ $root?: undefined;
1668
+ };
1837
1669
  $root?: undefined;
1838
1670
  }>;
1839
1671
  readonly borderColorSaturated: import("@arbor-css/core").ArborMixin<readonly ["--step", {
1840
1672
  readonly name: "--source";
1841
1673
  readonly fallback: string;
1842
1674
  }], {
1843
- [x: string]: any;
1675
+ [x: string]: {
1676
+ [x: string]: any;
1677
+ $root?: undefined;
1678
+ };
1844
1679
  $root?: undefined;
1845
1680
  }>;
1846
1681
  readonly borderColorFaded: import("@arbor-css/core").ArborMixin<readonly ["--opacity", {
1847
1682
  readonly name: "--source";
1848
1683
  readonly fallback: string;
1849
1684
  }], {
1850
- [x: string]: any;
1685
+ [x: string]: {
1686
+ [x: string]: any;
1687
+ $root?: undefined;
1688
+ };
1851
1689
  $root?: undefined;
1852
1690
  }>;
1853
1691
  readonly fill: import("@arbor-css/core").ArborMixin<readonly ["--color"], {
@@ -2021,35 +1859,50 @@ export declare function presetAtype<TColors extends DefaultColorRangeName = Defa
2021
1859
  readonly name: "--source";
2022
1860
  readonly fallback: string;
2023
1861
  }], {
2024
- [x: string]: any;
1862
+ [x: string]: {
1863
+ [x: string]: any;
1864
+ $root?: undefined;
1865
+ };
2025
1866
  $root?: undefined;
2026
1867
  }>;
2027
1868
  readonly fillHeavier: import("@arbor-css/core").ArborMixin<readonly ["--step", {
2028
1869
  readonly name: "--source";
2029
1870
  readonly fallback: string;
2030
1871
  }], {
2031
- [x: string]: any;
1872
+ [x: string]: {
1873
+ [x: string]: any;
1874
+ $root?: undefined;
1875
+ };
2032
1876
  $root?: undefined;
2033
1877
  }>;
2034
1878
  readonly fillDesaturated: import("@arbor-css/core").ArborMixin<readonly ["--step", {
2035
1879
  readonly name: "--source";
2036
1880
  readonly fallback: string;
2037
1881
  }], {
2038
- [x: string]: any;
1882
+ [x: string]: {
1883
+ [x: string]: any;
1884
+ $root?: undefined;
1885
+ };
2039
1886
  $root?: undefined;
2040
1887
  }>;
2041
1888
  readonly fillSaturated: import("@arbor-css/core").ArborMixin<readonly ["--step", {
2042
1889
  readonly name: "--source";
2043
1890
  readonly fallback: string;
2044
1891
  }], {
2045
- [x: string]: any;
1892
+ [x: string]: {
1893
+ [x: string]: any;
1894
+ $root?: undefined;
1895
+ };
2046
1896
  $root?: undefined;
2047
1897
  }>;
2048
1898
  readonly fillFaded: import("@arbor-css/core").ArborMixin<readonly ["--opacity", {
2049
1899
  readonly name: "--source";
2050
1900
  readonly fallback: string;
2051
1901
  }], {
2052
- [x: string]: any;
1902
+ [x: string]: {
1903
+ [x: string]: any;
1904
+ $root?: undefined;
1905
+ };
2053
1906
  $root?: undefined;
2054
1907
  }>;
2055
1908
  readonly fg: import("@arbor-css/core").ArborMixin<readonly ["--color"], {
@@ -2223,35 +2076,50 @@ export declare function presetAtype<TColors extends DefaultColorRangeName = Defa
2223
2076
  readonly name: "--source";
2224
2077
  readonly fallback: string;
2225
2078
  }], {
2226
- [x: string]: any;
2079
+ [x: string]: {
2080
+ [x: string]: any;
2081
+ $root?: undefined;
2082
+ };
2227
2083
  $root?: undefined;
2228
2084
  }>;
2229
2085
  readonly fgHeavier: import("@arbor-css/core").ArborMixin<readonly ["--step", {
2230
2086
  readonly name: "--source";
2231
2087
  readonly fallback: string;
2232
2088
  }], {
2233
- [x: string]: any;
2089
+ [x: string]: {
2090
+ [x: string]: any;
2091
+ $root?: undefined;
2092
+ };
2234
2093
  $root?: undefined;
2235
2094
  }>;
2236
2095
  readonly fgDesaturated: import("@arbor-css/core").ArborMixin<readonly ["--step", {
2237
2096
  readonly name: "--source";
2238
2097
  readonly fallback: string;
2239
2098
  }], {
2240
- [x: string]: any;
2099
+ [x: string]: {
2100
+ [x: string]: any;
2101
+ $root?: undefined;
2102
+ };
2241
2103
  $root?: undefined;
2242
2104
  }>;
2243
2105
  readonly fgSaturated: import("@arbor-css/core").ArborMixin<readonly ["--step", {
2244
2106
  readonly name: "--source";
2245
2107
  readonly fallback: string;
2246
2108
  }], {
2247
- [x: string]: any;
2109
+ [x: string]: {
2110
+ [x: string]: any;
2111
+ $root?: undefined;
2112
+ };
2248
2113
  $root?: undefined;
2249
2114
  }>;
2250
2115
  readonly fgFaded: import("@arbor-css/core").ArborMixin<readonly ["--opacity", {
2251
2116
  readonly name: "--source";
2252
2117
  readonly fallback: string;
2253
2118
  }], {
2254
- [x: string]: any;
2119
+ [x: string]: {
2120
+ [x: string]: any;
2121
+ $root?: undefined;
2122
+ };
2255
2123
  $root?: undefined;
2256
2124
  }>;
2257
2125
  readonly stroke: import("@arbor-css/core").ArborMixin<readonly ["--color"], {
@@ -2425,35 +2293,50 @@ export declare function presetAtype<TColors extends DefaultColorRangeName = Defa
2425
2293
  readonly name: "--source";
2426
2294
  readonly fallback: string;
2427
2295
  }], {
2428
- [x: string]: any;
2296
+ [x: string]: {
2297
+ [x: string]: any;
2298
+ $root?: undefined;
2299
+ };
2429
2300
  $root?: undefined;
2430
2301
  }>;
2431
2302
  readonly strokeHeavier: import("@arbor-css/core").ArborMixin<readonly ["--step", {
2432
2303
  readonly name: "--source";
2433
2304
  readonly fallback: string;
2434
2305
  }], {
2435
- [x: string]: any;
2306
+ [x: string]: {
2307
+ [x: string]: any;
2308
+ $root?: undefined;
2309
+ };
2436
2310
  $root?: undefined;
2437
2311
  }>;
2438
2312
  readonly strokeDesaturated: import("@arbor-css/core").ArborMixin<readonly ["--step", {
2439
2313
  readonly name: "--source";
2440
2314
  readonly fallback: string;
2441
2315
  }], {
2442
- [x: string]: any;
2316
+ [x: string]: {
2317
+ [x: string]: any;
2318
+ $root?: undefined;
2319
+ };
2443
2320
  $root?: undefined;
2444
2321
  }>;
2445
2322
  readonly strokeSaturated: import("@arbor-css/core").ArborMixin<readonly ["--step", {
2446
2323
  readonly name: "--source";
2447
2324
  readonly fallback: string;
2448
2325
  }], {
2449
- [x: string]: any;
2326
+ [x: string]: {
2327
+ [x: string]: any;
2328
+ $root?: undefined;
2329
+ };
2450
2330
  $root?: undefined;
2451
2331
  }>;
2452
2332
  readonly strokeFaded: import("@arbor-css/core").ArborMixin<readonly ["--opacity", {
2453
2333
  readonly name: "--source";
2454
2334
  readonly fallback: string;
2455
2335
  }], {
2456
- [x: string]: any;
2336
+ [x: string]: {
2337
+ [x: string]: any;
2338
+ $root?: undefined;
2339
+ };
2457
2340
  $root?: undefined;
2458
2341
  }>;
2459
2342
  }, "animation" | "borderColor" | "control" | "borderColorLighter" | "borderColorHeavier" | "borderColorDesaturated" | "borderColorSaturated" | "borderColorFaded" | "actionPrimary" | "actionSecondary" | "actionAmbient" | "surfacePrimary" | "surfaceSecondary" | "surfaceAmbient" | "prosePrimary" | "proseSecondary" | "proseAmbient"> & {
@@ -2628,103 +2511,166 @@ export declare function presetAtype<TColors extends DefaultColorRangeName = Defa
2628
2511
  readonly name: "--source";
2629
2512
  readonly fallback: string;
2630
2513
  }], {
2631
- [x: string]: any;
2514
+ [x: string]: {
2515
+ [x: string]: any;
2516
+ $root?: undefined;
2517
+ };
2632
2518
  $root?: undefined;
2633
2519
  }>;
2634
2520
  borderColorHeavier: import("@arbor-css/core").ArborMixin<readonly ["--step", {
2635
2521
  readonly name: "--source";
2636
2522
  readonly fallback: string;
2637
2523
  }], {
2638
- [x: string]: any;
2524
+ [x: string]: {
2525
+ [x: string]: any;
2526
+ $root?: undefined;
2527
+ };
2639
2528
  $root?: undefined;
2640
2529
  }>;
2641
2530
  borderColorDesaturated: import("@arbor-css/core").ArborMixin<readonly ["--step", {
2642
2531
  readonly name: "--source";
2643
2532
  readonly fallback: string;
2644
2533
  }], {
2645
- [x: string]: any;
2534
+ [x: string]: {
2535
+ [x: string]: any;
2536
+ $root?: undefined;
2537
+ };
2646
2538
  $root?: undefined;
2647
2539
  }>;
2648
2540
  borderColorSaturated: import("@arbor-css/core").ArborMixin<readonly ["--step", {
2649
2541
  readonly name: "--source";
2650
2542
  readonly fallback: string;
2651
2543
  }], {
2652
- [x: string]: any;
2544
+ [x: string]: {
2545
+ [x: string]: any;
2546
+ $root?: undefined;
2547
+ };
2653
2548
  $root?: undefined;
2654
2549
  }>;
2655
2550
  borderColorFaded: import("@arbor-css/core").ArborMixin<readonly ["--opacity", {
2656
2551
  readonly name: "--source";
2657
2552
  readonly fallback: string;
2658
2553
  }], {
2659
- [x: string]: any;
2554
+ [x: string]: {
2555
+ [x: string]: any;
2556
+ $root?: undefined;
2557
+ };
2660
2558
  $root?: undefined;
2661
2559
  }>;
2662
2560
  actionPrimary: import("@arbor-css/core").ArborMixin<import("@arbor-css/core").FunctionParams, {
2663
- [x: string]: any;
2561
+ [x: string]: {
2562
+ [x: string]: any;
2563
+ $root?: undefined;
2564
+ };
2664
2565
  $root?: undefined;
2665
2566
  }>;
2666
2567
  actionSecondary: import("@arbor-css/core").ArborMixin<import("@arbor-css/core").FunctionParams, {
2667
- [x: string]: any;
2568
+ [x: string]: {
2569
+ [x: string]: any;
2570
+ $root?: undefined;
2571
+ };
2668
2572
  $root?: undefined;
2669
2573
  }>;
2670
2574
  actionAmbient: import("@arbor-css/core").ArborMixin<import("@arbor-css/core").FunctionParams, {
2671
- [x: string]: any;
2575
+ [x: string]: {
2576
+ [x: string]: any;
2577
+ $root?: undefined;
2578
+ };
2672
2579
  $root?: undefined;
2673
2580
  }>;
2674
2581
  surfacePrimary: import("@arbor-css/core").ArborMixin<import("@arbor-css/core").FunctionParams, {
2675
- [x: string]: any;
2582
+ [x: string]: {
2583
+ [x: string]: any;
2584
+ $root?: undefined;
2585
+ };
2676
2586
  $root?: undefined;
2677
2587
  }>;
2678
2588
  surfaceSecondary: import("@arbor-css/core").ArborMixin<import("@arbor-css/core").FunctionParams, {
2679
- [x: string]: any;
2589
+ [x: string]: {
2590
+ [x: string]: any;
2591
+ $root?: undefined;
2592
+ };
2680
2593
  $root?: undefined;
2681
2594
  }>;
2682
2595
  surfaceAmbient: import("@arbor-css/core").ArborMixin<import("@arbor-css/core").FunctionParams, {
2683
- [x: string]: any;
2596
+ [x: string]: {
2597
+ [x: string]: any;
2598
+ $root?: undefined;
2599
+ };
2684
2600
  $root?: undefined;
2685
2601
  }>;
2686
2602
  control: import("@arbor-css/core").ArborMixin<import("@arbor-css/core").FunctionParams, {
2687
- [x: string]: any;
2603
+ [x: string]: {
2604
+ [x: string]: any;
2605
+ $root?: undefined;
2606
+ };
2688
2607
  $root?: undefined;
2689
2608
  }>;
2690
2609
  prosePrimary: import("@arbor-css/core").ArborMixin<import("@arbor-css/core").FunctionParams, {
2691
- [x: string]: any;
2610
+ [x: string]: {
2611
+ [x: string]: any;
2612
+ $root?: undefined;
2613
+ };
2692
2614
  $root?: undefined;
2693
2615
  }>;
2694
2616
  proseSecondary: import("@arbor-css/core").ArborMixin<import("@arbor-css/core").FunctionParams, {
2695
- [x: string]: any;
2617
+ [x: string]: {
2618
+ [x: string]: any;
2619
+ $root?: undefined;
2620
+ };
2696
2621
  $root?: undefined;
2697
2622
  }>;
2698
2623
  proseAmbient: import("@arbor-css/core").ArborMixin<import("@arbor-css/core").FunctionParams, {
2699
- [x: string]: any;
2624
+ [x: string]: {
2625
+ [x: string]: any;
2626
+ $root?: undefined;
2627
+ };
2700
2628
  $root?: undefined;
2701
2629
  }>;
2702
2630
  animation: import("@arbor-css/core").ArborMixin<{
2703
2631
  name: "--name";
2704
2632
  syntax: string;
2705
2633
  }[], {
2706
- [x: string]: any;
2634
+ [x: string]: {
2635
+ [x: string]: any;
2636
+ $root?: undefined;
2637
+ };
2707
2638
  $root?: undefined;
2708
2639
  }>;
2709
2640
  }, "focus" | "hover" | "active" | "disabled" | "actionLight"> & {
2710
2641
  actionLight: import("@arbor-css/core").ArborMixin<any, {
2711
- [x: string]: /*elided*/ any;
2642
+ [x: string]: {
2643
+ [x: string]: /*elided*/ any;
2644
+ $root?: undefined;
2645
+ };
2712
2646
  $root?: undefined;
2713
2647
  }>;
2714
2648
  hover: import("@arbor-css/core").ArborMixin<any, {
2715
- [x: string]: /*elided*/ any;
2649
+ [x: string]: {
2650
+ [x: string]: /*elided*/ any;
2651
+ $root?: undefined;
2652
+ };
2716
2653
  $root?: undefined;
2717
2654
  }>;
2718
2655
  focus: import("@arbor-css/core").ArborMixin<any, {
2719
- [x: string]: /*elided*/ any;
2656
+ [x: string]: {
2657
+ [x: string]: /*elided*/ any;
2658
+ $root?: undefined;
2659
+ };
2720
2660
  $root?: undefined;
2721
2661
  }>;
2722
2662
  active: import("@arbor-css/core").ArborMixin<any, {
2723
- [x: string]: /*elided*/ any;
2663
+ [x: string]: {
2664
+ [x: string]: /*elided*/ any;
2665
+ $root?: undefined;
2666
+ };
2724
2667
  $root?: undefined;
2725
2668
  }>;
2726
2669
  disabled: import("@arbor-css/core").ArborMixin<any, {
2727
- [x: string]: /*elided*/ any;
2670
+ [x: string]: {
2671
+ [x: string]: /*elided*/ any;
2672
+ $root?: undefined;
2673
+ };
2728
2674
  $root?: undefined;
2729
2675
  }>;
2730
2676
  }>;