@storybook/addon-docs 7.0.0-alpha.5 → 7.0.0-alpha.8

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 (86) hide show
  1. package/dist/cjs/blocks/index.js +4 -352
  2. package/dist/cjs/preset.js +5 -13
  3. package/dist/cjs/preview.js +6 -2
  4. package/dist/esm/blocks/index.js +1 -24
  5. package/dist/esm/preview.js +6 -2
  6. package/dist/types/blocks/index.d.ts +1 -24
  7. package/dist/types/preview.d.ts +1 -6
  8. package/package.json +16 -15
  9. package/dist/cjs/blocks/Anchor.js +0 -23
  10. package/dist/cjs/blocks/ArgsTable.js +0 -329
  11. package/dist/cjs/blocks/Canvas.js +0 -109
  12. package/dist/cjs/blocks/Description.js +0 -126
  13. package/dist/cjs/blocks/DocsContainer.js +0 -127
  14. package/dist/cjs/blocks/DocsContext.js +0 -25
  15. package/dist/cjs/blocks/DocsPage.js +0 -30
  16. package/dist/cjs/blocks/DocsStory.js +0 -68
  17. package/dist/cjs/blocks/Heading.js +0 -31
  18. package/dist/cjs/blocks/Meta.js +0 -50
  19. package/dist/cjs/blocks/Preview.js +0 -23
  20. package/dist/cjs/blocks/Primary.js +0 -39
  21. package/dist/cjs/blocks/Props.js +0 -29
  22. package/dist/cjs/blocks/Source.js +0 -179
  23. package/dist/cjs/blocks/SourceContainer.js +0 -67
  24. package/dist/cjs/blocks/Stories.js +0 -51
  25. package/dist/cjs/blocks/Story.js +0 -143
  26. package/dist/cjs/blocks/Subheading.js +0 -31
  27. package/dist/cjs/blocks/Subtitle.js +0 -39
  28. package/dist/cjs/blocks/Title.js +0 -44
  29. package/dist/cjs/blocks/Wrapper.js +0 -20
  30. package/dist/cjs/blocks/enhanceSource.js +0 -92
  31. package/dist/cjs/blocks/mdx.js +0 -234
  32. package/dist/cjs/blocks/types.js +0 -10
  33. package/dist/cjs/blocks/useStory.js +0 -37
  34. package/dist/cjs/blocks/utils.js +0 -40
  35. package/dist/esm/blocks/Anchor.js +0 -8
  36. package/dist/esm/blocks/ArgsTable.js +0 -292
  37. package/dist/esm/blocks/Canvas.js +0 -83
  38. package/dist/esm/blocks/Description.js +0 -107
  39. package/dist/esm/blocks/DocsContainer.js +0 -98
  40. package/dist/esm/blocks/DocsContext.js +0 -16
  41. package/dist/esm/blocks/DocsPage.js +0 -11
  42. package/dist/esm/blocks/DocsStory.js +0 -46
  43. package/dist/esm/blocks/Heading.js +0 -17
  44. package/dist/esm/blocks/Meta.js +0 -31
  45. package/dist/esm/blocks/Preview.js +0 -9
  46. package/dist/esm/blocks/Primary.js +0 -23
  47. package/dist/esm/blocks/Props.js +0 -14
  48. package/dist/esm/blocks/Source.js +0 -144
  49. package/dist/esm/blocks/SourceContainer.js +0 -44
  50. package/dist/esm/blocks/Stories.js +0 -30
  51. package/dist/esm/blocks/Story.js +0 -114
  52. package/dist/esm/blocks/Subheading.js +0 -17
  53. package/dist/esm/blocks/Subtitle.js +0 -23
  54. package/dist/esm/blocks/Title.js +0 -24
  55. package/dist/esm/blocks/Wrapper.js +0 -8
  56. package/dist/esm/blocks/enhanceSource.js +0 -87
  57. package/dist/esm/blocks/mdx.js +0 -203
  58. package/dist/esm/blocks/types.js +0 -2
  59. package/dist/esm/blocks/useStory.js +0 -27
  60. package/dist/esm/blocks/utils.js +0 -29
  61. package/dist/types/blocks/Anchor.d.ts +0 -6
  62. package/dist/types/blocks/ArgsTable.d.ts +0 -33
  63. package/dist/types/blocks/Canvas.d.ts +0 -9
  64. package/dist/types/blocks/Description.d.ts +0 -20
  65. package/dist/types/blocks/DocsContainer.d.ts +0 -7
  66. package/dist/types/blocks/DocsContext.d.ts +0 -5
  67. package/dist/types/blocks/DocsPage.d.ts +0 -2
  68. package/dist/types/blocks/DocsStory.d.ts +0 -3
  69. package/dist/types/blocks/Heading.d.ts +0 -6
  70. package/dist/types/blocks/Meta.d.ts +0 -9
  71. package/dist/types/blocks/Preview.d.ts +0 -3
  72. package/dist/types/blocks/Primary.d.ts +0 -6
  73. package/dist/types/blocks/Props.d.ts +0 -3
  74. package/dist/types/blocks/Source.d.ts +0 -38
  75. package/dist/types/blocks/SourceContainer.d.ts +0 -14
  76. package/dist/types/blocks/Stories.d.ts +0 -7
  77. package/dist/types/blocks/Story.d.ts +0 -28
  78. package/dist/types/blocks/Subheading.d.ts +0 -3
  79. package/dist/types/blocks/Subtitle.d.ts +0 -6
  80. package/dist/types/blocks/Title.d.ts +0 -8
  81. package/dist/types/blocks/Wrapper.d.ts +0 -2
  82. package/dist/types/blocks/enhanceSource.d.ts +0 -3
  83. package/dist/types/blocks/mdx.d.ts +0 -20
  84. package/dist/types/blocks/types.d.ts +0 -13
  85. package/dist/types/blocks/useStory.d.ts +0 -5
  86. package/dist/types/blocks/utils.d.ts +0 -3
@@ -1,143 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.storyBlockIdFromId = exports.lookupStoryId = exports.getStoryProps = exports.getStoryId = exports.Story = void 0;
7
-
8
- var _react = _interopRequireWildcard(require("react"));
9
-
10
- var _react2 = require("@mdx-js/react");
11
-
12
- var _components = require("@storybook/components");
13
-
14
- var _csf = require("@storybook/csf");
15
-
16
- var _types = require("./types");
17
-
18
- var _DocsContext = require("./DocsContext");
19
-
20
- var _useStory = require("./useStory");
21
-
22
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
23
-
24
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
25
-
26
- const storyBlockIdFromId = storyId => `story--${storyId}`;
27
-
28
- exports.storyBlockIdFromId = storyBlockIdFromId;
29
-
30
- const lookupStoryId = (storyName, {
31
- mdxStoryNameToKey,
32
- mdxComponentAnnotations
33
- }) => (0, _csf.toId)(mdxComponentAnnotations.id || mdxComponentAnnotations.title, (0, _csf.storyNameFromExport)(mdxStoryNameToKey[storyName]));
34
-
35
- exports.lookupStoryId = lookupStoryId;
36
-
37
- const getStoryId = (props, context) => {
38
- const {
39
- id
40
- } = props;
41
- const {
42
- name
43
- } = props;
44
- const inputId = id === _types.CURRENT_SELECTION ? context.id : id;
45
- return inputId || lookupStoryId(name, context);
46
- };
47
-
48
- exports.getStoryId = getStoryId;
49
-
50
- const getStoryProps = ({
51
- height,
52
- inline
53
- }, story) => {
54
- const {
55
- name: storyName,
56
- parameters
57
- } = story;
58
- const {
59
- docs = {}
60
- } = parameters;
61
-
62
- if (docs.disable) {
63
- return null;
64
- } // prefer block props, then story parameters defined by the framework-specific settings and optionally overridden by users
65
-
66
-
67
- const {
68
- inlineStories = false,
69
- iframeHeight = 100
70
- } = docs;
71
- const storyIsInline = typeof inline === 'boolean' ? inline : inlineStories;
72
- return Object.assign({
73
- inline: storyIsInline,
74
- id: story.id,
75
- height: height || (storyIsInline ? undefined : iframeHeight),
76
- title: storyName
77
- }, storyIsInline && {
78
- parameters
79
- });
80
- };
81
-
82
- exports.getStoryProps = getStoryProps;
83
-
84
- const Story = props => {
85
- const context = (0, _react.useContext)(_DocsContext.DocsContext);
86
- const storyRef = (0, _react.useRef)();
87
- const storyId = getStoryId(props, context);
88
- const story = (0, _useStory.useStory)(storyId, context);
89
- const [showLoader, setShowLoader] = (0, _react.useState)(true);
90
- (0, _react.useEffect)(() => {
91
- let cleanup;
92
-
93
- if (story && storyRef.current) {
94
- const element = storyRef.current;
95
- cleanup = context.renderStoryToElement(story, element);
96
- setShowLoader(false);
97
- }
98
-
99
- return () => cleanup && cleanup();
100
- }, [story]);
101
-
102
- if (!story) {
103
- return /*#__PURE__*/_react.default.createElement(_components.StorySkeleton, null);
104
- }
105
-
106
- const storyProps = getStoryProps(props, story);
107
-
108
- if (!storyProps) {
109
- return null;
110
- }
111
-
112
- if (storyProps.inline) {
113
- // We do this so React doesn't complain when we replace the span in a secondary render
114
- const htmlContents = `<span></span>`; // FIXME: height/style/etc. lifted from PureStory
115
-
116
- const {
117
- height
118
- } = storyProps;
119
- return /*#__PURE__*/_react.default.createElement("div", {
120
- id: storyBlockIdFromId(story.id)
121
- }, /*#__PURE__*/_react.default.createElement(_react2.MDXProvider, {
122
- components: _components.resetComponents
123
- }, height ? /*#__PURE__*/_react.default.createElement("style", null, `#story--${story.id} { min-height: ${height}; transform: translateZ(0); overflow: auto }`) : null, showLoader && /*#__PURE__*/_react.default.createElement(_components.StorySkeleton, null), /*#__PURE__*/_react.default.createElement("div", {
124
- ref: storyRef,
125
- "data-name": story.name,
126
- dangerouslySetInnerHTML: {
127
- __html: htmlContents
128
- }
129
- })));
130
- }
131
-
132
- return /*#__PURE__*/_react.default.createElement("div", {
133
- id: storyBlockIdFromId(story.id)
134
- }, /*#__PURE__*/_react.default.createElement(_react2.MDXProvider, {
135
- components: _components.resetComponents
136
- }, /*#__PURE__*/_react.default.createElement(_components.Story, storyProps)));
137
- };
138
-
139
- exports.Story = Story;
140
- Story.defaultProps = {
141
- children: null,
142
- name: null
143
- };
@@ -1,31 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.Subheading = void 0;
7
-
8
- var _react = _interopRequireDefault(require("react"));
9
-
10
- var _components = require("@storybook/components");
11
-
12
- var _mdx = require("./mdx");
13
-
14
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
15
-
16
- const Subheading = ({
17
- children,
18
- disableAnchor
19
- }) => {
20
- if (disableAnchor || typeof children !== 'string') {
21
- return /*#__PURE__*/_react.default.createElement(_components.H3, null, children);
22
- }
23
-
24
- const tagID = children.toLowerCase().replace(/[^a-z0-9]/gi, '-');
25
- return /*#__PURE__*/_react.default.createElement(_mdx.HeaderMdx, {
26
- as: "h3",
27
- id: tagID
28
- }, children);
29
- };
30
-
31
- exports.Subheading = Subheading;
@@ -1,39 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.Subtitle = void 0;
7
-
8
- var _react = _interopRequireWildcard(require("react"));
9
-
10
- var _components = require("@storybook/components");
11
-
12
- var _DocsContext = require("./DocsContext");
13
-
14
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
15
-
16
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
17
-
18
- const Subtitle = ({
19
- children
20
- }) => {
21
- const {
22
- id,
23
- storyById
24
- } = (0, _react.useContext)(_DocsContext.DocsContext);
25
- const {
26
- parameters
27
- } = storyById(id);
28
- let text = children;
29
-
30
- if (!text) {
31
- text = parameters === null || parameters === void 0 ? void 0 : parameters.componentSubtitle;
32
- }
33
-
34
- return text ? /*#__PURE__*/_react.default.createElement(_components.Subtitle, {
35
- className: "sbdocs-subtitle"
36
- }, text) : null;
37
- };
38
-
39
- exports.Subtitle = Subtitle;
@@ -1,44 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.extractTitle = exports.Title = void 0;
7
-
8
- var _react = _interopRequireWildcard(require("react"));
9
-
10
- var _components = require("@storybook/components");
11
-
12
- var _DocsContext = require("./DocsContext");
13
-
14
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
15
-
16
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
17
-
18
- const STORY_KIND_PATH_SEPARATOR = /\s*\/\s*/;
19
-
20
- const extractTitle = ({
21
- title
22
- }) => {
23
- const groups = title.trim().split(STORY_KIND_PATH_SEPARATOR);
24
- return groups && groups[groups.length - 1] || title;
25
- };
26
-
27
- exports.extractTitle = extractTitle;
28
-
29
- const Title = ({
30
- children
31
- }) => {
32
- const context = (0, _react.useContext)(_DocsContext.DocsContext);
33
- let text = children;
34
-
35
- if (!text) {
36
- text = extractTitle(context);
37
- }
38
-
39
- return text ? /*#__PURE__*/_react.default.createElement(_components.Title, {
40
- className: "sbdocs-title"
41
- }, text) : null;
42
- };
43
-
44
- exports.Title = Title;
@@ -1,20 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.Wrapper = void 0;
7
-
8
- var _react = _interopRequireDefault(require("react"));
9
-
10
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
11
-
12
- const Wrapper = ({
13
- children
14
- }) => /*#__PURE__*/_react.default.createElement("div", {
15
- style: {
16
- fontFamily: 'sans-serif'
17
- }
18
- }, children);
19
-
20
- exports.Wrapper = Wrapper;
@@ -1,92 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.enhanceSource = void 0;
7
-
8
- var _store = require("@storybook/store");
9
-
10
- /**
11
- * given a location, extract the text from the full source
12
- */
13
- function extractSource(location, lines) {
14
- const {
15
- startBody: start,
16
- endBody: end
17
- } = location;
18
-
19
- if (start.line === end.line && lines[start.line - 1] !== undefined) {
20
- return lines[start.line - 1].substring(start.col, end.col);
21
- } // NOTE: storysource locations are 1-based not 0-based!
22
-
23
-
24
- const startLine = lines[start.line - 1];
25
- const endLine = lines[end.line - 1];
26
-
27
- if (startLine === undefined || endLine === undefined) {
28
- return null;
29
- }
30
-
31
- return [startLine.substring(start.col), ...lines.slice(start.line, end.line - 1), endLine.substring(0, end.col)].join('\n');
32
- } // ============================================================
33
- // END @storybook/source-loader/extract-source
34
- // ============================================================
35
-
36
-
37
- /**
38
- * Replaces full story id name like: story-kind--story-name -> story-name
39
- * @param id
40
- */
41
- const storyIdToSanitizedStoryName = id => id.replace(/^.*?--/, '');
42
-
43
- const extract = (targetId, {
44
- source,
45
- locationsMap
46
- }) => {
47
- if (!locationsMap) {
48
- return source;
49
- }
50
-
51
- const sanitizedStoryName = storyIdToSanitizedStoryName(targetId);
52
- const location = locationsMap[sanitizedStoryName];
53
-
54
- if (!location) {
55
- return source;
56
- }
57
-
58
- const lines = source.split('\n');
59
- return extractSource(location, lines);
60
- };
61
-
62
- const enhanceSource = story => {
63
- var _docs$source;
64
-
65
- const {
66
- id,
67
- parameters
68
- } = story;
69
- const {
70
- storySource,
71
- docs = {}
72
- } = parameters;
73
- const {
74
- transformSource
75
- } = docs; // no input or user has manually overridden the output
76
-
77
- if (!(storySource !== null && storySource !== void 0 && storySource.source) || (_docs$source = docs.source) !== null && _docs$source !== void 0 && _docs$source.code) {
78
- return null;
79
- }
80
-
81
- const input = extract(id, storySource);
82
- const code = transformSource ? transformSource(input, story) : input;
83
- return {
84
- docs: (0, _store.combineParameters)(docs, {
85
- source: {
86
- code
87
- }
88
- })
89
- };
90
- };
91
-
92
- exports.enhanceSource = enhanceSource;
@@ -1,234 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.assertIsFn = exports.HeadersMdx = exports.HeaderMdx = exports.CodeOrSourceMdx = exports.AnchorMdx = exports.AddContext = void 0;
7
-
8
- var _react = _interopRequireDefault(require("react"));
9
-
10
- var _addons = require("@storybook/addons");
11
-
12
- var _coreEvents = require("@storybook/core-events");
13
-
14
- var _components = require("@storybook/components");
15
-
16
- var _global = _interopRequireDefault(require("global"));
17
-
18
- var _theming = require("@storybook/theming");
19
-
20
- var _DocsContext = require("./DocsContext");
21
-
22
- const _excluded = ["children"],
23
- _excluded2 = ["className", "children"],
24
- _excluded3 = ["href", "target", "children"],
25
- _excluded4 = ["as", "id", "children"],
26
- _excluded5 = ["as", "id", "children"];
27
-
28
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
29
-
30
- function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
31
-
32
- function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
33
-
34
- const {
35
- document
36
- } = _global.default; // Hacky utility for asserting identifiers in MDX Story elements
37
-
38
- const assertIsFn = val => {
39
- if (typeof val !== 'function') {
40
- throw new Error(`Expected story function, got: ${val}`);
41
- }
42
-
43
- return val;
44
- }; // Hacky utility for adding mdxStoryToId to the default context
45
-
46
-
47
- exports.assertIsFn = assertIsFn;
48
-
49
- const AddContext = props => {
50
- const {
51
- children
52
- } = props,
53
- rest = _objectWithoutPropertiesLoose(props, _excluded);
54
-
55
- const parentContext = _react.default.useContext(_DocsContext.DocsContext);
56
-
57
- return /*#__PURE__*/_react.default.createElement(_DocsContext.DocsContext.Provider, {
58
- value: Object.assign({}, parentContext, rest)
59
- }, children);
60
- };
61
-
62
- exports.AddContext = AddContext;
63
-
64
- const CodeOrSourceMdx = _ref => {
65
- let {
66
- className,
67
- children
68
- } = _ref,
69
- rest = _objectWithoutPropertiesLoose(_ref, _excluded2);
70
-
71
- // markdown-to-jsx does not add className to inline code
72
- if (typeof className !== 'string' && (typeof children !== 'string' || !children.match(/[\n\r]/g))) {
73
- return /*#__PURE__*/_react.default.createElement(_components.Code, null, children);
74
- } // className: "lang-jsx"
75
-
76
-
77
- const language = className && className.split('-');
78
- return /*#__PURE__*/_react.default.createElement(_components.Source, _extends({
79
- language: language && language[1] || 'plaintext',
80
- format: false,
81
- code: children
82
- }, rest));
83
- };
84
-
85
- exports.CodeOrSourceMdx = CodeOrSourceMdx;
86
-
87
- function navigate(url) {
88
- _addons.addons.getChannel().emit(_coreEvents.NAVIGATE_URL, url);
89
- } // @ts-ignore
90
-
91
-
92
- const A = _components.components.a;
93
-
94
- const AnchorInPage = ({
95
- hash,
96
- children
97
- }) => /*#__PURE__*/_react.default.createElement(A, {
98
- href: hash,
99
- target: "_self",
100
- onClick: event => {
101
- const id = hash.substring(1);
102
- const element = document.getElementById(id);
103
-
104
- if (element) {
105
- navigate(hash);
106
- }
107
- }
108
- }, children);
109
-
110
- const AnchorMdx = props => {
111
- const {
112
- href,
113
- target,
114
- children
115
- } = props,
116
- rest = _objectWithoutPropertiesLoose(props, _excluded3);
117
-
118
- if (href) {
119
- // Enable scrolling for in-page anchors.
120
- if (href.startsWith('#')) {
121
- return /*#__PURE__*/_react.default.createElement(AnchorInPage, {
122
- hash: href
123
- }, children);
124
- } // Links to other pages of SB should use the base URL of the top level iframe instead of the base URL of the preview iframe.
125
-
126
-
127
- if (target !== '_blank' && !href.startsWith('https://')) {
128
- return /*#__PURE__*/_react.default.createElement(A, _extends({
129
- href: href,
130
- onClick: event => {
131
- event.preventDefault(); // use the A element's href, which has been modified for
132
- // local paths without a `?path=` query param prefix
133
-
134
- navigate(event.currentTarget.getAttribute('href'));
135
- },
136
- target: target
137
- }, rest), children);
138
- }
139
- } // External URL dont need any modification.
140
-
141
-
142
- return /*#__PURE__*/_react.default.createElement(A, props);
143
- };
144
-
145
- exports.AnchorMdx = AnchorMdx;
146
- const SUPPORTED_MDX_HEADERS = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];
147
- const OcticonHeaders = SUPPORTED_MDX_HEADERS.reduce((acc, headerType) => Object.assign({}, acc, {
148
- // @ts-ignore
149
- [headerType]: (0, _theming.styled)(_components.components[headerType])({
150
- '& svg': {
151
- visibility: 'hidden'
152
- },
153
- '&:hover svg': {
154
- visibility: 'visible'
155
- }
156
- })
157
- }), {});
158
-
159
- const OcticonAnchor = _theming.styled.a(() => ({
160
- float: 'left',
161
- paddingRight: '4px',
162
- marginLeft: '-20px',
163
- // Allow the theme's text color to override the default link color.
164
- color: 'inherit'
165
- }));
166
-
167
- const HeaderWithOcticonAnchor = _ref2 => {
168
- let {
169
- as,
170
- id,
171
- children
172
- } = _ref2,
173
- rest = _objectWithoutPropertiesLoose(_ref2, _excluded4);
174
-
175
- // @ts-ignore
176
- const OcticonHeader = OcticonHeaders[as];
177
- const hash = `#${id}`;
178
- return /*#__PURE__*/_react.default.createElement(OcticonHeader, _extends({
179
- id: id
180
- }, rest), /*#__PURE__*/_react.default.createElement(OcticonAnchor, {
181
- "aria-hidden": "true",
182
- href: hash,
183
- tabIndex: -1,
184
- target: "_self",
185
- onClick: event => {
186
- const element = document.getElementById(id);
187
-
188
- if (element) {
189
- navigate(hash);
190
- }
191
- }
192
- }, /*#__PURE__*/_react.default.createElement("svg", {
193
- viewBox: "0 0 16 16",
194
- version: "1.1",
195
- width: "16",
196
- height: "16",
197
- "aria-hidden": "true",
198
- fill: "currentColor"
199
- }, /*#__PURE__*/_react.default.createElement("path", {
200
- fillRule: "evenodd",
201
- d: "M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"
202
- }))), children);
203
- };
204
-
205
- const HeaderMdx = props => {
206
- const {
207
- as,
208
- id,
209
- children
210
- } = props,
211
- rest = _objectWithoutPropertiesLoose(props, _excluded5); // An id should have been added on every header by the "remark-slug" plugin.
212
-
213
-
214
- if (id) {
215
- return /*#__PURE__*/_react.default.createElement(HeaderWithOcticonAnchor, _extends({
216
- as: as,
217
- id: id
218
- }, rest), children);
219
- } // @ts-ignore
220
-
221
-
222
- const Header = _components.components[as]; // Make sure it still work if "remark-slug" plugin is not present.
223
-
224
- return /*#__PURE__*/_react.default.createElement(Header, props);
225
- };
226
-
227
- exports.HeaderMdx = HeaderMdx;
228
- const HeadersMdx = SUPPORTED_MDX_HEADERS.reduce((acc, headerType) => Object.assign({}, acc, {
229
- // @ts-ignore
230
- [headerType]: props => /*#__PURE__*/_react.default.createElement(HeaderMdx, _extends({
231
- as: headerType
232
- }, props))
233
- }), {});
234
- exports.HeadersMdx = HeadersMdx;
@@ -1,10 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.PRIMARY_STORY = exports.CURRENT_SELECTION = void 0;
7
- const CURRENT_SELECTION = '.';
8
- exports.CURRENT_SELECTION = CURRENT_SELECTION;
9
- const PRIMARY_STORY = '^';
10
- exports.PRIMARY_STORY = PRIMARY_STORY;
@@ -1,37 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.useStories = useStories;
7
- exports.useStory = useStory;
8
-
9
- var _react = require("react");
10
-
11
- function useStory(storyId, context) {
12
- const stories = useStories([storyId], context);
13
- return stories && stories[0];
14
- }
15
-
16
- function useStories(storyIds, context) {
17
- const initialStoriesById = context.componentStories().reduce((acc, story) => {
18
- acc[story.id] = story;
19
- return acc;
20
- }, {});
21
- const [storiesById, setStories] = (0, _react.useState)(initialStoriesById);
22
- (0, _react.useEffect)(() => {
23
- Promise.all(storyIds.map(async storyId => {
24
- // loadStory will be called every single time useStory is called
25
- // because useEffect does not use storyIds as an input. This is because
26
- // HMR can change the story even when the storyId hasn't changed. However, it
27
- // will be a no-op once the story has loaded. Furthermore, the `story` will
28
- // have an exact equality when the story hasn't changed, so it won't trigger
29
- // any unnecessary re-renders
30
- const story = await context.loadStory(storyId);
31
- setStories(current => current[storyId] === story ? current : Object.assign({}, current, {
32
- [storyId]: story
33
- }));
34
- }));
35
- });
36
- return storyIds.map(storyId => storiesById[storyId]);
37
- }
@@ -1,40 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.getComponentName = void 0;
7
- exports.scrollToElement = scrollToElement;
8
-
9
- /* eslint-disable no-underscore-dangle */
10
- const titleCase = str => str.split('-').map(part => part.charAt(0).toUpperCase() + part.slice(1)).join('');
11
-
12
- const getComponentName = component => {
13
- if (!component) {
14
- return undefined;
15
- }
16
-
17
- if (typeof component === 'string') {
18
- if (component.includes('-')) {
19
- return titleCase(component);
20
- }
21
-
22
- return component;
23
- }
24
-
25
- if (component.__docgenInfo && component.__docgenInfo.displayName) {
26
- return component.__docgenInfo.displayName;
27
- }
28
-
29
- return component.name;
30
- };
31
-
32
- exports.getComponentName = getComponentName;
33
-
34
- function scrollToElement(element, block = 'start') {
35
- element.scrollIntoView({
36
- behavior: 'smooth',
37
- block,
38
- inline: 'nearest'
39
- });
40
- }