@ultimat3/ui 23.0.0 → 25.0.0

package/src/icons/build-icons.ts

@@ -11,9 +11,19 @@ import { invalidIconDataError, runtimeMissingError } from '../errors';
 /** Pinned: a floating version would silently redraw icons under an app that never asked. */
 export const LUCIDE_VERSION = '1.31.0';
 
-export const LUCIDE_ICON_NODES_URL = `https://cdn.jsdelivr.net/npm/lucide-static@${LUCIDE_VERSION}/icon-nodes.json`;
+/** Where one pinned version's node table lives. */
+export const iconNodesUrl = (version: string): string =>
+  `https://cdn.jsdelivr.net/npm/lucide-static@${version}/icon-nodes.json`;
 
-export const GLYPHS_DIR = new URL('./glyphs/', import.meta.url).pathname;
+export const LUCIDE_ICON_NODES_URL = iconNodesUrl(LUCIDE_VERSION);
+
+/** The registry's answer for the newest published `lucide-static` — what `--bump` pins to. */
+export const LUCIDE_LATEST_URL = 'https://registry.npmjs.org/lucide-static/latest';
+
+/** The tail of every cause about data the PIN published: why re-running alone cannot help. */
+const PIN_REPEATS = `lucide-static@${LUCIDE_VERSION} is the pin that published it, so a re-run against the same pin repeats this; \`--bump\` raises LUCIDE_VERSION in packages/ui/src/icons/build-icons.ts to the latest release and regenerates`;
+
+export const GLYPHS_DIR = Bun.fileURLToPath(new URL('./glyphs/', import.meta.url));
 
 /** `circle-alert` → `iconCircleAlert`. Prefixed because `delete`, `import` and `package` are icons
  * and reserved words — one uniform rule beats three exceptions an agent has to remember. */
@@ -27,7 +37,7 @@ export function identifierFor(name: string): string {
  * the network, so its shape is an assumption until it is checked.
  */
 export function parseIconNodes(text: string): ReadonlyMap<string, IconGlyph> {
-  const parsed: unknown = JSON.parse(text);
+  const parsed = parseJson(text);
   // `typeof [] === 'object'`, and an array of icons is a different upstream format, not this one.
   if (typeof parsed !== 'object' || parsed === null || Array.isArray(parsed)) {
     throw invalidIconDataError(
@@ -42,8 +52,8 @@ export function parseIconNodes(text: string): ReadonlyMap<string, IconGlyph> {
     // writes, so `../../index` is a delete plus an overwrite of a hand-written module.
     if (!SAFE_ICON_NAME.test(name)) {
       throw invalidIconDataError(
-        `carries ${renderCauseValue(name)} as an icon name, which is not the kebab-case shape every Lucide icon uses; the name becomes a file path and an exported identifier, so it cannot be escaped. lucide-static@${LUCIDE_VERSION} is the pin that published it, so a re-run against the same pin repeats this`,
-        'bun run --filter @ultimat3/ui icons   # after raising LUCIDE_VERSION in packages/ui/src/icons/build-icons.ts',
+        `carries ${renderCauseValue(name)} as an icon name, which is not the kebab-case shape every Lucide icon uses; the name becomes a file path and an exported identifier, so it cannot be escaped. ${PIN_REPEATS}`,
+        'bun run --filter @ultimat3/ui icons --bump',
       );
     }
     out.set(name, toGlyph(name, value));
@@ -51,6 +61,29 @@ export function parseIconNodes(text: string): ReadonlyMap<string, IconGlyph> {
   return out;
 }
 
+/** The body as JSON, or the same coded refusal a wrong shape gets — never a bare `SyntaxError`. */
+function parseJson(text: string): unknown {
+  try {
+    return JSON.parse(text);
+  } catch {
+    throw invalidIconDataError(
+      `is not JSON (${renderCauseValue(text.slice(0, 80))}…); ${LUCIDE_ICON_NODES_URL} served an error page or a truncated body`,
+      'bun run --filter @ultimat3/ui icons',
+    );
+  }
+}
+
+/** A node that is not `[tag, attrs?]` with an object for attrs — refused, never skipped. */
+function malformedNode(name: string, node: unknown): ReturnType<typeof invalidIconDataError> {
+  return invalidIconDataError(
+    `for the icon "${name}" carries ${renderCauseValue(node)} where a [tag, attributes] node belongs; skipping it would write a partial glyph. ${PIN_REPEATS}`,
+    'bun run --filter @ultimat3/ui icons --bump',
+  );
+}
+
+const isAttrs = (value: unknown): value is Record<string, unknown> =>
+  typeof value === 'object' && value !== null && !Array.isArray(value);
+
 /**
  * An icon name, as characters: lowercase kebab-case, no leading, trailing or doubled hyphen. The
  * same allowlist-over-a-sink shape as `SAFE_ATTR_VALUE`, one layer up — the name is interpolated
@@ -68,10 +101,13 @@ export const SAFE_ATTR_VALUE = /^[\w\s.,+-]*$/;
 
 function toGlyph(name: string, value: unknown): IconGlyph {
   const glyph: (readonly [string, Readonly<Record<string, string>>])[] = [];
-  for (const node of Array.isArray(value) ? (value as unknown[]) : []) {
-    if (!Array.isArray(node) || typeof node[0] !== 'string') continue;
+  if (!Array.isArray(value)) throw malformedNode(name, value);
+  for (const node of value as unknown[]) {
+    if (!Array.isArray(node) || typeof node[0] !== 'string') throw malformedNode(name, node);
+    const rawAttrs: unknown = node[1] ?? {};
+    if (!isAttrs(rawAttrs)) throw malformedNode(name, node);
     const attrs: Record<string, string> = {};
-    for (const [key, item] of Object.entries((node[1] ?? {}) as Record<string, unknown>)) {
+    for (const [key, item] of Object.entries(rawAttrs)) {
       // Upstream keys an element for its diff tooling; it is not an SVG attribute.
       if (key === 'key') continue;
       const text = String(item);
@@ -82,8 +118,8 @@ function toGlyph(name: string, value: unknown): IconGlyph {
       // no legitimate Lucide artwork.
       if (!SAFE_ATTR_VALUE.test(text)) {
         throw invalidIconDataError(
-          `for the icon "${name}" carries ${renderCauseValue(text)} as "${key}", which is not glyph geometry; lucide-static@${LUCIDE_VERSION} is the pin that published it, so a re-run against the same pin repeats this`,
-          'bun run --filter @ultimat3/ui icons   # after raising LUCIDE_VERSION in packages/ui/src/icons/build-icons.ts',
+          `for the icon "${name}" carries ${renderCauseValue(text)} as "${key}", which is not glyph geometry; ${PIN_REPEATS}`,
+          'bun run --filter @ultimat3/ui icons --bump',
         );
       }
       attrs[key] = text;
@@ -95,8 +131,8 @@ function toGlyph(name: string, value: unknown): IconGlyph {
   iconElements(glyph);
   if (glyph.length === 0) {
     throw invalidIconDataError(
-      `for the icon "${name}" carries no renderable node data; lucide-static@${LUCIDE_VERSION} is the pin that published it, so a re-run against the same pin repeats this`,
-      'bun run --filter @ultimat3/ui icons   # after raising LUCIDE_VERSION in packages/ui/src/icons/build-icons.ts',
+      `for the icon "${name}" carries no renderable node data; ${PIN_REPEATS}`,
+      'bun run --filter @ultimat3/ui icons --bump',
     );
   }
   return glyph;
@@ -131,28 +167,38 @@ export function moduleSource(name: string, glyph: IconGlyph): string {
   ].join('\n');
 }
 
+/** The repo's own `node_modules/.bin`, where `bun install` links every tool binary. */
+const REPO_BIN = Bun.fileURLToPath(new URL('../../../../node_modules/.bin', import.meta.url));
+
+/**
+ * The biome executable in `binDir`, or `undefined`. Asked of `Bun.which` rather than spelled as
+ * `<bin>/biome`: on Windows the link is `biome.exe`, and a path with no extension is ENOENT there.
+ */
+export function biomeBinary(binDir: string = REPO_BIN): string | undefined {
+  return Bun.which('biome', { PATH: binDir }) ?? undefined;
+}
+
 /** Biome owns formatting in this repo, generated files included — so the generator asks it rather
  * than imitating it, and a regenerated set never shows up as a lint diff. */
 async function format(): Promise<void> {
-  const biome = new URL('../../../../node_modules/.bin/biome', import.meta.url).pathname;
-  if (!(await Bun.file(biome).exists())) {
-    throw runtimeMissingError('the biome binary', 'bun install, then re-run this generator');
-  }
-  const result = Bun.spawnSync([biome, 'format', '--write', GLYPHS_DIR]);
+  const biome = biomeBinary();
+  if (biome === undefined) throw runtimeMissingError('the biome binary', 'bun install');
+  // A formatter over one directory of generated files; a wedged one is the refusal below.
+  const result = Bun.spawnSync([biome, 'format', '--write', GLYPHS_DIR], { timeout: 60_000 });
   if (result.exitCode !== 0) {
     throw runtimeMissingError(
       'a successful `biome format` over the generated glyphs',
-      `run: ${biome} format --write ${GLYPHS_DIR}`,
+      'bunx biome format --write packages/ui/src/icons/glyphs',
     );
   }
 }
 
-export async function buildIcons(): Promise<number> {
-  const response = await fetch(LUCIDE_ICON_NODES_URL);
+export async function buildIcons(version: string = LUCIDE_VERSION): Promise<number> {
+  const response = await fetch(iconNodesUrl(version));
   if (!response.ok) {
     throw runtimeMissingError(
-      `lucide-static@${LUCIDE_VERSION} icon data (HTTP ${response.status})`,
-      `check network access to ${LUCIDE_ICON_NODES_URL}, then re-run: bun run --filter @ultimat3/ui icons`,
+      `lucide-static@${version} icon data (HTTP ${response.status} from ${iconNodesUrl(version)})`,
+      'bun run --filter @ultimat3/ui icons',
     );
   }
   const glyphs = parseIconNodes(await response.text());
@@ -165,8 +211,47 @@ export async function buildIcons(): Promise<number> {
   return glyphs.size;
 }
 
+/** A plain `major.minor.patch` — the only shape allowed into a TypeScript string literal here. */
+const SEMVER = /^\d+\.\d+\.\d+$/;
+
+/** `source` with its `LUCIDE_VERSION` line moved to `version`. Pure; refuses rather than guesses. */
+export function withPin(source: string, version: string): string {
+  if (!SEMVER.test(version)) {
+    throw invalidIconDataError(
+      `answered ${renderCauseValue(version)} as the latest lucide-static version, which is not plain semver; ${LUCIDE_LATEST_URL} served something else`,
+      'bun run --filter @ultimat3/ui icons --bump',
+    );
+  }
+  const pin = /^export const LUCIDE_VERSION = '[^']*';$/m;
+  if (!pin.test(source)) {
+    throw invalidIconDataError(
+      'has no `export const LUCIDE_VERSION = …` line in packages/ui/src/icons/build-icons.ts to move',
+      'git checkout -- packages/ui/src/icons/build-icons.ts',
+    );
+  }
+  return source.replace(pin, `export const LUCIDE_VERSION = '${version}';`);
+}
+
+/** Moves the pin to the registry's latest release, in this very file, and answers the version. */
+async function bumpPin(): Promise<string> {
+  const response = await fetch(LUCIDE_LATEST_URL);
+  if (!response.ok) {
+    throw runtimeMissingError(
+      `the latest lucide-static version (HTTP ${response.status} from ${LUCIDE_LATEST_URL})`,
+      'bun run --filter @ultimat3/ui icons --bump',
+    );
+  }
+  const body: unknown = await response.json();
+  const version =
+    typeof body === 'object' && body !== null && 'version' in body ? String(body.version) : '';
+  const file = import.meta.path;
+  await Bun.write(file, withPin(await Bun.file(file).text(), version));
+  return version;
+}
+
 if (import.meta.main) {
-  const count = await buildIcons();
-  const json = { ok: true, icons: count, lucide: LUCIDE_VERSION, dir: GLYPHS_DIR };
+  const version = Bun.argv.includes('--bump') ? await bumpPin() : LUCIDE_VERSION;
+  const count = await buildIcons(version);
+  const json = { ok: true, icons: count, lucide: version, dir: GLYPHS_DIR };
   console.log(Bun.argv.includes('--json') ? JSON.stringify(json) : `${count} icon modules written`);
 }

package/src/index.ts

@@ -22,13 +22,13 @@ export type {
 export {
   announce,
   ariaBool,
-  createFocusTrap,
-  createRovingTabindex,
   FOCUSABLE_SELECTOR,
   focusableWithin,
+  focusTrap,
   LIVE_REGION_LEVELS,
   liveRegionAttrs,
-  resetIdCounter,
+  resetUseIdCounter,
+  rovingTabindex,
   useId,
 } from './a11y';
 export type { AccordionItem, AccordionProps } from './components/Accordion';
@@ -70,6 +70,8 @@ export type { BarRect, ChartPoint } from './components/bar-chart-view';
 export { barRects } from './components/bar-chart-view';
 export type { CardProps, Elevation } from './components/Card';
 export { Card } from './components/Card';
+export type { ChartFrameProps, ChartLegendItem } from './components/ChartFrame';
+export { ChartFrame } from './components/ChartFrame';
 export type { CheckboxProps } from './components/Checkbox';
 export { Checkbox } from './components/Checkbox';
 export type { ComboboxProps } from './components/Combobox';
@@ -80,6 +82,17 @@ export type { ContainerProps, ContainerSize } from './components/Container';
 export { Container } from './components/Container';
 export type { CopyButtonProps } from './components/CopyButton';
 export { COPIED_MS, CopyButton } from './components/CopyButton';
+export type {
+  ChartSeries,
+  ChartTable,
+  ChartTableInput,
+  ChartTableRow,
+  MarkerShape,
+  SeriesStyle,
+} from './components/chart-frame-view';
+export { CHART_SERIES_SLOTS, chartTable, seriesStyle } from './components/chart-frame-view';
+export type { NiceScale, NiceTicksOptions } from './components/chart-ticks-view';
+export { niceTicks } from './components/chart-ticks-view';
 export type { ComboboxOption } from './components/combobox-filter';
 export { filterOptions, normalizeQuery } from './components/combobox-filter';
 export type { CommandPaletteItem, PaletteKeyAction } from './components/command-palette-view';
@@ -93,6 +106,7 @@ export type {
   Column,
   DataTableCallbackProps,
   DataTableLinkProps,
+  DataTableNarrow,
   DataTableProps,
 } from './components/DataTable';
 export { DataTable } from './components/DataTable';
@@ -102,10 +116,13 @@ export type { DialogProps } from './components/Dialog';
 export { Dialog } from './components/Dialog';
 export type { DividerProps } from './components/Divider';
 export { Divider } from './components/Divider';
+export type { DonutChartProps, DonutSegment } from './components/DonutChart';
+export { DonutChart } from './components/DonutChart';
 export type { DrawerProps, DrawerSide } from './components/Drawer';
 export { Drawer } from './components/Drawer';
 export type { DropzoneProps } from './components/Dropzone';
 export { Dropzone } from './components/Dropzone';
+export type { ColumnPriority } from './components/data-table-view';
 export type {
   DateStyle,
   DateTimeFormatter,
@@ -133,9 +150,11 @@ export type {
   FileTarget,
 } from './components/file-input-view';
 export {
-  formatBytes,
+  formatFileSize,
   selectFiles,
 } from './components/file-input-view';
+export type { GaugeProps } from './components/Gauge';
+export { Gauge } from './components/Gauge';
 export type { GridProps } from './components/Grid';
 export { Grid } from './components/Grid';
 export type { HeadingLevel, HeadingTag } from './components/heading-level';
@@ -149,6 +168,8 @@ export type { ImageBaseProps, ImageDimensions, ImageProps } from './components/I
 export { Image } from './components/Image';
 export type { InfiniteScrollProps } from './components/InfiniteScroll';
 export { InfiniteScroll } from './components/InfiniteScroll';
+export type { InlineBarProps } from './components/InlineBar';
+export { InlineBar } from './components/InlineBar';
 export type { InputProps, InputType } from './components/Input';
 export { Input } from './components/Input';
 export type { IconElement, IconGlyph, IconTag } from './components/icon-glyph';
@@ -161,10 +182,12 @@ export type {
   ImageSources,
   ImageVariant,
 } from './components/image-source';
-export { boxFor, reservedRatio, sourceSetsFor, srcsetFor } from './components/image-source';
+export { boxFor, reservedRatio, sourceSetsFor, variantSrcset } from './components/image-source';
 export type { LoadMoreInput, LoadMoreState } from './components/infinite-scroll-view';
 export type { KbdProps } from './components/Kbd';
 export { Kbd } from './components/Kbd';
+export type { AreaChartProps, LineChartProps } from './components/LineChart';
+export { AreaChart, LineChart } from './components/LineChart';
 export type { ButtonLinkProps, LinkProps, TextLinkProps } from './components/Link';
 export { Link } from './components/Link';
 export type { LocaleSwitcherProps } from './components/LocaleSwitcher';
@@ -265,7 +288,7 @@ export {
 export type { FieldPathSegment, IssuePathSegment } from './form/field-path';
 export { fieldSelector, formatFieldPath, MAX_FIELD_INDEX, parseFieldPath } from './form/field-path';
 export type { FormBinding, FormBindingOptions } from './form/form-binding';
-export { createFormBinding } from './form/form-binding';
+export { formBinding } from './form/form-binding';
 export type {
   FormIssue,
   FormSchema,
@@ -312,12 +335,9 @@ export {
   useUi,
 } from './theme/context';
 export { INERT_SOLID_RUNTIME } from './theme/inert-runtime';
-export {
-  THEME_INLINE_SCRIPT,
-  themeInlineScriptCspSource,
-  themeInlineScriptHash,
-  themeInlineScriptTag,
-} from './theme/inline-script';
+export type { ThemePreset } from './theme/preset-shape';
+export type { ThemePresetName } from './theme/presets';
+export { THEME_PRESET_NAMES, THEME_PRESETS } from './theme/presets';
 export type { UiProviderProps } from './theme/provider';
 export { UiProvider } from './theme/provider';
 // The slot is its own module so that registering a runtime does not drag `errors.ts` — and with it
@@ -330,6 +350,7 @@ export type { ThemeEnv } from './theme/theme';
 export {
   browserThemeEnv,
   clearTheme,
+  defaultTheme,
   initTheme,
   isTheme,
   osTheme,
@@ -337,8 +358,8 @@ export {
   setTheme,
   storedTheme,
   THEME_ATTRIBUTE,
+  THEME_DEFAULT_ATTRIBUTE,
   THEME_MEDIA_QUERY,
-  THEME_STORAGE_KEY,
   toggleTheme,
   watchOsTheme,
 } from './theme/theme';
@@ -356,8 +377,16 @@ export {
   TOAST_MAX_VISIBLE,
 } from './toast/toast-state';
 export type { ToastEnv, ToastStore } from './toast/toast-store';
-export { browserToastEnv, createToastStore, INERT_TOAST_ENV } from './toast/toast-store';
+export { browserToastEnv, INERT_TOAST_ENV, toastStore } from './toast/toast-store';
 export { useToasts } from './toast/use-toasts';
+export type { ColourVision } from './tokens/colour-vision';
+export {
+  CHART_DISTINCT_MIN,
+  COLOUR_VISIONS,
+  closestChartPair,
+  colourDistance,
+  simulateColourVision,
+} from './tokens/colour-vision';
 export type { Channels } from './tokens/contrast';
 export {
   AA_LARGE,
@@ -369,11 +398,12 @@ export {
 } from './tokens/contrast';
 export type { ContrastPair } from './tokens/contrast-pairs';
 export { CONTRAST_PAIRS } from './tokens/contrast-pairs';
-export type { ColorRole, RadiusName, Theme } from './tokens/tokens';
+export type { ChartRole, ColorRole, RadiusName, ShadowName, Theme } from './tokens/tokens';
 // --- tokens ------------------------------------------------------------------
 export {
   assertColorRole,
   breakpointTokens,
+  CHART_ROLES,
   COLOR_ROLES,
   color,
   colorRgb,
@@ -385,8 +415,10 @@ export {
   fontWeightTokens,
   lineHeightTokens,
   radiusTokens,
+  SHADOW_NAMES,
   shadowTokens,
   spaceTokens,
   strokeTokens,
+  touchTokens,
   zTokens,
 } from './tokens/tokens';

package/src/jsx-probe.ts

@@ -38,10 +38,11 @@ function h(
  *
  * There may be exactly ONE such counter in the framework, and it is this one — `globalThis.React`
  * is a single property, so a second module counting its own depth over it restores in the wrong
- * order. `@ultimat3/admin`'s `inert-jsx.ts` kept a second pair and the two interleaved: admin
- * installs (saving the real binding), ui installs (saving ADMIN's factory), admin restores (both
- * counters at 1 → the real binding is back), ui restores (its counter hits 0 → admin's factory is
- * reinstalled over it). The global ended up holding a harness the run had already torn down.
+ * order. `@ultimat3/admin`'s `inert-jsx-fixture.ts` kept a second pair and the two interleaved:
+ * admin installs (saving the real binding), ui installs (saving ADMIN's factory), admin restores
+ * (both counters at 1 → the real binding is back), ui restores (its counter hits 0 → admin's
+ * factory is reinstalled over it). The global ended up holding a harness the run had already torn
+ * down.
  * `admin` is tier 5 and `ui` is tier 4, so admin imports these rather than declaring them.
  */
 let depth = 0;

package/src/theme/brand-declarations.ts

@@ -0,0 +1,113 @@
+// The validators behind `defineTheme()`: each slot's override checked against its canonical list
+// and value grammar, then rendered as custom-property lines in that list's order — never the
+// caller's — so a brand rendered twice is byte-identical and its CSP hash does not churn.
+
+import { invalidBrandTokenError, unknownTokenError } from '../errors';
+import { parseChannels } from '../tokens/contrast';
+import {
+  COLOR_ROLES,
+  type ColorRole,
+  type RadiusName,
+  radiusTokens,
+  SHADOW_NAMES,
+  type ShadowName,
+} from '../tokens/tokens';
+import { FONT_SLOTS, type FontSlot } from './preset-shape';
+import { isShadowValue, SHADOW_EXPECTED } from './shadow-value';
+
+/** `0` or a number with a CSS length unit. No `calc()`, no `var()` — a scale rung is a value. */
+const LENGTH_PATTERN = /^(0|\d+(\.\d+)?(px|rem|em|ch|%))$/;
+
+/**
+ * Family names, quotes and separators only: everything a `font-family` list legitimately needs.
+ * The separator is a literal SPACE, never `\s`: the HTML parser rewrites a CR or CRLF inside a
+ * `<style>` to LF before the browser hashes it, so a stack carrying one served bytes whose sha256
+ * no longer matched the CSP hash computed here, and the brand's whole stylesheet was blocked.
+ */
+const FONT_STACK_PATTERN = /^[\w ,'"-]{1,200}$/;
+
+const LENGTH_EXPECTED = 'a bare CSS length such as "0.5rem", "4px" or "0"';
+const STACK_EXPECTED = 'a font-family list such as "Inter, system-ui, sans-serif"';
+const CHANNELS_EXPECTED = 'space-separated RGB channels such as "31 110 178"';
+
+function assertKnown(
+  kind: string,
+  overrides: object,
+  known: readonly string[],
+  source?: string,
+): void {
+  for (const name of Object.keys(overrides)) {
+    if (!known.includes(name)) throw unknownTokenError(kind, name, known, source);
+  }
+}
+
+export function colorDeclarations(
+  overrides: Partial<Record<ColorRole, string>> | undefined,
+  scope: string,
+): string[] {
+  if (overrides === undefined) return [];
+  assertKnown('color', overrides, COLOR_ROLES);
+  const out: string[] = [];
+  for (const role of COLOR_ROLES) {
+    const value = overrides[role];
+    if (value === undefined) continue;
+    try {
+      parseChannels(value);
+    } catch {
+      throw invalidBrandTokenError(scope, role, value, CHANNELS_EXPECTED);
+    }
+    out.push(`--color-${role}: ${value};`);
+  }
+  return out;
+}
+
+export function shadowDeclarations(
+  overrides: Partial<Record<ShadowName, string>> | undefined,
+  scope: string,
+): string[] {
+  if (overrides === undefined) return [];
+  assertKnown('shadow', overrides, SHADOW_NAMES, '_shadow.scss');
+  const out: string[] = [];
+  for (const name of SHADOW_NAMES) {
+    const value = overrides[name];
+    if (value === undefined) continue;
+    if (!isShadowValue(value)) throw invalidBrandTokenError(scope, name, value, SHADOW_EXPECTED);
+    out.push(`--shadow-${name}: ${value};`);
+  }
+  return out;
+}
+
+export function radiusDeclarations(
+  overrides: Partial<Record<RadiusName, string>> | undefined,
+): string[] {
+  if (overrides === undefined) return [];
+  const known = Object.keys(radiusTokens) as RadiusName[];
+  assertKnown('radius', overrides, known, '_radius.scss');
+  const out: string[] = [];
+  for (const name of known) {
+    const value = overrides[name];
+    if (value === undefined) continue;
+    if (!LENGTH_PATTERN.test(value)) {
+      throw invalidBrandTokenError('radius', name, value, LENGTH_EXPECTED);
+    }
+    out.push(`--radius-${name}: ${value};`);
+  }
+  return out;
+}
+
+export function fontDeclarations(
+  overrides: Partial<Record<FontSlot, string>> | undefined,
+): string[] {
+  if (overrides === undefined) return [];
+  assertKnown('font', overrides, FONT_SLOTS, '_typography.scss');
+  const out: string[] = [];
+  for (const slot of FONT_SLOTS) {
+    const value = overrides[slot];
+    if (value === undefined) continue;
+    if (!FONT_STACK_PATTERN.test(value)) {
+      throw invalidBrandTokenError('font', slot, value, STACK_EXPECTED);
+    }
+    out.push(`--font-${slot}: ${value};`);
+  }
+  return out;
+}