@storybook/web-components 9.2.0-alpha.3 → 10.0.0-beta.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -1 +1,5 @@
1
1
  # Storybook web-components renderer
2
+
3
+ Develop, document, and test UI components in isolation.
4
+
5
+ Learn more about Storybook at [storybook.js.org](https://storybook.js.org/?ref=readme).
@@ -0,0 +1,88 @@
1
+ import {
2
+ entry_preview_exports
3
+ } from "./chunk-NIAEHH3S.js";
4
+ import {
5
+ __name
6
+ } from "./chunk-JFJ5UJ7Q.js";
7
+
8
+ // src/index.ts
9
+ import { global as global3 } from "@storybook/global";
10
+
11
+ // src/globals.ts
12
+ import { global } from "@storybook/global";
13
+ var { window: globalWindow } = global;
14
+ globalWindow.STORYBOOK_ENV = "web-components";
15
+
16
+ // src/framework-api.ts
17
+ import { global as global2 } from "@storybook/global";
18
+ function isValidComponent(tagName) {
19
+ if (!tagName) {
20
+ return false;
21
+ }
22
+ if (typeof tagName === "string") {
23
+ return true;
24
+ }
25
+ throw new Error('Provided component needs to be a string. e.g. component: "my-element"');
26
+ }
27
+ __name(isValidComponent, "isValidComponent");
28
+ function isValidMetaData(customElements) {
29
+ if (!customElements) {
30
+ return false;
31
+ }
32
+ if (customElements.tags && Array.isArray(customElements.tags) || customElements.modules && Array.isArray(customElements.modules)) {
33
+ return true;
34
+ }
35
+ throw new Error(`You need to setup valid meta data in your config.js via setCustomElements().
36
+ See the readme of addon-docs for web components for more details.`);
37
+ }
38
+ __name(isValidMetaData, "isValidMetaData");
39
+ function setCustomElements(customElements) {
40
+ global2.__STORYBOOK_CUSTOM_ELEMENTS__ = customElements;
41
+ }
42
+ __name(setCustomElements, "setCustomElements");
43
+ function setCustomElementsManifest(customElements) {
44
+ global2.__STORYBOOK_CUSTOM_ELEMENTS_MANIFEST__ = customElements;
45
+ }
46
+ __name(setCustomElementsManifest, "setCustomElementsManifest");
47
+ function getCustomElements() {
48
+ return global2.__STORYBOOK_CUSTOM_ELEMENTS__ || global2.__STORYBOOK_CUSTOM_ELEMENTS_MANIFEST__;
49
+ }
50
+ __name(getCustomElements, "getCustomElements");
51
+
52
+ // src/portable-stories.ts
53
+ import {
54
+ setProjectAnnotations as originalSetProjectAnnotations,
55
+ setDefaultProjectAnnotations
56
+ } from "storybook/preview-api";
57
+ function setProjectAnnotations(projectAnnotations) {
58
+ setDefaultProjectAnnotations(entry_preview_exports);
59
+ return originalSetProjectAnnotations(
60
+ projectAnnotations
61
+ );
62
+ }
63
+ __name(setProjectAnnotations, "setProjectAnnotations");
64
+
65
+ // src/index.ts
66
+ var { window, EventSource } = global3;
67
+ if (typeof module !== "undefined" && module?.hot?.decline) {
68
+ module.hot.decline();
69
+ const hmr = new EventSource("__webpack_hmr");
70
+ hmr.addEventListener("message", /* @__PURE__ */ __name(function fullPageReload(event) {
71
+ try {
72
+ const { action } = JSON.parse(event.data);
73
+ if (action === "built") {
74
+ window.location.reload();
75
+ }
76
+ } catch (error) {
77
+ }
78
+ }, "fullPageReload"));
79
+ }
80
+
81
+ export {
82
+ isValidComponent,
83
+ isValidMetaData,
84
+ setCustomElements,
85
+ setCustomElementsManifest,
86
+ getCustomElements,
87
+ setProjectAnnotations
88
+ };
@@ -0,0 +1,11 @@
1
+ var __defProp = Object.defineProperty;
2
+ var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
3
+ var __export = (target, all) => {
4
+ for (var name in all)
5
+ __defProp(target, name, { get: all[name], enumerable: true });
6
+ };
7
+
8
+ export {
9
+ __name,
10
+ __export
11
+ };
@@ -0,0 +1,76 @@
1
+ import {
2
+ __export,
3
+ __name
4
+ } from "./chunk-JFJ5UJ7Q.js";
5
+
6
+ // src/entry-preview.ts
7
+ var entry_preview_exports = {};
8
+ __export(entry_preview_exports, {
9
+ parameters: () => parameters,
10
+ render: () => render,
11
+ renderToCanvas: () => renderToCanvas
12
+ });
13
+
14
+ // src/render.ts
15
+ import { global } from "@storybook/global";
16
+ import { render as litRender } from "lit";
17
+ import { isTemplateResult } from "lit/directive-helpers.js";
18
+ import { simulateDOMContentLoaded, simulatePageLoad } from "storybook/preview-api";
19
+ import { dedent } from "ts-dedent";
20
+ var { Node } = global;
21
+ var render = /* @__PURE__ */ __name((args, context) => {
22
+ const { id, component } = context;
23
+ if (!component) {
24
+ throw new Error(
25
+ `Unable to render story ${id} as the component annotation is missing from the default export`
26
+ );
27
+ }
28
+ const element = document.createElement(component);
29
+ Object.entries(args).forEach(([key, val]) => {
30
+ element[key] = val;
31
+ });
32
+ return element;
33
+ }, "render");
34
+ function renderToCanvas({ storyFn, kind, name, showMain, showError, forceRemount }, canvasElement) {
35
+ const element = storyFn();
36
+ showMain();
37
+ if (isTemplateResult(element)) {
38
+ if (forceRemount || !canvasElement.querySelector('[id="root-inner"]')) {
39
+ canvasElement.innerHTML = '<div id="root-inner"></div>';
40
+ }
41
+ const renderTo = canvasElement.querySelector('[id="root-inner"]');
42
+ litRender(element, renderTo);
43
+ simulatePageLoad(canvasElement);
44
+ } else if (typeof element === "string") {
45
+ canvasElement.innerHTML = element;
46
+ simulatePageLoad(canvasElement);
47
+ } else if (element instanceof Node) {
48
+ if (canvasElement.firstChild === element && !forceRemount) {
49
+ return;
50
+ }
51
+ canvasElement.innerHTML = "";
52
+ canvasElement.appendChild(element);
53
+ simulateDOMContentLoaded();
54
+ } else {
55
+ showError({
56
+ title: `Expecting an HTML snippet or DOM node from the story: "${name}" of "${kind}".`,
57
+ description: dedent`
58
+ Did you forget to return the HTML snippet from the story?
59
+ Use "() => <your snippet or node>" or when defining the story.
60
+ `
61
+ });
62
+ }
63
+ }
64
+ __name(renderToCanvas, "renderToCanvas");
65
+
66
+ // src/entry-preview.ts
67
+ var parameters = {
68
+ renderer: "web-components"
69
+ };
70
+
71
+ export {
72
+ render,
73
+ renderToCanvas,
74
+ parameters,
75
+ entry_preview_exports
76
+ };
@@ -1,2 +1,141 @@
1
- "use strict";var __create=Object.create;var __defProp=Object.defineProperty;var __getOwnPropDesc=Object.getOwnPropertyDescriptor;var __getOwnPropNames=Object.getOwnPropertyNames;var __getProtoOf=Object.getPrototypeOf,__hasOwnProp=Object.prototype.hasOwnProperty;var __export=(target,all)=>{for(var name in all)__defProp(target,name,{get:all[name],enumerable:!0})},__copyProps=(to,from,except,desc)=>{if(from&&typeof from=="object"||typeof from=="function")for(let key of __getOwnPropNames(from))!__hasOwnProp.call(to,key)&&key!==except&&__defProp(to,key,{get:()=>from[key],enumerable:!(desc=__getOwnPropDesc(from,key))||desc.enumerable});return to};var __toESM=(mod,isNodeMode,target)=>(target=mod!=null?__create(__getProtoOf(mod)):{},__copyProps(isNodeMode||!mod||!mod.__esModule?__defProp(target,"default",{value:mod,enumerable:!0}):target,mod)),__toCommonJS=mod=>__copyProps(__defProp({},"__esModule",{value:!0}),mod);var entry_preview_argtypes_exports={};__export(entry_preview_argtypes_exports,{argTypesEnhancers:()=>argTypesEnhancers,parameters:()=>parameters});module.exports=__toCommonJS(entry_preview_argtypes_exports);var import_docs_tools=require("storybook/internal/docs-tools");var import_client_logger=require("storybook/internal/client-logger"),import_tiny_invariant=__toESM(require("tiny-invariant"));var import_global4=require("@storybook/global");var import_global=require("@storybook/global"),{window:globalWindow}=import_global.global;globalWindow.STORYBOOK_ENV="web-components";var import_global2=require("@storybook/global");function isValidComponent(tagName){if(!tagName)return!1;if(typeof tagName=="string")return!0;throw new Error('Provided component needs to be a string. e.g. component: "my-element"')}function isValidMetaData(customElements){if(!customElements)return!1;if(customElements.tags&&Array.isArray(customElements.tags)||customElements.modules&&Array.isArray(customElements.modules))return!0;throw new Error(`You need to setup valid meta data in your config.js via setCustomElements().
2
- See the readme of addon-docs for web components for more details.`)}function getCustomElements(){return import_global2.global.__STORYBOOK_CUSTOM_ELEMENTS__||import_global2.global.__STORYBOOK_CUSTOM_ELEMENTS_MANIFEST__}var import_preview_api2=require("storybook/preview-api");var import_global3=require("@storybook/global"),import_lit=require("lit"),import_directive_helpers=require("lit/directive-helpers.js"),import_preview_api=require("storybook/preview-api"),import_ts_dedent=require("ts-dedent"),{Node}=import_global3.global;var{window,EventSource}=import_global4.global;typeof module<"u"&&module?.hot?.decline&&(module.hot.decline(),new EventSource("__webpack_hmr").addEventListener("message",function(event){try{let{action}=JSON.parse(event.data);action==="built"&&window.location.reload()}catch{}}));function mapItem(item,category){let type;switch(category){case"attributes":case"properties":type={name:item.type?.text||item.type};break;case"slots":type={name:"string"};break;default:type={name:"void"};break}return{name:item.name,required:!1,description:item.description,type,table:{category,type:{summary:item.type?.text||item.type},defaultValue:{summary:item.default!==void 0?item.default:item.defaultValue}}}}function mapEvent(item){let name=item.name.replace(/(-|_|:|\.|\s)+(.)?/g,(_match,_separator,chr)=>chr?chr.toUpperCase():"").replace(/^([A-Z])/,match=>match.toLowerCase());return name=`on${name.charAt(0).toUpperCase()+name.substr(1)}`,[{name,action:{name:item.name},table:{disable:!0}},mapItem(item,"events")]}function mapData(data,category){return data&&data.filter(item=>item&&item.name).reduce((acc,item)=>{if(item.kind==="method")return acc;switch(category){case"events":mapEvent(item).forEach(argType=>{(0,import_tiny_invariant.default)(argType.name,`${argType} should have a name property.`),acc[argType.name]=argType});break;default:acc[item.name]=mapItem(item,category);break}return acc},{})}var getMetaDataExperimental=(tagName,customElements)=>{if(!isValidComponent(tagName)||!isValidMetaData(customElements))return null;let metaData=customElements.tags.find(tag=>tag.name.toUpperCase()===tagName.toUpperCase());return metaData||import_client_logger.logger.warn(`Component not found in custom-elements.json: ${tagName}`),metaData},getMetaDataV1=(tagName,customElements)=>{if(!isValidComponent(tagName)||!isValidMetaData(customElements))return null;let metadata;return customElements?.modules?.forEach(_module=>{_module?.declarations?.forEach(declaration=>{declaration.tagName===tagName&&(metadata=declaration)})}),metadata||import_client_logger.logger.warn(`Component not found in custom-elements.json: ${tagName}`),metadata},getMetaData=(tagName,manifest)=>manifest?.version==="experimental"?getMetaDataExperimental(tagName,manifest):getMetaDataV1(tagName,manifest),extractArgTypesFromElements=(tagName,customElements)=>{let metaData=getMetaData(tagName,customElements);return metaData&&{...mapData(metaData.members??[],"properties"),...mapData(metaData.properties??[],"properties"),...mapData(metaData.attributes??[],"attributes"),...mapData(metaData.events??[],"events"),...mapData(metaData.slots??[],"slots"),...mapData(metaData.cssProperties??[],"css custom properties"),...mapData(metaData.cssParts??[],"css shadow parts")}},extractArgTypes=tagName=>{let cem=getCustomElements();return extractArgTypesFromElements(tagName,cem)},extractComponentDescription=tagName=>{let metaData=getMetaData(tagName,getCustomElements());return metaData&&metaData.description};var parameters={docs:{extractArgTypes,extractComponentDescription}},argTypesEnhancers=[import_docs_tools.enhanceArgTypes];0&&(module.exports={argTypesEnhancers,parameters});
1
+ import {
2
+ getCustomElements,
3
+ isValidComponent,
4
+ isValidMetaData
5
+ } from "./_browser-chunks/chunk-CTBWQQZK.js";
6
+ import "./_browser-chunks/chunk-NIAEHH3S.js";
7
+ import {
8
+ __name
9
+ } from "./_browser-chunks/chunk-JFJ5UJ7Q.js";
10
+
11
+ // src/entry-preview-argtypes.ts
12
+ import { enhanceArgTypes } from "storybook/internal/docs-tools";
13
+
14
+ // src/docs/custom-elements.ts
15
+ import { logger } from "storybook/internal/client-logger";
16
+ import invariant from "tiny-invariant";
17
+ function mapItem(item, category) {
18
+ let type;
19
+ switch (category) {
20
+ case "attributes":
21
+ case "properties":
22
+ type = { name: item.type?.text || item.type };
23
+ break;
24
+ case "slots":
25
+ type = { name: "string" };
26
+ break;
27
+ default:
28
+ type = { name: "void" };
29
+ break;
30
+ }
31
+ return {
32
+ name: item.name,
33
+ required: false,
34
+ description: item.description,
35
+ type,
36
+ table: {
37
+ category,
38
+ type: { summary: item.type?.text || item.type },
39
+ defaultValue: {
40
+ summary: item.default !== void 0 ? item.default : item.defaultValue
41
+ }
42
+ }
43
+ };
44
+ }
45
+ __name(mapItem, "mapItem");
46
+ function mapEvent(item) {
47
+ let name = item.name.replace(/(-|_|:|\.|\s)+(.)?/g, (_match, _separator, chr) => {
48
+ return chr ? chr.toUpperCase() : "";
49
+ }).replace(/^([A-Z])/, (match) => match.toLowerCase());
50
+ name = `on${name.charAt(0).toUpperCase() + name.substr(1)}`;
51
+ return [{ name, action: { name: item.name }, table: { disable: true } }, mapItem(item, "events")];
52
+ }
53
+ __name(mapEvent, "mapEvent");
54
+ function mapData(data, category) {
55
+ return data && data.filter((item) => item && item.name).reduce((acc, item) => {
56
+ if (item.kind === "method") {
57
+ return acc;
58
+ }
59
+ switch (category) {
60
+ case "events":
61
+ mapEvent(item).forEach((argType) => {
62
+ invariant(argType.name, `${argType} should have a name property.`);
63
+ acc[argType.name] = argType;
64
+ });
65
+ break;
66
+ default:
67
+ acc[item.name] = mapItem(item, category);
68
+ break;
69
+ }
70
+ return acc;
71
+ }, {});
72
+ }
73
+ __name(mapData, "mapData");
74
+ var getMetaDataExperimental = /* @__PURE__ */ __name((tagName, customElements) => {
75
+ if (!isValidComponent(tagName) || !isValidMetaData(customElements)) {
76
+ return null;
77
+ }
78
+ const metaData = customElements.tags.find(
79
+ (tag) => tag.name.toUpperCase() === tagName.toUpperCase()
80
+ );
81
+ if (!metaData) {
82
+ logger.warn(`Component not found in custom-elements.json: ${tagName}`);
83
+ }
84
+ return metaData;
85
+ }, "getMetaDataExperimental");
86
+ var getMetaDataV1 = /* @__PURE__ */ __name((tagName, customElements) => {
87
+ if (!isValidComponent(tagName) || !isValidMetaData(customElements)) {
88
+ return null;
89
+ }
90
+ let metadata;
91
+ customElements?.modules?.forEach((_module) => {
92
+ _module?.declarations?.forEach((declaration) => {
93
+ if (declaration.tagName === tagName) {
94
+ metadata = declaration;
95
+ }
96
+ });
97
+ });
98
+ if (!metadata) {
99
+ logger.warn(`Component not found in custom-elements.json: ${tagName}`);
100
+ }
101
+ return metadata;
102
+ }, "getMetaDataV1");
103
+ var getMetaData = /* @__PURE__ */ __name((tagName, manifest) => {
104
+ if (manifest?.version === "experimental") {
105
+ return getMetaDataExperimental(tagName, manifest);
106
+ }
107
+ return getMetaDataV1(tagName, manifest);
108
+ }, "getMetaData");
109
+ var extractArgTypesFromElements = /* @__PURE__ */ __name((tagName, customElements) => {
110
+ const metaData = getMetaData(tagName, customElements);
111
+ return metaData && {
112
+ ...mapData(metaData.members ?? [], "properties"),
113
+ ...mapData(metaData.properties ?? [], "properties"),
114
+ ...mapData(metaData.attributes ?? [], "attributes"),
115
+ ...mapData(metaData.events ?? [], "events"),
116
+ ...mapData(metaData.slots ?? [], "slots"),
117
+ ...mapData(metaData.cssProperties ?? [], "css custom properties"),
118
+ ...mapData(metaData.cssParts ?? [], "css shadow parts")
119
+ };
120
+ }, "extractArgTypesFromElements");
121
+ var extractArgTypes = /* @__PURE__ */ __name((tagName) => {
122
+ const cem = getCustomElements();
123
+ return extractArgTypesFromElements(tagName, cem);
124
+ }, "extractArgTypes");
125
+ var extractComponentDescription = /* @__PURE__ */ __name((tagName) => {
126
+ const metaData = getMetaData(tagName, getCustomElements());
127
+ return metaData && metaData.description;
128
+ }, "extractComponentDescription");
129
+
130
+ // src/entry-preview-argtypes.ts
131
+ var parameters = {
132
+ docs: {
133
+ extractArgTypes,
134
+ extractComponentDescription
135
+ }
136
+ };
137
+ var argTypesEnhancers = [enhanceArgTypes];
138
+ export {
139
+ argTypesEnhancers,
140
+ parameters
141
+ };
@@ -1 +1,58 @@
1
- "use strict";var __defProp=Object.defineProperty;var __getOwnPropDesc=Object.getOwnPropertyDescriptor;var __getOwnPropNames=Object.getOwnPropertyNames;var __hasOwnProp=Object.prototype.hasOwnProperty;var __export=(target,all)=>{for(var name in all)__defProp(target,name,{get:all[name],enumerable:!0})},__copyProps=(to,from,except,desc)=>{if(from&&typeof from=="object"||typeof from=="function")for(let key of __getOwnPropNames(from))!__hasOwnProp.call(to,key)&&key!==except&&__defProp(to,key,{get:()=>from[key],enumerable:!(desc=__getOwnPropDesc(from,key))||desc.enumerable});return to};var __toCommonJS=mod=>__copyProps(__defProp({},"__esModule",{value:!0}),mod);var entry_preview_docs_exports={};__export(entry_preview_docs_exports,{decorators:()=>decorators,parameters:()=>parameters});module.exports=__toCommonJS(entry_preview_docs_exports);var import_docs_tools2=require("storybook/internal/docs-tools");var import_docs_tools=require("storybook/internal/docs-tools"),import_lit=require("lit"),import_preview_api=require("storybook/preview-api"),LIT_EXPRESSION_COMMENTS=/<!--\?lit\$[0-9]+\$-->|<!--\??-->/g;function skipSourceRender(context){let sourceParams=context?.parameters.docs?.source,isArgsStory=context?.parameters.__isArgsStory;return sourceParams?.type===import_docs_tools.SourceType.DYNAMIC?!1:!isArgsStory||sourceParams?.code||sourceParams?.type===import_docs_tools.SourceType.CODE}function sourceDecorator(storyFn,context){let story=storyFn(),renderedForSource=context?.parameters.docs?.source?.excludeDecorators?context.originalStoryFn(context.args,context):story,source;if((0,import_preview_api.useEffect)(()=>{source&&(0,import_preview_api.emitTransformCode)(source,context)}),!skipSourceRender(context)){let container=window.document.createElement("div");renderedForSource instanceof DocumentFragment?(0,import_lit.render)(renderedForSource.cloneNode(!0),container):(0,import_lit.render)(renderedForSource,container),source=container.innerHTML.replace(LIT_EXPRESSION_COMMENTS,"")}return story}var decorators=[sourceDecorator],parameters={docs:{source:{type:import_docs_tools2.SourceType.DYNAMIC,language:"html"},story:{inline:!0}}};0&&(module.exports={decorators,parameters});
1
+ import {
2
+ __name
3
+ } from "./_browser-chunks/chunk-JFJ5UJ7Q.js";
4
+
5
+ // src/entry-preview-docs.ts
6
+ import { SourceType as SourceType2 } from "storybook/internal/docs-tools";
7
+
8
+ // src/docs/sourceDecorator.ts
9
+ import { SourceType } from "storybook/internal/docs-tools";
10
+ import { render } from "lit";
11
+ import { emitTransformCode, useEffect } from "storybook/preview-api";
12
+ var LIT_EXPRESSION_COMMENTS = /<!--\?lit\$[0-9]+\$-->|<!--\??-->/g;
13
+ function skipSourceRender(context) {
14
+ const sourceParams = context?.parameters.docs?.source;
15
+ const isArgsStory = context?.parameters.__isArgsStory;
16
+ if (sourceParams?.type === SourceType.DYNAMIC) {
17
+ return false;
18
+ }
19
+ return !isArgsStory || sourceParams?.code || sourceParams?.type === SourceType.CODE;
20
+ }
21
+ __name(skipSourceRender, "skipSourceRender");
22
+ function sourceDecorator(storyFn, context) {
23
+ const story = storyFn();
24
+ const renderedForSource = context?.parameters.docs?.source?.excludeDecorators ? context.originalStoryFn(context.args, context) : story;
25
+ let source;
26
+ useEffect(() => {
27
+ if (source) {
28
+ emitTransformCode(source, context);
29
+ }
30
+ });
31
+ if (!skipSourceRender(context)) {
32
+ const container = window.document.createElement("div");
33
+ if (renderedForSource instanceof DocumentFragment) {
34
+ render(renderedForSource.cloneNode(true), container);
35
+ } else {
36
+ render(renderedForSource, container);
37
+ }
38
+ source = container.innerHTML.replace(LIT_EXPRESSION_COMMENTS, "");
39
+ }
40
+ return story;
41
+ }
42
+ __name(sourceDecorator, "sourceDecorator");
43
+
44
+ // src/entry-preview-docs.ts
45
+ var decorators = [sourceDecorator];
46
+ var parameters = {
47
+ docs: {
48
+ source: {
49
+ type: SourceType2.DYNAMIC,
50
+ language: "html"
51
+ },
52
+ story: { inline: true }
53
+ }
54
+ };
55
+ export {
56
+ decorators,
57
+ parameters
58
+ };
@@ -1,4 +1,11 @@
1
- "use strict";var __defProp=Object.defineProperty;var __getOwnPropDesc=Object.getOwnPropertyDescriptor;var __getOwnPropNames=Object.getOwnPropertyNames;var __hasOwnProp=Object.prototype.hasOwnProperty;var __export=(target,all)=>{for(var name in all)__defProp(target,name,{get:all[name],enumerable:!0})},__copyProps=(to,from,except,desc)=>{if(from&&typeof from=="object"||typeof from=="function")for(let key of __getOwnPropNames(from))!__hasOwnProp.call(to,key)&&key!==except&&__defProp(to,key,{get:()=>from[key],enumerable:!(desc=__getOwnPropDesc(from,key))||desc.enumerable});return to};var __toCommonJS=mod=>__copyProps(__defProp({},"__esModule",{value:!0}),mod);var entry_preview_exports={};__export(entry_preview_exports,{parameters:()=>parameters,render:()=>render,renderToCanvas:()=>renderToCanvas});module.exports=__toCommonJS(entry_preview_exports);var import_global=require("@storybook/global"),import_lit=require("lit"),import_directive_helpers=require("lit/directive-helpers.js"),import_preview_api=require("storybook/preview-api"),import_ts_dedent=require("ts-dedent"),{Node}=import_global.global,render=(args,context)=>{let{id,component}=context;if(!component)throw new Error(`Unable to render story ${id} as the component annotation is missing from the default export`);let element=document.createElement(component);return Object.entries(args).forEach(([key,val])=>{element[key]=val}),element};function renderToCanvas({storyFn,kind,name,showMain,showError,forceRemount},canvasElement){let element=storyFn();if(showMain(),(0,import_directive_helpers.isTemplateResult)(element)){(forceRemount||!canvasElement.querySelector('[id="root-inner"]'))&&(canvasElement.innerHTML='<div id="root-inner"></div>');let renderTo=canvasElement.querySelector('[id="root-inner"]');(0,import_lit.render)(element,renderTo),(0,import_preview_api.simulatePageLoad)(canvasElement)}else if(typeof element=="string")canvasElement.innerHTML=element,(0,import_preview_api.simulatePageLoad)(canvasElement);else if(element instanceof Node){if(canvasElement.firstChild===element&&!forceRemount)return;canvasElement.innerHTML="",canvasElement.appendChild(element),(0,import_preview_api.simulateDOMContentLoaded)()}else showError({title:`Expecting an HTML snippet or DOM node from the story: "${name}" of "${kind}".`,description:import_ts_dedent.dedent`
2
- Did you forget to return the HTML snippet from the story?
3
- Use "() => <your snippet or node>" or when defining the story.
4
- `})}var parameters={renderer:"web-components"};0&&(module.exports={parameters,render,renderToCanvas});
1
+ import {
2
+ parameters,
3
+ render,
4
+ renderToCanvas
5
+ } from "./_browser-chunks/chunk-NIAEHH3S.js";
6
+ import "./_browser-chunks/chunk-JFJ5UJ7Q.js";
7
+ export {
8
+ parameters,
9
+ render,
10
+ renderToCanvas
11
+ };
package/dist/index.d.ts CHANGED
@@ -1,7 +1,12 @@
1
- import { Args, ComponentAnnotations, AnnotatedStoryFn, StoryAnnotations, StrictArgs, DecoratorFunction, LoaderFunction, StoryContext as StoryContext$1, ProjectAnnotations, NamedOrDefaultProjectAnnotations, NormalizedProjectAnnotations } from 'storybook/internal/types';
1
+ import { WebRenderer, Args, ComponentAnnotations, AnnotatedStoryFn, StoryAnnotations, StrictArgs, DecoratorFunction, LoaderFunction, StoryContext as StoryContext$1, ProjectAnnotations, NamedOrDefaultProjectAnnotations, NormalizedProjectAnnotations } from 'storybook/internal/types';
2
2
  export { ArgTypes, Args, Parameters, StrictArgs } from 'storybook/internal/types';
3
- import { W as WebComponentsRenderer } from './types-9976a2c9.js';
4
- import 'lit';
3
+ import { TemplateResult, SVGTemplateResult } from 'lit';
4
+
5
+ type StoryFnHtmlReturnType = string | Node | DocumentFragment | TemplateResult | SVGTemplateResult;
6
+ interface WebComponentsRenderer extends WebRenderer {
7
+ component: string;
8
+ storyResult: StoryFnHtmlReturnType;
9
+ }
5
10
 
6
11
  /**
7
12
  * Metadata to configure the stories for a component.
@@ -54,4 +59,4 @@ declare function getCustomElements(): any;
54
59
  */
55
60
  declare function setProjectAnnotations(projectAnnotations: NamedOrDefaultProjectAnnotations<any> | NamedOrDefaultProjectAnnotations<any>[]): NormalizedProjectAnnotations<WebComponentsRenderer>;
56
61
 
57
- export { Decorator, Loader, Meta, Preview, StoryContext, StoryFn, StoryObj, WebComponentsRenderer, getCustomElements, isValidComponent, isValidMetaData, setCustomElements, setCustomElementsManifest, setProjectAnnotations };
62
+ export { type Decorator, type Loader, type Meta, type Preview, type StoryContext, type StoryFn, type StoryObj, type WebComponentsRenderer, getCustomElements, isValidComponent, isValidMetaData, setCustomElements, setCustomElementsManifest, setProjectAnnotations };
package/dist/index.js CHANGED
@@ -1,5 +1,18 @@
1
- "use strict";var __defProp=Object.defineProperty;var __getOwnPropDesc=Object.getOwnPropertyDescriptor;var __getOwnPropNames=Object.getOwnPropertyNames;var __hasOwnProp=Object.prototype.hasOwnProperty;var __export=(target,all)=>{for(var name in all)__defProp(target,name,{get:all[name],enumerable:!0})},__copyProps=(to,from,except,desc)=>{if(from&&typeof from=="object"||typeof from=="function")for(let key of __getOwnPropNames(from))!__hasOwnProp.call(to,key)&&key!==except&&__defProp(to,key,{get:()=>from[key],enumerable:!(desc=__getOwnPropDesc(from,key))||desc.enumerable});return to};var __toCommonJS=mod=>__copyProps(__defProp({},"__esModule",{value:!0}),mod);var index_exports={};__export(index_exports,{getCustomElements:()=>getCustomElements,isValidComponent:()=>isValidComponent,isValidMetaData:()=>isValidMetaData,setCustomElements:()=>setCustomElements,setCustomElementsManifest:()=>setCustomElementsManifest,setProjectAnnotations:()=>setProjectAnnotations});module.exports=__toCommonJS(index_exports);var import_global4=require("@storybook/global");var import_global=require("@storybook/global"),{window:globalWindow}=import_global.global;globalWindow.STORYBOOK_ENV="web-components";var import_global2=require("@storybook/global");function isValidComponent(tagName){if(!tagName)return!1;if(typeof tagName=="string")return!0;throw new Error('Provided component needs to be a string. e.g. component: "my-element"')}function isValidMetaData(customElements){if(!customElements)return!1;if(customElements.tags&&Array.isArray(customElements.tags)||customElements.modules&&Array.isArray(customElements.modules))return!0;throw new Error(`You need to setup valid meta data in your config.js via setCustomElements().
2
- See the readme of addon-docs for web components for more details.`)}function setCustomElements(customElements){import_global2.global.__STORYBOOK_CUSTOM_ELEMENTS__=customElements}function setCustomElementsManifest(customElements){import_global2.global.__STORYBOOK_CUSTOM_ELEMENTS_MANIFEST__=customElements}function getCustomElements(){return import_global2.global.__STORYBOOK_CUSTOM_ELEMENTS__||import_global2.global.__STORYBOOK_CUSTOM_ELEMENTS_MANIFEST__}var import_preview_api2=require("storybook/preview-api");var entry_preview_exports={};__export(entry_preview_exports,{parameters:()=>parameters,render:()=>render,renderToCanvas:()=>renderToCanvas});var import_global3=require("@storybook/global"),import_lit=require("lit"),import_directive_helpers=require("lit/directive-helpers.js"),import_preview_api=require("storybook/preview-api"),import_ts_dedent=require("ts-dedent"),{Node}=import_global3.global,render=(args,context)=>{let{id,component}=context;if(!component)throw new Error(`Unable to render story ${id} as the component annotation is missing from the default export`);let element=document.createElement(component);return Object.entries(args).forEach(([key,val])=>{element[key]=val}),element};function renderToCanvas({storyFn,kind,name,showMain,showError,forceRemount},canvasElement){let element=storyFn();if(showMain(),(0,import_directive_helpers.isTemplateResult)(element)){(forceRemount||!canvasElement.querySelector('[id="root-inner"]'))&&(canvasElement.innerHTML='<div id="root-inner"></div>');let renderTo=canvasElement.querySelector('[id="root-inner"]');(0,import_lit.render)(element,renderTo),(0,import_preview_api.simulatePageLoad)(canvasElement)}else if(typeof element=="string")canvasElement.innerHTML=element,(0,import_preview_api.simulatePageLoad)(canvasElement);else if(element instanceof Node){if(canvasElement.firstChild===element&&!forceRemount)return;canvasElement.innerHTML="",canvasElement.appendChild(element),(0,import_preview_api.simulateDOMContentLoaded)()}else showError({title:`Expecting an HTML snippet or DOM node from the story: "${name}" of "${kind}".`,description:import_ts_dedent.dedent`
3
- Did you forget to return the HTML snippet from the story?
4
- Use "() => <your snippet or node>" or when defining the story.
5
- `})}var parameters={renderer:"web-components"};function setProjectAnnotations(projectAnnotations){return(0,import_preview_api2.setDefaultProjectAnnotations)(entry_preview_exports),(0,import_preview_api2.setProjectAnnotations)(projectAnnotations)}var{window,EventSource}=import_global4.global;typeof module<"u"&&module?.hot?.decline&&(module.hot.decline(),new EventSource("__webpack_hmr").addEventListener("message",function(event){try{let{action}=JSON.parse(event.data);action==="built"&&window.location.reload()}catch{}}));0&&(module.exports={getCustomElements,isValidComponent,isValidMetaData,setCustomElements,setCustomElementsManifest,setProjectAnnotations});
1
+ import {
2
+ getCustomElements,
3
+ isValidComponent,
4
+ isValidMetaData,
5
+ setCustomElements,
6
+ setCustomElementsManifest,
7
+ setProjectAnnotations
8
+ } from "./_browser-chunks/chunk-CTBWQQZK.js";
9
+ import "./_browser-chunks/chunk-NIAEHH3S.js";
10
+ import "./_browser-chunks/chunk-JFJ5UJ7Q.js";
11
+ export {
12
+ getCustomElements,
13
+ isValidComponent,
14
+ isValidMetaData,
15
+ setCustomElements,
16
+ setCustomElementsManifest,
17
+ setProjectAnnotations
18
+ };
package/dist/preset.js CHANGED
@@ -1 +1,26 @@
1
- "use strict";var __defProp=Object.defineProperty;var __getOwnPropDesc=Object.getOwnPropertyDescriptor;var __getOwnPropNames=Object.getOwnPropertyNames;var __hasOwnProp=Object.prototype.hasOwnProperty;var __export=(target,all)=>{for(var name in all)__defProp(target,name,{get:all[name],enumerable:!0})},__copyProps=(to,from,except,desc)=>{if(from&&typeof from=="object"||typeof from=="function")for(let key of __getOwnPropNames(from))!__hasOwnProp.call(to,key)&&key!==except&&__defProp(to,key,{get:()=>from[key],enumerable:!(desc=__getOwnPropDesc(from,key))||desc.enumerable});return to};var __toCommonJS=mod=>__copyProps(__defProp({},"__esModule",{value:!0}),mod);var preset_exports={};__export(preset_exports,{previewAnnotations:()=>previewAnnotations});module.exports=__toCommonJS(preset_exports);var import_node_path=require("path"),previewAnnotations=async(input=[],options)=>{let docsEnabled=Object.keys(await options.presets.apply("docs",{},options)).length>0;return[].concat(input).concat([(0,import_node_path.join)(__dirname,"entry-preview.mjs"),(0,import_node_path.join)(__dirname,"entry-preview-argtypes.mjs")]).concat(docsEnabled?[(0,import_node_path.join)(__dirname,"entry-preview-docs.mjs")]:[])};0&&(module.exports={previewAnnotations});
1
+ import CJS_COMPAT_NODE_URL_dhoe13vk07f from 'node:url';
2
+ import CJS_COMPAT_NODE_PATH_dhoe13vk07f from 'node:path';
3
+ import CJS_COMPAT_NODE_MODULE_dhoe13vk07f from "node:module";
4
+
5
+ var __filename = CJS_COMPAT_NODE_URL_dhoe13vk07f.fileURLToPath(import.meta.url);
6
+ var __dirname = CJS_COMPAT_NODE_PATH_dhoe13vk07f.dirname(__filename);
7
+ var require = CJS_COMPAT_NODE_MODULE_dhoe13vk07f.createRequire(import.meta.url);
8
+
9
+ // ------------------------------------------------------------
10
+ // end of CJS compatibility banner, injected by Storybook's esbuild configuration
11
+ // ------------------------------------------------------------
12
+ var __defProp = Object.defineProperty;
13
+ var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
14
+
15
+ // src/preset.ts
16
+ import { fileURLToPath } from "node:url";
17
+ var previewAnnotations = /* @__PURE__ */ __name(async (input = [], options) => {
18
+ const docsEnabled = Object.keys(await options.presets.apply("docs", {}, options)).length > 0;
19
+ const result = [];
20
+ return result.concat(input).concat([fileURLToPath(import.meta.resolve("@storybook/web-components/entry-preview"))]).concat(
21
+ docsEnabled ? [fileURLToPath(import.meta.resolve("@storybook/web-components/entry-preview-docs"))] : []
22
+ );
23
+ }, "previewAnnotations");
24
+ export {
25
+ previewAnnotations
26
+ };
package/package.json CHANGED
@@ -1,12 +1,15 @@
1
1
  {
2
2
  "name": "@storybook/web-components",
3
- "version": "9.2.0-alpha.3",
4
- "description": "Storybook web-components renderer",
3
+ "version": "10.0.0-beta.1",
4
+ "description": "Storybook Web Components renderer: Develop, document, and test UI components in isolation",
5
5
  "keywords": [
6
+ "storybook",
7
+ "storybook-renderer",
6
8
  "lit",
7
9
  "lit-html",
8
- "storybook",
9
- "web-components"
10
+ "web-components",
11
+ "component",
12
+ "components"
10
13
  ],
11
14
  "homepage": "https://github.com/storybookjs/storybook/tree/next/code/renderers/web-components",
12
15
  "bugs": {
@@ -22,21 +25,18 @@
22
25
  "url": "https://opencollective.com/storybook"
23
26
  },
24
27
  "license": "MIT",
28
+ "type": "module",
25
29
  "exports": {
26
30
  ".": {
27
31
  "types": "./dist/index.d.ts",
28
- "import": "./dist/index.mjs",
29
- "require": "./dist/index.js"
32
+ "default": "./dist/index.js"
30
33
  },
31
- "./preset": "./preset.js",
32
- "./dist/entry-preview.mjs": "./dist/entry-preview.mjs",
33
- "./dist/entry-preview-argtypes.mjs": "./dist/entry-preview-argtypes.mjs",
34
- "./dist/entry-preview-docs.mjs": "./dist/entry-preview-docs.mjs",
35
- "./package.json": "./package.json"
34
+ "./entry-preview": "./dist/entry-preview.js",
35
+ "./entry-preview-argtypes": "./dist/entry-preview-argtypes.js",
36
+ "./entry-preview-docs": "./dist/entry-preview-docs.js",
37
+ "./package.json": "./package.json",
38
+ "./preset": "./dist/preset.js"
36
39
  },
37
- "main": "dist/index.js",
38
- "module": "dist/index.mjs",
39
- "types": "dist/index.d.ts",
40
40
  "files": [
41
41
  "dist/**/*",
42
42
  "template/cli/**/*",
@@ -46,8 +46,8 @@
46
46
  "!src/**/*"
47
47
  ],
48
48
  "scripts": {
49
- "check": "jiti ../../../scripts/prepare/check.ts",
50
- "prep": "jiti ../../../scripts/prepare/bundle.ts"
49
+ "check": "jiti ../../../scripts/check/check-package.ts",
50
+ "prep": "jiti ../../../scripts/build/build-package.ts"
51
51
  },
52
52
  "dependencies": {
53
53
  "@storybook/global": "^5.0.0",
@@ -66,23 +66,10 @@
66
66
  },
67
67
  "peerDependencies": {
68
68
  "lit": "^2.0.0 || ^3.0.0",
69
- "storybook": "^9.2.0-alpha.3"
70
- },
71
- "engines": {
72
- "node": ">=20.0.0"
69
+ "storybook": "^10.0.0-beta.1"
73
70
  },
74
71
  "publishConfig": {
75
72
  "access": "public"
76
73
  },
77
- "bundler": {
78
- "entries": [
79
- "./src/index.ts",
80
- "./src/preset.ts",
81
- "./src/entry-preview.ts",
82
- "./src/entry-preview-argtypes.ts",
83
- "./src/entry-preview-docs.ts"
84
- ],
85
- "platform": "browser"
86
- },
87
- "gitHead": "ce6a1e4a8d5ad69c699021a0b183df89cfc7b684"
74
+ "gitHead": "a8e7fd8a655c69780bc20b9749d2699e45beae16"
88
75
  }
package/preset.js CHANGED
@@ -1 +1 @@
1
- module.exports = require('./dist/preset');
1
+ export * from './dist/preset.js';
@@ -1,3 +0,0 @@
1
- var __defProp=Object.defineProperty;var __export=(target,all)=>{for(var name in all)__defProp(target,name,{get:all[name],enumerable:!0});};
2
-
3
- export { __export };
@@ -1,13 +0,0 @@
1
- import { __export } from './chunk-CEH6MNVV.mjs';
2
- import { global } from '@storybook/global';
3
- import { render as render$1 } from 'lit';
4
- import { isTemplateResult } from 'lit/directive-helpers.js';
5
- import { simulatePageLoad, simulateDOMContentLoaded } from 'storybook/preview-api';
6
- import { dedent } from 'ts-dedent';
7
-
8
- var entry_preview_exports={};__export(entry_preview_exports,{parameters:()=>parameters,render:()=>render,renderToCanvas:()=>renderToCanvas});var {Node}=global,render=(args,context)=>{let{id,component}=context;if(!component)throw new Error(`Unable to render story ${id} as the component annotation is missing from the default export`);let element=document.createElement(component);return Object.entries(args).forEach(([key,val])=>{element[key]=val;}),element};function renderToCanvas({storyFn,kind,name,showMain,showError,forceRemount},canvasElement){let element=storyFn();if(showMain(),isTemplateResult(element)){(forceRemount||!canvasElement.querySelector('[id="root-inner"]'))&&(canvasElement.innerHTML='<div id="root-inner"></div>');let renderTo=canvasElement.querySelector('[id="root-inner"]');render$1(element,renderTo),simulatePageLoad(canvasElement);}else if(typeof element=="string")canvasElement.innerHTML=element,simulatePageLoad(canvasElement);else if(element instanceof Node){if(canvasElement.firstChild===element&&!forceRemount)return;canvasElement.innerHTML="",canvasElement.appendChild(element),simulateDOMContentLoaded();}else showError({title:`Expecting an HTML snippet or DOM node from the story: "${name}" of "${kind}".`,description:dedent`
9
- Did you forget to return the HTML snippet from the story?
10
- Use "() => <your snippet or node>" or when defining the story.
11
- `});}var parameters={renderer:"web-components"};
12
-
13
- export { entry_preview_exports, parameters, render, renderToCanvas };
@@ -1,8 +0,0 @@
1
- import { entry_preview_exports } from './chunk-J73AUUXV.mjs';
2
- import { global } from '@storybook/global';
3
- import { setDefaultProjectAnnotations, setProjectAnnotations as setProjectAnnotations$1 } from 'storybook/preview-api';
4
-
5
- var{window:globalWindow}=global;globalWindow.STORYBOOK_ENV="web-components";function isValidComponent(tagName){if(!tagName)return !1;if(typeof tagName=="string")return !0;throw new Error('Provided component needs to be a string. e.g. component: "my-element"')}function isValidMetaData(customElements){if(!customElements)return !1;if(customElements.tags&&Array.isArray(customElements.tags)||customElements.modules&&Array.isArray(customElements.modules))return !0;throw new Error(`You need to setup valid meta data in your config.js via setCustomElements().
6
- See the readme of addon-docs for web components for more details.`)}function setCustomElements(customElements){global.__STORYBOOK_CUSTOM_ELEMENTS__=customElements;}function setCustomElementsManifest(customElements){global.__STORYBOOK_CUSTOM_ELEMENTS_MANIFEST__=customElements;}function getCustomElements(){return global.__STORYBOOK_CUSTOM_ELEMENTS__||global.__STORYBOOK_CUSTOM_ELEMENTS_MANIFEST__}function setProjectAnnotations(projectAnnotations){return setDefaultProjectAnnotations(entry_preview_exports),setProjectAnnotations$1(projectAnnotations)}var{window,EventSource}=global;typeof module<"u"&&module?.hot?.decline&&(module.hot.decline(),new EventSource("__webpack_hmr").addEventListener("message",function(event){try{let{action}=JSON.parse(event.data);action==="built"&&window.location.reload();}catch{}}));
7
-
8
- export { getCustomElements, isValidComponent, isValidMetaData, setCustomElements, setCustomElementsManifest, setProjectAnnotations };
@@ -1,16 +0,0 @@
1
- import * as storybook_internal_csf from 'storybook/internal/csf';
2
- import { ArgTypesEnhancer } from 'storybook/internal/types';
3
- import { W as WebComponentsRenderer } from './types-9976a2c9.js';
4
- import 'lit';
5
-
6
- declare const parameters: {
7
- docs: {
8
- extractArgTypes: (tagName: string) => {
9
- [x: string]: storybook_internal_csf.InputType;
10
- } | null | undefined;
11
- extractComponentDescription: (tagName: string) => string | null | undefined;
12
- };
13
- };
14
- declare const argTypesEnhancers: ArgTypesEnhancer<WebComponentsRenderer>[];
15
-
16
- export { argTypesEnhancers, parameters };
@@ -1,10 +0,0 @@
1
- import { getCustomElements, isValidComponent, isValidMetaData } from './chunk-Y527KJ6E.mjs';
2
- import './chunk-J73AUUXV.mjs';
3
- import './chunk-CEH6MNVV.mjs';
4
- import { enhanceArgTypes } from 'storybook/internal/docs-tools';
5
- import { logger } from 'storybook/internal/client-logger';
6
- import invariant from 'tiny-invariant';
7
-
8
- function mapItem(item,category){let type;switch(category){case"attributes":case"properties":type={name:item.type?.text||item.type};break;case"slots":type={name:"string"};break;default:type={name:"void"};break}return {name:item.name,required:!1,description:item.description,type,table:{category,type:{summary:item.type?.text||item.type},defaultValue:{summary:item.default!==void 0?item.default:item.defaultValue}}}}function mapEvent(item){let name=item.name.replace(/(-|_|:|\.|\s)+(.)?/g,(_match,_separator,chr)=>chr?chr.toUpperCase():"").replace(/^([A-Z])/,match=>match.toLowerCase());return name=`on${name.charAt(0).toUpperCase()+name.substr(1)}`,[{name,action:{name:item.name},table:{disable:!0}},mapItem(item,"events")]}function mapData(data,category){return data&&data.filter(item=>item&&item.name).reduce((acc,item)=>{if(item.kind==="method")return acc;switch(category){case"events":mapEvent(item).forEach(argType=>{invariant(argType.name,`${argType} should have a name property.`),acc[argType.name]=argType;});break;default:acc[item.name]=mapItem(item,category);break}return acc},{})}var getMetaDataExperimental=(tagName,customElements)=>{if(!isValidComponent(tagName)||!isValidMetaData(customElements))return null;let metaData=customElements.tags.find(tag=>tag.name.toUpperCase()===tagName.toUpperCase());return metaData||logger.warn(`Component not found in custom-elements.json: ${tagName}`),metaData},getMetaDataV1=(tagName,customElements)=>{if(!isValidComponent(tagName)||!isValidMetaData(customElements))return null;let metadata;return customElements?.modules?.forEach(_module=>{_module?.declarations?.forEach(declaration=>{declaration.tagName===tagName&&(metadata=declaration);});}),metadata||logger.warn(`Component not found in custom-elements.json: ${tagName}`),metadata},getMetaData=(tagName,manifest)=>manifest?.version==="experimental"?getMetaDataExperimental(tagName,manifest):getMetaDataV1(tagName,manifest),extractArgTypesFromElements=(tagName,customElements)=>{let metaData=getMetaData(tagName,customElements);return metaData&&{...mapData(metaData.members??[],"properties"),...mapData(metaData.properties??[],"properties"),...mapData(metaData.attributes??[],"attributes"),...mapData(metaData.events??[],"events"),...mapData(metaData.slots??[],"slots"),...mapData(metaData.cssProperties??[],"css custom properties"),...mapData(metaData.cssParts??[],"css shadow parts")}},extractArgTypes=tagName=>{let cem=getCustomElements();return extractArgTypesFromElements(tagName,cem)},extractComponentDescription=tagName=>{let metaData=getMetaData(tagName,getCustomElements());return metaData&&metaData.description};var parameters={docs:{extractArgTypes,extractComponentDescription}},argTypesEnhancers=[enhanceArgTypes];
9
-
10
- export { argTypesEnhancers, parameters };
@@ -1,19 +0,0 @@
1
- import { SourceType } from 'storybook/internal/docs-tools';
2
- import { DecoratorFunction } from 'storybook/internal/types';
3
- import { W as WebComponentsRenderer } from './types-9976a2c9.js';
4
- import 'lit';
5
-
6
- declare const decorators: DecoratorFunction<WebComponentsRenderer>[];
7
- declare const parameters: {
8
- docs: {
9
- source: {
10
- type: SourceType;
11
- language: string;
12
- };
13
- story: {
14
- inline: boolean;
15
- };
16
- };
17
- };
18
-
19
- export { decorators, parameters };
@@ -1,8 +0,0 @@
1
- import './chunk-CEH6MNVV.mjs';
2
- import { SourceType } from 'storybook/internal/docs-tools';
3
- import { render } from 'lit';
4
- import { useEffect, emitTransformCode } from 'storybook/preview-api';
5
-
6
- var LIT_EXPRESSION_COMMENTS=/<!--\?lit\$[0-9]+\$-->|<!--\??-->/g;function skipSourceRender(context){let sourceParams=context?.parameters.docs?.source,isArgsStory=context?.parameters.__isArgsStory;return sourceParams?.type===SourceType.DYNAMIC?!1:!isArgsStory||sourceParams?.code||sourceParams?.type===SourceType.CODE}function sourceDecorator(storyFn,context){let story=storyFn(),renderedForSource=context?.parameters.docs?.source?.excludeDecorators?context.originalStoryFn(context.args,context):story,source;if(useEffect(()=>{source&&emitTransformCode(source,context);}),!skipSourceRender(context)){let container=window.document.createElement("div");renderedForSource instanceof DocumentFragment?render(renderedForSource.cloneNode(!0),container):render(renderedForSource,container),source=container.innerHTML.replace(LIT_EXPRESSION_COMMENTS,"");}return story}var decorators=[sourceDecorator],parameters={docs:{source:{type:SourceType.DYNAMIC,language:"html"},story:{inline:!0}}};
7
-
8
- export { decorators, parameters };
@@ -1,12 +0,0 @@
1
- import { ArgsStoryFn, RenderContext } from 'storybook/internal/types';
2
- import { W as WebComponentsRenderer } from './types-9976a2c9.js';
3
- import 'lit';
4
-
5
- declare const render: ArgsStoryFn<WebComponentsRenderer>;
6
- declare function renderToCanvas({ storyFn, kind, name, showMain, showError, forceRemount }: RenderContext<WebComponentsRenderer>, canvasElement: WebComponentsRenderer['canvasElement']): void;
7
-
8
- declare const parameters: {
9
- renderer: string;
10
- };
11
-
12
- export { parameters, render, renderToCanvas };
@@ -1,2 +0,0 @@
1
- export { parameters, render, renderToCanvas } from './chunk-J73AUUXV.mjs';
2
- import './chunk-CEH6MNVV.mjs';
package/dist/index.mjs DELETED
@@ -1,3 +0,0 @@
1
- export { getCustomElements, isValidComponent, isValidMetaData, setCustomElements, setCustomElementsManifest, setProjectAnnotations } from './chunk-Y527KJ6E.mjs';
2
- import './chunk-J73AUUXV.mjs';
3
- import './chunk-CEH6MNVV.mjs';
package/dist/preset.d.ts DELETED
@@ -1,5 +0,0 @@
1
- import { PresetProperty } from 'storybook/internal/types';
2
-
3
- declare const previewAnnotations: PresetProperty<'previewAnnotations'>;
4
-
5
- export { previewAnnotations };
@@ -1,10 +0,0 @@
1
- import { WebRenderer } from 'storybook/internal/types';
2
- import { TemplateResult, SVGTemplateResult } from 'lit';
3
-
4
- type StoryFnHtmlReturnType = string | Node | DocumentFragment | TemplateResult | SVGTemplateResult;
5
- interface WebComponentsRenderer extends WebRenderer {
6
- component: string;
7
- storyResult: StoryFnHtmlReturnType;
8
- }
9
-
10
- export { WebComponentsRenderer as W };