@ox-content/vite-plugin 3.0.0-alpha.13 → 3.0.0-alpha.14

package/dist/theme-tokens.d.mts

@@ -0,0 +1,75 @@
+//#region src/theme-tokens.d.ts
+/**
+ * Free-form `--octc-*` custom properties for themes that need more than the
+ * typed `colors` / `fonts` / `layout` fields.
+ *
+ * Keys are written **without** the `--octc-` prefix, so `"surface-glass"`
+ * becomes `--octc-surface-glass`. This is the seam that keeps the two theme
+ * axes independent: a color package can restyle code-block line markers, brand
+ * accents, and surface textures purely through tokens, while a skin package
+ * lays out geometry against those same tokens without knowing any color.
+ */
+type ThemeTokens = Record<string, string>;
+/**
+ * The token-bearing shape of a theme.
+ *
+ * Declared structurally instead of importing `ThemeConfig` so this module keeps
+ * an empty import graph: `@ox-content/vite-plugin/theme-tokens` has to be
+ * loadable by a bare (`ssg.bare: true`) or custom host that never pulls in the
+ * Vite plugin, the SSG, the native binding, or a filesystem API. Every
+ * `ThemeConfig` — including the published `@ox-content/theme-color-*` and
+ * `@ox-content/theme-*` packages — satisfies it.
+ */
+interface ThemeTokenSource {
+  tokens?: ThemeTokens;
+  darkTokens?: ThemeTokens;
+  extends?: ThemeTokenSource;
+}
+/**
+ * Options for {@link renderThemeTokenCss}.
+ */
+interface RenderThemeTokenCssOptions {
+  /**
+   * Keeps only the tokens whose name passes the predicate. Names arrive without
+   * the `--octc-` prefix, so `(name) => name.startsWith("syntax-")` reuses a
+   * color scheme's highlighter palette without adopting its page colors,
+   * typography, or layout policy.
+   *
+   * Filtering runs per layer, before merging, so a token a later layer would
+   * have overridden is dropped along with the override.
+   */
+  include?: (name: string) => boolean;
+}
+/**
+ * Renders a theme's `--octc-*` tokens as a standalone stylesheet.
+ *
+ * The built-in SSG emits these declarations itself, but `ssg.bare: true` and
+ * custom hosts render their own document — this is how they get the same
+ * tokens. The built-in highlighter emits `var(--octc-syntax-*)` references, so
+ * a bare host that wants only the highlighter palette can ask for it:
+ *
+ * ```ts
+ * import { renderThemeTokenCss } from "@ox-content/vite-plugin/theme-tokens";
+ * import { kanagawa } from "@ox-content/theme-color-kanagawa";
+ *
+ * const css = renderThemeTokenCss(kanagawa, {
+ *   include: (name) => name.startsWith("syntax-"),
+ * });
+ * ```
+ *
+ * Layers compose left to right and each layer's `extends` chain is flattened
+ * base-first, matching how `resolveTheme()` stacks a skin and a color scheme.
+ */
+declare function renderThemeTokenCss(theme: ThemeTokenSource | ThemeTokenSource[], options?: RenderThemeTokenCssOptions): string;
+/**
+ * Renders light and dark token records as the three selectors the SSG runtime
+ * switches between: an explicit `[data-theme="dark"]` opt-in, the OS
+ * `prefers-color-scheme` fallback, and the `:root` base.
+ *
+ * Emitted after the typed color variables and before the theme's own `css`, so
+ * a token can override a typed color and raw `css` can override a token.
+ */
+declare function tokensToCss(light: ThemeTokens, dark: ThemeTokens): string;
+//#endregion
+export { RenderThemeTokenCssOptions, ThemeTokenSource, ThemeTokens, renderThemeTokenCss, tokensToCss };
+//# sourceMappingURL=theme-tokens.d.mts.map

package/dist/theme-tokens.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme-tokens.d.mts","names":[],"sources":["../src/theme-tokens.ts"],"mappings":";;;;;;;;;;;KAUY,cAAc;;;;;;;;;;;UAeT;EACf,SAAS;EACT,aAAa;EACb,UAAU;;;;;UAMK;;;;;;;;;;EAUf,WAAW;;;;;;;;;;;;;;;;;;;;;;iBAuBG,oBACd,OAAO,mBAAmB,oBAC1B,UAAS;;;;;;;;;iBAiBK,YAAY,OAAO,aAAa,MAAM"}

package/dist/theme-tokens.mjs

@@ -0,0 +1,91 @@
+const TOKEN_PREFIX = "--octc-";
+const TOKEN_NAME_PATTERN = /^[a-z][a-z0-9-]*$/;
+/**
+ * Renders a theme's `--octc-*` tokens as a standalone stylesheet.
+ *
+ * The built-in SSG emits these declarations itself, but `ssg.bare: true` and
+ * custom hosts render their own document — this is how they get the same
+ * tokens. The built-in highlighter emits `var(--octc-syntax-*)` references, so
+ * a bare host that wants only the highlighter palette can ask for it:
+ *
+ * ```ts
+ * import { renderThemeTokenCss } from "@ox-content/vite-plugin/theme-tokens";
+ * import { kanagawa } from "@ox-content/theme-color-kanagawa";
+ *
+ * const css = renderThemeTokenCss(kanagawa, {
+ *   include: (name) => name.startsWith("syntax-"),
+ * });
+ * ```
+ *
+ * Layers compose left to right and each layer's `extends` chain is flattened
+ * base-first, matching how `resolveTheme()` stacks a skin and a color scheme.
+ */
+export function renderThemeTokenCss(theme, options = {}) {
+    const layers = (Array.isArray(theme) ? theme : [theme]).flatMap(expandExtendsChain);
+    return tokensToCss(mergeTokens(layers, "tokens", options.include), mergeTokens(layers, "darkTokens", options.include));
+}
+/**
+ * Renders light and dark token records as the three selectors the SSG runtime
+ * switches between: an explicit `[data-theme="dark"]` opt-in, the OS
+ * `prefers-color-scheme` fallback, and the `:root` base.
+ *
+ * Emitted after the typed color variables and before the theme's own `css`, so
+ * a token can override a typed color and raw `css` can override a token.
+ */
+export function tokensToCss(light, dark) {
+    const lightBody = declarations(light, "  ");
+    const darkBody = declarations(dark, "  ");
+    const blocks = [];
+    if (lightBody) {
+        blocks.push(`:root {\n${lightBody}\n}`);
+    }
+    if (darkBody) {
+        blocks.push(`[data-theme="dark"] {\n${darkBody}\n}`);
+        blocks.push(`@media (prefers-color-scheme: dark) {\n  :root:not([data-theme="light"]) {\n${declarations(dark, "    ")}\n  }\n}`);
+    }
+    return blocks.join("\n");
+}
+function declarations(tokens, indent) {
+    return Object.entries(tokens)
+        .filter(([, value]) => value !== undefined && value !== "")
+        .map(([name, value]) => `${indent}${TOKEN_PREFIX}${assertTokenName(name)}: ${value};`)
+        .join("\n");
+}
+function assertTokenName(name) {
+    // Token names land verbatim inside a declaration block, so a stray `:` or `}`
+    // would silently break every rule after it. Fail the build with the offending
+    // key instead of shipping a corrupt stylesheet.
+    if (!TOKEN_NAME_PATTERN.test(name)) {
+        throw new Error(`Invalid theme token name: ${JSON.stringify(name)}. ` +
+            `Token names are lowercase kebab-case without the "${TOKEN_PREFIX}" prefix (e.g. "surface-glass").`);
+    }
+    return name;
+}
+function mergeTokens(layers, field, include) {
+    const merged = {};
+    for (const layer of layers) {
+        for (const [name, value] of Object.entries(layer[field] ?? {})) {
+            if (!include || include(name)) {
+                merged[name] = value;
+            }
+        }
+    }
+    return merged;
+}
+/**
+ * Flattens one layer's `extends` chain into base-first order, mirroring the
+ * SSG's own resolution. The `seen` guard keeps a theme that extends itself (or
+ * forms a cycle across two packages) from hanging the caller.
+ */
+function expandExtendsChain(theme) {
+    const chain = [];
+    const seen = new Set();
+    let current = theme;
+    while (current && !seen.has(current)) {
+        seen.add(current);
+        chain.unshift(current);
+        current = current.extends;
+    }
+    return chain;
+}
+//# sourceMappingURL=theme-tokens.mjs.map

package/dist/theme-tokens.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme-tokens.mjs","sourceRoot":"","sources":["../../../../home/runner/work/ox-content/ox-content/npm/vite-plugin-ox-content/src/theme-tokens.ts"],"names":[],"mappings":"AAYA,MAAM,YAAY,GAAG,SAAS,CAAC;AAC/B,MAAM,kBAAkB,GAAG,mBAAmB,CAAC;AAkC/C;;;;;;;;;;;;;;;;;;;GAmBG;AACH,MAAM,UAAU,mBAAmB,CACjC,KAA4C,EAC5C,OAAO,GAA+B,EAAE;IAExC,MAAM,MAAM,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,kBAAkB,CAAC,CAAC;IACpF,OAAO,WAAW,CAChB,WAAW,CAAC,MAAM,EAAE,QAAQ,EAAE,OAAO,CAAC,OAAO,CAAC,EAC9C,WAAW,CAAC,MAAM,EAAE,YAAY,EAAE,OAAO,CAAC,OAAO,CAAC,CACnD,CAAC;AACJ,CAAC;AAED;;;;;;;GAOG;AACH,MAAM,UAAU,WAAW,CAAC,KAAkB,EAAE,IAAiB;IAC/D,MAAM,SAAS,GAAG,YAAY,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;IAC5C,MAAM,QAAQ,GAAG,YAAY,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;IAC1C,MAAM,MAAM,GAAa,EAAE,CAAC;IAE5B,IAAI,SAAS,EAAE,CAAC;QACd,MAAM,CAAC,IAAI,CAAC,YAAY,SAAS,KAAK,CAAC,CAAC;IAC1C,CAAC;IACD,IAAI,QAAQ,EAAE,CAAC;QACb,MAAM,CAAC,IAAI,CAAC,0BAA0B,QAAQ,KAAK,CAAC,CAAC;QACrD,MAAM,CAAC,IAAI,CACT,+EAA+E,YAAY,CAAC,IAAI,EAAE,MAAM,CAAC,UAAU,CACpH,CAAC;IACJ,CAAC;IAED,OAAO,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAC3B,CAAC;AAED,SAAS,YAAY,CAAC,MAAmB,EAAE,MAAc;IACvD,OAAO,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC;SAC1B,MAAM,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC,KAAK,KAAK,SAAS,IAAI,KAAK,KAAK,EAAE,CAAC;SAC1D,GAAG,CAAC,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC,GAAG,MAAM,GAAG,YAAY,GAAG,eAAe,CAAC,IAAI,CAAC,KAAK,KAAK,GAAG,CAAC;SACrF,IAAI,CAAC,IAAI,CAAC,CAAC;AAChB,CAAC;AAED,SAAS,eAAe,CAAC,IAAY;IACnC,8EAA8E;IAC9E,8EAA8E;IAC9E,gDAAgD;IAChD,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC;QACnC,MAAM,IAAI,KAAK,CACb,6BAA6B,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI;YACnD,qDAAqD,YAAY,kCAAkC,CACtG,CAAC;IACJ,CAAC;IACD,OAAO,IAAI,CAAC;AACd,CAAC;AAED,SAAS,WAAW,CAClB,MAA0B,EAC1B,KAA8B,EAC9B,OAAmC;IAEnC,MAAM,MAAM,GAAgB,EAAE,CAAC;IAE/B,KAAK,MAAM,KAAK,IAAI,MAAM,EAAE,CAAC;QAC3B,KAAK,MAAM,CAAC,IAAI,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC,EAAE,CAAC;YAC/D,IAAI,CAAC,OAAO,IAAI,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC;gBAC9B,MAAM,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC;YACvB,CAAC;QACH,CAAC;IACH,CAAC;IAED,OAAO,MAAM,CAAC;AAChB,CAAC;AAED;;;;GAIG;AACH,SAAS,kBAAkB,CAAC,KAAuB;IACjD,MAAM,KAAK,GAAuB,EAAE,CAAC;IACrC,MAAM,IAAI,GAAG,IAAI,GAAG,EAAoB,CAAC;IACzC,IAAI,OAAO,GAAiC,KAAK,CAAC;IAElD,OAAO,OAAO,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC;QACrC,IAAI,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;QAClB,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;QACvB,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC;IAC5B,CAAC;IAED,OAAO,KAAK,CAAC;AACf,CAAC","sourcesContent":["/**\n * Free-form `--octc-*` custom properties for themes that need more than the\n * typed `colors` / `fonts` / `layout` fields.\n *\n * Keys are written **without** the `--octc-` prefix, so `\"surface-glass\"`\n * becomes `--octc-surface-glass`. This is the seam that keeps the two theme\n * axes independent: a color package can restyle code-block line markers, brand\n * accents, and surface textures purely through tokens, while a skin package\n * lays out geometry against those same tokens without knowing any color.\n */\nexport type ThemeTokens = Record<string, string>;\n\nconst TOKEN_PREFIX = \"--octc-\";\nconst TOKEN_NAME_PATTERN = /^[a-z][a-z0-9-]*$/;\n\n/**\n * The token-bearing shape of a theme.\n *\n * Declared structurally instead of importing `ThemeConfig` so this module keeps\n * an empty import graph: `@ox-content/vite-plugin/theme-tokens` has to be\n * loadable by a bare (`ssg.bare: true`) or custom host that never pulls in the\n * Vite plugin, the SSG, the native binding, or a filesystem API. Every\n * `ThemeConfig` — including the published `@ox-content/theme-color-*` and\n * `@ox-content/theme-*` packages — satisfies it.\n */\nexport interface ThemeTokenSource {\n  tokens?: ThemeTokens;\n  darkTokens?: ThemeTokens;\n  extends?: ThemeTokenSource;\n}\n\n/**\n * Options for {@link renderThemeTokenCss}.\n */\nexport interface RenderThemeTokenCssOptions {\n  /**\n   * Keeps only the tokens whose name passes the predicate. Names arrive without\n   * the `--octc-` prefix, so `(name) => name.startsWith(\"syntax-\")` reuses a\n   * color scheme's highlighter palette without adopting its page colors,\n   * typography, or layout policy.\n   *\n   * Filtering runs per layer, before merging, so a token a later layer would\n   * have overridden is dropped along with the override.\n   */\n  include?: (name: string) => boolean;\n}\n\n/**\n * Renders a theme's `--octc-*` tokens as a standalone stylesheet.\n *\n * The built-in SSG emits these declarations itself, but `ssg.bare: true` and\n * custom hosts render their own document — this is how they get the same\n * tokens. The built-in highlighter emits `var(--octc-syntax-*)` references, so\n * a bare host that wants only the highlighter palette can ask for it:\n *\n * ```ts\n * import { renderThemeTokenCss } from \"@ox-content/vite-plugin/theme-tokens\";\n * import { kanagawa } from \"@ox-content/theme-color-kanagawa\";\n *\n * const css = renderThemeTokenCss(kanagawa, {\n *   include: (name) => name.startsWith(\"syntax-\"),\n * });\n * ```\n *\n * Layers compose left to right and each layer's `extends` chain is flattened\n * base-first, matching how `resolveTheme()` stacks a skin and a color scheme.\n */\nexport function renderThemeTokenCss(\n  theme: ThemeTokenSource | ThemeTokenSource[],\n  options: RenderThemeTokenCssOptions = {},\n): string {\n  const layers = (Array.isArray(theme) ? theme : [theme]).flatMap(expandExtendsChain);\n  return tokensToCss(\n    mergeTokens(layers, \"tokens\", options.include),\n    mergeTokens(layers, \"darkTokens\", options.include),\n  );\n}\n\n/**\n * Renders light and dark token records as the three selectors the SSG runtime\n * switches between: an explicit `[data-theme=\"dark\"]` opt-in, the OS\n * `prefers-color-scheme` fallback, and the `:root` base.\n *\n * Emitted after the typed color variables and before the theme's own `css`, so\n * a token can override a typed color and raw `css` can override a token.\n */\nexport function tokensToCss(light: ThemeTokens, dark: ThemeTokens): string {\n  const lightBody = declarations(light, \"  \");\n  const darkBody = declarations(dark, \"  \");\n  const blocks: string[] = [];\n\n  if (lightBody) {\n    blocks.push(`:root {\\n${lightBody}\\n}`);\n  }\n  if (darkBody) {\n    blocks.push(`[data-theme=\"dark\"] {\\n${darkBody}\\n}`);\n    blocks.push(\n      `@media (prefers-color-scheme: dark) {\\n  :root:not([data-theme=\"light\"]) {\\n${declarations(dark, \"    \")}\\n  }\\n}`,\n    );\n  }\n\n  return blocks.join(\"\\n\");\n}\n\nfunction declarations(tokens: ThemeTokens, indent: string): string {\n  return Object.entries(tokens)\n    .filter(([, value]) => value !== undefined && value !== \"\")\n    .map(([name, value]) => `${indent}${TOKEN_PREFIX}${assertTokenName(name)}: ${value};`)\n    .join(\"\\n\");\n}\n\nfunction assertTokenName(name: string): string {\n  // Token names land verbatim inside a declaration block, so a stray `:` or `}`\n  // would silently break every rule after it. Fail the build with the offending\n  // key instead of shipping a corrupt stylesheet.\n  if (!TOKEN_NAME_PATTERN.test(name)) {\n    throw new Error(\n      `Invalid theme token name: ${JSON.stringify(name)}. ` +\n        `Token names are lowercase kebab-case without the \"${TOKEN_PREFIX}\" prefix (e.g. \"surface-glass\").`,\n    );\n  }\n  return name;\n}\n\nfunction mergeTokens(\n  layers: ThemeTokenSource[],\n  field: \"tokens\" | \"darkTokens\",\n  include?: (name: string) => boolean,\n): ThemeTokens {\n  const merged: ThemeTokens = {};\n\n  for (const layer of layers) {\n    for (const [name, value] of Object.entries(layer[field] ?? {})) {\n      if (!include || include(name)) {\n        merged[name] = value;\n      }\n    }\n  }\n\n  return merged;\n}\n\n/**\n * Flattens one layer's `extends` chain into base-first order, mirroring the\n * SSG's own resolution. The `seen` guard keeps a theme that extends itself (or\n * forms a cycle across two packages) from hanging the caller.\n */\nfunction expandExtendsChain(theme: ThemeTokenSource): ThemeTokenSource[] {\n  const chain: ThemeTokenSource[] = [];\n  const seen = new Set<ThemeTokenSource>();\n  let current: ThemeTokenSource | undefined = theme;\n\n  while (current && !seen.has(current)) {\n    seen.add(current);\n    chain.unshift(current);\n    current = current.extends;\n  }\n\n  return chain;\n}\n"]}

package/dist/vitepress.cjs

@@ -38,6 +38,7 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 }) : target, mod));
 var __toCommonJS = (mod) => __hasOwnProp.call(mod, "module.exports") ? mod["module.exports"] : __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 //#endregion
+const require_theme_tokens = require("./theme-tokens.cjs");
 let node_module = require("node:module");
 let node_fs = require("node:fs");
 let node_path = require("node:path");
@@ -700,36 +701,6 @@ function resolveHeaderNavItems(items, locale, defaultLocale) {
 	}));
 }
 //#endregion
-//#region src/theme-tokens.ts
-const TOKEN_PREFIX = "--octc-";
-const TOKEN_NAME_PATTERN = /^[a-z][a-z0-9-]*$/;
-/**
-* Renders light and dark token records as the three selectors the SSG runtime
-* switches between: an explicit `[data-theme="dark"]` opt-in, the OS
-* `prefers-color-scheme` fallback, and the `:root` base.
-*
-* Emitted after the typed color variables and before the theme's own `css`, so
-* a token can override a typed color and raw `css` can override a token.
-*/
-function tokensToCss(light, dark) {
-	const lightBody = declarations(light, "  ");
-	const darkBody = declarations(dark, "  ");
-	const blocks = [];
-	if (lightBody) blocks.push(`:root {\n${lightBody}\n}`);
-	if (darkBody) {
-		blocks.push(`[data-theme="dark"] {\n${darkBody}\n}`);
-		blocks.push(`@media (prefers-color-scheme: dark) {\n  :root:not([data-theme="light"]) {\n${declarations(dark, "    ")}\n  }\n}`);
-	}
-	return blocks.join("\n");
-}
-function declarations(tokens, indent) {
-	return Object.entries(tokens).filter(([, value]) => value !== void 0 && value !== "").map(([name, value]) => `${indent}${TOKEN_PREFIX}${assertTokenName(name)}: ${value};`).join("\n");
-}
-function assertTokenName(name) {
-	if (!TOKEN_NAME_PATTERN.test(name)) throw new Error(`Invalid theme token name: ${JSON.stringify(name)}. Token names are lowercase kebab-case without the "${TOKEN_PREFIX}" prefix (e.g. "surface-glass").`);
-	return name;
-}
-//#endregion
 //#region src/theme.ts
 /**
 * Default theme configuration.
@@ -997,7 +968,7 @@ function themeToNapi(theme, locale, base, iconsEnabled = false) {
 * land after the typed color variables the Rust renderer emits.
 */
 function themeCss(theme) {
-	const prefix = [tokensToCss(theme.tokens, theme.darkTokens), namedFontVarsCss(theme.fonts)].filter(Boolean).join("\n");
+	const prefix = [require_theme_tokens.renderThemeTokenCss(theme), namedFontVarsCss(theme.fonts)].filter(Boolean).join("\n");
 	if (!prefix) return theme.css;
 	return theme.css ? `${prefix}\n${theme.css}` : prefix;
 }