@jirawatpyk/aura-tokens 4.7.0 → 4.7.1

package/aura.css

@@ -1,4 +1,4 @@
-/* AURA v4.7.0 — GENERATED by scripts/build-tokens.js from tokens.json. Do not edit by hand. */
+/* AURA v4.7.1 — 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"] {
@@ -98,6 +98,7 @@
   --aura-button-primary-bg: var(--aura-zinc-900);
   --aura-button-primary-fg: var(--aura-zinc-0);
   --aura-button-primary-bg-hover: var(--aura-zinc-800);
+  --aura-button-secondary-border: var(--aura-zinc-450);
   --aura-button-creative-bg: var(--aura-white);
   --aura-button-creative-border: var(--aura-zinc-900);
   --aura-card-border: var(--aura-zinc-200);
@@ -149,6 +150,7 @@
   --aura-button-primary-bg: var(--aura-zinc-0);
   --aura-button-primary-fg: var(--aura-zinc-900);
   --aura-button-primary-bg-hover: var(--aura-zinc-200);
+  --aura-button-secondary-border: var(--aura-zinc-500);
   --aura-shadow-overlay: 0 16px 48px rgba(0,0,0,0.56), 0 2px 8px rgba(0,0,0,0.32);
   --aura-shadow-creative: 4px 4px 0px #a78bfa;
   --aura-shadow-creative-hover: 6px 6px 0px #a78bfa;
@@ -198,6 +200,7 @@
     --aura-button-primary-bg: var(--aura-zinc-0);
     --aura-button-primary-fg: var(--aura-zinc-900);
     --aura-button-primary-bg-hover: var(--aura-zinc-200);
+    --aura-button-secondary-border: var(--aura-zinc-500);
     --aura-shadow-overlay: 0 16px 48px rgba(0,0,0,0.56), 0 2px 8px rgba(0,0,0,0.32);
     --aura-shadow-creative: 4px 4px 0px #a78bfa;
     --aura-shadow-creative-hover: 6px 6px 0px #a78bfa;

package/components/aura.components.css

@@ -41,7 +41,7 @@ a.aura-btn { text-decoration: none; }
 .aura-btn--primary { background: var(--aura-button-primary-bg); color: var(--aura-button-primary-fg); }
 .aura-btn--primary:hover { background: var(--aura-button-primary-bg-hover); }
 
-.aura-btn--secondary { border: 1px solid var(--aura-border-default); color: var(--aura-fg-primary); }
+.aura-btn--secondary { border: 1px solid var(--aura-button-secondary-border); color: var(--aura-fg-primary); }
 .aura-btn--secondary:hover { background: var(--aura-bg-surface-hover); }
 
 .aura-btn--creative {

package/figma-variables.csv

@@ -146,12 +146,14 @@ semantic/fg-positive,color,dark,{primitive/lime/300},"Rising-and-good numbers (S
 component/button-primary-bg,color,light,{primitive/zinc/900},"Component: Enterprise (primary) button fill — ink in light, white in dark, as the Storybook story renders it (tokens.json pins it to the light value, which disappears on the dark surface).",ALL_FILLS
 component/button-primary-fg,color,light,{primitive/zinc/0},Component: primary button label on aura-button-primary-bg (17.7:1 both themes).,ALL_FILLS
 component/button-primary-bg-hover,color,light,{primitive/zinc/800},"Component: primary button hover. Light zinc-800 is the source value; dark zinc-200 is an ADDED value (the source has none — its zinc-800 hover hides the dark label at 1.19:1). Label 14.9:1 light, 14.0:1 dark.",ALL_FILLS
+component/button-secondary-border,color,light,{primitive/zinc/450},"Component: secondary button (and secondary Button links) 1px edge. ≥3:1 on aura-bg-surface and -canvas in both themes (zinc-450 light 3.1–3.3:1, zinc-500 dark 3.7–4.1:1), so the pill is visible without its label. ADDED 4.7.1 (was aura-border-default, ~1.3:1).",ALL_FILLS
 component/button-creative-bg,color,light,{primitive/white},Component: Creative button fill (white in every theme). Label in aura-ink.,ALL_FILLS
 component/button-creative-border,color,light,{primitive/zinc/900},Component: Creative button 2px border.,ALL_FILLS
 component/card-border,color,light,{primitive/zinc/200},Component: card outline (light value; use aura-border-default where the card must follow theme).,ALL_FILLS
 component/button-primary-bg,color,dark,{primitive/zinc/0},"Component: Enterprise (primary) button fill — ink in light, white in dark, as the Storybook story renders it (tokens.json pins it to the light value, which disappears on the dark surface).",ALL_FILLS
 component/button-primary-fg,color,dark,{primitive/zinc/900},Component: primary button label on aura-button-primary-bg (17.7:1 both themes).,ALL_FILLS
 component/button-primary-bg-hover,color,dark,{primitive/zinc/200},"Component: primary button hover. Light zinc-800 is the source value; dark zinc-200 is an ADDED value (the source has none — its zinc-800 hover hides the dark label at 1.19:1). Label 14.9:1 light, 14.0:1 dark.",ALL_FILLS
+component/button-secondary-border,color,dark,{primitive/zinc/500},"Component: secondary button (and secondary Button links) 1px edge. ≥3:1 on aura-bg-surface and -canvas in both themes (zinc-450 light 3.1–3.3:1, zinc-500 dark 3.7–4.1:1), so the pill is visible without its label. ADDED 4.7.1 (was aura-border-default, ~1.3:1).",ALL_FILLS
 component/button-creative-bg,color,dark,{primitive/white},Component: Creative button fill (white in every theme). Label in aura-ink.,ALL_FILLS
 component/button-creative-border,color,dark,{primitive/zinc/900},Component: Creative button 2px border.,ALL_FILLS
 component/card-border,color,dark,{primitive/zinc/200},Component: card outline (light value; use aura-border-default where the card must follow theme).,ALL_FILLS

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jirawatpyk/aura-tokens",
-  "version": "4.7.0",
+  "version": "4.7.1",
   "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

@@ -54,6 +54,7 @@ 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]);
 for (const bg of ['bg-surface', 'bg-canvas', 'bg-surface-hover', 'bg-selected']) pairs.push(['focus-ring', bg, UI]);
 pairs.push(['border-danger', 'bg-input', UI]);
+for (const bg of ['bg-surface', 'bg-canvas']) pairs.push(['button-secondary-border', bg, UI]);
 
 const results = [], fails = [];
 for (const theme of ['light', 'dark']) for (const [fg, bg, min] of pairs) {

package/tokens.json

@@ -1,5 +1,5 @@
 {
-  "version": "4.7.0",
+  "version": "4.7.1",
   "meta": {
     "name": "AURA Design System",
     "tier": "3-tier",
@@ -177,6 +177,7 @@
       "button-primary-bg": "{primitive.zinc.900}",
       "button-primary-fg": "{primitive.zinc.0}",
       "button-primary-bg-hover": "{primitive.zinc.800}",
+      "button-secondary-border": "{primitive.zinc.450}",
       "button-creative-bg": "{primitive.white}",
       "button-creative-border": "{primitive.zinc.900}",
       "card-border": "{primitive.zinc.200}"
@@ -185,6 +186,7 @@
       "button-primary-bg": "{primitive.zinc.0}",
       "button-primary-fg": "{primitive.zinc.900}",
       "button-primary-bg-hover": "{primitive.zinc.200}",
+      "button-secondary-border": "{primitive.zinc.500}",
       "button-creative-bg": "{primitive.white}",
       "button-creative-border": "{primitive.zinc.900}",
       "card-border": "{primitive.zinc.200}"
@@ -479,6 +481,7 @@
     "container-narrow": "Narrow container for forms and reading. ADDED 4.2.",
     "cal-cell": "Calendar day cell (DatePicker). 40px on touch screens via media query. ADDED 4.2.",
     "popover-max-height": "Max height of Combobox listbox and DatePicker popover lists. ADDED 4.2.",
-    "fg-positive": "Rising-and-good numbers (Stat change, positive deltas) on aura-bg-surface / -canvas. Never on lime fills. ADDED 4.3."
+    "fg-positive": "Rising-and-good numbers (Stat change, positive deltas) on aura-bg-surface / -canvas. Never on lime fills. ADDED 4.3.",
+    "button-secondary-border": "Component: secondary button (and secondary Button links) 1px edge. ≥3:1 on aura-bg-surface and -canvas in both themes (zinc-450 light 3.1–3.3:1, zinc-500 dark 3.7–4.1:1), so the pill is visible without its label. ADDED 4.7.1 (was aura-border-default, ~1.3:1)."
   }
 }