@storybook/html 6.5.9 → 7.0.0-alpha.10
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 +1 -25
- package/dist/chunk-RJRHENSI.mjs +4 -0
- package/dist/config.d.ts +4 -0
- package/dist/config.js +4 -0
- package/dist/config.mjs +1 -0
- package/dist/index.d.ts +51 -0
- package/dist/index.js +4 -0
- package/dist/index.mjs +1 -0
- package/dist/types-f5d03672.d.ts +42 -0
- package/package.json +35 -35
- package/preview.js +1 -0
- package/bin/build.js +0 -4
- package/bin/index.js +0 -3
- package/dist/cjs/client/docs/config.js +0 -26
- package/dist/cjs/client/docs/prepareForInline.js +0 -29
- package/dist/cjs/client/docs/sourceDecorator.js +0 -67
- package/dist/cjs/client/index.js +0 -89
- package/dist/cjs/client/preview/config.js +0 -19
- package/dist/cjs/client/preview/globals.js +0 -8
- package/dist/cjs/client/preview/index.js +0 -50
- package/dist/cjs/client/preview/render.js +0 -57
- package/dist/cjs/client/preview/types-6-0.js +0 -5
- package/dist/cjs/client/preview/types-7-0.js +0 -5
- package/dist/cjs/client/preview/types.js +0 -1
- package/dist/cjs/server/build.js +0 -9
- package/dist/cjs/server/framework-preset-html-docs.js +0 -17
- package/dist/cjs/server/framework-preset-html.js +0 -23
- package/dist/cjs/server/index.js +0 -9
- package/dist/cjs/server/options.js +0 -17
- package/dist/cjs/server/preset.js +0 -8
- package/dist/esm/client/docs/config.js +0 -14
- package/dist/esm/client/docs/prepareForInline.js +0 -19
- package/dist/esm/client/docs/sourceDecorator.js +0 -56
- package/dist/esm/client/index.js +0 -6
- package/dist/esm/client/preview/config.js +0 -4
- package/dist/esm/client/preview/globals.js +0 -3
- package/dist/esm/client/preview/index.js +0 -27
- package/dist/esm/client/preview/render.js +0 -42
- package/dist/esm/client/preview/types-6-0.js +0 -1
- package/dist/esm/client/preview/types-7-0.js +0 -1
- package/dist/esm/client/preview/types.js +0 -0
- package/dist/esm/server/build.js +0 -3
- package/dist/esm/server/framework-preset-html-docs.js +0 -6
- package/dist/esm/server/framework-preset-html.js +0 -11
- package/dist/esm/server/index.js +0 -3
- package/dist/esm/server/options.js +0 -8
- package/dist/esm/server/preset.js +0 -1
- package/dist/modern/client/docs/config.js +0 -14
- package/dist/modern/client/docs/prepareForInline.js +0 -17
- package/dist/modern/client/docs/sourceDecorator.js +0 -56
- package/dist/modern/client/index.js +0 -6
- package/dist/modern/client/preview/config.js +0 -4
- package/dist/modern/client/preview/globals.js +0 -5
- package/dist/modern/client/preview/index.js +0 -19
- package/dist/modern/client/preview/render.js +0 -39
- package/dist/modern/client/preview/types-6-0.js +0 -1
- package/dist/modern/client/preview/types-7-0.js +0 -1
- package/dist/modern/client/preview/types.js +0 -0
- package/dist/modern/server/build.js +0 -3
- package/dist/modern/server/framework-preset-html-docs.js +0 -6
- package/dist/modern/server/framework-preset-html.js +0 -11
- package/dist/modern/server/index.js +0 -3
- package/dist/modern/server/options.js +0 -8
- package/dist/modern/server/preset.js +0 -1
- package/dist/ts3.4/client/docs/config.d.ts +0 -14
- package/dist/ts3.4/client/docs/prepareForInline.d.ts +0 -2
- package/dist/ts3.4/client/docs/sourceDecorator.d.ts +0 -3
- package/dist/ts3.4/client/index.d.ts +0 -2
- package/dist/ts3.4/client/preview/config.d.ts +0 -4
- package/dist/ts3.4/client/preview/globals.d.ts +0 -1
- package/dist/ts3.4/client/preview/index.d.ts +0 -24
- package/dist/ts3.4/client/preview/render.d.ts +0 -3
- package/dist/ts3.4/client/preview/types-6-0.d.ts +0 -34
- package/dist/ts3.4/client/preview/types-7-0.d.ts +0 -9
- package/dist/ts3.4/client/preview/types.d.ts +0 -14
- package/dist/ts3.4/server/build.d.ts +0 -1
- package/dist/ts3.4/server/framework-preset-html-docs.d.ts +0 -2
- package/dist/ts3.4/server/framework-preset-html.d.ts +0 -4
- package/dist/ts3.4/server/index.d.ts +0 -1
- package/dist/ts3.4/server/options.d.ts +0 -3
- package/dist/ts3.4/server/preset.d.ts +0 -2
- package/dist/ts3.9/client/docs/config.d.ts +0 -14
- package/dist/ts3.9/client/docs/prepareForInline.d.ts +0 -2
- package/dist/ts3.9/client/docs/sourceDecorator.d.ts +0 -3
- package/dist/ts3.9/client/index.d.ts +0 -2
- package/dist/ts3.9/client/preview/config.d.ts +0 -4
- package/dist/ts3.9/client/preview/globals.d.ts +0 -1
- package/dist/ts3.9/client/preview/index.d.ts +0 -24
- package/dist/ts3.9/client/preview/render.d.ts +0 -3
- package/dist/ts3.9/client/preview/types-6-0.d.ts +0 -34
- package/dist/ts3.9/client/preview/types-7-0.d.ts +0 -9
- package/dist/ts3.9/client/preview/types.d.ts +0 -14
- package/dist/ts3.9/server/build.d.ts +0 -1
- package/dist/ts3.9/server/framework-preset-html-docs.d.ts +0 -2
- package/dist/ts3.9/server/framework-preset-html.d.ts +0 -4
- package/dist/ts3.9/server/index.d.ts +0 -1
- package/dist/ts3.9/server/options.d.ts +0 -3
- package/dist/ts3.9/server/preset.d.ts +0 -2
- package/preset.js +0 -1
- package/standalone.js +0 -8
- package/types-7-0.d.ts +0 -1
package/README.md
CHANGED
|
@@ -1,25 +1 @@
|
|
|
1
|
-
# Storybook
|
|
2
|
-
|
|
3
|
-
---
|
|
4
|
-
|
|
5
|
-
Storybook for HTML is a UI development environment for your plain HTML snippets.
|
|
6
|
-
With it, you can visualize different states of your UI components and develop them interactively.
|
|
7
|
-
|
|
8
|
-

|
|
9
|
-
|
|
10
|
-
Storybook runs outside of your app.
|
|
11
|
-
So you can develop UI components in isolation without worrying about app specific dependencies and requirements.
|
|
12
|
-
|
|
13
|
-
## Getting Started
|
|
14
|
-
|
|
15
|
-
```sh
|
|
16
|
-
cd my-app
|
|
17
|
-
npx sb init -t html
|
|
18
|
-
```
|
|
19
|
-
|
|
20
|
-
For more information visit: [storybook.js.org](https://storybook.js.org)
|
|
21
|
-
|
|
22
|
-
---
|
|
23
|
-
|
|
24
|
-
Storybook also comes with a lot of [addons](https://storybook.js.org/addons) and a great API to customize as you wish.
|
|
25
|
-
You can also build a [static version](https://storybook.js.org/docs/html/sharing/publish-storybook) of your Storybook and deploy it anywhere you want.
|
|
1
|
+
# Storybook HTML Renderer
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
var f=Object.defineProperty;var n=Object.getOwnPropertySymbols;var l=Object.prototype.hasOwnProperty,u=Object.prototype.propertyIsEnumerable;var s=(o,e,t)=>e in o?f(o,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):o[e]=t,T=(o,e)=>{for(var t in e||(e={}))l.call(e,t)&&s(o,t,e[t]);if(n)for(var t of n(e))u.call(e,t)&&s(o,t,e[t]);return o};var p=(o,e)=>f(o,"name",{value:e,configurable:!0});import M from"global";import c from"ts-dedent";import{simulatePageLoad as g,simulateDOMContentLoaded as y}from"@storybook/preview-web";var{Node:L}=M;function $({storyFn:o,kind:e,name:t,showMain:d,showError:a,forceRemount:h},r){let i=o();if(d(),typeof i=="string")r.innerHTML=i,g(r);else if(i instanceof L){if(r.firstChild===i&&h===!1)return;r.innerHTML="",r.appendChild(i),y()}else a({title:`Expecting an HTML snippet or DOM node from the story: "${t}" of "${e}".`,description:c`
|
|
2
|
+
Did you forget to return the HTML snippet from the story?
|
|
3
|
+
Use "() => <your snippet or node>" or when defining the story.
|
|
4
|
+
`})}p($,"renderToDOM");export{T as a,p as b,$ as c};
|
package/dist/config.d.ts
ADDED
package/dist/config.js
ADDED
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
var E=Object.create;var n=Object.defineProperty;var I=Object.getOwnPropertyDescriptor;var R=Object.getOwnPropertyNames,y=Object.getOwnPropertySymbols,_=Object.getPrototypeOf,D=Object.prototype.hasOwnProperty,k=Object.prototype.propertyIsEnumerable;var g=(e,r,o)=>r in e?n(e,r,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[r]=o,S=(e,r)=>{for(var o in r||(r={}))D.call(r,o)&&g(e,o,r[o]);if(y)for(var o of y(r))k.call(r,o)&&g(e,o,r[o]);return e};var i=(e,r)=>n(e,"name",{value:r,configurable:!0});var w=(e,r)=>{for(var o in r)n(e,o,{get:r[o],enumerable:!0})},T=(e,r,o,s)=>{if(r&&typeof r=="object"||typeof r=="function")for(let t of R(r))!D.call(e,t)&&t!==o&&n(e,t,{get:()=>r[t],enumerable:!(s=I(r,t))||s.enumerable});return e};var c=(e,r,o)=>(o=e!=null?E(_(e)):{},T(r||!e||!e.__esModule?n(o,"default",{value:e,enumerable:!0}):o,e)),Y=e=>T(n({},"__esModule",{value:!0}),e);var q={};w(q,{decorators:()=>L,parameters:()=>j,renderToDOM:()=>A});module.exports=Y(q);var C=require("@storybook/docs-tools");var a=require("@storybook/docs-tools"),u=require("@storybook/addons"),M=c(require("ts-dedent"));function $(e){var s;let r=(s=e==null?void 0:e.parameters.docs)==null?void 0:s.source,o=e==null?void 0:e.parameters.__isArgsStory;return(r==null?void 0:r.type)===a.SourceType.DYNAMIC?!1:!o||(r==null?void 0:r.code)||(r==null?void 0:r.type)===a.SourceType.CODE}i($,"skipSourceRender");function b(e){return(0,M.default)(e)}i(b,"defaultTransformSource");function F(e,r){return((r.parameters.docs??{}).transformSource??b)(e,r)}i(F,"applyTransformSource");function h(e,r){var t,d;let o=(d=(t=r==null?void 0:r.parameters.docs)==null?void 0:t.source)!=null&&d.excludeDecorators?r.originalStoryFn(r.args,r):e(),s;return $(r)||(typeof o=="string"?s=o:o instanceof Element&&(s=o.outerHTML),s&&(s=F(s,r))),(0,u.useEffect)(()=>{s&&u.addons.getChannel().emit(a.SNIPPET_RENDERED,r.id,s)}),o}i(h,"sourceDecorator");var L=[h],H={docs:{inlineStories:!0,transformSource:void 0,source:{type:C.SourceType.DYNAMIC,language:"html",code:void 0,excludeDecorators:void 0}}};var N=c(require("global")),O=c(require("ts-dedent")),m=require("@storybook/preview-web"),{Node:U}=N.default;function A({storyFn:e,kind:r,name:o,showMain:s,showError:t,forceRemount:d},f){let p=e();if(s(),typeof p=="string")f.innerHTML=p,(0,m.simulatePageLoad)(f);else if(p instanceof U){if(f.firstChild===p&&d===!1)return;f.innerHTML="",f.appendChild(p),(0,m.simulateDOMContentLoaded)()}else t({title:`Expecting an HTML snippet or DOM node from the story: "${o}" of "${r}".`,description:O.default`
|
|
2
|
+
Did you forget to return the HTML snippet from the story?
|
|
3
|
+
Use "() => <your snippet or node>" or when defining the story.
|
|
4
|
+
`})}i(A,"renderToDOM");var j=S({framework:"html"},H);0&&(module.exports={decorators,parameters,renderToDOM});
|
package/dist/config.mjs
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{a as u,b as f,c}from"./chunk-RJRHENSI.mjs";import{SourceType as A}from"@storybook/docs-tools";import{SNIPPET_RENDERED as l,SourceType as m}from"@storybook/docs-tools";import{addons as S,useEffect as y}from"@storybook/addons";import D from"ts-dedent";function g(e){var o;let r=(o=e==null?void 0:e.parameters.docs)==null?void 0:o.source,s=e==null?void 0:e.parameters.__isArgsStory;return(r==null?void 0:r.type)===m.DYNAMIC?!1:!s||(r==null?void 0:r.code)||(r==null?void 0:r.type)===m.CODE}f(g,"skipSourceRender");function E(e){return D(e)}f(E,"defaultTransformSource");function T(e,r){return((r.parameters.docs??{}).transformSource??E)(e,r)}f(T,"applyTransformSource");function t(e,r){var i,a;let s=(a=(i=r==null?void 0:r.parameters.docs)==null?void 0:i.source)!=null&&a.excludeDecorators?r.originalStoryFn(r.args,r):e(),o;return g(r)||(typeof s=="string"?o=s:s instanceof Element&&(o=s.outerHTML),o&&(o=T(o,r))),y(()=>{o&&S.getChannel().emit(l,r.id,o)}),s}f(t,"sourceDecorator");var C=[t],d={docs:{inlineStories:!0,transformSource:void 0,source:{type:A.DYNAMIC,language:"html",code:void 0,excludeDecorators:void 0}}};var Y=u({framework:"html"},d);export{C as decorators,Y as parameters,c as renderToDOM};
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
import { ClientStoryApi, Loadable } from '@storybook/addons';
|
|
2
|
+
import { H as HtmlFramework, I as IStorybookSection } from './types-f5d03672.js';
|
|
3
|
+
import { Args, ComponentAnnotations, AnnotatedStoryFn, StoryAnnotations } from '@storybook/csf';
|
|
4
|
+
export { ArgTypes, Args, Parameters } from '@storybook/csf';
|
|
5
|
+
import 'lib/docs-tools/dist/types';
|
|
6
|
+
import '@storybook/store';
|
|
7
|
+
|
|
8
|
+
interface ClientApi extends ClientStoryApi<HtmlFramework['storyResult']> {
|
|
9
|
+
setAddon(addon: any): void;
|
|
10
|
+
configure(loader: Loadable, module: NodeModule): void;
|
|
11
|
+
getStorybook(): IStorybookSection[];
|
|
12
|
+
clearDecorators(): void;
|
|
13
|
+
forceReRender(): void;
|
|
14
|
+
raw: () => any;
|
|
15
|
+
}
|
|
16
|
+
declare const storiesOf: ClientApi['storiesOf'];
|
|
17
|
+
declare const configure: ClientApi['configure'];
|
|
18
|
+
declare const addDecorator: ClientApi['addDecorator'];
|
|
19
|
+
declare const addParameters: ClientApi['addParameters'];
|
|
20
|
+
declare const clearDecorators: ClientApi['clearDecorators'];
|
|
21
|
+
declare const setAddon: ClientApi['setAddon'];
|
|
22
|
+
declare const forceReRender: ClientApi['forceReRender'];
|
|
23
|
+
declare const getStorybook: ClientApi['getStorybook'];
|
|
24
|
+
declare const raw: ClientApi['raw'];
|
|
25
|
+
|
|
26
|
+
/**
|
|
27
|
+
* Metadata to configure the stories for a component.
|
|
28
|
+
*
|
|
29
|
+
* @see [Default export](https://storybook.js.org/docs/formats/component-story-format/#default-export)
|
|
30
|
+
*/
|
|
31
|
+
declare type Meta<TArgs = Args> = ComponentAnnotations<HtmlFramework, TArgs>;
|
|
32
|
+
/**
|
|
33
|
+
* Story function that represents a CSFv2 component example.
|
|
34
|
+
*
|
|
35
|
+
* @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
|
|
36
|
+
*/
|
|
37
|
+
declare type StoryFn<TArgs = Args> = AnnotatedStoryFn<HtmlFramework, TArgs>;
|
|
38
|
+
/**
|
|
39
|
+
* Story function that represents a CSFv3 component example.
|
|
40
|
+
*
|
|
41
|
+
* @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
|
|
42
|
+
*/
|
|
43
|
+
declare type StoryObj<TArgs = Args> = StoryAnnotations<HtmlFramework, TArgs>;
|
|
44
|
+
/**
|
|
45
|
+
* Story function that represents a CSFv3 component example.
|
|
46
|
+
*
|
|
47
|
+
* @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
|
|
48
|
+
*/
|
|
49
|
+
declare type Story<TArgs = Args> = StoryObj<TArgs>;
|
|
50
|
+
|
|
51
|
+
export { Meta, Story, StoryFn, StoryObj, addDecorator, addParameters, clearDecorators, configure, forceReRender, getStorybook, raw, setAddon, storiesOf };
|
package/dist/index.js
ADDED
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
var y=Object.create;var p=Object.defineProperty;var T=Object.getOwnPropertyDescriptor;var w=Object.getOwnPropertyNames;var L=Object.getPrototypeOf,R=Object.prototype.hasOwnProperty;var c=(o,e)=>p(o,"name",{value:e,configurable:!0});var b=(o,e)=>{for(var t in e)p(o,t,{get:e[t],enumerable:!0})},m=(o,e,t,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let n of w(e))!R.call(o,n)&&n!==t&&p(o,n,{get:()=>e[n],enumerable:!(a=T(e,n))||a.enumerable});return o};var l=(o,e,t)=>(t=o!=null?y(L(o)):{},m(e||!o||!o.__esModule?p(t,"default",{value:o,enumerable:!0}):t,o)),H=o=>m(p({},"__esModule",{value:!0}),o);var V={};b(V,{addDecorator:()=>K,addParameters:()=>N,clearDecorators:()=>W,configure:()=>S,forceReRender:()=>B,getStorybook:()=>F,raw:()=>U,setAddon:()=>$,storiesOf:()=>C});module.exports=H(V);var x=l(require("global")),{window:P}=x.default;P.STORYBOOK_ENV="HTML";var M=require("@storybook/core-client");var g=l(require("global")),u=l(require("ts-dedent")),f=require("@storybook/preview-web"),{Node:k}=g.default;function A({storyFn:o,kind:e,name:t,showMain:a,showError:n,forceRemount:D},i){let s=o();if(a(),typeof s=="string")i.innerHTML=s,(0,f.simulatePageLoad)(i);else if(s instanceof k){if(i.firstChild===s&&D===!1)return;i.innerHTML="",i.appendChild(s),(0,f.simulateDOMContentLoaded)()}else n({title:`Expecting an HTML snippet or DOM node from the story: "${t}" of "${e}".`,description:u.default`
|
|
2
|
+
Did you forget to return the HTML snippet from the story?
|
|
3
|
+
Use "() => <your snippet or node>" or when defining the story.
|
|
4
|
+
`})}c(A,"renderToDOM");var O="html",r=(0,M.start)(A),C=c((o,e)=>r.clientApi.storiesOf(o,e).addParameters({framework:O}),"storiesOf"),S=c((...o)=>r.configure(O,...o),"configure"),K=r.clientApi.addDecorator,N=r.clientApi.addParameters,W=r.clientApi.clearDecorators,$=r.clientApi.setAddon,B=r.forceReRender,F=r.clientApi.getStorybook,U=r.clientApi.raw;var h;(h=module==null?void 0:module.hot)==null||h.decline();0&&(module.exports={addDecorator,addParameters,clearDecorators,configure,forceReRender,getStorybook,raw,setAddon,storiesOf});
|
package/dist/index.mjs
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{b as t,c as n}from"./chunk-RJRHENSI.mjs";import s from"global";var{window:d}=s;d.STORYBOOK_ENV="HTML";import{start as l}from"@storybook/core-client";var i="html",o=l(n),A=t((r,p)=>o.clientApi.storiesOf(r,p).addParameters({framework:i}),"storiesOf"),O=t((...r)=>o.configure(i,...r),"configure"),R=o.clientApi.addDecorator,g=o.clientApi.addParameters,w=o.clientApi.clearDecorators,D=o.clientApi.setAddon,b=o.forceReRender,u=o.clientApi.getStorybook,k=o.clientApi.raw;var a;(a=module==null?void 0:module.hot)==null||a.decline();export{R as addDecorator,g as addParameters,w as clearDecorators,O as configure,b as forceReRender,u as getStorybook,k as raw,D as setAddon,A as storiesOf};
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import { PartialStoryFn, StoryContext as StoryContext$1 } from '@storybook/csf';
|
|
2
|
+
import * as lib_docs_tools_dist_types from 'lib/docs-tools/dist/types';
|
|
3
|
+
import { RenderContext } from '@storybook/store';
|
|
4
|
+
|
|
5
|
+
declare function sourceDecorator(storyFn: PartialStoryFn<HtmlFramework>, context: StoryContext): StoryFnHtmlReturnType;
|
|
6
|
+
|
|
7
|
+
declare const decorators: (typeof sourceDecorator)[];
|
|
8
|
+
|
|
9
|
+
declare function renderToDOM({ storyFn, kind, name, showMain, showError, forceRemount }: RenderContext<HtmlFramework>, domElement: Element): void;
|
|
10
|
+
|
|
11
|
+
declare const parameters: {
|
|
12
|
+
docs: {
|
|
13
|
+
inlineStories: boolean;
|
|
14
|
+
transformSource: unknown;
|
|
15
|
+
source: {
|
|
16
|
+
type: lib_docs_tools_dist_types.SourceType;
|
|
17
|
+
language: string;
|
|
18
|
+
code: unknown;
|
|
19
|
+
excludeDecorators: unknown;
|
|
20
|
+
};
|
|
21
|
+
};
|
|
22
|
+
framework: "html";
|
|
23
|
+
};
|
|
24
|
+
|
|
25
|
+
declare type StoryFnHtmlReturnType = string | Node;
|
|
26
|
+
interface IStorybookStory {
|
|
27
|
+
name: string;
|
|
28
|
+
render: (context: any) => any;
|
|
29
|
+
}
|
|
30
|
+
interface IStorybookSection {
|
|
31
|
+
kind: string;
|
|
32
|
+
stories: IStorybookStory[];
|
|
33
|
+
}
|
|
34
|
+
declare type HtmlFramework = {
|
|
35
|
+
component: HTMLElement;
|
|
36
|
+
storyResult: StoryFnHtmlReturnType;
|
|
37
|
+
};
|
|
38
|
+
declare type StoryContext = StoryContext$1<HtmlFramework> & {
|
|
39
|
+
parameters: StoryContext$1<HtmlFramework>['parameters'] & typeof parameters;
|
|
40
|
+
};
|
|
41
|
+
|
|
42
|
+
export { HtmlFramework as H, IStorybookSection as I, decorators as d, parameters as p, renderToDOM as r };
|
package/package.json
CHANGED
|
@@ -1,71 +1,68 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@storybook/html",
|
|
3
|
-
"version": "
|
|
4
|
-
"description": "Storybook
|
|
3
|
+
"version": "7.0.0-alpha.10",
|
|
4
|
+
"description": "Storybook HTML renderer",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"storybook"
|
|
7
7
|
],
|
|
8
|
-
"homepage": "https://github.com/storybookjs/storybook/tree/main/
|
|
8
|
+
"homepage": "https://github.com/storybookjs/storybook/tree/main/renderers/html",
|
|
9
9
|
"bugs": {
|
|
10
10
|
"url": "https://github.com/storybookjs/storybook/issues"
|
|
11
11
|
},
|
|
12
12
|
"repository": {
|
|
13
13
|
"type": "git",
|
|
14
14
|
"url": "https://github.com/storybookjs/storybook.git",
|
|
15
|
-
"directory": "
|
|
15
|
+
"directory": "renderers/html"
|
|
16
16
|
},
|
|
17
17
|
"funding": {
|
|
18
18
|
"type": "opencollective",
|
|
19
19
|
"url": "https://opencollective.com/storybook"
|
|
20
20
|
},
|
|
21
21
|
"license": "MIT",
|
|
22
|
-
"
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
22
|
+
"exports": {
|
|
23
|
+
".": {
|
|
24
|
+
"require": "./dist/index.js",
|
|
25
|
+
"import": "./dist/index.mjs",
|
|
26
|
+
"types": "./dist/index.d.ts"
|
|
27
|
+
},
|
|
28
|
+
"./preview": {
|
|
29
|
+
"require": "./dist/config.js",
|
|
30
|
+
"import": "./dist/config.mjs",
|
|
31
|
+
"types": "./dist/config.d.ts"
|
|
32
|
+
},
|
|
33
|
+
"./package.json": {
|
|
34
|
+
"require": "./package.json",
|
|
35
|
+
"import": "./package.json",
|
|
36
|
+
"types": "./package.json"
|
|
30
37
|
}
|
|
31
38
|
},
|
|
32
|
-
"
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
"storybook-server": "./bin/index.js"
|
|
36
|
-
},
|
|
39
|
+
"main": "dist/index.js",
|
|
40
|
+
"module": "dist/index.mjs",
|
|
41
|
+
"types": "dist/index.d.ts",
|
|
37
42
|
"files": [
|
|
38
|
-
"bin/**/*",
|
|
39
43
|
"dist/**/*",
|
|
40
44
|
"README.md",
|
|
41
45
|
"*.js",
|
|
42
46
|
"*.d.ts"
|
|
43
47
|
],
|
|
44
48
|
"scripts": {
|
|
45
|
-
"prepare": "
|
|
49
|
+
"prepare": "esrun ../../scripts/prepare/bundle.ts"
|
|
46
50
|
},
|
|
47
51
|
"dependencies": {
|
|
48
|
-
"@storybook/addons": "
|
|
49
|
-
"@storybook/core": "
|
|
50
|
-
"@storybook/core-common": "6.5.9",
|
|
52
|
+
"@storybook/addons": "7.0.0-alpha.10",
|
|
53
|
+
"@storybook/core-client": "7.0.0-alpha.10",
|
|
51
54
|
"@storybook/csf": "0.0.2--canary.4566f4d.1",
|
|
52
|
-
"@storybook/docs-tools": "
|
|
53
|
-
"@storybook/preview-web": "
|
|
54
|
-
"@storybook/store": "
|
|
55
|
-
"@types/node": "^14.14.20 || ^16.0.0",
|
|
56
|
-
"@types/webpack-env": "^1.16.0",
|
|
55
|
+
"@storybook/docs-tools": "7.0.0-alpha.10",
|
|
56
|
+
"@storybook/preview-web": "7.0.0-alpha.10",
|
|
57
|
+
"@storybook/store": "7.0.0-alpha.10",
|
|
57
58
|
"core-js": "^3.8.2",
|
|
58
59
|
"global": "^4.4.0",
|
|
59
|
-
"html-loader": "^1.3.2",
|
|
60
60
|
"react": "16.14.0",
|
|
61
61
|
"react-dom": "16.14.0",
|
|
62
|
-
"
|
|
63
|
-
"regenerator-runtime": "^0.13.7",
|
|
64
|
-
"ts-dedent": "^2.0.0",
|
|
65
|
-
"webpack": ">=4.0.0 <6.0.0"
|
|
62
|
+
"ts-dedent": "^2.0.0"
|
|
66
63
|
},
|
|
67
64
|
"devDependencies": {
|
|
68
|
-
"
|
|
65
|
+
"@digitak/esrun": "^3.2.2"
|
|
69
66
|
},
|
|
70
67
|
"peerDependencies": {
|
|
71
68
|
"@babel/core": "*"
|
|
@@ -76,6 +73,9 @@
|
|
|
76
73
|
"publishConfig": {
|
|
77
74
|
"access": "public"
|
|
78
75
|
},
|
|
79
|
-
"
|
|
80
|
-
|
|
76
|
+
"bundlerEntrypoint": [
|
|
77
|
+
"./src/index.ts",
|
|
78
|
+
"./src/config.ts"
|
|
79
|
+
],
|
|
80
|
+
"gitHead": "b13dd8fb52819d73d4983148af8ffc5d683e8b75"
|
|
81
81
|
}
|
package/preview.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './dist/config';
|
package/bin/build.js
DELETED
package/bin/index.js
DELETED
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.parameters = exports.decorators = void 0;
|
|
7
|
-
|
|
8
|
-
var _docsTools = require("@storybook/docs-tools");
|
|
9
|
-
|
|
10
|
-
var _sourceDecorator = require("./sourceDecorator");
|
|
11
|
-
|
|
12
|
-
var _prepareForInline = require("./prepareForInline");
|
|
13
|
-
|
|
14
|
-
var decorators = [_sourceDecorator.sourceDecorator];
|
|
15
|
-
exports.decorators = decorators;
|
|
16
|
-
var parameters = {
|
|
17
|
-
docs: {
|
|
18
|
-
inlineStories: true,
|
|
19
|
-
prepareForInline: _prepareForInline.prepareForInline,
|
|
20
|
-
source: {
|
|
21
|
-
type: _docsTools.SourceType.DYNAMIC,
|
|
22
|
-
language: 'html'
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
};
|
|
26
|
-
exports.parameters = parameters;
|
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.prepareForInline = prepareForInline;
|
|
7
|
-
|
|
8
|
-
var _react = _interopRequireDefault(require("react"));
|
|
9
|
-
|
|
10
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
|
-
|
|
12
|
-
function prepareForInline(storyFn) {
|
|
13
|
-
var html = storyFn();
|
|
14
|
-
|
|
15
|
-
if (typeof html === 'string') {
|
|
16
|
-
// eslint-disable-next-line react/no-danger
|
|
17
|
-
return /*#__PURE__*/_react.default.createElement("div", {
|
|
18
|
-
dangerouslySetInnerHTML: {
|
|
19
|
-
__html: html
|
|
20
|
-
}
|
|
21
|
-
});
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
return /*#__PURE__*/_react.default.createElement("div", {
|
|
25
|
-
ref: function ref(node) {
|
|
26
|
-
return node ? node.appendChild(html) : null;
|
|
27
|
-
}
|
|
28
|
-
});
|
|
29
|
-
}
|
|
@@ -1,67 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.sourceDecorator = sourceDecorator;
|
|
7
|
-
|
|
8
|
-
var _docsTools = require("@storybook/docs-tools");
|
|
9
|
-
|
|
10
|
-
var _addons = require("@storybook/addons");
|
|
11
|
-
|
|
12
|
-
var _tsDedent = _interopRequireDefault(require("ts-dedent"));
|
|
13
|
-
|
|
14
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
|
-
|
|
16
|
-
/* global window */
|
|
17
|
-
function skipSourceRender(context) {
|
|
18
|
-
var _context$parameters$d;
|
|
19
|
-
|
|
20
|
-
var sourceParams = context === null || context === void 0 ? void 0 : (_context$parameters$d = context.parameters.docs) === null || _context$parameters$d === void 0 ? void 0 : _context$parameters$d.source;
|
|
21
|
-
var isArgsStory = context === null || context === void 0 ? void 0 : context.parameters.__isArgsStory; // always render if the user forces it
|
|
22
|
-
|
|
23
|
-
if ((sourceParams === null || sourceParams === void 0 ? void 0 : sourceParams.type) === _docsTools.SourceType.DYNAMIC) {
|
|
24
|
-
return false;
|
|
25
|
-
} // never render if the user is forcing the block to render code, or
|
|
26
|
-
// if the user provides code, or if it's not an args story.
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
return !isArgsStory || (sourceParams === null || sourceParams === void 0 ? void 0 : sourceParams.code) || (sourceParams === null || sourceParams === void 0 ? void 0 : sourceParams.type) === _docsTools.SourceType.CODE;
|
|
30
|
-
} // By default, just remove indentation
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
function defaultTransformSource(source) {
|
|
34
|
-
// Have to wrap dedent so it doesn't serialize the context
|
|
35
|
-
return (0, _tsDedent.default)(source);
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
function applyTransformSource(source, context) {
|
|
39
|
-
var _context$parameters$d2, _docs$transformSource;
|
|
40
|
-
|
|
41
|
-
var docs = (_context$parameters$d2 = context.parameters.docs) !== null && _context$parameters$d2 !== void 0 ? _context$parameters$d2 : {};
|
|
42
|
-
var transformSource = (_docs$transformSource = docs.transformSource) !== null && _docs$transformSource !== void 0 ? _docs$transformSource : defaultTransformSource;
|
|
43
|
-
return transformSource(source, context);
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
function sourceDecorator(storyFn, context) {
|
|
47
|
-
var _context$parameters$d3, _context$parameters$d4;
|
|
48
|
-
|
|
49
|
-
var story = context !== null && context !== void 0 && (_context$parameters$d3 = context.parameters.docs) !== null && _context$parameters$d3 !== void 0 && (_context$parameters$d4 = _context$parameters$d3.source) !== null && _context$parameters$d4 !== void 0 && _context$parameters$d4.excludeDecorators ? context.originalStoryFn(context.args, context) : storyFn();
|
|
50
|
-
var source;
|
|
51
|
-
|
|
52
|
-
if (!skipSourceRender(context)) {
|
|
53
|
-
if (typeof story === 'string') {
|
|
54
|
-
source = story;
|
|
55
|
-
} // eslint-disable-next-line no-undef
|
|
56
|
-
else if (story instanceof Element) {
|
|
57
|
-
source = story.outerHTML;
|
|
58
|
-
}
|
|
59
|
-
|
|
60
|
-
if (source) source = applyTransformSource(source, context);
|
|
61
|
-
}
|
|
62
|
-
|
|
63
|
-
(0, _addons.useEffect)(function () {
|
|
64
|
-
if (source) _addons.addons.getChannel().emit(_docsTools.SNIPPET_RENDERED, context.id, source);
|
|
65
|
-
});
|
|
66
|
-
return story;
|
|
67
|
-
}
|
package/dist/cjs/client/index.js
DELETED
|
@@ -1,89 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
require("core-js/modules/es.object.to-string.js");
|
|
4
|
-
|
|
5
|
-
require("core-js/modules/web.dom-collections.for-each.js");
|
|
6
|
-
|
|
7
|
-
require("core-js/modules/es.object.keys.js");
|
|
8
|
-
|
|
9
|
-
Object.defineProperty(exports, "__esModule", {
|
|
10
|
-
value: true
|
|
11
|
-
});
|
|
12
|
-
var _exportNames = {
|
|
13
|
-
storiesOf: true,
|
|
14
|
-
setAddon: true,
|
|
15
|
-
addDecorator: true,
|
|
16
|
-
addParameters: true,
|
|
17
|
-
configure: true,
|
|
18
|
-
getStorybook: true,
|
|
19
|
-
forceReRender: true,
|
|
20
|
-
raw: true
|
|
21
|
-
};
|
|
22
|
-
Object.defineProperty(exports, "addDecorator", {
|
|
23
|
-
enumerable: true,
|
|
24
|
-
get: function get() {
|
|
25
|
-
return _preview.addDecorator;
|
|
26
|
-
}
|
|
27
|
-
});
|
|
28
|
-
Object.defineProperty(exports, "addParameters", {
|
|
29
|
-
enumerable: true,
|
|
30
|
-
get: function get() {
|
|
31
|
-
return _preview.addParameters;
|
|
32
|
-
}
|
|
33
|
-
});
|
|
34
|
-
Object.defineProperty(exports, "configure", {
|
|
35
|
-
enumerable: true,
|
|
36
|
-
get: function get() {
|
|
37
|
-
return _preview.configure;
|
|
38
|
-
}
|
|
39
|
-
});
|
|
40
|
-
Object.defineProperty(exports, "forceReRender", {
|
|
41
|
-
enumerable: true,
|
|
42
|
-
get: function get() {
|
|
43
|
-
return _preview.forceReRender;
|
|
44
|
-
}
|
|
45
|
-
});
|
|
46
|
-
Object.defineProperty(exports, "getStorybook", {
|
|
47
|
-
enumerable: true,
|
|
48
|
-
get: function get() {
|
|
49
|
-
return _preview.getStorybook;
|
|
50
|
-
}
|
|
51
|
-
});
|
|
52
|
-
Object.defineProperty(exports, "raw", {
|
|
53
|
-
enumerable: true,
|
|
54
|
-
get: function get() {
|
|
55
|
-
return _preview.raw;
|
|
56
|
-
}
|
|
57
|
-
});
|
|
58
|
-
Object.defineProperty(exports, "setAddon", {
|
|
59
|
-
enumerable: true,
|
|
60
|
-
get: function get() {
|
|
61
|
-
return _preview.setAddon;
|
|
62
|
-
}
|
|
63
|
-
});
|
|
64
|
-
Object.defineProperty(exports, "storiesOf", {
|
|
65
|
-
enumerable: true,
|
|
66
|
-
get: function get() {
|
|
67
|
-
return _preview.storiesOf;
|
|
68
|
-
}
|
|
69
|
-
});
|
|
70
|
-
|
|
71
|
-
var _preview = require("./preview");
|
|
72
|
-
|
|
73
|
-
var _types = require("./preview/types-6-0");
|
|
74
|
-
|
|
75
|
-
Object.keys(_types).forEach(function (key) {
|
|
76
|
-
if (key === "default" || key === "__esModule") return;
|
|
77
|
-
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
78
|
-
if (key in exports && exports[key] === _types[key]) return;
|
|
79
|
-
Object.defineProperty(exports, key, {
|
|
80
|
-
enumerable: true,
|
|
81
|
-
get: function get() {
|
|
82
|
-
return _types[key];
|
|
83
|
-
}
|
|
84
|
-
});
|
|
85
|
-
});
|
|
86
|
-
|
|
87
|
-
if (module && module.hot && module.hot.decline) {
|
|
88
|
-
module.hot.decline();
|
|
89
|
-
}
|
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.parameters = void 0;
|
|
7
|
-
Object.defineProperty(exports, "renderToDOM", {
|
|
8
|
-
enumerable: true,
|
|
9
|
-
get: function get() {
|
|
10
|
-
return _render.renderToDOM;
|
|
11
|
-
}
|
|
12
|
-
});
|
|
13
|
-
|
|
14
|
-
var _render = require("./render");
|
|
15
|
-
|
|
16
|
-
var parameters = {
|
|
17
|
-
framework: 'html'
|
|
18
|
-
};
|
|
19
|
-
exports.parameters = parameters;
|
|
@@ -1,50 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.storiesOf = exports.setAddon = exports.raw = exports.getStorybook = exports.forceReRender = exports.configure = exports.clearDecorators = exports.addParameters = exports.addDecorator = void 0;
|
|
7
|
-
|
|
8
|
-
require("core-js/modules/es.array.concat.js");
|
|
9
|
-
|
|
10
|
-
var _core = require("@storybook/core");
|
|
11
|
-
|
|
12
|
-
require("./globals");
|
|
13
|
-
|
|
14
|
-
var _render = require("./render");
|
|
15
|
-
|
|
16
|
-
/* eslint-disable prefer-destructuring */
|
|
17
|
-
var framework = 'html';
|
|
18
|
-
var api = (0, _core.start)(_render.renderToDOM);
|
|
19
|
-
|
|
20
|
-
var storiesOf = function storiesOf(kind, m) {
|
|
21
|
-
return api.clientApi.storiesOf(kind, m).addParameters({
|
|
22
|
-
framework: framework
|
|
23
|
-
});
|
|
24
|
-
};
|
|
25
|
-
|
|
26
|
-
exports.storiesOf = storiesOf;
|
|
27
|
-
|
|
28
|
-
var configure = function configure() {
|
|
29
|
-
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
30
|
-
args[_key] = arguments[_key];
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
return api.configure.apply(api, [framework].concat(args));
|
|
34
|
-
};
|
|
35
|
-
|
|
36
|
-
exports.configure = configure;
|
|
37
|
-
var addDecorator = api.clientApi.addDecorator;
|
|
38
|
-
exports.addDecorator = addDecorator;
|
|
39
|
-
var addParameters = api.clientApi.addParameters;
|
|
40
|
-
exports.addParameters = addParameters;
|
|
41
|
-
var clearDecorators = api.clientApi.clearDecorators;
|
|
42
|
-
exports.clearDecorators = clearDecorators;
|
|
43
|
-
var setAddon = api.clientApi.setAddon;
|
|
44
|
-
exports.setAddon = setAddon;
|
|
45
|
-
var forceReRender = api.forceReRender;
|
|
46
|
-
exports.forceReRender = forceReRender;
|
|
47
|
-
var getStorybook = api.clientApi.getStorybook;
|
|
48
|
-
exports.getStorybook = getStorybook;
|
|
49
|
-
var raw = api.clientApi.raw;
|
|
50
|
-
exports.raw = raw;
|
|
@@ -1,57 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
require("core-js/modules/es.array.slice.js");
|
|
4
|
-
|
|
5
|
-
require("core-js/modules/es.object.freeze.js");
|
|
6
|
-
|
|
7
|
-
Object.defineProperty(exports, "__esModule", {
|
|
8
|
-
value: true
|
|
9
|
-
});
|
|
10
|
-
exports.renderToDOM = renderToDOM;
|
|
11
|
-
|
|
12
|
-
require("core-js/modules/es.function.name.js");
|
|
13
|
-
|
|
14
|
-
require("core-js/modules/es.array.concat.js");
|
|
15
|
-
|
|
16
|
-
var _global = _interopRequireDefault(require("global"));
|
|
17
|
-
|
|
18
|
-
var _tsDedent = _interopRequireDefault(require("ts-dedent"));
|
|
19
|
-
|
|
20
|
-
var _previewWeb = require("@storybook/preview-web");
|
|
21
|
-
|
|
22
|
-
var _templateObject;
|
|
23
|
-
|
|
24
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
25
|
-
|
|
26
|
-
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
27
|
-
|
|
28
|
-
var Node = _global.default.Node;
|
|
29
|
-
|
|
30
|
-
function renderToDOM(_ref, domElement) {
|
|
31
|
-
var storyFn = _ref.storyFn,
|
|
32
|
-
kind = _ref.kind,
|
|
33
|
-
name = _ref.name,
|
|
34
|
-
showMain = _ref.showMain,
|
|
35
|
-
showError = _ref.showError,
|
|
36
|
-
forceRemount = _ref.forceRemount;
|
|
37
|
-
var element = storyFn();
|
|
38
|
-
showMain();
|
|
39
|
-
|
|
40
|
-
if (typeof element === 'string') {
|
|
41
|
-
domElement.innerHTML = element;
|
|
42
|
-
(0, _previewWeb.simulatePageLoad)(domElement);
|
|
43
|
-
} else if (element instanceof Node) {
|
|
44
|
-
if (domElement.firstChild === element && forceRemount === false) {
|
|
45
|
-
return;
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
domElement.innerHTML = '';
|
|
49
|
-
domElement.appendChild(element);
|
|
50
|
-
(0, _previewWeb.simulateDOMContentLoaded)();
|
|
51
|
-
} else {
|
|
52
|
-
showError({
|
|
53
|
-
title: "Expecting an HTML snippet or DOM node from the story: \"".concat(name, "\" of \"").concat(kind, "\"."),
|
|
54
|
-
description: (0, _tsDedent.default)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n Did you forget to return the HTML snippet from the story?\n Use \"() => <your snippet or node>\" or when defining the story.\n "])))
|
|
55
|
-
});
|
|
56
|
-
}
|
|
57
|
-
}
|