@vireo-ai/trellis-ui 0.1.30 → 0.1.31

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 (27) hide show
  1. package/package.json +1 -1
  2. package/packages/client/src/components/select/styles.css +4 -0
  3. package/packages/client/src/components/toast/styles.css +16 -74
  4. package/packages/client/src/styles/components.css +1 -0
  5. package/packages/client/src/styles/generated/theme-runtime.css +1 -4
  6. package/packages/client/src/styles/generated-sources.css +1 -1
  7. package/packages/client/src/styles/recipes/action.css +19 -109
  8. package/packages/client/src/styles/recipes/intent.css +101 -0
  9. package/packages/client/src/styles/theme.css +0 -11
  10. package/packages/client/types/styles/tailwind-candidates.d.ts +1 -0
  11. package/packages/server/trellis_ui/static/trellis_ui/assets/css/trellis.css +128 -185
  12. package/packages/server/trellis_ui/static/trellis_ui/assets/css/trellis.min.css +1 -1
  13. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/build-metadata.json +68 -68
  14. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-BJ0fQYT1.js +2 -0
  15. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-BJ0fQYT1.js.map +1 -0
  16. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-eVXGqjCM.js +2 -0
  17. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/{entry.generated-C3h9Czzn.js.map → entry.generated-eVXGqjCM.js.map} +1 -1
  18. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/index.js +1 -1
  19. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/panels.js +1 -1
  20. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/components/select.js +1 -1
  21. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/index.js +1 -1
  22. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/logical-entry-manifest.json +6 -6
  23. package/packages/server/trellis_ui/static/trellis_ui/assets/js/trellis.js +1 -1
  24. package/packages/server/trellis_ui/static/trellis_ui/assets/js/trellis.min.js +1 -1
  25. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-BqOi_tIN.js +0 -2
  26. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-BqOi_tIN.js.map +0 -1
  27. package/packages/server/trellis_ui/static/trellis_ui/assets/js/esm/chunks/entry.generated-C3h9Czzn.js +0 -2
package/packages/server/trellis_ui/static/trellis_ui/assets/css/trellis.css CHANGED
@@ -1440,9 +1440,6 @@
1440
1440
  .max-h-prose {
1441
1441
  max-height: 65ch;
1442
1442
  }
1443
- .max-h-select-listbox {
1444
- max-height: var(--spacing-select-listbox);
1445
- }
1446
1443
  .max-h-sm {
1447
1444
  max-height: var(--container-sm);
1448
1445
  }
@@ -8899,6 +8896,9 @@
8899
8896
  }
8900
8897
  }
8901
8898
  @layer components {
8899
+ [data-ui-select-viewport] {
8900
+ max-height: var(--ui-select-listbox-max-height, var(--spacing-select-listbox));
8901
+ }
8902
8902
  [data-ui-select-sheet-heading] {
8903
8903
  display: none;
8904
8904
  }
@@ -9598,145 +9598,152 @@
9598
9598
  }
9599
9599
  }
9600
9600
  @layer components {
9601
- [data-ui-action-recipe] {
9602
- --ui-action-text: var(--ui-surface-ink);
9603
- --ui-action-text-hover: var(--ui-surface-ink);
9604
- --ui-action-soft: var(--color-intent-neutral-soft);
9605
- --ui-action-soft-hover: var(--color-intent-neutral-soft-hover);
9606
- --ui-action-soft-pressed: var(--color-intent-neutral-soft-pressed);
9607
- --ui-action-soft-ink: var(--color-intent-neutral-soft-ink);
9608
- --ui-action-solid: var(--color-intent-neutral-solid);
9609
- --ui-action-solid-hover: var(--color-intent-neutral-solid-hover);
9610
- --ui-action-solid-pressed: var(--color-intent-neutral-solid-pressed);
9611
- --ui-action-solid-ink: var(--color-intent-neutral-solid-ink);
9612
- --ui-action-edge: var(--ui-surface-edge);
9613
- --ui-action-edge-hover: var(--ui-surface-edge-hover);
9614
- --ui-action-edge-strong: var(--ui-surface-edge-strong);
9615
- --ui-action-focus: var(--color-intent-neutral-focus);
9616
- --ui-action-focus-width: var(--color-intent-neutral-focus-width);
9617
- }
9618
- [data-ui-action-recipe][data-color="accent"] {
9619
- --ui-action-text: var(--color-intent-accent-text);
9620
- --ui-action-text-hover: var(--color-intent-accent-text-hover);
9621
- --ui-action-soft: var(--color-intent-accent-soft);
9622
- --ui-action-soft-hover: var(--color-intent-accent-soft-hover);
9623
- --ui-action-soft-pressed: var(--color-intent-accent-soft-pressed);
9624
- --ui-action-soft-ink: var(--color-intent-accent-soft-ink);
9625
- --ui-action-solid: var(--color-intent-accent-solid);
9626
- --ui-action-solid-hover: var(--color-intent-accent-solid-hover);
9627
- --ui-action-solid-pressed: var(--color-intent-accent-solid-pressed);
9628
- --ui-action-solid-ink: var(--color-intent-accent-solid-ink);
9629
- --ui-action-edge: var(--color-intent-accent-edge);
9630
- --ui-action-edge-hover: var(--color-intent-accent-edge-hover);
9631
- --ui-action-edge-strong: var(--color-intent-accent-edge-strong);
9632
- --ui-action-focus: var(--color-intent-accent-focus);
9633
- --ui-action-focus-width: var(--color-intent-accent-focus-width);
9634
- }
9635
- [data-ui-action-recipe][data-color="success"] {
9636
- --ui-action-text: var(--color-intent-success-text);
9637
- --ui-action-text-hover: var(--color-intent-success-text-hover);
9638
- --ui-action-soft: var(--color-intent-success-soft);
9639
- --ui-action-soft-hover: var(--color-intent-success-soft-hover);
9640
- --ui-action-soft-pressed: var(--color-intent-success-soft-pressed);
9641
- --ui-action-soft-ink: var(--color-intent-success-soft-ink);
9642
- --ui-action-solid: var(--color-intent-success-solid);
9643
- --ui-action-solid-hover: var(--color-intent-success-solid-hover);
9644
- --ui-action-solid-pressed: var(--color-intent-success-solid-pressed);
9645
- --ui-action-solid-ink: var(--color-intent-success-solid-ink);
9646
- --ui-action-edge: var(--color-intent-success-edge);
9647
- --ui-action-edge-hover: var(--color-intent-success-edge-hover);
9648
- --ui-action-edge-strong: var(--color-intent-success-edge-strong);
9649
- --ui-action-focus: var(--color-intent-success-focus);
9650
- --ui-action-focus-width: var(--color-intent-success-focus-width);
9651
- }
9652
- [data-ui-action-recipe][data-color="warning"] {
9653
- --ui-action-text: var(--color-intent-warning-text);
9654
- --ui-action-text-hover: var(--color-intent-warning-text-hover);
9655
- --ui-action-soft: var(--color-intent-warning-soft);
9656
- --ui-action-soft-hover: var(--color-intent-warning-soft-hover);
9657
- --ui-action-soft-pressed: var(--color-intent-warning-soft-pressed);
9658
- --ui-action-soft-ink: var(--color-intent-warning-soft-ink);
9659
- --ui-action-solid: var(--color-intent-warning-solid);
9660
- --ui-action-solid-hover: var(--color-intent-warning-solid-hover);
9661
- --ui-action-solid-pressed: var(--color-intent-warning-solid-pressed);
9662
- --ui-action-solid-ink: var(--color-intent-warning-solid-ink);
9663
- --ui-action-edge: var(--color-intent-warning-edge);
9664
- --ui-action-edge-hover: var(--color-intent-warning-edge-hover);
9665
- --ui-action-edge-strong: var(--color-intent-warning-edge-strong);
9666
- --ui-action-focus: var(--color-intent-warning-focus);
9667
- --ui-action-focus-width: var(--color-intent-warning-focus-width);
9668
- }
9669
- [data-ui-action-recipe][data-color="danger"] {
9670
- --ui-action-text: var(--color-intent-danger-text);
9671
- --ui-action-text-hover: var(--color-intent-danger-text-hover);
9672
- --ui-action-soft: var(--color-intent-danger-soft);
9673
- --ui-action-soft-hover: var(--color-intent-danger-soft-hover);
9674
- --ui-action-soft-pressed: var(--color-intent-danger-soft-pressed);
9675
- --ui-action-soft-ink: var(--color-intent-danger-soft-ink);
9676
- --ui-action-solid: var(--color-intent-danger-solid);
9677
- --ui-action-solid-hover: var(--color-intent-danger-solid-hover);
9678
- --ui-action-solid-pressed: var(--color-intent-danger-solid-pressed);
9679
- --ui-action-solid-ink: var(--color-intent-danger-solid-ink);
9680
- --ui-action-edge: var(--color-intent-danger-edge);
9681
- --ui-action-edge-hover: var(--color-intent-danger-edge-hover);
9682
- --ui-action-edge-strong: var(--color-intent-danger-edge-strong);
9683
- --ui-action-focus: var(--color-intent-danger-focus);
9684
- --ui-action-focus-width: var(--color-intent-danger-focus-width);
9601
+ :is([data-ui-action-recipe], [data-ui-toast-recipe]) {
9602
+ --ui-intent-text: var(--ui-surface-ink);
9603
+ --ui-intent-text-hover: var(--ui-surface-ink);
9604
+ --ui-intent-soft: var(--color-intent-neutral-soft);
9605
+ --ui-intent-soft-hover: var(--color-intent-neutral-soft-hover);
9606
+ --ui-intent-soft-pressed: var(--color-intent-neutral-soft-pressed);
9607
+ --ui-intent-soft-ink: var(--color-intent-neutral-soft-ink);
9608
+ --ui-intent-soft-ink-muted: var(--color-intent-neutral-soft-ink-muted);
9609
+ --ui-intent-solid: var(--color-intent-neutral-solid);
9610
+ --ui-intent-solid-hover: var(--color-intent-neutral-solid-hover);
9611
+ --ui-intent-solid-pressed: var(--color-intent-neutral-solid-pressed);
9612
+ --ui-intent-solid-ink: var(--color-intent-neutral-solid-ink);
9613
+ --ui-intent-edge: var(--ui-surface-edge);
9614
+ --ui-intent-edge-hover: var(--ui-surface-edge-hover);
9615
+ --ui-intent-edge-strong: var(--ui-surface-edge-strong);
9616
+ --ui-intent-focus: var(--color-intent-neutral-focus);
9617
+ --ui-intent-focus-width: var(--color-intent-neutral-focus-width);
9618
+ }
9619
+ :is([data-ui-action-recipe], [data-ui-toast-recipe])[data-color="accent"] {
9620
+ --ui-intent-text: var(--color-intent-accent-text);
9621
+ --ui-intent-text-hover: var(--color-intent-accent-text-hover);
9622
+ --ui-intent-soft: var(--color-intent-accent-soft);
9623
+ --ui-intent-soft-hover: var(--color-intent-accent-soft-hover);
9624
+ --ui-intent-soft-pressed: var(--color-intent-accent-soft-pressed);
9625
+ --ui-intent-soft-ink: var(--color-intent-accent-soft-ink);
9626
+ --ui-intent-soft-ink-muted: var(--color-intent-accent-soft-ink-muted);
9627
+ --ui-intent-solid: var(--color-intent-accent-solid);
9628
+ --ui-intent-solid-hover: var(--color-intent-accent-solid-hover);
9629
+ --ui-intent-solid-pressed: var(--color-intent-accent-solid-pressed);
9630
+ --ui-intent-solid-ink: var(--color-intent-accent-solid-ink);
9631
+ --ui-intent-edge: var(--color-intent-accent-edge);
9632
+ --ui-intent-edge-hover: var(--color-intent-accent-edge-hover);
9633
+ --ui-intent-edge-strong: var(--color-intent-accent-edge-strong);
9634
+ --ui-intent-focus: var(--color-intent-accent-focus);
9635
+ --ui-intent-focus-width: var(--color-intent-accent-focus-width);
9636
+ }
9637
+ :is([data-ui-action-recipe], [data-ui-toast-recipe])[data-color="success"] {
9638
+ --ui-intent-text: var(--color-intent-success-text);
9639
+ --ui-intent-text-hover: var(--color-intent-success-text-hover);
9640
+ --ui-intent-soft: var(--color-intent-success-soft);
9641
+ --ui-intent-soft-hover: var(--color-intent-success-soft-hover);
9642
+ --ui-intent-soft-pressed: var(--color-intent-success-soft-pressed);
9643
+ --ui-intent-soft-ink: var(--color-intent-success-soft-ink);
9644
+ --ui-intent-soft-ink-muted: var(--color-intent-success-soft-ink-muted);
9645
+ --ui-intent-solid: var(--color-intent-success-solid);
9646
+ --ui-intent-solid-hover: var(--color-intent-success-solid-hover);
9647
+ --ui-intent-solid-pressed: var(--color-intent-success-solid-pressed);
9648
+ --ui-intent-solid-ink: var(--color-intent-success-solid-ink);
9649
+ --ui-intent-edge: var(--color-intent-success-edge);
9650
+ --ui-intent-edge-hover: var(--color-intent-success-edge-hover);
9651
+ --ui-intent-edge-strong: var(--color-intent-success-edge-strong);
9652
+ --ui-intent-focus: var(--color-intent-success-focus);
9653
+ --ui-intent-focus-width: var(--color-intent-success-focus-width);
9654
+ }
9655
+ :is([data-ui-action-recipe], [data-ui-toast-recipe])[data-color="warning"] {
9656
+ --ui-intent-text: var(--color-intent-warning-text);
9657
+ --ui-intent-text-hover: var(--color-intent-warning-text-hover);
9658
+ --ui-intent-soft: var(--color-intent-warning-soft);
9659
+ --ui-intent-soft-hover: var(--color-intent-warning-soft-hover);
9660
+ --ui-intent-soft-pressed: var(--color-intent-warning-soft-pressed);
9661
+ --ui-intent-soft-ink: var(--color-intent-warning-soft-ink);
9662
+ --ui-intent-soft-ink-muted: var(--color-intent-warning-soft-ink-muted);
9663
+ --ui-intent-solid: var(--color-intent-warning-solid);
9664
+ --ui-intent-solid-hover: var(--color-intent-warning-solid-hover);
9665
+ --ui-intent-solid-pressed: var(--color-intent-warning-solid-pressed);
9666
+ --ui-intent-solid-ink: var(--color-intent-warning-solid-ink);
9667
+ --ui-intent-edge: var(--color-intent-warning-edge);
9668
+ --ui-intent-edge-hover: var(--color-intent-warning-edge-hover);
9669
+ --ui-intent-edge-strong: var(--color-intent-warning-edge-strong);
9670
+ --ui-intent-focus: var(--color-intent-warning-focus);
9671
+ --ui-intent-focus-width: var(--color-intent-warning-focus-width);
9672
+ }
9673
+ :is([data-ui-action-recipe], [data-ui-toast-recipe])[data-color="danger"] {
9674
+ --ui-intent-text: var(--color-intent-danger-text);
9675
+ --ui-intent-text-hover: var(--color-intent-danger-text-hover);
9676
+ --ui-intent-soft: var(--color-intent-danger-soft);
9677
+ --ui-intent-soft-hover: var(--color-intent-danger-soft-hover);
9678
+ --ui-intent-soft-pressed: var(--color-intent-danger-soft-pressed);
9679
+ --ui-intent-soft-ink: var(--color-intent-danger-soft-ink);
9680
+ --ui-intent-soft-ink-muted: var(--color-intent-danger-soft-ink-muted);
9681
+ --ui-intent-solid: var(--color-intent-danger-solid);
9682
+ --ui-intent-solid-hover: var(--color-intent-danger-solid-hover);
9683
+ --ui-intent-solid-pressed: var(--color-intent-danger-solid-pressed);
9684
+ --ui-intent-solid-ink: var(--color-intent-danger-solid-ink);
9685
+ --ui-intent-edge: var(--color-intent-danger-edge);
9686
+ --ui-intent-edge-hover: var(--color-intent-danger-edge-hover);
9687
+ --ui-intent-edge-strong: var(--color-intent-danger-edge-strong);
9688
+ --ui-intent-focus: var(--color-intent-danger-focus);
9689
+ --ui-intent-focus-width: var(--color-intent-danger-focus-width);
9685
9690
  }
9691
+ }
9692
+ @layer components {
9686
9693
  [data-ui-action-recipe]:where([data-variant="ghost"], [data-variant="link"]) {
9687
- color: var(--ui-action-text);
9694
+ color: var(--ui-intent-text);
9688
9695
  background-color: transparent;
9689
9696
  box-shadow: none;
9690
9697
  }
9691
9698
  [data-ui-action-recipe][data-variant="soft"] {
9692
- color: var(--ui-action-soft-ink);
9693
- background-color: var(--ui-action-soft);
9699
+ color: var(--ui-intent-soft-ink);
9700
+ background-color: var(--ui-intent-soft);
9694
9701
  box-shadow: none;
9695
9702
  }
9696
9703
  [data-ui-select-chip][data-variant="soft"] {
9697
- background-color: var(--ui-action-soft-hover);
9704
+ background-color: var(--ui-intent-soft-hover);
9698
9705
  }
9699
9706
  [data-ui-action-recipe][data-variant="surface"] {
9700
- color: var(--ui-action-text);
9707
+ color: var(--ui-intent-text);
9701
9708
  background-color: var(--color-interaction-hover);
9702
- box-shadow: 0 0 0 var(--border-width-edge-control) var(--ui-action-edge);
9709
+ box-shadow: 0 0 0 var(--border-width-edge-control) var(--ui-intent-edge);
9703
9710
  }
9704
9711
  [data-ui-action-recipe][data-variant="outline"] {
9705
- color: var(--ui-action-text);
9712
+ color: var(--ui-intent-text);
9706
9713
  background-color: transparent;
9707
- box-shadow: 0 0 0 var(--border-width-edge-control) var(--ui-action-edge);
9714
+ box-shadow: 0 0 0 var(--border-width-edge-control) var(--ui-intent-edge);
9708
9715
  }
9709
9716
  [data-ui-action-recipe][data-variant="solid"] {
9710
- color: var(--ui-action-solid-ink);
9711
- background-color: var(--ui-action-solid);
9717
+ color: var(--ui-intent-solid-ink);
9718
+ background-color: var(--ui-intent-solid);
9712
9719
  box-shadow: var(--shadow-elevation-1);
9713
9720
  }
9714
9721
  :is([data-ui-button], [data-ui-badge][data-interactive]):focus-visible {
9715
- box-shadow: 0 0 0 var(--ui-action-focus-width) var(--ui-action-focus);
9722
+ box-shadow: 0 0 0 var(--ui-intent-focus-width) var(--ui-intent-focus);
9716
9723
  }
9717
9724
  :is([data-ui-button], [data-ui-badge][data-interactive]):where([data-variant="surface"], [data-variant="outline"]):hover:not(:disabled):not([aria-disabled="true"]) {
9718
- color: var(--ui-action-text-hover);
9725
+ color: var(--ui-intent-text-hover);
9719
9726
  background-color: var(--color-interaction-hover);
9720
- box-shadow: 0 0 0 var(--border-width-edge-control) var(--ui-action-edge-hover);
9727
+ box-shadow: 0 0 0 var(--border-width-edge-control) var(--ui-intent-edge-hover);
9721
9728
  }
9722
9729
  :is([data-ui-button], [data-ui-badge][data-interactive])[data-variant="ghost"]:hover:not(:disabled):not([aria-disabled="true"]) {
9723
- color: var(--ui-action-text-hover);
9730
+ color: var(--ui-intent-text-hover);
9724
9731
  background-color: var(--color-interaction-hover);
9725
9732
  }
9726
9733
  :is([data-ui-button], [data-ui-badge][data-interactive])[data-variant="link"]:hover:not(:disabled):not([aria-disabled="true"]) {
9727
- color: var(--ui-action-text-hover);
9734
+ color: var(--ui-intent-text-hover);
9728
9735
  }
9729
9736
  :is([data-ui-button], [data-ui-badge][data-interactive])[data-variant="soft"]:hover:not(:disabled):not([aria-disabled="true"]) {
9730
- background-color: var(--ui-action-soft-hover);
9737
+ background-color: var(--ui-intent-soft-hover);
9731
9738
  }
9732
9739
  :is([data-ui-button], [data-ui-badge][data-interactive])[data-variant="solid"]:hover:not(:disabled):not([aria-disabled="true"]) {
9733
- background-color: var(--ui-action-solid-hover);
9740
+ background-color: var(--ui-intent-solid-hover);
9734
9741
  }
9735
9742
  :is([data-ui-button], [data-ui-badge][data-interactive])[data-variant="soft"]:active:not(:disabled):not([aria-disabled="true"]) {
9736
- background-color: var(--ui-action-soft-pressed);
9743
+ background-color: var(--ui-intent-soft-pressed);
9737
9744
  }
9738
9745
  :is([data-ui-button], [data-ui-badge][data-interactive])[data-variant="solid"]:active:not(:disabled):not([aria-disabled="true"]) {
9739
- background-color: var(--ui-action-solid-pressed);
9746
+ background-color: var(--ui-intent-solid-pressed);
9740
9747
  }
9741
9748
  :is([data-ui-button], [data-ui-badge][data-interactive]):where([data-variant="ghost"], [data-variant="surface"], [data-variant="outline"]):active:not(:disabled):not([aria-disabled="true"]) {
9742
9749
  background-color: var(--color-interaction-pressed);
@@ -9751,6 +9758,9 @@
9751
9758
  box-shadow: 0 0 0 1px currentColor;
9752
9759
  }
9753
9760
  }
9761
+ [data-ui-toast-outlet] {
9762
+ --ui-toast-stack-peek: 8px;
9763
+ }
9754
9764
  [data-ui-toast-outlet][data-stack="collapsed"] {
9755
9765
  display: block;
9756
9766
  height: var(--ui-toast-stack-height);
@@ -9790,93 +9800,35 @@
9790
9800
  }
9791
9801
  @layer components {
9792
9802
  [data-ui-toast-recipe] {
9793
- --ui-toast-text: var(--ui-surface-ink);
9794
- --ui-toast-soft: var(--color-intent-neutral-soft);
9795
- --ui-toast-soft-ink: var(--color-intent-neutral-soft-ink);
9796
- --ui-toast-soft-ink-muted: var(--color-intent-neutral-soft-ink-muted);
9797
- --ui-toast-solid: var(--color-intent-neutral-solid);
9798
- --ui-toast-solid-ink: var(--color-intent-neutral-solid-ink);
9799
- --ui-toast-edge: var(--ui-surface-edge);
9800
- --ui-toast-edge-strong: var(--ui-surface-edge-strong);
9801
- --ui-toast-focus: var(--color-intent-neutral-focus);
9802
- --ui-toast-focus-width: var(--color-intent-neutral-focus-width);
9803
9803
  --ui-toast-ink: var(--ui-surface-ink);
9804
9804
  --ui-toast-ink-muted: var(--ui-surface-ink-muted);
9805
9805
  color: var(--ui-toast-ink);
9806
9806
  background-color: var(--ui-surface-color);
9807
9807
  }
9808
- [data-ui-toast-recipe][data-color="accent"] {
9809
- --ui-toast-text: var(--color-intent-accent-text);
9810
- --ui-toast-soft: var(--color-intent-accent-soft);
9811
- --ui-toast-soft-ink: var(--color-intent-accent-soft-ink);
9812
- --ui-toast-soft-ink-muted: var(--color-intent-accent-soft-ink-muted);
9813
- --ui-toast-solid: var(--color-intent-accent-solid);
9814
- --ui-toast-solid-ink: var(--color-intent-accent-solid-ink);
9815
- --ui-toast-edge: var(--color-intent-accent-edge);
9816
- --ui-toast-edge-strong: var(--color-intent-accent-edge-strong);
9817
- --ui-toast-focus: var(--color-intent-accent-focus);
9818
- --ui-toast-focus-width: var(--color-intent-accent-focus-width);
9819
- }
9820
- [data-ui-toast-recipe][data-color="success"] {
9821
- --ui-toast-text: var(--color-intent-success-text);
9822
- --ui-toast-soft: var(--color-intent-success-soft);
9823
- --ui-toast-soft-ink: var(--color-intent-success-soft-ink);
9824
- --ui-toast-soft-ink-muted: var(--color-intent-success-soft-ink-muted);
9825
- --ui-toast-solid: var(--color-intent-success-solid);
9826
- --ui-toast-solid-ink: var(--color-intent-success-solid-ink);
9827
- --ui-toast-edge: var(--color-intent-success-edge);
9828
- --ui-toast-edge-strong: var(--color-intent-success-edge-strong);
9829
- --ui-toast-focus: var(--color-intent-success-focus);
9830
- --ui-toast-focus-width: var(--color-intent-success-focus-width);
9831
- }
9832
- [data-ui-toast-recipe][data-color="warning"] {
9833
- --ui-toast-text: var(--color-intent-warning-text);
9834
- --ui-toast-soft: var(--color-intent-warning-soft);
9835
- --ui-toast-soft-ink: var(--color-intent-warning-soft-ink);
9836
- --ui-toast-soft-ink-muted: var(--color-intent-warning-soft-ink-muted);
9837
- --ui-toast-solid: var(--color-intent-warning-solid);
9838
- --ui-toast-solid-ink: var(--color-intent-warning-solid-ink);
9839
- --ui-toast-edge: var(--color-intent-warning-edge);
9840
- --ui-toast-edge-strong: var(--color-intent-warning-edge-strong);
9841
- --ui-toast-focus: var(--color-intent-warning-focus);
9842
- --ui-toast-focus-width: var(--color-intent-warning-focus-width);
9843
- }
9844
- [data-ui-toast-recipe][data-color="danger"] {
9845
- --ui-toast-text: var(--color-intent-danger-text);
9846
- --ui-toast-soft: var(--color-intent-danger-soft);
9847
- --ui-toast-soft-ink: var(--color-intent-danger-soft-ink);
9848
- --ui-toast-soft-ink-muted: var(--color-intent-danger-soft-ink-muted);
9849
- --ui-toast-solid: var(--color-intent-danger-solid);
9850
- --ui-toast-solid-ink: var(--color-intent-danger-solid-ink);
9851
- --ui-toast-edge: var(--color-intent-danger-edge);
9852
- --ui-toast-edge-strong: var(--color-intent-danger-edge-strong);
9853
- --ui-toast-focus: var(--color-intent-danger-focus);
9854
- --ui-toast-focus-width: var(--color-intent-danger-focus-width);
9855
- }
9856
9808
  [data-ui-toast-recipe][data-variant="soft"] {
9857
- --ui-toast-ink: var(--ui-toast-soft-ink);
9858
- --ui-toast-ink-muted: var(--ui-toast-soft-ink-muted);
9809
+ --ui-toast-ink: var(--ui-intent-soft-ink);
9810
+ --ui-toast-ink-muted: var(--ui-intent-soft-ink-muted);
9859
9811
  color: var(--ui-toast-ink);
9860
- background-color: var(--ui-toast-soft);
9812
+ background-color: var(--ui-intent-soft);
9861
9813
  }
9862
9814
  [data-ui-toast-recipe][data-variant="surface"] {
9863
- --ui-state-shadow-layers: 0 0 0 var(--border-width-edge-perimeter) var(--ui-toast-edge);
9815
+ --ui-state-shadow-layers: 0 0 0 var(--border-width-edge-perimeter) var(--ui-intent-edge);
9864
9816
  }
9865
9817
  [data-ui-toast-recipe][data-variant="outline"] {
9866
- --ui-toast-ink: var(--ui-toast-text);
9867
- --ui-toast-ink-muted: var(--ui-toast-text);
9868
- --ui-state-shadow-layers: 0 0 0 var(--border-width-edge-perimeter) var(--ui-toast-edge-strong);
9818
+ --ui-toast-ink: var(--ui-intent-text);
9819
+ --ui-toast-ink-muted: var(--ui-intent-text);
9820
+ --ui-state-shadow-layers: 0 0 0 var(--border-width-edge-perimeter) var(--ui-intent-edge-strong);
9869
9821
  color: var(--ui-toast-ink);
9870
9822
  background-color: transparent;
9871
9823
  }
9872
9824
  [data-ui-toast-recipe][data-variant="solid"] {
9873
- --ui-toast-ink: var(--ui-toast-solid-ink);
9874
- --ui-toast-ink-muted: var(--ui-toast-solid-ink);
9825
+ --ui-toast-ink: var(--ui-intent-solid-ink);
9826
+ --ui-toast-ink-muted: var(--ui-intent-solid-ink);
9875
9827
  color: var(--ui-toast-ink);
9876
- background-color: var(--ui-toast-solid);
9828
+ background-color: var(--ui-intent-solid);
9877
9829
  }
9878
9830
  [data-ui-toast-marker] {
9879
- background-color: var(--ui-toast-solid);
9831
+ background-color: var(--ui-intent-solid);
9880
9832
  }
9881
9833
  [data-ui-toast-title] {
9882
9834
  color: var(--ui-toast-ink);
@@ -9896,7 +9848,7 @@
9896
9848
  }
9897
9849
  [data-ui-toast-close]:focus-visible {
9898
9850
  color: var(--ui-toast-ink);
9899
- box-shadow: 0 0 0 var(--ui-toast-focus-width) var(--ui-toast-focus);
9851
+ box-shadow: 0 0 0 var(--ui-intent-focus-width) var(--ui-intent-focus);
9900
9852
  }
9901
9853
  }
9902
9854
  @layer components {
@@ -10517,10 +10469,6 @@
10517
10469
  }
10518
10470
  :root, .light, .dark {
10519
10471
  color-scheme: light;
10520
- --ui-font-weight-normal: var(--font-weight-normal);
10521
- --ui-font-weight-medium: var(--font-weight-medium);
10522
- --ui-font-weight-semibold: var(--font-weight-semibold);
10523
- --ui-letter-spacing: 0;
10524
10472
  --ui-label-ink: var(--ui-surface-ink-muted);
10525
10473
  @supports (color: color-mix(in lab, red, red)) {
10526
10474
  --ui-label-ink: color-mix(
@@ -10534,13 +10482,8 @@
10534
10482
  --ui-control-height-md: var(--spacing-control-md);
10535
10483
  --ui-control-height-lg: var(--spacing-control-lg);
10536
10484
  --ui-control-height-xlg: var(--spacing-control-xlg);
10537
- --ui-control-radius: var(--radius-control);
10538
10485
  --ui-popover-radius: var(--radius-overlay-sm);
10539
10486
  --ui-popover-padding: var(--spacing-popover-padding);
10540
- --ui-popover-z: var(--z-index-popover);
10541
- --ui-toast-stack-peek: 8px;
10542
- --ui-select-listbox-max-height: var(--spacing-select-listbox);
10543
- --ui-menu-item-height: var(--spacing-menu-item);
10544
10487
  --ui-icon-size-xs: var(--spacing-icon-xs);
10545
10488
  --ui-icon-size-sm: var(--spacing-icon-sm);
10546
10489
  --ui-icon-size: var(--spacing-icon);