@aussieljk/forkbook 0.0.0-stage → 0.0.1-2

package/dist/_node-chunks/session-id-KIIVOQLR.js

@@ -0,0 +1,23 @@
+import CJS_COMPAT_NODE_URL_ro17f80mg6k from 'node:url';
+import CJS_COMPAT_NODE_PATH_ro17f80mg6k from 'node:path';
+import CJS_COMPAT_NODE_MODULE_ro17f80mg6k from "node:module";
+
+var __filename = CJS_COMPAT_NODE_URL_ro17f80mg6k.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_ro17f80mg6k.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_ro17f80mg6k.createRequire(import.meta.url);
+
+// ------------------------------------------------------------
+// end of CJS compatibility banner, injected by Forkbook's esbuild configuration
+// ------------------------------------------------------------
+import {
+  SESSION_TIMEOUT,
+  getSessionId,
+  resetSessionIdForTest
+} from "./chunk-CQKMLL5J.js";
+import "./chunk-TEQGGSP7.js";
+import "./chunk-CXRU72ET.js";
+export {
+  SESSION_TIMEOUT,
+  getSessionId,
+  resetSessionIdForTest
+};

package/dist/_node-chunks/setup-MGC7BQO6.js

@@ -0,0 +1,278 @@
+import CJS_COMPAT_NODE_URL_ro17f80mg6k from 'node:url';
+import CJS_COMPAT_NODE_PATH_ro17f80mg6k from 'node:path';
+import CJS_COMPAT_NODE_MODULE_ro17f80mg6k from "node:module";
+
+var __filename = CJS_COMPAT_NODE_URL_ro17f80mg6k.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_ro17f80mg6k.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_ro17f80mg6k.createRequire(import.meta.url);
+
+// ------------------------------------------------------------
+// end of CJS compatibility banner, injected by Forkbook's esbuild configuration
+// ------------------------------------------------------------
+import {
+  getTypeImportSource
+} from "./chunk-6YKBRP72.js";
+import "./chunk-CXRU72ET.js";
+
+// src/cli/skills/content/setup-prompts/setup.ts
+import { getVitestStorybookRunCommand } from "@aussieljk/forkbook/internal/common";
+import { dedent } from "ts-dedent";
+function getPreviewDecoratorExample(projectInfo) {
+  let configDir = projectInfo.configDir;
+  if (projectInfo.hasCsfFactoryPreview)
+    return dedent`
+      \`\`\`tsx
+      // ${configDir}/preview.tsx
+      import '../src/index.css'; // import global styles
+
+      import { definePreview } from '@aussieljk/forkbook/preview';
+
+      export default definePreview({
+        decorators: [
+          (Story) => (
+            <ThemeProvider theme={theme}>
+              <MemoryRouter>
+                <Story />
+              </MemoryRouter>
+            </ThemeProvider>
+          ),
+        ],
+      });
+      \`\`\`
+    `;
+  let typeImport = getTypeImportSource(projectInfo);
+  return dedent`
+    \`\`\`tsx
+    // ${configDir}/preview.tsx
+    import type { Preview } from '${typeImport}';
+    import '../src/index.css'; // import global styles
+
+    const preview: Preview = {
+      decorators: [
+        (Story) => (
+          <ThemeProvider theme={theme}>
+            <MemoryRouter>
+              <Story />
+            </MemoryRouter>
+          </ThemeProvider>
+        ),
+      ],
+    };
+
+    export default preview;
+    \`\`\`
+  `;
+}
+function getSimpleStoryExample(projectInfo) {
+  if (projectInfo.hasCsfFactoryPreview)
+    return dedent`
+      \`\`\`tsx
+      import preview from '#.forkbook/preview';
+      import { Button } from './Button';
+
+      const meta = preview.meta({
+        title: 'AI Generated/Simple/Button',
+        component: Button,
+        tags: ['ai-generated'],
+      });
+
+      export const Default = meta.story({
+        args: {
+          label: 'Click me',
+        },
+      });
+
+      export const Disabled = meta.story({
+        args: {
+          label: 'Disabled',
+          disabled: true,
+        },
+      });
+      \`\`\`
+    `;
+  let typeImport = getTypeImportSource(projectInfo);
+  return dedent`
+    \`\`\`tsx
+    import type { Meta, StoryObj } from '${typeImport}';
+    import { Button } from './Button';
+
+    const meta = {
+      title: 'AI Generated/Simple/Button',
+      component: Button,
+      tags: ['ai-generated'],
+    } satisfies Meta<typeof Button>;
+
+    export default meta;
+    type Story = StoryObj<typeof meta>;
+
+    export const Default: Story = {
+      args: {
+        label: 'Click me',
+      },
+    };
+
+    export const Disabled: Story = {
+      args: {
+        label: 'Disabled',
+        disabled: true,
+      },
+    };
+    \`\`\`
+  `;
+}
+function getNeedsWorkTagExample(projectInfo) {
+  return projectInfo.hasCsfFactoryPreview ? dedent`
+      \`\`\`ts
+      const meta = preview.meta({
+        title: 'AI Generated/Simple/Button',
+        component: Button,
+        tags: ['ai-generated', 'needs-work'],
+      });
+      \`\`\`
+    ` : dedent`
+    \`\`\`ts
+    const meta = {
+      title: 'AI Generated/Simple/Button',
+      component: Button,
+      tags: ['ai-generated', 'needs-work'],
+    } satisfies Meta<typeof Button>;
+    \`\`\`
+  `;
+}
+function instructions(projectInfo) {
+  let configDir = projectInfo.configDir, { packageManager } = projectInfo, vitestRunFile = getVitestStorybookRunCommand(packageManager, "<path-to-story-file>"), vitestRunAll = getVitestStorybookRunCommand(packageManager), storybookBuild = packageManager.getPackageCommand(["forkbook", "build"]);
+  return dedent`
+    Attention: The following instructions must be followed in order to successfully set up Forkbook in this project. Do not skip steps or attempt to do them out of order.
+
+    Your goal is to make Forkbook fully functional in this project by analyzing the codebase,
+    configuring the preview with the right decorators, and writing example stories for 9 components.
+
+    Work through these steps in order. After each story file, run Vitest to verify it renders.
+    If the test fails, read the error, fix the issue, and re-run until it passes before moving on.
+
+    ### Step 1: Analyze the codebase
+
+    Before writing any stories, understand what the components need to render:
+
+    - Scan the project for context providers, theme systems, routers, stores, and i18n setups.
+      Look at the app's entry point (e.g. \`App.tsx\`, \`main.tsx\`, \`layout.tsx\`) to see what
+      providers wrap the component tree.
+    - Identify global CSS or style imports required for components to look correct.
+    - Note any path aliases configured in tsconfig or bundler config.
+    - Read \`${configDir}/main.ts\` (or \`main.js\`) to find the \`stories\` glob patterns.
+      Your story files must match those patterns to be picked up by Forkbook.
+
+    ### Step 2: Configure \`${configDir}/preview.tsx\` with decorators
+
+    Add decorators that wrap every story with the providers your components need.
+    Without this, most non-trivial components will crash.
+
+    ${getPreviewDecoratorExample(projectInfo)}
+
+    Common decorators to add:
+
+    - **Theme providers** (e.g. ThemeProvider, MUI ThemeProvider, styled-components, Tailwind)
+    - **Router** (e.g. MemoryRouter, BrowserRouter mock)
+    - **State stores** (e.g. Redux Provider, Zustand, Jotai)
+    - **i18n** (e.g. IntlProvider, I18nextProvider)
+    - **Global CSS** — import global stylesheets at the top of \`preview.tsx\`
+
+    ### Step 3: Write stories for 9 components
+
+    Pick 9 real components from the codebase, 3 of each complexity level.
+    Use the title prefix \`AI Generated/<Complexity>/<ComponentName>\` so they are grouped
+    together in the Forkbook sidebar.
+
+    **Simple (3 components)** — Presentational with few props, no internal state.
+    Examples: Button, Badge, Avatar, Icon, Label, Chip.
+    Title format: \`AI Generated/Simple/<ComponentName>\`
+
+    **Medium (3 components)** — Multiple visual variants or composed from simpler components.
+    Examples: Card, Alert, Input, Select, Tooltip, Tabs.
+    Title format: \`AI Generated/Medium/<ComponentName>\`
+
+    **Complex (3 components)** — Internal state, side effects, or deep composition.
+    Examples: Modal, DataTable, Form, Dropdown, Accordion, Sidebar.
+    Title format: \`AI Generated/Complex/<ComponentName>\`
+
+    For each component, create a \`<ComponentName>.stories.tsx\` file next to the component.
+    Each file must have at least 2 story exports covering the component's main states.
+    Make sure the file location and naming matches the \`stories\` patterns in \`${configDir}/main.ts\`.
+
+    #### Story tags
+
+    Every story meta must include the \`ai-generated\` tag to identify AI-created stories:
+
+    ${getSimpleStoryExample(projectInfo)}
+
+    If a story could not be fully fixed after the self-healing loop (the test still fails
+    or the rendering is incomplete), add the \`needs-work\` tag alongside \`ai-generated\`:
+
+    ${getNeedsWorkTagExample(projectInfo)}
+
+    Rules:
+
+    - Every named export is a story. Use \`args\` to set props.
+    - Provide all required props via \`args\` — check the component's types.
+    - If a component needs per-story decorators (beyond the global ones), add them in the meta.
+    - Do NOT use \`any\` types. Use the component's prop types for type safety.
+
+    Reference: https://storybook.js.org/docs/writing-stories
+
+    ### Step 4: Verify each story with Vitest
+
+    After writing each story file, immediately verify it:
+
+    \`\`\`bash
+    ${vitestRunFile}
+    \`\`\`
+
+    **Self-healing loop — repeat for every story file:**
+
+    1. Write/update the story file
+    2. Run \`${vitestRunFile}\`
+    3. If it fails: read the error output carefully
+       - Missing provider → add a decorator in \`${configDir}/preview.tsx\` or in the story meta
+       - Missing prop → add the required prop to \`args\`
+       - Import error → fix the import path
+       - CSS/asset error → add static dirs or import the stylesheet
+    4. Fix the issue and go back to step 2
+    5. Once the test passes, move to the next component
+
+    After all 9 story files pass individually, run the full suite:
+
+    \`\`\`bash
+    ${vitestRunAll}
+    \`\`\`
+
+    Once all stories pass, run a full Forkbook build as a final check:
+
+    \`\`\`bash
+    ${storybookBuild}
+    \`\`\`
+
+    If the build fails, fix the issue before finishing.
+
+    ### Checklist
+
+    - [ ] Analyzed codebase for providers, global styles, and path aliases
+    - [ ] Read story patterns from \`${configDir}/main.ts\`
+    - [ ] Configured \`${configDir}/preview.tsx\` with necessary decorators
+    - [ ] Simple component 1: story written and passing
+    - [ ] Simple component 2: story written and passing
+    - [ ] Simple component 3: story written and passing
+    - [ ] Medium component 1: story written and passing
+    - [ ] Medium component 2: story written and passing
+    - [ ] Medium component 3: story written and passing
+    - [ ] Complex component 1: story written and passing
+    - [ ] Complex component 2: story written and passing
+    - [ ] Complex component 3: story written and passing
+    - [ ] Full Vitest suite passes: \`${vitestRunAll}\`
+    - [ ] \`${storybookBuild}\` succeeds
+    - [ ] All passing stories have \`tags: ['ai-generated']\` in their meta
+    - [ ] Any stories that still need work have \`tags: ['ai-generated', 'needs-work']\` in their meta
+  `;
+}
+export {
+  instructions
+};

package/dist/_node-chunks/vitest.config.4.template-JH2THZFG.js

@@ -0,0 +1,54 @@
+import CJS_COMPAT_NODE_URL_ro17f80mg6k from 'node:url';
+import CJS_COMPAT_NODE_PATH_ro17f80mg6k from 'node:path';
+import CJS_COMPAT_NODE_MODULE_ro17f80mg6k from "node:module";
+
+var __filename = CJS_COMPAT_NODE_URL_ro17f80mg6k.fileURLToPath(import.meta.url);
+var __dirname = CJS_COMPAT_NODE_PATH_ro17f80mg6k.dirname(__filename);
+var require = CJS_COMPAT_NODE_MODULE_ro17f80mg6k.createRequire(import.meta.url);
+
+// ------------------------------------------------------------
+// end of CJS compatibility banner, injected by Forkbook's esbuild configuration
+// ------------------------------------------------------------
+import "./chunk-CXRU72ET.js";
+
+// raw:../../assets/addon-vitest/templates/vitest.config.4.template.ts
+var vitest_config_4_template_default = `import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+import { defineConfig } from 'vitest/config';
+
+import { storybookTest } from '@aussieljk/forkbook/addon-vitest/vitest-plugin';
+
+import { playwright } from '@vitest/browser-playwright';
+
+const dirname =
+  typeof __dirname !== 'undefined' ? __dirname : path.dirname(fileURLToPath(import.meta.url));
+
+// More info at: https://storybook.js.org/docs/next/writing-tests/integrations/vitest-addon
+export default defineConfig({
+  test: {
+    projects: [
+      {
+        extends: true,
+        plugins: [
+          // The plugin will run tests for the stories defined in your Forkbook config
+          // See options at: https://storybook.js.org/docs/next/writing-tests/integrations/vitest-addon#storybooktest
+          storybookTest({ configDir: path.join(dirname, 'CONFIG_DIR') }),
+        ],
+        test: {
+          name: 'storybook',
+          browser: {
+            enabled: true,
+            headless: true,
+            provider: playwright({}),
+            instances: [{ browser: 'chromium' }],
+          },
+        },
+      },
+    ],
+  },
+});
+`;
+export {
+  vitest_config_4_template_default as default
+};

package/dist/actions/decorator.d.ts

@@ -0,0 +1,7 @@
+import { PartialStoryFn, Renderer } from "@aussieljk/forkbook/internal/types";
+
+//#region .dts-emit/code/core/src/actions/decorator.d.ts
+/** @deprecated Will be removed in Forkbook v10 */
+declare const withActions: <T extends Renderer>(storyFn: PartialStoryFn<T>) => T['storyResult'];
+//#endregion
+export { withActions };

package/dist/actions/decorator.js

@@ -0,0 +1,43 @@
+import {
+  actions
+} from "../_browser-chunks/chunk-LV5PIKV4.js";
+import {
+  PARAM_KEY
+} from "../_browser-chunks/chunk-V2G23FV7.js";
+import "../_browser-chunks/chunk-IMSF75WX.js";
+
+// src/actions/decorator.ts
+import { makeDecorator, useEffect } from "@aussieljk/forkbook/preview-api";
+var delegateEventSplitter = /^(\S+)\s*(.*)$/, isIE = Element != null && !Element.prototype.matches, matchesMethod = isIE ? "msMatchesSelector" : "matches", hasMatchInAncestry = (element, selector) => {
+  if (element[matchesMethod](selector))
+    return !0;
+  let parent = element.parentElement;
+  return parent ? hasMatchInAncestry(parent, selector) : !1;
+}, createHandlers = (actionsFn, ...handles) => {
+  let actionsObject = actionsFn(...handles);
+  return Object.entries(actionsObject).map(([key, action]) => {
+    let [_, eventName, selector] = key.match(delegateEventSplitter) || [];
+    return {
+      eventName,
+      handler: (e) => {
+        (!selector || hasMatchInAncestry(e.target, selector)) && action(e);
+      }
+    };
+  });
+}, applyEventHandlers = (actionsFn, ...handles) => {
+  let root = typeof globalThis.document < "u" && globalThis.document.getElementById("storybook-root");
+  useEffect(() => {
+    if (root) {
+      let handlers = createHandlers(actionsFn, ...handles);
+      return handlers.forEach(({ eventName, handler }) => root.addEventListener(eventName, handler)), () => handlers.forEach(({ eventName, handler }) => root.removeEventListener(eventName, handler));
+    }
+  }, [root, actionsFn, handles]);
+}, withActions = makeDecorator({
+  name: "withActions",
+  parameterName: PARAM_KEY,
+  skipIfNoParametersOrOptions: !0,
+  wrapper: (getStory, context, { parameters }) => (parameters?.handles && applyEventHandlers(actions, ...parameters.handles), getStory(context))
+});
+export {
+  withActions
+};

package/dist/actions/index.d.ts

@@ -0,0 +1,67 @@
+import { t as Options$1 } from "../chunk-C6PAgHLT.js";
+
+//#region .dts-emit/code/core/src/actions/constants.d.ts
+declare const PARAM_KEY = "actions";
+declare const ADDON_ID = "@aussieljk/forkbook/actions";
+declare const PANEL_ID = "@aussieljk/forkbook/actions/panel";
+declare const EVENT_ID = "@aussieljk/forkbook/actions/action-event";
+declare const CLEAR_ID = "@aussieljk/forkbook/actions/action-clear";
+declare const CYCLIC_KEY = "$___storybook.isCyclic";
+//#endregion
+//#region .dts-emit/code/core/src/actions/models/ActionOptions.d.ts
+interface Options {
+  depth: number;
+  clearOnStoryChange: boolean;
+  limit: number;
+  implicit: boolean;
+  id: string;
+}
+type ActionOptions = Partial<Options> & Partial<Options$1>;
+//#endregion
+//#region .dts-emit/code/core/src/actions/models/ActionDisplay.d.ts
+interface ActionDisplay {
+  id: string;
+  data: {
+    name: string;
+    args: any[];
+  };
+  count: number;
+  options: ActionOptions;
+}
+//#endregion
+//#region .dts-emit/code/core/src/actions/models/HandlerFunction.d.ts
+type HandlerFunction = (...args: any[]) => any;
+//#endregion
+//#region .dts-emit/code/core/src/actions/models/ActionsMap.d.ts
+type ActionsMap<T extends string = string> = Record<T, HandlerFunction>;
+//#endregion
+//#region .dts-emit/code/core/src/actions/models/ActionsFunction.d.ts
+interface ActionsFunction {
+  <T extends string>(handlerMap: Record<T, string>, options?: ActionOptions): ActionsMap<T>;
+  <T extends string>(...handlers: T[]): ActionsMap<T>;
+  <T extends string>(handler1: T, options?: ActionOptions): ActionsMap<T>;
+  <T extends string>(handler1: T, handler2: T, options?: ActionOptions): ActionsMap<T>;
+  <T extends string>(handler1: T, handler2: T, handler3: T, options?: ActionOptions): ActionsMap<T>;
+  <T extends string>(handler1: T, handler2: T, handler3: T, handler4: T, options?: ActionOptions): ActionsMap<T>;
+  <T extends string>(handler1: T, handler2: T, handler3: T, handler4: T, handler5: T, options?: ActionOptions): ActionsMap<T>;
+  <T extends string>(handler1: T, handler2: T, handler3: T, handler4: T, handler5: T, handler6: T, options?: ActionOptions): ActionsMap<T>;
+  <T extends string>(handler1: T, handler2: T, handler3: T, handler4: T, handler5: T, handler6: T, handler7: T, options?: ActionOptions): ActionsMap<T>;
+  <T extends string>(handler1: T, handler2: T, handler3: T, handler4: T, handler5: T, handler6: T, handler7: T, handler8: T, options?: ActionOptions): ActionsMap<T>;
+  <T extends string>(handler1: T, handler2: T, handler3: T, handler4: T, handler5: T, handler6: T, handler7: T, handler8: T, handler9: T, options?: ActionOptions): ActionsMap<T>;
+  <T extends string>(handler1: T, handler2: T, handler3: T, handler4: T, handler5: T, handler6: T, handler7: T, handler8: T, handler9: T, handler10: T, options?: ActionOptions): ActionsMap<T>;
+}
+//#endregion
+//#region .dts-emit/code/core/src/actions/models/DecoratorFunction.d.ts
+type DecoratorFunction = (args: any[]) => any[];
+//#endregion
+//#region .dts-emit/code/core/src/actions/runtime/action.d.ts
+declare function action(name: string, options?: ActionOptions): HandlerFunction;
+//#endregion
+//#region .dts-emit/code/core/src/actions/runtime/actions.d.ts
+declare const actions: ActionsFunction;
+//#endregion
+//#region .dts-emit/code/core/src/actions/runtime/configureActions.d.ts
+declare const config: ActionOptions;
+declare const configureActions: (options?: ActionOptions) => void;
+//#endregion
+export { ADDON_ID, ActionDisplay, ActionOptions, ActionsFunction, ActionsMap, CLEAR_ID, CYCLIC_KEY, DecoratorFunction, EVENT_ID, HandlerFunction, PANEL_ID, PARAM_KEY, action, actions, config, configureActions };

package/dist/actions/index.js

@@ -0,0 +1,28 @@
+import "../_browser-chunks/chunk-ECQ75MKQ.js";
+import {
+  action,
+  actions,
+  config,
+  configureActions
+} from "../_browser-chunks/chunk-LV5PIKV4.js";
+import {
+  ADDON_ID,
+  CLEAR_ID,
+  CYCLIC_KEY,
+  EVENT_ID,
+  PANEL_ID,
+  PARAM_KEY
+} from "../_browser-chunks/chunk-V2G23FV7.js";
+import "../_browser-chunks/chunk-IMSF75WX.js";
+export {
+  ADDON_ID,
+  CLEAR_ID,
+  CYCLIC_KEY,
+  EVENT_ID,
+  PANEL_ID,
+  PARAM_KEY,
+  action,
+  actions,
+  config,
+  configureActions
+};

package/dist/addon-a11y/index.d.ts

@@ -0,0 +1,52 @@
+import { r as PARAM_KEY } from "../chunk-XP8oHzpE.js";
+import { i as SelectorWithoutNode, n as ContextObjectWithoutNode, r as ContextSpecWithoutNode, t as A11yParameters } from "../chunk-DgRNfmj_.js";
+import { AxeResults, NodeResult, Result } from "axe-core";
+
+//#region .dts-emit/code/core/src/addon-a11y/types.d.ts
+type A11yReport = EnhancedResults | {
+  error: Error;
+};
+interface A11yParameters$1 {
+  /**
+   * Accessibility configuration
+   *
+   * @see https://storybook.js.org/docs/writing-tests/accessibility-testing
+   */
+  a11y?: A11yParameters;
+}
+interface A11yGlobals {
+  /**
+   * Accessibility configuration
+   *
+   * @see https://storybook.js.org/docs/writing-tests/accessibility-testing
+   */
+  a11y?: {
+    /**
+     * Prevent the addon from executing automated accessibility checks upon visiting a story. You
+     * can still trigger the checks from the addon panel.
+     *
+     * @see https://storybook.js.org/docs/writing-tests/accessibility-testing#disable-automated-checks
+     */
+    manual?: boolean;
+  };
+}
+type EnhancedNodeResult = NodeResult & {
+  linkPath: string;
+};
+type EnhancedResult = Omit<Result, 'nodes'> & {
+  nodes: EnhancedNodeResult[];
+};
+type EnhancedResults = Omit<AxeResults, 'incomplete' | 'passes' | 'violations'> & {
+  incomplete: EnhancedResult[];
+  passes: EnhancedResult[];
+  violations: EnhancedResult[];
+};
+interface A11yTypes {
+  parameters: A11yParameters$1;
+  globals: A11yGlobals;
+}
+//#endregion
+//#region .dts-emit/code/core/src/addon-a11y/index.d.ts
+declare function _default(): import("@aussieljk/forkbook/internal/csf").PreviewAddon<A11yTypes>;
+//#endregion
+export { type A11yGlobals, A11yParameters, type A11yReport, type A11yTypes, ContextObjectWithoutNode, ContextSpecWithoutNode, PARAM_KEY, SelectorWithoutNode, _default as default };

package/dist/addon-a11y/index.js

@@ -0,0 +1,16 @@
+import {
+  preview_exports
+} from "../_browser-chunks/chunk-W5M6NPS3.js";
+import "../_browser-chunks/chunk-2JT76G3E.js";
+import {
+  PARAM_KEY
+} from "../_browser-chunks/chunk-OZZPSYQR.js";
+import "../_browser-chunks/chunk-IMSF75WX.js";
+
+// src/addon-a11y/index.ts
+import { definePreviewAddon } from "@aussieljk/forkbook/internal/csf";
+var addon_a11y_default = () => definePreviewAddon(preview_exports);
+export {
+  PARAM_KEY,
+  addon_a11y_default as default
+};