@miragon/mcp-toolkit-ui 2.5.0 → 2.7.0

package/dist/theme/create-theme.d.ts

@@ -1,28 +1,39 @@
 import type { CSSProperties } from "react";
 /**
- * A curated, brand-relevant subset of the toolkit's CSS-variable theming
- * surface (the full set lives in `packages/ui/src/globals.css`). These are the
- * tokens a white-label client almost always wants to change — the brand colour
- * pair, the surface/accent colours, the border/ring, and the shape/typography
- * knobs — expressed in plain, design-system terms.
+ * The toolkit's theming surface in plain, design-system terms: one optional
+ * field per ROLE variable defined in `packages/ui/src/theme.css` (the role-token
+ * contract, see {@link ROLE_TOKENS}), plus the legacy shadcn knobs it always had.
  *
- * Every field is **optional**: a theme overrides only the tokens it cares about
- * and inherits the rest from the toolkit defaults (`:root` / `.dark`). Colour
- * values are any valid CSS colour string (`oklch(...)`, `#rrggbb`, `hsl(...)`),
- * `radius` is any CSS length (e.g. `"0.5rem"`), and the font fields are CSS
- * `font-family` lists.
+ * The defaults are the Miragon theme — every role points at a vendored
+ * `--cd-*` corporate-design token, in light and in dark. A brand overrides
+ * only the roles it cares about and inherits the rest. Colour values are any
+ * CSS colour string (`#rrggbb`, `oklch(...)`, `color-mix(...)`), lengths any
+ * CSS length, fonts `font-family` lists, durations CSS times.
  *
- * Unlisted CSS variables (`--popover`, `--chart-*`, `--sidebar-*`, …) are
- * intentionally out of scope here: they are part of the theming surface but not
- * the brand essentials, so a client tunes them by hand in CSS when needed. See
- * {@link TOKEN_TO_CSS_VAR} for the exact field → variable mapping.
+ * Roles a component must never take from a host's palette — primary, link,
+ * focus, the status tones and the input border — are brand decisions; a host
+ * maps only the neutral roles (background, card, foreground, border, …).
+ *
+ * Unlisted variables (`--chart-*`, `--sidebar-*`, `--popover-foreground`, …)
+ * stay themeable in CSS. See {@link TOKEN_TO_CSS_VAR} for the exact mapping.
  */
 export interface ThemeTokens {
-    /** Brand colour. Maps to `--primary`. */
+    /** Brand colour: primary button fill, selection. Maps to `--primary`. */
     primary?: string;
     /** Text/icon colour on a `primary` surface. Maps to `--primary-foreground`. */
     primaryForeground?: string;
-    /** Accent colour for subtle highlights. Maps to `--accent`. */
+    /**
+     * Primary button fill on hover. Maps to `--primary-hover`. A theme that sets
+     * `primary` but never `primaryHover` gets `primary` at 90 % (the pre-role
+     * hover) from {@link resolveThemeVars}.
+     */
+    primaryHover?: string;
+    /**
+     * Link and interactive text. Maps to `--link`. A theme that sets `primary`
+     * but never `link` gets links in `primary` (the pre-role link colour).
+     */
+    link?: string;
+    /** Hover/selection highlight surface. Maps to `--accent`. */
     accent?: string;
     /** Text colour on an `accent` surface. Maps to `--accent-foreground`. */
     accentForeground?: string;
@@ -34,40 +45,171 @@ export interface ThemeTokens {
     card?: string;
     /** Text colour on a `card` surface. Maps to `--card-foreground`. */
     cardForeground?: string;
-    /** Border colour for dividers/outlines. Maps to `--border`. */
+    /** Menu, select and dialog surface. Maps to `--popover`. */
+    popover?: string;
+    /** Quiet surface (table heads, skeletons, tab rails). Maps to `--muted`. */
+    muted?: string;
+    /** Secondary text — must keep 4.5:1 on `muted`. Maps to `--muted-foreground`. */
+    mutedForeground?: string;
+    /** Secondary button / badge surface. Maps to `--secondary`. */
+    secondary?: string;
+    /** Decorative dividers and outlines (no contrast claim). Maps to `--border`. */
     border?: string;
-    /** Focus-ring colour. Maps to `--ring`. */
+    /** Input border — must keep 3:1 on its surface. Maps to `--input`. */
+    input?: string;
+    /** Legacy focus-ring colour (shadcn). Maps to `--ring`. */
     ring?: string;
-    /** Base corner radius (a CSS length). Maps to `--radius`. */
+    /**
+     * Focus ring and focused-input border, opaque, 3:1. Maps to `--focus`. A
+     * theme that sets `ring` but never `focus` gets its focus ring in `ring`.
+     */
+    focus?: string;
+    /** Destructive action fill. Maps to `--destructive`. */
+    destructive?: string;
+    /**
+     * Text/icon colour on a `destructive` fill (white by default; keep 4.5:1).
+     * Maps to `--destructive-foreground`.
+     */
+    destructiveForeground?: string;
+    /** Success colour — fill, dot, border, icon (never text on light). Maps to `--success`. */
+    success?: string;
+    /** Success tint surface. Maps to `--success-soft`. */
+    successSoft?: string;
+    /** Text colour of the success tone. Maps to `--success-ink`. */
+    successInk?: string;
+    /** Warning colour — fill, dot, border, icon (never text on light). Maps to `--warning`. */
+    warning?: string;
+    /** Warning tint surface. Maps to `--warning-soft`. */
+    warningSoft?: string;
+    /** Text colour of the warning tone. Maps to `--warning-ink`. */
+    warningInk?: string;
+    /** Danger colour — fill, dot, border, icon. Maps to `--danger`. */
+    danger?: string;
+    /** Danger tint surface. Maps to `--danger-soft`. */
+    dangerSoft?: string;
+    /** Text colour of the danger tone. Maps to `--danger-ink`. */
+    dangerInk?: string;
+    /** Info colour — fill, dot, border, icon. Maps to `--info`. */
+    info?: string;
+    /** Info tint surface. Maps to `--info-soft`. */
+    infoSoft?: string;
+    /** Text colour of the info tone. Maps to `--info-ink`. */
+    infoInk?: string;
+    /**
+     * Base corner radius (the legacy shadcn knob). Drives `rounded-xl` and up;
+     * applied through a theme ({@link ThemeProvider}, {@link resolveThemeVars}
+     * or `toStyle()`) it also derives `radiusSm`/`radiusMd`/`radiusLg` when those
+     * are not set. In plain CSS `--radius` no longer reshapes `rounded-sm/md/lg`:
+     * set `--radius-sm`/`--radius-md`/`--radius-lg` there. Maps to `--radius`.
+     */
     radius?: string;
+    /** Badges and chips. Maps to `--radius-sm` (`rounded-sm`). */
+    radiusSm?: string;
+    /** The standard: buttons, inputs, cards, dialogs. Maps to `--radius-md` (`rounded-md`). */
+    radiusMd?: string;
+    /** Large panels and tiles. Maps to `--radius-lg` (`rounded-lg`). */
+    radiusLg?: string;
+    /** Pills and avatars. Maps to `--radius-pill` (`rounded-pill`). */
+    radiusPill?: string;
+    /** Subtle elevation. Maps to `--shadow-1` (`shadow-1`). */
+    shadow1?: string;
+    /** Cards, hovered primary buttons. Maps to `--shadow-2` (`shadow-2`). */
+    shadow2?: string;
+    /** Popovers and dialogs. Maps to `--shadow-3` (`shadow-3`). */
+    shadow3?: string;
+    /** Dialog/sheet backdrop. Maps to `--scrim` (`bg-scrim`). */
+    scrim?: string;
+    /** Hover-speed transitions. Maps to `--motion-fast` (the default duration). */
+    motionFast?: string;
+    /** Standard transitions. Maps to `--motion-base`. */
+    motionBase?: string;
+    /** Large enter/leave transitions. Maps to `--motion-slow`. */
+    motionSlow?: string;
+    /** Easing curve. Maps to `--ease` (the default timing function). */
+    ease?: string;
     /** Body font-family list. Maps to `--font-sans`. */
     fontSans?: string;
+    /** Code, ids and stack traces. Maps to `--font-mono`. */
+    fontMono?: string;
     /** Heading font-family list. Maps to `--font-heading`. */
     fontHeading?: string;
 }
 /** The CSS custom-property name a {@link ThemeTokens} field resolves to. */
 type CssVarName = `--${string}`;
 /**
- * The single source of truth mapping each curated {@link ThemeTokens} field to
- * its real CSS variable name from `globals.css`. `tokensToVars` walks this map,
- * so adding a field here (and to {@link ThemeTokens}) is all that is needed to
- * extend the public theming surface.
+ * The single source of truth mapping each {@link ThemeTokens} field to its real
+ * CSS variable name in `theme.css`. `tokensToVars` walks this map, so adding a
+ * field here (and to {@link ThemeTokens}) is all that is needed to extend the
+ * public theming surface.
  */
 export declare const TOKEN_TO_CSS_VAR: {
     readonly primary: "--primary";
     readonly primaryForeground: "--primary-foreground";
+    readonly primaryHover: "--primary-hover";
+    readonly link: "--link";
     readonly accent: "--accent";
     readonly accentForeground: "--accent-foreground";
     readonly background: "--background";
     readonly foreground: "--foreground";
     readonly card: "--card";
     readonly cardForeground: "--card-foreground";
+    readonly popover: "--popover";
+    readonly muted: "--muted";
+    readonly mutedForeground: "--muted-foreground";
+    readonly secondary: "--secondary";
     readonly border: "--border";
+    readonly input: "--input";
     readonly ring: "--ring";
+    readonly focus: "--focus";
+    readonly destructive: "--destructive";
+    readonly destructiveForeground: "--destructive-foreground";
+    readonly success: "--success";
+    readonly successSoft: "--success-soft";
+    readonly successInk: "--success-ink";
+    readonly warning: "--warning";
+    readonly warningSoft: "--warning-soft";
+    readonly warningInk: "--warning-ink";
+    readonly danger: "--danger";
+    readonly dangerSoft: "--danger-soft";
+    readonly dangerInk: "--danger-ink";
+    readonly info: "--info";
+    readonly infoSoft: "--info-soft";
+    readonly infoInk: "--info-ink";
     readonly radius: "--radius";
+    readonly radiusSm: "--radius-sm";
+    readonly radiusMd: "--radius-md";
+    readonly radiusLg: "--radius-lg";
+    readonly radiusPill: "--radius-pill";
+    readonly shadow1: "--shadow-1";
+    readonly shadow2: "--shadow-2";
+    readonly shadow3: "--shadow-3";
+    readonly scrim: "--scrim";
+    readonly motionFast: "--motion-fast";
+    readonly motionBase: "--motion-base";
+    readonly motionSlow: "--motion-slow";
+    readonly ease: "--ease";
     readonly fontSans: "--font-sans";
+    readonly fontMono: "--font-mono";
     readonly fontHeading: "--font-heading";
 };
+/**
+ * The role-token contract: every variable the toolkit defines for components
+ * to use (`theme.css`), in light and — for colours — dark. Components in this
+ * package, and in apps built on it, style through these names only, never
+ * through raw colours or Tailwind palette classes.
+ */
+export declare const ROLE_TOKENS: readonly ["--background", "--card", "--popover", "--muted", "--secondary", "--foreground", "--muted-foreground", "--border", "--input", "--primary", "--primary-foreground", "--primary-hover", "--link", "--ring", "--focus", "--success", "--warning", "--danger", "--info", "--success-soft", "--warning-soft", "--danger-soft", "--info-soft", "--success-ink", "--warning-ink", "--danger-ink", "--info-ink", "--destructive", "--radius-sm", "--radius-md", "--radius-lg", "--radius-pill", "--shadow-1", "--shadow-2", "--shadow-3", "--scrim", "--motion-fast", "--motion-base", "--motion-slow", "--ease", "--font-sans", "--font-mono"];
+/**
+ * Variables whose toolkit value is the same in light and dark (theme.css
+ * declares them once, or identically in both modes). A theme's LIGHT value for
+ * one of these also applies in dark mode — a brand's button colour, radius or
+ * font does not change with the mode. Every other variable (surfaces, text,
+ * links, focus, status tones) takes its dark value from the theme's `dark`
+ * tokens or, failing that, from the toolkit's dark defaults — never from the
+ * light value, which would put light surfaces into a dark scope.
+ * Pinned against theme.css by `theme-css.test.ts`.
+ */
+export declare const MODE_INVARIANT_VARS: ReadonlySet<CssVarName>;
 /** A serializable map of CSS custom properties (`--primary` → value). */
 export type ThemeVars = Record<CssVarName, string>;
 /**
@@ -80,14 +222,18 @@ export type ThemeVars = Record<CssVarName, string>;
  * logged, or persisted and rehydrated.
  */
 export interface ThemeDefinition {
-    /** CSS variables applied at the theme scope (overrides `:root`). */
+    /** CSS variables applied at the theme scope in light mode (overrides `:root`). */
     vars: ThemeVars;
-    /** Dark-mode CSS variables, applied under `.dark` at the theme scope. */
+    /** Dark-mode CSS variables, applied at the theme scope in dark mode. */
     darkVars?: ThemeVars;
     /**
-     * The light {@link vars} as a React `style` object (CSS custom properties are
-     * valid `CSSProperties` keys). Handy for inlining onto a wrapper element
-     * without the {@link ThemeProvider}.
+     * The theme's light-mode variables as a React `style` object (CSS custom
+     * properties are valid `CSSProperties` keys): exactly what
+     * {@link ThemeProvider} applies in light mode, i.e.
+     * {@link resolveThemeVars}`(theme, "light")` — {@link vars} plus the values
+     * derived from the legacy knobs (sm/md/lg from `radius`, …). Handy for
+     * inlining onto a wrapper element without the provider; for dark mode use
+     * {@link resolveThemeVars}`(theme, "dark")`.
      */
     toStyle(): CSSProperties;
 }
@@ -100,31 +246,42 @@ export declare function tokensToVars(tokens: ThemeTokens): ThemeVars;
 /** Options for {@link createTheme}. */
 export interface CreateThemeOptions {
     /**
-     * Dark-mode token overrides. Applied on top of the toolkit's `.dark` defaults
-     * when the active mode is dark (see {@link ThemeProvider}). Provide only the
-     * tokens that differ from light — typically a darker `background`/`card` and a
-     * brighter `primary`.
+     * Dark-mode token overrides. In dark mode a theme scope gets the toolkit's
+     * dark defaults, the theme's mode-invariant light tokens (brand button
+     * colour, radii, fonts — see {@link MODE_INVARIANT_VARS}) and these. Provide
+     * what differs in dark — typically `background`, `card`, `link`.
      */
     dark?: ThemeTokens;
 }
 /**
- * Build a serializable {@link ThemeDefinition} from a curated set of brand
+ * Build a serializable {@link ThemeDefinition} from a set of brand
  * {@link ThemeTokens}. This is the one switch a white-label client flips: pass
- * your brand's primary colour, radius, and (optionally) dark overrides, and
- * every toolkit primitive that reads the design tokens — `Card`, `Button`,
- * `Badge`, `bg-card`, `text-primary`, `rounded-lg` — re-skins to match.
+ * the brand's roles (and, optionally, dark overrides), and every toolkit
+ * primitive that reads the role tokens — `Card`, `Button`, `Badge`, `bg-card`,
+ * `text-link`, `rounded-md` — re-skins to match. Without a theme the toolkit
+ * renders in the Miragon theme.
  *
  * Pure and side-effect-free: it only maps fields to CSS-variable names. Apply
  * the result with {@link ThemeProvider} (recommended) or by spreading
- * `theme.toStyle()` onto a wrapper element.
+ * {@link resolveThemeVars}`(theme, mode)` onto a wrapper element.
  *
  * @example
  * const brand = createTheme(
- *   { primary: "oklch(0.55 0.2 264)", radius: "0.5rem" },
- *   { dark: { primary: "oklch(0.7 0.18 264)" } },
+ *   { primary: "#0f766e", link: "#0f766e", focus: "#0f766e", radiusMd: "6px" },
+ *   { dark: { link: "#5eead4", focus: "#5eead4" } },
  * )
  * // <ThemeProvider theme={brand}>…</ThemeProvider>
  */
 export declare function createTheme(tokens: ThemeTokens, opts?: CreateThemeOptions): ThemeDefinition;
+/**
+ * The CSS variables a theme applies at its scope in `mode`. Light mode: the
+ * theme's `vars`. Dark mode: its mode-invariant light vars plus its `darkVars`
+ * — never the other light vars, which would beat the toolkit's dark defaults
+ * (mcp-toolkit#178 N35). Both modes add what the legacy knobs derive (a base
+ * `--radius` → sm/md/lg; `--primary` → hover and link; `--ring` → focus)
+ * where the theme does not set those roles itself.
+ * `null`/`undefined` yields `{}` (the toolkit defaults apply).
+ */
+export declare function resolveThemeVars(theme: ThemeDefinition | null | undefined, mode: "light" | "dark"): ThemeVars;
 export {};
 //# sourceMappingURL=create-theme.d.ts.map

package/dist/theme/create-theme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"create-theme.d.ts","sourceRoot":"","sources":["../../src/theme/create-theme.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAE1C;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,WAAW,WAAW;IAC1B,yCAAyC;IACzC,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,+EAA+E;IAC/E,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,+DAA+D;IAC/D,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,yEAAyE;IACzE,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,mDAAmD;IACnD,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,mDAAmD;IACnD,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,4CAA4C;IAC5C,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,oEAAoE;IACpE,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,+DAA+D;IAC/D,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,2CAA2C;IAC3C,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,6DAA6D;IAC7D,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,oDAAoD;IACpD,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,0DAA0D;IAC1D,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB;AAED,4EAA4E;AAC5E,KAAK,UAAU,GAAG,KAAK,MAAM,EAAE,CAAA;AAE/B;;;;;GAKG;AACH,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;CAc6B,CAAA;AAE1D,yEAAyE;AACzE,MAAM,MAAM,SAAS,GAAG,MAAM,CAAC,UAAU,EAAE,MAAM,CAAC,CAAA;AAElD;;;;;;;;GAQG;AACH,MAAM,WAAW,eAAe;IAC9B,oEAAoE;IACpE,IAAI,EAAE,SAAS,CAAA;IACf,yEAAyE;IACzE,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB;;;;OAIG;IACH,OAAO,IAAI,aAAa,CAAA;CACzB;AAED;;;;GAIG;AACH,wBAAgB,YAAY,CAAC,MAAM,EAAE,WAAW,GAAG,SAAS,CAY3D;AAED,uCAAuC;AACvC,MAAM,WAAW,kBAAkB;IACjC;;;;;OAKG;IACH,IAAI,CAAC,EAAE,WAAW,CAAA;CACnB;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,WAAW,CAAC,MAAM,EAAE,WAAW,EAAE,IAAI,CAAC,EAAE,kBAAkB,GAAG,eAAe,CAU3F"}
+{"version":3,"file":"create-theme.d.ts","sourceRoot":"","sources":["../../src/theme/create-theme.ts"],"names":[],"mappings":"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"}

package/dist/theme/create-theme.js

@@ -1,24 +1,142 @@
 /**
- * The single source of truth mapping each curated {@link ThemeTokens} field to
- * its real CSS variable name from `globals.css`. `tokensToVars` walks this map,
- * so adding a field here (and to {@link ThemeTokens}) is all that is needed to
- * extend the public theming surface.
+ * The single source of truth mapping each {@link ThemeTokens} field to its real
+ * CSS variable name in `theme.css`. `tokensToVars` walks this map, so adding a
+ * field here (and to {@link ThemeTokens}) is all that is needed to extend the
+ * public theming surface.
  */
 export const TOKEN_TO_CSS_VAR = {
     primary: "--primary",
     primaryForeground: "--primary-foreground",
+    primaryHover: "--primary-hover",
+    link: "--link",
     accent: "--accent",
     accentForeground: "--accent-foreground",
     background: "--background",
     foreground: "--foreground",
     card: "--card",
     cardForeground: "--card-foreground",
+    popover: "--popover",
+    muted: "--muted",
+    mutedForeground: "--muted-foreground",
+    secondary: "--secondary",
     border: "--border",
+    input: "--input",
     ring: "--ring",
+    focus: "--focus",
+    destructive: "--destructive",
+    destructiveForeground: "--destructive-foreground",
+    success: "--success",
+    successSoft: "--success-soft",
+    successInk: "--success-ink",
+    warning: "--warning",
+    warningSoft: "--warning-soft",
+    warningInk: "--warning-ink",
+    danger: "--danger",
+    dangerSoft: "--danger-soft",
+    dangerInk: "--danger-ink",
+    info: "--info",
+    infoSoft: "--info-soft",
+    infoInk: "--info-ink",
     radius: "--radius",
+    radiusSm: "--radius-sm",
+    radiusMd: "--radius-md",
+    radiusLg: "--radius-lg",
+    radiusPill: "--radius-pill",
+    shadow1: "--shadow-1",
+    shadow2: "--shadow-2",
+    shadow3: "--shadow-3",
+    scrim: "--scrim",
+    motionFast: "--motion-fast",
+    motionBase: "--motion-base",
+    motionSlow: "--motion-slow",
+    ease: "--ease",
     fontSans: "--font-sans",
+    fontMono: "--font-mono",
     fontHeading: "--font-heading",
 };
+/**
+ * The role-token contract: every variable the toolkit defines for components
+ * to use (`theme.css`), in light and — for colours — dark. Components in this
+ * package, and in apps built on it, style through these names only, never
+ * through raw colours or Tailwind palette classes.
+ */
+export const ROLE_TOKENS = [
+    "--background",
+    "--card",
+    "--popover",
+    "--muted",
+    "--secondary",
+    "--foreground",
+    "--muted-foreground",
+    "--border",
+    "--input",
+    "--primary",
+    "--primary-foreground",
+    "--primary-hover",
+    "--link",
+    "--ring",
+    "--focus",
+    "--success",
+    "--warning",
+    "--danger",
+    "--info",
+    "--success-soft",
+    "--warning-soft",
+    "--danger-soft",
+    "--info-soft",
+    "--success-ink",
+    "--warning-ink",
+    "--danger-ink",
+    "--info-ink",
+    "--destructive",
+    "--radius-sm",
+    "--radius-md",
+    "--radius-lg",
+    "--radius-pill",
+    "--shadow-1",
+    "--shadow-2",
+    "--shadow-3",
+    "--scrim",
+    "--motion-fast",
+    "--motion-base",
+    "--motion-slow",
+    "--ease",
+    "--font-sans",
+    "--font-mono",
+];
+/**
+ * Variables whose toolkit value is the same in light and dark (theme.css
+ * declares them once, or identically in both modes). A theme's LIGHT value for
+ * one of these also applies in dark mode — a brand's button colour, radius or
+ * font does not change with the mode. Every other variable (surfaces, text,
+ * links, focus, status tones) takes its dark value from the theme's `dark`
+ * tokens or, failing that, from the toolkit's dark defaults — never from the
+ * light value, which would put light surfaces into a dark scope.
+ * Pinned against theme.css by `theme-css.test.ts`.
+ */
+export const MODE_INVARIANT_VARS = new Set([
+    "--primary",
+    "--primary-foreground",
+    "--primary-hover",
+    "--destructive",
+    "--destructive-foreground",
+    "--input",
+    "--radius",
+    "--radius-sm",
+    "--radius-md",
+    "--radius-lg",
+    "--radius-pill",
+    "--shadow-1",
+    "--shadow-2",
+    "--shadow-3",
+    "--motion-fast",
+    "--motion-base",
+    "--motion-slow",
+    "--ease",
+    "--font-sans",
+    "--font-mono",
+    "--font-heading",
+]);
 /**
  * Map a {@link ThemeTokens} object to its CSS variables. Empty/partial token
  * objects yield only the variables that were set; fields not present in
@@ -35,20 +153,21 @@ export function tokensToVars(tokens) {
     return vars;
 }
 /**
- * Build a serializable {@link ThemeDefinition} from a curated set of brand
+ * Build a serializable {@link ThemeDefinition} from a set of brand
  * {@link ThemeTokens}. This is the one switch a white-label client flips: pass
- * your brand's primary colour, radius, and (optionally) dark overrides, and
- * every toolkit primitive that reads the design tokens — `Card`, `Button`,
- * `Badge`, `bg-card`, `text-primary`, `rounded-lg` — re-skins to match.
+ * the brand's roles (and, optionally, dark overrides), and every toolkit
+ * primitive that reads the role tokens — `Card`, `Button`, `Badge`, `bg-card`,
+ * `text-link`, `rounded-md` — re-skins to match. Without a theme the toolkit
+ * renders in the Miragon theme.
  *
  * Pure and side-effect-free: it only maps fields to CSS-variable names. Apply
  * the result with {@link ThemeProvider} (recommended) or by spreading
- * `theme.toStyle()` onto a wrapper element.
+ * {@link resolveThemeVars}`(theme, mode)` onto a wrapper element.
  *
  * @example
  * const brand = createTheme(
- *   { primary: "oklch(0.55 0.2 264)", radius: "0.5rem" },
- *   { dark: { primary: "oklch(0.7 0.18 264)" } },
+ *   { primary: "#0f766e", link: "#0f766e", focus: "#0f766e", radiusMd: "6px" },
+ *   { dark: { link: "#5eead4", focus: "#5eead4" } },
  * )
  * // <ThemeProvider theme={brand}>…</ThemeProvider>
  */
@@ -56,10 +175,67 @@ export function createTheme(tokens, opts) {
     const vars = tokensToVars(tokens);
     const darkTokens = opts?.dark;
     const darkVars = darkTokens ? tokensToVars(darkTokens) : undefined;
-    return {
+    const theme = {
         vars,
         ...(darkVars && Object.keys(darkVars).length > 0 ? { darkVars } : {}),
-        toStyle: () => vars,
+        toStyle: () => resolveThemeVars(theme, "light"),
     };
+    return theme;
+}
+/** Whether the theme sets `name` itself, in light or in dark. */
+function declares(theme, name) {
+    return name in theme.vars || (theme.darkVars !== undefined && name in theme.darkVars);
+}
+/**
+ * Fill the roles a theme written against the pre-role API leaves unset, from
+ * the knobs it does set, so it keeps ONE brand instead of half Miragon:
+ *
+ * - the base `--radius` reshapes the sm/md/lg steps (CI ratio 6 : 12 : 16);
+ * - `--primary` gives `--primary-hover` (90 %, the old `bg-primary/90`) and
+ *   `--link` (the old link button was `text-primary`);
+ * - `--ring` gives `--focus` (the old focus ring).
+ *
+ * A role the theme sets itself — in either mode — is never derived, and an
+ * explicit value always wins.
+ */
+function withDerivedVars(vars, theme) {
+    const derived = {};
+    const radius = vars["--radius"];
+    if (radius) {
+        derived["--radius-sm"] = `calc(${radius} * 0.5)`;
+        derived["--radius-md"] = radius;
+        derived["--radius-lg"] = `calc(${radius} * 4 / 3)`;
+    }
+    const primary = vars["--primary"];
+    if (primary && !declares(theme, "--primary-hover")) {
+        derived["--primary-hover"] = `color-mix(in srgb, ${primary} 90%, transparent)`;
+    }
+    if (primary && !declares(theme, "--link"))
+        derived["--link"] = primary;
+    const ring = vars["--ring"];
+    if (ring && !declares(theme, "--focus"))
+        derived["--focus"] = ring;
+    return { ...derived, ...vars };
+}
+/**
+ * The CSS variables a theme applies at its scope in `mode`. Light mode: the
+ * theme's `vars`. Dark mode: its mode-invariant light vars plus its `darkVars`
+ * — never the other light vars, which would beat the toolkit's dark defaults
+ * (mcp-toolkit#178 N35). Both modes add what the legacy knobs derive (a base
+ * `--radius` → sm/md/lg; `--primary` → hover and link; `--ring` → focus)
+ * where the theme does not set those roles itself.
+ * `null`/`undefined` yields `{}` (the toolkit defaults apply).
+ */
+export function resolveThemeVars(theme, mode) {
+    if (!theme)
+        return {};
+    if (mode === "light")
+        return withDerivedVars(theme.vars, theme);
+    const carried = {};
+    for (const [name, value] of Object.entries(theme.vars)) {
+        if (MODE_INVARIANT_VARS.has(name))
+            carried[name] = value;
+    }
+    return withDerivedVars({ ...carried, ...theme.darkVars }, theme);
 }
 //# sourceMappingURL=create-theme.js.map

package/dist/theme/create-theme.js.map

@@ -1 +1 @@
-{"version":3,"file":"create-theme.js","sourceRoot":"","sources":["../../src/theme/create-theme.ts"],"names":[],"mappings":"AAoDA;;;;;GAKG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG;IAC9B,OAAO,EAAE,WAAW;IACpB,iBAAiB,EAAE,sBAAsB;IACzC,MAAM,EAAE,UAAU;IAClB,gBAAgB,EAAE,qBAAqB;IACvC,UAAU,EAAE,cAAc;IAC1B,UAAU,EAAE,cAAc;IAC1B,IAAI,EAAE,QAAQ;IACd,cAAc,EAAE,mBAAmB;IACnC,MAAM,EAAE,UAAU;IAClB,IAAI,EAAE,QAAQ;IACd,MAAM,EAAE,UAAU;IAClB,QAAQ,EAAE,aAAa;IACvB,WAAW,EAAE,gBAAgB;CAC2B,CAAA;AA2B1D;;;;GAIG;AACH,MAAM,UAAU,YAAY,CAAC,MAAmB;IAC9C,MAAM,IAAI,GAAc,EAAE,CAAA;IAC1B,KAAK,MAAM,CAAC,KAAK,EAAE,MAAM,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,gBAAgB,CAG1D,EAAE,CAAC;QACJ,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC,CAAA;QAC3B,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YAClD,IAAI,CAAC,MAAM,CAAC,GAAG,KAAK,CAAA;QACtB,CAAC;IACH,CAAC;IACD,OAAO,IAAI,CAAA;AACb,CAAC;AAaD;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,UAAU,WAAW,CAAC,MAAmB,EAAE,IAAyB;IACxE,MAAM,IAAI,GAAG,YAAY,CAAC,MAAM,CAAC,CAAA;IACjC,MAAM,UAAU,GAAG,IAAI,EAAE,IAAI,CAAA;IAC7B,MAAM,QAAQ,GAAG,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,SAAS,CAAA;IAElE,OAAO;QACL,IAAI;QACJ,GAAG,CAAC,QAAQ,IAAI,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;QACrE,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI;KACpB,CAAA;AACH,CAAC"}
+{"version":3,"file":"create-theme.js","sourceRoot":"","sources":["../../src/theme/create-theme.ts"],"names":[],"mappings":"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"}

package/dist/theme/fonts.d.ts

@@ -0,0 +1,38 @@
+/**
+ * Opt-in Geist delivery by URL. The toolkit's font tokens name "Geist" and
+ * "Geist Mono" first but load no font: an app either imports
+ * `@miragon/mcp-toolkit-ui/fonts.css` (bundled by the build) or serves the
+ * woff2 files itself and declares them with {@link fontFaces}. The second path
+ * keeps MCP App views small — the files are fetched once and cached instead of
+ * inlined as base64 into every view; allow their origin in the view's CSP
+ * `resourceDomains`. Where the fonts never load, the host's font renders (if
+ * the host sends one, see `adoptHostFontVariables`), else the system stack.
+ */
+/** The latin variable woff2 files, as `@fontsource-variable/geist(-mono)` ship them. */
+export declare const GEIST_FONT_FILES: {
+    readonly sans: "geist-latin-wght-normal.woff2";
+    readonly mono: "geist-mono-latin-wght-normal.woff2";
+};
+/** Options for {@link fontFaces}. */
+export interface FontFacesOptions {
+    /** Where the woff2 files are served from, e.g. `https://mcp.example.com/fonts`. */
+    baseUrl: string;
+    /** File names under `baseUrl`. Defaults to {@link GEIST_FONT_FILES}. */
+    files?: {
+        sans?: string;
+        mono?: string;
+    };
+    /** `font-display` strategy. Default `"swap"`: text renders at once in the fallback. */
+    display?: "auto" | "block" | "swap" | "fallback" | "optional";
+}
+/**
+ * The `@font-face` rules for Geist and Geist Mono (latin, variable weight
+ * 100–900) served from `baseUrl`. Pure — inject the string where your app
+ * builds its document, e.g. `<style>{fontFaces({ baseUrl })}</style>`.
+ *
+ * @example
+ * fontFaces({ baseUrl: "https://mcp.example.com/fonts" })
+ * // @font-face { font-family: "Geist"; … src: url("https://mcp.example.com/fonts/geist-latin-wght-normal.woff2") … }
+ */
+export declare function fontFaces({ baseUrl, files, display }: FontFacesOptions): string;
+//# sourceMappingURL=fonts.d.ts.map

package/dist/theme/fonts.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fonts.d.ts","sourceRoot":"","sources":["../../src/theme/fonts.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAEH,wFAAwF;AACxF,eAAO,MAAM,gBAAgB;;;CAGnB,CAAA;AAMV,qCAAqC;AACrC,MAAM,WAAW,gBAAgB;IAC/B,mFAAmF;IACnF,OAAO,EAAE,MAAM,CAAA;IACf,wEAAwE;IACxE,KAAK,CAAC,EAAE;QAAE,IAAI,CAAC,EAAE,MAAM,CAAC;QAAC,IAAI,CAAC,EAAE,MAAM,CAAA;KAAE,CAAA;IACxC,uFAAuF;IACvF,OAAO,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,MAAM,GAAG,UAAU,GAAG,UAAU,CAAA;CAC9D;AA0BD;;;;;;;;GAQG;AACH,wBAAgB,SAAS,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,OAAgB,EAAE,EAAE,gBAAgB,GAAG,MAAM,CAOxF"}