@jirawatpyk/aura-tokens 5.0.1 → 5.1.0

package/GOVERNANCE.md

@@ -43,6 +43,7 @@ Semver `MAJOR.MINOR.PATCH`:
 Made by the design-system owner in one pass, instead of separate Proposals. Each change is marked ADDED in its token note.
 
 - **Status palette adopted.** Four tones (neutral, progress, ready, blocked). `aura-red-700` is the only warm hue for state, chosen dark so Ready (lime-200) and Blocked differ by lightness (5.5:1), not only by hue.
+- **5.1: a fifth tone, warning** (from DxT Monitor: a monitored host with a problem that still works). Solid amber — amber-600 light, amber-500 dark, ink label — so it differs from Ready and Blocked by lightness as well as hue (light 2.7:1 and 2.0:1). Amber stays the warning hue only: the warning alert and this pill.
 - **Alert palette adopted.** Info (violet), success (lime), warning (amber), danger (red), each with its own fill, edge and text for light and dark. Amber is limited to warning.
 - **Lucide adopted** as the only icon set, 52 icons. New icons come from Lucide unchanged.
 - **Focus ring adopted**: 2px violet, 2px offset, on every interactive element.

package/aura-tailwind.css

@@ -1,4 +1,4 @@
-/* AURA v5.0.1 — Tailwind v4 theme. GENERATED by scripts/build-tokens.js from tokens.json. Do not edit by hand.
+/* AURA v5.1.0 — Tailwind v4 theme. GENERATED by scripts/build-tokens.js from tokens.json. Do not edit by hand.
  *   @import "tailwindcss";
  *   @import "@jirawatpyk/aura-tokens/tailwind.css";
  * Gives bg-bg-surface, text-fg-primary, border-border-strong, p-aura-6, rounded-aura-xl, shadow-aura-overlay,
@@ -50,6 +50,8 @@
   --color-aura-amber-50: var(--aura-amber-50);
   --color-aura-amber-200: var(--aura-amber-200);
   --color-aura-amber-300: var(--aura-amber-300);
+  --color-aura-amber-500: var(--aura-amber-500);
+  --color-aura-amber-600: var(--aura-amber-600);
   --color-aura-amber-800: var(--aura-amber-800);
   --color-aura-ink: var(--aura-ink);
   --color-aura-white: var(--aura-white);
@@ -89,6 +91,8 @@
   --color-status-ready-fg: var(--aura-status-ready-fg);
   --color-status-blocked-bg: var(--aura-status-blocked-bg);
   --color-status-blocked-fg: var(--aura-status-blocked-fg);
+  --color-status-warning-bg: var(--aura-status-warning-bg);
+  --color-status-warning-fg: var(--aura-status-warning-fg);
   --color-chart-1: var(--aura-chart-1);
   --color-chart-2: var(--aura-chart-2);
   --color-chart-3: var(--aura-chart-3);

package/aura-tailwind.prefixed.css

@@ -1,4 +1,4 @@
-/* AURA v5.0.1 — Tailwind v4 theme with aura- prefixed names. GENERATED by scripts/build-tokens.js. Do not edit by hand.
+/* AURA v5.1.0 — Tailwind v4 theme with aura- prefixed names. GENERATED by scripts/build-tokens.js. Do not edit by hand.
  * For apps that already have a Tailwind theme (shadcn): nothing here redefines an existing name.
  *   @layer aura-tokens, theme, base, aura, components, utilities;
  *   @import "tailwindcss";
@@ -50,6 +50,8 @@
   --color-aura-amber-50: var(--aura-amber-50);
   --color-aura-amber-200: var(--aura-amber-200);
   --color-aura-amber-300: var(--aura-amber-300);
+  --color-aura-amber-500: var(--aura-amber-500);
+  --color-aura-amber-600: var(--aura-amber-600);
   --color-aura-amber-800: var(--aura-amber-800);
   --color-aura-ink: var(--aura-ink);
   --color-aura-white: var(--aura-white);
@@ -89,6 +91,8 @@
   --color-aura-status-ready-fg: var(--aura-status-ready-fg);
   --color-aura-status-blocked-bg: var(--aura-status-blocked-bg);
   --color-aura-status-blocked-fg: var(--aura-status-blocked-fg);
+  --color-aura-status-warning-bg: var(--aura-status-warning-bg);
+  --color-aura-status-warning-fg: var(--aura-status-warning-fg);
   --color-aura-chart-1: var(--aura-chart-1);
   --color-aura-chart-2: var(--aura-chart-2);
   --color-aura-chart-3: var(--aura-chart-3);

package/aura.css

@@ -1,4 +1,4 @@
-/* AURA v5.0.1 — GENERATED by scripts/build-tokens.js from tokens.json. Do not edit by hand. */
+/* AURA v5.1.0 — GENERATED by scripts/build-tokens.js from tokens.json. Do not edit by hand. */
 /* Fonts: load aura-fonts.css (or the <link> tags in README) separately, so a blocked Google Fonts never breaks this file. */
 
 :root, [data-theme="light"] {
@@ -43,6 +43,8 @@
   --aura-amber-50: #fffbeb;
   --aura-amber-200: #fde68a;
   --aura-amber-300: #fcd34d;
+  --aura-amber-500: #f59e0b;
+  --aura-amber-600: #d97706;
   --aura-amber-800: #92400e;
   --aura-ink: #08080a;
   --aura-white: #ffffff;
@@ -76,6 +78,8 @@
   --aura-status-ready-fg: var(--aura-ink);
   --aura-status-blocked-bg: var(--aura-red-700);
   --aura-status-blocked-fg: var(--aura-white);
+  --aura-status-warning-bg: var(--aura-amber-600);
+  --aura-status-warning-fg: var(--aura-ink);
   --aura-bg-selected: var(--aura-violet-50);
   --aura-border-control: var(--aura-zinc-500);
   --aura-bg-skeleton: var(--aura-zinc-200);
@@ -154,6 +158,7 @@
   --aura-status-progress-fg: var(--aura-violet-300);
   --aura-status-ready-bg: #2b351f;
   --aura-status-ready-fg: var(--aura-lime-300);
+  --aura-status-warning-bg: var(--aura-amber-500);
   --aura-bg-selected: #2c283a;
   --aura-border-control: var(--aura-zinc-400);
   --aura-bg-skeleton: var(--aura-zinc-700);
@@ -223,6 +228,7 @@
     --aura-status-progress-fg: var(--aura-violet-300);
     --aura-status-ready-bg: #2b351f;
     --aura-status-ready-fg: var(--aura-lime-300);
+    --aura-status-warning-bg: var(--aura-amber-500);
     --aura-bg-selected: #2c283a;
     --aura-border-control: var(--aura-zinc-400);
     --aura-bg-skeleton: var(--aura-zinc-700);

package/components/aura.bundle.js

@@ -227,10 +227,23 @@ window.Aura = (() => {
   function tone(t) {
     return TONES.indexOf(t) >= 0 ? t : "neutral";
   }
+  var warned = {};
+  function devWarnOnce(key, message) {
+    if (warned[key]) return;
+    let dev = false;
+    try {
+      dev = true;
+    } catch (e) {
+      dev = false;
+    }
+    if (!dev) return;
+    warned[key] = true;
+    console.warn("[AURA] " + message);
+  }
 
   // src/Icon.tsx
   var h = React2.createElement;
-  var ICONS = { "check": [["path", { "d": "M20 6 9 17l-5-5" }]], "x": [["path", { "d": "M18 6 6 18" }], ["path", { "d": "m6 6 12 12" }]], "plus": [["path", { "d": "M5 12h14" }], ["path", { "d": "M12 5v14" }]], "minus": [["path", { "d": "M5 12h14" }]], "search": [["path", { "d": "m21 21-4.34-4.34" }], ["circle", { "cx": "11", "cy": "11", "r": "8" }]], "chevron-down": [["path", { "d": "m6 9 6 6 6-6" }]], "chevron-up": [["path", { "d": "m18 15-6-6-6 6" }]], "chevron-left": [["path", { "d": "m15 18-6-6 6-6" }]], "chevron-right": [["path", { "d": "m9 18 6-6-6-6" }]], "arrow-right": [["path", { "d": "M5 12h14" }], ["path", { "d": "m12 5 7 7-7 7" }]], "arrow-up-right": [["path", { "d": "M7 7h10v10" }], ["path", { "d": "M7 17 17 7" }]], "arrow-up-down": [["path", { "d": "m21 16-4 4-4-4" }], ["path", { "d": "M17 20V4" }], ["path", { "d": "m3 8 4-4 4 4" }], ["path", { "d": "M7 4v16" }]], "loader-circle": [["path", { "d": "M21 12a9 9 0 1 1-6.219-8.56" }]], "circle-alert": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["line", { "x1": "12", "x2": "12", "y1": "8", "y2": "12" }], ["line", { "x1": "12", "x2": "12.01", "y1": "16", "y2": "16" }]], "circle-check": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["path", { "d": "m16 9-5.5 5.5L8 12" }]], "info": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["path", { "d": "M12 16v-4" }], ["path", { "d": "M12 8h.01" }]], "triangle-alert": [["path", { "d": "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }], ["path", { "d": "M12 9v4" }], ["path", { "d": "M12 17h.01" }]], "settings": [["path", { "d": "M9.671 4.136a2.34 2.34 0 0 1 4.659 0 2.34 2.34 0 0 0 3.319 1.915 2.34 2.34 0 0 1 2.33 4.033 2.34 2.34 0 0 0 0 3.831 2.34 2.34 0 0 1-2.33 4.033 2.34 2.34 0 0 0-3.319 1.915 2.34 2.34 0 0 1-4.659 0 2.34 2.34 0 0 0-3.32-1.915 2.34 2.34 0 0 1-2.33-4.033 2.34 2.34 0 0 0 0-3.831A2.34 2.34 0 0 1 6.35 6.051a2.34 2.34 0 0 0 3.319-1.915" }], ["circle", { "cx": "12", "cy": "12", "r": "3" }]], "user": [["path", { "d": "M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2" }], ["circle", { "cx": "12", "cy": "7", "r": "4" }]], "users": [["path", { "d": "M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2" }], ["path", { "d": "M16 3.128a4 4 0 0 1 0 7.744" }], ["path", { "d": "M22 21v-2a4 4 0 0 0-3-3.87" }], ["circle", { "cx": "9", "cy": "7", "r": "4" }]], "filter": [["path", { "d": "M10 20a1 1 0 0 0 .553.895l2 1A1 1 0 0 0 14 21v-7a2 2 0 0 1 .517-1.341L21.74 4.67A1 1 0 0 0 21 3H3a1 1 0 0 0-.742 1.67l7.225 7.989A2 2 0 0 1 10 14z" }]], "ellipsis": [["circle", { "cx": "12", "cy": "12", "r": "1" }], ["circle", { "cx": "19", "cy": "12", "r": "1" }], ["circle", { "cx": "5", "cy": "12", "r": "1" }]], "external-link": [["path", { "d": "M15 3h6v6" }], ["path", { "d": "M10 14 21 3" }], ["path", { "d": "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" }]], "copy": [["rect", { "width": "14", "height": "14", "x": "8", "y": "8", "rx": "2", "ry": "2" }], ["path", { "d": "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" }]], "trash-2": [["path", { "d": "M10 11v6" }], ["path", { "d": "M14 11v6" }], ["path", { "d": "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6" }], ["path", { "d": "M3 6h18" }], ["path", { "d": "M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" }]], "pencil": [["path", { "d": "M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z" }], ["path", { "d": "m15 5 4 4" }]], "download": [["path", { "d": "M12 15V3" }], ["path", { "d": "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }], ["path", { "d": "m7 10 5 5 5-5" }]], "upload": [["path", { "d": "M12 3v12" }], ["path", { "d": "m17 8-5-5-5 5" }], ["path", { "d": "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }]], "calendar": [["path", { "d": "M8 2v3" }], ["path", { "d": "M16 2v3" }], ["rect", { "x": "3", "y": "3", "width": "18", "height": "18", "rx": "2" }], ["path", { "d": "M3 9h18" }]], "bell": [["path", { "d": "M10.268 21a2 2 0 0 0 3.464 0" }], ["path", { "d": "M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326" }]], "menu": [["path", { "d": "M4 5h16" }], ["path", { "d": "M4 12h16" }], ["path", { "d": "M4 19h16" }]], "eye": [["path", { "d": "M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0" }], ["circle", { "cx": "12", "cy": "12", "r": "3" }]], "log-out": [["path", { "d": "m16 17 5-5-5-5" }], ["path", { "d": "M21 12H9" }], ["path", { "d": "M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4" }]], "circle": [["circle", { "cx": "12", "cy": "12", "r": "10" }]], "circle-dot-dashed": [["path", { "d": "M10.1 2.18a9.93 9.93 0 0 1 3.8 0" }], ["path", { "d": "M17.6 3.71a9.95 9.95 0 0 1 2.69 2.7" }], ["path", { "d": "M21.82 10.1a9.93 9.93 0 0 1 0 3.8" }], ["path", { "d": "M20.29 17.6a9.95 9.95 0 0 1-2.7 2.69" }], ["path", { "d": "M13.9 21.82a9.94 9.94 0 0 1-3.8 0" }], ["path", { "d": "M6.4 20.29a9.95 9.95 0 0 1-2.69-2.7" }], ["path", { "d": "M2.18 13.9a9.93 9.93 0 0 1 0-3.8" }], ["path", { "d": "M3.71 6.4a9.95 9.95 0 0 1 2.7-2.69" }], ["circle", { "cx": "12", "cy": "12", "r": "1" }]], "ban": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["path", { "d": "M4.929 4.929 19.07 19.071" }]], "arrow-up": [["path", { "d": "m5 12 7-7 7 7" }], ["path", { "d": "M12 19V5" }]], "arrow-down": [["path", { "d": "M12 5v14" }], ["path", { "d": "m19 12-7 7-7-7" }]], "inbox": [["polyline", { "points": "22 12 16 12 14 15 10 15 8 12 2 12" }], ["path", { "d": "M5.45 5.11 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z" }]], "pin": [["path", { "d": "M12 17v5" }], ["path", { "d": "M9 10.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-.76a2 2 0 0 0-1.11-1.79l-1.78-.9A2 2 0 0 1 15 10.76V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H8a2 2 0 0 0 0 4 1 1 0 0 1 1 1z" }]], "pin-off": [["path", { "d": "M12 17v5" }], ["path", { "d": "M15 9.34V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H7.89" }], ["path", { "d": "m2 2 20 20" }], ["path", { "d": "M9 9v1.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h11" }]], "eye-off": [["path", { "d": "M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.747 10.747 0 0 1-1.444 2.49" }], ["path", { "d": "M14.084 14.158a3 3 0 0 1-4.242-4.242" }], ["path", { "d": "M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143" }], ["path", { "d": "m2 2 20 20" }]], "columns-3": [["rect", { "width": "18", "height": "18", "x": "3", "y": "3", "rx": "2" }], ["path", { "d": "M9 3v18" }], ["path", { "d": "M15 3v18" }]], "arrow-left": [["path", { "d": "m12 19-7-7 7-7" }], ["path", { "d": "M19 12H5" }]], "rotate-ccw": [["path", { "d": "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8" }], ["path", { "d": "M3 3v5h5" }]], "house": [["path", { "d": "M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8" }], ["path", { "d": "M3 10a2 2 0 0 1 .709-1.528l7-6a2 2 0 0 1 2.582 0l7 6A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" }]], "layout-dashboard": [["rect", { "width": "7", "height": "9", "x": "3", "y": "3", "rx": "1" }], ["rect", { "width": "7", "height": "5", "x": "14", "y": "3", "rx": "1" }], ["rect", { "width": "7", "height": "9", "x": "14", "y": "12", "rx": "1" }], ["rect", { "width": "7", "height": "5", "x": "3", "y": "16", "rx": "1" }]], "folder": [["path", { "d": "M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z" }]], "chart-column": [["path", { "d": "M3 3v16a2 2 0 0 0 2 2h16" }], ["path", { "d": "M18 17V9" }], ["path", { "d": "M13 17V5" }], ["path", { "d": "M8 17v-3" }]], "file-text": [["path", { "d": "M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z" }], ["path", { "d": "M14 2v5a1 1 0 0 0 1 1h5" }], ["path", { "d": "M10 9H8" }], ["path", { "d": "M16 13H8" }], ["path", { "d": "M16 17H8" }]], "mail": [["path", { "d": "m22 7-8.991 5.727a2 2 0 0 1-2.009 0L2 7" }], ["rect", { "x": "2", "y": "4", "width": "20", "height": "16", "rx": "2" }]], "lock": [["rect", { "width": "18", "height": "11", "x": "3", "y": "11", "rx": "2", "ry": "2" }], ["path", { "d": "M7 11V7a5 5 0 0 1 10 0v4" }]], "clock": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["path", { "d": "M12 6v6l4 2" }]], "trending-up": [["path", { "d": "M16 7h6v6" }], ["path", { "d": "m22 7-8.5 8.5-5-5L2 17" }]], "trending-down": [["path", { "d": "M16 17h6v-6" }], ["path", { "d": "m22 17-8.5-8.5-5 5L2 7" }]], "image": [["rect", { "width": "18", "height": "18", "x": "3", "y": "3", "rx": "2", "ry": "2" }], ["circle", { "cx": "9", "cy": "9", "r": "2" }], ["path", { "d": "m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21" }]], "paperclip": [["path", { "d": "m16 6-8.414 8.586a2 2 0 0 0 2.829 2.829l8.414-8.586a4 4 0 1 0-5.657-5.657l-8.379 8.551a6 6 0 1 0 8.485 8.485l8.379-8.551" }]], "cloud-upload": [["path", { "d": "M12 13v8" }], ["path", { "d": "M4 14.899A7 7 0 1 1 15.71 8h1.79a4.5 4.5 0 0 1 2.5 8.242" }], ["path", { "d": "m8 17 4-4 4 4" }]], "file": [["path", { "d": "M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z" }], ["path", { "d": "M14 2v5a1 1 0 0 0 1 1h5" }]], "sun": [["circle", { "cx": "12", "cy": "12", "r": "4" }], ["path", { "d": "M12 2v2" }], ["path", { "d": "M12 20v2" }], ["path", { "d": "m4.93 4.93 1.41 1.41" }], ["path", { "d": "m17.66 17.66 1.41 1.41" }], ["path", { "d": "M2 12h2" }], ["path", { "d": "M20 12h2" }], ["path", { "d": "m6.34 17.66-1.41 1.41" }], ["path", { "d": "m19.07 4.93-1.41 1.41" }]], "moon": [["path", { "d": "M20.985 12.486a9 9 0 1 1-9.473-9.472c.405-.022.617.46.402.803a6 6 0 0 0 8.268 8.268c.344-.215.825-.004.803.401" }]], "monitor": [["rect", { "width": "20", "height": "14", "x": "2", "y": "3", "rx": "2" }], ["line", { "x1": "8", "x2": "16", "y1": "21", "y2": "21" }], ["line", { "x1": "12", "x2": "12", "y1": "17", "y2": "21" }]], "panel-left-close": [["rect", { "width": "18", "height": "18", "x": "3", "y": "3", "rx": "2" }], ["path", { "d": "M9 3v18" }], ["path", { "d": "m16 15-3-3 3-3" }]], "panel-left-open": [["rect", { "width": "18", "height": "18", "x": "3", "y": "3", "rx": "2" }], ["path", { "d": "M9 3v18" }], ["path", { "d": "m14 9 3 3-3 3" }]] };
+  var ICONS = { "check": [["path", { "d": "M20 6 9 17l-5-5" }]], "x": [["path", { "d": "M18 6 6 18" }], ["path", { "d": "m6 6 12 12" }]], "plus": [["path", { "d": "M5 12h14" }], ["path", { "d": "M12 5v14" }]], "minus": [["path", { "d": "M5 12h14" }]], "search": [["path", { "d": "m21 21-4.34-4.34" }], ["circle", { "cx": "11", "cy": "11", "r": "8" }]], "chevron-down": [["path", { "d": "m6 9 6 6 6-6" }]], "chevron-up": [["path", { "d": "m18 15-6-6-6 6" }]], "chevron-left": [["path", { "d": "m15 18-6-6 6-6" }]], "chevron-right": [["path", { "d": "m9 18 6-6-6-6" }]], "arrow-right": [["path", { "d": "M5 12h14" }], ["path", { "d": "m12 5 7 7-7 7" }]], "arrow-up-right": [["path", { "d": "M7 7h10v10" }], ["path", { "d": "M7 17 17 7" }]], "arrow-up-down": [["path", { "d": "m21 16-4 4-4-4" }], ["path", { "d": "M17 20V4" }], ["path", { "d": "m3 8 4-4 4 4" }], ["path", { "d": "M7 4v16" }]], "loader-circle": [["path", { "d": "M21 12a9 9 0 1 1-6.219-8.56" }]], "circle-alert": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["line", { "x1": "12", "x2": "12", "y1": "8", "y2": "12" }], ["line", { "x1": "12", "x2": "12.01", "y1": "16", "y2": "16" }]], "circle-check": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["path", { "d": "m16 9-5.5 5.5L8 12" }]], "info": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["path", { "d": "M12 16v-4" }], ["path", { "d": "M12 8h.01" }]], "triangle-alert": [["path", { "d": "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }], ["path", { "d": "M12 9v4" }], ["path", { "d": "M12 17h.01" }]], "settings": [["path", { "d": "M9.671 4.136a2.34 2.34 0 0 1 4.659 0 2.34 2.34 0 0 0 3.319 1.915 2.34 2.34 0 0 1 2.33 4.033 2.34 2.34 0 0 0 0 3.831 2.34 2.34 0 0 1-2.33 4.033 2.34 2.34 0 0 0-3.319 1.915 2.34 2.34 0 0 1-4.659 0 2.34 2.34 0 0 0-3.32-1.915 2.34 2.34 0 0 1-2.33-4.033 2.34 2.34 0 0 0 0-3.831A2.34 2.34 0 0 1 6.35 6.051a2.34 2.34 0 0 0 3.319-1.915" }], ["circle", { "cx": "12", "cy": "12", "r": "3" }]], "user": [["path", { "d": "M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2" }], ["circle", { "cx": "12", "cy": "7", "r": "4" }]], "users": [["path", { "d": "M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2" }], ["path", { "d": "M16 3.128a4 4 0 0 1 0 7.744" }], ["path", { "d": "M22 21v-2a4 4 0 0 0-3-3.87" }], ["circle", { "cx": "9", "cy": "7", "r": "4" }]], "filter": [["path", { "d": "M10 20a1 1 0 0 0 .553.895l2 1A1 1 0 0 0 14 21v-7a2 2 0 0 1 .517-1.341L21.74 4.67A1 1 0 0 0 21 3H3a1 1 0 0 0-.742 1.67l7.225 7.989A2 2 0 0 1 10 14z" }]], "ellipsis": [["circle", { "cx": "12", "cy": "12", "r": "1" }], ["circle", { "cx": "19", "cy": "12", "r": "1" }], ["circle", { "cx": "5", "cy": "12", "r": "1" }]], "external-link": [["path", { "d": "M15 3h6v6" }], ["path", { "d": "M10 14 21 3" }], ["path", { "d": "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" }]], "copy": [["rect", { "width": "14", "height": "14", "x": "8", "y": "8", "rx": "2", "ry": "2" }], ["path", { "d": "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" }]], "trash-2": [["path", { "d": "M10 11v6" }], ["path", { "d": "M14 11v6" }], ["path", { "d": "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6" }], ["path", { "d": "M3 6h18" }], ["path", { "d": "M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" }]], "pencil": [["path", { "d": "M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z" }], ["path", { "d": "m15 5 4 4" }]], "download": [["path", { "d": "M12 15V3" }], ["path", { "d": "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }], ["path", { "d": "m7 10 5 5 5-5" }]], "upload": [["path", { "d": "M12 3v12" }], ["path", { "d": "m17 8-5-5-5 5" }], ["path", { "d": "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }]], "calendar": [["path", { "d": "M8 2v3" }], ["path", { "d": "M16 2v3" }], ["rect", { "x": "3", "y": "3", "width": "18", "height": "18", "rx": "2" }], ["path", { "d": "M3 9h18" }]], "bell": [["path", { "d": "M10.268 21a2 2 0 0 0 3.464 0" }], ["path", { "d": "M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326" }]], "menu": [["path", { "d": "M4 5h16" }], ["path", { "d": "M4 12h16" }], ["path", { "d": "M4 19h16" }]], "eye": [["path", { "d": "M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0" }], ["circle", { "cx": "12", "cy": "12", "r": "3" }]], "log-out": [["path", { "d": "m16 17 5-5-5-5" }], ["path", { "d": "M21 12H9" }], ["path", { "d": "M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4" }]], "circle": [["circle", { "cx": "12", "cy": "12", "r": "10" }]], "circle-dot-dashed": [["path", { "d": "M10.1 2.18a9.93 9.93 0 0 1 3.8 0" }], ["path", { "d": "M17.6 3.71a9.95 9.95 0 0 1 2.69 2.7" }], ["path", { "d": "M21.82 10.1a9.93 9.93 0 0 1 0 3.8" }], ["path", { "d": "M20.29 17.6a9.95 9.95 0 0 1-2.7 2.69" }], ["path", { "d": "M13.9 21.82a9.94 9.94 0 0 1-3.8 0" }], ["path", { "d": "M6.4 20.29a9.95 9.95 0 0 1-2.69-2.7" }], ["path", { "d": "M2.18 13.9a9.93 9.93 0 0 1 0-3.8" }], ["path", { "d": "M3.71 6.4a9.95 9.95 0 0 1 2.7-2.69" }], ["circle", { "cx": "12", "cy": "12", "r": "1" }]], "ban": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["path", { "d": "M4.929 4.929 19.07 19.071" }]], "arrow-up": [["path", { "d": "m5 12 7-7 7 7" }], ["path", { "d": "M12 19V5" }]], "arrow-down": [["path", { "d": "M12 5v14" }], ["path", { "d": "m19 12-7 7-7-7" }]], "inbox": [["polyline", { "points": "22 12 16 12 14 15 10 15 8 12 2 12" }], ["path", { "d": "M5.45 5.11 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z" }]], "pin": [["path", { "d": "M12 17v5" }], ["path", { "d": "M9 10.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-.76a2 2 0 0 0-1.11-1.79l-1.78-.9A2 2 0 0 1 15 10.76V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H8a2 2 0 0 0 0 4 1 1 0 0 1 1 1z" }]], "pin-off": [["path", { "d": "M12 17v5" }], ["path", { "d": "M15 9.34V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H7.89" }], ["path", { "d": "m2 2 20 20" }], ["path", { "d": "M9 9v1.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h11" }]], "eye-off": [["path", { "d": "M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.747 10.747 0 0 1-1.444 2.49" }], ["path", { "d": "M14.084 14.158a3 3 0 0 1-4.242-4.242" }], ["path", { "d": "M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143" }], ["path", { "d": "m2 2 20 20" }]], "columns-3": [["rect", { "width": "18", "height": "18", "x": "3", "y": "3", "rx": "2" }], ["path", { "d": "M9 3v18" }], ["path", { "d": "M15 3v18" }]], "arrow-left": [["path", { "d": "m12 19-7-7 7-7" }], ["path", { "d": "M19 12H5" }]], "rotate-ccw": [["path", { "d": "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8" }], ["path", { "d": "M3 3v5h5" }]], "house": [["path", { "d": "M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8" }], ["path", { "d": "M3 10a2 2 0 0 1 .709-1.528l7-6a2 2 0 0 1 2.582 0l7 6A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" }]], "layout-dashboard": [["rect", { "width": "7", "height": "9", "x": "3", "y": "3", "rx": "1" }], ["rect", { "width": "7", "height": "5", "x": "14", "y": "3", "rx": "1" }], ["rect", { "width": "7", "height": "9", "x": "14", "y": "12", "rx": "1" }], ["rect", { "width": "7", "height": "5", "x": "3", "y": "16", "rx": "1" }]], "folder": [["path", { "d": "M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z" }]], "chart-column": [["path", { "d": "M3 3v16a2 2 0 0 0 2 2h16" }], ["path", { "d": "M18 17V9" }], ["path", { "d": "M13 17V5" }], ["path", { "d": "M8 17v-3" }]], "file-text": [["path", { "d": "M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z" }], ["path", { "d": "M14 2v5a1 1 0 0 0 1 1h5" }], ["path", { "d": "M10 9H8" }], ["path", { "d": "M16 13H8" }], ["path", { "d": "M16 17H8" }]], "mail": [["path", { "d": "m22 7-8.991 5.727a2 2 0 0 1-2.009 0L2 7" }], ["rect", { "x": "2", "y": "4", "width": "20", "height": "16", "rx": "2" }]], "lock": [["rect", { "width": "18", "height": "11", "x": "3", "y": "11", "rx": "2", "ry": "2" }], ["path", { "d": "M7 11V7a5 5 0 0 1 10 0v4" }]], "clock": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["path", { "d": "M12 6v6l4 2" }]], "trending-up": [["path", { "d": "M16 7h6v6" }], ["path", { "d": "m22 7-8.5 8.5-5-5L2 17" }]], "trending-down": [["path", { "d": "M16 17h6v-6" }], ["path", { "d": "m22 17-8.5-8.5-5 5L2 7" }]], "image": [["rect", { "width": "18", "height": "18", "x": "3", "y": "3", "rx": "2", "ry": "2" }], ["circle", { "cx": "9", "cy": "9", "r": "2" }], ["path", { "d": "m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21" }]], "paperclip": [["path", { "d": "m16 6-8.414 8.586a2 2 0 0 0 2.829 2.829l8.414-8.586a4 4 0 1 0-5.657-5.657l-8.379 8.551a6 6 0 1 0 8.485 8.485l8.379-8.551" }]], "cloud-upload": [["path", { "d": "M12 13v8" }], ["path", { "d": "M4 14.899A7 7 0 1 1 15.71 8h1.79a4.5 4.5 0 0 1 2.5 8.242" }], ["path", { "d": "m8 17 4-4 4 4" }]], "file": [["path", { "d": "M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z" }], ["path", { "d": "M14 2v5a1 1 0 0 0 1 1h5" }]], "sun": [["circle", { "cx": "12", "cy": "12", "r": "4" }], ["path", { "d": "M12 2v2" }], ["path", { "d": "M12 20v2" }], ["path", { "d": "m4.93 4.93 1.41 1.41" }], ["path", { "d": "m17.66 17.66 1.41 1.41" }], ["path", { "d": "M2 12h2" }], ["path", { "d": "M20 12h2" }], ["path", { "d": "m6.34 17.66-1.41 1.41" }], ["path", { "d": "m19.07 4.93-1.41 1.41" }]], "moon": [["path", { "d": "M20.985 12.486a9 9 0 1 1-9.473-9.472c.405-.022.617.46.402.803a6 6 0 0 0 8.268 8.268c.344-.215.825-.004.803.401" }]], "monitor": [["rect", { "width": "20", "height": "14", "x": "2", "y": "3", "rx": "2" }], ["line", { "x1": "8", "x2": "16", "y1": "21", "y2": "21" }], ["line", { "x1": "12", "x2": "12", "y1": "17", "y2": "21" }]], "panel-left-close": [["rect", { "width": "18", "height": "18", "x": "3", "y": "3", "rx": "2" }], ["path", { "d": "M9 3v18" }], ["path", { "d": "m16 15-3-3 3-3" }]], "panel-left-open": [["rect", { "width": "18", "height": "18", "x": "3", "y": "3", "rx": "2" }], ["path", { "d": "M9 3v18" }], ["path", { "d": "m14 9 3 3-3 3" }]], "server": [["rect", { "width": "20", "height": "8", "x": "2", "y": "2", "rx": "2", "ry": "2" }], ["rect", { "width": "20", "height": "8", "x": "2", "y": "14", "rx": "2", "ry": "2" }], ["line", { "x1": "6", "x2": "6.01", "y1": "6", "y2": "6" }], ["line", { "x1": "6", "x2": "6.01", "y1": "18", "y2": "18" }]], "globe": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["path", { "d": "M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20" }], ["path", { "d": "M2 12h20" }]], "activity": [["path", { "d": "M22 12h-2.48a2 2 0 0 0-1.93 1.46l-2.35 8.36a.25.25 0 0 1-.48 0L9.24 2.18a.25.25 0 0 0-.48 0l-2.35 8.36A2 2 0 0 1 4.49 12H2" }]], "shield-alert": [["path", { "d": "M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z" }], ["path", { "d": "M12 8v4" }], ["path", { "d": "M12 16h.01" }]], "phone": [["path", { "d": "M13.832 16.568a1 1 0 0 0 1.213-.303l.355-.465A2 2 0 0 1 17 15h3a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2A18 18 0 0 1 2 4a2 2 0 0 1 2-2h3a2 2 0 0 1 2 2v3a2 2 0 0 1-.8 1.6l-.468.351a1 1 0 0 0-.292 1.233 14 14 0 0 0 6.392 6.384" }]], "wrench": [["path", { "d": "M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.106-3.105c.32-.322.863-.22.983.218a6 6 0 0 1-8.259 7.057l-7.91 7.91a1 1 0 0 1-2.999-3l7.91-7.91a6 6 0 0 1 7.057-8.259c.438.12.54.662.219.984z" }]] };
   var SIZES = { sm: 16, md: 20, lg: 24 };
   var Icon = React2.forwardRef(function Icon2(props, ref) {
     const size = SIZES[props.size] || props.size || 16;
@@ -968,13 +981,20 @@ window.Aura = (() => {
       "onChange",
       "indeterminate",
       "label",
+      "hideLabel",
       "children",
       "description",
       "className",
       "tabIndex",
       "disabled"
     ]);
-    const labelled = props.children != null;
+    const text = props.children;
+    const labelled = text != null && text !== "";
+    if (!labelled && props.label && !props.hideLabel)
+      devWarnOnce(
+        "checkbox-label",
+        "Checkbox `label` is only the accessible name: it is not shown. In 6.0 it will be shown beside the box, like Switch and TextField. For visible text now pass it as children; for a bare box (a table row) add `hideLabel`."
+      );
     const descId = props.description && props.id ? props.id + "-desc" : void 0;
     return /* @__PURE__ */ React8.createElement(
       "label",
@@ -1002,7 +1022,8 @@ window.Aura = (() => {
         }
       ),
       /* @__PURE__ */ React8.createElement("span", { className: "aura-check__box", "aria-hidden": true }, props.indeterminate ? /* @__PURE__ */ React8.createElement(Icon, { name: "minus", size: 12, strokeWidth: 3 }) : on ? /* @__PURE__ */ React8.createElement(Icon, { name: "check", size: 12, strokeWidth: 3 }) : null),
-      labelled ? /* @__PURE__ */ React8.createElement("span", { className: "aura-check__text" }, /* @__PURE__ */ React8.createElement("span", { className: "aura-check__label" }, props.children), props.description ? /* @__PURE__ */ React8.createElement("span", { className: "aura-check__desc", id: descId }, props.description) : null) : null
+      !labelled && props.description ? /* @__PURE__ */ React8.createElement("span", { className: "aura-sr-only", id: descId }, props.description) : null,
+      labelled ? /* @__PURE__ */ React8.createElement("span", { className: "aura-check__text" }, /* @__PURE__ */ React8.createElement("span", { className: "aura-check__label" }, text), props.description ? /* @__PURE__ */ React8.createElement("span", { className: "aura-check__desc", id: descId }, props.description) : null) : null
     );
   });
 
@@ -1013,6 +1034,7 @@ window.Aura = (() => {
   var TONE_WORDS = {
     ready: ["ready", "done", "complete", "completed", "approved", "live", "passed"],
     progress: ["in progress", "in review", "review", "syncing", "running", "pending"],
+    warning: ["warning", "problem", "degraded", "at risk"],
     blocked: ["blocked", "failed", "error", "rejected", "on hold", "cancelled"]
   };
   function toneFor(status) {
@@ -1020,13 +1042,14 @@ window.Aura = (() => {
     for (const t in TONE_WORDS) if (TONE_WORDS[t].indexOf(s) >= 0) return t;
     return "neutral";
   }
-  var TONE_ORDER = { neutral: 0, progress: 1, ready: 2, blocked: 3 };
+  var TONE_ORDER = { neutral: 0, progress: 1, ready: 2, warning: 3, blocked: 4 };
 
   // src/StatusPill.tsx
   var TONE_ICON = {
     neutral: "circle",
     progress: "circle-dot-dashed",
     ready: "circle-check",
+    warning: "triangle-alert",
     blocked: "ban"
   };
   var StatusPill = React9.forwardRef(function StatusPill2(props, ref) {
@@ -2811,7 +2834,17 @@ window.Aura = (() => {
         const body = document.body, overflow = body.style.overflow;
         body.style.overflow = "hidden";
         const el = ref.current;
-        const target = el && (el.querySelector("[data-autofocus]") || el.querySelector(o.bodySelector + " " + FOCUSABLE) || el.querySelector(o.footSelector + " " + FOCUSABLE) || el);
+        const firstIn = function(scope) {
+          if (!scope || !el) return null;
+          const sel = FOCUSABLE.split(",").map(function(s) {
+            return scope + " " + s;
+          }).join(",");
+          const list = el.querySelectorAll(sel);
+          for (let i = 0; i < list.length; i++)
+            if (list[i].tabIndex >= 0 && list[i].getClientRects().length > 0) return list[i];
+          return null;
+        };
+        const target = el && (el.querySelector("[data-autofocus]") || firstIn(o.bodySelector) || firstIn(o.footSelector) || el);
         if (target && o.autoFocus !== false) target.focus();
         return function() {
           body.style.overflow = overflow;
@@ -3933,6 +3966,7 @@ window.Aura = (() => {
           nRows ? /* @__PURE__ */ React28.createElement(
             Checkbox,
             {
+              hideLabel: true,
               checked: all,
               indeterminate: nSel > 0 && !all,
               tabIndex: -1,
@@ -4086,6 +4120,7 @@ window.Aura = (() => {
             /* @__PURE__ */ React28.createElement(
               Checkbox,
               {
+                hideLabel: true,
                 checked: isSel,
                 tabIndex: -1,
                 label: t.selectRow(k),
@@ -4720,7 +4755,12 @@ window.Aura = (() => {
           if (typeof ref === "function") ref(el);
           else if (ref) ref.current = el;
         },
-        className: cx("aura-nav", collapsed && "aura-nav--collapsed", props.className),
+        className: cx(
+          "aura-nav",
+          collapsed && "aura-nav--collapsed",
+          props.bordered === false && "aura-nav--borderless",
+          props.className
+        ),
         "data-collapsed": collapsed ? "" : void 0,
         "aria-label": props.label || t.mainNav,
         onKeyDown

package/components/aura.components.css

@@ -334,6 +334,7 @@ a.aura-icon-btn { text-decoration: none; }
 }
 .aura-pill--progress { background: var(--aura-status-progress-bg); color: var(--aura-status-progress-fg); }
 .aura-pill--ready { background: var(--aura-status-ready-bg); color: var(--aura-status-ready-fg); }
+.aura-pill--warning { background: var(--aura-status-warning-bg); color: var(--aura-status-warning-fg); }
 .aura-pill--blocked { background: var(--aura-status-blocked-bg); color: var(--aura-status-blocked-fg); }
 
 /* Icon — Lucide, 24-grid, stroke in currentColor */
@@ -596,6 +597,9 @@ a.aura-tab { text-decoration: none; }
 }
 .aura-nav__header { padding: var(--aura-space-5) var(--aura-space-4) var(--aura-space-4); }
 .aura-nav__scroll { flex: 1; overflow-y: auto; padding: 0 var(--aura-space-3); }
+/* No header: keep the first item off the top edge (5.0.2). */
+.aura-nav > .aura-nav__scroll:first-child { padding-top: var(--aura-space-3); }
+.aura-nav--borderless { border-right: 0; }
 .aura-nav__section + .aura-nav__section { margin-top: var(--aura-space-5); }
 .aura-nav__title { margin: 0 0 var(--aura-space-1); padding: 0 var(--aura-space-3); font-family: var(--font-mono); font-size: 11px; line-height: 20px; color: var(--aura-fg-tertiary); text-transform: uppercase; letter-spacing: 0.04em; }
 .aura-nav__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }

package/components/index.d.ts

@@ -177,7 +177,7 @@ export interface DataTableProps {
 }
 /** An AURA icon name, or any icon element (e.g. `<Building />` from lucide-react). AURA sizes it and hides it from screen readers. */
 export type IconInput = IconName | React$1.ReactElement;
-export type IconName = "check" | "x" | "plus" | "minus" | "search" | "chevron-down" | "chevron-up" | "chevron-left" | "chevron-right" | "arrow-right" | "arrow-up-right" | "arrow-up-down" | "loader-circle" | "circle-alert" | "circle-check" | "info" | "triangle-alert" | "settings" | "user" | "users" | "filter" | "ellipsis" | "external-link" | "copy" | "trash-2" | "pencil" | "download" | "upload" | "calendar" | "bell" | "menu" | "eye" | "log-out" | "circle" | "circle-dot-dashed" | "ban" | "arrow-up" | "arrow-down" | "inbox" | "pin" | "pin-off" | "eye-off" | "columns-3" | "arrow-left" | "rotate-ccw" | "house" | "layout-dashboard" | "folder" | "chart-column" | "file-text" | "mail" | "lock" | "clock" | "trending-up" | "trending-down" | "image" | "paperclip" | "cloud-upload" | "file" | "sun" | "moon" | "monitor" | "panel-left-close" | "panel-left-open";
+export type IconName = "check" | "x" | "plus" | "minus" | "search" | "chevron-down" | "chevron-up" | "chevron-left" | "chevron-right" | "arrow-right" | "arrow-up-right" | "arrow-up-down" | "loader-circle" | "circle-alert" | "circle-check" | "info" | "triangle-alert" | "settings" | "user" | "users" | "filter" | "ellipsis" | "external-link" | "copy" | "trash-2" | "pencil" | "download" | "upload" | "calendar" | "bell" | "menu" | "eye" | "log-out" | "circle" | "circle-dot-dashed" | "ban" | "arrow-up" | "arrow-down" | "inbox" | "pin" | "pin-off" | "eye-off" | "columns-3" | "arrow-left" | "rotate-ccw" | "house" | "layout-dashboard" | "folder" | "chart-column" | "file-text" | "mail" | "lock" | "clock" | "trending-up" | "trending-down" | "image" | "paperclip" | "cloud-upload" | "file" | "sun" | "moon" | "monitor" | "panel-left-close" | "panel-left-open" | "server" | "globe" | "activity" | "shield-alert" | "phone" | "wrench";
 /** Lucide stroke icon drawn inline in currentColor. */
 export interface IconProps {
 	/** A name from the set, or an icon element of your own (sized and styled the same way). */
@@ -214,12 +214,13 @@ export interface AuraProviderProps {
 	linkComponent?: React$1.ElementType | undefined;
 	children?: React$1.ReactNode | undefined;
 }
-export type StatusTone = "neutral" | "progress" | "ready" | "blocked";
+/** `warning` (5.1): needs attention but still works — Warning, Problem, Degraded, At risk. */
+export type StatusTone = "neutral" | "progress" | "ready" | "warning" | "blocked";
 /** Status pill: tone fill + icon + the status word. Tone comes from the word unless given. */
 export interface StatusPillProps {
 	/** The status word shown, e.g. "In Progress". */
 	children: React$1.ReactNode;
-	/** Force a tone. Default: matched from the word (Ready/Done → ready, In Progress/In Review → progress, Blocked/Failed → blocked, anything else → neutral). */
+	/** Force a tone. Default: matched from the word (Ready/Done → ready, In Progress/In Review → progress, Warning/Problem/Degraded/At risk → warning (5.1), Blocked/Failed → blocked, anything else → neutral). */
 	tone?: StatusTone | undefined;
 	className?: string | undefined;
 }
@@ -229,9 +230,12 @@ export interface CheckboxProps extends Omit<React$1.InputHTMLAttributes<HTMLInpu
 	checked?: boolean | undefined;
 	defaultChecked?: boolean | undefined;
 	indeterminate?: boolean | undefined;
-	/** Accessible name for a bare box (tables). Not needed when children give a visible label. */
+	/** Accessible name. In 5.x it is shown only when given as children; **6.0 shows `label` beside the box** like
+	 * Switch and TextField. Without children and without `hideLabel` it warns once in development. */
 	label?: string | undefined;
-	/** Visible label beside the box (form use). */
+	/** A bare box named by `label`, e.g. in a table row: keeps it hidden in 6.0 and silences the 5.1 notice. */
+	hideLabel?: boolean | undefined;
+	/** The visible label beside the box. */
 	children?: React$1.ReactNode | undefined;
 	/** Second line under the visible label (needs an id to be linked). */
 	description?: React$1.ReactNode | undefined;
@@ -590,6 +594,9 @@ export interface SideNavProps {
 	onCollapsedChange?: ((collapsed: boolean) => void) | undefined;
 	/** Adds a collapse / expand button at the bottom. AppShell hides it in its phone drawer. */
 	collapsible?: boolean | undefined;
+	/** The 1px right edge that divides the nav from the page. Default true; `false` when your layout draws its own
+	 * divider. (5.1) */
+	bordered?: boolean | undefined;
 	className?: string | undefined;
 }
 export interface BreadcrumbProps {

package/figma-variables.csv

@@ -40,6 +40,8 @@ primitive/red/800,color,light,#991b1b,Primitive red 800. Danger button hover onl
 primitive/amber/50,color,light,#fffbeb,Primitive. Warning alert fill (light). ADDED.,
 primitive/amber/200,color,light,#fde68a,Primitive. Warning alert edge (light). ADDED.,
 primitive/amber/300,color,light,#fcd34d,"Primitive. Warning alert text (dark), 9.6:1. ADDED.",
+primitive/amber/500,color,light,#f59e0b,Primitive. Warning status pill fill (dark). ADDED 5.1.,
+primitive/amber/600,color,light,#d97706,Primitive. Warning status pill fill (light). ADDED 5.1.,
 primitive/amber/800,color,light,#92400e,"Primitive. Warning alert text (light), 6.8:1 on amber-50. ADDED.",
 primitive/ink,color,light,#08080a,Primitive ink (= zinc-950). Text on lime fills: the Ready status label (15:1 on aura-lime-200).,
 primitive/white,color,light,#ffffff,Primitive white. The Creative button fill in every theme.,
@@ -73,6 +75,8 @@ semantic/status-ready-bg,color,light,{primitive/lime/200},"Status pill fill for
 semantic/status-ready-fg,color,light,{primitive/ink},"Label and icon on aura-status-ready-bg (light 15.2:1; dark lime-300, 9.9:1).",ALL_FILLS
 semantic/status-blocked-bg,color,light,{primitive/red/700},"Status pill fill for stopped / failed states (Blocked, Failed). Dark on purpose: 5.5:1 lighter-to-darker against the lime Ready fill, so Ready and Blocked differ by lightness, not only red vs green. ADDED.",ALL_FILLS
 semantic/status-blocked-fg,color,light,{primitive/white},Label and icon on aura-status-blocked-bg (6.5:1).,ALL_FILLS
+semantic/status-warning-bg,color,light,{primitive/amber/600},"Status pill fill for states that need attention but still work (Warning, Problem, Degraded, At risk). A solid amber (amber-600 light, amber-500 dark) that differs from Ready and Blocked by lightness too, not only hue: 2.7:1 from lime-200 and 2.0:1 from red-700 in light; 6.0:1 from the dark Ready fill and 3.0:1 from red-700 in dark. Always with the word and the triangle-alert icon. ADDED 5.1.",ALL_FILLS
+semantic/status-warning-fg,color,light,{primitive/ink},"Label and icon on aura-status-warning-bg: ink, 6.3:1 light, 9.3:1 dark.",ALL_FILLS
 semantic/bg-selected,color,light,{primitive/violet/50},"Selected table rows and list items. Opaque so pinned columns can sit on it (dark = a 14% violet-400 wash over zinc-900, flattened). aura-fg-primary on it ≥14.2:1, aura-fg-secondary ≥5.5:1, focus ring ≥5.2:1 in both themes. ADDED.",FRAME_FILL
 semantic/border-control,color,light,{primitive/zinc/500},"Outline of unchecked checkboxes and other small controls that must be seen: ≥4.4:1 on aura-bg-surface, -canvas and aura-bg-selected (the 3:1 a control boundary needs). ADDED.",STROKE_COLOR
 semantic/bg-skeleton,color,light,{primitive/zinc/200},zinc-200 light / zinc-700 dark so bars read on white and on zinc-900 surfaces. Skeleton placeholder bars while a table or list loads. Decorative; the table carries aria-busy and a 'Loading rows' status for screen readers. ADDED.,FRAME_FILL
@@ -139,6 +143,8 @@ semantic/status-ready-bg,color,dark,#2b351f,"Status pill fill for finished / goo
 semantic/status-ready-fg,color,dark,{primitive/lime/300},"Label and icon on aura-status-ready-bg (light 15.2:1; dark lime-300, 9.9:1).",ALL_FILLS
 semantic/status-blocked-bg,color,dark,{primitive/red/700},"Status pill fill for stopped / failed states (Blocked, Failed). Dark on purpose: 5.5:1 lighter-to-darker against the lime Ready fill, so Ready and Blocked differ by lightness, not only red vs green. ADDED.",ALL_FILLS
 semantic/status-blocked-fg,color,dark,{primitive/white},Label and icon on aura-status-blocked-bg (6.5:1).,ALL_FILLS
+semantic/status-warning-bg,color,dark,{primitive/amber/500},"Status pill fill for states that need attention but still work (Warning, Problem, Degraded, At risk). A solid amber (amber-600 light, amber-500 dark) that differs from Ready and Blocked by lightness too, not only hue: 2.7:1 from lime-200 and 2.0:1 from red-700 in light; 6.0:1 from the dark Ready fill and 3.0:1 from red-700 in dark. Always with the word and the triangle-alert icon. ADDED 5.1.",ALL_FILLS
+semantic/status-warning-fg,color,dark,{primitive/ink},"Label and icon on aura-status-warning-bg: ink, 6.3:1 light, 9.3:1 dark.",ALL_FILLS
 semantic/bg-selected,color,dark,#2c283a,"Selected table rows and list items. Opaque so pinned columns can sit on it (dark = a 14% violet-400 wash over zinc-900, flattened). aura-fg-primary on it ≥14.2:1, aura-fg-secondary ≥5.5:1, focus ring ≥5.2:1 in both themes. ADDED.",FRAME_FILL
 semantic/border-control,color,dark,{primitive/zinc/400},"Outline of unchecked checkboxes and other small controls that must be seen: ≥4.4:1 on aura-bg-surface, -canvas and aura-bg-selected (the 3:1 a control boundary needs). ADDED.",STROKE_COLOR
 semantic/bg-skeleton,color,dark,{primitive/zinc/700},zinc-200 light / zinc-700 dark so bars read on white and on zinc-900 surfaces. Skeleton placeholder bars while a table or list loads. Decorative; the table carries aria-busy and a 'Loading rows' status for screen readers. ADDED.,FRAME_FILL

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jirawatpyk/aura-tokens",
-  "version": "5.0.1",
+  "version": "5.1.0",
   "description": "AURA Design System — tokens (CSS variables, Tailwind preset, Figma variables), theme contrast checks and token lint.",
   "main": "tailwind.tokens.cjs",
   "types": "components/index.d.ts",

package/scripts/a11y-check.js

@@ -48,7 +48,7 @@ for (const fg of ['fg-primary', 'fg-secondary', 'fg-tertiary', 'fg-accent', 'fg-
 pairs.push(['fg-primary', 'bg-selected', TEXT], ['fg-secondary', 'bg-selected', TEXT]);
 pairs.push(['fg-inverted', 'bg-surface-strong', TEXT], ['fg-inverted', 'bg-inverted', TEXT]);
 pairs.push(['button-primary-fg', 'button-primary-bg', TEXT], ['button-primary-fg', 'button-primary-bg-hover', TEXT]);
-for (const t of ['neutral', 'progress', 'ready', 'blocked']) pairs.push([`status-${t}-fg`, `status-${t}-bg`, TEXT]);
+for (const t of ['neutral', 'progress', 'ready', 'warning', 'blocked']) pairs.push([`status-${t}-fg`, `status-${t}-bg`, TEXT]);
 for (const t of ['info', 'success', 'warning', 'danger']) pairs.push([`alert-${t}-fg`, `alert-${t}-bg`, TEXT], ['fg-primary', `alert-${t}-bg`, TEXT]);
 pairs.push(['on-texture', 'mesh-from', TEXT], ['on-texture', 'mesh-to', TEXT]);
 for (const bg of ['bg-surface', 'bg-canvas', 'bg-input', 'bg-selected']) pairs.push(['border-control', bg, UI]);
@@ -67,6 +67,8 @@ for (const bg of ['bg-surface', 'bg-canvas']) {
   pairs.push(['chart-axis', bg, TEXT]);
 }
 for (let i = 1; i < 8; i++) pairs.push([`chart-${i}`, `chart-${i + 1}`, NEIGHBOUR]);
+/* Status fills that sit side by side in a column must also differ in lightness, not only hue (5.1: warning). */
+pairs.push(['status-warning-bg', 'status-ready-bg', NEIGHBOUR], ['status-warning-bg', 'status-blocked-bg', NEIGHBOUR]);
 /* Progress / upload tracks: the edge shows the empty part at 3:1; the bar colours also clear 3:1 on the track fill. */
 for (const bg of ['bg-surface', 'bg-canvas']) pairs.push(['progress-track-edge', bg, UI]);
 for (const fg of ['fg-accent', 'fg-positive', 'fg-danger', 'fg-secondary']) pairs.push([fg, 'progress-track', UI]);

package/tailwind.tokens.cjs

@@ -52,6 +52,8 @@ module.exports = {
         "50": "var(--aura-amber-50)",
         "200": "var(--aura-amber-200)",
         "300": "var(--aura-amber-300)",
+        "500": "var(--aura-amber-500)",
+        "600": "var(--aura-amber-600)",
         "800": "var(--aura-amber-800)"
       },
       "ink": "var(--aura-ink)",
@@ -101,7 +103,9 @@ module.exports = {
       "ready-bg": "var(--aura-status-ready-bg)",
       "ready-fg": "var(--aura-status-ready-fg)",
       "blocked-bg": "var(--aura-status-blocked-bg)",
-      "blocked-fg": "var(--aura-status-blocked-fg)"
+      "blocked-fg": "var(--aura-status-blocked-fg)",
+      "warning-bg": "var(--aura-status-warning-bg)",
+      "warning-fg": "var(--aura-status-warning-fg)"
     },
     "chart": {
       "1": "var(--aura-chart-1)",

package/tokens.json

@@ -1,5 +1,5 @@
 {
-  "version": "5.0.1",
+  "version": "5.1.0",
   "meta": {
     "name": "AURA Design System",
     "tier": "3-tier",
@@ -61,6 +61,8 @@
       "50": "#fffbeb",
       "200": "#fde68a",
       "300": "#fcd34d",
+      "500": "#f59e0b",
+      "600": "#d97706",
       "800": "#92400e"
     },
     "ink": "#08080a",
@@ -98,6 +100,8 @@
       "status-ready-fg": "{primitive.ink}",
       "status-blocked-bg": "{primitive.red.700}",
       "status-blocked-fg": "{primitive.white}",
+      "status-warning-bg": "{primitive.amber.600}",
+      "status-warning-fg": "{primitive.ink}",
       "bg-selected": "{primitive.violet.50}",
       "border-control": "{primitive.zinc.500}",
       "bg-skeleton": "{primitive.zinc.200}",
@@ -166,6 +170,8 @@
       "status-ready-fg": "{primitive.lime.300}",
       "status-blocked-bg": "{primitive.red.700}",
       "status-blocked-fg": "{primitive.white}",
+      "status-warning-bg": "{primitive.amber.500}",
+      "status-warning-fg": "{primitive.ink}",
       "bg-selected": "#2c283a",
       "border-control": "{primitive.zinc.400}",
       "bg-skeleton": "{primitive.zinc.700}",
@@ -464,6 +470,8 @@
     "amber-50": "Primitive. Warning alert fill (light). ADDED.",
     "amber-200": "Primitive. Warning alert edge (light). ADDED.",
     "amber-300": "Primitive. Warning alert text (dark), 9.6:1. ADDED.",
+    "amber-500": "Primitive. Warning status pill fill (dark). ADDED 5.1.",
+    "amber-600": "Primitive. Warning status pill fill (light). ADDED 5.1.",
     "amber-800": "Primitive. Warning alert text (light), 6.8:1 on amber-50. ADDED.",
     "ink": "Primitive ink (= zinc-950). Text on lime fills: the Ready status label (15:1 on aura-lime-200).",
     "white": "Primitive white. The Creative button fill in every theme.",
@@ -503,6 +511,8 @@
     "status-ready-fg": "Label and icon on aura-status-ready-bg (light 15.2:1; dark lime-300, 9.9:1).",
     "status-blocked-bg": "Status pill fill for stopped / failed states (Blocked, Failed). Dark on purpose: 5.5:1 lighter-to-darker against the lime Ready fill, so Ready and Blocked differ by lightness, not only red vs green. ADDED.",
     "status-blocked-fg": "Label and icon on aura-status-blocked-bg (6.5:1).",
+    "status-warning-bg": "Status pill fill for states that need attention but still work (Warning, Problem, Degraded, At risk). A solid amber (amber-600 light, amber-500 dark) that differs from Ready and Blocked by lightness too, not only hue: 2.7:1 from lime-200 and 2.0:1 from red-700 in light; 6.0:1 from the dark Ready fill and 3.0:1 from red-700 in dark. Always with the word and the triangle-alert icon. ADDED 5.1.",
+    "status-warning-fg": "Label and icon on aura-status-warning-bg: ink, 6.3:1 light, 9.3:1 dark.",
     "bg-selected": "Selected table rows and list items. Opaque so pinned columns can sit on it (dark = a 14% violet-400 wash over zinc-900, flattened). aura-fg-primary on it ≥14.2:1, aura-fg-secondary ≥5.5:1, focus ring ≥5.2:1 in both themes. ADDED.",
     "border-control": "Outline of unchecked checkboxes and other small controls that must be seen: ≥4.4:1 on aura-bg-surface, -canvas and aura-bg-selected (the 3:1 a control boundary needs). ADDED.",
     "bg-skeleton": "zinc-200 light / zinc-700 dark so bars read on white and on zinc-900 surfaces. Skeleton placeholder bars while a table or list loads. Decorative; the table carries aria-busy and a 'Loading rows' status for screen readers. ADDED.",