@storybook/addon-docs 6.5.9 → 7.0.0-alpha.10

package/dist/cjs/preset.js

@@ -1,47 +1,12 @@
 "use strict";
 
-require("core-js/modules/es.symbol.js");
-
-require("core-js/modules/es.symbol.description.js");
-
-require("core-js/modules/es.symbol.iterator.js");
-
-require("core-js/modules/es.array.iterator.js");
-
-require("core-js/modules/es.string.iterator.js");
-
-require("core-js/modules/web.dom-collections.iterator.js");
-
-require("core-js/modules/es.array.from.js");
-
-require("core-js/modules/es.array.slice.js");
-
-require("core-js/modules/es.function.name.js");
-
-require("core-js/modules/es.promise.js");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.storyIndexers = void 0;
 exports.webpack = webpack;
 
-require("regenerator-runtime/runtime.js");
-
-require("core-js/modules/es.array.concat.js");
-
-require("core-js/modules/es.object.assign.js");
-
-require("core-js/modules/es.array.filter.js");
-
-require("core-js/modules/es.object.to-string.js");
-
-require("core-js/modules/es.regexp.exec.js");
-
-require("core-js/modules/es.regexp.to-string.js");
-
-require("core-js/modules/es.regexp.constructor.js");
-
-var _path = _interopRequireDefault(require("path"));
+var _fsExtra = _interopRequireDefault(require("fs-extra"));
 
 var _remarkSlug = _interopRequireDefault(require("remark-slug"));
 
@@ -51,176 +16,139 @@ var _global = _interopRequireDefault(require("global"));
 
 var _nodeLogger = require("@storybook/node-logger");
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
+var _csfTools = require("@storybook/csf-tools");
 
-function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
-
-function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
-
-function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-
-function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+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); }
 
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+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; }
 
-function createBabelOptions(_ref) {
-  var babelOptions = _ref.babelOptions,
-      mdxBabelOptions = _ref.mdxBabelOptions,
-      configureJSX = _ref.configureJSX;
-  var babelPlugins = (mdxBabelOptions === null || mdxBabelOptions === void 0 ? void 0 : mdxBabelOptions.plugins) || (babelOptions === null || babelOptions === void 0 ? void 0 : babelOptions.plugins) || [];
-  var jsxPlugin = [require.resolve('@babel/plugin-transform-react-jsx'), {
+function createBabelOptions({
+  babelOptions,
+  mdxBabelOptions,
+  configureJSX
+}) {
+  const babelPlugins = mdxBabelOptions?.plugins || babelOptions?.plugins || [];
+  const jsxPlugin = [require.resolve('@babel/plugin-transform-react-jsx'), {
     pragma: 'React.createElement',
     pragmaFrag: 'React.Fragment'
   }];
-  var plugins = configureJSX ? [].concat(_toConsumableArray(babelPlugins), [jsxPlugin]) : babelPlugins;
+  const plugins = configureJSX ? [...babelPlugins, jsxPlugin] : babelPlugins;
   return Object.assign({
     // don't use the root babelrc by default (users can override this in mdxBabelOptions)
     babelrc: false,
     configFile: false
   }, babelOptions, mdxBabelOptions, {
-    plugins: plugins
+    plugins
   });
 }
 
-function webpack() {
-  return _webpack.apply(this, arguments);
+async function webpack(webpackConfig = {}, options) {
+  const resolvedBabelLoader = require.resolve('babel-loader');
+
+  const {
+    module = {}
+  } = webpackConfig; // it will reuse babel options that are already in use in storybook
+  // also, these babel options are chained with other presets.
+
+  const {
+    babelOptions,
+    mdxBabelOptions,
+    configureJSX = true,
+    sourceLoaderOptions = {
+      injectStoryParameters: true
+    },
+    transcludeMarkdown = false
+  } = options;
+  const mdxLoaderOptions = {
+    skipCsf: true,
+    remarkPlugins: [_remarkSlug.default, _remarkExternalLinks.default]
+  };
+  const mdxVersion = _global.default.FEATURES?.previewMdx2 ? 'MDX2' : 'MDX1';
+
+  _nodeLogger.logger.info(`Addon-docs: using ${mdxVersion}`);
+
+  const mdxLoader = _global.default.FEATURES?.previewMdx2 ? require.resolve('@storybook/mdx2-csf/loader') : require.resolve('@storybook/mdx1-csf/loader'); // set `sourceLoaderOptions` to `null` to disable for manual configuration
+
+  const sourceLoader = sourceLoaderOptions ? [{
+    test: /\.(stories|story)\.[tj]sx?$/,
+    loader: require.resolve('@storybook/source-loader'),
+    options: Object.assign({}, sourceLoaderOptions, {
+      inspectLocalDependencies: true
+    }),
+    enforce: 'pre'
+  }] : [];
+  let rules = module.rules || [];
+
+  if (transcludeMarkdown) {
+    rules = [...rules.filter(rule => rule.test?.toString() !== '/\\.md$/'), {
+      test: /\.md$/,
+      use: [{
+        loader: resolvedBabelLoader,
+        options: createBabelOptions({
+          babelOptions,
+          mdxBabelOptions,
+          configureJSX
+        })
+      }, {
+        loader: mdxLoader,
+        options: mdxLoaderOptions
+      }]
+    }];
+  }
+
+  const result = Object.assign({}, webpackConfig, {
+    module: Object.assign({}, module, {
+      rules: [...rules, {
+        test: /(stories|story)\.mdx$/,
+        use: [{
+          loader: resolvedBabelLoader,
+          options: createBabelOptions({
+            babelOptions,
+            mdxBabelOptions,
+            configureJSX
+          })
+        }, {
+          loader: mdxLoader
+        }]
+      }, {
+        test: /\.mdx$/,
+        exclude: /(stories|story)\.mdx$/,
+        use: [{
+          loader: resolvedBabelLoader,
+          options: createBabelOptions({
+            babelOptions,
+            mdxBabelOptions,
+            configureJSX
+          })
+        }, {
+          loader: mdxLoader,
+          options: mdxLoaderOptions
+        }]
+      }, ...sourceLoader]
+    })
+  });
+  return result;
 }
 
-function _webpack() {
-  _webpack = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
-    var _global$FEATURES, _global$FEATURES2;
-
-    var webpackConfig,
-        options,
-        resolvedBabelLoader,
-        _webpackConfig$module,
-        module,
-        babelOptions,
-        mdxBabelOptions,
-        _options$configureJSX,
-        configureJSX,
-        _options$sourceLoader,
-        sourceLoaderOptions,
-        _options$transcludeMa,
-        transcludeMarkdown,
-        mdxLoaderOptions,
-        mdxVersion,
-        mdxLoader,
-        sourceLoader,
-        rules,
-        result,
-        _args = arguments;
-
-    return regeneratorRuntime.wrap(function _callee$(_context) {
-      while (1) {
-        switch (_context.prev = _context.next) {
-          case 0:
-            webpackConfig = _args.length > 0 && _args[0] !== undefined ? _args[0] : {};
-            options = _args.length > 1 ? _args[1] : undefined;
-            resolvedBabelLoader = require.resolve('babel-loader');
-            _webpackConfig$module = webpackConfig.module, module = _webpackConfig$module === void 0 ? {} : _webpackConfig$module; // it will reuse babel options that are already in use in storybook
-            // also, these babel options are chained with other presets.
-
-            babelOptions = options.babelOptions, mdxBabelOptions = options.mdxBabelOptions, _options$configureJSX = options.configureJSX, configureJSX = _options$configureJSX === void 0 ? true : _options$configureJSX, _options$sourceLoader = options.sourceLoaderOptions, sourceLoaderOptions = _options$sourceLoader === void 0 ? {
-              injectStoryParameters: true
-            } : _options$sourceLoader, _options$transcludeMa = options.transcludeMarkdown, transcludeMarkdown = _options$transcludeMa === void 0 ? false : _options$transcludeMa;
-            mdxLoaderOptions = {
-              skipCsf: true,
-              remarkPlugins: [_remarkSlug.default, _remarkExternalLinks.default]
-            };
-            mdxVersion = (_global$FEATURES = _global.default.FEATURES) !== null && _global$FEATURES !== void 0 && _global$FEATURES.previewMdx2 ? 'MDX2' : 'MDX1';
-
-            _nodeLogger.logger.info("Addon-docs: using ".concat(mdxVersion));
-
-            mdxLoader = (_global$FEATURES2 = _global.default.FEATURES) !== null && _global$FEATURES2 !== void 0 && _global$FEATURES2.previewMdx2 ? require.resolve('@storybook/mdx2-csf/loader') : require.resolve('@storybook/mdx1-csf/loader'); // set `sourceLoaderOptions` to `null` to disable for manual configuration
-
-            sourceLoader = sourceLoaderOptions ? [{
-              test: /\.(stories|story)\.[tj]sx?$/,
-              loader: require.resolve('@storybook/source-loader'),
-              options: Object.assign({}, sourceLoaderOptions, {
-                inspectLocalDependencies: true
-              }),
-              enforce: 'pre'
-            }] : [];
-            rules = module.rules || [];
-
-            if (transcludeMarkdown) {
-              rules = [].concat(_toConsumableArray(rules.filter(function (rule) {
-                var _rule$test;
-
-                return ((_rule$test = rule.test) === null || _rule$test === void 0 ? void 0 : _rule$test.toString()) !== '/\\.md$/';
-              })), [{
-                test: /\.md$/,
-                use: [{
-                  loader: resolvedBabelLoader,
-                  options: createBabelOptions({
-                    babelOptions: babelOptions,
-                    mdxBabelOptions: mdxBabelOptions,
-                    configureJSX: configureJSX
-                  })
-                }, {
-                  loader: mdxLoader,
-                  options: mdxLoaderOptions
-                }]
-              }]);
-            }
-
-            result = Object.assign({}, webpackConfig, {
-              module: Object.assign({}, module, {
-                rules: [].concat(_toConsumableArray(rules), [{
-                  test: /\.js$/,
-                  include: new RegExp("node_modules\\".concat(_path.default.sep, "acorn-jsx")),
-                  use: [{
-                    loader: resolvedBabelLoader,
-                    options: {
-                      presets: [[require.resolve('@babel/preset-env'), {
-                        modules: 'commonjs'
-                      }]]
-                    }
-                  }]
-                }, {
-                  test: /(stories|story)\.mdx$/,
-                  use: [{
-                    loader: resolvedBabelLoader,
-                    options: createBabelOptions({
-                      babelOptions: babelOptions,
-                      mdxBabelOptions: mdxBabelOptions,
-                      configureJSX: configureJSX
-                    })
-                  }, {
-                    loader: mdxLoader
-                  }]
-                }, {
-                  test: /\.mdx$/,
-                  exclude: /(stories|story)\.mdx$/,
-                  use: [{
-                    loader: resolvedBabelLoader,
-                    options: createBabelOptions({
-                      babelOptions: babelOptions,
-                      mdxBabelOptions: mdxBabelOptions,
-                      configureJSX: configureJSX
-                    })
-                  }, {
-                    loader: mdxLoader,
-                    options: mdxLoaderOptions
-                  }]
-                }], sourceLoader)
-              })
-            });
-            return _context.abrupt("return", result);
-
-          case 14:
-          case "end":
-            return _context.stop();
-        }
-      }
-    }, _callee);
-  }));
-  return _webpack.apply(this, arguments);
-}
+const storyIndexers = async indexers => {
+  const mdxIndexer = async (fileName, opts) => {
+    let code = (await _fsExtra.default.readFile(fileName, 'utf-8')).toString(); // @ts-ignore
+
+    const {
+      compile
+    } = _global.default.FEATURES?.previewMdx2 ? await Promise.resolve().then(() => _interopRequireWildcard(require('@storybook/mdx2-csf'))) : await Promise.resolve().then(() => _interopRequireWildcard(require('@storybook/mdx1-csf')));
+    code = await compile(code, {});
+    return (0, _csfTools.loadCsf)(code, Object.assign({}, opts, {
+      fileName
+    })).parse();
+  };
+
+  return [{
+    test: /(stories|story)\.mdx$/,
+    indexer: mdxIndexer
+  }, ...(indexers || [])];
+};
+
+exports.storyIndexers = storyIndexers;

package/dist/cjs/preview.js

@@ -1,100 +1,22 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-
-require("core-js/modules/es.array.iterator.js");
-
-require("core-js/modules/es.string.iterator.js");
-
-require("core-js/modules/es.weak-map.js");
-
-require("core-js/modules/web.dom-collections.iterator.js");
-
-require("core-js/modules/es.object.get-own-property-descriptor.js");
-
-require("core-js/modules/es.symbol.js");
-
-require("core-js/modules/es.symbol.description.js");
-
-require("core-js/modules/es.symbol.iterator.js");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.parameters = void 0;
 
-require("regenerator-runtime/runtime.js");
-
-require("core-js/modules/es.object.to-string.js");
-
-require("core-js/modules/es.promise.js");
+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); }
 
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+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; }
 
-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; }
-
-function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
-
-function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
-
-var parameters = {
+const parameters = {
   docs: {
-    getContainer: function () {
-      var _getContainer = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
-        return regeneratorRuntime.wrap(function _callee$(_context) {
-          while (1) {
-            switch (_context.prev = _context.next) {
-              case 0:
-                _context.next = 2;
-                return Promise.resolve().then(function () {
-                  return _interopRequireWildcard(require('./blocks'));
-                });
-
-              case 2:
-                return _context.abrupt("return", _context.sent.DocsContainer);
-
-              case 3:
-              case "end":
-                return _context.stop();
-            }
-          }
-        }, _callee);
-      }));
-
-      function getContainer() {
-        return _getContainer.apply(this, arguments);
-      }
-
-      return getContainer;
-    }(),
-    getPage: function () {
-      var _getPage = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2() {
-        return regeneratorRuntime.wrap(function _callee2$(_context2) {
-          while (1) {
-            switch (_context2.prev = _context2.next) {
-              case 0:
-                _context2.next = 2;
-                return Promise.resolve().then(function () {
-                  return _interopRequireWildcard(require('./blocks'));
-                });
-
-              case 2:
-                return _context2.abrupt("return", _context2.sent.DocsPage);
-
-              case 3:
-              case "end":
-                return _context2.stop();
-            }
-          }
-        }, _callee2);
-      }));
-
-      function getPage() {
-        return _getPage.apply(this, arguments);
-      }
-
-      return getPage;
-    }()
+    renderer: async () => {
+      const {
+        DocsRenderer
+      } = await Promise.resolve().then(() => _interopRequireWildcard(require('./blocks')));
+      return new DocsRenderer();
+    }
   }
 };
 exports.parameters = parameters;

package/dist/cjs/shared.js

@@ -4,15 +4,15 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.SourceType = exports.SNIPPET_RENDERED = exports.PARAM_KEY = exports.PANEL_ID = exports.ADDON_ID = void 0;
-var ADDON_ID = 'storybook/docs';
+const ADDON_ID = 'storybook/docs';
 exports.ADDON_ID = ADDON_ID;
-var PANEL_ID = "".concat(ADDON_ID, "/panel");
+const PANEL_ID = `${ADDON_ID}/panel`;
 exports.PANEL_ID = PANEL_ID;
-var PARAM_KEY = "docs";
+const PARAM_KEY = `docs`;
 exports.PARAM_KEY = PARAM_KEY;
-var SNIPPET_RENDERED = "".concat(ADDON_ID, "/snippet-rendered");
+const SNIPPET_RENDERED = `${ADDON_ID}/snippet-rendered`;
 exports.SNIPPET_RENDERED = SNIPPET_RENDERED;
-var SourceType;
+let SourceType;
 exports.SourceType = SourceType;
 
 (function (SourceType) {

package/dist/esm/blocks/index.js

@@ -1,24 +1 @@
-export { ColorPalette, ColorItem, IconGallery, IconItem, Typeset } from '@storybook/components';
-export * from './Anchor';
-export * from './ArgsTable';
-export * from './Canvas';
-export * from './Description';
-export * from './DocsContext';
-export * from './DocsPage';
-export * from './DocsContainer';
-export * from './DocsStory';
-export * from './Heading';
-export * from './Meta';
-export * from './Preview';
-export * from './Primary';
-export * from './Props';
-export * from './Source';
-export * from './SourceContainer';
-export * from './Stories';
-export * from './Story';
-export * from './Subheading';
-export * from './Subtitle';
-export * from './Title';
-export * from './Wrapper';
-export * from './types';
-export * from './mdx';
+export * from '@storybook/blocks';

package/dist/esm/manager.js

@@ -1,21 +1,16 @@
-import "core-js/modules/es.array.concat.js";
 import { addons, types } from '@storybook/addons';
 import { ADDON_ID, PANEL_ID } from './shared';
-addons.register(ADDON_ID, function () {
+addons.register(ADDON_ID, () => {
   addons.add(PANEL_ID, {
     type: types.TAB,
     title: 'Docs',
-    route: function route(_ref) {
-      var storyId = _ref.storyId,
-          refId = _ref.refId;
-      return refId ? "/docs/".concat(refId, "_").concat(storyId) : "/docs/".concat(storyId);
-    },
-    match: function match(_ref2) {
-      var viewMode = _ref2.viewMode;
-      return viewMode === 'docs';
-    },
-    render: function render() {
-      return null;
-    }
+    route: ({
+      storyId,
+      refId
+    }) => refId ? `/docs/${refId}_${storyId}` : `/docs/${storyId}`,
+    match: ({
+      viewMode
+    }) => viewMode === 'docs',
+    render: () => null
   });
 });