@storybook/html 6.4.0-beta.24 → 6.4.0-beta.28
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/dist/cjs/client/index.js +87 -0
- package/dist/cjs/client/preview/config.js +19 -0
- package/dist/cjs/client/preview/globals.js +8 -0
- package/dist/cjs/client/preview/index.js +50 -0
- package/dist/cjs/client/preview/render.js +57 -0
- package/dist/cjs/client/preview/types-6-0.js +1 -0
- package/dist/cjs/client/preview/types-7-0.js +1 -0
- package/dist/cjs/client/preview/types.js +1 -0
- package/dist/cjs/server/build.js +9 -0
- package/dist/cjs/server/framework-preset-html.js +24 -0
- package/dist/cjs/server/index.js +9 -0
- package/dist/cjs/server/options.js +17 -0
- package/dist/cjs/typings.d.js +1 -0
- package/dist/esm/client/index.js +6 -0
- package/dist/esm/client/preview/config.js +4 -0
- package/dist/esm/client/preview/globals.js +3 -0
- package/dist/esm/client/preview/index.js +27 -0
- package/dist/esm/client/preview/render.js +42 -0
- package/dist/esm/client/preview/types-6-0.js +0 -0
- package/dist/esm/client/preview/types-7-0.js +0 -0
- package/dist/esm/client/preview/types.js +0 -0
- package/dist/esm/server/build.js +3 -0
- package/dist/esm/server/framework-preset-html.js +12 -0
- package/dist/esm/server/index.js +3 -0
- package/dist/esm/server/options.js +8 -0
- package/dist/esm/typings.d.js +0 -0
- package/dist/modern/client/index.js +6 -0
- package/dist/modern/client/preview/config.js +4 -0
- package/dist/modern/client/preview/globals.js +5 -0
- package/dist/modern/client/preview/index.js +19 -0
- package/dist/modern/client/preview/render.js +39 -0
- package/dist/modern/client/preview/types-6-0.js +0 -0
- package/dist/modern/client/preview/types-7-0.js +0 -0
- package/dist/modern/client/preview/types.js +0 -0
- package/dist/modern/server/build.js +3 -0
- package/dist/modern/server/framework-preset-html.js +12 -0
- package/dist/modern/server/index.js +3 -0
- package/dist/modern/server/options.js +8 -0
- package/dist/modern/typings.d.js +0 -0
- package/dist/ts3.4/client/index.d.ts +2 -0
- package/dist/ts3.4/client/preview/config.d.ts +4 -0
- package/dist/ts3.4/client/preview/globals.d.ts +1 -0
- package/dist/ts3.4/client/preview/index.d.ts +24 -0
- package/dist/ts3.4/client/preview/render.d.ts +3 -0
- package/dist/ts3.4/client/preview/types-6-0.d.ts +34 -0
- package/dist/ts3.4/client/preview/types-7-0.d.ts +9 -0
- package/dist/ts3.4/client/preview/types.d.ts +14 -0
- package/dist/ts3.4/server/build.d.ts +1 -0
- package/dist/ts3.4/server/framework-preset-html.d.ts +4 -0
- package/dist/ts3.4/server/index.d.ts +1 -0
- package/dist/ts3.4/server/options.d.ts +3 -0
- package/dist/ts3.9/client/index.d.ts +2 -0
- package/dist/ts3.9/client/preview/config.d.ts +4 -0
- package/dist/ts3.9/client/preview/globals.d.ts +1 -0
- package/dist/ts3.9/client/preview/index.d.ts +24 -0
- package/dist/ts3.9/client/preview/render.d.ts +3 -0
- package/dist/ts3.9/client/preview/types-6-0.d.ts +34 -0
- package/dist/ts3.9/client/preview/types-7-0.d.ts +9 -0
- package/dist/ts3.9/client/preview/types.d.ts +14 -0
- package/dist/ts3.9/server/build.d.ts +1 -0
- package/dist/ts3.9/server/framework-preset-html.d.ts +4 -0
- package/dist/ts3.9/server/index.d.ts +1 -0
- package/dist/ts3.9/server/options.d.ts +3 -0
- package/package.json +8 -8
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
require("core-js/modules/web.dom-collections.for-each.js");
|
|
4
|
+
|
|
5
|
+
require("core-js/modules/es.object.keys.js");
|
|
6
|
+
|
|
7
|
+
Object.defineProperty(exports, "__esModule", {
|
|
8
|
+
value: true
|
|
9
|
+
});
|
|
10
|
+
var _exportNames = {
|
|
11
|
+
storiesOf: true,
|
|
12
|
+
setAddon: true,
|
|
13
|
+
addDecorator: true,
|
|
14
|
+
addParameters: true,
|
|
15
|
+
configure: true,
|
|
16
|
+
getStorybook: true,
|
|
17
|
+
forceReRender: true,
|
|
18
|
+
raw: true
|
|
19
|
+
};
|
|
20
|
+
Object.defineProperty(exports, "storiesOf", {
|
|
21
|
+
enumerable: true,
|
|
22
|
+
get: function get() {
|
|
23
|
+
return _preview.storiesOf;
|
|
24
|
+
}
|
|
25
|
+
});
|
|
26
|
+
Object.defineProperty(exports, "setAddon", {
|
|
27
|
+
enumerable: true,
|
|
28
|
+
get: function get() {
|
|
29
|
+
return _preview.setAddon;
|
|
30
|
+
}
|
|
31
|
+
});
|
|
32
|
+
Object.defineProperty(exports, "addDecorator", {
|
|
33
|
+
enumerable: true,
|
|
34
|
+
get: function get() {
|
|
35
|
+
return _preview.addDecorator;
|
|
36
|
+
}
|
|
37
|
+
});
|
|
38
|
+
Object.defineProperty(exports, "addParameters", {
|
|
39
|
+
enumerable: true,
|
|
40
|
+
get: function get() {
|
|
41
|
+
return _preview.addParameters;
|
|
42
|
+
}
|
|
43
|
+
});
|
|
44
|
+
Object.defineProperty(exports, "configure", {
|
|
45
|
+
enumerable: true,
|
|
46
|
+
get: function get() {
|
|
47
|
+
return _preview.configure;
|
|
48
|
+
}
|
|
49
|
+
});
|
|
50
|
+
Object.defineProperty(exports, "getStorybook", {
|
|
51
|
+
enumerable: true,
|
|
52
|
+
get: function get() {
|
|
53
|
+
return _preview.getStorybook;
|
|
54
|
+
}
|
|
55
|
+
});
|
|
56
|
+
Object.defineProperty(exports, "forceReRender", {
|
|
57
|
+
enumerable: true,
|
|
58
|
+
get: function get() {
|
|
59
|
+
return _preview.forceReRender;
|
|
60
|
+
}
|
|
61
|
+
});
|
|
62
|
+
Object.defineProperty(exports, "raw", {
|
|
63
|
+
enumerable: true,
|
|
64
|
+
get: function get() {
|
|
65
|
+
return _preview.raw;
|
|
66
|
+
}
|
|
67
|
+
});
|
|
68
|
+
|
|
69
|
+
var _preview = require("./preview");
|
|
70
|
+
|
|
71
|
+
var _types = require("./preview/types-6-0");
|
|
72
|
+
|
|
73
|
+
Object.keys(_types).forEach(function (key) {
|
|
74
|
+
if (key === "default" || key === "__esModule") return;
|
|
75
|
+
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
76
|
+
if (key in exports && exports[key] === _types[key]) return;
|
|
77
|
+
Object.defineProperty(exports, key, {
|
|
78
|
+
enumerable: true,
|
|
79
|
+
get: function get() {
|
|
80
|
+
return _types[key];
|
|
81
|
+
}
|
|
82
|
+
});
|
|
83
|
+
});
|
|
84
|
+
|
|
85
|
+
if (module && module.hot && module.hot.decline) {
|
|
86
|
+
module.hot.decline();
|
|
87
|
+
}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "renderToDOM", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function get() {
|
|
9
|
+
return _render.renderToDOM;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
exports.parameters = void 0;
|
|
13
|
+
|
|
14
|
+
var _render = require("./render");
|
|
15
|
+
|
|
16
|
+
var parameters = {
|
|
17
|
+
framework: 'html'
|
|
18
|
+
};
|
|
19
|
+
exports.parameters = parameters;
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.raw = exports.getStorybook = exports.forceReRender = exports.setAddon = exports.clearDecorators = exports.addParameters = exports.addDecorator = exports.configure = exports.storiesOf = void 0;
|
|
7
|
+
|
|
8
|
+
require("core-js/modules/es.array.concat.js");
|
|
9
|
+
|
|
10
|
+
var _client = require("@storybook/core/client");
|
|
11
|
+
|
|
12
|
+
require("./globals");
|
|
13
|
+
|
|
14
|
+
var _render = require("./render");
|
|
15
|
+
|
|
16
|
+
/* eslint-disable prefer-destructuring */
|
|
17
|
+
var framework = 'html';
|
|
18
|
+
var api = (0, _client.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;
|
|
@@ -0,0 +1,57 @@
|
|
|
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
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _server = require("@storybook/core/server");
|
|
4
|
+
|
|
5
|
+
var _options = _interopRequireDefault(require("./options"));
|
|
6
|
+
|
|
7
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
8
|
+
|
|
9
|
+
(0, _server.buildStatic)(_options.default);
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.webpack = webpack;
|
|
7
|
+
exports.config = void 0;
|
|
8
|
+
|
|
9
|
+
var _coreCommon = require("@storybook/core-common");
|
|
10
|
+
|
|
11
|
+
// eslint-disable-next-line import/no-extraneous-dependencies
|
|
12
|
+
function webpack(config) {
|
|
13
|
+
config.module.rules.push({
|
|
14
|
+
test: /\.html$/,
|
|
15
|
+
use: require.resolve('html-loader')
|
|
16
|
+
});
|
|
17
|
+
return config;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
var config = function (entry = []) {
|
|
21
|
+
return [...entry, (0, _coreCommon.findDistEsm)(__dirname, 'client/preview/config')];
|
|
22
|
+
};
|
|
23
|
+
|
|
24
|
+
exports.config = config;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _server = require("@storybook/core/server");
|
|
4
|
+
|
|
5
|
+
var _options = _interopRequireDefault(require("./options"));
|
|
6
|
+
|
|
7
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
8
|
+
|
|
9
|
+
(0, _server.buildDev)(_options.default);
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
|
|
8
|
+
var _readPkgUp = require("read-pkg-up");
|
|
9
|
+
|
|
10
|
+
var _default = {
|
|
11
|
+
packageJson: (0, _readPkgUp.sync)({
|
|
12
|
+
cwd: __dirname
|
|
13
|
+
}).packageJson,
|
|
14
|
+
framework: 'html',
|
|
15
|
+
frameworkPresets: [require.resolve('./framework-preset-html')]
|
|
16
|
+
};
|
|
17
|
+
exports.default = _default;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import "core-js/modules/es.array.concat.js";
|
|
2
|
+
|
|
3
|
+
/* eslint-disable prefer-destructuring */
|
|
4
|
+
import { start } from '@storybook/core/client';
|
|
5
|
+
import './globals';
|
|
6
|
+
import { renderToDOM } from './render';
|
|
7
|
+
var framework = 'html';
|
|
8
|
+
var api = start(renderToDOM);
|
|
9
|
+
export var storiesOf = function storiesOf(kind, m) {
|
|
10
|
+
return api.clientApi.storiesOf(kind, m).addParameters({
|
|
11
|
+
framework: framework
|
|
12
|
+
});
|
|
13
|
+
};
|
|
14
|
+
export var configure = function configure() {
|
|
15
|
+
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
16
|
+
args[_key] = arguments[_key];
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
return api.configure.apply(api, [framework].concat(args));
|
|
20
|
+
};
|
|
21
|
+
export var addDecorator = api.clientApi.addDecorator;
|
|
22
|
+
export var addParameters = api.clientApi.addParameters;
|
|
23
|
+
export var clearDecorators = api.clientApi.clearDecorators;
|
|
24
|
+
export var setAddon = api.clientApi.setAddon;
|
|
25
|
+
export var forceReRender = api.forceReRender;
|
|
26
|
+
export var getStorybook = api.clientApi.getStorybook;
|
|
27
|
+
export var raw = api.clientApi.raw;
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
var _templateObject;
|
|
2
|
+
|
|
3
|
+
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
|
|
4
|
+
|
|
5
|
+
import "core-js/modules/es.function.name.js";
|
|
6
|
+
import "core-js/modules/es.array.concat.js";
|
|
7
|
+
import "core-js/modules/es.array.slice.js";
|
|
8
|
+
import "core-js/modules/es.object.freeze.js";
|
|
9
|
+
|
|
10
|
+
/* eslint-disable no-param-reassign */
|
|
11
|
+
import global from 'global';
|
|
12
|
+
import dedent from 'ts-dedent';
|
|
13
|
+
import { simulatePageLoad, simulateDOMContentLoaded } from '@storybook/preview-web';
|
|
14
|
+
var Node = global.Node;
|
|
15
|
+
export function renderToDOM(_ref, domElement) {
|
|
16
|
+
var storyFn = _ref.storyFn,
|
|
17
|
+
kind = _ref.kind,
|
|
18
|
+
name = _ref.name,
|
|
19
|
+
showMain = _ref.showMain,
|
|
20
|
+
showError = _ref.showError,
|
|
21
|
+
forceRemount = _ref.forceRemount;
|
|
22
|
+
var element = storyFn();
|
|
23
|
+
showMain();
|
|
24
|
+
|
|
25
|
+
if (typeof element === 'string') {
|
|
26
|
+
domElement.innerHTML = element;
|
|
27
|
+
simulatePageLoad(domElement);
|
|
28
|
+
} else if (element instanceof Node) {
|
|
29
|
+
if (domElement.firstChild === element && forceRemount === false) {
|
|
30
|
+
return;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
domElement.innerHTML = '';
|
|
34
|
+
domElement.appendChild(element);
|
|
35
|
+
simulateDOMContentLoaded();
|
|
36
|
+
} else {
|
|
37
|
+
showError({
|
|
38
|
+
title: "Expecting an HTML snippet or DOM node from the story: \"".concat(name, "\" of \"").concat(kind, "\"."),
|
|
39
|
+
description: dedent(_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 "])))
|
|
40
|
+
});
|
|
41
|
+
}
|
|
42
|
+
}
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
// eslint-disable-next-line import/no-extraneous-dependencies
|
|
2
|
+
import { findDistEsm } from '@storybook/core-common';
|
|
3
|
+
export function webpack(config) {
|
|
4
|
+
config.module.rules.push({
|
|
5
|
+
test: /\.html$/,
|
|
6
|
+
use: require.resolve('html-loader')
|
|
7
|
+
});
|
|
8
|
+
return config;
|
|
9
|
+
}
|
|
10
|
+
export var config = function (entry = []) {
|
|
11
|
+
return [...entry, findDistEsm(__dirname, 'client/preview/config')];
|
|
12
|
+
};
|
|
File without changes
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
/* eslint-disable prefer-destructuring */
|
|
2
|
+
import { start } from '@storybook/core/client';
|
|
3
|
+
import './globals';
|
|
4
|
+
import { renderToDOM } from './render';
|
|
5
|
+
const framework = 'html';
|
|
6
|
+
const api = start(renderToDOM);
|
|
7
|
+
export const storiesOf = (kind, m) => {
|
|
8
|
+
return api.clientApi.storiesOf(kind, m).addParameters({
|
|
9
|
+
framework
|
|
10
|
+
});
|
|
11
|
+
};
|
|
12
|
+
export const configure = (...args) => api.configure(framework, ...args);
|
|
13
|
+
export const addDecorator = api.clientApi.addDecorator;
|
|
14
|
+
export const addParameters = api.clientApi.addParameters;
|
|
15
|
+
export const clearDecorators = api.clientApi.clearDecorators;
|
|
16
|
+
export const setAddon = api.clientApi.setAddon;
|
|
17
|
+
export const forceReRender = api.forceReRender;
|
|
18
|
+
export const getStorybook = api.clientApi.getStorybook;
|
|
19
|
+
export const raw = api.clientApi.raw;
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
/* eslint-disable no-param-reassign */
|
|
2
|
+
import global from 'global';
|
|
3
|
+
import dedent from 'ts-dedent';
|
|
4
|
+
import { simulatePageLoad, simulateDOMContentLoaded } from '@storybook/preview-web';
|
|
5
|
+
const {
|
|
6
|
+
Node
|
|
7
|
+
} = global;
|
|
8
|
+
export function renderToDOM({
|
|
9
|
+
storyFn,
|
|
10
|
+
kind,
|
|
11
|
+
name,
|
|
12
|
+
showMain,
|
|
13
|
+
showError,
|
|
14
|
+
forceRemount
|
|
15
|
+
}, domElement) {
|
|
16
|
+
const element = storyFn();
|
|
17
|
+
showMain();
|
|
18
|
+
|
|
19
|
+
if (typeof element === 'string') {
|
|
20
|
+
domElement.innerHTML = element;
|
|
21
|
+
simulatePageLoad(domElement);
|
|
22
|
+
} else if (element instanceof Node) {
|
|
23
|
+
if (domElement.firstChild === element && forceRemount === false) {
|
|
24
|
+
return;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
domElement.innerHTML = '';
|
|
28
|
+
domElement.appendChild(element);
|
|
29
|
+
simulateDOMContentLoaded();
|
|
30
|
+
} else {
|
|
31
|
+
showError({
|
|
32
|
+
title: `Expecting an HTML snippet or DOM node from the story: "${name}" of "${kind}".`,
|
|
33
|
+
description: dedent`
|
|
34
|
+
Did you forget to return the HTML snippet from the story?
|
|
35
|
+
Use "() => <your snippet or node>" or when defining the story.
|
|
36
|
+
`
|
|
37
|
+
});
|
|
38
|
+
}
|
|
39
|
+
}
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
// eslint-disable-next-line import/no-extraneous-dependencies
|
|
2
|
+
import { findDistEsm } from '@storybook/core-common';
|
|
3
|
+
export function webpack(config) {
|
|
4
|
+
config.module.rules.push({
|
|
5
|
+
test: /\.html$/,
|
|
6
|
+
use: require.resolve('html-loader')
|
|
7
|
+
});
|
|
8
|
+
return config;
|
|
9
|
+
}
|
|
10
|
+
export var config = function (entry = []) {
|
|
11
|
+
return [...entry, findDistEsm(__dirname, 'client/preview/config')];
|
|
12
|
+
};
|
|
File without changes
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
/// <reference types="webpack-env" />
|
|
2
|
+
/// <reference types="node" />
|
|
3
|
+
import { ClientStoryApi, Loadable } from '@storybook/addons';
|
|
4
|
+
import { HtmlFramework } from './types-6-0';
|
|
5
|
+
import './globals';
|
|
6
|
+
import { IStorybookSection } from './types';
|
|
7
|
+
interface ClientApi extends ClientStoryApi<HtmlFramework['storyResult']> {
|
|
8
|
+
setAddon(addon: any): void;
|
|
9
|
+
configure(loader: Loadable, module: NodeModule): void;
|
|
10
|
+
getStorybook(): IStorybookSection[];
|
|
11
|
+
clearDecorators(): void;
|
|
12
|
+
forceReRender(): void;
|
|
13
|
+
raw: () => any;
|
|
14
|
+
}
|
|
15
|
+
export declare const storiesOf: ClientApi['storiesOf'];
|
|
16
|
+
export declare const configure: ClientApi['configure'];
|
|
17
|
+
export declare const addDecorator: ClientApi['addDecorator'];
|
|
18
|
+
export declare const addParameters: ClientApi['addParameters'];
|
|
19
|
+
export declare const clearDecorators: ClientApi['clearDecorators'];
|
|
20
|
+
export declare const setAddon: ClientApi['setAddon'];
|
|
21
|
+
export declare const forceReRender: ClientApi['forceReRender'];
|
|
22
|
+
export declare const getStorybook: ClientApi['getStorybook'];
|
|
23
|
+
export declare const raw: ClientApi['raw'];
|
|
24
|
+
export {};
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import { Args, ComponentAnnotations, StoryAnnotations, AnnotatedStoryFn } from '@storybook/csf';
|
|
2
|
+
import { StoryFnHtmlReturnType } from './types';
|
|
3
|
+
export { Args, ArgTypes, Parameters, StoryContext } from '@storybook/addons';
|
|
4
|
+
export declare type HtmlFramework = {
|
|
5
|
+
component: HTMLElement;
|
|
6
|
+
storyResult: StoryFnHtmlReturnType;
|
|
7
|
+
};
|
|
8
|
+
/**
|
|
9
|
+
* Metadata to configure the stories for a component.
|
|
10
|
+
*
|
|
11
|
+
* @see [Default export](https://storybook.js.org/docs/formats/component-story-format/#default-export)
|
|
12
|
+
*/
|
|
13
|
+
export declare type Meta<TArgs = Args> = ComponentAnnotations<HtmlFramework, TArgs>;
|
|
14
|
+
/**
|
|
15
|
+
* Story function that represents a CSFv2 component example.
|
|
16
|
+
*
|
|
17
|
+
* @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
|
|
18
|
+
*/
|
|
19
|
+
export declare type StoryFn<TArgs = Args> = AnnotatedStoryFn<HtmlFramework, TArgs>;
|
|
20
|
+
/**
|
|
21
|
+
* Story function that represents a CSFv3 component example.
|
|
22
|
+
*
|
|
23
|
+
* @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
|
|
24
|
+
*/
|
|
25
|
+
export declare type StoryObj<TArgs = Args> = StoryAnnotations<HtmlFramework, TArgs>;
|
|
26
|
+
/**
|
|
27
|
+
* Story function that represents a CSFv2 component example.
|
|
28
|
+
*
|
|
29
|
+
* @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
|
|
30
|
+
*
|
|
31
|
+
* NOTE that in Storybook 7.0, this type will be renamed to `StoryFn` and replaced by the current `StoryObj` type.
|
|
32
|
+
*
|
|
33
|
+
*/
|
|
34
|
+
export declare type Story<TArgs = Args> = StoryFn<TArgs>;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { Args } from '@storybook/csf';
|
|
2
|
+
import { StoryObj } from './types-6-0';
|
|
3
|
+
export { StoryFn, StoryObj, Meta } from './types-6-0';
|
|
4
|
+
/**
|
|
5
|
+
* Story function that represents a CSFv3 component example.
|
|
6
|
+
*
|
|
7
|
+
* @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
|
|
8
|
+
*/
|
|
9
|
+
export declare type Story<TArgs = Args> = StoryObj<TArgs>;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
export { RenderContext } from '@storybook/core';
|
|
2
|
+
export declare type StoryFnHtmlReturnType = string | Node;
|
|
3
|
+
export interface IStorybookStory {
|
|
4
|
+
name: string;
|
|
5
|
+
render: (context: any) => any;
|
|
6
|
+
}
|
|
7
|
+
export interface IStorybookSection {
|
|
8
|
+
kind: string;
|
|
9
|
+
stories: IStorybookStory[];
|
|
10
|
+
}
|
|
11
|
+
export interface ShowErrorArgs {
|
|
12
|
+
title: string;
|
|
13
|
+
description: string;
|
|
14
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
/// <reference types="webpack-env" />
|
|
2
|
+
/// <reference types="node" />
|
|
3
|
+
import { ClientStoryApi, Loadable } from '@storybook/addons';
|
|
4
|
+
import { HtmlFramework } from './types-6-0';
|
|
5
|
+
import './globals';
|
|
6
|
+
import { IStorybookSection } from './types';
|
|
7
|
+
interface ClientApi extends ClientStoryApi<HtmlFramework['storyResult']> {
|
|
8
|
+
setAddon(addon: any): void;
|
|
9
|
+
configure(loader: Loadable, module: NodeModule): void;
|
|
10
|
+
getStorybook(): IStorybookSection[];
|
|
11
|
+
clearDecorators(): void;
|
|
12
|
+
forceReRender(): void;
|
|
13
|
+
raw: () => any;
|
|
14
|
+
}
|
|
15
|
+
export declare const storiesOf: ClientApi['storiesOf'];
|
|
16
|
+
export declare const configure: ClientApi['configure'];
|
|
17
|
+
export declare const addDecorator: ClientApi['addDecorator'];
|
|
18
|
+
export declare const addParameters: ClientApi['addParameters'];
|
|
19
|
+
export declare const clearDecorators: ClientApi['clearDecorators'];
|
|
20
|
+
export declare const setAddon: ClientApi['setAddon'];
|
|
21
|
+
export declare const forceReRender: ClientApi['forceReRender'];
|
|
22
|
+
export declare const getStorybook: ClientApi['getStorybook'];
|
|
23
|
+
export declare const raw: ClientApi['raw'];
|
|
24
|
+
export {};
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import { Args, ComponentAnnotations, StoryAnnotations, AnnotatedStoryFn } from '@storybook/csf';
|
|
2
|
+
import { StoryFnHtmlReturnType } from './types';
|
|
3
|
+
export type { Args, ArgTypes, Parameters, StoryContext } from '@storybook/addons';
|
|
4
|
+
export declare type HtmlFramework = {
|
|
5
|
+
component: HTMLElement;
|
|
6
|
+
storyResult: StoryFnHtmlReturnType;
|
|
7
|
+
};
|
|
8
|
+
/**
|
|
9
|
+
* Metadata to configure the stories for a component.
|
|
10
|
+
*
|
|
11
|
+
* @see [Default export](https://storybook.js.org/docs/formats/component-story-format/#default-export)
|
|
12
|
+
*/
|
|
13
|
+
export declare type Meta<TArgs = Args> = ComponentAnnotations<HtmlFramework, TArgs>;
|
|
14
|
+
/**
|
|
15
|
+
* Story function that represents a CSFv2 component example.
|
|
16
|
+
*
|
|
17
|
+
* @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
|
|
18
|
+
*/
|
|
19
|
+
export declare type StoryFn<TArgs = Args> = AnnotatedStoryFn<HtmlFramework, TArgs>;
|
|
20
|
+
/**
|
|
21
|
+
* Story function that represents a CSFv3 component example.
|
|
22
|
+
*
|
|
23
|
+
* @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
|
|
24
|
+
*/
|
|
25
|
+
export declare type StoryObj<TArgs = Args> = StoryAnnotations<HtmlFramework, TArgs>;
|
|
26
|
+
/**
|
|
27
|
+
* Story function that represents a CSFv2 component example.
|
|
28
|
+
*
|
|
29
|
+
* @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
|
|
30
|
+
*
|
|
31
|
+
* NOTE that in Storybook 7.0, this type will be renamed to `StoryFn` and replaced by the current `StoryObj` type.
|
|
32
|
+
*
|
|
33
|
+
*/
|
|
34
|
+
export declare type Story<TArgs = Args> = StoryFn<TArgs>;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { Args } from '@storybook/csf';
|
|
2
|
+
import type { StoryObj } from './types-6-0';
|
|
3
|
+
export type { StoryFn, StoryObj, Meta } from './types-6-0';
|
|
4
|
+
/**
|
|
5
|
+
* Story function that represents a CSFv3 component example.
|
|
6
|
+
*
|
|
7
|
+
* @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
|
|
8
|
+
*/
|
|
9
|
+
export declare type Story<TArgs = Args> = StoryObj<TArgs>;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
export type { RenderContext } from '@storybook/core';
|
|
2
|
+
export declare type StoryFnHtmlReturnType = string | Node;
|
|
3
|
+
export interface IStorybookStory {
|
|
4
|
+
name: string;
|
|
5
|
+
render: (context: any) => any;
|
|
6
|
+
}
|
|
7
|
+
export interface IStorybookSection {
|
|
8
|
+
kind: string;
|
|
9
|
+
stories: IStorybookStory[];
|
|
10
|
+
}
|
|
11
|
+
export interface ShowErrorArgs {
|
|
12
|
+
title: string;
|
|
13
|
+
description: string;
|
|
14
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@storybook/html",
|
|
3
|
-
"version": "6.4.0-beta.
|
|
3
|
+
"version": "6.4.0-beta.28",
|
|
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.4.0-beta.
|
|
49
|
-
"@storybook/client-api": "6.4.0-beta.
|
|
50
|
-
"@storybook/core": "6.4.0-beta.
|
|
51
|
-
"@storybook/core-common": "6.4.0-beta.
|
|
48
|
+
"@storybook/addons": "6.4.0-beta.28",
|
|
49
|
+
"@storybook/client-api": "6.4.0-beta.28",
|
|
50
|
+
"@storybook/core": "6.4.0-beta.28",
|
|
51
|
+
"@storybook/core-common": "6.4.0-beta.28",
|
|
52
52
|
"@storybook/csf": "0.0.2--canary.87bc651.0",
|
|
53
|
-
"@storybook/preview-web": "6.4.0-beta.
|
|
54
|
-
"@storybook/store": "6.4.0-beta.
|
|
53
|
+
"@storybook/preview-web": "6.4.0-beta.28",
|
|
54
|
+
"@storybook/store": "6.4.0-beta.28",
|
|
55
55
|
"@types/webpack-env": "^1.16.0",
|
|
56
56
|
"core-js": "^3.8.2",
|
|
57
57
|
"global": "^4.4.0",
|
|
@@ -71,6 +71,6 @@
|
|
|
71
71
|
"publishConfig": {
|
|
72
72
|
"access": "public"
|
|
73
73
|
},
|
|
74
|
-
"gitHead": "
|
|
74
|
+
"gitHead": "72316abb8354d1f84d2bf8f645b18aeb315768c3",
|
|
75
75
|
"sbmodern": "dist/modern/client/index.js"
|
|
76
76
|
}
|