@takazudo/zudo-doc 0.1.0

package/dist/theme/design-token-serde.d.ts

@@ -0,0 +1,136 @@
+import { TokenDef } from '@takazudo/zdtp';
+import { ColorTweakState, TweakState } from './design-token-types.js';
+
+/**
+ * Design-token SerDe — unified JSON export / import for the design-token panel.
+ *
+ * Supersedes the legacy TypeScript-object export in `export-code.ts`. The JSON
+ * format is a single document covering all four token categories (color,
+ * spacing, font, size) so an AI assistant can consume or emit a whole
+ * design-token tweak in one round-trip.
+ *
+ * Format: `$schema = "zudo-doc-design-tokens/v1"`.
+ *
+ * Diff-only by default
+ * --------------------
+ * `serialize()` only emits tokens the user has actually changed relative to
+ * the provided `colorDefaults` (for the color block) and the manifest defaults
+ * (for spacing / font / size). Pass `includeDefaults: true` to dump the full
+ * state instead. The whole-category keys (`color`, `spacing`, `font`, `size`)
+ * are omitted entirely when nothing in them differs.
+ *
+ * Spacing / font / size keys use CSS variable names (`"--spacing-hsp-md"`) —
+ * the external schema — rather than the internal token id (`"hsp-md"`). This
+ * keeps the file human-readable and agnostic of our internal manifest.
+ * `deserialize()` maps them back; unknown CSS vars are reported via
+ * `unknownTokens` so the UI can surface them.
+ *
+ * Read-only manifest tokens (e.g. `--spacing-0`, `--zd-sidebar-w` with
+ * `clamp()`) are skipped in both directions.
+ *
+ * W3B (#1730 — Generator Pages Migration): moved from
+ * `src/utils/design-token-serde.ts` into v2. The manifest tokens
+ * (`SPACING_TOKENS` / `FONT_TOKENS` / `SIZE_TOKENS`) are no longer
+ * imported from the host's `@/config/design-tokens-manifest` — the
+ * caller now passes them through `SerializeOptions.manifest` /
+ * `DeserializeOptions.manifest`, preserving consumer override hooks.
+ */
+
+declare const DESIGN_TOKEN_SCHEMA: "zudo-doc-design-tokens/v1";
+/** External JSON value for a base-color / semantic-color entry. */
+type ColorSlotValue = number | "bg" | "fg";
+interface DesignTokenJsonColorBase {
+    bg?: number;
+    fg?: number;
+    cursor?: number;
+    /** Dashed keys mirror the external docs; they are quoted in source. */
+    "sel-bg"?: number;
+    "sel-fg"?: number;
+}
+interface DesignTokenJsonColor {
+    palette?: string[];
+    base?: DesignTokenJsonColorBase;
+    /** Palette-index (or "bg"/"fg") mappings, same keys as `SEMANTIC_DEFAULTS`. */
+    semantic?: Record<string, ColorSlotValue>;
+}
+/** External token map keyed by CSS var name. */
+type DesignTokenJsonOverrides = Record<string, string>;
+interface DesignTokenJson {
+    $schema: typeof DESIGN_TOKEN_SCHEMA;
+    exportedAt: string;
+    color?: DesignTokenJsonColor;
+    spacing?: DesignTokenJsonOverrides;
+    font?: DesignTokenJsonOverrides;
+    size?: DesignTokenJsonOverrides;
+}
+/**
+ * Token manifest the caller hands in — the consumer's
+ * `src/config/design-tokens-manifest.ts` (or generator override). v2
+ * doesn't ship its own manifest; this is intentionally a caller concern
+ * so each consumer keeps full control over the editable token set.
+ */
+interface DesignTokenManifest {
+    spacing: readonly TokenDef[];
+    font: readonly TokenDef[];
+    size: readonly TokenDef[];
+}
+interface SerializeOptions {
+    /** Token manifest (spacing / font / size arrays) used to compute
+     *  diff-only output and resolve CSS-var names. Required. */
+    manifest: DesignTokenManifest;
+    /** When true, dump full state (all palette entries, all token manifest
+     *  defaults merged in). Default: diff-only. */
+    includeDefaults?: boolean;
+    /** Color baseline to diff against — typically the current scheme's initial
+     *  state. Required for meaningful color-diff output; callers that don't have
+     *  it available (e.g. tests without DOM) can omit it and we'll treat the
+     *  whole color block as changed. */
+    colorDefaults?: ColorTweakState;
+    /** Override the `exportedAt` stamp (test-only). */
+    now?: () => Date;
+}
+interface DeserializeResult {
+    /** The reconstructed tweak state, with unknown-token values dropped. */
+    state: TweakState;
+    /** CSS var names present in the payload that don't match any known token. */
+    unknownTokens: string[];
+    /** Human-readable errors that did not prevent a state from being produced
+     *  (e.g. "semantic mapping dropped because value isn't a number"). */
+    warnings: string[];
+}
+interface DeserializeOptions {
+    /** Token manifest (spacing / font / size arrays) used to resolve CSS-var
+     *  names back to internal token ids. Required. */
+    manifest: DesignTokenManifest;
+    /** Color baseline used to fill in fields absent from the payload (diff-only
+     *  exports are missing most fields by design). Typically the current
+     *  scheme's initial state. */
+    colorDefaults?: ColorTweakState;
+}
+/** Thrown when the payload is not a v1 schema object. The error `.reason`
+ *  helps the UI render a precise inline message. */
+declare class DesignTokenSchemaError extends Error {
+    readonly reason: "not-object" | "schema-missing" | "schema-mismatch";
+    readonly actualSchema?: unknown;
+    constructor(reason: "not-object" | "schema-missing" | "schema-mismatch", message: string, actualSchema?: unknown);
+}
+/**
+ * Produce the external JSON document for a given tweak state.
+ *
+ * By default this is diff-only against `opts.colorDefaults` + manifest
+ * defaults; set `opts.includeDefaults = true` to dump everything.
+ */
+declare function serialize(state: TweakState, opts: SerializeOptions): DesignTokenJson;
+/**
+ * Parse a design-token JSON document and lift it back into a tweak state.
+ *
+ * Throws `DesignTokenSchemaError` on schema mismatch / non-object input. Any
+ * CSS var name that doesn't match a known manifest entry is collected into
+ * `unknownTokens` (the caller can surface these as a warning).
+ *
+ * Missing fields fall back to `opts.colorDefaults` (or, absent that, a
+ * minimal neutral default) so the result is always a valid `TweakState`.
+ */
+declare function deserialize(input: unknown, opts: DeserializeOptions): DeserializeResult;
+
+export { DESIGN_TOKEN_SCHEMA, type DeserializeOptions, type DeserializeResult, type DesignTokenJson, type DesignTokenJsonColor, type DesignTokenJsonColorBase, type DesignTokenJsonOverrides, type DesignTokenManifest, DesignTokenSchemaError, type SerializeOptions, deserialize, serialize };

package/dist/theme/design-token-serde.js

@@ -0,0 +1,254 @@
+import {} from "@takazudo/zdtp";
+import {
+  emptyOverrides
+} from "./design-token-types.js";
+const DESIGN_TOKEN_SCHEMA = "zudo-doc-design-tokens/v1";
+class DesignTokenSchemaError extends Error {
+  reason;
+  actualSchema;
+  constructor(reason, message, actualSchema) {
+    super(message);
+    this.name = "DesignTokenSchemaError";
+    this.reason = reason;
+    this.actualSchema = actualSchema;
+  }
+}
+function serialize(state, opts) {
+  const now = opts.now ? opts.now() : /* @__PURE__ */ new Date();
+  const out = {
+    $schema: DESIGN_TOKEN_SCHEMA,
+    exportedAt: now.toISOString()
+  };
+  const color = serializeColor(state.color, opts);
+  if (color) out.color = color;
+  const spacing = serializeOverrides(opts.manifest.spacing, state.spacing, opts);
+  if (spacing) out.spacing = spacing;
+  const font = serializeOverrides(opts.manifest.font, state.font, opts);
+  if (font) out.font = font;
+  const size = serializeOverrides(opts.manifest.size, state.size, opts);
+  if (size) out.size = size;
+  return out;
+}
+function serializeColor(color, opts) {
+  const baseline = opts.colorDefaults;
+  const full = opts.includeDefaults === true;
+  const out = {};
+  let changed = false;
+  const paletteChanged = full || !baseline || baseline.palette.length !== color.palette.length || color.palette.some((c, i) => c !== baseline.palette[i]);
+  if (paletteChanged) {
+    out.palette = [...color.palette];
+    changed = true;
+  }
+  const base = {};
+  let baseChanged = false;
+  const baseEntries = [
+    ["bg", color.background, baseline?.background],
+    ["fg", color.foreground, baseline?.foreground],
+    ["cursor", color.cursor, baseline?.cursor],
+    ["sel-bg", color.selectionBg, baseline?.selectionBg],
+    ["sel-fg", color.selectionFg, baseline?.selectionFg]
+  ];
+  for (const [key, value, baselineValue] of baseEntries) {
+    if (full || baseline === void 0 || value !== baselineValue) {
+      base[key] = value;
+      baseChanged = true;
+    }
+  }
+  if (baseChanged) {
+    out.base = base;
+    changed = true;
+  }
+  const semantic = {};
+  let semanticChanged = false;
+  const semKeys = /* @__PURE__ */ new Set([
+    ...Object.keys(color.semanticMappings),
+    ...baseline ? Object.keys(baseline.semanticMappings) : []
+  ]);
+  for (const key of semKeys) {
+    const cur = color.semanticMappings[key];
+    if (cur === void 0) continue;
+    const base2 = baseline?.semanticMappings[key];
+    if (full || base2 === void 0 || cur !== base2) {
+      semantic[key] = cur;
+      semanticChanged = true;
+    }
+  }
+  if (semanticChanged) {
+    out.semantic = semantic;
+    changed = true;
+  }
+  return changed ? out : void 0;
+}
+function serializeOverrides(manifest, overrides, opts) {
+  const full = opts.includeDefaults === true;
+  const out = {};
+  let wrote = false;
+  if (full) {
+    for (const t of manifest) {
+      if (t.readonly) continue;
+      const v = overrides[t.id];
+      out[t.cssVar] = typeof v === "string" && v.length > 0 ? v : t.default;
+      wrote = true;
+    }
+  } else {
+    for (const t of manifest) {
+      if (t.readonly) continue;
+      const v = overrides[t.id];
+      if (typeof v === "string" && v.length > 0 && v !== t.default) {
+        out[t.cssVar] = v;
+        wrote = true;
+      }
+    }
+  }
+  return wrote ? out : void 0;
+}
+function deserialize(input, opts) {
+  if (input === null || typeof input !== "object") {
+    throw new DesignTokenSchemaError(
+      "not-object",
+      "Input is not a JSON object."
+    );
+  }
+  const obj = input;
+  const schema = obj.$schema;
+  if (schema === void 0) {
+    throw new DesignTokenSchemaError(
+      "schema-missing",
+      `Missing "$schema" key. Expected "${DESIGN_TOKEN_SCHEMA}".`
+    );
+  }
+  if (schema !== DESIGN_TOKEN_SCHEMA) {
+    throw new DesignTokenSchemaError(
+      "schema-mismatch",
+      `Unsupported "$schema" value: ${JSON.stringify(schema)}. Expected "${DESIGN_TOKEN_SCHEMA}".`,
+      schema
+    );
+  }
+  const warnings = [];
+  const unknownTokens = [];
+  const baseline = opts.colorDefaults ?? neutralColorDefaults();
+  const color = deserializeColor(obj.color, baseline, warnings);
+  const spacing = deserializeOverrides(
+    obj.spacing,
+    opts.manifest.spacing,
+    "spacing",
+    unknownTokens,
+    warnings
+  );
+  const font = deserializeOverrides(
+    obj.font,
+    opts.manifest.font,
+    "font",
+    unknownTokens,
+    warnings
+  );
+  const size = deserializeOverrides(
+    obj.size,
+    opts.manifest.size,
+    "size",
+    unknownTokens,
+    warnings
+  );
+  return {
+    state: { color, spacing, font, size },
+    unknownTokens,
+    warnings
+  };
+}
+function deserializeColor(raw, baseline, warnings) {
+  if (!raw || typeof raw !== "object") {
+    return { ...baseline, palette: [...baseline.palette], semanticMappings: { ...baseline.semanticMappings } };
+  }
+  const c = raw;
+  let palette = [...baseline.palette];
+  if (Array.isArray(c.palette)) {
+    const parsed = c.palette.filter((v) => typeof v === "string");
+    if (parsed.length === 16 && parsed.length === c.palette.length) {
+      palette = parsed;
+    } else if (c.palette.length > 0) {
+      const detail = parsed.length < c.palette.length ? `${c.palette.length - parsed.length} non-string entries dropped, leaving ${parsed.length}` : `${c.palette.length} entries`;
+      warnings.push(
+        `color.palette: expected 16 string entries; got ${detail}. Palette ignored.`
+      );
+    }
+  }
+  const base = c.base && typeof c.base === "object" ? c.base : {};
+  const background = numOr(base.bg, baseline.background);
+  const foreground = numOr(base.fg, baseline.foreground);
+  const cursor = numOr(base.cursor, baseline.cursor);
+  const selectionBg = numOr(base["sel-bg"], baseline.selectionBg);
+  const selectionFg = numOr(base["sel-fg"], baseline.selectionFg);
+  const semanticMappings = {
+    ...baseline.semanticMappings
+  };
+  if (c.semantic && typeof c.semantic === "object") {
+    for (const [key, val] of Object.entries(c.semantic)) {
+      if (typeof val === "number") {
+        semanticMappings[key] = val;
+      } else if (val === "bg" || val === "fg") {
+        semanticMappings[key] = val;
+      } else {
+        warnings.push(
+          `color.semantic.${key} has unsupported value ${JSON.stringify(val)}; kept baseline.`
+        );
+      }
+    }
+  }
+  return {
+    palette,
+    background,
+    foreground,
+    cursor,
+    selectionBg,
+    selectionFg,
+    semanticMappings
+  };
+}
+function deserializeOverrides(raw, manifest, label, unknownTokens, warnings) {
+  if (!raw || typeof raw !== "object") return emptyOverrides();
+  const byVar = /* @__PURE__ */ new Map();
+  for (const t of manifest) {
+    if (t.readonly) continue;
+    byVar.set(t.cssVar, t);
+  }
+  const out = {};
+  for (const [cssVar, value] of Object.entries(raw)) {
+    const t = byVar.get(cssVar);
+    if (!t) {
+      unknownTokens.push(cssVar);
+      continue;
+    }
+    if (typeof value !== "string" || value.length === 0) {
+      warnings.push(
+        `${label}.${cssVar} is not a non-empty string; ignored.`
+      );
+      continue;
+    }
+    out[t.id] = value;
+  }
+  return out;
+}
+function numOr(v, fallback) {
+  return typeof v === "number" && Number.isFinite(v) ? v : fallback;
+}
+function neutralColorDefaults() {
+  const palette = Array.from(
+    { length: 16 },
+    (_, i) => i === 0 ? "#000000" : i === 15 ? "#ffffff" : "#808080"
+  );
+  return {
+    palette,
+    background: 0,
+    foreground: 15,
+    cursor: 6,
+    selectionBg: 0,
+    selectionFg: 15,
+    semanticMappings: {}
+  };
+}
+export {
+  DESIGN_TOKEN_SCHEMA,
+  DesignTokenSchemaError,
+  deserialize,
+  serialize
+};

package/dist/theme/design-token-tweak-panel.d.ts

@@ -0,0 +1,11 @@
+import { JSX } from 'preact';
+
+/** @jsxRuntime automatic */
+/** @jsxImportSource preact */
+
+/** Stub — the real panel is bootstrapped by zdtp via design-token-panel-bootstrap.ts. */
+declare function DesignTokenTweakPanelInner(): JSX.Element | null;
+/** Stub — see DesignTokenTweakPanelInner. */
+declare function DesignTokenTweakPanel(): JSX.Element | null;
+
+export { DesignTokenTweakPanelInner, DesignTokenTweakPanel as default };

package/dist/theme/design-token-tweak-panel.js

@@ -0,0 +1,10 @@
+function DesignTokenTweakPanelInner() {
+  return null;
+}
+function DesignTokenTweakPanel() {
+  return null;
+}
+export {
+  DesignTokenTweakPanelInner,
+  DesignTokenTweakPanel as default
+};

package/dist/theme/design-token-types.d.ts

@@ -0,0 +1,19 @@
+interface ColorTweakState {
+    palette: string[];
+    background: number;
+    foreground: number;
+    cursor: number;
+    selectionBg: number;
+    selectionFg: number;
+    semanticMappings: Record<string, number | "bg" | "fg">;
+}
+type TokenOverrides = Record<string, string>;
+interface TweakState {
+    color: ColorTweakState;
+    spacing: TokenOverrides;
+    font: TokenOverrides;
+    size: TokenOverrides;
+}
+declare function emptyOverrides(): TokenOverrides;
+
+export { type ColorTweakState, type TokenOverrides, type TweakState, emptyOverrides };

package/dist/theme/design-token-types.js

@@ -0,0 +1,6 @@
+function emptyOverrides() {
+  return {};
+}
+export {
+  emptyOverrides
+};

package/dist/theme/iframe-bridge.d.ts

@@ -0,0 +1,44 @@
+declare const BRIDGE_SOURCE: "zudo-doc-theme-bridge";
+type CssVarPair = readonly [name: string, value: string];
+interface ApplyCssVarsMessage {
+    source: typeof BRIDGE_SOURCE;
+    type: "apply-css-vars";
+    vars: ReadonlyArray<CssVarPair>;
+}
+interface ClearCssVarsMessage {
+    source: typeof BRIDGE_SOURCE;
+    type: "clear-css-vars";
+    names: ReadonlyArray<string>;
+}
+interface ReadyMessage {
+    source: typeof BRIDGE_SOURCE;
+    type: "ready";
+}
+interface ErrorMessage {
+    source: typeof BRIDGE_SOURCE;
+    type: "error";
+    reason: string;
+}
+type BridgeMessage = ApplyCssVarsMessage | ClearCssVarsMessage | ReadyMessage | ErrorMessage;
+/**
+ * Type guard. Accepts any postMessage payload and confirms it is a bridge
+ * envelope. Foreign messages are ignored silently.
+ */
+declare function isBridgeMessage(value: unknown): value is BridgeMessage;
+/** Send `apply-css-vars` to the iframe. No-op when the iframe has not loaded. */
+declare function sendApplyCssVars(iframe: HTMLIFrameElement | null, vars: ReadonlyArray<CssVarPair>): void;
+/** Send `clear-css-vars` to the iframe so it removes inline overrides. */
+declare function sendClearCssVars(iframe: HTMLIFrameElement | null, names: ReadonlyArray<string>): void;
+/**
+ * Install a message listener inside the preview iframe document that applies
+ * any incoming CSS-var batches onto `documentElement.style`. Returns a
+ * teardown function. Intended to be called once at iframe boot.
+ */
+declare function installIframeReceiver(target?: Window): () => void;
+/**
+ * Install a `ready` listener on the panel side so callers can defer the
+ * initial CSS-var sync until the iframe document has booted.
+ */
+declare function onIframeReady(expectedSource: Window | null, callback: () => void): () => void;
+
+export { type ApplyCssVarsMessage, BRIDGE_SOURCE, type BridgeMessage, type ClearCssVarsMessage, type CssVarPair, type ErrorMessage, type ReadyMessage, installIframeReceiver, isBridgeMessage, onIframeReady, sendApplyCssVars, sendClearCssVars };

package/dist/theme/iframe-bridge.js

@@ -0,0 +1,70 @@
+const BRIDGE_SOURCE = "zudo-doc-theme-bridge";
+function isBridgeMessage(value) {
+  if (!value || typeof value !== "object") return false;
+  const v = value;
+  return v.source === BRIDGE_SOURCE && typeof v.type === "string";
+}
+function sendApplyCssVars(iframe, vars) {
+  const win = iframe?.contentWindow;
+  if (!win) return;
+  const message = {
+    source: BRIDGE_SOURCE,
+    type: "apply-css-vars",
+    vars
+  };
+  win.postMessage(message, "*");
+}
+function sendClearCssVars(iframe, names) {
+  const win = iframe?.contentWindow;
+  if (!win) return;
+  const message = {
+    source: BRIDGE_SOURCE,
+    type: "clear-css-vars",
+    names
+  };
+  win.postMessage(message, "*");
+}
+function installIframeReceiver(target = window) {
+  function handler(event) {
+    const data = event.data;
+    if (!isBridgeMessage(data)) return;
+    if (data.type === "apply-css-vars") {
+      const root = target.document.documentElement;
+      for (const [name, value] of data.vars) {
+        root.style.setProperty(name, value);
+      }
+      return;
+    }
+    if (data.type === "clear-css-vars") {
+      const root = target.document.documentElement;
+      for (const name of data.names) {
+        root.style.removeProperty(name);
+      }
+      return;
+    }
+  }
+  target.addEventListener("message", handler);
+  const parent = target.parent;
+  if (parent && parent !== target) {
+    const ready = { source: BRIDGE_SOURCE, type: "ready" };
+    parent.postMessage(ready, "*");
+  }
+  return () => target.removeEventListener("message", handler);
+}
+function onIframeReady(expectedSource, callback) {
+  function handler(event) {
+    if (expectedSource && event.source !== expectedSource) return;
+    if (!isBridgeMessage(event.data)) return;
+    if (event.data.type === "ready") callback();
+  }
+  window.addEventListener("message", handler);
+  return () => window.removeEventListener("message", handler);
+}
+export {
+  BRIDGE_SOURCE,
+  installIframeReceiver,
+  isBridgeMessage,
+  onIframeReady,
+  sendApplyCssVars,
+  sendClearCssVars
+};

package/dist/theme/index.d.ts

@@ -0,0 +1,9 @@
+export { default as ThemeToggle } from './theme-toggle.js';
+export { default as ColorSchemeProvider, ColorSchemeProviderColorMode, ColorSchemeProviderProps } from './color-scheme-provider.js';
+export { default as DesignTokenTweakPanel, DesignTokenTweakPanelInner } from './design-token-tweak-panel.js';
+export { default as ColorTweakExportModal } from './color-tweak-export-modal.js';
+export { DESIGN_TOKEN_SCHEMA, DeserializeOptions, DeserializeResult, DesignTokenJson, DesignTokenJsonColor, DesignTokenJsonColorBase, DesignTokenJsonOverrides, DesignTokenManifest, DesignTokenSchemaError, SerializeOptions, deserialize, serialize } from './design-token-serde.js';
+export { ColorTweakState, TokenOverrides, TweakState, emptyOverrides } from './design-token-types.js';
+export { ApplyCssVarsMessage, BRIDGE_SOURCE, BridgeMessage, ClearCssVarsMessage, CssVarPair, ErrorMessage, ReadyMessage, installIframeReceiver, isBridgeMessage, onIframeReady, sendApplyCssVars, sendClearCssVars } from './iframe-bridge.js';
+import 'preact';
+import '@takazudo/zdtp';

package/dist/theme/index.js

@@ -0,0 +1,42 @@
+import { default as default2 } from "./theme-toggle.js";
+import { default as default3 } from "./color-scheme-provider.js";
+import {
+  default as default4,
+  DesignTokenTweakPanelInner
+} from "./design-token-tweak-panel.js";
+import { default as default5 } from "./color-tweak-export-modal.js";
+import {
+  DESIGN_TOKEN_SCHEMA,
+  DesignTokenSchemaError,
+  deserialize,
+  serialize
+} from "./design-token-serde.js";
+import {
+  emptyOverrides
+} from "./design-token-types.js";
+import {
+  BRIDGE_SOURCE,
+  isBridgeMessage,
+  installIframeReceiver,
+  onIframeReady,
+  sendApplyCssVars,
+  sendClearCssVars
+} from "./iframe-bridge.js";
+export {
+  BRIDGE_SOURCE,
+  default3 as ColorSchemeProvider,
+  default5 as ColorTweakExportModal,
+  DESIGN_TOKEN_SCHEMA,
+  DesignTokenSchemaError,
+  default4 as DesignTokenTweakPanel,
+  DesignTokenTweakPanelInner,
+  default2 as ThemeToggle,
+  deserialize,
+  emptyOverrides,
+  installIframeReceiver,
+  isBridgeMessage,
+  onIframeReady,
+  sendApplyCssVars,
+  sendClearCssVars,
+  serialize
+};

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

@@ -0,0 +1,17 @@
+import { VNode } from 'preact';
+
+/** @jsxRuntime automatic */
+/** @jsxImportSource preact */
+
+interface ThemeToggleProps {
+    defaultMode?: "light" | "dark";
+}
+/**
+ * Default-export click-toggle for color scheme. Wraps `<ThemeToggleInner>`
+ * in `<Island when="load">` so the SSG renderer emits a
+ * `data-zfb-island="ThemeToggle"` marker the hydration runtime can
+ * find at boot time.
+ */
+declare function ThemeToggle(props?: ThemeToggleProps): VNode;
+
+export { ThemeToggle as default };