@variiant-ui/react-vite 0.1.0

package/README.md

@@ -0,0 +1,31 @@
+# @variiant-ui/react-vite
+
+React + Vite component variant tooling with a compact browser overlay and production-safe variant selection.
+
+## Install
+
+```bash
+npm install @variiant-ui/react-vite
+```
+
+## Usage
+
+```ts
+import { defineConfig } from "vite";
+import react from "@vitejs/plugin-react";
+import { variantPlugin } from "@variiant-ui/react-vite";
+
+export default defineConfig({
+  plugins: [variantPlugin(), react()],
+});
+```
+
+Keep normal component imports in the app and place exploratory variants under a mirrored top-level `.variants/` tree. If production should ship something other than `source`, add a `variant.json` manifest to declare the selected implementation.
+
+Default shortcuts:
+
+- `Cmd/Ctrl + Shift + .` toggles the overlay
+- `Cmd/Ctrl + Alt + ArrowUp/ArrowDown` changes the active mounted component
+- `Cmd/Ctrl + Shift + ArrowLeft/ArrowRight` changes the active variant
+
+See the repo root `README.md` and `docs/` for the architecture, proving app, and adoption notes.

package/dist/index.d.ts

@@ -0,0 +1,31 @@
+import { Plugin } from 'vite';
+export { R as RuntimeState, V as VariantDefinition, a as VariantRuntimeController, b as VariantRuntimeSnapshot, c as VariantRuntimeStorage, d as VariantShortcutConfig, e as createVariantRuntimeController, f as defaultShortcuts, s as setVariantShortcuts } from './runtime-api-CpNtY-8z.js';
+
+type VariantManifest = {
+    source: string;
+    exportName?: string;
+    selected?: string;
+    displayName?: string;
+    variants: string[] | Record<string, string>;
+};
+type VariantTargetEntry = {
+    exportName: string;
+    selected: string;
+    displayName: string;
+    variantImportPaths: Record<string, string>;
+};
+type VariantRegistryEntry = {
+    key: string;
+    sourceAbsolutePath: string;
+    sourceRelativePath: string;
+    sourceImportPath: string;
+    hasDefaultExport: boolean;
+    targets: Record<string, VariantTargetEntry>;
+};
+type VariantPluginOptions = {
+    projectRoot?: string;
+    variantsDir?: string;
+};
+declare function variantPlugin(options?: VariantPluginOptions): Plugin;
+
+export { type VariantManifest, type VariantPluginOptions, type VariantRegistryEntry, variantPlugin };

package/dist/index.js

@@ -0,0 +1,626 @@
+// src/plugin.ts
+import fs from "fs";
+import path from "path";
+var sourceExtensions = [".tsx", ".ts", ".jsx", ".js", ".mts", ".mjs", ".cts", ".cjs"];
+function variantPlugin(options = {}) {
+  let projectRoot = "";
+  let registry = /* @__PURE__ */ new Map();
+  const refreshRegistry = () => {
+    projectRoot = options.projectRoot ? path.resolve(options.projectRoot) : process.cwd();
+    registry = loadRegistry(projectRoot, options.variantsDir ?? ".variants");
+  };
+  return {
+    name: "variiant-react-vite",
+    enforce: "pre",
+    configResolved(config) {
+      projectRoot = options.projectRoot ? path.resolve(options.projectRoot) : config.root;
+      registry = loadRegistry(projectRoot, options.variantsDir ?? ".variants");
+    },
+    configureServer(server) {
+      server.watcher.add(path.join(projectRoot, options.variantsDir ?? ".variants"));
+      const reload = () => {
+        refreshRegistry();
+        server.ws.send({ type: "full-reload" });
+      };
+      server.watcher.on("add", reload);
+      server.watcher.on("change", reload);
+      server.watcher.on("unlink", reload);
+    },
+    async resolveId(source, importer, resolveOptions) {
+      if (!importer || source.startsWith("\0")) {
+        return null;
+      }
+      const normalizedImporter = normalizePath(importer);
+      if (normalizedImporter.startsWith("\0variant-proxy:") || normalizedImporter.includes("/.variants/")) {
+        return null;
+      }
+      const resolved = await this.resolve(source, importer, {
+        ...resolveOptions,
+        skipSelf: true
+      });
+      if (!resolved) {
+        return null;
+      }
+      const entry = registry.get(normalizePath(resolved.id));
+      if (!entry) {
+        return null;
+      }
+      return `\0variant-proxy:${encodeURIComponent(entry.sourceAbsolutePath)}`;
+    },
+    load(id) {
+      if (!id.startsWith("\0variant-proxy:")) {
+        return null;
+      }
+      const sourceAbsolutePath = decodeURIComponent(id.slice("\0variant-proxy:".length));
+      const entry = registry.get(normalizePath(sourceAbsolutePath));
+      if (!entry) {
+        throw new Error(`Missing variant registry entry for ${sourceAbsolutePath}`);
+      }
+      if (this.meta.watchMode) {
+        return buildDevelopmentProxyModule(entry);
+      }
+      return buildProductionProxyModule(entry);
+    }
+  };
+}
+function loadRegistry(projectRoot, variantsDirName) {
+  const variantsRoot = path.join(projectRoot, variantsDirName);
+  const results = /* @__PURE__ */ new Map();
+  if (!fs.existsSync(variantsRoot)) {
+    return results;
+  }
+  loadConventionalVariants(projectRoot, variantsRoot, results);
+  loadManifestVariants(projectRoot, variantsRoot, results);
+  return results;
+}
+function loadConventionalVariants(projectRoot, variantsRoot, results) {
+  const variantFiles = walkForVariantFiles(variantsRoot);
+  for (const variantFilePath of variantFiles) {
+    const relativePath = normalizePath(path.relative(variantsRoot, variantFilePath));
+    const match = parseConventionalVariantPath(relativePath);
+    if (!match) {
+      continue;
+    }
+    const sourceAbsolutePath = normalizePath(path.resolve(projectRoot, match.sourceRelativePath));
+    const entry = ensureRegistryEntry(results, projectRoot, sourceAbsolutePath, match.sourceRelativePath);
+    const target = ensureTargetEntry(entry, {
+      exportName: match.exportName,
+      selected: "source",
+      displayName: deriveDisplayName(match.sourceRelativePath, match.exportName)
+    });
+    if (match.variantName in target.variantImportPaths) {
+      throw new Error(
+        `Duplicate conventional variant "${match.variantName}" for ${match.sourceRelativePath}#${match.exportName}.`
+      );
+    }
+    target.variantImportPaths[match.variantName] = toImportPath(variantFilePath);
+  }
+}
+function loadManifestVariants(projectRoot, variantsRoot, results) {
+  const configPaths = walkForVariantConfigs(variantsRoot);
+  for (const configPath of configPaths) {
+    const configDir = path.dirname(configPath);
+    const parsed = JSON.parse(fs.readFileSync(configPath, "utf8"));
+    if (!parsed.source || typeof parsed.source !== "string") {
+      throw new Error(`Variant config ${configPath} must declare a string "source".`);
+    }
+    if (!parsed.variants || !Array.isArray(parsed.variants) && typeof parsed.variants !== "object") {
+      throw new Error(`Variant config ${configPath} must declare "variants".`);
+    }
+    const sourceRelativePath = normalizePath(parsed.source);
+    const sourceAbsolutePath = normalizePath(path.resolve(projectRoot, sourceRelativePath));
+    const exportName = parsed.exportName ?? "default";
+    const variantImportPaths = resolveVariantImportPaths(configDir, parsed.variants);
+    const selected = parsed.selected ?? "source";
+    if (selected !== "source" && !(selected in variantImportPaths)) {
+      throw new Error(
+        `Variant config ${configPath} selects "${selected}" but no matching variant file was found.`
+      );
+    }
+    const entry = ensureRegistryEntry(results, projectRoot, sourceAbsolutePath, sourceRelativePath);
+    const target = ensureTargetEntry(entry, {
+      exportName,
+      selected,
+      displayName: parsed.displayName ?? deriveDisplayName(sourceRelativePath, exportName)
+    });
+    if (Object.keys(target.variantImportPaths).length > 0) {
+      throw new Error(
+        `Duplicate variant target for ${sourceRelativePath}#${exportName}. Remove either the manifest or the conventional variant folder.`
+      );
+    }
+    target.selected = selected;
+    target.displayName = parsed.displayName ?? target.displayName;
+    target.variantImportPaths = variantImportPaths;
+  }
+}
+function walkForVariantConfigs(rootDir) {
+  const results = [];
+  const walk = (currentDir) => {
+    for (const entry of fs.readdirSync(currentDir, { withFileTypes: true })) {
+      const entryPath = path.join(currentDir, entry.name);
+      if (entry.isDirectory()) {
+        walk(entryPath);
+        continue;
+      }
+      if (entry.isFile() && entry.name === "variant.json") {
+        results.push(entryPath);
+      }
+    }
+  };
+  walk(rootDir);
+  return results.sort();
+}
+function walkForVariantFiles(rootDir) {
+  const results = [];
+  const walk = (currentDir) => {
+    for (const entry of fs.readdirSync(currentDir, { withFileTypes: true })) {
+      const entryPath = path.join(currentDir, entry.name);
+      if (entry.isDirectory()) {
+        walk(entryPath);
+        continue;
+      }
+      if (entry.isFile() && entry.name !== "variant.json" && sourceExtensions.some((extension) => entry.name.endsWith(extension))) {
+        results.push(normalizePath(entryPath));
+      }
+    }
+  };
+  walk(rootDir);
+  return results.sort();
+}
+function parseConventionalVariantPath(relativePath) {
+  const segments = relativePath.split("/").filter(Boolean);
+  if (segments.length < 3) {
+    return null;
+  }
+  const sourceSegmentIndex = findSourceSegmentIndex(segments);
+  if (sourceSegmentIndex === -1 || sourceSegmentIndex !== segments.length - 3) {
+    return null;
+  }
+  const exportName = segments[sourceSegmentIndex + 1];
+  const variantFileName = segments[sourceSegmentIndex + 2];
+  const extension = sourceExtensions.find((candidate) => variantFileName.endsWith(candidate));
+  if (!extension) {
+    return null;
+  }
+  const variantName = variantFileName.slice(0, -extension.length);
+  if (!exportName || !variantName) {
+    return null;
+  }
+  return {
+    sourceRelativePath: segments.slice(0, sourceSegmentIndex + 1).join("/"),
+    exportName,
+    variantName
+  };
+}
+function findSourceSegmentIndex(segments) {
+  for (let index = segments.length - 3; index >= 0; index -= 1) {
+    if (sourceExtensions.some((extension) => segments[index]?.endsWith(extension))) {
+      return index;
+    }
+  }
+  return -1;
+}
+function resolveVariantImportPaths(configDir, variants) {
+  if (Array.isArray(variants)) {
+    return Object.fromEntries(
+      variants.map((variantName) => [
+        variantName,
+        toImportPath(resolveFile(configDir, variantName))
+      ])
+    );
+  }
+  return Object.fromEntries(
+    Object.entries(variants).map(([variantName, relativePath]) => [
+      variantName,
+      toImportPath(resolveCustomPath(configDir, relativePath))
+    ])
+  );
+}
+function resolveFile(configDir, variantName) {
+  for (const extension of sourceExtensions) {
+    const candidate = path.join(configDir, `${variantName}${extension}`);
+    if (fs.existsSync(candidate)) {
+      return normalizePath(candidate);
+    }
+  }
+  throw new Error(
+    `Could not find variant file for "${variantName}" in ${configDir}. Expected one of ${sourceExtensions.join(", ")}.`
+  );
+}
+function resolveCustomPath(configDir, relativePath) {
+  const absolute = normalizePath(path.resolve(configDir, relativePath));
+  if (fs.existsSync(absolute)) {
+    return absolute;
+  }
+  throw new Error(`Variant file ${relativePath} does not exist in ${configDir}.`);
+}
+function ensureRegistryEntry(results, projectRoot, sourceAbsolutePath, sourceRelativePath) {
+  const existing = results.get(sourceAbsolutePath);
+  if (existing) {
+    return existing;
+  }
+  const created = {
+    key: sourceRelativePath,
+    sourceAbsolutePath,
+    sourceRelativePath,
+    sourceImportPath: toImportPath(sourceAbsolutePath),
+    hasDefaultExport: detectHasDefaultExport(sourceAbsolutePath),
+    targets: {}
+  };
+  created.key = normalizePath(path.relative(projectRoot, sourceAbsolutePath));
+  results.set(sourceAbsolutePath, created);
+  return created;
+}
+function ensureTargetEntry(entry, target) {
+  const existing = entry.targets[target.exportName];
+  if (existing) {
+    return existing;
+  }
+  const created = {
+    exportName: target.exportName,
+    selected: target.selected,
+    displayName: target.displayName,
+    variantImportPaths: {}
+  };
+  entry.targets[target.exportName] = created;
+  return created;
+}
+function buildDevelopmentProxyModule(entry) {
+  const importLines = [
+    `export * from ${JSON.stringify(entry.sourceImportPath)};`,
+    `import * as SourceModule from ${JSON.stringify(entry.sourceImportPath)};`,
+    `import { createVariantProxy, installVariantOverlay } from "@variiant-ui/react-vite/runtime";`
+  ];
+  const outputLines = ["installVariantOverlay();"];
+  for (const target of sortTargets(entry.targets)) {
+    if (target.exportName === "default" && !entry.hasDefaultExport) {
+      throw new Error(
+        `Variant target ${entry.sourceRelativePath}#default requires the source module to have a default export.`
+      );
+    }
+    const targetIdentifier = toIdentifier(target.exportName === "default" ? "default" : target.exportName);
+    const variantsIdentifier = `${targetIdentifier}Variants`;
+    const proxyIdentifier = `${targetIdentifier}VariantProxy`;
+    const variantLines = [`  source: ${getSourceAccessExpression(target.exportName)},`];
+    for (const [variantName, importPath] of Object.entries(target.variantImportPaths)) {
+      const identifier = toIdentifier(`${target.exportName}-${variantName}`);
+      importLines.push(`import ${identifier} from ${JSON.stringify(importPath)};`);
+      variantLines.push(`  ${JSON.stringify(variantName)}: ${identifier},`);
+    }
+    outputLines.push(`const ${variantsIdentifier} = {`);
+    outputLines.push(variantLines.join("\n"));
+    outputLines.push("};");
+    outputLines.push("");
+    outputLines.push(`const ${proxyIdentifier} = createVariantProxy({`);
+    outputLines.push(`  sourceId: ${JSON.stringify(buildSourceId(entry.sourceRelativePath, target.exportName))},`);
+    outputLines.push(`  displayName: ${JSON.stringify(target.displayName)},`);
+    outputLines.push(`  selected: ${JSON.stringify(target.selected)},`);
+    outputLines.push(`  variants: ${variantsIdentifier},`);
+    outputLines.push("});");
+    outputLines.push("");
+    outputLines.push(buildVariantExport(target.exportName, proxyIdentifier));
+    outputLines.push("");
+  }
+  if (entry.hasDefaultExport && !("default" in entry.targets)) {
+    outputLines.push("export default SourceModule.default;");
+  }
+  return `${importLines.join("\n")}
+
+${outputLines.join("\n")}
+`;
+}
+function buildProductionProxyModule(entry) {
+  const lines = [`export * from ${JSON.stringify(entry.sourceImportPath)};`];
+  const defaultTarget = entry.targets.default;
+  if (defaultTarget?.selected && defaultTarget.selected !== "source") {
+    const selectedImport = defaultTarget.variantImportPaths[defaultTarget.selected];
+    lines.push(`export { default } from ${JSON.stringify(selectedImport)};`);
+  } else if (entry.hasDefaultExport) {
+    lines.push(`export { default } from ${JSON.stringify(entry.sourceImportPath)};`);
+  }
+  for (const target of sortTargets(entry.targets)) {
+    if (target.exportName === "default" || target.selected === "source") {
+      continue;
+    }
+    const selectedImport = target.variantImportPaths[target.selected];
+    lines.push(`export { default as ${target.exportName} } from ${JSON.stringify(selectedImport)};`);
+  }
+  return `${lines.join("\n")}
+`;
+}
+function sortTargets(targets) {
+  return Object.values(targets).sort((left, right) => {
+    if (left.exportName === "default") {
+      return -1;
+    }
+    if (right.exportName === "default") {
+      return 1;
+    }
+    return left.exportName.localeCompare(right.exportName);
+  });
+}
+function getSourceAccessExpression(exportName) {
+  return exportName === "default" ? "SourceModule.default" : `SourceModule[${JSON.stringify(exportName)}]`;
+}
+function deriveDisplayName(sourceRelativePath, exportName) {
+  if (exportName !== "default") {
+    return exportName;
+  }
+  const extension = sourceExtensions.find((candidate) => sourceRelativePath.endsWith(candidate)) ?? "";
+  const fileName = path.posix.basename(sourceRelativePath, extension);
+  const displayName = fileName === "index" ? path.posix.basename(path.posix.dirname(sourceRelativePath)) : fileName;
+  return humanize(displayName);
+}
+function humanize(value) {
+  return value.replace(/([a-z0-9])([A-Z])/g, "$1 $2").replace(/[-_]+/g, " ").replace(/\b\w/g, (match) => match.toUpperCase());
+}
+function detectHasDefaultExport(sourceAbsolutePath) {
+  if (!fs.existsSync(sourceAbsolutePath)) {
+    return false;
+  }
+  const source = fs.readFileSync(sourceAbsolutePath, "utf8");
+  return /\bexport\s+default\b/.test(source) || /\bas\s+default\b/.test(source);
+}
+function toIdentifier(name) {
+  const safeName = name.replace(/[^a-zA-Z0-9]+(.)/g, (_match, nextCharacter) => nextCharacter.toUpperCase()).replace(/[^a-zA-Z0-9]/g, "");
+  return `${safeName.charAt(0).toUpperCase() + safeName.slice(1)}Variant`;
+}
+function normalizePath(value) {
+  return value.split(path.sep).join(path.posix.sep);
+}
+function toImportPath(value) {
+  return normalizePath(value);
+}
+function buildSourceId(sourceRelativePath, exportName) {
+  return exportName === "default" ? sourceRelativePath : `${sourceRelativePath}#${exportName}`;
+}
+function buildVariantExport(exportName, proxyIdentifier) {
+  return exportName === "default" ? `export default ${proxyIdentifier};` : `export { ${proxyIdentifier} as ${exportName} };`;
+}
+
+// src/runtime-core.ts
+var defaultShortcuts = {
+  toggleOverlay: ["meta+shift+.", "ctrl+shift+."],
+  nextComponent: ["meta+alt+arrowdown", "ctrl+alt+arrowdown"],
+  previousComponent: ["meta+alt+arrowup", "ctrl+alt+arrowup"],
+  nextVariant: ["meta+shift+arrowright", "ctrl+shift+arrowright"],
+  previousVariant: ["meta+shift+arrowleft", "ctrl+shift+arrowleft"],
+  closeOverlay: "escape"
+};
+function rotate(items, currentIndex, direction) {
+  if (items.length === 0) {
+    return null;
+  }
+  const nextIndex = (currentIndex + direction + items.length) % items.length;
+  return items[nextIndex] ?? null;
+}
+function getMountedComponents(state) {
+  return state.components.filter((component) => component.mountedCount > 0);
+}
+function getActiveMountedComponent(state) {
+  const mounted = getMountedComponents(state);
+  return mounted.find((component) => component.sourceId === state.activeSourceId) ?? mounted[0] ?? null;
+}
+function createVariantRuntimeController(options = {}) {
+  const storage = options.storage;
+  const listeners = /* @__PURE__ */ new Set();
+  const definitions = /* @__PURE__ */ new Map();
+  const mountedCounts = /* @__PURE__ */ new Map();
+  const state = {
+    overlayOpen: false,
+    activeSourceId: null,
+    components: [],
+    selections: storage?.readSelections() ?? {},
+    shortcutConfig: {
+      ...defaultShortcuts,
+      ...storage?.readShortcutOverrides() ?? {}
+    }
+  };
+  const emit = () => {
+    state.components = Array.from(definitions.values()).map((definition) => ({
+      ...definition,
+      selected: state.selections[definition.sourceId] ?? definition.selected,
+      mountedCount: mountedCounts.get(definition.sourceId) ?? 0
+    })).sort((left, right) => left.displayName.localeCompare(right.displayName));
+    const mounted = getMountedComponents(state);
+    if (!mounted.some((component) => component.sourceId === state.activeSourceId)) {
+      state.activeSourceId = mounted[0]?.sourceId ?? null;
+    }
+    for (const listener of listeners) {
+      listener();
+    }
+  };
+  const persistSelections = () => {
+    storage?.writeSelections(state.selections);
+  };
+  const persistShortcuts = () => {
+    storage?.writeShortcutOverrides(state.shortcutConfig);
+  };
+  const moveActiveComponent = (direction) => {
+    const mounted = getMountedComponents(state);
+    if (mounted.length === 0) {
+      return;
+    }
+    const currentIndex = mounted.findIndex((component) => component.sourceId === state.activeSourceId);
+    const current = currentIndex >= 0 ? currentIndex : 0;
+    const next = rotate(mounted, current, direction);
+    if (!next) {
+      return;
+    }
+    state.activeSourceId = next.sourceId;
+    emit();
+  };
+  const moveVariant = (direction) => {
+    const active = getActiveMountedComponent(state);
+    if (!active) {
+      return;
+    }
+    const currentIndex = active.variantNames.findIndex(
+      (variantName) => variantName === (state.selections[active.sourceId] ?? active.selected)
+    );
+    const current = currentIndex >= 0 ? currentIndex : 0;
+    const next = rotate(active.variantNames, current, direction);
+    if (!next) {
+      return;
+    }
+    state.selections[active.sourceId] = next;
+    persistSelections();
+    emit();
+  };
+  return {
+    define(definition) {
+      const existing = definitions.get(definition.sourceId);
+      definitions.set(definition.sourceId, {
+        ...definition,
+        displayName: definition.displayName || existing?.displayName || definition.sourceId,
+        variantNames: Array.from(
+          /* @__PURE__ */ new Set([...existing?.variantNames ?? [], ...definition.variantNames])
+        )
+      });
+      if (!(definition.sourceId in state.selections)) {
+        state.selections[definition.sourceId] = definition.selected;
+        persistSelections();
+      }
+      emit();
+    },
+    mount(sourceId) {
+      mountedCounts.set(sourceId, (mountedCounts.get(sourceId) ?? 0) + 1);
+      emit();
+      return () => {
+        mountedCounts.set(sourceId, Math.max((mountedCounts.get(sourceId) ?? 1) - 1, 0));
+        emit();
+      };
+    },
+    getSelectedVariant(sourceId, fallback) {
+      return state.selections[sourceId] ?? fallback;
+    },
+    getSnapshot() {
+      return {
+        overlayOpen: state.overlayOpen,
+        activeSourceId: state.activeSourceId,
+        components: state.components,
+        selections: state.selections,
+        shortcutConfig: state.shortcutConfig
+      };
+    },
+    subscribe(listener) {
+      listeners.add(listener);
+      return () => {
+        listeners.delete(listener);
+      };
+    },
+    actions: {
+      toggleOverlay() {
+        state.overlayOpen = !state.overlayOpen;
+        emit();
+      },
+      closeOverlay() {
+        if (!state.overlayOpen) {
+          return;
+        }
+        state.overlayOpen = false;
+        emit();
+      },
+      nextComponent() {
+        moveActiveComponent(1);
+      },
+      previousComponent() {
+        moveActiveComponent(-1);
+      },
+      nextVariant() {
+        moveVariant(1);
+      },
+      previousVariant() {
+        moveVariant(-1);
+      },
+      selectComponent(sourceId) {
+        state.activeSourceId = sourceId;
+        emit();
+      },
+      selectVariant(sourceId, variantName) {
+        const component = state.components.find((candidate) => candidate.sourceId === sourceId);
+        if (!component || !component.variantNames.includes(variantName)) {
+          return;
+        }
+        state.selections[sourceId] = variantName;
+        persistSelections();
+        emit();
+      },
+      configureShortcuts(overrides) {
+        if (!overrides) {
+          return;
+        }
+        state.shortcutConfig = {
+          ...state.shortcutConfig,
+          ...overrides
+        };
+        persistShortcuts();
+        emit();
+      }
+    }
+  };
+}
+
+// src/runtime-singleton.ts
+var storageKey = "variant:component-selections";
+var shortcutStorageKey = "variant:shortcut-config";
+var globalControllerKey = "__variant_runtime_controller__";
+function createBrowserStorage() {
+  return {
+    readSelections() {
+      if (typeof window === "undefined") {
+        return {};
+      }
+      try {
+        const raw = window.localStorage.getItem(storageKey);
+        return raw ? JSON.parse(raw) : {};
+      } catch {
+        return {};
+      }
+    },
+    writeSelections(selections) {
+      if (typeof window === "undefined") {
+        return;
+      }
+      window.localStorage.setItem(storageKey, JSON.stringify(selections));
+    },
+    readShortcutOverrides() {
+      if (typeof window === "undefined") {
+        return {};
+      }
+      try {
+        const raw = window.localStorage.getItem(shortcutStorageKey);
+        return raw ? JSON.parse(raw) : {};
+      } catch {
+        return {};
+      }
+    },
+    writeShortcutOverrides(shortcutConfig) {
+      if (typeof window === "undefined") {
+        return;
+      }
+      window.localStorage.setItem(shortcutStorageKey, JSON.stringify(shortcutConfig));
+    }
+  };
+}
+function getVariantRuntimeController() {
+  const target = globalThis;
+  if (!target[globalControllerKey]) {
+    target[globalControllerKey] = createVariantRuntimeController({
+      storage: createBrowserStorage()
+    });
+  }
+  return target[globalControllerKey];
+}
+
+// src/runtime-api.ts
+function setVariantShortcuts(shortcuts) {
+  getVariantRuntimeController().actions.configureShortcuts(shortcuts);
+}
+export {
+  createVariantRuntimeController,
+  defaultShortcuts,
+  setVariantShortcuts,
+  variantPlugin
+};
+//# sourceMappingURL=index.js.map