@oxyhq/bloom 1.0.0 → 1.0.2

package/src/theme/color-presets.ts

@@ -1,177 +1,504 @@
 import type { SchemeVariant } from './color-engine';
 
-export type AppColorName =
-  | 'teal'
-  | 'blue'
-  | 'green'
-  | 'yellow'
-  | 'red'
-  | 'purple'
-  | 'pink'
-  | 'sky'
-  | 'orange'
-  | 'mint'
-  | 'oxy'
-  | 'faircoin'
-  | 'pumpkin'
-  | 'gray'
-  | 'brown'
-  | 'peach'
-  | 'rose'
-  | 'mono';
-
-/**
- * A single colour preset: a brand SEED colour plus the tonal scheme variant to
- * derive its full role set with.
- *
- * Every preset's palette is now GENERATED by Bloom's dependency-free colour
- * engine (`color-engine/`) from this seed — no hand-authored HSL triples. The
- * engine's `generateRoleColors({ seed, variant, isDark })` yields the full
- * Material-3 role set for light and dark; `getPresetVars` (in `preset-vars.ts`)
- * maps those roles onto Bloom's canonical token names. A user-picked colour
- * flows through the identical path — a preset is just a fixed seed.
- */
-/**
- * Why a preset is not offered to every user. Absent means it is.
- *
- * The two are NOT interchangeable and must not collapse back into one list: a
- * `handle` preset belongs to a specific account and cannot be bought, while a
- * `premium` one is exactly what is bought. Conflating them is how the picker
- * came to offer both of Oxy's reserved brand colours to everybody.
- */
+/** Why a preset is not offered to every user. Absent means it is free. */
 export type ColorPresetGate =
   /** Reserved for the account whose brand it is — not purchasable. */
   | 'handle'
   /** Sold with a subscription. */
   | 'premium';
 
-export interface AppColorPreset {
-  name: AppColorName;
-  /** The brand seed colour, `#rrggbb`. Also the value the colour picker matches. */
+/** Stable picker/playground categories, ordered from specific to general. */
+const COLOR_PRESET_FAMILY_SOURCES = [
+  { name: 'brand', displayName: 'Brand', description: 'Reserved ecosystem identities.' },
+  { name: 'botanical', displayName: 'Botanical', description: 'Greens, jade and living hues.' },
+  { name: 'ocean', displayName: 'Ocean', description: 'Blue, cyan and aquatic identities.' },
+  { name: 'sunset', displayName: 'Sunset', description: 'Red, orange and golden identities.' },
+  { name: 'earth', displayName: 'Earth', description: 'Warm mineral and grounded identities.' },
+  { name: 'jewel', displayName: 'Jewel', description: 'Purple, rose and saturated gem hues.' },
+  { name: 'neutral', displayName: 'Neutral', description: 'Slate, graphite and monochrome.' },
+] as const;
+
+export type ColorPresetFamily = (typeof COLOR_PRESET_FAMILY_SOURCES)[number]['name'];
+
+export interface ColorPresetFamilyDefinition {
+  name: ColorPresetFamily;
+  displayName: string;
+  description: string;
+}
+
+export const COLOR_PRESET_FAMILY_REGISTRY: readonly ColorPresetFamilyDefinition[] =
+  COLOR_PRESET_FAMILY_SOURCES;
+
+export const COLOR_PRESET_FAMILIES: readonly ColorPresetFamily[] =
+  COLOR_PRESET_FAMILY_REGISTRY.map(({ name }) => name);
+export type ColorPresetPairing = 'derived' | 'curated';
+
+interface ColorPresetSource {
+  name: string;
+  /** Human-readable label; consumers must not rebuild one from the identifier. */
+  displayName: string;
+  family: ColorPresetFamily;
+  description: string;
+  /** The identity seed, `#rrggbb`. */
   hex: string;
-  /** The tonal scheme variant the engine derives roles with. */
   variant: SchemeVariant;
-  /**
-   * Optional explicit secondary-accent seed, `#rrggbb`. When set, the secondary
-   * palette is PINNED to this brand colour (hue + chroma preserved; M3 role tones
-   * still apply) instead of the derived hue-rotation of {@link AppColorPreset.hex}.
-   * Bloom's built-in presets do NOT set this, so their generated output is
-   * unchanged; a consumer brand with a distinct accent (blue primary + yellow
-   * secondary) sets it to pin its real accent family.
-   */
   secondaryHex?: string;
-  /**
-   * Optional explicit tertiary-accent seed, `#rrggbb`. Same semantics as
-   * {@link AppColorPreset.secondaryHex} for the tertiary palette.
-   */
+  /** The standout action seed. `tertiary` owns FABs and compose actions. */
   tertiaryHex?: string;
-  /**
-   * Force the fill to a tone a WHITE label fits, in BOTH modes — overriding the
-   * budget that otherwise lets an already-light seed keep its own tone in dark
-   * and take a black label.
-   *
-   * It has to be declared, because it cannot be derived: `yellow` (seed tone 86)
-   * wants to come down to a deep gold with white on it, and `faircoin` (tone 90)
-   * wants to stay a bright lime with black on it. Two seeds four tones apart,
-   * opposite answers — nothing in the hex distinguishes them, only what the brand
-   * is for.
-   */
+  pairing: ColorPresetPairing;
+  /** Included in Bloom's permanent Mention-shaped colour playground. */
+  featured?: boolean;
+  /** Force a white primary label even when preserving the seed would choose black. */
   label?: 'white';
-  /**
-   * Who may pick this preset. Absent = everyone. Bloom only DECLARES the gate;
-   * whether a given viewer satisfies it is the consuming app's question, since
-   * only the app knows who is signed in and what they pay for.
-   */
   gate?: ColorPresetGate;
 }
 
 /**
- * Historically each preset carried a full light/dark map of raw HSL triples.
- * That map is gone — the engine derives every role from {@link AppColorPreset.hex}.
- * The type alias is retained for the public `PresetTokens` export shape (the
- * resolved `--token -> value` record that `getPresetVars` produces).
+ * The ONE authored preset source.
+ *
+ * Everything public below — the name union, ordered registry, lookup record,
+ * hex lookup, gate lists, family groups and playground list — is derived from
+ * this tuple. A preset is a seed recipe, never a frozen light/dark token table;
+ * Bloom's colour policy resolves both modes at runtime.
  */
-export type PresetTokens = Record<string, string>;
+const COLOR_PRESET_SOURCES = [
+  {
+    name: 'teal',
+    displayName: 'Teal',
+    family: 'ocean',
+    description: 'Deep teal identity with dynamically derived split-complementary accents.',
+    hex: '#005c67',
+    variant: 'vivid',
+    pairing: 'derived',
+  },
+  {
+    name: 'blue',
+    displayName: 'Blue',
+    family: 'ocean',
+    description: 'Clear social blue with vivid generated supporting colours.',
+    hex: '#1d9bf0',
+    variant: 'vivid',
+    pairing: 'derived',
+  },
+  {
+    name: 'green',
+    displayName: 'Green',
+    family: 'botanical',
+    description: 'Fresh green identity with dynamically generated contrast accents.',
+    hex: '#10b981',
+    variant: 'vivid',
+    pairing: 'derived',
+  },
+  {
+    name: 'yellow',
+    displayName: 'Yellow',
+    family: 'sunset',
+    description: 'A signal-yellow identity deliberately brought deep enough for a white label.',
+    hex: '#ffd400',
+    variant: 'vivid',
+    pairing: 'derived',
+    label: 'white',
+  },
+  {
+    name: 'red',
+    displayName: 'Red',
+    family: 'sunset',
+    description: 'Direct red identity with contrasting generated accent arms.',
+    hex: '#ef4444',
+    variant: 'vivid',
+    pairing: 'derived',
+  },
+  {
+    name: 'purple',
+    displayName: 'Purple',
+    family: 'jewel',
+    description: 'Bright purple identity with dynamically derived action colours.',
+    hex: '#b866ff',
+    variant: 'vivid',
+    pairing: 'derived',
+  },
+  {
+    name: 'pink',
+    displayName: 'Pink',
+    family: 'jewel',
+    description: 'Hot pink identity with a vivid generated complement.',
+    hex: '#f91880',
+    variant: 'vivid',
+    pairing: 'derived',
+  },
+  {
+    name: 'sky',
+    displayName: 'Sky',
+    family: 'ocean',
+    description: 'Open sky blue with dynamically generated supporting accents.',
+    hex: '#03a9f4',
+    variant: 'vivid',
+    pairing: 'derived',
+  },
+  {
+    name: 'orange',
+    displayName: 'Orange',
+    family: 'sunset',
+    description: 'A gamut-aware orange that stays orange at white-label fill tones.',
+    hex: '#ff7a00',
+    variant: 'vivid',
+    pairing: 'derived',
+  },
+  {
+    name: 'mint',
+    displayName: 'Mint',
+    family: 'botanical',
+    description: 'Cool mint identity with vivid generated supporting hues.',
+    hex: '#14b8a6',
+    variant: 'vivid',
+    pairing: 'derived',
+  },
+  {
+    name: 'oxy',
+    displayName: 'Oxy',
+    family: 'brand',
+    description: 'Oxy purple, reserved for the Oxy account identity.',
+    hex: '#c46ede',
+    variant: 'vivid',
+    pairing: 'derived',
+    gate: 'handle',
+  },
+  {
+    name: 'faircoin',
+    displayName: 'FairCoin',
+    family: 'brand',
+    description: 'FairCoin lime, reserved for the FairCoin account identity.',
+    hex: '#9ffb50',
+    variant: 'vivid',
+    pairing: 'derived',
+    gate: 'handle',
+  },
+  {
+    name: 'pumpkin',
+    displayName: 'Pumpkin',
+    family: 'sunset',
+    description: 'Golden pumpkin orange with a generated split complement.',
+    hex: '#ff9800',
+    variant: 'vivid',
+    pairing: 'derived',
+  },
+  {
+    name: 'gray',
+    displayName: 'Slate',
+    family: 'neutral',
+    description: 'Cool slate identity with restrained chroma and generated accents.',
+    hex: '#607d8b',
+    variant: 'vivid',
+    pairing: 'derived',
+  },
+  {
+    name: 'brown',
+    displayName: 'Brown',
+    family: 'earth',
+    description: 'Deep earthen brown with a contrasting generated action colour.',
+    hex: '#813519',
+    variant: 'vivid',
+    pairing: 'derived',
+  },
+  {
+    name: 'peach',
+    displayName: 'Peach',
+    family: 'earth',
+    description: 'Warm peach identity with dynamically derived contrast accents.',
+    hex: '#ffb28d',
+    variant: 'vivid',
+    pairing: 'derived',
+  },
+  {
+    name: 'rose',
+    displayName: 'Rose',
+    family: 'jewel',
+    description: 'Light rose identity with generated vivid supporting hues.',
+    hex: '#fcaffe',
+    variant: 'vivid',
+    pairing: 'derived',
+  },
+  {
+    name: 'mono',
+    displayName: 'Monochrome',
+    family: 'neutral',
+    description: 'Colourless identity and surfaces, derived as a true greyscale theme.',
+    hex: '#000000',
+    variant: 'monochrome',
+    pairing: 'derived',
+    gate: 'premium',
+  },
+  {
+    name: 'grove',
+    displayName: 'Grove + Marigold',
+    family: 'botanical',
+    description: 'Green identity with warm marigold reserved for the action that must win.',
+    hex: '#087a3e',
+    tertiaryHex: '#ffb000',
+    variant: 'vivid',
+    pairing: 'curated',
+    featured: true,
+  },
+  {
+    name: 'ember',
+    displayName: 'Terracotta + Saffron',
+    family: 'earth',
+    description: 'Terracotta identity with a high-energy saffron action.',
+    hex: '#b52f0c',
+    tertiaryHex: '#ffb000',
+    variant: 'vivid',
+    pairing: 'curated',
+    featured: true,
+  },
+  {
+    name: 'merlot',
+    displayName: 'Oxblood + Coral',
+    family: 'jewel',
+    description: 'Deep wine identity with coral action, expressive without reading destructive.',
+    hex: '#a5003c',
+    tertiaryHex: '#ff542e',
+    variant: 'vivid',
+    pairing: 'curated',
+    featured: true,
+  },
+  {
+    name: 'cobalt',
+    displayName: 'Cobalt + Signal Yellow',
+    family: 'ocean',
+    description: 'Cobalt structure cut by a saturated signal-yellow action.',
+    hex: '#154fd7',
+    tertiaryHex: '#ffd000',
+    variant: 'vivid',
+    pairing: 'curated',
+    featured: true,
+  },
+  {
+    name: 'jade',
+    displayName: 'Jade + Tangerine',
+    family: 'botanical',
+    description: 'Clean jade identity with a direct tangerine action.',
+    hex: '#007a4b',
+    tertiaryHex: '#ff5e00',
+    variant: 'vivid',
+    pairing: 'curated',
+    featured: true,
+  },
+  {
+    name: 'pine',
+    displayName: 'Pine + Rose',
+    family: 'botanical',
+    description: 'Sober pine identity with a vivid rose action.',
+    hex: '#135c2d',
+    tertiaryHex: '#f0005a',
+    variant: 'vivid',
+    pairing: 'curated',
+    featured: true,
+  },
+  {
+    name: 'olive',
+    displayName: 'Olive + Lilac',
+    family: 'earth',
+    description: 'Editorial olive identity with an unexpected clear lilac action.',
+    hex: '#5f6400',
+    tertiaryHex: '#7c25e8',
+    variant: 'vivid',
+    pairing: 'curated',
+    featured: true,
+  },
+  {
+    name: 'lagoon',
+    displayName: 'Teal + Coral',
+    family: 'ocean',
+    description: 'Aquatic teal identity with a warm coral action.',
+    hex: '#00706d',
+    tertiaryHex: '#ff4935',
+    variant: 'vivid',
+    pairing: 'curated',
+    featured: true,
+  },
+  {
+    name: 'navy',
+    displayName: 'Navy + Apricot',
+    family: 'ocean',
+    description: 'Serious navy identity softened by a human apricot action.',
+    hex: '#0b2c72',
+    tertiaryHex: '#ff6b20',
+    variant: 'vivid',
+    pairing: 'curated',
+    featured: true,
+  },
+  {
+    name: 'azure',
+    displayName: 'Sky + Vermilion',
+    family: 'ocean',
+    description: 'Airy sky identity with a decisive vermilion action.',
+    hex: '#006a94',
+    tertiaryHex: '#e82e12',
+    variant: 'vivid',
+    pairing: 'curated',
+    featured: true,
+  },
+  {
+    name: 'violet',
+    displayName: 'Violet + Lime',
+    family: 'jewel',
+    description: 'Deep violet identity with an electric lime action.',
+    hex: '#7227c4',
+    tertiaryHex: '#78c900',
+    variant: 'vivid',
+    pairing: 'curated',
+    featured: true,
+  },
+  {
+    name: 'lavender',
+    displayName: 'Lavender + Brass',
+    family: 'jewel',
+    description: 'Calm lavender identity with a warmer, more editorial brass action.',
+    hex: '#5c3db5',
+    tertiaryHex: '#d98900',
+    variant: 'vivid',
+    pairing: 'curated',
+    featured: true,
+  },
+  {
+    name: 'plum',
+    displayName: 'Plum + Aqua',
+    family: 'jewel',
+    description: 'Nocturnal plum identity with a bright aqua action.',
+    hex: '#8d075f',
+    tertiaryHex: '#00aeb8',
+    variant: 'vivid',
+    pairing: 'curated',
+    featured: true,
+  },
+  {
+    name: 'cherry',
+    displayName: 'Cherry + Powder Blue',
+    family: 'jewel',
+    description: 'Cherry identity with a cool powder-blue counterpoint.',
+    hex: '#b00038',
+    tertiaryHex: '#2979e8',
+    variant: 'vivid',
+    pairing: 'curated',
+    featured: true,
+  },
+  {
+    name: 'chocolate',
+    displayName: 'Chocolate + Cyan',
+    family: 'earth',
+    description: 'Material chocolate identity with a crisp technological cyan action.',
+    hex: '#7a2a00',
+    tertiaryHex: '#00aabe',
+    variant: 'vivid',
+    pairing: 'curated',
+    featured: true,
+  },
+  {
+    name: 'graphite',
+    displayName: 'Graphite + Acid',
+    family: 'neutral',
+    description: 'Near-neutral identity that gives the stage to an acid-green action.',
+    hex: '#272b28',
+    tertiaryHex: '#78c900',
+    variant: 'vivid',
+    pairing: 'curated',
+    featured: true,
+  },
+] as const satisfies readonly ColorPresetSource[];
 
-export const APP_COLOR_NAMES: readonly AppColorName[] = ['teal', 'blue', 'green', 'yellow', 'red', 'purple', 'pink', 'sky', 'orange', 'mint', 'oxy', 'faircoin', 'pumpkin', 'gray', 'brown', 'peach', 'rose', 'mono'];
-
-export const HEX_TO_APP_COLOR: Record<string, AppColorName> = {
-  '#005c67': 'teal',
-  '#1d9bf0': 'blue',
-  '#10b981': 'green',
-  '#ffd400': 'yellow',
-  '#ef4444': 'red',
-  '#b866ff': 'purple',
-  '#f91880': 'pink',
-  '#03a9f4': 'sky',
-  '#ff7a00': 'orange',
-  '#14b8a6': 'mint',
-  '#c46ede': 'oxy',
-  '#9ffb50': 'faircoin',
-  '#ff9800': 'pumpkin',
-  '#607d8b': 'gray',
-  '#813519': 'brown',
-  '#ffb28d': 'peach',
-  '#fcaffe': 'rose',
-  '#000000': 'mono',
-};
+/** Preset identifiers are inferred from the authored registry, never repeated. */
+export type AppColorName = (typeof COLOR_PRESET_SOURCES)[number]['name'];
+
+/**
+ * Backwards-compatible named-preset contract. Rich picker metadata lives on
+ * {@link ColorPresetRecipe} so existing consumers constructing this type do not
+ * acquire new required fields in a patch release.
+ */
+export interface AppColorPreset {
+  name: AppColorName;
+  hex: string;
+  variant: SchemeVariant;
+  secondaryHex?: string;
+  tertiaryHex?: string;
+  label?: 'white';
+  gate?: ColorPresetGate;
+}
+
+/** Enriched registry entry for a picker or colour playground. */
+export interface ColorPresetRecipe extends AppColorPreset {
+  displayName: string;
+  family: ColorPresetFamily;
+  description: string;
+  pairing: ColorPresetPairing;
+  featured: boolean;
+}
+
+/** Stable ordered entries for pickers, filters and the Storybook playground. */
+export const COLOR_PRESET_REGISTRY: readonly ColorPresetRecipe[] = COLOR_PRESET_SOURCES.map(
+  (source) => ({ featured: false, ...source }),
+);
+
+export const APP_COLOR_NAMES: readonly AppColorName[] = COLOR_PRESET_REGISTRY.map(
+  ({ name }) => name,
+);
+
+export const APP_COLOR_PRESETS: Record<AppColorName, AppColorPreset> =
+  COLOR_PRESET_REGISTRY.reduce<Record<AppColorName, AppColorPreset>>((presets, preset) => {
+    // Preserve the historical runtime shape as well as its TypeScript type.
+    // Picker metadata belongs to COLOR_PRESET_REGISTRY; adding it invisibly to
+    // this older record would change Object.keys()/serialization in consumers.
+    presets[preset.name] = {
+      name: preset.name,
+      hex: preset.hex,
+      variant: preset.variant,
+      ...(preset.secondaryHex !== undefined ? { secondaryHex: preset.secondaryHex } : {}),
+      ...(preset.tertiaryHex !== undefined ? { tertiaryHex: preset.tertiaryHex } : {}),
+      ...(preset.label !== undefined ? { label: preset.label } : {}),
+      ...(preset.gate !== undefined ? { gate: preset.gate } : {}),
+    };
+    return presets;
+  }, {} as Record<AppColorName, AppColorPreset>);
+
+export const HEX_TO_APP_COLOR: Record<string, AppColorName> =
+  COLOR_PRESET_REGISTRY.reduce<Record<string, AppColorName>>((names, preset) => {
+    names[preset.hex.toLowerCase()] = preset.name;
+    return names;
+  }, {});
 
 export function hexToAppColorName(hex: string): AppColorName {
   return HEX_TO_APP_COLOR[hex.toLowerCase()] ?? 'teal';
 }
 
-/**
- * The 13 named presets, each a brand seed + scheme variant. The engine derives
- * the full role set (light + dark) from the seed. Seeds are the brand hex of
- * each preset; `oxy` reads most faithfully as `vibrant`, everything else keeps a
- * bold `vibrant` derivation to match the prior saturated palette.
- */
-export const APP_COLOR_PRESETS: Record<AppColorName, AppColorPreset> = {
-  teal: { name: 'teal', hex: '#005c67', variant: 'vivid' },
-  blue: { name: 'blue', hex: '#1d9bf0', variant: 'vivid' },
-  green: { name: 'green', hex: '#10b981', variant: 'vivid' },
-  yellow: { name: 'yellow', hex: '#ffd400', variant: 'vivid', label: 'white' },
-  red: { name: 'red', hex: '#ef4444', variant: 'vivid' },
-  purple: { name: 'purple', hex: '#b866ff', variant: 'vivid' },
-  pink: { name: 'pink', hex: '#f91880', variant: 'vivid' },
-  sky: { name: 'sky', hex: '#03a9f4', variant: 'vivid' },
-  // Deliberately NOT Tailwind's orange-500 (`#f97316`). That seed sits at HCT hue
-  // 46, which reads as orange only because it is also light: at hue 46 the sRGB
-  // gamut allows a chroma of just 62 at the tones a white label needs (<= 49), so
-  // the brand fill resolved to `rgb(177 76 0)` — a brown. Hue 34 carries a chroma
-  // of 84 at that same tone, with the same white label and the same contrast
-  // headroom, so the fill reads as orange instead of paying for the hue twice.
-  orange: { name: 'orange', hex: '#ff7a00', variant: 'vivid' },
-  mint: { name: 'mint', hex: '#14b8a6', variant: 'vivid' },
-  oxy: { name: 'oxy', hex: '#c46ede', variant: 'vivid', gate: 'handle' },
-  faircoin: { name: 'faircoin', hex: '#9ffb50', variant: 'vivid', gate: 'handle' },
-  pumpkin: { name: 'pumpkin', hex: '#ff9800', variant: 'vivid' },
-  gray: { name: 'gray', hex: '#607d8b', variant: 'vivid' },
-  brown: { name: 'brown', hex: '#813519', variant: 'vivid' },
-  peach: { name: 'peach', hex: '#ffb28d', variant: 'vivid' },
-  rose: { name: 'rose', hex: '#fcaffe', variant: 'vivid' },
-  /**
-   * No colour at all — the black-and-white theme. Its seed carries zero chroma,
-   * which is the whole mechanism: the policy derives a greyscale palette from any
-   * seed with none, so a user who picks a grey in the colour wheel lands here too
-   * rather than on a nearly-grey approximation.
-   */
-  mono: { name: 'mono', hex: '#000000', variant: 'monochrome', gate: 'premium' },
-};
+/** The sixteen approved paired directions in the permanent Mention playground. */
+export const COLOR_PLAYGROUND_NAMES: readonly AppColorName[] = COLOR_PRESET_REGISTRY
+  .filter(({ featured }) => featured)
+  .map(({ name }) => name);
+
+export interface ColorPresetGroup extends ColorPresetFamilyDefinition {
+  presets: readonly ColorPresetRecipe[];
+}
+
+/** Ordered family metadata and entries for consumer pickers. */
+export const COLOR_PRESET_GROUPS: Readonly<Record<ColorPresetFamily, ColorPresetGroup>> =
+  COLOR_PRESET_FAMILY_REGISTRY.reduce<Record<ColorPresetFamily, ColorPresetGroup>>(
+    (groups, family) => {
+      groups[family.name] = {
+        ...family,
+        presets: COLOR_PRESET_REGISTRY.filter((preset) => preset.family === family.name),
+      };
+      return groups;
+    },
+    {} as Record<ColorPresetFamily, ColorPresetGroup>,
+  );
 
 /**
- * The three gate groups, DERIVED from the presets rather than listed again, so a
- * preset cannot be gated in one place and offered in another. Together they
- * partition {@link APP_COLOR_NAMES} exactly — asserted in
- * `__tests__/color-preset-gates.test.ts`, since a preset silently missing from
- * every group would simply vanish from a picker with no error anywhere.
- *
- * A consumer builds its visible list from these; it must NOT start from
- * `APP_COLOR_NAMES` and add the unlocked ones, which yields the gated presets to
- * everybody and duplicates whatever the viewer did unlock.
+ * Historically each preset carried a full light/dark map of raw HSL triples.
+ * The engine now derives every role from the registry's seeds.
  */
+export type PresetTokens = Record<string, string>;
+
 const namesGatedBy = (gate: ColorPresetGate | undefined): readonly AppColorName[] =>
-  APP_COLOR_NAMES.filter((name) => APP_COLOR_PRESETS[name].gate === gate);
+  COLOR_PRESET_REGISTRY.filter((preset) => preset.gate === gate).map(({ name }) => name);
 
 /** Available to every user, signed in or not. */
 export const FREE_COLOR_NAMES: readonly AppColorName[] = namesGatedBy(undefined);

package/src/theme/color-scope/seed-scope.ts

@@ -1,6 +1,6 @@
 import { generateRoleColors, type RoleColors, type SchemeVariant } from '../color-engine';
 import { buildPolicyTokens, isColourlessSeed } from '../color-policy';
-import { BORDER_ROLES, FILL_ROLES, TEXT_ROLES } from '../../design-tokens/color-roles';
+import { ACCENT_TEXT_ROLES, BORDER_ROLES, FILL_ROLES, TEXT_ROLES } from '../../design-tokens/color-roles';
 
 /**
  * Every alias `theme.css` declares at `:root` as a reference to a canonical
@@ -19,6 +19,7 @@ import { BORDER_ROLES, FILL_ROLES, TEXT_ROLES } from '../../design-tokens/color-
 const SCOPED_ALIASES: Readonly<Record<string, string>> = {
   ...FILL_ROLES,
   ...TEXT_ROLES,
+  ...ACCENT_TEXT_ROLES,
   ...BORDER_ROLES,
   divider: 'var(--border)',
 };