@tensor_1/tokens 2.31.0 → 2.32.0

package/build/css/tokens.css

@@ -29,6 +29,7 @@
     --uix-success: #047857;
     --uix-success-fg: #FFFFFF;
     --uix-success-bg: #D0FAE5;
+    --uix-success-text: var(--uix-success);
     --uix-warning: #F99C00;
     --uix-warning-fg: #1A1A1A;
     --uix-warning-bg: #FEF3D6;
@@ -64,15 +65,28 @@
     --uix-warning-solid: #F59E0B;
     --uix-info-solid: #2563EB;
     --uix-danger-solid: #EF4444;
-    --uix-chart-1: #2563EB;
-    --uix-chart-2: #0891B2;
-    --uix-chart-3: #16A34A;
-    --uix-chart-4: #F59E0B;
-    --uix-chart-5: #EA580C;
-    --uix-chart-6: #E11D48;
-    --uix-chart-7: #7C3AED;
-    --uix-chart-8: #DB2777;
+    --uix-neutral-solid: #8A8A8A;
+    --uix-neutral-text: var(--uix-text-hushed);
+    --uix-neutral-bg: var(--uix-bg-active);
+    --uix-neutral-border: var(--uix-border-strong);
+    --uix-chart-1: #0455E6;
+    --uix-chart-2: #249BC8;
+    --uix-chart-3: #06A543;
+    --uix-chart-4: #905709;
+    --uix-chart-5: #F25C1B;
+    --uix-chart-6: #B00825;
+    --uix-chart-7: #8143E6;
+    --uix-chart-8: #DB2579;
     --uix-chart-neutral: #64748B;
+    --uix-chart-grid: #EDEDED;
+    --uix-chart-axis: #D4D4D4;
+    --uix-chart-reference: #525252;
+    --uix-chart-zone-warning: rgba(217,119,6,.10);
+    --uix-chart-zone-danger: rgba(228,0,20,.07);
+    --uix-chart-forecast-band: rgba(10,10,10,.06);
+    --uix-chart-event: #737373;
+    --uix-chart-partial: rgba(10,10,10,.10);
+    --uix-chart-comparison: #B8B8B8;
     --uix-row: #FFFFFF;
     --uix-row-alt: #FAFAFA;
     --uix-row-pinned-bg: #F4F7FF;
@@ -107,6 +121,7 @@
     --uix-radius-sm: 8px;
     --uix-radius-md: 12px;
     --uix-radius-lg: 16px;
+    --uix-radius-xl: 24px;
     --uix-radius-pill: 999px;
     --uix-row-h: 56px;
     --uix-row-h-compact: 44px;
@@ -179,47 +194,58 @@
     --uix-accent-text: color-mix(in srgb, var(--uix-accent) 70%, #FFFFFF);
     --uix-ring: var(--uix-brand,#3080FF);
     --uix-brand-muted: color-mix(in srgb, var(--uix-accent) 16%, transparent);
-    --uix-success: #00D294;
+    --uix-success: #49AF7E;
     --uix-success-fg: #002C22;
-    --uix-success-bg: rgba(0,210,148,.15);
-    --uix-warning: #FCBB00;
+    --uix-success-bg: rgba(73,175,126,.12);
+    --uix-success-text: #7CC79F;
+    --uix-warning: #D7B672;
     --uix-warning-fg: #1A1A1A;
-    --uix-warning-bg: rgba(249,156,0,.16);
+    --uix-warning-bg: rgba(217,164,64,.12);
     --uix-warning-border: #CA8A04;
-    --uix-warning-text: var(--uix-warning,#FCBB00);
+    --uix-warning-text: var(--uix-warning,#D7B672);
     --uix-info: #2563EB;
     --uix-info-fg: #FFFFFF;
-    --uix-info-bg: rgba(48,128,255,.16);
-    --uix-info-text: #60A5FA;
-    --uix-danger: #DC2626;
+    --uix-info-bg: rgba(98,147,219,.12);
+    --uix-info-text: #8DB4E7;
+    --uix-danger: #BE3A41;
     --uix-danger-fg: #FFFFFF;
-    --uix-danger-bg: rgba(220,38,38,.20);
-    --uix-danger-border: #DC2626;
-    --uix-danger-text: #F87171;
+    --uix-danger-bg: rgba(218,108,108,.12);
+    --uix-danger-border: #DA6C6C;
+    --uix-danger-text: #E69593;
     --uix-amber: #E6B25C;
-    --uix-amber-text: #E6B25C;
+    --uix-amber-text: #DDB370;
     --uix-amber-bg: rgba(201,138,30,.14);
-    --uix-attention: #FB923C;
-    --uix-attention-bg: rgba(234,88,12,.16);
-    --uix-attention-text: #FDBA74;
-    --uix-attention-solid: #F97316;
-    --uix-overdue: #F87171;
-    --uix-overdue-bg: rgba(220,38,38,.18);
-    --uix-overdue-text: #FCA5A5;
-    --uix-overdue-solid: #F87171;
-    --uix-success-solid: #34D399;
-    --uix-warning-solid: #FBBF24;
-    --uix-info-solid: #3B82F6;
-    --uix-danger-solid: #F87171;
-    --uix-chart-1: #3080FF;
-    --uix-chart-2: #00C2B0;
-    --uix-chart-3: #00D294;
-    --uix-chart-4: #FCBB00;
-    --uix-chart-5: #FF8B1A;
-    --uix-chart-6: #FF6568;
-    --uix-chart-7: #A685FF;
-    --uix-chart-8: #FF667F;
+    --uix-attention: #DD854C;
+    --uix-attention-bg: rgba(221,133,76,.12);
+    --uix-attention-text: #DFA779;
+    --uix-attention-solid: #DD854C;
+    --uix-overdue: #DA6C6C;
+    --uix-overdue-bg: rgba(218,108,108,.12);
+    --uix-overdue-text: #E89D9F;
+    --uix-overdue-solid: #DA6C6C;
+    --uix-success-solid: #49AF7E;
+    --uix-warning-solid: #D9A440;
+    --uix-info-solid: #6293DB;
+    --uix-danger-solid: #DA6C6C;
+    --uix-neutral-solid: #868686;
+    --uix-chart-1: #3280FC;
+    --uix-chart-2: #15A7A4;
+    --uix-chart-3: #127A3D;
+    --uix-chart-4: #AB9017;
+    --uix-chart-5: #8F530C;
+    --uix-chart-6: #CD766F;
+    --uix-chart-7: #9A77F4;
+    --uix-chart-8: #FB416A;
     --uix-chart-neutral: #A1A1A1;
+    --uix-chart-grid: #232323;
+    --uix-chart-axis: #3A3A3A;
+    --uix-chart-reference: #B3B3B3;
+    --uix-chart-zone-warning: rgba(217,164,64,.10);
+    --uix-chart-zone-danger: rgba(218,108,108,.10);
+    --uix-chart-forecast-band: rgba(250,250,250,.06);
+    --uix-chart-event: #8C8C8C;
+    --uix-chart-partial: rgba(250,250,250,.12);
+    --uix-chart-comparison: #5C5C5C;
     --uix-row: #111111;
     --uix-row-alt: #161616;
     --uix-row-pinned-bg: rgba(48,128,255,.08);

package/build/tailwind/preset.cjs

@@ -30,6 +30,7 @@ module.exports = {
       "uix-success": "var(--uix-success)",
       "uix-success-fg": "var(--uix-success-fg)",
       "uix-success-bg": "var(--uix-success-bg)",
+      "uix-success-text": "var(--uix-success-text)",
       "uix-warning": "var(--uix-warning)",
       "uix-warning-fg": "var(--uix-warning-fg)",
       "uix-warning-bg": "var(--uix-warning-bg)",
@@ -65,6 +66,10 @@ module.exports = {
       "uix-warning-solid": "var(--uix-warning-solid)",
       "uix-info-solid": "var(--uix-info-solid)",
       "uix-danger-solid": "var(--uix-danger-solid)",
+      "uix-neutral-solid": "var(--uix-neutral-solid)",
+      "uix-neutral-text": "var(--uix-neutral-text)",
+      "uix-neutral-bg": "var(--uix-neutral-bg)",
+      "uix-neutral-border": "var(--uix-neutral-border)",
       "uix-chart-1": "var(--uix-chart-1)",
       "uix-chart-2": "var(--uix-chart-2)",
       "uix-chart-3": "var(--uix-chart-3)",
@@ -74,6 +79,15 @@ module.exports = {
       "uix-chart-7": "var(--uix-chart-7)",
       "uix-chart-8": "var(--uix-chart-8)",
       "uix-chart-neutral": "var(--uix-chart-neutral)",
+      "uix-chart-grid": "var(--uix-chart-grid)",
+      "uix-chart-axis": "var(--uix-chart-axis)",
+      "uix-chart-reference": "var(--uix-chart-reference)",
+      "uix-chart-zone-warning": "var(--uix-chart-zone-warning)",
+      "uix-chart-zone-danger": "var(--uix-chart-zone-danger)",
+      "uix-chart-forecast-band": "var(--uix-chart-forecast-band)",
+      "uix-chart-event": "var(--uix-chart-event)",
+      "uix-chart-partial": "var(--uix-chart-partial)",
+      "uix-chart-comparison": "var(--uix-chart-comparison)",
       "uix-row": "var(--uix-row)",
       "uix-row-alt": "var(--uix-row-alt)",
       "uix-row-pinned-bg": "var(--uix-row-pinned-bg)",
@@ -89,6 +103,7 @@ module.exports = {
       "uix-sm": "var(--uix-radius-sm)",
       "uix-md": "var(--uix-radius-md)",
       "uix-lg": "var(--uix-radius-lg)",
+      "uix-xl": "var(--uix-radius-xl)",
       "uix-pill": "var(--uix-radius-pill)",
       },
       fontFamily: {

package/build/tailwind/theme.css

@@ -27,6 +27,7 @@
   --color-uix-success: var(--uix-success);
   --color-uix-success-fg: var(--uix-success-fg);
   --color-uix-success-bg: var(--uix-success-bg);
+  --color-uix-success-text: var(--uix-success-text);
   --color-uix-warning: var(--uix-warning);
   --color-uix-warning-fg: var(--uix-warning-fg);
   --color-uix-warning-bg: var(--uix-warning-bg);
@@ -62,6 +63,10 @@
   --color-uix-warning-solid: var(--uix-warning-solid);
   --color-uix-info-solid: var(--uix-info-solid);
   --color-uix-danger-solid: var(--uix-danger-solid);
+  --color-uix-neutral-solid: var(--uix-neutral-solid);
+  --color-uix-neutral-text: var(--uix-neutral-text);
+  --color-uix-neutral-bg: var(--uix-neutral-bg);
+  --color-uix-neutral-border: var(--uix-neutral-border);
   --color-uix-chart-1: var(--uix-chart-1);
   --color-uix-chart-2: var(--uix-chart-2);
   --color-uix-chart-3: var(--uix-chart-3);
@@ -71,6 +76,15 @@
   --color-uix-chart-7: var(--uix-chart-7);
   --color-uix-chart-8: var(--uix-chart-8);
   --color-uix-chart-neutral: var(--uix-chart-neutral);
+  --color-uix-chart-grid: var(--uix-chart-grid);
+  --color-uix-chart-axis: var(--uix-chart-axis);
+  --color-uix-chart-reference: var(--uix-chart-reference);
+  --color-uix-chart-zone-warning: var(--uix-chart-zone-warning);
+  --color-uix-chart-zone-danger: var(--uix-chart-zone-danger);
+  --color-uix-chart-forecast-band: var(--uix-chart-forecast-band);
+  --color-uix-chart-event: var(--uix-chart-event);
+  --color-uix-chart-partial: var(--uix-chart-partial);
+  --color-uix-chart-comparison: var(--uix-chart-comparison);
   --color-uix-row: var(--uix-row);
   --color-uix-row-alt: var(--uix-row-alt);
   --color-uix-row-pinned-bg: var(--uix-row-pinned-bg);
@@ -85,6 +99,7 @@
   --radius-uix-sm: var(--uix-radius-sm);
   --radius-uix-md: var(--uix-radius-md);
   --radius-uix-lg: var(--uix-radius-lg);
+  --radius-uix-xl: var(--uix-radius-xl);
   --radius-uix-pill: var(--uix-radius-pill);
 
   --font-uix-sans: var(--uix-font-sans);

package/build/ts/tokens.d.ts

@@ -1,5 +1,5 @@
 /* GENERATED — do not edit. */
-export type UixTokenName = "bg-app" | "bg-subtle" | "bg-hover" | "bg-active" | "surface" | "surface-2" | "surface-3" | "border" | "border-strong" | "text" | "text-hushed" | "text-muted" | "text-reverse" | "text-hushed-reverse" | "accent" | "accent-dark" | "accent-light" | "accent-hover" | "accent-fg" | "link" | "accent-text" | "ring" | "brand-muted" | "success" | "success-fg" | "success-bg" | "warning" | "warning-fg" | "warning-bg" | "warning-text" | "warning-border" | "info" | "info-fg" | "info-bg" | "info-text" | "danger" | "danger-fg" | "danger-bg" | "danger-border" | "danger-text" | "amber" | "amber-text" | "amber-bg" | "attention" | "attention-bg" | "attention-text" | "attention-solid" | "overdue" | "overdue-bg" | "overdue-text" | "overdue-solid" | "sev-4" | "sev-4-bg" | "sev-4-text" | "sev-5" | "sev-5-bg" | "sev-5-text" | "success-solid" | "warning-solid" | "info-solid" | "danger-solid" | "chart-1" | "chart-2" | "chart-3" | "chart-4" | "chart-5" | "chart-6" | "chart-7" | "chart-8" | "chart-neutral" | "row" | "row-alt" | "row-pinned-bg" | "row-selected-bg" | "scrollbar-thumb" | "scrollbar-thumb-hover" | "scrollbar-track" | "scrim" | "scrim-strong" | "shadow-sm" | "shadow-md" | "shadow-popover" | "shadow-overlay" | "highlight-top" | "ease-out" | "ease-out-strong" | "ease-in" | "ease-in-out" | "ease-spring" | "dur-fast" | "dur" | "dur-slow" | "dur-slower" | "lift" | "z-raised" | "z-sticky" | "z-dropdown" | "z-overlay" | "z-tooltip" | "z-toast" | "radius-xs" | "radius-sm" | "radius-md" | "radius-lg" | "radius-pill" | "row-h" | "row-h-compact" | "row-h-comfortable" | "control-h" | "sidebar-w" | "sidebar-w-rail" | "topbar-h" | "scrollbar-size" | "icon-sm" | "icon-md" | "icon-lg" | "peek-w" | "col-w-xs" | "col-w-sm" | "col-w-md" | "col-w-lg" | "col-w-xl" | "col-title-min" | "space-0" | "space-1" | "space-2" | "space-3" | "space-4" | "space-5" | "space-6" | "space-7" | "space-8" | "space-9" | "space-10" | "space-11" | "space-12" | "font-sans" | "font-heading" | "font-mono" | "text-display" | "leading-display" | "text-data-hero" | "leading-data-hero" | "text-h2" | "leading-h2" | "text-h3" | "leading-h3" | "text-body" | "leading-body" | "text-meta" | "leading-meta" | "text-eyebrow" | "leading-eyebrow" | "tracking-tight" | "tracking-eyebrow";
+export type UixTokenName = "bg-app" | "bg-subtle" | "bg-hover" | "bg-active" | "surface" | "surface-2" | "surface-3" | "border" | "border-strong" | "text" | "text-hushed" | "text-muted" | "text-reverse" | "text-hushed-reverse" | "accent" | "accent-dark" | "accent-light" | "accent-hover" | "accent-fg" | "link" | "accent-text" | "ring" | "brand-muted" | "success" | "success-fg" | "success-bg" | "success-text" | "warning" | "warning-fg" | "warning-bg" | "warning-text" | "warning-border" | "info" | "info-fg" | "info-bg" | "info-text" | "danger" | "danger-fg" | "danger-bg" | "danger-border" | "danger-text" | "amber" | "amber-text" | "amber-bg" | "attention" | "attention-bg" | "attention-text" | "attention-solid" | "overdue" | "overdue-bg" | "overdue-text" | "overdue-solid" | "sev-4" | "sev-4-bg" | "sev-4-text" | "sev-5" | "sev-5-bg" | "sev-5-text" | "success-solid" | "warning-solid" | "info-solid" | "danger-solid" | "neutral-solid" | "neutral-text" | "neutral-bg" | "neutral-border" | "chart-1" | "chart-2" | "chart-3" | "chart-4" | "chart-5" | "chart-6" | "chart-7" | "chart-8" | "chart-neutral" | "chart-grid" | "chart-axis" | "chart-reference" | "chart-zone-warning" | "chart-zone-danger" | "chart-forecast-band" | "chart-event" | "chart-partial" | "chart-comparison" | "row" | "row-alt" | "row-pinned-bg" | "row-selected-bg" | "scrollbar-thumb" | "scrollbar-thumb-hover" | "scrollbar-track" | "scrim" | "scrim-strong" | "shadow-sm" | "shadow-md" | "shadow-popover" | "shadow-overlay" | "highlight-top" | "ease-out" | "ease-out-strong" | "ease-in" | "ease-in-out" | "ease-spring" | "dur-fast" | "dur" | "dur-slow" | "dur-slower" | "lift" | "z-raised" | "z-sticky" | "z-dropdown" | "z-overlay" | "z-tooltip" | "z-toast" | "radius-xs" | "radius-sm" | "radius-md" | "radius-lg" | "radius-xl" | "radius-pill" | "row-h" | "row-h-compact" | "row-h-comfortable" | "control-h" | "sidebar-w" | "sidebar-w-rail" | "topbar-h" | "scrollbar-size" | "icon-sm" | "icon-md" | "icon-lg" | "peek-w" | "col-w-xs" | "col-w-sm" | "col-w-md" | "col-w-lg" | "col-w-xl" | "col-title-min" | "space-0" | "space-1" | "space-2" | "space-3" | "space-4" | "space-5" | "space-6" | "space-7" | "space-8" | "space-9" | "space-10" | "space-11" | "space-12" | "font-sans" | "font-heading" | "font-mono" | "text-display" | "leading-display" | "text-data-hero" | "leading-data-hero" | "text-h2" | "leading-h2" | "text-h3" | "leading-h3" | "text-body" | "leading-body" | "text-meta" | "leading-meta" | "text-eyebrow" | "leading-eyebrow" | "tracking-tight" | "tracking-eyebrow";
 export declare const cssVar: Record<UixTokenName, string>;
 export declare const light: Record<UixTokenName, string>;
 export declare const dark: Partial<Record<UixTokenName, string>>;

package/build/ts/tokens.js

@@ -30,6 +30,7 @@ export const cssVar = {
   "success": "var(--uix-success)",
   "success-fg": "var(--uix-success-fg)",
   "success-bg": "var(--uix-success-bg)",
+  "success-text": "var(--uix-success-text)",
   "warning": "var(--uix-warning)",
   "warning-fg": "var(--uix-warning-fg)",
   "warning-bg": "var(--uix-warning-bg)",
@@ -65,6 +66,10 @@ export const cssVar = {
   "warning-solid": "var(--uix-warning-solid)",
   "info-solid": "var(--uix-info-solid)",
   "danger-solid": "var(--uix-danger-solid)",
+  "neutral-solid": "var(--uix-neutral-solid)",
+  "neutral-text": "var(--uix-neutral-text)",
+  "neutral-bg": "var(--uix-neutral-bg)",
+  "neutral-border": "var(--uix-neutral-border)",
   "chart-1": "var(--uix-chart-1)",
   "chart-2": "var(--uix-chart-2)",
   "chart-3": "var(--uix-chart-3)",
@@ -74,6 +79,15 @@ export const cssVar = {
   "chart-7": "var(--uix-chart-7)",
   "chart-8": "var(--uix-chart-8)",
   "chart-neutral": "var(--uix-chart-neutral)",
+  "chart-grid": "var(--uix-chart-grid)",
+  "chart-axis": "var(--uix-chart-axis)",
+  "chart-reference": "var(--uix-chart-reference)",
+  "chart-zone-warning": "var(--uix-chart-zone-warning)",
+  "chart-zone-danger": "var(--uix-chart-zone-danger)",
+  "chart-forecast-band": "var(--uix-chart-forecast-band)",
+  "chart-event": "var(--uix-chart-event)",
+  "chart-partial": "var(--uix-chart-partial)",
+  "chart-comparison": "var(--uix-chart-comparison)",
   "row": "var(--uix-row)",
   "row-alt": "var(--uix-row-alt)",
   "row-pinned-bg": "var(--uix-row-pinned-bg)",
@@ -108,6 +122,7 @@ export const cssVar = {
   "radius-sm": "var(--uix-radius-sm)",
   "radius-md": "var(--uix-radius-md)",
   "radius-lg": "var(--uix-radius-lg)",
+  "radius-xl": "var(--uix-radius-xl)",
   "radius-pill": "var(--uix-radius-pill)",
   "row-h": "var(--uix-row-h)",
   "row-h-compact": "var(--uix-row-h-compact)",
@@ -188,6 +203,7 @@ export const light = {
   "success": "#047857",
   "success-fg": "#FFFFFF",
   "success-bg": "#D0FAE5",
+  "success-text": "var(--uix-success)",
   "warning": "#F99C00",
   "warning-fg": "#1A1A1A",
   "warning-bg": "#FEF3D6",
@@ -223,15 +239,28 @@ export const light = {
   "warning-solid": "#F59E0B",
   "info-solid": "#2563EB",
   "danger-solid": "#EF4444",
-  "chart-1": "#2563EB",
-  "chart-2": "#0891B2",
-  "chart-3": "#16A34A",
-  "chart-4": "#F59E0B",
-  "chart-5": "#EA580C",
-  "chart-6": "#E11D48",
-  "chart-7": "#7C3AED",
-  "chart-8": "#DB2777",
+  "neutral-solid": "#8A8A8A",
+  "neutral-text": "var(--uix-text-hushed)",
+  "neutral-bg": "var(--uix-bg-active)",
+  "neutral-border": "var(--uix-border-strong)",
+  "chart-1": "#0455E6",
+  "chart-2": "#249BC8",
+  "chart-3": "#06A543",
+  "chart-4": "#905709",
+  "chart-5": "#F25C1B",
+  "chart-6": "#B00825",
+  "chart-7": "#8143E6",
+  "chart-8": "#DB2579",
   "chart-neutral": "#64748B",
+  "chart-grid": "#EDEDED",
+  "chart-axis": "#D4D4D4",
+  "chart-reference": "#525252",
+  "chart-zone-warning": "rgba(217,119,6,.10)",
+  "chart-zone-danger": "rgba(228,0,20,.07)",
+  "chart-forecast-band": "rgba(10,10,10,.06)",
+  "chart-event": "#737373",
+  "chart-partial": "rgba(10,10,10,.10)",
+  "chart-comparison": "#B8B8B8",
   "row": "#FFFFFF",
   "row-alt": "#FAFAFA",
   "row-pinned-bg": "#F4F7FF",
@@ -266,6 +295,7 @@ export const light = {
   "radius-sm": "8px",
   "radius-md": "12px",
   "radius-lg": "16px",
+  "radius-xl": "24px",
   "radius-pill": "999px",
   "row-h": "56px",
   "row-h-compact": "44px",
@@ -338,47 +368,58 @@ export const dark = {
   "accent-text": "color-mix(in srgb, var(--uix-accent) 70%, #FFFFFF)",
   "ring": "#3080FF",
   "brand-muted": "color-mix(in srgb, var(--uix-accent) 16%, transparent)",
-  "success": "#00D294",
+  "success": "#49AF7E",
   "success-fg": "#002C22",
-  "success-bg": "rgba(0,210,148,.15)",
-  "warning": "#FCBB00",
+  "success-bg": "rgba(73,175,126,.12)",
+  "success-text": "#7CC79F",
+  "warning": "#D7B672",
   "warning-fg": "#1A1A1A",
-  "warning-bg": "rgba(249,156,0,.16)",
+  "warning-bg": "rgba(217,164,64,.12)",
   "warning-border": "#CA8A04",
-  "warning-text": "#FCBB00",
+  "warning-text": "#D7B672",
   "info": "#2563EB",
   "info-fg": "#FFFFFF",
-  "info-bg": "rgba(48,128,255,.16)",
-  "info-text": "#60A5FA",
-  "danger": "#DC2626",
+  "info-bg": "rgba(98,147,219,.12)",
+  "info-text": "#8DB4E7",
+  "danger": "#BE3A41",
   "danger-fg": "#FFFFFF",
-  "danger-bg": "rgba(220,38,38,.20)",
-  "danger-border": "#DC2626",
-  "danger-text": "#F87171",
+  "danger-bg": "rgba(218,108,108,.12)",
+  "danger-border": "#DA6C6C",
+  "danger-text": "#E69593",
   "amber": "#E6B25C",
-  "amber-text": "#E6B25C",
+  "amber-text": "#DDB370",
   "amber-bg": "rgba(201,138,30,.14)",
-  "attention": "#FB923C",
-  "attention-bg": "rgba(234,88,12,.16)",
-  "attention-text": "#FDBA74",
-  "attention-solid": "#F97316",
-  "overdue": "#F87171",
-  "overdue-bg": "rgba(220,38,38,.18)",
-  "overdue-text": "#FCA5A5",
-  "overdue-solid": "#F87171",
-  "success-solid": "#34D399",
-  "warning-solid": "#FBBF24",
-  "info-solid": "#3B82F6",
-  "danger-solid": "#F87171",
-  "chart-1": "#3080FF",
-  "chart-2": "#00C2B0",
-  "chart-3": "#00D294",
-  "chart-4": "#FCBB00",
-  "chart-5": "#FF8B1A",
-  "chart-6": "#FF6568",
-  "chart-7": "#A685FF",
-  "chart-8": "#FF667F",
+  "attention": "#DD854C",
+  "attention-bg": "rgba(221,133,76,.12)",
+  "attention-text": "#DFA779",
+  "attention-solid": "#DD854C",
+  "overdue": "#DA6C6C",
+  "overdue-bg": "rgba(218,108,108,.12)",
+  "overdue-text": "#E89D9F",
+  "overdue-solid": "#DA6C6C",
+  "success-solid": "#49AF7E",
+  "warning-solid": "#D9A440",
+  "info-solid": "#6293DB",
+  "danger-solid": "#DA6C6C",
+  "neutral-solid": "#868686",
+  "chart-1": "#3280FC",
+  "chart-2": "#15A7A4",
+  "chart-3": "#127A3D",
+  "chart-4": "#AB9017",
+  "chart-5": "#8F530C",
+  "chart-6": "#CD766F",
+  "chart-7": "#9A77F4",
+  "chart-8": "#FB416A",
   "chart-neutral": "#A1A1A1",
+  "chart-grid": "#232323",
+  "chart-axis": "#3A3A3A",
+  "chart-reference": "#B3B3B3",
+  "chart-zone-warning": "rgba(217,164,64,.10)",
+  "chart-zone-danger": "rgba(218,108,108,.10)",
+  "chart-forecast-band": "rgba(250,250,250,.06)",
+  "chart-event": "#8C8C8C",
+  "chart-partial": "rgba(250,250,250,.12)",
+  "chart-comparison": "#5C5C5C",
   "row": "#111111",
   "row-alt": "#161616",
   "row-pinned-bg": "rgba(48,128,255,.08)",
@@ -398,6 +439,7 @@ export const num = {
   "radius-sm": 8,
   "radius-md": 12,
   "radius-lg": 16,
+  "radius-xl": 24,
   "radius-pill": 999,
   "row-h": 56,
   "row-h-compact": 44,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tensor_1/tokens",
-  "version": "2.31.0",
+  "version": "2.32.0",
   "description": "UIx v2 design tokens — the --uix-* contract for house products (Tensor, POSx, SHOPx). One DTCG source -> CSS variables, Tailwind theme, and typed TS constants.",
   "type": "module",
   "sideEffects": [

package/styles/components/alert.css

@@ -10,7 +10,18 @@
   .uix-alert__title { font-weight: 600; margin-bottom: var(--uix-space-1); }
   .uix-alert__body { font-size: var(--uix-text-meta); color: var(--uix-text-hushed); }
   .uix-alert--info    { --tone-bg: var(--uix-info-bg);    --tone-border: color-mix(in srgb, var(--uix-info) 30%, transparent);    --tone-fg: var(--uix-info-text); }
-  .uix-alert--success { --tone-bg: var(--uix-success-bg); --tone-border: color-mix(in srgb, var(--uix-success) 30%, transparent); --tone-fg: var(--uix-success); }
-  .uix-alert--warning { --tone-bg: var(--uix-warning-bg); --tone-border: color-mix(in srgb, var(--uix-warning) 40%, transparent); --tone-fg: var(--uix-warning); }
+  .uix-alert--success { --tone-bg: var(--uix-success-bg); --tone-border: color-mix(in srgb, var(--uix-success) 30%, transparent); --tone-fg: var(--uix-success-text); }
+  .uix-alert--warning { --tone-bg: var(--uix-warning-bg); --tone-border: color-mix(in srgb, var(--uix-warning) 40%, transparent); --tone-fg: var(--uix-warning-text); }
   .uix-alert--danger  { --tone-bg: var(--uix-danger-bg);  --tone-border: color-mix(in srgb, var(--uix-danger) 30%, transparent);  --tone-fg: var(--uix-danger-text); }
 }
+
+/* HAR-1614: the text column takes the free width and may shrink below its longest word, so a
+   long title wraps at 320 px instead of pushing the row wide; actions and the dismiss button
+   keep their size at the end. */
+@layer uix.components {
+  /* anywhere, not break-word: only `anywhere` lowers the min-content width, and with a grid or flex
+     parent that is what decides whether one long word (a file name, a URL) widens the whole alert. */
+  .uix-alert__content { flex: 1 1 0; min-width: 0; overflow-wrap: anywhere; }
+  .uix-alert__actions { display: flex; flex: none; flex-wrap: wrap; align-items: flex-start; gap: var(--uix-space-2); }
+  .uix-alert__dismiss { flex: none; align-self: flex-start; margin-block: calc(-1 * var(--uix-space-1) / 2); margin-inline-end: calc(-1 * var(--uix-space-1)); color: var(--uix-text-hushed); }
+}

package/styles/components/calendar.css

@@ -2,12 +2,34 @@
 @layer uix.components {
   .uix-calendar { width: 280px; border: 1px solid var(--uix-border); border-radius: var(--uix-radius-lg); background: var(--uix-surface); padding: var(--uix-space-3); }
   .uix-calendar__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--uix-space-2); font-weight: 600; font-size: var(--uix-text-body); }
-  .uix-calendar__grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: var(--uix-space-1); }
+  .uix-calendar__grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: var(--uix-space-1) 0; }
   .uix-calendar__dow { text-align: center; font-size: var(--uix-text-eyebrow); color: var(--uix-text-muted); padding: var(--uix-space-1) 0; }
-  .uix-calendar__day { aspect-ratio: 1; display: grid; place-items: center; border-radius: var(--uix-radius-sm); font-size: var(--uix-text-meta); color: var(--uix-text); cursor: pointer; border: 0; background: transparent; }
-  .uix-calendar__day:hover { background: var(--uix-bg-hover); }
+  /* Day states share DateRangePicker's shape language (HAR-1570): ::after is the circle
+     (hover, selected, today, focus), ::before the range band at the circle's height. Columns
+     have no gap, so neighbouring bands meet; a selected day draws half a band toward an
+     in-range neighbour (logical insets mirror for RTL). */
+  .uix-calendar__day { position: relative; isolation: isolate; aspect-ratio: 1; display: grid; place-items: center; border-radius: 0; font-size: var(--uix-text-meta); color: var(--uix-text); cursor: pointer; border: 0; background: transparent; }
+  .uix-calendar__day::before,
+  .uix-calendar__day::after { content: ""; position: absolute; z-index: calc(-1 * var(--uix-z-raised)); pointer-events: none; }
+  .uix-calendar__day::before { inset: 3px 0; }
+  .uix-calendar__day::after { inset: 3px; border-radius: 50%; }
+  .uix-calendar__day:hover::after { background: var(--uix-bg-hover); }
   .uix-calendar__day[data-muted] { color: var(--uix-text-muted); opacity: .45; }
-  .uix-calendar__day[data-today] { box-shadow: inset 0 0 0 1px var(--uix-border-strong); }
-  .uix-calendar__day[data-range] { background: var(--uix-brand-muted); border-radius: 0; }
-  .uix-calendar__day[aria-selected="true"] { background: var(--uix-accent); color: var(--uix-accent-fg); }
+  .uix-calendar__day:is([data-today], [aria-current="date"])::after { box-shadow: inset 0 0 0 1px var(--uix-text-muted); }
+  .uix-calendar__day[data-range]::before { background: var(--uix-brand-muted); }
+  .uix-calendar__day[data-range]:hover::after { background: color-mix(in srgb, var(--uix-accent) 18%, transparent); }
+  .uix-calendar__day:is([aria-selected="true"], [aria-pressed="true"]) { color: var(--uix-accent-fg); }
+  .uix-calendar__day:is([aria-selected="true"], [aria-pressed="true"])::after { background: var(--uix-accent); }
+  .uix-calendar__day:is([aria-selected="true"], [aria-pressed="true"]):has(+ [data-range])::before { inset-inline-start: 50%; background: var(--uix-brand-muted); }
+  .uix-calendar__day[data-range] + .uix-calendar__day:is([aria-selected="true"], [aria-pressed="true"])::before { inset-inline-end: 50%; background: var(--uix-brand-muted); }
+  .uix-calendar__day:focus-visible { z-index: var(--uix-z-raised); outline: none; }
+  .uix-calendar__day:focus-visible::after { box-shadow: 0 0 0 2px var(--uix-surface), 0 0 0 4px var(--uix-ring); }
+  .uix-calendar__day:is([data-today], [aria-current="date"]):focus-visible::after { box-shadow: inset 0 0 0 1px var(--uix-text-muted), 0 0 0 2px var(--uix-surface), 0 0 0 4px var(--uix-ring); }
+  @media (forced-colors: active) {
+    .uix-calendar__day:is([aria-selected="true"], [aria-pressed="true"]) { forced-color-adjust: none; color: HighlightText; }
+    .uix-calendar__day:is([aria-selected="true"], [aria-pressed="true"])::after { forced-color-adjust: none; background: Highlight; }
+    .uix-calendar__day[data-range] { text-decoration-line: underline; text-decoration-thickness: .15em; text-underline-offset: .2em; }
+    .uix-calendar__day:is([data-today], [aria-current="date"])::after { outline: 1px solid CanvasText; outline-offset: -1px; }
+    .uix-calendar__day:focus-visible::after { outline: 2px solid CanvasText; outline-offset: 2px; }
+  }
 }

package/styles/components/card.css

@@ -16,7 +16,21 @@
   .uix-collapsible__summary::-webkit-details-marker { display: none; }
   .uix-collapsible__title { color: var(--uix-text); font-weight: 600; }
   .uix-collapsible__meta { margin-left: var(--uix-space-2); color: var(--uix-text-muted); font-size: var(--uix-text-meta); }
-  .uix-collapsible__chevron { transition: transform var(--uix-dur-fast) var(--uix-ease-out); }
+  /* HAR-1571: icon-sm box on the first (title) line; only rotates, never moves. space-1 = fallback for no `lh` unit. */
+  .uix-collapsible__chevron { display: inline-grid; place-items: center; flex: none; align-self: flex-start; margin-block: var(--uix-space-1); margin-block: calc((1lh - var(--uix-icon-sm)) / 2); inline-size: var(--uix-icon-sm); block-size: var(--uix-icon-sm); color: var(--uix-text-muted); transition: transform var(--uix-dur-fast) var(--uix-ease-out), color var(--uix-dur-fast) var(--uix-ease-out); }
+  .uix-collapsible__chevron > svg { inline-size: 100%; block-size: 100%; }
+  .uix-collapsible__summary:hover .uix-collapsible__chevron { color: var(--uix-text); }
   .uix-collapsible[open] .uix-collapsible__chevron { transform: rotate(180deg); }
   .uix-collapsible__body { padding: 0 var(--uix-space-5) var(--uix-space-5); }
 }
+
+/* CollapsibleSection `headingLevel` and `compact` (HAR-1628). The heading only adds the outline
+   entry: it looks like the plain title. Compact is a quiet row inside a card: the card draws the
+   box, the row only a rule between itself and the compact row before it. */
+@layer uix.components {
+  .uix-collapsible__heading { margin: 0; font: inherit; color: inherit; }
+  .uix-collapsible--compact { border: 0; border-radius: 0; background: transparent; }
+  .uix-collapsible--compact + .uix-collapsible--compact { border-top: 1px solid var(--uix-border); }
+  .uix-collapsible--compact > .uix-collapsible__summary { padding: var(--uix-space-2) 0; border-radius: var(--uix-radius-sm); }
+  .uix-collapsible--compact > .uix-collapsible__body { padding: 0 0 var(--uix-space-3); }
+}

package/styles/components/combobox.css

@@ -12,8 +12,32 @@
     padding: var(--uix-space-2) var(--uix-space-3); border-radius: var(--uix-radius-sm); font-size: var(--uix-text-body); color: var(--uix-text);
     cursor: pointer; display: flex; align-items: center; gap: var(--uix-space-2);
   }
-  .uix-listbox__option:hover, .uix-listbox__option[aria-selected="true"], .uix-listbox__option[data-active] { background: var(--uix-bg-hover); }
+  /* hover / the keyboard's active option get the row tint; the chosen value is told apart by colour,
+     weight and a check mark, never by the same tint (HAR-1572) */
+  .uix-listbox__option:hover, .uix-listbox__option[data-active] { background: var(--uix-bg-hover); }
   .uix-listbox__option[aria-disabled="true"] { cursor: not-allowed; opacity: .55; }
-  .uix-listbox__option[aria-selected="true"] { color: var(--uix-link); }
+  .uix-listbox__option[aria-disabled="true"]:hover { background: transparent; }
+  .uix-listbox__option[aria-selected="true"] { color: var(--uix-link); font-weight: 500; }
   .uix-listbox__empty { padding: var(--uix-space-3); text-align: center; color: var(--uix-text-muted); font-size: var(--uix-text-meta); }
+
+  /* option parts (React Select) */
+  .uix-listbox__icon { display: inline-flex; flex: none; color: var(--uix-text-muted); }
+  .uix-listbox__icon svg { width: var(--uix-icon-md); height: var(--uix-icon-md); }
+  .uix-listbox__text { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: var(--uix-space-1); overflow-wrap: anywhere; }
+  .uix-listbox__label { line-height: 1.35; }
+  .uix-listbox__desc { color: var(--uix-text-muted); font-size: var(--uix-text-meta); font-weight: 400; line-height: 1.4; }
+  .uix-listbox__check { display: inline-flex; flex: none; width: var(--uix-icon-sm); height: var(--uix-icon-sm); margin-inline-start: auto; color: var(--uix-link); }
+  .uix-listbox__check svg { width: 100%; height: 100%; }
+  /* groups are ruled off from what comes before and after them */
+  .uix-listbox__group + .uix-listbox__group, .uix-listbox__option + .uix-listbox__group { margin-top: var(--uix-space-1); padding-top: var(--uix-space-1); border-top: 1px solid var(--uix-border); }
+  .uix-listbox__group:has(+ .uix-listbox__option) { margin-bottom: var(--uix-space-1); padding-bottom: var(--uix-space-1); border-bottom: 1px solid var(--uix-border); }
+  .uix-listbox__group-label {
+    padding: var(--uix-space-2) var(--uix-space-3) var(--uix-space-1); font-size: var(--uix-text-eyebrow); font-weight: 500;
+    letter-spacing: var(--uix-tracking-eyebrow); text-transform: uppercase; color: var(--uix-text-muted); cursor: default;
+  }
+  .uix-listbox__group[aria-disabled="true"] .uix-listbox__group-label { opacity: .55; }
+
+  @media (forced-colors: active) {
+    .uix-listbox__option[data-active] { outline: 2px solid Highlight; outline-offset: -2px; }
+  }
 }