@aurelia/storybook 0.1.0 → 0.1.1

package/dist/index.js

@@ -1,3 +1,112 @@
-import { renderToCanvas } from './preview/render';
-export { renderToCanvas };
-export const render = renderToCanvas;
+'use strict';
+
+var coreEvents = require('@storybook/core-events');
+var Aurelia = require('aurelia');
+
+/**
+ * Merges multiple sources into a single object.
+ * Sources can be story parameters, args, or story.props.
+ */
+function mergeStoryProps(...sources) {
+    return Object.assign({}, ...sources);
+}
+// Track Aurelia apps for cleanup
+const appMap = new Map();
+async function teardown(element) {
+    if (appMap.has(element)) {
+        const app = appMap.get(element);
+        if (app) {
+            await app.stop();
+            appMap.delete(element);
+        }
+    }
+}
+async function renderToCanvas({ storyFn, title, name, showMain, showError, storyContext, forceRemount, }, canvasElement, bootstrapAppFn) {
+    const appBootstrapFn = bootstrapAppFn || bootstrapAureliaApp;
+    const { parameters, component, args } = storyContext;
+    let app = appMap.get(canvasElement);
+    const story = storyFn();
+    if (!story) {
+        showError({
+            title: `Expecting an Aurelia component from the story: "${name}" of "${title}".`,
+            description: `
+        Did you forget to return the Aurelia component from the story?
+        Use "() => ({ template: '<custom-component></custom-component>' })" when defining the story.
+      `,
+        });
+        return () => { };
+    }
+    showMain();
+    let mergedProps;
+    // Use full merge (including story.props) when bootstrapping a new app or force remounting.
+    if (!app || forceRemount) {
+        mergedProps = mergeStoryProps(parameters?.args, args, story.props);
+        if (app) {
+            await teardown(canvasElement);
+        }
+        app = appBootstrapFn(story, mergedProps, canvasElement, component);
+        await app.start();
+        appMap.set(canvasElement, app);
+    }
+    else {
+        // Update the existing app viewModel only with parameters and args (exclude story.props).
+        mergedProps = mergeStoryProps(parameters?.args, args);
+        if (app.root?.controller?.viewModel) {
+            Object.assign(app.root.controller.viewModel, mergedProps);
+        }
+    }
+    // Set up story change listener for cleanup
+    const channel = storyContext.viewMode === 'story' ? storyContext.channel : null;
+    let onStoryChange;
+    if (channel) {
+        onStoryChange = () => {
+            // When the story changes, clean up the Aurelia app
+            teardown(canvasElement);
+        };
+        channel.on(coreEvents.STORY_CHANGED, onStoryChange);
+    }
+    // Return teardown function that also unsubscribes from STORY_CHANGED
+    return async () => {
+        if (channel && onStoryChange) {
+            channel.off(coreEvents.STORY_CHANGED, onStoryChange);
+        }
+        await teardown(canvasElement);
+    };
+}
+function bootstrapAureliaApp(story, args, domElement, component) {
+    const aurelia = new Aurelia(story.container);
+    if (story.items?.length) {
+        aurelia.register(...story.items);
+    }
+    if (story.components?.length) {
+        aurelia.register(...story.components);
+    }
+    let { template } = story;
+    if (component) {
+        template = template ?? createComponentTemplate(component, story.innerHtml);
+        aurelia.register(component);
+    }
+    const App = Aurelia.CustomElement.define({
+        name: 'au-storybook',
+        template,
+        containerless: true,
+    }, class {
+    });
+    const app = Object.assign(new App(), args);
+    return aurelia.app({
+        host: domElement,
+        component: app,
+    });
+}
+function createComponentTemplate(component, innerHtml) {
+    const def = Aurelia.CustomElement.getDefinition(component);
+    return `<${def.name} ${Object.values(def.bindables)
+        .map((bindable) => `${bindable.attribute}.bind="${bindable.name}"`)
+        .join(' ')}>${innerHtml ?? ''}</${def.name}>`;
+}
+
+const render = renderToCanvas;
+
+exports.render = render;
+exports.renderToCanvas = renderToCanvas;
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../src/preview/render.ts","../src/index.ts"],"sourcesContent":["import { STORY_CHANGED } from '@storybook/core-events';\nimport type { RenderContext, ArgsStoryFn } from '@storybook/types';\nimport type { AureliaRenderer } from './types';\nimport Aurelia, { Constructable, CustomElement } from 'aurelia';\n\ninterface AureliaStoryResult {\n  template: string;\n  components?: unknown[];\n  Component?: unknown;\n  container?: any;\n  items?: unknown[];\n  innerHtml?: string;\n  props?: Record<string, any>;\n}\n\n/**\n * Merges multiple sources into a single object.\n * Sources can be story parameters, args, or story.props.\n */\nfunction mergeStoryProps(\n  ...sources: Array<Record<string, any> | undefined>\n): Record<string, any> {\n  return Object.assign({}, ...sources);\n}\n\n// Track Aurelia apps for cleanup\nconst appMap = new Map<HTMLElement, Aurelia>();\n\nasync function teardown(element: HTMLElement) {\n  if (appMap.has(element)) {\n    const app = appMap.get(element);\n    if (app) {\n      await app.stop();\n      appMap.delete(element);\n    }\n  }\n}\n\nexport const render: ArgsStoryFn<AureliaRenderer> = (args, { id, component: Component }) => {\n  if (!Component) {\n    throw new Error(\n      `Unable to render story ${id} as the component annotation is missing from the default export`\n    );\n  }\n  return { Component, props: args, template: '' };\n};\n\nexport async function renderToCanvas(\n  {\n    storyFn,\n    title,\n    name,\n    showMain,\n    showError,\n    storyContext,\n    forceRemount,\n  }: RenderContext<AureliaRenderer>,\n  canvasElement: HTMLElement,\n  bootstrapAppFn?: typeof bootstrapAureliaApp\n) {\n  const appBootstrapFn = bootstrapAppFn || bootstrapAureliaApp;\n\n  const { parameters, component, args } = storyContext;\n  let app = appMap.get(canvasElement);\n\n  const story = storyFn() as AureliaStoryResult;\n\n  if (!story) {\n    showError({\n      title: `Expecting an Aurelia component from the story: \"${name}\" of \"${title}\".`,\n      description: `\n        Did you forget to return the Aurelia component from the story?\n        Use \"() => ({ template: '<custom-component></custom-component>' })\" when defining the story.\n      `,\n    });\n    return () => {};\n  }\n\n  showMain();\n\n  let mergedProps;\n  // Use full merge (including story.props) when bootstrapping a new app or force remounting.\n  if (!app || forceRemount) {\n    mergedProps = mergeStoryProps(parameters?.args, args, story.props);\n    if (app) {\n      await teardown(canvasElement);\n    }\n    app = appBootstrapFn(\n      story,\n      mergedProps,\n      canvasElement,\n      component as Constructable\n    ) as Aurelia;\n    await app.start();\n    appMap.set(canvasElement, app);\n  } else {\n    // Update the existing app viewModel only with parameters and args (exclude story.props).\n    mergedProps = mergeStoryProps(parameters?.args, args);\n    if (app.root?.controller?.viewModel) {\n      Object.assign(app.root.controller.viewModel, mergedProps);\n    }\n  }\n\n  // Set up story change listener for cleanup\n  const channel = storyContext.viewMode === 'story' ? storyContext.channel : null;\n  let onStoryChange: () => void;\n  if (channel) {\n    onStoryChange = () => {\n      // When the story changes, clean up the Aurelia app\n      teardown(canvasElement);\n    };\n    channel.on(STORY_CHANGED, onStoryChange);\n  }\n\n  // Return teardown function that also unsubscribes from STORY_CHANGED\n  return async () => {\n    if (channel && onStoryChange) {\n      channel.off(STORY_CHANGED, onStoryChange);\n    }\n    await teardown(canvasElement);\n  };\n}\n\nexport function bootstrapAureliaApp(\n  story: AureliaStoryResult,\n  args: Record<string, any>,\n  domElement: HTMLElement,\n  component?: Constructable\n) {\n  const aurelia = new Aurelia(story.container);\n\n  if (story.items?.length) {\n    aurelia.register(...story.items);\n  }\n\n  if (story.components?.length) {\n    aurelia.register(...story.components);\n  }\n\n  let { template } = story;\n\n  if (component) {\n    template = template ?? createComponentTemplate(component, story.innerHtml);\n    aurelia.register(component);\n  }\n\n  const App = CustomElement.define(\n    {\n      name: 'au-storybook',\n      template,\n      containerless: true,\n    },\n    class {}\n  );\n\n  const app = Object.assign(new App(), args);\n\n  return aurelia.app({\n    host: domElement,\n    component: app,\n  });\n}\n\nexport function createComponentTemplate(\n  component: Constructable,\n  innerHtml?: string\n): string {\n  const def = CustomElement.getDefinition(component);\n\n  return `<${def.name} ${Object.values(def.bindables)\n    .map((bindable) => `${bindable.attribute}.bind=\"${bindable.name}\"`)\n    .join(' ')}>${innerHtml ?? ''}</${def.name}>`;\n}","import { renderToCanvas } from './preview/render';\n\nexport { renderToCanvas };\nexport const render = renderToCanvas;\n"],"names":["STORY_CHANGED","CustomElement"],"mappings":"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"}

package/dist/index.mjs

@@ -0,0 +1,109 @@
+import { STORY_CHANGED } from '@storybook/core-events';
+import Aurelia, { CustomElement } from 'aurelia';
+
+/**
+ * Merges multiple sources into a single object.
+ * Sources can be story parameters, args, or story.props.
+ */
+function mergeStoryProps(...sources) {
+    return Object.assign({}, ...sources);
+}
+// Track Aurelia apps for cleanup
+const appMap = new Map();
+async function teardown(element) {
+    if (appMap.has(element)) {
+        const app = appMap.get(element);
+        if (app) {
+            await app.stop();
+            appMap.delete(element);
+        }
+    }
+}
+async function renderToCanvas({ storyFn, title, name, showMain, showError, storyContext, forceRemount, }, canvasElement, bootstrapAppFn) {
+    const appBootstrapFn = bootstrapAppFn || bootstrapAureliaApp;
+    const { parameters, component, args } = storyContext;
+    let app = appMap.get(canvasElement);
+    const story = storyFn();
+    if (!story) {
+        showError({
+            title: `Expecting an Aurelia component from the story: "${name}" of "${title}".`,
+            description: `
+        Did you forget to return the Aurelia component from the story?
+        Use "() => ({ template: '<custom-component></custom-component>' })" when defining the story.
+      `,
+        });
+        return () => { };
+    }
+    showMain();
+    let mergedProps;
+    // Use full merge (including story.props) when bootstrapping a new app or force remounting.
+    if (!app || forceRemount) {
+        mergedProps = mergeStoryProps(parameters?.args, args, story.props);
+        if (app) {
+            await teardown(canvasElement);
+        }
+        app = appBootstrapFn(story, mergedProps, canvasElement, component);
+        await app.start();
+        appMap.set(canvasElement, app);
+    }
+    else {
+        // Update the existing app viewModel only with parameters and args (exclude story.props).
+        mergedProps = mergeStoryProps(parameters?.args, args);
+        if (app.root?.controller?.viewModel) {
+            Object.assign(app.root.controller.viewModel, mergedProps);
+        }
+    }
+    // Set up story change listener for cleanup
+    const channel = storyContext.viewMode === 'story' ? storyContext.channel : null;
+    let onStoryChange;
+    if (channel) {
+        onStoryChange = () => {
+            // When the story changes, clean up the Aurelia app
+            teardown(canvasElement);
+        };
+        channel.on(STORY_CHANGED, onStoryChange);
+    }
+    // Return teardown function that also unsubscribes from STORY_CHANGED
+    return async () => {
+        if (channel && onStoryChange) {
+            channel.off(STORY_CHANGED, onStoryChange);
+        }
+        await teardown(canvasElement);
+    };
+}
+function bootstrapAureliaApp(story, args, domElement, component) {
+    const aurelia = new Aurelia(story.container);
+    if (story.items?.length) {
+        aurelia.register(...story.items);
+    }
+    if (story.components?.length) {
+        aurelia.register(...story.components);
+    }
+    let { template } = story;
+    if (component) {
+        template = template ?? createComponentTemplate(component, story.innerHtml);
+        aurelia.register(component);
+    }
+    const App = CustomElement.define({
+        name: 'au-storybook',
+        template,
+        containerless: true,
+    }, class {
+    });
+    const app = Object.assign(new App(), args);
+    return aurelia.app({
+        host: domElement,
+        component: app,
+    });
+}
+function createComponentTemplate(component, innerHtml) {
+    const def = CustomElement.getDefinition(component);
+    return `<${def.name} ${Object.values(def.bindables)
+        .map((bindable) => `${bindable.attribute}.bind="${bindable.name}"`)
+        .join(' ')}>${innerHtml ?? ''}</${def.name}>`;
+}
+
+const render = renderToCanvas;
+
+export { render, renderToCanvas };
+//# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../src/preview/render.ts","../src/index.ts"],"sourcesContent":["import { STORY_CHANGED } from '@storybook/core-events';\nimport type { RenderContext, ArgsStoryFn } from '@storybook/types';\nimport type { AureliaRenderer } from './types';\nimport Aurelia, { Constructable, CustomElement } from 'aurelia';\n\ninterface AureliaStoryResult {\n  template: string;\n  components?: unknown[];\n  Component?: unknown;\n  container?: any;\n  items?: unknown[];\n  innerHtml?: string;\n  props?: Record<string, any>;\n}\n\n/**\n * Merges multiple sources into a single object.\n * Sources can be story parameters, args, or story.props.\n */\nfunction mergeStoryProps(\n  ...sources: Array<Record<string, any> | undefined>\n): Record<string, any> {\n  return Object.assign({}, ...sources);\n}\n\n// Track Aurelia apps for cleanup\nconst appMap = new Map<HTMLElement, Aurelia>();\n\nasync function teardown(element: HTMLElement) {\n  if (appMap.has(element)) {\n    const app = appMap.get(element);\n    if (app) {\n      await app.stop();\n      appMap.delete(element);\n    }\n  }\n}\n\nexport const render: ArgsStoryFn<AureliaRenderer> = (args, { id, component: Component }) => {\n  if (!Component) {\n    throw new Error(\n      `Unable to render story ${id} as the component annotation is missing from the default export`\n    );\n  }\n  return { Component, props: args, template: '' };\n};\n\nexport async function renderToCanvas(\n  {\n    storyFn,\n    title,\n    name,\n    showMain,\n    showError,\n    storyContext,\n    forceRemount,\n  }: RenderContext<AureliaRenderer>,\n  canvasElement: HTMLElement,\n  bootstrapAppFn?: typeof bootstrapAureliaApp\n) {\n  const appBootstrapFn = bootstrapAppFn || bootstrapAureliaApp;\n\n  const { parameters, component, args } = storyContext;\n  let app = appMap.get(canvasElement);\n\n  const story = storyFn() as AureliaStoryResult;\n\n  if (!story) {\n    showError({\n      title: `Expecting an Aurelia component from the story: \"${name}\" of \"${title}\".`,\n      description: `\n        Did you forget to return the Aurelia component from the story?\n        Use \"() => ({ template: '<custom-component></custom-component>' })\" when defining the story.\n      `,\n    });\n    return () => {};\n  }\n\n  showMain();\n\n  let mergedProps;\n  // Use full merge (including story.props) when bootstrapping a new app or force remounting.\n  if (!app || forceRemount) {\n    mergedProps = mergeStoryProps(parameters?.args, args, story.props);\n    if (app) {\n      await teardown(canvasElement);\n    }\n    app = appBootstrapFn(\n      story,\n      mergedProps,\n      canvasElement,\n      component as Constructable\n    ) as Aurelia;\n    await app.start();\n    appMap.set(canvasElement, app);\n  } else {\n    // Update the existing app viewModel only with parameters and args (exclude story.props).\n    mergedProps = mergeStoryProps(parameters?.args, args);\n    if (app.root?.controller?.viewModel) {\n      Object.assign(app.root.controller.viewModel, mergedProps);\n    }\n  }\n\n  // Set up story change listener for cleanup\n  const channel = storyContext.viewMode === 'story' ? storyContext.channel : null;\n  let onStoryChange: () => void;\n  if (channel) {\n    onStoryChange = () => {\n      // When the story changes, clean up the Aurelia app\n      teardown(canvasElement);\n    };\n    channel.on(STORY_CHANGED, onStoryChange);\n  }\n\n  // Return teardown function that also unsubscribes from STORY_CHANGED\n  return async () => {\n    if (channel && onStoryChange) {\n      channel.off(STORY_CHANGED, onStoryChange);\n    }\n    await teardown(canvasElement);\n  };\n}\n\nexport function bootstrapAureliaApp(\n  story: AureliaStoryResult,\n  args: Record<string, any>,\n  domElement: HTMLElement,\n  component?: Constructable\n) {\n  const aurelia = new Aurelia(story.container);\n\n  if (story.items?.length) {\n    aurelia.register(...story.items);\n  }\n\n  if (story.components?.length) {\n    aurelia.register(...story.components);\n  }\n\n  let { template } = story;\n\n  if (component) {\n    template = template ?? createComponentTemplate(component, story.innerHtml);\n    aurelia.register(component);\n  }\n\n  const App = CustomElement.define(\n    {\n      name: 'au-storybook',\n      template,\n      containerless: true,\n    },\n    class {}\n  );\n\n  const app = Object.assign(new App(), args);\n\n  return aurelia.app({\n    host: domElement,\n    component: app,\n  });\n}\n\nexport function createComponentTemplate(\n  component: Constructable,\n  innerHtml?: string\n): string {\n  const def = CustomElement.getDefinition(component);\n\n  return `<${def.name} ${Object.values(def.bindables)\n    .map((bindable) => `${bindable.attribute}.bind=\"${bindable.name}\"`)\n    .join(' ')}>${innerHtml ?? ''}</${def.name}>`;\n}","import { renderToCanvas } from './preview/render';\n\nexport { renderToCanvas };\nexport const render = renderToCanvas;\n"],"names":[],"mappings":"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"}

package/dist/preset.js

@@ -1,11 +1,19 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
 // src/preset.ts
 // Minimal preset for Storybook-Aurelia2
 /**
  * Optionally adjust the Vite configuration.
  */
-export async function viteFinal(config) {
+async function viteFinal(config) {
     // For now, return the config unchanged.
     return config;
 }
 // Export a default for compatibility.
-export default { viteFinal };
+var preset = { viteFinal };
+
+exports.default = preset;
+exports.viteFinal = viteFinal;
+//# sourceMappingURL=preset.js.map

package/dist/preset.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"preset.js","sources":["../src/preset.ts"],"sourcesContent":["// src/preset.ts\n// Minimal preset for Storybook-Aurelia2\n\n/**\n * Optionally adjust the Vite configuration.\n */\nexport async function viteFinal(config: any): Promise<any> {\n    // For now, return the config unchanged.\n    return config;\n  }\n  \n  // Export a default for compatibility.\n  export default { viteFinal };\n  "],"names":[],"mappings":";;;;AAAA;AACA;AAEA;;AAEG;AACI,eAAe,SAAS,CAAC,MAAW,EAAA;;AAEvC,IAAA,OAAO,MAAM;AACf;AAEA;AACA,aAAe,EAAE,SAAS,EAAE;;;;;"}

package/dist/{src/preset.js → preset.mjs}

@@ -3,9 +3,12 @@
 /**
  * Optionally adjust the Vite configuration.
  */
-export async function viteFinal(config) {
+async function viteFinal(config) {
     // For now, return the config unchanged.
     return config;
 }
 // Export a default for compatibility.
-export default { viteFinal };
+var preset = { viteFinal };
+
+export { preset as default, viteFinal };
+//# sourceMappingURL=preset.mjs.map

package/dist/preset.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"preset.mjs","sources":["../src/preset.ts"],"sourcesContent":["// src/preset.ts\n// Minimal preset for Storybook-Aurelia2\n\n/**\n * Optionally adjust the Vite configuration.\n */\nexport async function viteFinal(config: any): Promise<any> {\n    // For now, return the config unchanged.\n    return config;\n  }\n  \n  // Export a default for compatibility.\n  export default { viteFinal };\n  "],"names":[],"mappings":"AAAA;AACA;AAEA;;AAEG;AACI,eAAe,SAAS,CAAC,MAAW,EAAA;;AAEvC,IAAA,OAAO,MAAM;AACf;AAEA;AACA,aAAe,EAAE,SAAS,EAAE;;;;"}

package/dist/preview/render.d.ts

@@ -11,7 +11,7 @@ interface AureliaStoryResult {
     props?: Record<string, any>;
 }
 export declare const render: ArgsStoryFn<AureliaRenderer>;
-export declare function renderToCanvas({ storyFn, title, name, showMain, showError, storyContext, forceRemount, }: RenderContext<AureliaRenderer>, canvasElement: HTMLElement): Promise<() => void>;
+export declare function renderToCanvas({ storyFn, title, name, showMain, showError, storyContext, forceRemount, }: RenderContext<AureliaRenderer>, canvasElement: HTMLElement, bootstrapAppFn?: typeof bootstrapAureliaApp): Promise<() => void>;
 export declare function bootstrapAureliaApp(story: AureliaStoryResult, args: Record<string, any>, domElement: HTMLElement, component?: Constructable): Omit<Aurelia, "enhance" | "register" | "app">;
 export declare function createComponentTemplate(component: Constructable, innerHtml?: string): string;
 export {};

package/dist/preview/render.js

@@ -1,5 +1,8 @@
-import { STORY_CHANGED } from '@storybook/core-events';
-import Aurelia, { CustomElement } from 'aurelia';
+'use strict';
+
+var coreEvents = require('@storybook/core-events');
+var Aurelia = require('aurelia');
+
 /**
  * Merges multiple sources into a single object.
  * Sources can be story parameters, args, or story.props.
@@ -18,13 +21,14 @@ async function teardown(element) {
         }
     }
 }
-export const render = (args, { id, component: Component }) => {
+const render = (args, { id, component: Component }) => {
     if (!Component) {
         throw new Error(`Unable to render story ${id} as the component annotation is missing from the default export`);
     }
     return { Component, props: args, template: '' };
 };
-export async function renderToCanvas({ storyFn, title, name, showMain, showError, storyContext, forceRemount, }, canvasElement) {
+async function renderToCanvas({ storyFn, title, name, showMain, showError, storyContext, forceRemount, }, canvasElement, bootstrapAppFn) {
+    const appBootstrapFn = bootstrapAppFn || bootstrapAureliaApp;
     const { parameters, component, args } = storyContext;
     let app = appMap.get(canvasElement);
     const story = storyFn();
@@ -39,18 +43,20 @@ export async function renderToCanvas({ storyFn, title, name, showMain, showError
         return () => { };
     }
     showMain();
-    // Merge parameters, args, and story.props using the merge utility.
-    const mergedProps = mergeStoryProps(parameters?.args, args, story.props);
-    // if no app or forceRemount, tear down existing app (if any) first.
+    let mergedProps;
+    // Use full merge (including story.props) when bootstrapping a new app or force remounting.
     if (!app || forceRemount) {
+        mergedProps = mergeStoryProps(parameters?.args, args, story.props);
         if (app) {
             await teardown(canvasElement);
         }
-        app = bootstrapAureliaApp(story, mergedProps, canvasElement, component);
+        app = appBootstrapFn(story, mergedProps, canvasElement, component);
         await app.start();
         appMap.set(canvasElement, app);
     }
     else {
+        // Update the existing app viewModel only with parameters and args (exclude story.props).
+        mergedProps = mergeStoryProps(parameters?.args, args);
         if (app.root?.controller?.viewModel) {
             Object.assign(app.root.controller.viewModel, mergedProps);
         }
@@ -63,17 +69,17 @@ export async function renderToCanvas({ storyFn, title, name, showMain, showError
             // When the story changes, clean up the Aurelia app
             teardown(canvasElement);
         };
-        channel.on(STORY_CHANGED, onStoryChange);
+        channel.on(coreEvents.STORY_CHANGED, onStoryChange);
     }
     // Return teardown function that also unsubscribes from STORY_CHANGED
     return async () => {
         if (channel && onStoryChange) {
-            channel.off(STORY_CHANGED, onStoryChange);
+            channel.off(coreEvents.STORY_CHANGED, onStoryChange);
         }
         await teardown(canvasElement);
     };
 }
-export function bootstrapAureliaApp(story, args, domElement, component) {
+function bootstrapAureliaApp(story, args, domElement, component) {
     const aurelia = new Aurelia(story.container);
     if (story.items?.length) {
         aurelia.register(...story.items);
@@ -86,7 +92,7 @@ export function bootstrapAureliaApp(story, args, domElement, component) {
         template = template ?? createComponentTemplate(component, story.innerHtml);
         aurelia.register(component);
     }
-    const App = CustomElement.define({
+    const App = Aurelia.CustomElement.define({
         name: 'au-storybook',
         template,
         containerless: true,
@@ -98,9 +104,15 @@ export function bootstrapAureliaApp(story, args, domElement, component) {
         component: app,
     });
 }
-export function createComponentTemplate(component, innerHtml) {
-    const def = CustomElement.getDefinition(component);
+function createComponentTemplate(component, innerHtml) {
+    const def = Aurelia.CustomElement.getDefinition(component);
     return `<${def.name} ${Object.values(def.bindables)
         .map((bindable) => `${bindable.attribute}.bind="${bindable.name}"`)
         .join(' ')}>${innerHtml ?? ''}</${def.name}>`;
 }
+
+exports.bootstrapAureliaApp = bootstrapAureliaApp;
+exports.createComponentTemplate = createComponentTemplate;
+exports.render = render;
+exports.renderToCanvas = renderToCanvas;
+//# sourceMappingURL=render.js.map

package/dist/preview/render.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"render.js","sources":["../../src/preview/render.ts"],"sourcesContent":["import { STORY_CHANGED } from '@storybook/core-events';\nimport type { RenderContext, ArgsStoryFn } from '@storybook/types';\nimport type { AureliaRenderer } from './types';\nimport Aurelia, { Constructable, CustomElement } from 'aurelia';\n\ninterface AureliaStoryResult {\n  template: string;\n  components?: unknown[];\n  Component?: unknown;\n  container?: any;\n  items?: unknown[];\n  innerHtml?: string;\n  props?: Record<string, any>;\n}\n\n/**\n * Merges multiple sources into a single object.\n * Sources can be story parameters, args, or story.props.\n */\nfunction mergeStoryProps(\n  ...sources: Array<Record<string, any> | undefined>\n): Record<string, any> {\n  return Object.assign({}, ...sources);\n}\n\n// Track Aurelia apps for cleanup\nconst appMap = new Map<HTMLElement, Aurelia>();\n\nasync function teardown(element: HTMLElement) {\n  if (appMap.has(element)) {\n    const app = appMap.get(element);\n    if (app) {\n      await app.stop();\n      appMap.delete(element);\n    }\n  }\n}\n\nexport const render: ArgsStoryFn<AureliaRenderer> = (args, { id, component: Component }) => {\n  if (!Component) {\n    throw new Error(\n      `Unable to render story ${id} as the component annotation is missing from the default export`\n    );\n  }\n  return { Component, props: args, template: '' };\n};\n\nexport async function renderToCanvas(\n  {\n    storyFn,\n    title,\n    name,\n    showMain,\n    showError,\n    storyContext,\n    forceRemount,\n  }: RenderContext<AureliaRenderer>,\n  canvasElement: HTMLElement,\n  bootstrapAppFn?: typeof bootstrapAureliaApp\n) {\n  const appBootstrapFn = bootstrapAppFn || bootstrapAureliaApp;\n\n  const { parameters, component, args } = storyContext;\n  let app = appMap.get(canvasElement);\n\n  const story = storyFn() as AureliaStoryResult;\n\n  if (!story) {\n    showError({\n      title: `Expecting an Aurelia component from the story: \"${name}\" of \"${title}\".`,\n      description: `\n        Did you forget to return the Aurelia component from the story?\n        Use \"() => ({ template: '<custom-component></custom-component>' })\" when defining the story.\n      `,\n    });\n    return () => {};\n  }\n\n  showMain();\n\n  let mergedProps;\n  // Use full merge (including story.props) when bootstrapping a new app or force remounting.\n  if (!app || forceRemount) {\n    mergedProps = mergeStoryProps(parameters?.args, args, story.props);\n    if (app) {\n      await teardown(canvasElement);\n    }\n    app = appBootstrapFn(\n      story,\n      mergedProps,\n      canvasElement,\n      component as Constructable\n    ) as Aurelia;\n    await app.start();\n    appMap.set(canvasElement, app);\n  } else {\n    // Update the existing app viewModel only with parameters and args (exclude story.props).\n    mergedProps = mergeStoryProps(parameters?.args, args);\n    if (app.root?.controller?.viewModel) {\n      Object.assign(app.root.controller.viewModel, mergedProps);\n    }\n  }\n\n  // Set up story change listener for cleanup\n  const channel = storyContext.viewMode === 'story' ? storyContext.channel : null;\n  let onStoryChange: () => void;\n  if (channel) {\n    onStoryChange = () => {\n      // When the story changes, clean up the Aurelia app\n      teardown(canvasElement);\n    };\n    channel.on(STORY_CHANGED, onStoryChange);\n  }\n\n  // Return teardown function that also unsubscribes from STORY_CHANGED\n  return async () => {\n    if (channel && onStoryChange) {\n      channel.off(STORY_CHANGED, onStoryChange);\n    }\n    await teardown(canvasElement);\n  };\n}\n\nexport function bootstrapAureliaApp(\n  story: AureliaStoryResult,\n  args: Record<string, any>,\n  domElement: HTMLElement,\n  component?: Constructable\n) {\n  const aurelia = new Aurelia(story.container);\n\n  if (story.items?.length) {\n    aurelia.register(...story.items);\n  }\n\n  if (story.components?.length) {\n    aurelia.register(...story.components);\n  }\n\n  let { template } = story;\n\n  if (component) {\n    template = template ?? createComponentTemplate(component, story.innerHtml);\n    aurelia.register(component);\n  }\n\n  const App = CustomElement.define(\n    {\n      name: 'au-storybook',\n      template,\n      containerless: true,\n    },\n    class {}\n  );\n\n  const app = Object.assign(new App(), args);\n\n  return aurelia.app({\n    host: domElement,\n    component: app,\n  });\n}\n\nexport function createComponentTemplate(\n  component: Constructable,\n  innerHtml?: string\n): string {\n  const def = CustomElement.getDefinition(component);\n\n  return `<${def.name} ${Object.values(def.bindables)\n    .map((bindable) => `${bindable.attribute}.bind=\"${bindable.name}\"`)\n    .join(' ')}>${innerHtml ?? ''}</${def.name}>`;\n}"],"names":["STORY_CHANGED","CustomElement"],"mappings":"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"}

package/dist/{src/preview/render.js → preview/render.mjs}

@@ -1,5 +1,6 @@
 import { STORY_CHANGED } from '@storybook/core-events';
 import Aurelia, { CustomElement } from 'aurelia';
+
 /**
  * Merges multiple sources into a single object.
  * Sources can be story parameters, args, or story.props.
@@ -18,13 +19,13 @@ async function teardown(element) {
         }
     }
 }
-export const render = (args, { id, component: Component }) => {
+const render = (args, { id, component: Component }) => {
     if (!Component) {
         throw new Error(`Unable to render story ${id} as the component annotation is missing from the default export`);
     }
     return { Component, props: args, template: '' };
 };
-export async function renderToCanvas({ storyFn, title, name, showMain, showError, storyContext, forceRemount, }, canvasElement, bootstrapAppFn) {
+async function renderToCanvas({ storyFn, title, name, showMain, showError, storyContext, forceRemount, }, canvasElement, bootstrapAppFn) {
     const appBootstrapFn = bootstrapAppFn || bootstrapAureliaApp;
     const { parameters, component, args } = storyContext;
     let app = appMap.get(canvasElement);
@@ -76,7 +77,7 @@ export async function renderToCanvas({ storyFn, title, name, showMain, showError
         await teardown(canvasElement);
     };
 }
-export function bootstrapAureliaApp(story, args, domElement, component) {
+function bootstrapAureliaApp(story, args, domElement, component) {
     const aurelia = new Aurelia(story.container);
     if (story.items?.length) {
         aurelia.register(...story.items);
@@ -101,9 +102,12 @@ export function bootstrapAureliaApp(story, args, domElement, component) {
         component: app,
     });
 }
-export function createComponentTemplate(component, innerHtml) {
+function createComponentTemplate(component, innerHtml) {
     const def = CustomElement.getDefinition(component);
     return `<${def.name} ${Object.values(def.bindables)
         .map((bindable) => `${bindable.attribute}.bind="${bindable.name}"`)
         .join(' ')}>${innerHtml ?? ''}</${def.name}>`;
 }
+
+export { bootstrapAureliaApp, createComponentTemplate, render, renderToCanvas };
+//# sourceMappingURL=render.mjs.map

package/dist/preview/render.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"render.mjs","sources":["../../src/preview/render.ts"],"sourcesContent":["import { STORY_CHANGED } from '@storybook/core-events';\nimport type { RenderContext, ArgsStoryFn } from '@storybook/types';\nimport type { AureliaRenderer } from './types';\nimport Aurelia, { Constructable, CustomElement } from 'aurelia';\n\ninterface AureliaStoryResult {\n  template: string;\n  components?: unknown[];\n  Component?: unknown;\n  container?: any;\n  items?: unknown[];\n  innerHtml?: string;\n  props?: Record<string, any>;\n}\n\n/**\n * Merges multiple sources into a single object.\n * Sources can be story parameters, args, or story.props.\n */\nfunction mergeStoryProps(\n  ...sources: Array<Record<string, any> | undefined>\n): Record<string, any> {\n  return Object.assign({}, ...sources);\n}\n\n// Track Aurelia apps for cleanup\nconst appMap = new Map<HTMLElement, Aurelia>();\n\nasync function teardown(element: HTMLElement) {\n  if (appMap.has(element)) {\n    const app = appMap.get(element);\n    if (app) {\n      await app.stop();\n      appMap.delete(element);\n    }\n  }\n}\n\nexport const render: ArgsStoryFn<AureliaRenderer> = (args, { id, component: Component }) => {\n  if (!Component) {\n    throw new Error(\n      `Unable to render story ${id} as the component annotation is missing from the default export`\n    );\n  }\n  return { Component, props: args, template: '' };\n};\n\nexport async function renderToCanvas(\n  {\n    storyFn,\n    title,\n    name,\n    showMain,\n    showError,\n    storyContext,\n    forceRemount,\n  }: RenderContext<AureliaRenderer>,\n  canvasElement: HTMLElement,\n  bootstrapAppFn?: typeof bootstrapAureliaApp\n) {\n  const appBootstrapFn = bootstrapAppFn || bootstrapAureliaApp;\n\n  const { parameters, component, args } = storyContext;\n  let app = appMap.get(canvasElement);\n\n  const story = storyFn() as AureliaStoryResult;\n\n  if (!story) {\n    showError({\n      title: `Expecting an Aurelia component from the story: \"${name}\" of \"${title}\".`,\n      description: `\n        Did you forget to return the Aurelia component from the story?\n        Use \"() => ({ template: '<custom-component></custom-component>' })\" when defining the story.\n      `,\n    });\n    return () => {};\n  }\n\n  showMain();\n\n  let mergedProps;\n  // Use full merge (including story.props) when bootstrapping a new app or force remounting.\n  if (!app || forceRemount) {\n    mergedProps = mergeStoryProps(parameters?.args, args, story.props);\n    if (app) {\n      await teardown(canvasElement);\n    }\n    app = appBootstrapFn(\n      story,\n      mergedProps,\n      canvasElement,\n      component as Constructable\n    ) as Aurelia;\n    await app.start();\n    appMap.set(canvasElement, app);\n  } else {\n    // Update the existing app viewModel only with parameters and args (exclude story.props).\n    mergedProps = mergeStoryProps(parameters?.args, args);\n    if (app.root?.controller?.viewModel) {\n      Object.assign(app.root.controller.viewModel, mergedProps);\n    }\n  }\n\n  // Set up story change listener for cleanup\n  const channel = storyContext.viewMode === 'story' ? storyContext.channel : null;\n  let onStoryChange: () => void;\n  if (channel) {\n    onStoryChange = () => {\n      // When the story changes, clean up the Aurelia app\n      teardown(canvasElement);\n    };\n    channel.on(STORY_CHANGED, onStoryChange);\n  }\n\n  // Return teardown function that also unsubscribes from STORY_CHANGED\n  return async () => {\n    if (channel && onStoryChange) {\n      channel.off(STORY_CHANGED, onStoryChange);\n    }\n    await teardown(canvasElement);\n  };\n}\n\nexport function bootstrapAureliaApp(\n  story: AureliaStoryResult,\n  args: Record<string, any>,\n  domElement: HTMLElement,\n  component?: Constructable\n) {\n  const aurelia = new Aurelia(story.container);\n\n  if (story.items?.length) {\n    aurelia.register(...story.items);\n  }\n\n  if (story.components?.length) {\n    aurelia.register(...story.components);\n  }\n\n  let { template } = story;\n\n  if (component) {\n    template = template ?? createComponentTemplate(component, story.innerHtml);\n    aurelia.register(component);\n  }\n\n  const App = CustomElement.define(\n    {\n      name: 'au-storybook',\n      template,\n      containerless: true,\n    },\n    class {}\n  );\n\n  const app = Object.assign(new App(), args);\n\n  return aurelia.app({\n    host: domElement,\n    component: app,\n  });\n}\n\nexport function createComponentTemplate(\n  component: Constructable,\n  innerHtml?: string\n): string {\n  const def = CustomElement.getDefinition(component);\n\n  return `<${def.name} ${Object.values(def.bindables)\n    .map((bindable) => `${bindable.attribute}.bind=\"${bindable.name}\"`)\n    .join(' ')}>${innerHtml ?? ''}</${def.name}>`;\n}"],"names":[],"mappings":";;;AAeA;;;AAGG;AACH,SAAS,eAAe,CACtB,GAAG,OAA+C,EAAA;IAElD,OAAO,MAAM,CAAC,MAAM,CAAC,EAAE,EAAE,GAAG,OAAO,CAAC;AACtC;AAEA;AACA,MAAM,MAAM,GAAG,IAAI,GAAG,EAAwB;AAE9C,eAAe,QAAQ,CAAC,OAAoB,EAAA;AAC1C,IAAA,IAAI,MAAM,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE;QACvB,MAAM,GAAG,GAAG,MAAM,CAAC,GAAG,CAAC,OAAO,CAAC;QAC/B,IAAI,GAAG,EAAE;AACP,YAAA,MAAM,GAAG,CAAC,IAAI,EAAE;AAChB,YAAA,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC;;;AAG5B;AAEO,MAAM,MAAM,GAAiC,CAAC,IAAI,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,SAAS,EAAE,KAAI;IACzF,IAAI,CAAC,SAAS,EAAE;AACd,QAAA,MAAM,IAAI,KAAK,CACb,0BAA0B,EAAE,CAAA,+DAAA,CAAiE,CAC9F;;IAEH,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE,EAAE;AACjD;AAEO,eAAe,cAAc,CAClC,EACE,OAAO,EACP,KAAK,EACL,IAAI,EACJ,QAAQ,EACR,SAAS,EACT,YAAY,EACZ,YAAY,GACmB,EACjC,aAA0B,EAC1B,cAA2C,EAAA;AAE3C,IAAA,MAAM,cAAc,GAAG,cAAc,IAAI,mBAAmB;IAE5D,MAAM,EAAE,UAAU,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,YAAY;IACpD,IAAI,GAAG,GAAG,MAAM,CAAC,GAAG,CAAC,aAAa,CAAC;AAEnC,IAAA,MAAM,KAAK,GAAG,OAAO,EAAwB;IAE7C,IAAI,CAAC,KAAK,EAAE;AACV,QAAA,SAAS,CAAC;AACR,YAAA,KAAK,EAAE,CAAA,gDAAA,EAAmD,IAAI,CAAA,MAAA,EAAS,KAAK,CAAI,EAAA,CAAA;AAChF,YAAA,WAAW,EAAE;;;AAGZ,MAAA,CAAA;AACF,SAAA,CAAC;AACF,QAAA,OAAO,MAAO,GAAC;;AAGjB,IAAA,QAAQ,EAAE;AAEV,IAAA,IAAI,WAAW;;AAEf,IAAA,IAAI,CAAC,GAAG,IAAI,YAAY,EAAE;AACxB,QAAA,WAAW,GAAG,eAAe,CAAC,UAAU,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,CAAC,KAAK,CAAC;QAClE,IAAI,GAAG,EAAE;AACP,YAAA,MAAM,QAAQ,CAAC,aAAa,CAAC;;QAE/B,GAAG,GAAG,cAAc,CAClB,KAAK,EACL,WAAW,EACX,aAAa,EACb,SAA0B,CAChB;AACZ,QAAA,MAAM,GAAG,CAAC,KAAK,EAAE;AACjB,QAAA,MAAM,CAAC,GAAG,CAAC,aAAa,EAAE,GAAG,CAAC;;SACzB;;QAEL,WAAW,GAAG,eAAe,CAAC,UAAU,EAAE,IAAI,EAAE,IAAI,CAAC;QACrD,IAAI,GAAG,CAAC,IAAI,EAAE,UAAU,EAAE,SAAS,EAAE;AACnC,YAAA,MAAM,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC,UAAU,CAAC,SAAS,EAAE,WAAW,CAAC;;;;AAK7D,IAAA,MAAM,OAAO,GAAG,YAAY,CAAC,QAAQ,KAAK,OAAO,GAAG,YAAY,CAAC,OAAO,GAAG,IAAI;AAC/E,IAAA,IAAI,aAAyB;IAC7B,IAAI,OAAO,EAAE;QACX,aAAa,GAAG,MAAK;;YAEnB,QAAQ,CAAC,aAAa,CAAC;AACzB,SAAC;AACD,QAAA,OAAO,CAAC,EAAE,CAAC,aAAa,EAAE,aAAa,CAAC;;;IAI1C,OAAO,YAAW;AAChB,QAAA,IAAI,OAAO,IAAI,aAAa,EAAE;AAC5B,YAAA,OAAO,CAAC,GAAG,CAAC,aAAa,EAAE,aAAa,CAAC;;AAE3C,QAAA,MAAM,QAAQ,CAAC,aAAa,CAAC;AAC/B,KAAC;AACH;AAEM,SAAU,mBAAmB,CACjC,KAAyB,EACzB,IAAyB,EACzB,UAAuB,EACvB,SAAyB,EAAA;IAEzB,MAAM,OAAO,GAAG,IAAI,OAAO,CAAC,KAAK,CAAC,SAAS,CAAC;AAE5C,IAAA,IAAI,KAAK,CAAC,KAAK,EAAE,MAAM,EAAE;QACvB,OAAO,CAAC,QAAQ,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC;;AAGlC,IAAA,IAAI,KAAK,CAAC,UAAU,EAAE,MAAM,EAAE;QAC5B,OAAO,CAAC,QAAQ,CAAC,GAAG,KAAK,CAAC,UAAU,CAAC;;AAGvC,IAAA,IAAI,EAAE,QAAQ,EAAE,GAAG,KAAK;IAExB,IAAI,SAAS,EAAE;QACb,QAAQ,GAAG,QAAQ,IAAI,uBAAuB,CAAC,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC;AAC1E,QAAA,OAAO,CAAC,QAAQ,CAAC,SAAS,CAAC;;AAG7B,IAAA,MAAM,GAAG,GAAG,aAAa,CAAC,MAAM,CAC9B;AACE,QAAA,IAAI,EAAE,cAAc;QACpB,QAAQ;AACR,QAAA,aAAa,EAAE,IAAI;KACpB,EACD,MAAA;AAAQ,KAAA,CACT;AAED,IAAA,MAAM,GAAG,GAAG,MAAM,CAAC,MAAM,CAAC,IAAI,GAAG,EAAE,EAAE,IAAI,CAAC;IAE1C,OAAO,OAAO,CAAC,GAAG,CAAC;AACjB,QAAA,IAAI,EAAE,UAAU;AAChB,QAAA,SAAS,EAAE,GAAG;AACf,KAAA,CAAC;AACJ;AAEgB,SAAA,uBAAuB,CACrC,SAAwB,EACxB,SAAkB,EAAA;IAElB,MAAM,GAAG,GAAG,aAAa,CAAC,aAAa,CAAC,SAAS,CAAC;AAElD,IAAA,OAAO,CAAI,CAAA,EAAA,GAAG,CAAC,IAAI,CAAI,CAAA,EAAA,MAAM,CAAC,MAAM,CAAC,GAAG,CAAC,SAAS;AAC/C,SAAA,GAAG,CAAC,CAAC,QAAQ,KAAK,CAAA,EAAG,QAAQ,CAAC,SAAS,CAAU,OAAA,EAAA,QAAQ,CAAC,IAAI,GAAG;AACjE,SAAA,IAAI,CAAC,GAAG,CAAC,CAAA,CAAA,EAAI,SAAS,IAAI,EAAE,CAAA,EAAA,EAAK,GAAG,CAAC,IAAI,CAAA,CAAA,CAAG;AACjD;;;;"}

package/dist/preview/types.js

@@ -1 +1,3 @@
-export {};
+'use strict';
+
+//# sourceMappingURL=types.js.map

package/dist/preview/types.js.map

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

package/dist/preview/types.mjs

@@ -0,0 +1,2 @@
+
+//# sourceMappingURL=types.mjs.map

package/dist/preview/types.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/package.json

@@ -1,15 +1,17 @@
 {
   "name": "@aurelia/storybook",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "description": "A Storybook plugin to render Aurelia 2 components using Vite",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
+  "module": "dist/index.mjs",
   "publishConfig": {
     "access": "public"
   },
   "scripts": {
-    "build": "tsc",
-    "watch": "tsc -w",
+    "build": "rollup -c",
+    "build:types": "tsc --project tsconfig.build.json --emitDeclarationOnly",
+    "watch": "rollup -c -w",
     "test": "jest"
   },
   "peerDependencies": {
@@ -22,14 +24,29 @@
     "aurelia": "^2.0.0-beta.23"
   },
   "devDependencies": {
+    "@rollup/plugin-commonjs": "^28.0.2",
+    "@rollup/plugin-node-resolve": "^16.0.0",
+    "@rollup/plugin-typescript": "^12.1.2",
     "@storybook/builder-vite": "^8.5.3",
     "@storybook/core-common": "^8.5.3",
     "@storybook/preview-api": "^8.5.3",
     "@storybook/types": "^8.5.3",
     "@types/jest": "^29.5.14",
+    "glob": "^11.0.1",
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",
+    "rollup": "^4.34.2",
     "ts-jest": "^29.2.5",
     "typescript": "^5.7.3"
+  },
+  "exports": {
+    ".": {
+      "require": "./dist/index.js",
+      "import": "./dist/index.mjs"
+    },
+    "./preset": {
+      "require": "./dist/preset.js",
+      "import": "./dist/preset.mjs"
+    }
   }
 }

package/rollup.config.mjs

@@ -0,0 +1,51 @@
+import typescript from '@rollup/plugin-typescript';
+import resolve from '@rollup/plugin-node-resolve';
+import commonjs from '@rollup/plugin-commonjs';
+import { glob } from 'glob';
+
+const external = [
+  '@aurelia/runtime-html',
+  '@aurelia/vite-plugin',
+  '@storybook/addons',
+  '@storybook/builder-vite',
+  '@storybook/core-common',
+  '@storybook/core-events',
+  'aurelia'
+];
+
+// Get all TypeScript files from src directory
+const srcFiles = glob.sync('src/**/*.ts').reduce((acc, file) => {
+  const key = file.replace(/^src\//, '').replace(/\.ts$/, '');
+  acc[key] = file;
+  return acc;
+}, {});
+
+const createConfig = (input, output) => ({
+  input,
+  output: {
+    file: output,
+    format: output.endsWith('.mjs') ? 'esm' : 'cjs',
+    sourcemap: true,
+    exports: 'named'
+  },
+  plugins: [
+    typescript({
+      tsconfig: './tsconfig.json',
+      declaration: false,
+      outDir: 'dist'
+    }),
+    resolve(),
+    commonjs()
+  ],
+  external
+});
+
+// Create configs for all source files
+const configs = Object.entries(srcFiles).flatMap(([name, input]) => [
+  // ESM build
+  createConfig(input, `dist/${name}.mjs`),
+  // CommonJS build
+  createConfig(input, `dist/${name}.js`)
+]);
+
+export default configs;

package/tsconfig.build.json

@@ -0,0 +1,5 @@
+{
+  "extends": "./tsconfig.json",
+  "include": ["src"],
+  "exclude": ["__tests__"]
+} 

package/tsconfig.json

@@ -4,6 +4,7 @@
       "module": "ESNext",
       "declaration": true,
       "outDir": "dist",
+      "rootDir": "src",
       "strict": true,
       "moduleResolution": "node",
       "esModuleInterop": true,

package/dist/__tests__/example.test.js

@@ -1,6 +0,0 @@
-"use strict";
-describe('sample test', () => {
-    it('adds numbers', () => {
-        expect(2 + 2).toBe(4);
-    });
-});

package/dist/__tests__/render.test.js

@@ -1,156 +0,0 @@
-import { STORY_CHANGED } from '@storybook/core-events';
-import { render, renderToCanvas, bootstrapAureliaApp, createComponentTemplate, } from '../src/preview/render';
-// Add this at the very top of the file, before any imports.
-jest.mock('aurelia', () => {
-    const actual = jest.requireActual('aurelia');
-    return {
-        ...actual,
-        CustomElement: {
-            ...actual.CustomElement,
-            getDefinition: jest.fn().mockReturnValue({
-                name: 'dummy-comp',
-                bindables: { prop: { attribute: 'prop', name: 'prop' } },
-            }),
-        },
-    };
-});
-describe('render', () => {
-    it('throws an error when no component is provided', () => {
-        expect(() => render({}, { id: 'story-1', component: undefined })).toThrowError('Unable to render story story-1 as the component annotation is missing from the default export');
-    });
-    it('returns the expected object when a component is provided', () => {
-        const DummyComponent = () => { };
-        const args = { foo: 'bar' };
-        const result = render(args, { id: 'story-1', component: DummyComponent });
-        expect(result).toEqual({ Component: DummyComponent, props: args, template: '' });
-    });
-});
-describe('renderToCanvas', () => {
-    let canvas;
-    let dummyChannel;
-    const DummyComponent = class {
-    };
-    beforeEach(() => {
-        canvas = document.createElement('div');
-        dummyChannel = { on: jest.fn(), off: jest.fn() };
-    });
-    it('calls showError when the story function returns a falsy value', async () => {
-        const storyFn = jest.fn(() => null);
-        const showError = jest.fn();
-        const showMain = jest.fn();
-        const context = {
-            storyFn,
-            title: 'Test Title',
-            name: 'Test Story',
-            showMain,
-            showError,
-            storyContext: {
-                parameters: {},
-                component: DummyComponent,
-                args: {},
-                viewMode: 'story',
-                channel: dummyChannel,
-            },
-            forceRemount: false,
-        };
-        const cleanup = await renderToCanvas(context, canvas);
-        expect(showError).toHaveBeenCalled();
-        expect(typeof cleanup).toBe('function');
-    });
-    it('bootstraps an Aurelia app when none exists or forceRemount is true', async () => {
-        const fakeAurelia = {
-            start: jest.fn().mockResolvedValue(undefined),
-            stop: jest.fn().mockResolvedValue(undefined),
-            root: { controller: { viewModel: {} } },
-        };
-        const story = { template: '<div></div>', props: { test: 'value' } };
-        const storyFn = jest.fn(() => story);
-        const showError = jest.fn();
-        const showMain = jest.fn();
-        // Spy on bootstrapAureliaApp to simulate app creation.
-        const bootstrapSpy = jest
-            .spyOn(require('../src/preview/render'), 'bootstrapAureliaApp')
-            .mockReturnValue(fakeAurelia);
-        const context = {
-            storyFn,
-            title: 'Test Title',
-            name: 'Test Story',
-            showMain,
-            showError,
-            storyContext: {
-                parameters: { args: { param: 'foo' } },
-                component: DummyComponent,
-                args: { test: 'bar' },
-                viewMode: 'story',
-                channel: dummyChannel,
-            },
-            forceRemount: false,
-        };
-        const cleanup = await renderToCanvas(context, canvas, bootstrapAureliaApp);
-        expect(showError).not.toHaveBeenCalled();
-        expect(showMain).toHaveBeenCalled();
-        expect(bootstrapSpy).toHaveBeenCalled();
-        // Simulate cleanup (which should remove the STORY_CHANGED listener)
-        await cleanup();
-        expect(dummyChannel.off).toHaveBeenCalledWith(STORY_CHANGED, expect.any(Function));
-        bootstrapSpy.mockRestore();
-    });
-    it('updates the existing app viewModel when re-rendering without forceRemount', async () => {
-        // Create a fake Aurelia app with a mutable viewModel.
-        const fakeViewModel = {};
-        const fakeAurelia = {
-            start: jest.fn().mockResolvedValue(undefined),
-            stop: jest.fn().mockResolvedValue(undefined),
-            root: { controller: { viewModel: fakeViewModel } },
-        };
-        const story = { template: '<div></div>', props: { test: 'initial' } };
-        const storyFn = jest.fn(() => story);
-        const showError = jest.fn();
-        const showMain = jest.fn();
-        const bootstrapSpy = jest
-            .spyOn(require('../src/preview/render'), 'bootstrapAureliaApp')
-            .mockReturnValue(fakeAurelia);
-        // First render: bootstrap the app.
-        const context = {
-            storyFn,
-            title: 'Title',
-            name: 'Name',
-            showMain,
-            showError,
-            storyContext: {
-                parameters: { args: { param: 'foo' } },
-                component: DummyComponent,
-                args: { test: 'bar' },
-                viewMode: 'story',
-                channel: dummyChannel,
-            },
-            forceRemount: false,
-        };
-        await renderToCanvas(context, canvas, bootstrapAureliaApp);
-        expect(bootstrapSpy).toHaveBeenCalledTimes(1);
-        // Second render with new args; should update viewModel instead of re-bootstrap.
-        const newStory = { template: '<div></div>', props: { test: 'updated' } };
-        storyFn.mockReturnValueOnce(newStory);
-        const newContext = {
-            ...context,
-            storyContext: {
-                ...context.storyContext,
-                parameters: { args: { param: 'baz' } },
-                args: { test: 'qux' },
-            },
-        };
-        await renderToCanvas(newContext, canvas, bootstrapAureliaApp);
-        expect(bootstrapSpy).toHaveBeenCalledTimes(1);
-        expect(fakeViewModel).toEqual({ param: 'baz', test: 'qux' });
-        bootstrapSpy.mockRestore();
-    });
-});
-describe('createComponentTemplate', () => {
-    it('generates the correct template string', () => {
-        const DummyComponent = class {
-        };
-        // The definition is already provided via module mocking.
-        const template = createComponentTemplate(DummyComponent, '<span>inner</span>');
-        expect(template).toBe('<dummy-comp prop.bind="prop"><span>inner</span></dummy-comp>');
-    });
-});

package/dist/preview/render.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/preview/render.test.js

@@ -1,126 +0,0 @@
-import { render, renderToCanvas, createComponentTemplate } from './render';
-import { STORY_CHANGED } from '@storybook/core-events';
-import { CustomElement } from 'aurelia';
-// Dummy component for testing
-class DummyComponent {
-}
-// ----------------------
-// Tests for render()
-// ----------------------
-describe('render()', () => {
-    test('should return object with component, props, and empty template', () => {
-        const args = { foo: 'bar' };
-        const context = { id: 'story-1', component: DummyComponent };
-        const result = render(args, context);
-        expect(result).toEqual({ Component: DummyComponent, props: args, template: '' });
-    });
-    test('should throw error if component is missing', () => {
-        const args = {};
-        const context = { id: 'story-2', component: undefined };
-        expect(() => render(args, context)).toThrowError(/Unable to render story/);
-    });
-});
-// ----------------------
-// Tests for createComponentTemplate()
-// ----------------------
-describe('createComponentTemplate()', () => {
-    test('should return a proper template string', () => {
-        // Create a fake definition for the dummy component
-        const fakeDefinition = {
-            name: 'dummy-comp',
-            bindables: {
-                prop1: { attribute: 'data-prop', name: 'prop1' },
-                prop2: { attribute: 'data-attr', name: 'prop2' }
-            }
-        };
-        // Spy on CustomElement.getDefinition to return our fake definition
-        const getDefinitionSpy = jest
-            .spyOn(CustomElement, 'getDefinition')
-            .mockReturnValue(fakeDefinition);
-        const template = createComponentTemplate(DummyComponent, 'inner content');
-        expect(template).toBe('<dummy-comp data-prop.bind="prop1" data-attr.bind="prop2">inner content</dummy-comp>');
-        // Restore the original function
-        getDefinitionSpy.mockRestore();
-    });
-});
-// ----------------------
-// Tests for renderToCanvas()
-// ----------------------
-describe('renderToCanvas()', () => {
-    beforeEach(() => {
-        // If needed, clear/reset any globals here.
-    });
-    test('should call showError if the story is undefined', async () => {
-        const canvasElement = document.createElement('div');
-        const showError = jest.fn();
-        const showMain = jest.fn();
-        // storyFn returns undefined to simulate missing Aurelia story result
-        const storyFn = jest.fn(() => undefined);
-        const storyContext = {
-            parameters: { args: { a: 1 } },
-            args: { b: 2 },
-            component: DummyComponent,
-            viewMode: 'story',
-            channel: { on: jest.fn(), off: jest.fn() }
-        };
-        const context = {
-            storyFn,
-            title: 'Test Title',
-            name: 'Test Story',
-            showMain,
-            showError,
-            forceRemount: false,
-            storyContext
-        };
-        // Calling renderToCanvas should immediately call showError.
-        const teardownFn = await renderToCanvas(context, canvasElement);
-        expect(showError).toHaveBeenCalled();
-        // Teardown function exists even if error occurred.
-        await teardownFn();
-    });
-    test('should bootstrap Aurelia app and execute teardown properly', async () => {
-        const canvasElement = document.createElement('div');
-        const showError = jest.fn();
-        const showMain = jest.fn();
-        const fakeChannel = { on: jest.fn(), off: jest.fn() };
-        // A valid Aurelia story result
-        const storyResult = { template: '<div></div>', container: {} };
-        const storyFn = jest.fn(() => storyResult);
-        const storyContext = {
-            parameters: { args: { testProp: true } },
-            args: { testProp: false },
-            component: DummyComponent,
-            viewMode: 'story',
-            channel: fakeChannel
-        };
-        const context = {
-            storyFn,
-            title: 'Success Title',
-            name: 'Success Story',
-            showMain,
-            showError,
-            forceRemount: false,
-            storyContext
-        };
-        // Fake Aurelia instance with start and stop methods
-        const fakeAurelia = {
-            start: jest.fn().mockResolvedValue(undefined),
-            stop: jest.fn().mockResolvedValue(undefined),
-            root: { controller: { viewModel: {} } }
-        };
-        // Stub bootstrapAureliaApp to return our fake Aurelia instance.
-        const { bootstrapAureliaApp } = await import('./render');
-        const bootstrapSpy = jest
-            .spyOn(require('./render'), 'bootstrapAureliaApp')
-            .mockResolvedValue(fakeAurelia);
-        const teardown = await renderToCanvas(context, canvasElement);
-        expect(showMain).toHaveBeenCalled();
-        expect(fakeChannel.on).toHaveBeenCalledWith(STORY_CHANGED, expect.any(Function));
-        expect(fakeAurelia.start).toHaveBeenCalled();
-        // Call the teardown function and verify cleanup calls.
-        await teardown();
-        expect(fakeChannel.off).toHaveBeenCalledWith(STORY_CHANGED, expect.any(Function));
-        expect(fakeAurelia.stop).toHaveBeenCalled();
-        jest.restoreAllMocks();
-    });
-});

package/dist/src/index.d.ts

@@ -1,3 +0,0 @@
-import { renderToCanvas } from './preview/render';
-export { renderToCanvas };
-export declare const render: typeof renderToCanvas;

package/dist/src/index.js

@@ -1,3 +0,0 @@
-import { renderToCanvas } from './preview/render';
-export { renderToCanvas };
-export const render = renderToCanvas;

package/dist/src/preset.d.ts

@@ -1,8 +0,0 @@
-/**
- * Optionally adjust the Vite configuration.
- */
-export declare function viteFinal(config: any): Promise<any>;
-declare const _default: {
-    viteFinal: typeof viteFinal;
-};
-export default _default;

package/dist/src/preview/render.d.ts

@@ -1,17 +0,0 @@
-import type { RenderContext, ArgsStoryFn } from '@storybook/types';
-import type { AureliaRenderer } from './types';
-import Aurelia, { Constructable } from 'aurelia';
-interface AureliaStoryResult {
-    template: string;
-    components?: unknown[];
-    Component?: unknown;
-    container?: any;
-    items?: unknown[];
-    innerHtml?: string;
-    props?: Record<string, any>;
-}
-export declare const render: ArgsStoryFn<AureliaRenderer>;
-export declare function renderToCanvas({ storyFn, title, name, showMain, showError, storyContext, forceRemount, }: RenderContext<AureliaRenderer>, canvasElement: HTMLElement, bootstrapAppFn?: typeof bootstrapAureliaApp): Promise<() => void>;
-export declare function bootstrapAureliaApp(story: AureliaStoryResult, args: Record<string, any>, domElement: HTMLElement, component?: Constructable): Omit<Aurelia, "enhance" | "register" | "app">;
-export declare function createComponentTemplate(component: Constructable, innerHtml?: string): string;
-export {};

package/dist/src/preview/types.d.ts

@@ -1,5 +0,0 @@
-import type { Renderer } from '@storybook/types';
-export interface AureliaRenderer extends Renderer {
-    /** The DOM element in which the story is rendered */
-    canvasElement: HTMLElement;
-}

package/dist/src/preview/types.js

@@ -1 +0,0 @@
-export {};