@stencil/storybook-plugin 0.2.0 → 0.4.0

package/README.md

@@ -105,6 +105,14 @@ export const Primary: Story = {
 };
 ```
 
+### Troubleshooting
+
+If you encounter any issues with the story rendering, please check the following:
+
+- If your `customElementsExportBehavior` is set to a value that lazy loads components, ensure that you are using `defineCustomElements()` in `preview.ts`. You should also define your component as a string in your story file: `component: 'my-component'` as it does not yet exist in the custom element registry.
+- If your `customElementsExportBehavior` is set to a value like `auto-define-custom-elements` or `default`, do not include `defineCustomElements()` in `preview.ts` and use the constructor as the component value in your story file: `component: MyComponent`.
+- Check the console for any error messages.
+
 ## Limitations
 
 This is early development and we are still seeing some limitations we want to see fixed:

package/dist/docs/index.cjs

@@ -0,0 +1,4 @@
+const require_docs = require('../docs-0uSy55NI.cjs');
+
+exports.renderHTML = require_docs.renderHTML;
+exports.sourceDecorator = require_docs.sourceDecorator;

package/dist/docs/index.d.cts

@@ -0,0 +1,12 @@
+import { StencilRenderer } from "../types-BjBqnnWi.cjs";
+import { VNode } from "@stencil/core";
+import { DecoratorFunction } from "storybook/internal/types";
+
+//#region src/docs/render-html.d.ts
+declare const renderHTML: (vnode: VNode) => string;
+//#endregion
+//#region src/docs/source-decorator.d.ts
+declare const sourceDecorator: DecoratorFunction<StencilRenderer<unknown>>;
+//#endregion
+export { renderHTML, sourceDecorator };
+//# sourceMappingURL=index.d.cts.map

package/dist/docs/index.d.ts

@@ -0,0 +1,12 @@
+import { StencilRenderer } from "../types-Dzw-ZY4t.js";
+import { VNode } from "@stencil/core";
+import { DecoratorFunction } from "storybook/internal/types";
+
+//#region src/docs/render-html.d.ts
+declare const renderHTML: (vnode: VNode) => string;
+//#endregion
+//#region src/docs/source-decorator.d.ts
+declare const sourceDecorator: DecoratorFunction<StencilRenderer<unknown>>;
+//#endregion
+export { renderHTML, sourceDecorator };
+//# sourceMappingURL=index.d.ts.map

package/dist/docs/index.js

@@ -0,0 +1,3 @@
+import { renderHTML, sourceDecorator } from "../docs-BTql9Bpv.js";
+
+export { renderHTML, sourceDecorator };

package/dist/docs-0uSy55NI.cjs

@@ -0,0 +1,54 @@
+const require_chunk = require('./chunk-CsX-DzYB.cjs');
+const storybook_internal_docs_tools = require_chunk.__toESM(require("storybook/internal/docs-tools"));
+const storybook_internal_preview_api = require_chunk.__toESM(require("storybook/internal/preview-api"));
+
+//#region src/docs/render-html.ts
+function vnodeToHtml(node, indentLevel = 0) {
+	const indent = "  ".repeat(indentLevel);
+	if (node.$text$ !== null) return indent + node.$text$;
+	if (node.$tag$ === null) return "";
+	const tag = node.$tag$;
+	const attrs = node.$attrs$ ? Object.entries(node.$attrs$).filter(([_, value]) => value !== void 0).map(([key, value]) => ` ${key}="${value}"`).join("") : "";
+	const children = node.$children$ ?? [];
+	if (children.length === 0) return `${indent}<${tag}${attrs}></${tag}>`;
+	const childrenHtml = children.map((child) => vnodeToHtml(child, indentLevel + 1)).join("\n");
+	return `${indent}<${tag}${attrs}>\n${childrenHtml}\n${indent}</${tag}>`;
+}
+const renderHTML = (vnode) => {
+	return vnodeToHtml(vnode);
+};
+
+//#endregion
+//#region src/docs/source-decorator.ts
+const skip = (context) => {
+	const sourceParams = context?.parameters.docs?.source;
+	const isArgsStory = context?.parameters.__isArgsStory;
+	if (sourceParams.type === storybook_internal_docs_tools.SourceType.DYNAMIC) return false;
+	return !isArgsStory || sourceParams?.code || sourceParams?.type === storybook_internal_docs_tools.SourceType.CODE;
+};
+const sourceDecorator = (storyFn, context) => {
+	const story = storyFn();
+	(0, storybook_internal_preview_api.useEffect)(() => {
+		const renderedForSource = context?.parameters.docs?.source?.excludeDecorators ? context.originalStoryFn(context.args, context) : story;
+		if (skip(context)) return;
+		switch (context.parameters.docs.source.language) {
+			case "html": (0, storybook_internal_preview_api.emitTransformCode)(renderHTML(renderedForSource), context);
+		}
+	});
+	return story;
+};
+
+//#endregion
+Object.defineProperty(exports, 'renderHTML', {
+  enumerable: true,
+  get: function () {
+    return renderHTML;
+  }
+});
+Object.defineProperty(exports, 'sourceDecorator', {
+  enumerable: true,
+  get: function () {
+    return sourceDecorator;
+  }
+});
+//# sourceMappingURL=docs-0uSy55NI.cjs.map

package/dist/docs-0uSy55NI.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"docs-0uSy55NI.cjs","names":["node: VNode","vnode: VNode","context: Parameters<DecoratorFunction<StencilRenderer<unknown>>>[1]","SourceType","sourceDecorator: DecoratorFunction<StencilRenderer<unknown>>"],"sources":["../src/docs/render-html.ts","../src/docs/source-decorator.ts"],"sourcesContent":["import { type VNode } from '@stencil/core';\n\nfunction vnodeToHtml(node: VNode, indentLevel = 0): string {\n  const indent = '  '.repeat(indentLevel);\n\n  if (node.$text$ !== null) {\n    return indent + node.$text$;\n  }\n\n  if (node.$tag$ === null) {\n    return '';\n  }\n\n  const tag = node.$tag$;\n\n  const attrs = node.$attrs$\n    ? Object.entries(node.$attrs$)\n        .filter(([_, value]) => value !== undefined)\n        .map(([key, value]) => ` ${key}=\"${value}\"`)\n        .join('')\n    : '';\n\n  const children = node.$children$ ?? [];\n\n  if (children.length === 0) {\n    return `${indent}<${tag}${attrs}></${tag}>`;\n  }\n\n  const childrenHtml = children.map((child) => vnodeToHtml(child, indentLevel + 1)).join('\\n');\n\n  return `${indent}<${tag}${attrs}>\\n${childrenHtml}\\n${indent}</${tag}>`;\n}\n\nexport const renderHTML = (vnode: VNode) => {\n  return vnodeToHtml(vnode);\n};\n","import { SourceType } from 'storybook/internal/docs-tools';\nimport { emitTransformCode, useEffect } from 'storybook/internal/preview-api';\nimport type { AnnotatedStoryFn, Args, DecoratorFunction } from 'storybook/internal/types';\nimport type { StencilRenderer } from '../types';\nimport { renderHTML } from './render-html';\n\ntype StoryFn<TArgs = Args> = AnnotatedStoryFn<StencilRenderer<unknown>, TArgs>;\n\nconst skip = (context: Parameters<DecoratorFunction<StencilRenderer<unknown>>>[1]) => {\n  const sourceParams = context?.parameters.docs?.source;\n  const isArgsStory = context?.parameters.__isArgsStory;\n\n  if (sourceParams.type === SourceType.DYNAMIC) return false;\n\n  return !isArgsStory || sourceParams?.code || sourceParams?.type === SourceType.CODE;\n};\n\nexport const sourceDecorator: DecoratorFunction<StencilRenderer<unknown>> = (storyFn, context) => {\n  const story = storyFn();\n\n  useEffect(() => {\n    const renderedForSource = context?.parameters.docs?.source?.excludeDecorators\n      ? (context.originalStoryFn as StoryFn)(context.args, context)\n      : story;\n\n    if (skip(context)) return;\n\n    switch (context.parameters.docs.source.language) {\n      case 'html': {\n        emitTransformCode(renderHTML(renderedForSource), context);\n      }\n    }\n  });\n\n  return story;\n};\n"],"mappings":";;;;;AAEA,SAAS,YAAYA,MAAa,cAAc,GAAW;CACzD,MAAM,SAAS,KAAK,OAAO,YAAY;AAEvC,KAAI,KAAK,WAAW,KAClB,QAAO,SAAS,KAAK;AAGvB,KAAI,KAAK,UAAU,KACjB,QAAO;CAGT,MAAM,MAAM,KAAK;CAEjB,MAAM,QAAQ,KAAK,UACf,OAAO,QAAQ,KAAK,QAAQ,CACzB,OAAO,CAAC,CAAC,GAAG,MAAM,KAAK,iBAAoB,CAC3C,IAAI,CAAC,CAAC,KAAK,MAAM,MAAM,GAAG,IAAI,IAAI,MAAM,GAAG,CAC3C,KAAK,GAAG,GACX;CAEJ,MAAM,WAAW,KAAK,cAAc,CAAE;AAEtC,KAAI,SAAS,WAAW,EACtB,SAAQ,EAAE,OAAO,GAAG,IAAI,EAAE,MAAM,KAAK,IAAI;CAG3C,MAAM,eAAe,SAAS,IAAI,CAAC,UAAU,YAAY,OAAO,cAAc,EAAE,CAAC,CAAC,KAAK,KAAK;AAE5F,SAAQ,EAAE,OAAO,GAAG,IAAI,EAAE,MAAM,KAAK,aAAa,IAAI,OAAO,IAAI,IAAI;AACtE;AAED,MAAa,aAAa,CAACC,UAAiB;AAC1C,QAAO,YAAY,MAAM;AAC1B;;;;AC3BD,MAAM,OAAO,CAACC,YAAwE;CACpF,MAAM,eAAe,SAAS,WAAW,MAAM;CAC/C,MAAM,cAAc,SAAS,WAAW;AAExC,KAAI,aAAa,SAASC,yCAAW,QAAS,QAAO;AAErD,SAAQ,eAAe,cAAc,QAAQ,cAAc,SAASA,yCAAW;AAChF;AAED,MAAaC,kBAA+D,CAAC,SAAS,YAAY;CAChG,MAAM,QAAQ,SAAS;AAEvB,+CAAU,MAAM;EACd,MAAM,oBAAoB,SAAS,WAAW,MAAM,QAAQ,oBACxD,AAAC,QAAQ,gBAA4B,QAAQ,MAAM,QAAQ,GAC3D;AAEJ,MAAI,KAAK,QAAQ,CAAE;AAEnB,UAAQ,QAAQ,WAAW,KAAK,OAAO,UAAvC;GACE,KAAK,OACH,uDAAkB,WAAW,kBAAkB,EAAE,QAAQ;EAE5D;CACF,EAAC;AAEF,QAAO;AACR"}

package/dist/docs-BTql9Bpv.js

@@ -0,0 +1,42 @@
+import { SourceType } from "storybook/internal/docs-tools";
+import { emitTransformCode, useEffect } from "storybook/internal/preview-api";
+
+//#region src/docs/render-html.ts
+function vnodeToHtml(node, indentLevel = 0) {
+	const indent = "  ".repeat(indentLevel);
+	if (node.$text$ !== null) return indent + node.$text$;
+	if (node.$tag$ === null) return "";
+	const tag = node.$tag$;
+	const attrs = node.$attrs$ ? Object.entries(node.$attrs$).filter(([_, value]) => value !== void 0).map(([key, value]) => ` ${key}="${value}"`).join("") : "";
+	const children = node.$children$ ?? [];
+	if (children.length === 0) return `${indent}<${tag}${attrs}></${tag}>`;
+	const childrenHtml = children.map((child) => vnodeToHtml(child, indentLevel + 1)).join("\n");
+	return `${indent}<${tag}${attrs}>\n${childrenHtml}\n${indent}</${tag}>`;
+}
+const renderHTML = (vnode) => {
+	return vnodeToHtml(vnode);
+};
+
+//#endregion
+//#region src/docs/source-decorator.ts
+const skip = (context) => {
+	const sourceParams = context?.parameters.docs?.source;
+	const isArgsStory = context?.parameters.__isArgsStory;
+	if (sourceParams.type === SourceType.DYNAMIC) return false;
+	return !isArgsStory || sourceParams?.code || sourceParams?.type === SourceType.CODE;
+};
+const sourceDecorator = (storyFn, context) => {
+	const story = storyFn();
+	useEffect(() => {
+		const renderedForSource = context?.parameters.docs?.source?.excludeDecorators ? context.originalStoryFn(context.args, context) : story;
+		if (skip(context)) return;
+		switch (context.parameters.docs.source.language) {
+			case "html": emitTransformCode(renderHTML(renderedForSource), context);
+		}
+	});
+	return story;
+};
+
+//#endregion
+export { renderHTML, sourceDecorator };
+//# sourceMappingURL=docs-BTql9Bpv.js.map

package/dist/docs-BTql9Bpv.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"docs-BTql9Bpv.js","names":["node: VNode","vnode: VNode","context: Parameters<DecoratorFunction<StencilRenderer<unknown>>>[1]","sourceDecorator: DecoratorFunction<StencilRenderer<unknown>>"],"sources":["../src/docs/render-html.ts","../src/docs/source-decorator.ts"],"sourcesContent":["import { type VNode } from '@stencil/core';\n\nfunction vnodeToHtml(node: VNode, indentLevel = 0): string {\n  const indent = '  '.repeat(indentLevel);\n\n  if (node.$text$ !== null) {\n    return indent + node.$text$;\n  }\n\n  if (node.$tag$ === null) {\n    return '';\n  }\n\n  const tag = node.$tag$;\n\n  const attrs = node.$attrs$\n    ? Object.entries(node.$attrs$)\n        .filter(([_, value]) => value !== undefined)\n        .map(([key, value]) => ` ${key}=\"${value}\"`)\n        .join('')\n    : '';\n\n  const children = node.$children$ ?? [];\n\n  if (children.length === 0) {\n    return `${indent}<${tag}${attrs}></${tag}>`;\n  }\n\n  const childrenHtml = children.map((child) => vnodeToHtml(child, indentLevel + 1)).join('\\n');\n\n  return `${indent}<${tag}${attrs}>\\n${childrenHtml}\\n${indent}</${tag}>`;\n}\n\nexport const renderHTML = (vnode: VNode) => {\n  return vnodeToHtml(vnode);\n};\n","import { SourceType } from 'storybook/internal/docs-tools';\nimport { emitTransformCode, useEffect } from 'storybook/internal/preview-api';\nimport type { AnnotatedStoryFn, Args, DecoratorFunction } from 'storybook/internal/types';\nimport type { StencilRenderer } from '../types';\nimport { renderHTML } from './render-html';\n\ntype StoryFn<TArgs = Args> = AnnotatedStoryFn<StencilRenderer<unknown>, TArgs>;\n\nconst skip = (context: Parameters<DecoratorFunction<StencilRenderer<unknown>>>[1]) => {\n  const sourceParams = context?.parameters.docs?.source;\n  const isArgsStory = context?.parameters.__isArgsStory;\n\n  if (sourceParams.type === SourceType.DYNAMIC) return false;\n\n  return !isArgsStory || sourceParams?.code || sourceParams?.type === SourceType.CODE;\n};\n\nexport const sourceDecorator: DecoratorFunction<StencilRenderer<unknown>> = (storyFn, context) => {\n  const story = storyFn();\n\n  useEffect(() => {\n    const renderedForSource = context?.parameters.docs?.source?.excludeDecorators\n      ? (context.originalStoryFn as StoryFn)(context.args, context)\n      : story;\n\n    if (skip(context)) return;\n\n    switch (context.parameters.docs.source.language) {\n      case 'html': {\n        emitTransformCode(renderHTML(renderedForSource), context);\n      }\n    }\n  });\n\n  return story;\n};\n"],"mappings":";;;;AAEA,SAAS,YAAYA,MAAa,cAAc,GAAW;CACzD,MAAM,SAAS,KAAK,OAAO,YAAY;AAEvC,KAAI,KAAK,WAAW,KAClB,QAAO,SAAS,KAAK;AAGvB,KAAI,KAAK,UAAU,KACjB,QAAO;CAGT,MAAM,MAAM,KAAK;CAEjB,MAAM,QAAQ,KAAK,UACf,OAAO,QAAQ,KAAK,QAAQ,CACzB,OAAO,CAAC,CAAC,GAAG,MAAM,KAAK,iBAAoB,CAC3C,IAAI,CAAC,CAAC,KAAK,MAAM,MAAM,GAAG,IAAI,IAAI,MAAM,GAAG,CAC3C,KAAK,GAAG,GACX;CAEJ,MAAM,WAAW,KAAK,cAAc,CAAE;AAEtC,KAAI,SAAS,WAAW,EACtB,SAAQ,EAAE,OAAO,GAAG,IAAI,EAAE,MAAM,KAAK,IAAI;CAG3C,MAAM,eAAe,SAAS,IAAI,CAAC,UAAU,YAAY,OAAO,cAAc,EAAE,CAAC,CAAC,KAAK,KAAK;AAE5F,SAAQ,EAAE,OAAO,GAAG,IAAI,EAAE,MAAM,KAAK,aAAa,IAAI,OAAO,IAAI,IAAI;AACtE;AAED,MAAa,aAAa,CAACC,UAAiB;AAC1C,QAAO,YAAY,MAAM;AAC1B;;;;AC3BD,MAAM,OAAO,CAACC,YAAwE;CACpF,MAAM,eAAe,SAAS,WAAW,MAAM;CAC/C,MAAM,cAAc,SAAS,WAAW;AAExC,KAAI,aAAa,SAAS,WAAW,QAAS,QAAO;AAErD,SAAQ,eAAe,cAAc,QAAQ,cAAc,SAAS,WAAW;AAChF;AAED,MAAaC,kBAA+D,CAAC,SAAS,YAAY;CAChG,MAAM,QAAQ,SAAS;AAEvB,WAAU,MAAM;EACd,MAAM,oBAAoB,SAAS,WAAW,MAAM,QAAQ,oBACxD,AAAC,QAAQ,gBAA4B,QAAQ,MAAM,QAAQ,GAC3D;AAEJ,MAAI,KAAK,QAAQ,CAAE;AAEnB,UAAQ,QAAQ,WAAW,KAAK,OAAO,UAAvC;GACE,KAAK,OACH,mBAAkB,WAAW,kBAAkB,EAAE,QAAQ;EAE5D;CACF,EAAC;AAEF,QAAO;AACR"}

package/dist/{preview-Dn8QZb01.js → entry-preview-CajE0iDc.js}

@@ -1,5 +1,6 @@
-import { simulatePageLoad } from "storybook/preview-api";
+import { enhanceArgTypes } from "storybook/internal/docs-tools";
 import { h, render } from "@stencil/core";
+import { simulatePageLoad } from "storybook/preview-api";
 
 //#region rolldown:runtime
 var __defProp = Object.defineProperty;
@@ -15,8 +16,9 @@ var __export = (target, all) => {
 const render$1 = (args, context) => {
 	const { component, parameters: parameters$1 } = context;
 	if (Array.isArray(component)) throw new Error("If your story does not contain a render function, you must provide a component property!");
-	const cmpName = customElements.getName(component);
-	if (!cmpName) throw new Error("Component is not registered!");
+	if (typeof component === "string" && !customElements.get(component)) throw new Error(`Stencil component not found. If you are not lazy loading your components with \`defineCustomElements()\` in preview.ts, pass a constructor value for component in your story \`component: MyComponent\``);
+	else if (typeof component !== "string" && !customElements.getName(component)) throw new Error(`Stencil component not found. If you are lazy loading your components with \`defineCustomElements()\` in preview.ts, pass a string value for component in your story \`component: 'my-component'\``);
+	const cmpName = typeof component === "string" ? component : customElements.getName(component);
 	const children = Object.entries(parameters$1.slots || []).map(([key, value]) => {
 		const slot = key === "default" ? void 0 : key;
 		const child = typeof value === "string" ? h(void 0, { slot }, value) : {
@@ -44,15 +46,17 @@ function renderToCanvas({ storyFn, showMain, storyContext }, canvasElement) {
 }
 
 //#endregion
-//#region src/preview.ts
-var preview_exports = {};
-__export(preview_exports, {
+//#region src/entry-preview.ts
+var entry_preview_exports = {};
+__export(entry_preview_exports, {
+	argTypesEnhancers: () => argTypesEnhancers,
 	parameters: () => parameters,
 	render: () => render$1,
 	renderToCanvas: () => renderToCanvas
 });
 const parameters = { renderer: "stencil" };
+const argTypesEnhancers = [enhanceArgTypes];
 
 //#endregion
-export { parameters, preview_exports, render$1 as render, renderToCanvas };
-//# sourceMappingURL=preview-Dn8QZb01.js.map
+export { argTypesEnhancers, entry_preview_exports, parameters, render$1 as render, renderToCanvas };
+//# sourceMappingURL=entry-preview-CajE0iDc.js.map

package/dist/entry-preview-CajE0iDc.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"entry-preview-CajE0iDc.js","names":["render: ArgsStoryFn<StencilRenderer<unknown>>","children: any[]","parameters","canvasElement: StencilRenderer<unknown>['canvasElement']","parameters: Parameters","argTypesEnhancers: ArgTypesEnhancer[]"],"sources":["../src/render.ts","../src/entry-preview.ts"],"sourcesContent":["import { h, render as renderStencil, VNode } from '@stencil/core';\nimport { ArgsStoryFn, RenderContext } from 'storybook/internal/types';\nimport { simulatePageLoad } from 'storybook/preview-api';\n\nimport type { StencilRenderer } from './types';\n\nexport const render: ArgsStoryFn<StencilRenderer<unknown>> = (args, context) => {\n  const { component, parameters } = context;\n\n  if (Array.isArray(component)) {\n    throw new Error('If your story does not contain a render function, you must provide a component property!');\n  }\n  if (typeof component === 'string' && !customElements.get(component)) {\n    throw new Error(\n      `Stencil component not found. If you are not lazy loading your components with \\`defineCustomElements()\\` in preview.ts, pass a constructor value for component in your story \\`component: MyComponent\\``,\n    );\n  } else if (typeof component !== 'string' && !customElements.getName(component)) {\n    throw new Error(\n      `Stencil component not found. If you are lazy loading your components with \\`defineCustomElements()\\` in preview.ts, pass a string value for component in your story \\`component: 'my-component'\\``,\n    );\n  }\n  const cmpName = typeof component === 'string' ? component : customElements.getName(component);\n\n  const children: any[] = Object.entries<VNode>(parameters.slots || []).map(([key, value]) => {\n    // if the parameter key is 'default' don't give it a slot name so it renders just as a child\n    const slot = key === 'default' ? undefined : key;\n    // if the value it s a string, create a vnode with the string as the children\n    const child =\n      typeof value === 'string'\n        ? h(undefined, { slot }, value)\n        : {\n            ...value,\n            $attrs$: {\n              slot,\n            },\n          };\n    // if the value is a fragment and it is a named slot, create a span element with the slot name\n    child.$tag$ = child.$tag$ || (slot ? 'span' : null);\n    return child.$tag$ ? child : child.$children$;\n  });\n\n  const Component = `${cmpName}`;\n  return h(Component, { ...args }, children);\n};\n\nexport function renderToCanvas(\n  { storyFn, showMain, storyContext }: RenderContext<StencilRenderer<unknown>>,\n  canvasElement: StencilRenderer<unknown>['canvasElement'],\n) {\n  const vdom = storyFn();\n  showMain();\n\n  /**\n   * If the component is not automatically registered after import, register it here\n   */\n  if (storyContext.component && storyContext.component.is && !customElements.get(storyContext.component.is)) {\n    customElements.define(storyContext.component.is, storyContext.component);\n  }\n\n  if (canvasElement.firstChild) {\n    canvasElement.removeChild(canvasElement.firstChild);\n  }\n\n  const element = document.createElement('div');\n  canvasElement.appendChild(element);\n  renderStencil(vdom, element);\n  simulatePageLoad(element);\n}\n","import { enhanceArgTypes } from 'storybook/internal/docs-tools';\nimport type { ArgTypesEnhancer } from 'storybook/internal/types';\nimport type { Parameters } from './types';\n\nexport const parameters: Parameters = { renderer: 'stencil' };\n\nexport { render, renderToCanvas } from './render';\n\nexport const argTypesEnhancers: ArgTypesEnhancer[] = [enhanceArgTypes];\n"],"mappings":";;;;;;;;;;;;;;;AAMA,MAAaA,WAAgD,CAAC,MAAM,YAAY;CAC9E,MAAM,EAAE,WAAW,0BAAY,GAAG;AAElC,KAAI,MAAM,QAAQ,UAAU,CAC1B,OAAM,IAAI,MAAM;AAElB,YAAW,cAAc,aAAa,eAAe,IAAI,UAAU,CACjE,OAAM,IAAI,OACP;iBAEa,cAAc,aAAa,eAAe,QAAQ,UAAU,CAC5E,OAAM,IAAI,OACP;CAGL,MAAM,iBAAiB,cAAc,WAAW,YAAY,eAAe,QAAQ,UAAU;CAE7F,MAAMC,WAAkB,OAAO,QAAeC,aAAW,SAAS,CAAE,EAAC,CAAC,IAAI,CAAC,CAAC,KAAK,MAAM,KAAK;EAE1F,MAAM,OAAO,QAAQ,qBAAwB;EAE7C,MAAM,eACG,UAAU,WACb,UAAa,EAAE,KAAM,GAAE,MAAM,GAC7B;GACE,GAAG;GACH,SAAS,EACP,KACD;EACF;AAEP,QAAM,QAAQ,MAAM,UAAU,OAAO,SAAS;AAC9C,SAAO,MAAM,QAAQ,QAAQ,MAAM;CACpC,EAAC;CAEF,MAAM,aAAa,EAAE,QAAQ;AAC7B,QAAO,EAAE,WAAW,EAAE,GAAG,KAAM,GAAE,SAAS;AAC3C;AAED,SAAgB,eACd,EAAE,SAAS,UAAU,cAAuD,EAC5EC,eACA;CACA,MAAM,OAAO,SAAS;AACtB,WAAU;;;;AAKV,KAAI,aAAa,aAAa,aAAa,UAAU,OAAO,eAAe,IAAI,aAAa,UAAU,GAAG,CACvG,gBAAe,OAAO,aAAa,UAAU,IAAI,aAAa,UAAU;AAG1E,KAAI,cAAc,WAChB,eAAc,YAAY,cAAc,WAAW;CAGrD,MAAM,UAAU,SAAS,cAAc,MAAM;AAC7C,eAAc,YAAY,QAAQ;AAClC,QAAc,MAAM,QAAQ;AAC5B,kBAAiB,QAAQ;AAC1B;;;;;;;;;;;AC/DD,MAAaC,aAAyB,EAAE,UAAU,UAAW;AAI7D,MAAaC,oBAAwC,CAAC,eAAgB"}

package/dist/{preview-D_4Gl5tg.cjs → entry-preview-DIDFrQZ9.cjs}

@@ -1,13 +1,15 @@
 const require_chunk = require('./chunk-CsX-DzYB.cjs');
-const storybook_preview_api = require_chunk.__toESM(require("storybook/preview-api"));
+const storybook_internal_docs_tools = require_chunk.__toESM(require("storybook/internal/docs-tools"));
 const __stencil_core = require_chunk.__toESM(require("@stencil/core"));
+const storybook_preview_api = require_chunk.__toESM(require("storybook/preview-api"));
 
 //#region src/render.ts
 const render = (args, context) => {
 	const { component, parameters: parameters$1 } = context;
 	if (Array.isArray(component)) throw new Error("If your story does not contain a render function, you must provide a component property!");
-	const cmpName = customElements.getName(component);
-	if (!cmpName) throw new Error("Component is not registered!");
+	if (typeof component === "string" && !customElements.get(component)) throw new Error(`Stencil component not found. If you are not lazy loading your components with \`defineCustomElements()\` in preview.ts, pass a constructor value for component in your story \`component: MyComponent\``);
+	else if (typeof component !== "string" && !customElements.getName(component)) throw new Error(`Stencil component not found. If you are lazy loading your components with \`defineCustomElements()\` in preview.ts, pass a string value for component in your story \`component: 'my-component'\``);
+	const cmpName = typeof component === "string" ? component : customElements.getName(component);
 	const children = Object.entries(parameters$1.slots || []).map(([key, value]) => {
 		const slot = key === "default" ? void 0 : key;
 		const child = typeof value === "string" ? (0, __stencil_core.h)(void 0, { slot }, value) : {
@@ -35,26 +37,34 @@ function renderToCanvas({ storyFn, showMain, storyContext }, canvasElement) {
 }
 
 //#endregion
-//#region src/preview.ts
-var preview_exports = {};
-require_chunk.__export(preview_exports, {
+//#region src/entry-preview.ts
+var entry_preview_exports = {};
+require_chunk.__export(entry_preview_exports, {
+	argTypesEnhancers: () => argTypesEnhancers,
 	parameters: () => parameters,
 	render: () => render,
 	renderToCanvas: () => renderToCanvas
 });
 const parameters = { renderer: "stencil" };
+const argTypesEnhancers = [storybook_internal_docs_tools.enhanceArgTypes];
 
 //#endregion
-Object.defineProperty(exports, 'parameters', {
+Object.defineProperty(exports, 'argTypesEnhancers', {
   enumerable: true,
   get: function () {
-    return parameters;
+    return argTypesEnhancers;
+  }
+});
+Object.defineProperty(exports, 'entry_preview_exports', {
+  enumerable: true,
+  get: function () {
+    return entry_preview_exports;
   }
 });
-Object.defineProperty(exports, 'preview_exports', {
+Object.defineProperty(exports, 'parameters', {
   enumerable: true,
   get: function () {
-    return preview_exports;
+    return parameters;
   }
 });
 Object.defineProperty(exports, 'render', {
@@ -69,4 +79,4 @@ Object.defineProperty(exports, 'renderToCanvas', {
     return renderToCanvas;
   }
 });
-//# sourceMappingURL=preview-D_4Gl5tg.cjs.map
+//# sourceMappingURL=entry-preview-DIDFrQZ9.cjs.map

package/dist/entry-preview-DIDFrQZ9.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"entry-preview-DIDFrQZ9.cjs","names":["render: ArgsStoryFn<StencilRenderer<unknown>>","children: any[]","parameters","canvasElement: StencilRenderer<unknown>['canvasElement']","parameters: Parameters","argTypesEnhancers: ArgTypesEnhancer[]","enhanceArgTypes"],"sources":["../src/render.ts","../src/entry-preview.ts"],"sourcesContent":["import { h, render as renderStencil, VNode } from '@stencil/core';\nimport { ArgsStoryFn, RenderContext } from 'storybook/internal/types';\nimport { simulatePageLoad } from 'storybook/preview-api';\n\nimport type { StencilRenderer } from './types';\n\nexport const render: ArgsStoryFn<StencilRenderer<unknown>> = (args, context) => {\n  const { component, parameters } = context;\n\n  if (Array.isArray(component)) {\n    throw new Error('If your story does not contain a render function, you must provide a component property!');\n  }\n  if (typeof component === 'string' && !customElements.get(component)) {\n    throw new Error(\n      `Stencil component not found. If you are not lazy loading your components with \\`defineCustomElements()\\` in preview.ts, pass a constructor value for component in your story \\`component: MyComponent\\``,\n    );\n  } else if (typeof component !== 'string' && !customElements.getName(component)) {\n    throw new Error(\n      `Stencil component not found. If you are lazy loading your components with \\`defineCustomElements()\\` in preview.ts, pass a string value for component in your story \\`component: 'my-component'\\``,\n    );\n  }\n  const cmpName = typeof component === 'string' ? component : customElements.getName(component);\n\n  const children: any[] = Object.entries<VNode>(parameters.slots || []).map(([key, value]) => {\n    // if the parameter key is 'default' don't give it a slot name so it renders just as a child\n    const slot = key === 'default' ? undefined : key;\n    // if the value it s a string, create a vnode with the string as the children\n    const child =\n      typeof value === 'string'\n        ? h(undefined, { slot }, value)\n        : {\n            ...value,\n            $attrs$: {\n              slot,\n            },\n          };\n    // if the value is a fragment and it is a named slot, create a span element with the slot name\n    child.$tag$ = child.$tag$ || (slot ? 'span' : null);\n    return child.$tag$ ? child : child.$children$;\n  });\n\n  const Component = `${cmpName}`;\n  return h(Component, { ...args }, children);\n};\n\nexport function renderToCanvas(\n  { storyFn, showMain, storyContext }: RenderContext<StencilRenderer<unknown>>,\n  canvasElement: StencilRenderer<unknown>['canvasElement'],\n) {\n  const vdom = storyFn();\n  showMain();\n\n  /**\n   * If the component is not automatically registered after import, register it here\n   */\n  if (storyContext.component && storyContext.component.is && !customElements.get(storyContext.component.is)) {\n    customElements.define(storyContext.component.is, storyContext.component);\n  }\n\n  if (canvasElement.firstChild) {\n    canvasElement.removeChild(canvasElement.firstChild);\n  }\n\n  const element = document.createElement('div');\n  canvasElement.appendChild(element);\n  renderStencil(vdom, element);\n  simulatePageLoad(element);\n}\n","import { enhanceArgTypes } from 'storybook/internal/docs-tools';\nimport type { ArgTypesEnhancer } from 'storybook/internal/types';\nimport type { Parameters } from './types';\n\nexport const parameters: Parameters = { renderer: 'stencil' };\n\nexport { render, renderToCanvas } from './render';\n\nexport const argTypesEnhancers: ArgTypesEnhancer[] = [enhanceArgTypes];\n"],"mappings":";;;;;;AAMA,MAAaA,SAAgD,CAAC,MAAM,YAAY;CAC9E,MAAM,EAAE,WAAW,0BAAY,GAAG;AAElC,KAAI,MAAM,QAAQ,UAAU,CAC1B,OAAM,IAAI,MAAM;AAElB,YAAW,cAAc,aAAa,eAAe,IAAI,UAAU,CACjE,OAAM,IAAI,OACP;iBAEa,cAAc,aAAa,eAAe,QAAQ,UAAU,CAC5E,OAAM,IAAI,OACP;CAGL,MAAM,iBAAiB,cAAc,WAAW,YAAY,eAAe,QAAQ,UAAU;CAE7F,MAAMC,WAAkB,OAAO,QAAeC,aAAW,SAAS,CAAE,EAAC,CAAC,IAAI,CAAC,CAAC,KAAK,MAAM,KAAK;EAE1F,MAAM,OAAO,QAAQ,qBAAwB;EAE7C,MAAM,eACG,UAAU,WACb,8BAAa,EAAE,KAAM,GAAE,MAAM,GAC7B;GACE,GAAG;GACH,SAAS,EACP,KACD;EACF;AAEP,QAAM,QAAQ,MAAM,UAAU,OAAO,SAAS;AAC9C,SAAO,MAAM,QAAQ,QAAQ,MAAM;CACpC,EAAC;CAEF,MAAM,aAAa,EAAE,QAAQ;AAC7B,QAAO,sBAAE,WAAW,EAAE,GAAG,KAAM,GAAE,SAAS;AAC3C;AAED,SAAgB,eACd,EAAE,SAAS,UAAU,cAAuD,EAC5EC,eACA;CACA,MAAM,OAAO,SAAS;AACtB,WAAU;;;;AAKV,KAAI,aAAa,aAAa,aAAa,UAAU,OAAO,eAAe,IAAI,aAAa,UAAU,GAAG,CACvG,gBAAe,OAAO,aAAa,UAAU,IAAI,aAAa,UAAU;AAG1E,KAAI,cAAc,WAChB,eAAc,YAAY,cAAc,WAAW;CAGrD,MAAM,UAAU,SAAS,cAAc,MAAM;AAC7C,eAAc,YAAY,QAAQ;AAClC,4BAAc,MAAM,QAAQ;AAC5B,6CAAiB,QAAQ;AAC1B;;;;;;;;;;;AC/DD,MAAaC,aAAyB,EAAE,UAAU,UAAW;AAI7D,MAAaC,oBAAwC,CAACC,6CAAgB"}

package/dist/entry-preview-docs.cjs

@@ -0,0 +1,18 @@
+const require_chunk = require('./chunk-CsX-DzYB.cjs');
+const require_docs = require('./docs-0uSy55NI.cjs');
+const storybook_internal_docs_tools = require_chunk.__toESM(require("storybook/internal/docs-tools"));
+
+//#region src/entry-preview-docs.ts
+const decorators = [require_docs.sourceDecorator];
+const parameters = { docs: {
+	story: { inline: true },
+	source: {
+		type: storybook_internal_docs_tools.SourceType.DYNAMIC,
+		language: "html"
+	}
+} };
+
+//#endregion
+exports.decorators = decorators;
+exports.parameters = parameters;
+//# sourceMappingURL=entry-preview-docs.cjs.map

package/dist/entry-preview-docs.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"entry-preview-docs.cjs","names":["decorators: DecoratorFunction<StencilRenderer<unknown>>[]","sourceDecorator","SourceType"],"sources":["../src/entry-preview-docs.ts"],"sourcesContent":["import { SourceType } from 'storybook/internal/docs-tools';\nimport type { DecoratorFunction } from 'storybook/internal/types';\n\nimport { sourceDecorator } from './docs';\nimport type { StencilRenderer } from './types';\n\nexport const decorators: DecoratorFunction<StencilRenderer<unknown>>[] = [sourceDecorator];\n\nexport const parameters = {\n  docs: {\n    story: { inline: true },\n    source: {\n      type: SourceType.DYNAMIC,\n      language: 'html',\n    },\n  },\n};\n"],"mappings":";;;;;AAMA,MAAaA,aAA4D,CAACC,4BAAgB;AAE1F,MAAa,aAAa,EACxB,MAAM;CACJ,OAAO,EAAE,QAAQ,KAAM;CACvB,QAAQ;EACN,MAAMC,yCAAW;EACjB,UAAU;CACX;AACF,EACF"}

package/dist/entry-preview-docs.d.cts

@@ -0,0 +1,20 @@
+import { StencilRenderer } from "./types-BjBqnnWi.cjs";
+import { DecoratorFunction } from "storybook/internal/types";
+import { SourceType } from "storybook/internal/docs-tools";
+
+//#region src/entry-preview-docs.d.ts
+declare const decorators: DecoratorFunction<StencilRenderer<unknown>>[];
+declare const parameters: {
+  docs: {
+    story: {
+      inline: boolean;
+    };
+    source: {
+      type: SourceType;
+      language: string;
+    };
+  };
+};
+//#endregion
+export { decorators, parameters };
+//# sourceMappingURL=entry-preview-docs.d.cts.map

package/dist/entry-preview-docs.d.ts

@@ -0,0 +1,20 @@
+import { StencilRenderer } from "./types-Dzw-ZY4t.js";
+import { SourceType } from "storybook/internal/docs-tools";
+import { DecoratorFunction } from "storybook/internal/types";
+
+//#region src/entry-preview-docs.d.ts
+declare const decorators: DecoratorFunction<StencilRenderer<unknown>>[];
+declare const parameters: {
+  docs: {
+    story: {
+      inline: boolean;
+    };
+    source: {
+      type: SourceType;
+      language: string;
+    };
+  };
+};
+//#endregion
+export { decorators, parameters };
+//# sourceMappingURL=entry-preview-docs.d.ts.map

package/dist/entry-preview-docs.js

@@ -0,0 +1,16 @@
+import { sourceDecorator } from "./docs-BTql9Bpv.js";
+import { SourceType } from "storybook/internal/docs-tools";
+
+//#region src/entry-preview-docs.ts
+const decorators = [sourceDecorator];
+const parameters = { docs: {
+	story: { inline: true },
+	source: {
+		type: SourceType.DYNAMIC,
+		language: "html"
+	}
+} };
+
+//#endregion
+export { decorators, parameters };
+//# sourceMappingURL=entry-preview-docs.js.map

package/dist/entry-preview-docs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"entry-preview-docs.js","names":["decorators: DecoratorFunction<StencilRenderer<unknown>>[]"],"sources":["../src/entry-preview-docs.ts"],"sourcesContent":["import { SourceType } from 'storybook/internal/docs-tools';\nimport type { DecoratorFunction } from 'storybook/internal/types';\n\nimport { sourceDecorator } from './docs';\nimport type { StencilRenderer } from './types';\n\nexport const decorators: DecoratorFunction<StencilRenderer<unknown>>[] = [sourceDecorator];\n\nexport const parameters = {\n  docs: {\n    story: { inline: true },\n    source: {\n      type: SourceType.DYNAMIC,\n      language: 'html',\n    },\n  },\n};\n"],"mappings":";;;;AAMA,MAAaA,aAA4D,CAAC,eAAgB;AAE1F,MAAa,aAAa,EACxB,MAAM;CACJ,OAAO,EAAE,QAAQ,KAAM;CACvB,QAAQ;EACN,MAAM,WAAW;EACjB,UAAU;CACX;AACF,EACF"}

package/dist/entry-preview.cjs

@@ -0,0 +1,6 @@
+const require_entry_preview = require('./entry-preview-DIDFrQZ9.cjs');
+
+exports.argTypesEnhancers = require_entry_preview.argTypesEnhancers;
+exports.parameters = require_entry_preview.parameters;
+exports.render = require_entry_preview.render;
+exports.renderToCanvas = require_entry_preview.renderToCanvas;

package/dist/entry-preview.d.cts

@@ -0,0 +1,17 @@
+import { Parameters, StencilRenderer } from "./types-BjBqnnWi.cjs";
+import { ArgTypesEnhancer, ArgsStoryFn, RenderContext } from "storybook/internal/types";
+
+//#region src/render.d.ts
+declare const render: ArgsStoryFn<StencilRenderer<unknown>>;
+declare function renderToCanvas({
+  storyFn,
+  showMain,
+  storyContext
+}: RenderContext<StencilRenderer<unknown>>, canvasElement: StencilRenderer<unknown>['canvasElement']): void;
+//#endregion
+//#region src/entry-preview.d.ts
+declare const parameters: Parameters;
+declare const argTypesEnhancers: ArgTypesEnhancer[];
+//#endregion
+export { argTypesEnhancers, parameters, render, renderToCanvas };
+//# sourceMappingURL=entry-preview.d.cts.map

package/dist/entry-preview.d.ts

@@ -0,0 +1,17 @@
+import { Parameters, StencilRenderer } from "./types-Dzw-ZY4t.js";
+import { ArgTypesEnhancer, ArgsStoryFn, RenderContext } from "storybook/internal/types";
+
+//#region src/render.d.ts
+declare const render: ArgsStoryFn<StencilRenderer<unknown>>;
+declare function renderToCanvas({
+  storyFn,
+  showMain,
+  storyContext
+}: RenderContext<StencilRenderer<unknown>>, canvasElement: StencilRenderer<unknown>['canvasElement']): void;
+//#endregion
+//#region src/entry-preview.d.ts
+declare const parameters: Parameters;
+declare const argTypesEnhancers: ArgTypesEnhancer[];
+//#endregion
+export { argTypesEnhancers, parameters, render, renderToCanvas };
+//# sourceMappingURL=entry-preview.d.ts.map

package/dist/entry-preview.js

@@ -0,0 +1,3 @@
+import { argTypesEnhancers, parameters, render, renderToCanvas } from "./entry-preview-CajE0iDc.js";
+
+export { argTypesEnhancers, parameters, render, renderToCanvas };

package/dist/index.cjs

@@ -1,5 +1,5 @@
 const require_chunk = require('./chunk-CsX-DzYB.cjs');
-const require_preview = require('./preview-D_4Gl5tg.cjs');
+const require_entry_preview = require('./entry-preview-DIDFrQZ9.cjs');
 const storybook_preview_api = require_chunk.__toESM(require("storybook/preview-api"));
 
 //#region src/portable-stories.tsx
@@ -23,7 +23,7 @@ const storybook_preview_api = require_chunk.__toESM(require("storybook/preview-a
 * @param projectAnnotations - E.g. (import projectAnnotations from '../.storybook/preview')
 */
 function setProjectAnnotations(projectAnnotations) {
-	(0, storybook_preview_api.setDefaultProjectAnnotations)(require_preview.preview_exports);
+	(0, storybook_preview_api.setDefaultProjectAnnotations)(require_entry_preview.entry_preview_exports);
 	return (0, storybook_preview_api.setProjectAnnotations)(projectAnnotations);
 }
 

package/dist/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","names":["projectAnnotations: NamedOrDefaultProjectAnnotations<any> | NamedOrDefaultProjectAnnotations<any>[]","stencilAnnotations"],"sources":["../src/portable-stories.tsx"],"sourcesContent":["import type { NamedOrDefaultProjectAnnotations, NormalizedProjectAnnotations } from 'storybook/internal/types';\n\nimport {\n  setProjectAnnotations as originalSetProjectAnnotations,\n  setDefaultProjectAnnotations,\n} from 'storybook/preview-api';\n\nimport * as stencilAnnotations from './preview';\nimport type { StencilRenderer } from './types';\n\n/**\n * Function that sets the globalConfig of your storybook. The global config is the preview module of\n * your .storybook folder.\n *\n * It should be run a single time, so that your global config (e.g. decorators) is applied to your\n * stories when using `composeStories` or `composeStory`.\n *\n * Example:\n *\n * ```jsx\n * // setup-file.js\n * import { setProjectAnnotations } from '@storybook/web-components';\n * import projectAnnotations from './.storybook/preview';\n *\n * setProjectAnnotations(projectAnnotations);\n * ```\n *\n * @param projectAnnotations - E.g. (import projectAnnotations from '../.storybook/preview')\n */\nexport function setProjectAnnotations(\n  projectAnnotations: NamedOrDefaultProjectAnnotations<any> | NamedOrDefaultProjectAnnotations<any>[],\n): NormalizedProjectAnnotations<StencilRenderer<unknown>> {\n  setDefaultProjectAnnotations(stencilAnnotations);\n  return originalSetProjectAnnotations(projectAnnotations) as NormalizedProjectAnnotations<StencilRenderer<unknown>>;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AA6BA,SAAgB,sBACdA,oBACwD;AACxD,yDAA6BC,gCAAmB;AAChD,QAAO,iDAA8B,mBAAmB;AACzD"}
+{"version":3,"file":"index.cjs","names":["projectAnnotations: NamedOrDefaultProjectAnnotations<any> | NamedOrDefaultProjectAnnotations<any>[]","stencilAnnotations"],"sources":["../src/portable-stories.tsx"],"sourcesContent":["import type { NamedOrDefaultProjectAnnotations, NormalizedProjectAnnotations } from 'storybook/internal/types';\n\nimport {\n  setProjectAnnotations as originalSetProjectAnnotations,\n  setDefaultProjectAnnotations,\n} from 'storybook/preview-api';\n\nimport * as stencilAnnotations from './entry-preview';\nimport type { StencilRenderer } from './types';\n\n/**\n * Function that sets the globalConfig of your storybook. The global config is the preview module of\n * your .storybook folder.\n *\n * It should be run a single time, so that your global config (e.g. decorators) is applied to your\n * stories when using `composeStories` or `composeStory`.\n *\n * Example:\n *\n * ```jsx\n * // setup-file.js\n * import { setProjectAnnotations } from '@storybook/web-components';\n * import projectAnnotations from './.storybook/preview';\n *\n * setProjectAnnotations(projectAnnotations);\n * ```\n *\n * @param projectAnnotations - E.g. (import projectAnnotations from '../.storybook/preview')\n */\nexport function setProjectAnnotations(\n  projectAnnotations: NamedOrDefaultProjectAnnotations<any> | NamedOrDefaultProjectAnnotations<any>[],\n): NormalizedProjectAnnotations<StencilRenderer<unknown>> {\n  setDefaultProjectAnnotations(stencilAnnotations);\n  return originalSetProjectAnnotations(projectAnnotations) as NormalizedProjectAnnotations<StencilRenderer<unknown>>;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AA6BA,SAAgB,sBACdA,oBACwD;AACxD,yDAA6BC,4CAAmB;AAChD,QAAO,iDAA8B,mBAAmB;AACzD"}

package/dist/index.d.cts

@@ -1,4 +1,4 @@
-import { ArgTypes, Args, Decorator, Loader, Meta, Parameters, Preview, StencilRenderer, StoryContext, StoryFn, StoryObj, StorybookConfig, StrictArgs } from "./types-CR2AtVj_.cjs";
+import { ArgTypes, Args, Decorator, Loader, Meta, Parameters, Preview, StencilRenderer, StoryContext, StoryFn, StoryObj, StorybookConfig, StrictArgs } from "./types-BjBqnnWi.cjs";
 import { NamedOrDefaultProjectAnnotations, NormalizedProjectAnnotations } from "storybook/internal/types";
 
 //#region @types/rollup-parseAst.d.ts

package/dist/index.d.ts

@@ -1,5 +1,5 @@
-import "./rollup-parseAst-t-4tfMPG.js";
-import { ArgTypes, Args, Decorator, Loader, Meta, Parameters, Preview, StencilRenderer, StoryContext, StoryFn, StoryObj, StorybookConfig, StrictArgs } from "./types-DoLyzAU3.js";
+import "./rollup-parseAst-DXE9IfcK.js";
+import { ArgTypes, Args, Decorator, Loader, Meta, Parameters, Preview, StencilRenderer, StoryContext, StoryFn, StoryObj, StorybookConfig, StrictArgs } from "./types-Dzw-ZY4t.js";
 import { NamedOrDefaultProjectAnnotations, NormalizedProjectAnnotations } from "storybook/internal/types";
 
 //#region src/portable-stories.d.ts

package/dist/index.js

@@ -1,5 +1,5 @@
-import { preview_exports } from "./preview-Dn8QZb01.js";
-import "./rollup-parseAst-t-4tfMPG.d.ts";
+import { entry_preview_exports } from "./entry-preview-CajE0iDc.js";
+import "./rollup-parseAst-DXE9IfcK.d.ts";
 import { setDefaultProjectAnnotations, setProjectAnnotations as setProjectAnnotations$1 } from "storybook/preview-api";
 
 //#region src/portable-stories.tsx
@@ -23,7 +23,7 @@ import { setDefaultProjectAnnotations, setProjectAnnotations as setProjectAnnota
 * @param projectAnnotations - E.g. (import projectAnnotations from '../.storybook/preview')
 */
 function setProjectAnnotations(projectAnnotations) {
-	setDefaultProjectAnnotations(preview_exports);
+	setDefaultProjectAnnotations(entry_preview_exports);
 	return setProjectAnnotations$1(projectAnnotations);
 }
 

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["projectAnnotations: NamedOrDefaultProjectAnnotations<any> | NamedOrDefaultProjectAnnotations<any>[]","stencilAnnotations"],"sources":["../src/portable-stories.tsx"],"sourcesContent":["import type { NamedOrDefaultProjectAnnotations, NormalizedProjectAnnotations } from 'storybook/internal/types';\n\nimport {\n  setProjectAnnotations as originalSetProjectAnnotations,\n  setDefaultProjectAnnotations,\n} from 'storybook/preview-api';\n\nimport * as stencilAnnotations from './preview';\nimport type { StencilRenderer } from './types';\n\n/**\n * Function that sets the globalConfig of your storybook. The global config is the preview module of\n * your .storybook folder.\n *\n * It should be run a single time, so that your global config (e.g. decorators) is applied to your\n * stories when using `composeStories` or `composeStory`.\n *\n * Example:\n *\n * ```jsx\n * // setup-file.js\n * import { setProjectAnnotations } from '@storybook/web-components';\n * import projectAnnotations from './.storybook/preview';\n *\n * setProjectAnnotations(projectAnnotations);\n * ```\n *\n * @param projectAnnotations - E.g. (import projectAnnotations from '../.storybook/preview')\n */\nexport function setProjectAnnotations(\n  projectAnnotations: NamedOrDefaultProjectAnnotations<any> | NamedOrDefaultProjectAnnotations<any>[],\n): NormalizedProjectAnnotations<StencilRenderer<unknown>> {\n  setDefaultProjectAnnotations(stencilAnnotations);\n  return originalSetProjectAnnotations(projectAnnotations) as NormalizedProjectAnnotations<StencilRenderer<unknown>>;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AA6BA,SAAgB,sBACdA,oBACwD;AACxD,8BAA6BC,gBAAmB;AAChD,QAAO,wBAA8B,mBAAmB;AACzD"}
+{"version":3,"file":"index.js","names":["projectAnnotations: NamedOrDefaultProjectAnnotations<any> | NamedOrDefaultProjectAnnotations<any>[]","stencilAnnotations"],"sources":["../src/portable-stories.tsx"],"sourcesContent":["import type { NamedOrDefaultProjectAnnotations, NormalizedProjectAnnotations } from 'storybook/internal/types';\n\nimport {\n  setProjectAnnotations as originalSetProjectAnnotations,\n  setDefaultProjectAnnotations,\n} from 'storybook/preview-api';\n\nimport * as stencilAnnotations from './entry-preview';\nimport type { StencilRenderer } from './types';\n\n/**\n * Function that sets the globalConfig of your storybook. The global config is the preview module of\n * your .storybook folder.\n *\n * It should be run a single time, so that your global config (e.g. decorators) is applied to your\n * stories when using `composeStories` or `composeStory`.\n *\n * Example:\n *\n * ```jsx\n * // setup-file.js\n * import { setProjectAnnotations } from '@storybook/web-components';\n * import projectAnnotations from './.storybook/preview';\n *\n * setProjectAnnotations(projectAnnotations);\n * ```\n *\n * @param projectAnnotations - E.g. (import projectAnnotations from '../.storybook/preview')\n */\nexport function setProjectAnnotations(\n  projectAnnotations: NamedOrDefaultProjectAnnotations<any> | NamedOrDefaultProjectAnnotations<any>[],\n): NormalizedProjectAnnotations<StencilRenderer<unknown>> {\n  setDefaultProjectAnnotations(stencilAnnotations);\n  return originalSetProjectAnnotations(projectAnnotations) as NormalizedProjectAnnotations<StencilRenderer<unknown>>;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AA6BA,SAAgB,sBACdA,oBACwD;AACxD,8BAA6BC,sBAAmB;AAChD,QAAO,wBAA8B,mBAAmB;AACzD"}

package/dist/node/index.d.cts

@@ -1,4 +1,4 @@
-import { StorybookConfig } from "../types-CR2AtVj_.cjs";
+import { StorybookConfig } from "../types-BjBqnnWi.cjs";
 
 //#region src/node/index.d.ts
 declare function defineMain(config: StorybookConfig): StorybookConfig;

package/dist/node/index.d.ts

@@ -1,4 +1,4 @@
-import { StorybookConfig } from "../types-DoLyzAU3.js";
+import { StorybookConfig } from "../types-Dzw-ZY4t.js";
 
 //#region src/node/index.d.ts
 declare function defineMain(config: StorybookConfig): StorybookConfig;

package/dist/preset.cjs

@@ -1,15 +1,15 @@
 const require_chunk = require('./chunk-CsX-DzYB.cjs');
-const path = require_chunk.__toESM(require("path"));
 const module$1 = require_chunk.__toESM(require("module"));
+const path = require_chunk.__toESM(require("path"));
 const url = require_chunk.__toESM(require("url"));
-const vite = require_chunk.__toESM(require("vite"));
 const unplugin_stencil_vite = require_chunk.__toESM(require("unplugin-stencil/vite"));
+const vite = require_chunk.__toESM(require("vite"));
 
 //#region src/preset.ts
 const require$1 = (0, module$1.createRequire)(require("url").pathToFileURL(__filename).href);
 const getAbsolutePath = (input) => (0, path.dirname)(require$1.resolve((0, path.join)(input, "package.json")));
 const __dirname$1 = (0, path.dirname)((0, url.fileURLToPath)(require("url").pathToFileURL(__filename).href));
-const renderer = (0, path.join)(__dirname$1, "preview.js");
+const renderer = (0, path.join)(__dirname$1, "entry-preview.js");
 const core = {
 	builder: getAbsolutePath("@storybook/builder-vite"),
 	renderer
@@ -27,7 +27,7 @@ const viteFinal = async (defaultConfig) => {
 const previewAnnotations = async (input = [], options) => {
 	const docsEnabled = Object.keys(await options.presets.apply("docs", {}, options)).length > 0;
 	const result = [];
-	return result.concat(input).concat([renderer]).concat(docsEnabled ? [(0, path.resolve)(getAbsolutePath("@storybook/html"), "dist", "entry-preview-docs.mjs")] : []);
+	return result.concat(input).concat([renderer]).concat(docsEnabled ? [(0, path.join)(__dirname$1, "entry-preview-docs.js")] : []);
 };
 
 //#endregion

package/dist/preset.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"preset.cjs","names":["require","input: I","__dirname","core: StorybookConfig['core']","viteFinal: StorybookConfig['viteFinal']","previewAnnotations: StorybookConfig['previewAnnotations']","result: string[]"],"sources":["../src/preset.ts"],"sourcesContent":["/**\n * we can't prefix the Node.js imports with `node:` because it will break\n * within Storybook due to its Vite setup.\n */\nimport { dirname, join, resolve } from 'path';\nimport { createRequire } from 'module';\nimport { fileURLToPath } from 'url';\n\nimport { mergeConfig } from 'vite';\nimport stencil from 'unplugin-stencil/vite';\n\nimport { StorybookConfig } from './types.js';\n\nconst require = createRequire(import.meta.url);\nconst getAbsolutePath = <I extends string>(input: I): I => dirname(require.resolve(join(input, 'package.json'))) as any;\n\nconst __dirname = dirname(fileURLToPath(import.meta.url));\n\nconst renderer = join(__dirname, 'preview.js');\n\nexport const core: StorybookConfig['core'] = {\n  builder: getAbsolutePath('@storybook/builder-vite'),\n  renderer,\n};\n\nexport const viteFinal: StorybookConfig['viteFinal'] = async (defaultConfig) => {\n  const config = mergeConfig(defaultConfig, {\n    build: {\n      target: 'es2020',\n      rollupOptions: {\n        external: ['@stencil/core'],\n      },\n    },\n    plugins: [\n      stencil({\n        rootPath: defaultConfig.root,\n      }),\n    ],\n  });\n\n  return config;\n};\n\nexport const previewAnnotations: StorybookConfig['previewAnnotations'] = async (input = [], options) => {\n  const docsEnabled = Object.keys(await options.presets.apply('docs', {}, options)).length > 0;\n  const result: string[] = [];\n\n  return result\n    .concat(input)\n    .concat([renderer])\n    .concat(docsEnabled ? [resolve(getAbsolutePath('@storybook/html'), 'dist', 'entry-preview-docs.mjs')] : []);\n};\n"],"mappings":";;;;;;;;AAaA,MAAMA,YAAU,0EAA8B;AAC9C,MAAM,kBAAkB,CAAmBC,UAAgB,kBAAQ,UAAQ,QAAQ,eAAK,OAAO,eAAe,CAAC,CAAC;AAEhH,MAAMC,cAAY,kBAAQ,qEAA8B,CAAC;AAEzD,MAAM,WAAW,eAAKA,aAAW,aAAa;AAE9C,MAAaC,OAAgC;CAC3C,SAAS,gBAAgB,0BAA0B;CACnD;AACD;AAED,MAAaC,YAA0C,OAAO,kBAAkB;CAC9E,MAAM,SAAS,sBAAY,eAAe;EACxC,OAAO;GACL,QAAQ;GACR,eAAe,EACb,UAAU,CAAC,eAAgB,EAC5B;EACF;EACD,SAAS,CACP,mCAAQ,EACN,UAAU,cAAc,KACzB,EAAC,AACH;CACF,EAAC;AAEF,QAAO;AACR;AAED,MAAaC,qBAA4D,OAAO,QAAQ,CAAE,GAAE,YAAY;CACtG,MAAM,cAAc,OAAO,KAAK,MAAM,QAAQ,QAAQ,MAAM,QAAQ,CAAE,GAAE,QAAQ,CAAC,CAAC,SAAS;CAC3F,MAAMC,SAAmB,CAAE;AAE3B,QAAO,OACJ,OAAO,MAAM,CACb,OAAO,CAAC,QAAS,EAAC,CAClB,OAAO,cAAc,CAAC,kBAAQ,gBAAgB,kBAAkB,EAAE,QAAQ,yBAAyB,AAAC,IAAG,CAAE,EAAC;AAC9G"}
+{"version":3,"file":"preset.cjs","names":["require","input: I","__dirname","core: StorybookConfig['core']","viteFinal: StorybookConfig['viteFinal']","previewAnnotations: StorybookConfig['previewAnnotations']","result: string[]"],"sources":["../src/preset.ts"],"sourcesContent":["/**\n * we can't prefix the Node.js imports with `node:` because it will break\n * within Storybook due to its Vite setup.\n */\nimport { createRequire } from 'module';\nimport { dirname, join } from 'path';\nimport { fileURLToPath } from 'url';\n\nimport stencil from 'unplugin-stencil/vite';\nimport { mergeConfig } from 'vite';\n\nimport { StorybookConfig } from './types.js';\n\nconst require = createRequire(import.meta.url);\nconst getAbsolutePath = <I extends string>(input: I): I => dirname(require.resolve(join(input, 'package.json'))) as any;\n\nconst __dirname = dirname(fileURLToPath(import.meta.url));\n\nconst renderer = join(__dirname, 'entry-preview.js');\n\nexport const core: StorybookConfig['core'] = {\n  builder: getAbsolutePath('@storybook/builder-vite'),\n  renderer,\n};\n\nexport const viteFinal: StorybookConfig['viteFinal'] = async (defaultConfig) => {\n  const config = mergeConfig(defaultConfig, {\n    build: {\n      target: 'es2020',\n      rollupOptions: {\n        external: ['@stencil/core'],\n      },\n    },\n    plugins: [\n      stencil({\n        rootPath: defaultConfig.root,\n      }),\n    ],\n  });\n\n  return config;\n};\n\nexport const previewAnnotations: StorybookConfig['previewAnnotations'] = async (input = [], options) => {\n  const docsEnabled = Object.keys(await options.presets.apply('docs', {}, options)).length > 0;\n  const result: string[] = [];\n\n  return result\n    .concat(input)\n    .concat([renderer])\n    .concat(docsEnabled ? [join(__dirname, 'entry-preview-docs.js')] : []);\n};\n"],"mappings":";;;;;;;;AAaA,MAAMA,YAAU,0EAA8B;AAC9C,MAAM,kBAAkB,CAAmBC,UAAgB,kBAAQ,UAAQ,QAAQ,eAAK,OAAO,eAAe,CAAC,CAAC;AAEhH,MAAMC,cAAY,kBAAQ,qEAA8B,CAAC;AAEzD,MAAM,WAAW,eAAKA,aAAW,mBAAmB;AAEpD,MAAaC,OAAgC;CAC3C,SAAS,gBAAgB,0BAA0B;CACnD;AACD;AAED,MAAaC,YAA0C,OAAO,kBAAkB;CAC9E,MAAM,SAAS,sBAAY,eAAe;EACxC,OAAO;GACL,QAAQ;GACR,eAAe,EACb,UAAU,CAAC,eAAgB,EAC5B;EACF;EACD,SAAS,CACP,mCAAQ,EACN,UAAU,cAAc,KACzB,EAAC,AACH;CACF,EAAC;AAEF,QAAO;AACR;AAED,MAAaC,qBAA4D,OAAO,QAAQ,CAAE,GAAE,YAAY;CACtG,MAAM,cAAc,OAAO,KAAK,MAAM,QAAQ,QAAQ,MAAM,QAAQ,CAAE,GAAE,QAAQ,CAAC,CAAC,SAAS;CAC3F,MAAMC,SAAmB,CAAE;AAE3B,QAAO,OACJ,OAAO,MAAM,CACb,OAAO,CAAC,QAAS,EAAC,CAClB,OAAO,cAAc,CAAC,eAAKJ,aAAW,wBAAwB,AAAC,IAAG,CAAE,EAAC;AACzE"}

package/dist/preset.d.cts

@@ -1,4 +1,4 @@
-import { StorybookConfig } from "./types-CR2AtVj_.cjs";
+import { StorybookConfig } from "./types-BjBqnnWi.cjs";
 
 //#region src/preset.d.ts
 declare const core: StorybookConfig['core'];

package/dist/preset.d.ts

@@ -1,4 +1,4 @@
-import { StorybookConfig } from "./types-DoLyzAU3.js";
+import { StorybookConfig } from "./types-Dzw-ZY4t.js";
 
 //#region src/preset.d.ts
 declare const core: StorybookConfig['core'];

package/dist/preset.js

@@ -1,14 +1,14 @@
-import { dirname, join, resolve } from "path";
 import { createRequire } from "module";
+import { dirname, join } from "path";
 import { fileURLToPath } from "url";
-import { mergeConfig } from "vite";
 import stencil from "unplugin-stencil/vite";
+import { mergeConfig } from "vite";
 
 //#region src/preset.ts
 const require = createRequire(import.meta.url);
 const getAbsolutePath = (input) => dirname(require.resolve(join(input, "package.json")));
 const __dirname = dirname(fileURLToPath(import.meta.url));
-const renderer = join(__dirname, "preview.js");
+const renderer = join(__dirname, "entry-preview.js");
 const core = {
 	builder: getAbsolutePath("@storybook/builder-vite"),
 	renderer
@@ -26,7 +26,7 @@ const viteFinal = async (defaultConfig) => {
 const previewAnnotations = async (input = [], options) => {
 	const docsEnabled = Object.keys(await options.presets.apply("docs", {}, options)).length > 0;
 	const result = [];
-	return result.concat(input).concat([renderer]).concat(docsEnabled ? [resolve(getAbsolutePath("@storybook/html"), "dist", "entry-preview-docs.mjs")] : []);
+	return result.concat(input).concat([renderer]).concat(docsEnabled ? [join(__dirname, "entry-preview-docs.js")] : []);
 };
 
 //#endregion

package/dist/preset.js.map

@@ -1 +1 @@
-{"version":3,"file":"preset.js","names":["input: I","core: StorybookConfig['core']","viteFinal: StorybookConfig['viteFinal']","previewAnnotations: StorybookConfig['previewAnnotations']","result: string[]"],"sources":["../src/preset.ts"],"sourcesContent":["/**\n * we can't prefix the Node.js imports with `node:` because it will break\n * within Storybook due to its Vite setup.\n */\nimport { dirname, join, resolve } from 'path';\nimport { createRequire } from 'module';\nimport { fileURLToPath } from 'url';\n\nimport { mergeConfig } from 'vite';\nimport stencil from 'unplugin-stencil/vite';\n\nimport { StorybookConfig } from './types.js';\n\nconst require = createRequire(import.meta.url);\nconst getAbsolutePath = <I extends string>(input: I): I => dirname(require.resolve(join(input, 'package.json'))) as any;\n\nconst __dirname = dirname(fileURLToPath(import.meta.url));\n\nconst renderer = join(__dirname, 'preview.js');\n\nexport const core: StorybookConfig['core'] = {\n  builder: getAbsolutePath('@storybook/builder-vite'),\n  renderer,\n};\n\nexport const viteFinal: StorybookConfig['viteFinal'] = async (defaultConfig) => {\n  const config = mergeConfig(defaultConfig, {\n    build: {\n      target: 'es2020',\n      rollupOptions: {\n        external: ['@stencil/core'],\n      },\n    },\n    plugins: [\n      stencil({\n        rootPath: defaultConfig.root,\n      }),\n    ],\n  });\n\n  return config;\n};\n\nexport const previewAnnotations: StorybookConfig['previewAnnotations'] = async (input = [], options) => {\n  const docsEnabled = Object.keys(await options.presets.apply('docs', {}, options)).length > 0;\n  const result: string[] = [];\n\n  return result\n    .concat(input)\n    .concat([renderer])\n    .concat(docsEnabled ? [resolve(getAbsolutePath('@storybook/html'), 'dist', 'entry-preview-docs.mjs')] : []);\n};\n"],"mappings":";;;;;;;AAaA,MAAM,UAAU,cAAc,OAAO,KAAK,IAAI;AAC9C,MAAM,kBAAkB,CAAmBA,UAAgB,QAAQ,QAAQ,QAAQ,KAAK,OAAO,eAAe,CAAC,CAAC;AAEhH,MAAM,YAAY,QAAQ,cAAc,OAAO,KAAK,IAAI,CAAC;AAEzD,MAAM,WAAW,KAAK,WAAW,aAAa;AAE9C,MAAaC,OAAgC;CAC3C,SAAS,gBAAgB,0BAA0B;CACnD;AACD;AAED,MAAaC,YAA0C,OAAO,kBAAkB;CAC9E,MAAM,SAAS,YAAY,eAAe;EACxC,OAAO;GACL,QAAQ;GACR,eAAe,EACb,UAAU,CAAC,eAAgB,EAC5B;EACF;EACD,SAAS,CACP,QAAQ,EACN,UAAU,cAAc,KACzB,EAAC,AACH;CACF,EAAC;AAEF,QAAO;AACR;AAED,MAAaC,qBAA4D,OAAO,QAAQ,CAAE,GAAE,YAAY;CACtG,MAAM,cAAc,OAAO,KAAK,MAAM,QAAQ,QAAQ,MAAM,QAAQ,CAAE,GAAE,QAAQ,CAAC,CAAC,SAAS;CAC3F,MAAMC,SAAmB,CAAE;AAE3B,QAAO,OACJ,OAAO,MAAM,CACb,OAAO,CAAC,QAAS,EAAC,CAClB,OAAO,cAAc,CAAC,QAAQ,gBAAgB,kBAAkB,EAAE,QAAQ,yBAAyB,AAAC,IAAG,CAAE,EAAC;AAC9G"}
+{"version":3,"file":"preset.js","names":["input: I","core: StorybookConfig['core']","viteFinal: StorybookConfig['viteFinal']","previewAnnotations: StorybookConfig['previewAnnotations']","result: string[]"],"sources":["../src/preset.ts"],"sourcesContent":["/**\n * we can't prefix the Node.js imports with `node:` because it will break\n * within Storybook due to its Vite setup.\n */\nimport { createRequire } from 'module';\nimport { dirname, join } from 'path';\nimport { fileURLToPath } from 'url';\n\nimport stencil from 'unplugin-stencil/vite';\nimport { mergeConfig } from 'vite';\n\nimport { StorybookConfig } from './types.js';\n\nconst require = createRequire(import.meta.url);\nconst getAbsolutePath = <I extends string>(input: I): I => dirname(require.resolve(join(input, 'package.json'))) as any;\n\nconst __dirname = dirname(fileURLToPath(import.meta.url));\n\nconst renderer = join(__dirname, 'entry-preview.js');\n\nexport const core: StorybookConfig['core'] = {\n  builder: getAbsolutePath('@storybook/builder-vite'),\n  renderer,\n};\n\nexport const viteFinal: StorybookConfig['viteFinal'] = async (defaultConfig) => {\n  const config = mergeConfig(defaultConfig, {\n    build: {\n      target: 'es2020',\n      rollupOptions: {\n        external: ['@stencil/core'],\n      },\n    },\n    plugins: [\n      stencil({\n        rootPath: defaultConfig.root,\n      }),\n    ],\n  });\n\n  return config;\n};\n\nexport const previewAnnotations: StorybookConfig['previewAnnotations'] = async (input = [], options) => {\n  const docsEnabled = Object.keys(await options.presets.apply('docs', {}, options)).length > 0;\n  const result: string[] = [];\n\n  return result\n    .concat(input)\n    .concat([renderer])\n    .concat(docsEnabled ? [join(__dirname, 'entry-preview-docs.js')] : []);\n};\n"],"mappings":";;;;;;;AAaA,MAAM,UAAU,cAAc,OAAO,KAAK,IAAI;AAC9C,MAAM,kBAAkB,CAAmBA,UAAgB,QAAQ,QAAQ,QAAQ,KAAK,OAAO,eAAe,CAAC,CAAC;AAEhH,MAAM,YAAY,QAAQ,cAAc,OAAO,KAAK,IAAI,CAAC;AAEzD,MAAM,WAAW,KAAK,WAAW,mBAAmB;AAEpD,MAAaC,OAAgC;CAC3C,SAAS,gBAAgB,0BAA0B;CACnD;AACD;AAED,MAAaC,YAA0C,OAAO,kBAAkB;CAC9E,MAAM,SAAS,YAAY,eAAe;EACxC,OAAO;GACL,QAAQ;GACR,eAAe,EACb,UAAU,CAAC,eAAgB,EAC5B;EACF;EACD,SAAS,CACP,QAAQ,EACN,UAAU,cAAc,KACzB,EAAC,AACH;CACF,EAAC;AAEF,QAAO;AACR;AAED,MAAaC,qBAA4D,OAAO,QAAQ,CAAE,GAAE,YAAY;CACtG,MAAM,cAAc,OAAO,KAAK,MAAM,QAAQ,QAAQ,MAAM,QAAQ,CAAE,GAAE,QAAQ,CAAC,CAAC,SAAS;CAC3F,MAAMC,SAAmB,CAAE;AAE3B,QAAO,OACJ,OAAO,MAAM,CACb,OAAO,CAAC,QAAS,EAAC,CAClB,OAAO,cAAc,CAAC,KAAK,WAAW,wBAAwB,AAAC,IAAG,CAAE,EAAC;AACzE"}

package/dist/{rollup-parseAst-t-4tfMPG.d.ts → rollup-parseAst-DXE9IfcK.d.ts}

@@ -21,4 +21,4 @@ declare module 'rollup/parseAst' {
   export function parseAst(code: string, options?: any): any;
   export function parseAstAsync(code: string, options?: any): Promise<any>;
 }
-//# sourceMappingURL=rollup-parseAst-t-4tfMPG.d.ts.map
+//# sourceMappingURL=rollup-parseAst-DXE9IfcK.d.ts.map

package/dist/{types-CR2AtVj_.d.cts → types-BjBqnnWi.d.cts}

@@ -1,6 +1,6 @@
 import { JSX, VNode } from "@stencil/core";
-import { StorybookConfigVite } from "@storybook/builder-vite";
 import { AnnotatedStoryFn, ArgTypes, Args, Args as Args$1, ComponentAnnotations, DecoratorFunction, LoaderFunction, Parameters, ProjectAnnotations, StoryAnnotations, StoryContext, StorybookConfig, StrictArgs, StrictArgs as StrictArgs$1, WebRenderer } from "storybook/internal/types";
+import { StorybookConfigVite } from "@storybook/builder-vite";
 
 //#region src/types.d.ts
 interface DevJSX {
@@ -68,4 +68,4 @@ declare global {
 }
 //#endregion
 export { ArgTypes, Args$1 as Args, Decorator, Loader, Meta, Parameters, Preview, StencilRenderer, StoryContext$1 as StoryContext, StoryFn, StoryObj, StorybookConfig$1 as StorybookConfig, StrictArgs$1 as StrictArgs };
-//# sourceMappingURL=types-CR2AtVj_.d.cts.map
+//# sourceMappingURL=types-BjBqnnWi.d.cts.map

package/dist/{types-DoLyzAU3.d.ts → types-Dzw-ZY4t.d.ts}

@@ -1,6 +1,6 @@
 import { JSX, VNode } from "@stencil/core";
-import { StorybookConfigVite } from "@storybook/builder-vite";
 import { AnnotatedStoryFn, ArgTypes, Args, Args as Args$1, ComponentAnnotations, DecoratorFunction, LoaderFunction, Parameters, ProjectAnnotations, StoryAnnotations, StoryContext, StorybookConfig, StrictArgs, StrictArgs as StrictArgs$1, WebRenderer } from "storybook/internal/types";
+import { StorybookConfigVite } from "@storybook/builder-vite";
 
 //#region src/types.d.ts
 interface DevJSX {
@@ -68,4 +68,4 @@ declare global {
 }
 //#endregion
 export { ArgTypes, Args$1 as Args, Decorator, Loader, Meta, Parameters, Preview, StencilRenderer, StoryContext$1 as StoryContext, StoryFn, StoryObj, StorybookConfig$1 as StorybookConfig, StrictArgs$1 as StrictArgs };
-//# sourceMappingURL=types-DoLyzAU3.d.ts.map
+//# sourceMappingURL=types-Dzw-ZY4t.d.ts.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stencil/storybook-plugin",
-  "version": "0.2.0",
+  "version": "0.4.0",
   "description": "Storybook plugin for Stencil",
   "license": "MIT",
   "homepage": "https://github.com/stenciljs/storybook",
@@ -64,24 +64,24 @@
     "build": "tsdown"
   },
   "dependencies": {
-    "@storybook/addon-actions": "^9.0.5",
-    "@storybook/builder-vite": "^9.0.5",
+    "@storybook/addon-actions": "^9.0.8",
+    "@storybook/builder-vite": "^9.0.8",
     "@storybook/global": "^5.0.0",
-    "@storybook/html": "^9.0.5",
+    "@storybook/html": "^9.0.8",
     "preact-render-to-string": "^6.5.13",
-    "react-docgen-typescript": "^2.2.2",
-    "unplugin-stencil": "^0.3.2"
+    "react-docgen-typescript": "^2.4.0",
+    "unplugin-stencil": "^0.3.4"
   },
   "peerDependencies": {
     "@stencil/core": "^4.30.0",
     "storybook": "^9.0.5"
   },
   "devDependencies": {
-    "@stencil/core": "^4.30.0",
+    "@stencil/core": "^4.33.1",
     "@types/node": "^22.15.3",
-    "tsdown": "^0.12.4",
+    "tsdown": "^0.12.7",
     "typescript": "~5.8.3",
-    "vite": "^6.3.3"
+    "vite": "^6.3.5"
   },
   "engines": {
     "node": ">=20"

package/preset.js

@@ -1,2 +1,2 @@
 // This file seems to only be necessary for Windows
-module.exports = require('./dist/preset.js');
+export * from "./dist/preset.js";

package/dist/preview-D_4Gl5tg.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"preview-D_4Gl5tg.cjs","names":["render: ArgsStoryFn<StencilRenderer<unknown>>","children: any[]","parameters","canvasElement: StencilRenderer<unknown>['canvasElement']","parameters: { renderer: 'stencil' }"],"sources":["../src/render.ts","../src/preview.ts"],"sourcesContent":["import { ArgsStoryFn, RenderContext } from 'storybook/internal/types';\nimport { simulatePageLoad } from 'storybook/preview-api';\nimport { render as renderStencil, h, VNode, Fragment } from '@stencil/core';\n\nimport type { StencilRenderer } from './types';\n\nexport const render: ArgsStoryFn<StencilRenderer<unknown>> = (args, context) => {\n  const { component, parameters } = context;\n\n  if (Array.isArray(component)) {\n    throw new Error('If your story does not contain a render function, you must provide a component property!');\n  }\n\n  const cmpName = customElements.getName(component);\n  if (!cmpName) {\n    throw new Error('Component is not registered!');\n  }\n\n  const children: any[] = Object.entries<VNode>(parameters.slots || []).map(([key, value]) => {\n    // if the parameter key is 'default' don't give it a slot name so it renders just as a child\n    const slot = key === 'default' ? undefined : key;\n    // if the value it s a string, create a vnode with the string as the children\n    const child =\n      typeof value === 'string'\n        ? h(undefined, { slot }, value)\n        : {\n            ...value,\n            $attrs$: {\n              slot,\n            },\n          };\n    // if the value is a fragment and it is a named slot, create a span element with the slot name\n    child.$tag$ = child.$tag$ || (slot ? 'span' : null);\n    return child.$tag$ ? child : child.$children$;\n  });\n\n  const Component = `${cmpName}`;\n  return h(Component, { ...args }, children);\n};\n\nexport function renderToCanvas(\n  { storyFn, showMain, storyContext }: RenderContext<StencilRenderer<unknown>>,\n  canvasElement: StencilRenderer<unknown>['canvasElement'],\n) {\n  const vdom = storyFn();\n  showMain();\n\n  /**\n   * If the component is not automatically registered after import, register it here\n   */\n  if (storyContext.component && storyContext.component.is && !customElements.get(storyContext.component.is)) {\n    customElements.define(storyContext.component.is, storyContext.component);\n  }\n\n  if (canvasElement.firstChild) {\n    canvasElement.removeChild(canvasElement.firstChild);\n  }\n\n  const element = document.createElement('div');\n  canvasElement.appendChild(element);\n  renderStencil(vdom, element);\n  simulatePageLoad(element);\n}\n","export const parameters: { renderer: 'stencil' } = { renderer: 'stencil' };\nexport { render, renderToCanvas } from './render.js';\n"],"mappings":";;;;;AAMA,MAAaA,SAAgD,CAAC,MAAM,YAAY;CAC9E,MAAM,EAAE,WAAW,0BAAY,GAAG;AAElC,KAAI,MAAM,QAAQ,UAAU,CAC1B,OAAM,IAAI,MAAM;CAGlB,MAAM,UAAU,eAAe,QAAQ,UAAU;AACjD,MAAK,QACH,OAAM,IAAI,MAAM;CAGlB,MAAMC,WAAkB,OAAO,QAAeC,aAAW,SAAS,CAAE,EAAC,CAAC,IAAI,CAAC,CAAC,KAAK,MAAM,KAAK;EAE1F,MAAM,OAAO,QAAQ,qBAAwB;EAE7C,MAAM,eACG,UAAU,WACb,8BAAa,EAAE,KAAM,GAAE,MAAM,GAC7B;GACE,GAAG;GACH,SAAS,EACP,KACD;EACF;AAEP,QAAM,QAAQ,MAAM,UAAU,OAAO,SAAS;AAC9C,SAAO,MAAM,QAAQ,QAAQ,MAAM;CACpC,EAAC;CAEF,MAAM,aAAa,EAAE,QAAQ;AAC7B,QAAO,sBAAE,WAAW,EAAE,GAAG,KAAM,GAAE,SAAS;AAC3C;AAED,SAAgB,eACd,EAAE,SAAS,UAAU,cAAuD,EAC5EC,eACA;CACA,MAAM,OAAO,SAAS;AACtB,WAAU;;;;AAKV,KAAI,aAAa,aAAa,aAAa,UAAU,OAAO,eAAe,IAAI,aAAa,UAAU,GAAG,CACvG,gBAAe,OAAO,aAAa,UAAU,IAAI,aAAa,UAAU;AAG1E,KAAI,cAAc,WAChB,eAAc,YAAY,cAAc,WAAW;CAGrD,MAAM,UAAU,SAAS,cAAc,MAAM;AAC7C,eAAc,YAAY,QAAQ;AAClC,4BAAc,MAAM,QAAQ;AAC5B,6CAAiB,QAAQ;AAC1B;;;;;;;;;;AC9DD,MAAaC,aAAsC,EAAE,UAAU,UAAW"}

package/dist/preview-Dn8QZb01.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"preview-Dn8QZb01.js","names":["render: ArgsStoryFn<StencilRenderer<unknown>>","children: any[]","parameters","canvasElement: StencilRenderer<unknown>['canvasElement']","parameters: { renderer: 'stencil' }"],"sources":["../src/render.ts","../src/preview.ts"],"sourcesContent":["import { ArgsStoryFn, RenderContext } from 'storybook/internal/types';\nimport { simulatePageLoad } from 'storybook/preview-api';\nimport { render as renderStencil, h, VNode, Fragment } from '@stencil/core';\n\nimport type { StencilRenderer } from './types';\n\nexport const render: ArgsStoryFn<StencilRenderer<unknown>> = (args, context) => {\n  const { component, parameters } = context;\n\n  if (Array.isArray(component)) {\n    throw new Error('If your story does not contain a render function, you must provide a component property!');\n  }\n\n  const cmpName = customElements.getName(component);\n  if (!cmpName) {\n    throw new Error('Component is not registered!');\n  }\n\n  const children: any[] = Object.entries<VNode>(parameters.slots || []).map(([key, value]) => {\n    // if the parameter key is 'default' don't give it a slot name so it renders just as a child\n    const slot = key === 'default' ? undefined : key;\n    // if the value it s a string, create a vnode with the string as the children\n    const child =\n      typeof value === 'string'\n        ? h(undefined, { slot }, value)\n        : {\n            ...value,\n            $attrs$: {\n              slot,\n            },\n          };\n    // if the value is a fragment and it is a named slot, create a span element with the slot name\n    child.$tag$ = child.$tag$ || (slot ? 'span' : null);\n    return child.$tag$ ? child : child.$children$;\n  });\n\n  const Component = `${cmpName}`;\n  return h(Component, { ...args }, children);\n};\n\nexport function renderToCanvas(\n  { storyFn, showMain, storyContext }: RenderContext<StencilRenderer<unknown>>,\n  canvasElement: StencilRenderer<unknown>['canvasElement'],\n) {\n  const vdom = storyFn();\n  showMain();\n\n  /**\n   * If the component is not automatically registered after import, register it here\n   */\n  if (storyContext.component && storyContext.component.is && !customElements.get(storyContext.component.is)) {\n    customElements.define(storyContext.component.is, storyContext.component);\n  }\n\n  if (canvasElement.firstChild) {\n    canvasElement.removeChild(canvasElement.firstChild);\n  }\n\n  const element = document.createElement('div');\n  canvasElement.appendChild(element);\n  renderStencil(vdom, element);\n  simulatePageLoad(element);\n}\n","export const parameters: { renderer: 'stencil' } = { renderer: 'stencil' };\nexport { render, renderToCanvas } from './render.js';\n"],"mappings":";;;;;;;;;;;;;;AAMA,MAAaA,WAAgD,CAAC,MAAM,YAAY;CAC9E,MAAM,EAAE,WAAW,0BAAY,GAAG;AAElC,KAAI,MAAM,QAAQ,UAAU,CAC1B,OAAM,IAAI,MAAM;CAGlB,MAAM,UAAU,eAAe,QAAQ,UAAU;AACjD,MAAK,QACH,OAAM,IAAI,MAAM;CAGlB,MAAMC,WAAkB,OAAO,QAAeC,aAAW,SAAS,CAAE,EAAC,CAAC,IAAI,CAAC,CAAC,KAAK,MAAM,KAAK;EAE1F,MAAM,OAAO,QAAQ,qBAAwB;EAE7C,MAAM,eACG,UAAU,WACb,UAAa,EAAE,KAAM,GAAE,MAAM,GAC7B;GACE,GAAG;GACH,SAAS,EACP,KACD;EACF;AAEP,QAAM,QAAQ,MAAM,UAAU,OAAO,SAAS;AAC9C,SAAO,MAAM,QAAQ,QAAQ,MAAM;CACpC,EAAC;CAEF,MAAM,aAAa,EAAE,QAAQ;AAC7B,QAAO,EAAE,WAAW,EAAE,GAAG,KAAM,GAAE,SAAS;AAC3C;AAED,SAAgB,eACd,EAAE,SAAS,UAAU,cAAuD,EAC5EC,eACA;CACA,MAAM,OAAO,SAAS;AACtB,WAAU;;;;AAKV,KAAI,aAAa,aAAa,aAAa,UAAU,OAAO,eAAe,IAAI,aAAa,UAAU,GAAG,CACvG,gBAAe,OAAO,aAAa,UAAU,IAAI,aAAa,UAAU;AAG1E,KAAI,cAAc,WAChB,eAAc,YAAY,cAAc,WAAW;CAGrD,MAAM,UAAU,SAAS,cAAc,MAAM;AAC7C,eAAc,YAAY,QAAQ;AAClC,QAAc,MAAM,QAAQ;AAC5B,kBAAiB,QAAQ;AAC1B;;;;;;;;;;AC9DD,MAAaC,aAAsC,EAAE,UAAU,UAAW"}

package/dist/preview.cjs

@@ -1,5 +0,0 @@
-const require_preview = require('./preview-D_4Gl5tg.cjs');
-
-exports.parameters = require_preview.parameters;
-exports.render = require_preview.render;
-exports.renderToCanvas = require_preview.renderToCanvas;

package/dist/preview.d.cts

@@ -1,18 +0,0 @@
-import { StencilRenderer } from "./types-CR2AtVj_.cjs";
-import { ArgsStoryFn, RenderContext } from "storybook/internal/types";
-
-//#region src/render.d.ts
-declare const render: ArgsStoryFn<StencilRenderer<unknown>>;
-declare function renderToCanvas({
-  storyFn,
-  showMain,
-  storyContext
-}: RenderContext<StencilRenderer<unknown>>, canvasElement: StencilRenderer<unknown>['canvasElement']): void;
-//#endregion
-//#region src/preview.d.ts
-declare const parameters: {
-  renderer: 'stencil';
-};
-//#endregion
-export { parameters, render, renderToCanvas };
-//# sourceMappingURL=preview.d.cts.map

package/dist/preview.d.ts

@@ -1,18 +0,0 @@
-import { StencilRenderer } from "./types-DoLyzAU3.js";
-import { ArgsStoryFn, RenderContext } from "storybook/internal/types";
-
-//#region src/render.d.ts
-declare const render: ArgsStoryFn<StencilRenderer<unknown>>;
-declare function renderToCanvas({
-  storyFn,
-  showMain,
-  storyContext
-}: RenderContext<StencilRenderer<unknown>>, canvasElement: StencilRenderer<unknown>['canvasElement']): void;
-//#endregion
-//#region src/preview.d.ts
-declare const parameters: {
-  renderer: 'stencil';
-};
-//#endregion
-export { parameters, render, renderToCanvas };
-//# sourceMappingURL=preview.d.ts.map

package/dist/preview.js

@@ -1,3 +0,0 @@
-import { parameters, render, renderToCanvas } from "./preview-Dn8QZb01.js";
-
-export { parameters, render, renderToCanvas };