@geenius/storybook 0.1.0

package/CHANGELOG.md

@@ -0,0 +1,3 @@
+# Changelog
+
+All notable changes to this project will be documented in this file.

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 Antigravity
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,135 @@
+# @geenius/storybook
+
+Shared storybook shell, theme, layout, and Vite preset for all `@geenius` packages.
+
+Provides a consistent look-and-feel, design tokens, and development infrastructure so every package storybook (React, SolidJS, Vue, Svelte) shares the same UI shell without duplicating code.
+
+## Installation
+
+```bash
+pnpm add @geenius/storybook
+```
+
+## What's Inside
+
+| Export | Description |
+|---|---|
+| `@geenius/storybook` | Barrel — all types, surface utils, runtime utils, Vite preset |
+| `@geenius/storybook/surface` | Story catalog definition and query utilities |
+| `@geenius/storybook/react` | Shared React storybook shell and layout primitives |
+| `@geenius/storybook/solidjs` | Shared SolidJS storybook shell and layout primitives |
+| `@geenius/storybook/types` | TypeScript type definitions |
+| `@geenius/storybook/utils` | Hash routing, theme management, keyboard shortcuts |
+| `@geenius/storybook/vite` | `createStorybookViteConfig()` factory |
+| `@geenius/storybook/styles` | Shell layout CSS (sidebar, panels, dashboard, comparison) |
+| `@geenius/storybook/theme` | Component design tokens (OKLCH dark/light + Tailwind v4 `@theme`) |
+| `@geenius/storybook/html` | Base HTML template with font imports |
+
+## Quick Start
+
+### 1. Define your story surface
+
+```ts
+// apps/storybook-react/src/surface.ts
+import { defineSurface } from '@geenius/storybook/surface'
+
+export const SURFACE = defineSurface([
+  {
+    title: 'Primitives',
+    stories: [
+      { id: 'button', label: 'Button' },
+      { id: 'input', label: 'Input' },
+    ],
+  },
+])
+```
+
+### 2. Create a Vite config
+
+```ts
+// apps/storybook-react/vite.config.ts
+import { createStorybookViteConfig } from '@geenius/storybook/vite'
+import react from '@vitejs/plugin-react'
+import tailwindcss from '@tailwindcss/vite'
+
+export default createStorybookViteConfig({
+  framework: 'react',
+  port: 3050,
+  plugins: [react()],
+  tailwind: tailwindcss(),
+})
+```
+
+### 3. Import styles
+
+```css
+/* apps/storybook-react/src/index.css */
+@import "@geenius/storybook/styles";
+@import "@geenius/storybook/theme";
+@import "tailwindcss";
+```
+
+### 4. Use shell classes in your App
+
+```tsx
+import { ReactStorybookApp } from '@geenius/storybook/react'
+
+export function App() {
+  return (
+    <ReactStorybookApp
+      packageName="Geenius UI"
+      frameworkLabel="React"
+      overview="Shared component stories with the standard Geenius shell."
+      sections={SURFACE}
+      components={COMPONENTS}
+      defaultStoryId="button"
+    />
+  )
+}
+```
+
+## Shell CSS Classes
+
+All classes use the `gsb-` prefix to avoid collisions.
+
+### Layout
+- `.gsb-shell` — Root grid (sidebar + main)
+- `.gsb-sidebar` — Sticky sidebar with blur backdrop
+- `.gsb-main` / `.gsb-main__inner` — Constrained content area
+
+### Sidebar
+- `.gsb-sidebar__item` — Nav item (add `.is-active` for selected state)
+- `.gsb-sidebar__section` / `__section-title` — Grouped sections
+- `.gsb-search__input` — Filter input
+- `.gsb-theme-toggle` — Theme switch button
+
+### Content
+- `.gsb-hero` — Landing hero card
+- `.gsb-comparison` — 2-column TW vs CSS comparison grid
+- `.gsb-comparison__canvas` — Individual comparison pane
+- `.gsb-card` — Content card (modifiers: `--accent`, `--success`, `--warning`, `--danger`, `--interactive`)
+- `.gsb-metrics` / `.gsb-metric` — Stats grid
+- `.gsb-note` — Callout (modifiers: `--warning`, `--success`, `--danger`)
+
+### Utilities
+- `.gsb-stack` — Vertical flex gap
+- `.gsb-inline` — Horizontal flex wrap
+- `.gsb-frame` — Bordered container
+- `.gsb-pill` / `.gsb-pill--accent` — Tag/badge
+- `.gsb-eyebrow` — Uppercase label
+- `.gsb-count` — Numeric badge
+- `.gsb-muted` — Muted text
+
+### Responsive
+- `<= 860px`: Sidebar becomes mobile drawer (`.is-open` + `.gsb-backdrop`)
+- `<= 1080px`: 3-column grids collapse to 2
+- `<= 640px`: Tighter padding
+
+## Package Contract
+
+This package follows the [Geenius Package Golden Standard](../PACKAGE_GOLDEN_STANDARD.md).
+
+- Versioned via **Changesets**
+- CI: `ci.yml` (lint + build + test on PR/push)
+- Release: `release.yml` (changesets/action on main)
+- ESM-only, Node >= 20

package/dist/chunk-FB7KPF72.js

@@ -0,0 +1,65 @@
+// src/surface.ts
+function defineSurface(surface) {
+  return surface;
+}
+function getSurfaceIds(surface) {
+  return surface.flatMap(
+    (section) => section.stories.map((story) => story.id)
+  );
+}
+function getSurfaceEntries(surface) {
+  return surface.flatMap((section) => [...section.stories]);
+}
+function getSurfaceComponentCount(surface) {
+  return surface.reduce((sum, section) => sum + section.stories.length, 0);
+}
+function findSurfaceEntry(surface, id) {
+  for (const section of surface) {
+    const entry = section.stories.find((s) => s.id === id);
+    if (entry) return entry;
+  }
+  return void 0;
+}
+function findSurfaceSection(surface, storyId) {
+  return surface.find(
+    (section) => section.stories.some((s) => s.id === storyId)
+  );
+}
+function filterSurface(surface, query) {
+  const q = query.toLowerCase().trim();
+  if (!q) return [...surface];
+  return surface.map((section) => ({
+    ...section,
+    stories: section.stories.filter(
+      (story) => story.label.toLowerCase().includes(q) || story.id.toLowerCase().includes(q) || story.description?.toLowerCase().includes(q) || story.tags?.some((tag) => tag.toLowerCase().includes(q))
+    )
+  })).filter((section) => section.stories.length > 0);
+}
+function getSurfaceSnapshot(surface) {
+  return surface.map((section) => ({
+    title: section.title,
+    stories: section.stories.map((story) => ({
+      id: story.id,
+      label: story.label,
+      description: story.description,
+      tags: story.tags
+    }))
+  }));
+}
+function validateSurface(surface) {
+  const seen = /* @__PURE__ */ new Set();
+  const duplicates = [];
+  for (const section of surface) {
+    for (const story of section.stories) {
+      if (seen.has(story.id)) {
+        duplicates.push(story.id);
+      }
+      seen.add(story.id);
+    }
+  }
+  return duplicates;
+}
+
+export { defineSurface, filterSurface, findSurfaceEntry, findSurfaceSection, getSurfaceComponentCount, getSurfaceEntries, getSurfaceIds, getSurfaceSnapshot, validateSurface };
+//# sourceMappingURL=chunk-FB7KPF72.js.map
+//# sourceMappingURL=chunk-FB7KPF72.js.map

package/dist/chunk-FB7KPF72.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/surface.ts"],"names":[],"mappings":";AAqBO,SAAS,cAA4C,OAAA,EAAe;AACzE,EAAA,OAAO,OAAA;AACT;AAGO,SAAS,cAAc,OAAA,EAAiC;AAC7D,EAAA,OAAO,OAAA,CAAQ,OAAA;AAAA,IAAQ,CAAC,YACtB,OAAA,CAAQ,OAAA,CAAQ,IAAI,CAAC,KAAA,KAAU,MAAM,EAAE;AAAA,GACzC;AACF;AAGO,SAAS,kBAAkB,OAAA,EAA4C;AAC5E,EAAA,OAAO,OAAA,CAAQ,QAAQ,CAAC,OAAA,KAAY,CAAC,GAAG,OAAA,CAAQ,OAAO,CAAC,CAAA;AAC1D;AAGO,SAAS,yBAAyB,OAAA,EAA+B;AACtE,EAAA,OAAO,OAAA,CAAQ,OAAO,CAAC,GAAA,EAAK,YAAY,GAAA,GAAM,OAAA,CAAQ,OAAA,CAAQ,MAAA,EAAQ,CAAC,CAAA;AACzE;AAGO,SAAS,gBAAA,CACd,SACA,EAAA,EAC+B;AAC/B,EAAA,KAAA,MAAW,WAAW,OAAA,EAAS;AAC7B,IAAA,MAAM,KAAA,GAAQ,QAAQ,OAAA,CAAQ,IAAA,CAAK,CAAC,CAAA,KAAM,CAAA,CAAE,OAAO,EAAE,CAAA;AACrD,IAAA,IAAI,OAAO,OAAO,KAAA;AAAA,EACpB;AACA,EAAA,OAAO,MAAA;AACT;AAGO,SAAS,kBAAA,CACd,SACA,OAAA,EACiC;AACjC,EAAA,OAAO,OAAA,CAAQ,IAAA;AAAA,IAAK,CAAC,YACnB,OAAA,CAAQ,OAAA,CAAQ,KAAK,CAAC,CAAA,KAAM,CAAA,CAAE,EAAA,KAAO,OAAO;AAAA,GAC9C;AACF;AAOO,SAAS,aAAA,CACd,SACA,KAAA,EACuB;AACvB,EAAA,MAAM,CAAA,GAAI,KAAA,CAAM,WAAA,EAAY,CAAE,IAAA,EAAK;AACnC,EAAA,IAAI,CAAC,CAAA,EAAG,OAAO,CAAC,GAAG,OAAO,CAAA;AAE1B,EAAA,OAAO,OAAA,CACJ,GAAA,CAAI,CAAC,OAAA,MAAa;AAAA,IACjB,GAAG,OAAA;AAAA,IACH,OAAA,EAAS,QAAQ,OAAA,CAAQ,MAAA;AAAA,MACvB,CAAC,KAAA,KACC,KAAA,CAAM,KAAA,CAAM,aAAY,CAAE,QAAA,CAAS,CAAC,CAAA,IACpC,KAAA,CAAM,EAAA,CAAG,WAAA,EAAY,CAAE,SAAS,CAAC,CAAA,IACjC,KAAA,CAAM,WAAA,EAAa,WAAA,EAAY,CAAE,QAAA,CAAS,CAAC,KAC3C,KAAA,CAAM,IAAA,EAAM,IAAA,CAAK,CAAC,QAAQ,GAAA,CAAI,WAAA,EAAY,CAAE,QAAA,CAAS,CAAC,CAAC;AAAA;AAC3D,GACF,CAAE,EACD,MAAA,CAAO,CAAC,YAAY,OAAA,CAAQ,OAAA,CAAQ,SAAS,CAAC,CAAA;AACnD;AAMO,SAAS,mBACd,OAAA,EASE;AACF,EAAA,OAAO,OAAA,CAAQ,GAAA,CAAI,CAAC,OAAA,MAAa;AAAA,IAC/B,OAAO,OAAA,CAAQ,KAAA;AAAA,IACf,OAAA,EAAS,OAAA,CAAQ,OAAA,CAAQ,GAAA,CAAI,CAAC,KAAA,MAAW;AAAA,MACvC,IAAI,KAAA,CAAM,EAAA;AAAA,MACV,OAAO,KAAA,CAAM,KAAA;AAAA,MACb,aAAa,KAAA,CAAM,WAAA;AAAA,MACnB,MAAM,KAAA,CAAM;AAAA,KACd,CAAE;AAAA,GACJ,CAAE,CAAA;AACJ;AAMO,SAAS,gBAAgB,OAAA,EAAiC;AAC/D,EAAA,MAAM,IAAA,uBAAW,GAAA,EAAY;AAC7B,EAAA,MAAM,aAAuB,EAAC;AAE9B,EAAA,KAAA,MAAW,WAAW,OAAA,EAAS;AAC7B,IAAA,KAAA,MAAW,KAAA,IAAS,QAAQ,OAAA,EAAS;AACnC,MAAA,IAAI,IAAA,CAAK,GAAA,CAAI,KAAA,CAAM,EAAE,CAAA,EAAG;AACtB,QAAA,UAAA,CAAW,IAAA,CAAK,MAAM,EAAE,CAAA;AAAA,MAC1B;AACA,MAAA,IAAA,CAAK,GAAA,CAAI,MAAM,EAAE,CAAA;AAAA,IACnB;AAAA,EACF;AAEA,EAAA,OAAO,UAAA;AACT","file":"chunk-FB7KPF72.js","sourcesContent":["/* ============================================================================\n   @geenius/storybook — Story Surface Utilities\n   ============================================================================\n   Framework-agnostic helpers for defining, querying, and validating the\n   story catalog that drives sidebar navigation and dashboards.\n   ============================================================================ */\n\nimport type {\n  StorySurface,\n  StorySurfaceEntry,\n  StorySurfaceSection,\n} from './types.js'\n\n// Re-export types for convenience\nexport type { StorySurface, StorySurfaceEntry, StorySurfaceSection }\n\n/**\n * Define a story surface with type-safety.\n * The `as const satisfies` pattern is applied by the consumer; this helper\n * validates and returns the surface unchanged.\n */\nexport function defineSurface<const T extends StorySurface>(surface: T): T {\n  return surface\n}\n\n/** Extract a flat array of all story IDs from a surface. */\nexport function getSurfaceIds(surface: StorySurface): string[] {\n  return surface.flatMap((section) =>\n    section.stories.map((story) => story.id),\n  )\n}\n\n/** Extract a flat array of all story entries from a surface. */\nexport function getSurfaceEntries(surface: StorySurface): StorySurfaceEntry[] {\n  return surface.flatMap((section) => [...section.stories])\n}\n\n/** Get the total component count across all sections. */\nexport function getSurfaceComponentCount(surface: StorySurface): number {\n  return surface.reduce((sum, section) => sum + section.stories.length, 0)\n}\n\n/** Look up a story entry by ID. Returns `undefined` if not found. */\nexport function findSurfaceEntry(\n  surface: StorySurface,\n  id: string,\n): StorySurfaceEntry | undefined {\n  for (const section of surface) {\n    const entry = section.stories.find((s) => s.id === id)\n    if (entry) return entry\n  }\n  return undefined\n}\n\n/** Look up which section a story belongs to. */\nexport function findSurfaceSection(\n  surface: StorySurface,\n  storyId: string,\n): StorySurfaceSection | undefined {\n  return surface.find((section) =>\n    section.stories.some((s) => s.id === storyId),\n  )\n}\n\n/**\n * Filter a surface by a search query (case-insensitive match against\n * story label, id, or description). Returns a new surface with only\n * matching entries, omitting empty sections.\n */\nexport function filterSurface(\n  surface: StorySurface,\n  query: string,\n): StorySurfaceSection[] {\n  const q = query.toLowerCase().trim()\n  if (!q) return [...surface]\n\n  return surface\n    .map((section) => ({\n      ...section,\n      stories: section.stories.filter(\n        (story) =>\n          story.label.toLowerCase().includes(q) ||\n          story.id.toLowerCase().includes(q) ||\n          story.description?.toLowerCase().includes(q) ||\n          story.tags?.some((tag) => tag.toLowerCase().includes(q)),\n      ),\n    }))\n    .filter((section) => section.stories.length > 0)\n}\n\n/**\n * Create a JSON-serialisable snapshot of the surface for testing\n * or documentation generation.\n */\nexport function getSurfaceSnapshot(\n  surface: StorySurface,\n): {\n  title: string\n  stories: {\n    id: string\n    label: string\n    description?: string\n    tags?: readonly string[]\n  }[]\n}[] {\n  return surface.map((section) => ({\n    title: section.title,\n    stories: section.stories.map((story) => ({\n      id: story.id,\n      label: story.label,\n      description: story.description,\n      tags: story.tags,\n    })),\n  }))\n}\n\n/**\n * Validate that all story IDs in a surface are unique.\n * Returns an array of duplicate IDs (empty if valid).\n */\nexport function validateSurface(surface: StorySurface): string[] {\n  const seen = new Set<string>()\n  const duplicates: string[] = []\n\n  for (const section of surface) {\n    for (const story of section.stories) {\n      if (seen.has(story.id)) {\n        duplicates.push(story.id)\n      }\n      seen.add(story.id)\n    }\n  }\n\n  return duplicates\n}\n"]}

package/dist/chunk-IEHIPVSX.js

@@ -0,0 +1,65 @@
+// src/utils.ts
+function getHashRoute(validIds) {
+  if (typeof window === "undefined") return "dashboard";
+  const hash = window.location.hash.replace("#/", "").replace("#", "");
+  if (!hash || hash === "dashboard") return "dashboard";
+  if (validIds.includes(hash)) return hash;
+  return "dashboard";
+}
+function setHashRoute(view) {
+  if (typeof window === "undefined") return;
+  window.location.hash = `#/${view}`;
+}
+var THEME_STORAGE_KEY = "geenius-storybook-theme";
+function getStoredTheme(fallback = "dark") {
+  if (typeof window === "undefined") return fallback;
+  const stored = localStorage.getItem(THEME_STORAGE_KEY);
+  if (stored === "dark" || stored === "light" || stored === "system") {
+    return stored;
+  }
+  return fallback;
+}
+function setStoredTheme(mode) {
+  if (typeof window === "undefined") return;
+  localStorage.setItem(THEME_STORAGE_KEY, mode);
+}
+function resolveTheme(mode) {
+  if (mode !== "system") return mode;
+  if (typeof window === "undefined") return "dark";
+  return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
+}
+function applyTheme(effective) {
+  if (typeof document === "undefined") return;
+  document.documentElement.setAttribute("data-theme", effective);
+  document.documentElement.classList.toggle("light", effective === "light");
+}
+function computeDashboardStats(surface, meta) {
+  return {
+    componentCount: surface.reduce(
+      (sum, section) => sum + section.stories.length,
+      0
+    ),
+    sectionCount: surface.length,
+    styleVariantCount: meta.styleVariants.length,
+    frameworkCount: meta.frameworks.length
+  };
+}
+var DEFAULT_SHORTCUTS = {
+  toggleSidebar: "Escape",
+  toggleTheme: "t",
+  focusSearch: "/",
+  goHome: "h"
+};
+function matchesShortcut(event, shortcut) {
+  const parts = shortcut.split("+").map((p) => p.trim().toLowerCase());
+  const key = parts.pop();
+  const needsMeta = parts.includes("cmd") || parts.includes("meta");
+  const needsCtrl = parts.includes("ctrl");
+  const needsShift = parts.includes("shift");
+  const needsAlt = parts.includes("alt");
+  return event.key.toLowerCase() === key && event.metaKey === needsMeta && event.ctrlKey === needsCtrl && event.shiftKey === needsShift && event.altKey === needsAlt;
+}
+
+export { DEFAULT_SHORTCUTS, applyTheme, computeDashboardStats, getHashRoute, getStoredTheme, matchesShortcut, resolveTheme, setHashRoute, setStoredTheme };
+//# sourceMappingURL=chunk-IEHIPVSX.js.map
+//# sourceMappingURL=chunk-IEHIPVSX.js.map

package/dist/chunk-IEHIPVSX.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/utils.ts"],"names":[],"mappings":"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","file":"chunk-IEHIPVSX.js","sourcesContent":["/* ============================================================================\n   @geenius/storybook — Runtime Utilities\n   ============================================================================\n   Framework-agnostic helpers for hash routing, theme management, and\n   dashboard stat computation.\n   ============================================================================ */\n\nimport type {\n  ActiveView,\n  DashboardStats,\n  StorybookMeta,\n  StorySurface,\n  ThemeMode,\n} from './types.js'\n\n// ---------------------------------------------------------------------------\n// Hash routing\n// ---------------------------------------------------------------------------\n\n/** Parse the current `window.location.hash` into an `ActiveView`. */\nexport function getHashRoute<TId extends string>(\n  validIds: readonly TId[],\n): ActiveView<TId> {\n  if (typeof window === 'undefined') return 'dashboard'\n  const hash = window.location.hash.replace('#/', '').replace('#', '')\n  if (!hash || hash === 'dashboard') return 'dashboard'\n  if ((validIds as readonly string[]).includes(hash)) return hash as TId\n  return 'dashboard'\n}\n\n/** Push a new hash route without full page reload. */\nexport function setHashRoute(view: string): void {\n  if (typeof window === 'undefined') return\n  window.location.hash = `#/${view}`\n}\n\n// ---------------------------------------------------------------------------\n// Theme management\n// ---------------------------------------------------------------------------\n\nconst THEME_STORAGE_KEY = 'geenius-storybook-theme'\n\n/** Read the stored theme preference, falling back to the given default. */\nexport function getStoredTheme(fallback: ThemeMode = 'dark'): ThemeMode {\n  if (typeof window === 'undefined') return fallback\n  const stored = localStorage.getItem(THEME_STORAGE_KEY)\n  if (stored === 'dark' || stored === 'light' || stored === 'system') {\n    return stored\n  }\n  return fallback\n}\n\n/** Persist the theme preference. */\nexport function setStoredTheme(mode: ThemeMode): void {\n  if (typeof window === 'undefined') return\n  localStorage.setItem(THEME_STORAGE_KEY, mode)\n}\n\n/**\n * Resolve a theme mode to an effective `'dark' | 'light'` value,\n * accounting for `'system'` by querying `prefers-color-scheme`.\n */\nexport function resolveTheme(mode: ThemeMode): 'dark' | 'light' {\n  if (mode !== 'system') return mode\n  if (typeof window === 'undefined') return 'dark'\n  return window.matchMedia('(prefers-color-scheme: dark)').matches\n    ? 'dark'\n    : 'light'\n}\n\n/**\n * Apply the given effective theme to the document root.\n * Sets the `data-theme` attribute and toggles the `light` class.\n */\nexport function applyTheme(effective: 'dark' | 'light'): void {\n  if (typeof document === 'undefined') return\n  document.documentElement.setAttribute('data-theme', effective)\n  document.documentElement.classList.toggle('light', effective === 'light')\n}\n\n// ---------------------------------------------------------------------------\n// Dashboard stats\n// ---------------------------------------------------------------------------\n\n/** Compute dashboard statistics from a surface and meta. */\nexport function computeDashboardStats(\n  surface: StorySurface,\n  meta: StorybookMeta,\n): DashboardStats {\n  return {\n    componentCount: surface.reduce(\n      (sum, section) => sum + section.stories.length,\n      0,\n    ),\n    sectionCount: surface.length,\n    styleVariantCount: meta.styleVariants.length,\n    frameworkCount: meta.frameworks.length,\n  }\n}\n\n// ---------------------------------------------------------------------------\n// Keyboard shortcuts\n// ---------------------------------------------------------------------------\n\n/** Key bindings for common storybook actions. */\nexport interface KeyboardShortcuts {\n  /** Toggle sidebar visibility (mobile). Default: `Escape` */\n  toggleSidebar: string\n  /** Toggle theme mode. Default: `t` */\n  toggleTheme: string\n  /** Focus search input. Default: `/` or `Cmd+K` */\n  focusSearch: string\n  /** Navigate to dashboard. Default: `h` */\n  goHome: string\n}\n\nexport const DEFAULT_SHORTCUTS: KeyboardShortcuts = {\n  toggleSidebar: 'Escape',\n  toggleTheme: 't',\n  focusSearch: '/',\n  goHome: 'h',\n}\n\n/**\n * Check whether a KeyboardEvent matches a shortcut string.\n * Supports modifiers: `Cmd+K`, `Ctrl+Shift+P`, etc.\n */\nexport function matchesShortcut(event: KeyboardEvent, shortcut: string): boolean {\n  const parts = shortcut.split('+').map((p) => p.trim().toLowerCase())\n  const key = parts.pop()!\n  const needsMeta = parts.includes('cmd') || parts.includes('meta')\n  const needsCtrl = parts.includes('ctrl')\n  const needsShift = parts.includes('shift')\n  const needsAlt = parts.includes('alt')\n\n  return (\n    event.key.toLowerCase() === key &&\n    event.metaKey === needsMeta &&\n    event.ctrlKey === needsCtrl &&\n    event.shiftKey === needsShift &&\n    event.altKey === needsAlt\n  )\n}\n"]}

package/dist/chunk-PRS2B2OG.js

@@ -0,0 +1,43 @@
+import { mergeConfig } from 'vite';
+
+// src/vite.ts
+function createStorybookViteConfig(options) {
+  const {
+    framework,
+    port,
+    plugins = [],
+    aliases = {},
+    tailwind,
+    config
+  } = options;
+  const resolvedPlugins = [...plugins];
+  if (tailwind !== false && tailwind != null) {
+    resolvedPlugins.push(tailwind);
+  }
+  const baseConfig = {
+    plugins: resolvedPlugins,
+    resolve: {
+      alias: {
+        "@": new URL("./src", `file://${process.cwd()}/`).pathname,
+        ...aliases
+      }
+    },
+    server: {
+      port,
+      strictPort: false
+    },
+    build: {
+      target: "es2022",
+      sourcemap: true
+    },
+    define: {
+      __GSB_FRAMEWORK__: JSON.stringify(framework),
+      __GSB_PORT__: JSON.stringify(port)
+    }
+  };
+  return config ? mergeConfig(baseConfig, config) : baseConfig;
+}
+
+export { createStorybookViteConfig };
+//# sourceMappingURL=chunk-PRS2B2OG.js.map
+//# sourceMappingURL=chunk-PRS2B2OG.js.map

package/dist/chunk-PRS2B2OG.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/vite.ts"],"names":[],"mappings":";;;AA0BO,SAAS,0BAA0B,OAAA,EAA+B;AACvE,EAAA,MAAM;AAAA,IACJ,SAAA;AAAA,IACA,IAAA;AAAA,IACA,UAAU,EAAC;AAAA,IACX,UAAU,EAAC;AAAA,IACX,QAAA;AAAA,IACA;AAAA,GACF,GAAI,OAAA;AAGJ,EAAA,MAAM,eAAA,GAAkB,CAAC,GAAG,OAAO,CAAA;AAEnC,EAAA,IAAI,QAAA,KAAa,KAAA,IAAS,QAAA,IAAY,IAAA,EAAM;AAC1C,IAAA,eAAA,CAAgB,KAAK,QAAQ,CAAA;AAAA,EAC/B;AAEA,EAAA,MAAM,UAAA,GAAa;AAAA,IACjB,OAAA,EAAS,eAAA;AAAA,IAET,OAAA,EAAS;AAAA,MACP,KAAA,EAAO;AAAA,QACL,GAAA,EAAK,IAAI,GAAA,CAAI,OAAA,EAAS,UAAU,OAAA,CAAQ,GAAA,EAAK,CAAA,CAAA,CAAG,CAAA,CAAE,QAAA;AAAA,QAClD,GAAG;AAAA;AACL,KACF;AAAA,IAEA,MAAA,EAAQ;AAAA,MACN,IAAA;AAAA,MACA,UAAA,EAAY;AAAA,KACd;AAAA,IAEA,KAAA,EAAO;AAAA,MACL,MAAA,EAAQ,QAAA;AAAA,MACR,SAAA,EAAW;AAAA,KACb;AAAA,IAEA,MAAA,EAAQ;AAAA,MACN,iBAAA,EAAmB,IAAA,CAAK,SAAA,CAAU,SAAS,CAAA;AAAA,MAC3C,YAAA,EAAc,IAAA,CAAK,SAAA,CAAU,IAAI;AAAA;AACnC,GACF;AAEA,EAAA,OAAO,MAAA,GAAS,WAAA,CAAY,UAAA,EAAY,MAAM,CAAA,GAAI,UAAA;AACpD","file":"chunk-PRS2B2OG.js","sourcesContent":["/* ============================================================================\n   @geenius/storybook — Vite Config Preset\n   ============================================================================\n   Factory function that produces a complete Vite config for any framework\n   storybook app. Consumers call it from their own `vite.config.ts`.\n   ============================================================================ */\n\nimport { mergeConfig, type UserConfig } from 'vite'\nimport type { StorybookViteOptions } from './types.js'\n\n/**\n * Create a Vite configuration for a storybook app.\n *\n * @example\n * ```ts\n * // apps/storybook-react/vite.config.ts\n * import { createStorybookViteConfig } from '@geenius/storybook/vite'\n * import react from '@vitejs/plugin-react'\n *\n * export default createStorybookViteConfig({\n *   framework: 'react',\n *   port: 3050,\n *   plugins: [react()],\n * })\n * ```\n */\nexport function createStorybookViteConfig(options: StorybookViteOptions) {\n  const {\n    framework,\n    port,\n    plugins = [],\n    aliases = {},\n    tailwind,\n    config,\n  } = options\n\n  // Build plugin list — framework plugins first, then optional tailwind\n  const resolvedPlugins = [...plugins]\n\n  if (tailwind !== false && tailwind != null) {\n    resolvedPlugins.push(tailwind)\n  }\n\n  const baseConfig = {\n    plugins: resolvedPlugins,\n\n    resolve: {\n      alias: {\n        '@': new URL('./src', `file://${process.cwd()}/`).pathname,\n        ...aliases,\n      },\n    },\n\n    server: {\n      port,\n      strictPort: false,\n    },\n\n    build: {\n      target: 'es2022',\n      sourcemap: true,\n    },\n\n    define: {\n      __GSB_FRAMEWORK__: JSON.stringify(framework),\n      __GSB_PORT__: JSON.stringify(port),\n    },\n  } satisfies UserConfig\n\n  return config ? mergeConfig(baseConfig, config) : baseConfig\n}\n\n// Re-export the options type for consumers\nexport type { StorybookViteOptions }\n"]}

package/dist/index.d.ts

@@ -0,0 +1,5 @@
+export { ActiveView, DashboardStats, Framework, StorySurface, StorySurfaceEntry, StorySurfaceId, StorySurfaceSection, StorybookMeta, StorybookViteOptions, StyleVariant, ThemeMode } from './types.js';
+export { DEFAULT_SHORTCUTS, KeyboardShortcuts, applyTheme, computeDashboardStats, getHashRoute, getStoredTheme, matchesShortcut, resolveTheme, setHashRoute, setStoredTheme } from './utils.js';
+export { defineSurface, filterSurface, findSurfaceEntry, findSurfaceSection, getSurfaceComponentCount, getSurfaceEntries, getSurfaceIds, getSurfaceSnapshot, validateSurface } from './surface.js';
+export { createStorybookViteConfig } from './vite.js';
+import 'vite';

package/dist/index.html

@@ -0,0 +1,18 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Geenius Storybook</title>
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link
+      href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&family=Inter:wght@300..700&display=swap"
+      rel="stylesheet"
+    />
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>

package/dist/index.js

@@ -0,0 +1,5 @@
+export { defineSurface, filterSurface, findSurfaceEntry, findSurfaceSection, getSurfaceComponentCount, getSurfaceEntries, getSurfaceIds, getSurfaceSnapshot, validateSurface } from './chunk-FB7KPF72.js';
+export { DEFAULT_SHORTCUTS, applyTheme, computeDashboardStats, getHashRoute, getStoredTheme, matchesShortcut, resolveTheme, setHashRoute, setStoredTheme } from './chunk-IEHIPVSX.js';
+export { createStorybookViteConfig } from './chunk-PRS2B2OG.js';
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}

package/dist/react.d.ts

@@ -0,0 +1,58 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ComponentType, ReactNode } from 'react';
+
+type StoryEntry<StoryId extends string> = {
+    id: StoryId;
+    label: string;
+    description?: string;
+    tags?: readonly string[];
+};
+type StorySection<StoryId extends string> = {
+    title: string;
+    stories: readonly StoryEntry<StoryId>[];
+};
+type StoryComponentMap<StoryId extends string> = Record<StoryId, ComponentType<Record<string, never>>>;
+declare function StoryDeck(props: {
+    eyebrow?: string;
+    title: string;
+    summary: string;
+    children: ReactNode;
+    actions?: ReactNode;
+}): react_jsx_runtime.JSX.Element;
+declare function StoryGrid(props: {
+    columns?: 2 | 3;
+    children: ReactNode;
+}): react_jsx_runtime.JSX.Element;
+declare function StoryCard(props: {
+    title: string;
+    summary?: string;
+    tone?: 'default' | 'accent' | 'success' | 'warning' | 'danger';
+    children: ReactNode;
+}): react_jsx_runtime.JSX.Element;
+declare function StoryNote(props: {
+    tone?: 'info' | 'warning' | 'success' | 'danger';
+    children: ReactNode;
+}): react_jsx_runtime.JSX.Element;
+declare function StoryMetrics(props: {
+    items: ReadonlyArray<{
+        label: string;
+        value: string;
+        detail?: string;
+    }>;
+}): react_jsx_runtime.JSX.Element;
+declare function StoryComparison(props: {
+    primaryLabel: string;
+    secondaryLabel: string;
+    primary: ReactNode;
+    secondary: ReactNode;
+}): react_jsx_runtime.JSX.Element;
+declare function ReactStorybookApp<StoryId extends string>(props: {
+    packageName: string;
+    frameworkLabel: string;
+    overview: string;
+    sections: readonly StorySection<StoryId>[];
+    components: StoryComponentMap<StoryId>;
+    defaultStoryId: StoryId;
+}): react_jsx_runtime.JSX.Element;
+
+export { ReactStorybookApp, StoryCard, StoryComparison, type StoryComponentMap, StoryDeck, type StoryEntry, StoryGrid, StoryMetrics, StoryNote, type StorySection };