@storybook/web-components 8.2.0-alpha.9 → 8.2.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.
Files changed (10) hide show
  1. package/dist/entry-preview-docs.d.ts +173 -5
  2. package/dist/entry-preview-docs.js +2 -2
  3. package/dist/entry-preview-docs.mjs +3 -3
  4. package/dist/entry-preview.d.ts +2 -2
  5. package/dist/entry-preview.js +1 -1
  6. package/dist/entry-preview.mjs +1 -1
  7. package/dist/index.d.ts +3 -3
  8. package/dist/preset.d.ts +1 -1
  9. package/dist/{types-0360da9f.d.ts → types-9976a2c9.d.ts} +1 -1
  10. package/package.json +3 -7
package/dist/entry-preview-docs.d.ts CHANGED
@@ -1,14 +1,182 @@
1
- import * as _storybook_types from '@storybook/types';
2
- import { DecoratorFunction, ArgTypesEnhancer } from '@storybook/types';
3
- import { SourceType } from '@storybook/docs-tools';
4
- import { W as WebComponentsRenderer } from './types-0360da9f.js';
1
+ import { DecoratorFunction, ArgTypesEnhancer } from 'storybook/internal/types';
2
+ import { SourceType } from 'storybook/internal/docs-tools';
3
+ import { W as WebComponentsRenderer } from './types-9976a2c9.js';
5
4
  import 'lit';
6
5
 
6
+ declare global {
7
+ interface SymbolConstructor {
8
+ readonly observable: symbol;
9
+ }
10
+ }
11
+
12
+ interface SBBaseType {
13
+ required?: boolean;
14
+ raw?: string;
15
+ }
16
+ type SBScalarType = SBBaseType & {
17
+ name: 'boolean' | 'string' | 'number' | 'function' | 'symbol';
18
+ };
19
+ type SBArrayType = SBBaseType & {
20
+ name: 'array';
21
+ value: SBType;
22
+ };
23
+ type SBObjectType = SBBaseType & {
24
+ name: 'object';
25
+ value: Record<string, SBType>;
26
+ };
27
+ type SBEnumType = SBBaseType & {
28
+ name: 'enum';
29
+ value: (string | number)[];
30
+ };
31
+ type SBIntersectionType = SBBaseType & {
32
+ name: 'intersection';
33
+ value: SBType[];
34
+ };
35
+ type SBUnionType = SBBaseType & {
36
+ name: 'union';
37
+ value: SBType[];
38
+ };
39
+ type SBOtherType = SBBaseType & {
40
+ name: 'other';
41
+ value: string;
42
+ };
43
+ type SBType = SBScalarType | SBEnumType | SBArrayType | SBObjectType | SBIntersectionType | SBUnionType | SBOtherType;
44
+ type ControlType = 'object' | 'boolean' | 'check' | 'inline-check' | 'radio' | 'inline-radio' | 'select' | 'multi-select' | 'number' | 'range' | 'file' | 'color' | 'date' | 'text';
45
+ type ConditionalTest = {
46
+ truthy?: boolean;
47
+ } | {
48
+ exists: boolean;
49
+ } | {
50
+ eq: any;
51
+ } | {
52
+ neq: any;
53
+ };
54
+ type ConditionalValue = {
55
+ arg: string;
56
+ } | {
57
+ global: string;
58
+ };
59
+ type Conditional = ConditionalValue & ConditionalTest;
60
+ interface ControlBase {
61
+ [key: string]: any;
62
+ /**
63
+ * @see https://storybook.js.org/docs/api/arg-types#controltype
64
+ */
65
+ type?: ControlType;
66
+ disable?: boolean;
67
+ }
68
+ type Control = ControlType | false | (ControlBase & (ControlBase | {
69
+ type: 'color';
70
+ /**
71
+ * @see https://storybook.js.org/docs/api/arg-types#controlpresetcolors
72
+ */
73
+ presetColors?: string[];
74
+ } | {
75
+ type: 'file';
76
+ /**
77
+ * @see https://storybook.js.org/docs/api/arg-types#controlaccept
78
+ */
79
+ accept?: string;
80
+ } | {
81
+ type: 'inline-check' | 'radio' | 'inline-radio' | 'select' | 'multi-select';
82
+ /**
83
+ * @see https://storybook.js.org/docs/api/arg-types#controllabels
84
+ */
85
+ labels?: {
86
+ [options: string]: string;
87
+ };
88
+ } | {
89
+ type: 'number' | 'range';
90
+ /**
91
+ * @see https://storybook.js.org/docs/api/arg-types#controlmax
92
+ */
93
+ max?: number;
94
+ /**
95
+ * @see https://storybook.js.org/docs/api/arg-types#controlmin
96
+ */
97
+ min?: number;
98
+ /**
99
+ * @see https://storybook.js.org/docs/api/arg-types#controlstep
100
+ */
101
+ step?: number;
102
+ }));
103
+ interface InputType {
104
+ /**
105
+ * @see https://storybook.js.org/docs/api/arg-types#control
106
+ */
107
+ control?: Control;
108
+ /**
109
+ * @see https://storybook.js.org/docs/api/arg-types#description
110
+ */
111
+ description?: string;
112
+ /**
113
+ * @see https://storybook.js.org/docs/api/arg-types#if
114
+ */
115
+ if?: Conditional;
116
+ /**
117
+ * @see https://storybook.js.org/docs/api/arg-types#mapping
118
+ */
119
+ mapping?: {
120
+ [key: string]: any;
121
+ };
122
+ /**
123
+ * @see https://storybook.js.org/docs/api/arg-types#name
124
+ */
125
+ name?: string;
126
+ /**
127
+ * @see https://storybook.js.org/docs/api/arg-types#options
128
+ */
129
+ options?: readonly any[];
130
+ /**
131
+ * @see https://storybook.js.org/docs/api/arg-types#table
132
+ */
133
+ table?: {
134
+ [key: string]: unknown;
135
+ /**
136
+ * @see https://storybook.js.org/docs/api/arg-types#tablecategory
137
+ */
138
+ category?: string;
139
+ /**
140
+ * @see https://storybook.js.org/docs/api/arg-types#tabledefaultvalue
141
+ */
142
+ defaultValue?: {
143
+ summary?: string;
144
+ detail?: string;
145
+ };
146
+ /**
147
+ * @see https://storybook.js.org/docs/api/arg-types#tabledisable
148
+ */
149
+ disable?: boolean;
150
+ /**
151
+ * @see https://storybook.js.org/docs/api/arg-types#tablesubcategory
152
+ */
153
+ subcategory?: string;
154
+ /**
155
+ * @see https://storybook.js.org/docs/api/arg-types#tabletype
156
+ */
157
+ type?: {
158
+ summary?: string;
159
+ detail?: string;
160
+ };
161
+ };
162
+ /**
163
+ * @see https://storybook.js.org/docs/api/arg-types#type
164
+ */
165
+ type?: SBType | SBScalarType['name'];
166
+ /**
167
+ * @see https://storybook.js.org/docs/api/arg-types#defaultvalue
168
+ *
169
+ * @deprecated Use `table.defaultValue.summary` instead.
170
+ */
171
+ defaultValue?: any;
172
+ [key: string]: any;
173
+ }
174
+
7
175
  declare const decorators: DecoratorFunction<WebComponentsRenderer>[];
8
176
  declare const parameters: {
9
177
  docs: {
10
178
  extractArgTypes: (tagName: string) => {
11
- [x: string]: _storybook_types.InputType;
179
+ [x: string]: InputType;
12
180
  } | null | undefined;
13
181
  extractComponentDescription: (tagName: string) => string | null | undefined;
14
182
  story: {
package/dist/entry-preview-docs.js CHANGED
@@ -1,2 +1,2 @@
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_docs_exports={};__export(entry_preview_docs_exports,{argTypesEnhancers:()=>argTypesEnhancers,decorators:()=>decorators,parameters:()=>parameters});module.exports=__toCommonJS(entry_preview_docs_exports);var import_docs_tools2=require("@storybook/docs-tools");var import_tiny_invariant=__toESM(require("tiny-invariant")),import_client_logger=require("@storybook/client-logger");var import_global3=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{window:window2,EventSource}=import_global3.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"&&window2.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 import_lit=require("lit"),import_preview_api=require("@storybook/preview-api"),import_docs_tools=require("@storybook/docs-tools"),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)(()=>{let{id,unmappedArgs}=context;source&&import_preview_api.addons.getChannel().emit(import_docs_tools.SNIPPET_RENDERED,{id,source,args:unmappedArgs})}),!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:{extractArgTypes,extractComponentDescription,story:{inline:!0},source:{type:import_docs_tools2.SourceType.DYNAMIC,language:"html"}}},argTypesEnhancers=[import_docs_tools2.enhanceArgTypes];0&&(module.exports={argTypesEnhancers,decorators,parameters});
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_docs_exports={};__export(entry_preview_docs_exports,{argTypesEnhancers:()=>argTypesEnhancers,decorators:()=>decorators,parameters:()=>parameters});module.exports=__toCommonJS(entry_preview_docs_exports);var import_docs_tools2=require("storybook/internal/docs-tools");var import_tiny_invariant=__toESM(require("tiny-invariant")),import_client_logger=require("storybook/internal/client-logger");var import_global3=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{window:window2,EventSource}=import_global3.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"&&window2.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 import_lit=require("lit"),import_preview_api=require("storybook/internal/preview-api"),import_docs_tools=require("storybook/internal/docs-tools"),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)(()=>{let{id,unmappedArgs}=context;source&&import_preview_api.addons.getChannel().emit(import_docs_tools.SNIPPET_RENDERED,{id,source,args:unmappedArgs})}),!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:{extractArgTypes,extractComponentDescription,story:{inline:!0},source:{type:import_docs_tools2.SourceType.DYNAMIC,language:"html"}}},argTypesEnhancers=[import_docs_tools2.enhanceArgTypes];0&&(module.exports={argTypesEnhancers,decorators,parameters});
package/dist/entry-preview-docs.mjs CHANGED
@@ -1,9 +1,9 @@
1
1
  import { getCustomElements, isValidComponent, isValidMetaData } from './chunk-GKNNPQCW.mjs';
2
- import { SourceType, enhanceArgTypes, SNIPPET_RENDERED } from '@storybook/docs-tools';
2
+ import { SourceType, enhanceArgTypes, SNIPPET_RENDERED } from 'storybook/internal/docs-tools';
3
3
  import invariant from 'tiny-invariant';
4
- import { logger } from '@storybook/client-logger';
4
+ import { logger } from 'storybook/internal/client-logger';
5
5
  import { render } from 'lit';
6
- import { useEffect, addons } from '@storybook/preview-api';
6
+ import { useEffect, addons } from 'storybook/internal/preview-api';
7
7
 
8
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 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(()=>{let{id,unmappedArgs}=context;source&&addons.getChannel().emit(SNIPPET_RENDERED,{id,source,args:unmappedArgs});}),!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:{extractArgTypes,extractComponentDescription,story:{inline:!0},source:{type:SourceType.DYNAMIC,language:"html"}}},argTypesEnhancers=[enhanceArgTypes];
9
9
 
package/dist/entry-preview.d.ts CHANGED
@@ -1,5 +1,5 @@
1
- import { ArgsStoryFn, RenderContext } from '@storybook/types';
2
- import { W as WebComponentsRenderer } from './types-0360da9f.js';
1
+ import { ArgsStoryFn, RenderContext } from 'storybook/internal/types';
2
+ import { W as WebComponentsRenderer } from './types-9976a2c9.js';
3
3
  import 'lit';
4
4
 
5
5
  declare const render: ArgsStoryFn<WebComponentsRenderer>;
package/dist/entry-preview.js CHANGED
@@ -1,4 +1,4 @@
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_ts_dedent=require("ts-dedent"),import_lit=require("lit"),import_directive_helpers=require("lit/directive-helpers.js"),import_preview_api=require("@storybook/preview-api"),{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`
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_ts_dedent=require("ts-dedent"),import_lit=require("lit"),import_directive_helpers=require("lit/directive-helpers.js"),import_preview_api=require("storybook/internal/preview-api"),{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
2
  Did you forget to return the HTML snippet from the story?
3
3
  Use "() => <your snippet or node>" or when defining the story.
4
4
  `})}var parameters={renderer:"web-components"};0&&(module.exports={parameters,render,renderToCanvas});
package/dist/entry-preview.mjs CHANGED
@@ -2,7 +2,7 @@ import { global } from '@storybook/global';
2
2
  import { dedent } from 'ts-dedent';
3
3
  import { render as render$1 } from 'lit';
4
4
  import { isTemplateResult } from 'lit/directive-helpers.js';
5
- import { simulatePageLoad, simulateDOMContentLoaded } from '@storybook/preview-api';
5
+ import { simulatePageLoad, simulateDOMContentLoaded } from 'storybook/internal/preview-api';
6
6
 
7
7
  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`
8
8
  Did you forget to return the HTML snippet from the story?
package/dist/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
- import { Args, ComponentAnnotations, AnnotatedStoryFn, StoryAnnotations, StrictArgs, DecoratorFunction, LoaderFunction, StoryContext as StoryContext$1, ProjectAnnotations } from '@storybook/types';
2
- export { ArgTypes, Args, Parameters, StrictArgs } from '@storybook/types';
3
- import { W as WebComponentsRenderer } from './types-0360da9f.js';
1
+ import { Args, ComponentAnnotations, AnnotatedStoryFn, StoryAnnotations, StrictArgs, DecoratorFunction, LoaderFunction, StoryContext as StoryContext$1, ProjectAnnotations } from 'storybook/internal/types';
2
+ export { ArgTypes, Args, Parameters, StrictArgs } from 'storybook/internal/types';
3
+ import { W as WebComponentsRenderer } from './types-9976a2c9.js';
4
4
  import 'lit';
5
5
 
6
6
  /**
package/dist/preset.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { PresetProperty } from '@storybook/types';
1
+ import { PresetProperty } from 'storybook/internal/types';
2
2
 
3
3
  declare const previewAnnotations: PresetProperty<'previewAnnotations'>;
4
4
 
package/dist/{types-0360da9f.d.ts → types-9976a2c9.d.ts} RENAMED
@@ -1,4 +1,4 @@
1
- import { WebRenderer } from '@storybook/types';
1
+ import { WebRenderer } from 'storybook/internal/types';
2
2
  import { TemplateResult, SVGTemplateResult } from 'lit';
3
3
 
4
4
  type StoryFnHtmlReturnType = string | Node | DocumentFragment | TemplateResult | SVGTemplateResult;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@storybook/web-components",
3
- "version": "8.2.0-alpha.9",
3
+ "version": "8.2.0-beta.1",
4
4
  "description": "Storybook web-components renderer",
5
5
  "keywords": [
6
6
  "lit",
@@ -50,12 +50,7 @@
50
50
  "prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/bundle.ts"
51
51
  },
52
52
  "dependencies": {
53
- "@storybook/client-logger": "8.2.0-alpha.9",
54
- "@storybook/docs-tools": "8.2.0-alpha.9",
55
53
  "@storybook/global": "^5.0.0",
56
- "@storybook/manager-api": "8.2.0-alpha.9",
57
- "@storybook/preview-api": "8.2.0-alpha.9",
58
- "@storybook/types": "8.2.0-alpha.9",
59
54
  "tiny-invariant": "^1.3.1",
60
55
  "ts-dedent": "^2.0.0"
61
56
  },
@@ -68,7 +63,8 @@
68
63
  "web-component-analyzer": "^1.1.6"
69
64
  },
70
65
  "peerDependencies": {
71
- "lit": "^2.0.0 || ^3.0.0"
66
+ "lit": "^2.0.0 || ^3.0.0",
67
+ "storybook": "^8.2.0-beta.1"
72
68
  },
73
69
  "engines": {
74
70
  "node": ">=18.0.0"