@actioneer/ads 0.8.0 → 1.0.0

package/theme.css

@@ -26,22 +26,33 @@
   --font-mono: "JetBrains Mono Variable", ui-monospace, SFMono-Regular,
     "SF Mono", Menlo, Consolas, "Liberation Mono", "Courier New", monospace;
 
-  /* ---- Type scale ---- five canonical steps: S · M · L · XL · 2XL.
-     Root stays 16px so spacing is unaffected. */
-  --text-s: 0.8125rem;     /* 13px · captions, secondary text, table cells */
-  --text-s--line-height: 1.125rem; /* 18px */
-  --text-m: 0.9375rem;     /* 15px · default body */
-  --text-m--line-height: 1.375rem; /* 22px */
-  --text-l: 1.1875rem;     /* 19px · emphasized body, section headings */
-  --text-l--line-height: 1.625rem; /* 26px */
-  --text-xl: 1.5625rem;    /* 25px · page titles */
-  --text-xl--line-height: 2rem; /* 32px */
-  --text-2xl: 1.9375rem;   /* 31px · display */
-  --text-2xl--line-height: 2.375rem; /* 38px */
-
-  /* Compatibility aliases keep existing ADS consumers on the new scale. */
-  --text-xs: var(--text-s);
-  --text-xs--line-height: var(--text-s--line-height);
+  /* ---- Type scale ---- seven canonical steps: XS · S · M · L · XL · 2XL · 3XL.
+     Roles follow the agent workflow. Root stays 16px so spacing is unaffected. */
+  --text-xs: 0.625rem;     /* 10px · compact chips and micro metadata */
+  --text-xs--line-height: 0.875rem; /* 14px */
+  --text-s: 0.75rem;       /* 12px · table headers and uppercase kickers */
+  --text-s--line-height: 1rem; /* 16px */
+  --text-m: 0.875rem;      /* 14px · default body, table cells, record names */
+  --text-m--line-height: 1.25rem; /* 20px */
+  --text-l: 1rem;          /* 16px · tabs, form labels, and section titles */
+  --text-l--line-height: 1.375rem; /* 22px */
+  --text-xl: 1.125rem;     /* 18px · metric values and subtitles */
+  --text-xl--line-height: 1.5rem; /* 24px */
+  --text-2xl: 1.5rem;      /* 24px · page titles */
+  --text-2xl--line-height: 2rem; /* 32px */
+  --text-3xl: 2rem;        /* 32px · large data display */
+  --text-3xl--line-height: 2.5rem; /* 40px */
+
+  /* This is the complete ADS scale. Remove Tailwind's larger default steps so
+     Storybook and product code cannot silently introduce an eighth size. */
+  --text-4xl: initial;
+  --text-5xl: initial;
+  --text-6xl: initial;
+  --text-7xl: initial;
+  --text-8xl: initial;
+  --text-9xl: initial;
+
+  /* Compatibility aliases keep existing ADS consumers on the canonical scale. */
   --text-sm: var(--text-s);
   --text-sm--line-height: var(--text-s--line-height);
   --text-base: var(--text-m);
@@ -187,21 +198,21 @@
   /* Demo logo indigo — source for artifact canvas wash. */
   --color-brand-mark: #2e1065;
 
-  /* ---- Radii ---- five canonical steps: XS · S · M · L · XL.
+  /* ---- Radii ---- four canonical steps: XS · S · M · L.
      M (6px) is the default corner radius. */
   --radius-xs: 0.125rem;  /*  2px · micro details */
   --radius-s: 0.25rem;    /*  4px · compact controls */
   --radius-m: 0.375rem;   /*  6px · default controls and surfaces */
-  --radius-l: 0.5rem;     /*  8px · menus and cards */
-  --radius-xl: 0.75rem;   /* 12px · large panels and feature surfaces */
+  --radius-l: 0.5rem;     /*  8px · menus, cards, and large surfaces */
 
   /* Compatibility aliases preserve existing ADS utilities. */
   --radius-sm: var(--radius-s);
   --radius-md: var(--radius-m);
   --radius-lg: var(--radius-l);
-  --radius-2xl: var(--radius-xl);
-  --radius-3xl: var(--radius-xl);
-  --radius-4xl: var(--radius-xl);
+  --radius-xl: var(--radius-l);
+  --radius-2xl: var(--radius-l);
+  --radius-3xl: var(--radius-l);
+  --radius-4xl: var(--radius-l);
   /* Shape-only exception for avatars, icon buttons, progress tracks, chips,
      and badges. It is not part of the corner-radius scale. */
   --radius-full: 9999px;
@@ -253,8 +264,8 @@
   --sidebar-item: 2rem; /* 32px — collapsed rail hit target (square) */
   --sidebar-logo: 1.25rem; /* 20px — brand mark, centered in a --sidebar-item square */
   --sidebar-text-indent: 2.375rem; /* px-3 + icon size-4 + gap-2.5 — history rows align to nav-item text */
-  --sidebar-navigation-text-size: var(--text-m); /* 15px — sidebar actions, items, history, and account text */
-  --sidebar-section-label-size: 0.8125rem; /* 13px — section and history labels */
+  --sidebar-navigation-text-size: var(--text-m); /* 14px — sidebar actions, items, history, and account text */
+  --sidebar-section-label-size: var(--text-s); /* 12px — section and history labels */
   --panel-header-height: 2.75rem; /* 44px — Panel / toolbar header */
   --aside-width: 20rem; /* 320px — right-hand panel column */
 
@@ -267,7 +278,7 @@
   --thread-max-width: 44rem; /* chat column cap — readable prose measure, all panes */
   --thread-max-width-wide: 64rem; /* rich-content breakout cap (tables/charts/tool cards) on wide panes; prose keeps --thread-max-width */
   --composer-bg: var(--elevated); /* pure white composer surface */
-  --composer-radius: var(--radius-xl);
+  --composer-radius: var(--radius-l);
   --composer-padding: 0.5rem;
   --composer-placeholder-max-h: calc(var(--text-m--line-height) * 2); /* rotating placeholder clamp — two lines of the input's own rhythm, so it can never overlap the accessory row */
   --chat-texture-opacity: 0.06; /* welcome-state halftone wash */
@@ -429,16 +440,18 @@
   --foreground: var(--color-wg12);         /* step 12 */
 
   /* Both surface contexts point directly into the approved WG text steps.
-     WG10 is the tertiary/de-emphasis step and clears AA on White and WG2. */
+     WG9 is the tertiary/de-emphasis step for nonessential metadata. It clears
+     normal-text AA on White; use Secondary when normal text on WG2 must clear
+     AA. */
   --text-on-white-primary: var(--color-wg12);       /* 16.32:1 · AAA */
   --text-on-white-secondary: var(--color-wg11);     /*  8.76:1 · AAA */
-  --text-on-white-tertiary: var(--color-wg10);      /*  5.60:1 · AA  */
+  --text-on-white-tertiary: var(--color-wg9);       /*  4.50:1 · AA  */
   --text-on-warm-grey-primary: var(--color-wg12);   /* 14.43:1 on WG2 · AAA */
   --text-on-warm-grey-secondary: var(--color-wg11); /*  7.75:1 on WG2 · AAA */
-  --text-on-warm-grey-tertiary: var(--color-wg10);  /*  4.95:1 on WG2 · AA  */
+  --text-on-warm-grey-tertiary: var(--color-wg9);   /*  3.98:1 on WG2 · large text AA */
 
-  /* Existing context-free utilities remain compatibility aliases. Their
-     tertiary value stays conservative across WG2–WG4 and White. */
+  /* Existing context-free utilities remain conservative compatibility aliases
+     across WG2–WG4 and White until their call sites adopt a surface role. */
   --text-primary: var(--color-wg12);       /* 12.93:1 AAA (WG4 min surf) */
   --text-secondary: var(--color-wg11);     /*  6.94:1 AA  (WG4 min surf) */
   --text-tertiary: color-mix(in srgb, var(--color-wg10) 80%, var(--color-wg11)); /* 4.86:1 AA (WG4) */
@@ -469,8 +482,8 @@
   --brand-hover: var(--color-wg11);        /* lighter hover lift */
   --brand-text: var(--color-wg12);         /* action text / links */
 
-  /* Interactive row hover/focus uses the WG1 highlight wash. */
-  --table-row-hover: var(--color-wg2);
+  /* Interactive row hover/focus uses the WG3 highlight wash. */
+  --table-row-hover: var(--color-wg3);
   --table-row-selected: var(--color-wg1);
 
   /* Quiet component fill. WG3 is the first interactive-background
@@ -520,7 +533,7 @@
   --texture-ink: var(--color-wg12);      /* brand-texture / pixel-blast marks */
   --table-shell: var(--color-white);     /* simplified single-surface table */
   --table-stroke: var(--color-wg3);      /* table outline + row separators */
-  --table-header-foreground: var(--color-wg11); /* readable secondary table heading text */
+  --table-header-foreground: var(--text-tertiary); /* 12px tertiary table heading text */
   --specimen-stroke: var(--color-wg3);   /* showcase preview + variant-group frames */
   --table-scroll-hint: color-mix(in srgb, var(--color-wg12) 4%, transparent); /* right-edge wash */
   --surface-inverse: var(--color-wg12);     /* dark hero / inverse surface base */