@storybook/html 6.5.0-alpha.47 → 6.5.0-alpha.48

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 (30) hide show
  1. package/dist/cjs/client/docs/config.js +26 -0
  2. package/dist/cjs/client/docs/prepareForInline.js +29 -0
  3. package/dist/cjs/client/docs/sourceDecorator.js +67 -0
  4. package/dist/cjs/server/framework-preset-html-docs.js +17 -0
  5. package/dist/cjs/server/options.js +1 -1
  6. package/dist/cjs/server/preset.js +8 -0
  7. package/dist/esm/client/docs/config.js +14 -0
  8. package/dist/esm/client/docs/prepareForInline.js +19 -0
  9. package/dist/esm/client/docs/sourceDecorator.js +56 -0
  10. package/dist/esm/server/framework-preset-html-docs.js +6 -0
  11. package/dist/esm/server/options.js +1 -1
  12. package/dist/esm/server/preset.js +1 -0
  13. package/dist/modern/client/docs/config.js +14 -0
  14. package/dist/modern/client/docs/prepareForInline.js +17 -0
  15. package/dist/modern/client/docs/sourceDecorator.js +56 -0
  16. package/dist/modern/server/framework-preset-html-docs.js +6 -0
  17. package/dist/modern/server/options.js +1 -1
  18. package/dist/modern/server/preset.js +1 -0
  19. package/dist/ts3.4/client/docs/config.d.ts +14 -0
  20. package/dist/ts3.4/client/docs/prepareForInline.d.ts +2 -0
  21. package/dist/ts3.4/client/docs/sourceDecorator.d.ts +3 -0
  22. package/dist/ts3.4/server/framework-preset-html-docs.d.ts +2 -0
  23. package/dist/ts3.4/server/preset.d.ts +2 -0
  24. package/dist/ts3.9/client/docs/config.d.ts +14 -0
  25. package/dist/ts3.9/client/docs/prepareForInline.d.ts +2 -0
  26. package/dist/ts3.9/client/docs/sourceDecorator.d.ts +3 -0
  27. package/dist/ts3.9/server/framework-preset-html-docs.d.ts +2 -0
  28. package/dist/ts3.9/server/preset.d.ts +2 -0
  29. package/package.json +10 -9
  30. package/preset.js +1 -1
@@ -0,0 +1,26 @@
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;
@@ -0,0 +1,29 @@
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
+ }
@@ -0,0 +1,67 @@
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
+ }
@@ -0,0 +1,17 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.config = void 0;
7
+
8
+ var _coreCommon = require("@storybook/core-common");
9
+
10
+ var _docsTools = require("@storybook/docs-tools");
11
+
12
+ var config = function (entry = [], options) {
13
+ if (!(0, _docsTools.hasDocsOrControls)(options)) return entry;
14
+ return [...entry, (0, _coreCommon.findDistEsm)(__dirname, 'client/docs/config')];
15
+ };
16
+
17
+ exports.config = config;
@@ -12,6 +12,6 @@ var _default = {
12
12
  cwd: __dirname
13
13
  }).packageJson,
14
14
  framework: 'html',
15
- frameworkPresets: [require.resolve('./framework-preset-html')]
15
+ frameworkPresets: [require.resolve('./preset')]
16
16
  };
17
17
  exports.default = _default;
@@ -0,0 +1,8 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.addons = void 0;
7
+ var addons = [require.resolve('./framework-preset-html'), require.resolve('./framework-preset-html-docs')];
8
+ exports.addons = addons;
@@ -0,0 +1,14 @@
1
+ import { SourceType } from '@storybook/docs-tools';
2
+ import { sourceDecorator } from './sourceDecorator';
3
+ import { prepareForInline } from './prepareForInline';
4
+ export var decorators = [sourceDecorator];
5
+ export var parameters = {
6
+ docs: {
7
+ inlineStories: true,
8
+ prepareForInline: prepareForInline,
9
+ source: {
10
+ type: SourceType.DYNAMIC,
11
+ language: 'html'
12
+ }
13
+ }
14
+ };
@@ -0,0 +1,19 @@
1
+ import React from 'react';
2
+ export function prepareForInline(storyFn) {
3
+ var html = storyFn();
4
+
5
+ if (typeof html === 'string') {
6
+ // eslint-disable-next-line react/no-danger
7
+ return /*#__PURE__*/React.createElement("div", {
8
+ dangerouslySetInnerHTML: {
9
+ __html: html
10
+ }
11
+ });
12
+ }
13
+
14
+ return /*#__PURE__*/React.createElement("div", {
15
+ ref: function ref(node) {
16
+ return node ? node.appendChild(html) : null;
17
+ }
18
+ });
19
+ }
@@ -0,0 +1,56 @@
1
+ /* global window */
2
+ import { SNIPPET_RENDERED, SourceType } from '@storybook/docs-tools';
3
+ import { addons, useEffect } from '@storybook/addons';
4
+ import dedent from 'ts-dedent';
5
+
6
+ function skipSourceRender(context) {
7
+ var _context$parameters$d;
8
+
9
+ 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;
10
+ var isArgsStory = context === null || context === void 0 ? void 0 : context.parameters.__isArgsStory; // always render if the user forces it
11
+
12
+ if ((sourceParams === null || sourceParams === void 0 ? void 0 : sourceParams.type) === SourceType.DYNAMIC) {
13
+ return false;
14
+ } // never render if the user is forcing the block to render code, or
15
+ // if the user provides code, or if it's not an args story.
16
+
17
+
18
+ return !isArgsStory || (sourceParams === null || sourceParams === void 0 ? void 0 : sourceParams.code) || (sourceParams === null || sourceParams === void 0 ? void 0 : sourceParams.type) === SourceType.CODE;
19
+ } // By default, just remove indentation
20
+
21
+
22
+ function defaultTransformSource(source) {
23
+ // Have to wrap dedent so it doesn't serialize the context
24
+ return dedent(source);
25
+ }
26
+
27
+ function applyTransformSource(source, context) {
28
+ var _context$parameters$d2, _docs$transformSource;
29
+
30
+ var docs = (_context$parameters$d2 = context.parameters.docs) !== null && _context$parameters$d2 !== void 0 ? _context$parameters$d2 : {};
31
+ var transformSource = (_docs$transformSource = docs.transformSource) !== null && _docs$transformSource !== void 0 ? _docs$transformSource : defaultTransformSource;
32
+ return transformSource(source, context);
33
+ }
34
+
35
+ export function sourceDecorator(storyFn, context) {
36
+ var _context$parameters$d3, _context$parameters$d4;
37
+
38
+ 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();
39
+ var source;
40
+
41
+ if (!skipSourceRender(context)) {
42
+ if (typeof story === 'string') {
43
+ source = story;
44
+ } // eslint-disable-next-line no-undef
45
+ else if (story instanceof Element) {
46
+ source = story.outerHTML;
47
+ }
48
+
49
+ if (source) source = applyTransformSource(source, context);
50
+ }
51
+
52
+ useEffect(function () {
53
+ if (source) addons.getChannel().emit(SNIPPET_RENDERED, context.id, source);
54
+ });
55
+ return story;
56
+ }
@@ -0,0 +1,6 @@
1
+ import { findDistEsm } from '@storybook/core-common';
2
+ import { hasDocsOrControls } from '@storybook/docs-tools';
3
+ export var config = function (entry = [], options) {
4
+ if (!hasDocsOrControls(options)) return entry;
5
+ return [...entry, findDistEsm(__dirname, 'client/docs/config')];
6
+ };
@@ -4,5 +4,5 @@ export default {
4
4
  cwd: __dirname
5
5
  }).packageJson,
6
6
  framework: 'html',
7
- frameworkPresets: [require.resolve('./framework-preset-html')]
7
+ frameworkPresets: [require.resolve('./preset')]
8
8
  };
@@ -0,0 +1 @@
1
+ export var addons = [require.resolve('./framework-preset-html'), require.resolve('./framework-preset-html-docs')];
@@ -0,0 +1,14 @@
1
+ import { SourceType } from '@storybook/docs-tools';
2
+ import { sourceDecorator } from './sourceDecorator';
3
+ import { prepareForInline } from './prepareForInline';
4
+ export const decorators = [sourceDecorator];
5
+ export const parameters = {
6
+ docs: {
7
+ inlineStories: true,
8
+ prepareForInline,
9
+ source: {
10
+ type: SourceType.DYNAMIC,
11
+ language: 'html'
12
+ }
13
+ }
14
+ };
@@ -0,0 +1,17 @@
1
+ import React from 'react';
2
+ export function prepareForInline(storyFn) {
3
+ const html = storyFn();
4
+
5
+ if (typeof html === 'string') {
6
+ // eslint-disable-next-line react/no-danger
7
+ return /*#__PURE__*/React.createElement("div", {
8
+ dangerouslySetInnerHTML: {
9
+ __html: html
10
+ }
11
+ });
12
+ }
13
+
14
+ return /*#__PURE__*/React.createElement("div", {
15
+ ref: node => node ? node.appendChild(html) : null
16
+ });
17
+ }
@@ -0,0 +1,56 @@
1
+ /* global window */
2
+ import { SNIPPET_RENDERED, SourceType } from '@storybook/docs-tools';
3
+ import { addons, useEffect } from '@storybook/addons';
4
+ import dedent from 'ts-dedent';
5
+
6
+ function skipSourceRender(context) {
7
+ var _context$parameters$d;
8
+
9
+ const 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;
10
+ const isArgsStory = context === null || context === void 0 ? void 0 : context.parameters.__isArgsStory; // always render if the user forces it
11
+
12
+ if ((sourceParams === null || sourceParams === void 0 ? void 0 : sourceParams.type) === SourceType.DYNAMIC) {
13
+ return false;
14
+ } // never render if the user is forcing the block to render code, or
15
+ // if the user provides code, or if it's not an args story.
16
+
17
+
18
+ return !isArgsStory || (sourceParams === null || sourceParams === void 0 ? void 0 : sourceParams.code) || (sourceParams === null || sourceParams === void 0 ? void 0 : sourceParams.type) === SourceType.CODE;
19
+ } // By default, just remove indentation
20
+
21
+
22
+ function defaultTransformSource(source) {
23
+ // Have to wrap dedent so it doesn't serialize the context
24
+ return dedent(source);
25
+ }
26
+
27
+ function applyTransformSource(source, context) {
28
+ var _context$parameters$d2, _docs$transformSource;
29
+
30
+ const docs = (_context$parameters$d2 = context.parameters.docs) !== null && _context$parameters$d2 !== void 0 ? _context$parameters$d2 : {};
31
+ const transformSource = (_docs$transformSource = docs.transformSource) !== null && _docs$transformSource !== void 0 ? _docs$transformSource : defaultTransformSource;
32
+ return transformSource(source, context);
33
+ }
34
+
35
+ export function sourceDecorator(storyFn, context) {
36
+ var _context$parameters$d3, _context$parameters$d4;
37
+
38
+ const 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();
39
+ let source;
40
+
41
+ if (!skipSourceRender(context)) {
42
+ if (typeof story === 'string') {
43
+ source = story;
44
+ } // eslint-disable-next-line no-undef
45
+ else if (story instanceof Element) {
46
+ source = story.outerHTML;
47
+ }
48
+
49
+ if (source) source = applyTransformSource(source, context);
50
+ }
51
+
52
+ useEffect(() => {
53
+ if (source) addons.getChannel().emit(SNIPPET_RENDERED, context.id, source);
54
+ });
55
+ return story;
56
+ }
@@ -0,0 +1,6 @@
1
+ import { findDistEsm } from '@storybook/core-common';
2
+ import { hasDocsOrControls } from '@storybook/docs-tools';
3
+ export var config = function (entry = [], options) {
4
+ if (!hasDocsOrControls(options)) return entry;
5
+ return [...entry, findDistEsm(__dirname, 'client/docs/config')];
6
+ };
@@ -4,5 +4,5 @@ export default {
4
4
  cwd: __dirname
5
5
  }).packageJson,
6
6
  framework: 'html',
7
- frameworkPresets: [require.resolve('./framework-preset-html')]
7
+ frameworkPresets: [require.resolve('./preset')]
8
8
  };
@@ -0,0 +1 @@
1
+ export var addons = [require.resolve('./framework-preset-html'), require.resolve('./framework-preset-html-docs')];
@@ -0,0 +1,14 @@
1
+ import { SourceType } from '@storybook/docs-tools';
2
+ import { sourceDecorator } from './sourceDecorator';
3
+ import { prepareForInline } from './prepareForInline';
4
+ export declare const decorators: (typeof sourceDecorator)[];
5
+ export declare const parameters: {
6
+ docs: {
7
+ inlineStories: boolean;
8
+ prepareForInline: typeof prepareForInline;
9
+ source: {
10
+ type: SourceType;
11
+ language: string;
12
+ };
13
+ };
14
+ };
@@ -0,0 +1,2 @@
1
+ import { PartialStoryFn } from '@storybook/csf';
2
+ export declare function prepareForInline(storyFn: PartialStoryFn<any>): JSX.Element;
@@ -0,0 +1,3 @@
1
+ import { PartialStoryFn, StoryContext } from '@storybook/csf';
2
+ import { HtmlFramework } from '..';
3
+ export declare function sourceDecorator(storyFn: PartialStoryFn<HtmlFramework>, context: StoryContext<HtmlFramework>): string | Node;
@@ -0,0 +1,2 @@
1
+ import { StorybookConfig } from '@storybook/core-common';
2
+ export declare const config: StorybookConfig['config'];
@@ -0,0 +1,2 @@
1
+ import { StorybookConfig } from '@storybook/core-common';
2
+ export declare const addons: StorybookConfig['addons'];
@@ -0,0 +1,14 @@
1
+ import { SourceType } from '@storybook/docs-tools';
2
+ import { sourceDecorator } from './sourceDecorator';
3
+ import { prepareForInline } from './prepareForInline';
4
+ export declare const decorators: (typeof sourceDecorator)[];
5
+ export declare const parameters: {
6
+ docs: {
7
+ inlineStories: boolean;
8
+ prepareForInline: typeof prepareForInline;
9
+ source: {
10
+ type: SourceType;
11
+ language: string;
12
+ };
13
+ };
14
+ };
@@ -0,0 +1,2 @@
1
+ import { PartialStoryFn } from '@storybook/csf';
2
+ export declare function prepareForInline(storyFn: PartialStoryFn<any>): JSX.Element;
@@ -0,0 +1,3 @@
1
+ import type { PartialStoryFn, StoryContext } from '@storybook/csf';
2
+ import type { HtmlFramework } from '..';
3
+ export declare function sourceDecorator(storyFn: PartialStoryFn<HtmlFramework>, context: StoryContext<HtmlFramework>): string | Node;
@@ -0,0 +1,2 @@
1
+ import type { StorybookConfig } from '@storybook/core-common';
2
+ export declare const config: StorybookConfig['config'];
@@ -0,0 +1,2 @@
1
+ import type { StorybookConfig } from '@storybook/core-common';
2
+ export declare const addons: StorybookConfig['addons'];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@storybook/html",
3
- "version": "6.5.0-alpha.47",
3
+ "version": "6.5.0-alpha.48",
4
4
  "description": "Storybook for HTML: View HTML snippets in isolation with Hot Reloading.",
5
5
  "keywords": [
6
6
  "storybook"
@@ -45,13 +45,13 @@
45
45
  "prepare": "node ../../scripts/prepare.js"
46
46
  },
47
47
  "dependencies": {
48
- "@storybook/addons": "6.5.0-alpha.47",
49
- "@storybook/client-api": "6.5.0-alpha.47",
50
- "@storybook/core": "6.5.0-alpha.47",
51
- "@storybook/core-common": "6.5.0-alpha.47",
48
+ "@storybook/addons": "6.5.0-alpha.48",
49
+ "@storybook/core": "6.5.0-alpha.48",
50
+ "@storybook/core-common": "6.5.0-alpha.48",
52
51
  "@storybook/csf": "0.0.2--canary.87bc651.0",
53
- "@storybook/preview-web": "6.5.0-alpha.47",
54
- "@storybook/store": "6.5.0-alpha.47",
52
+ "@storybook/docs-tools": "6.5.0-alpha.48",
53
+ "@storybook/preview-web": "6.5.0-alpha.48",
54
+ "@storybook/store": "6.5.0-alpha.48",
55
55
  "@types/node": "^14.14.20 || ^16.0.0",
56
56
  "@types/webpack-env": "^1.16.0",
57
57
  "core-js": "^3.8.2",
@@ -61,7 +61,8 @@
61
61
  "react-dom": "16.14.0",
62
62
  "read-pkg-up": "^7.0.1",
63
63
  "regenerator-runtime": "^0.13.7",
64
- "ts-dedent": "^2.0.0"
64
+ "ts-dedent": "^2.0.0",
65
+ "webpack": "4"
65
66
  },
66
67
  "peerDependencies": {
67
68
  "@babel/core": "*"
@@ -72,6 +73,6 @@
72
73
  "publishConfig": {
73
74
  "access": "public"
74
75
  },
75
- "gitHead": "e848de5c5d389fcb452d85f7ebdfc27f1e3c10c4",
76
+ "gitHead": "5f3afb8cf4389c16be11a6e5099e902d16a82762",
76
77
  "sbmodern": "dist/modern/client/index.js"
77
78
  }
package/preset.js CHANGED
@@ -1 +1 @@
1
- module.exports = require('./dist/cjs/server/framework-preset-html');
1
+ module.exports = require('./dist/cjs/server/preset');