@storybook/addon-docs 6.4.0-beta.21 → 6.4.0-beta.25

package/dist/cjs/blocks/DocsStory.js

@@ -70,7 +70,8 @@ var DocsStory = function DocsStory(_ref) {
   }), /*#__PURE__*/_react.default.createElement(_Canvas.Canvas, {
     withToolbar: withToolbar
   }, /*#__PURE__*/_react.default.createElement(_Story.Story, {
-    id: id
+    id: id,
+    parameters: parameters
   })));
 };
 

package/dist/cjs/frameworks/angular/compodoc.js

@@ -316,8 +316,10 @@ var extractDefaultValue = function extractDefaultValue(property) {
 };
 
 var resolveTypealias = function resolveTypealias(compodocType) {
+  var _compodocJson$miscell, _compodocJson$miscell2;
+
   var compodocJson = getCompodocJson();
-  var typeAlias = compodocJson === null || compodocJson === void 0 ? void 0 : compodocJson.miscellaneous.typealiases.find(function (x) {
+  var typeAlias = compodocJson === null || compodocJson === void 0 ? void 0 : (_compodocJson$miscell = compodocJson.miscellaneous) === null || _compodocJson$miscell === void 0 ? void 0 : (_compodocJson$miscell2 = _compodocJson$miscell.typealiases) === null || _compodocJson$miscell2 === void 0 ? void 0 : _compodocJson$miscell2.find(function (x) {
     return x.name === compodocType;
   });
   return typeAlias ? resolveTypealias(typeAlias.rawtype) : compodocType;

package/dist/cjs/frameworks/angular/sourceDecorator.js

@@ -1,21 +1,47 @@
 "use strict";
 
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+require("core-js/modules/es.weak-map.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.array.iterator.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.sourceDecorator = exports.skipSourceRender = void 0;
 
+require("regenerator-runtime/runtime.js");
+
+require("core-js/modules/es.promise.js");
+
+require("core-js/modules/es.object.to-string.js");
+
 var _addons = require("@storybook/addons");
 
 var _renderer = require("@storybook/angular/renderer");
 
-var _parserHtml = _interopRequireDefault(require("prettier/parser-html"));
+var _shared = require("../../shared");
 
-var _standalone = _interopRequireDefault(require("prettier/standalone"));
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
 
-var _shared = require("../../shared");
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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 _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); } }
+
+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 skipSourceRender = function skipSourceRender(context) {
   var _context$parameters$d;
@@ -32,16 +58,62 @@ var skipSourceRender = function skipSourceRender(context) {
 };
 
 exports.skipSourceRender = skipSourceRender;
-
-var prettyUp = function prettyUp(source) {
-  return _standalone.default.format(source, {
-    parser: 'angular',
-    plugins: [_parserHtml.default],
-    htmlWhitespaceSensitivity: 'ignore'
-  });
-};
+var prettyUpInternal;
+
+var makePrettyUp = /*#__PURE__*/function () {
+  var _ref = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+    var prettierHtml, prettier;
+    return regeneratorRuntime.wrap(function _callee$(_context) {
+      while (1) {
+        switch (_context.prev = _context.next) {
+          case 0:
+            if (!prettyUpInternal) {
+              _context.next = 2;
+              break;
+            }
+
+            return _context.abrupt("return", prettyUpInternal);
+
+          case 2:
+            _context.next = 4;
+            return Promise.resolve().then(function () {
+              return _interopRequireWildcard(require('prettier/parser-html'));
+            });
+
+          case 4:
+            prettierHtml = _context.sent;
+            _context.next = 7;
+            return Promise.resolve().then(function () {
+              return _interopRequireWildcard(require('prettier/standalone'));
+            });
+
+          case 7:
+            prettier = _context.sent;
+
+            prettyUpInternal = function prettyUpInternal(source) {
+              return prettier.format(source, {
+                parser: 'angular',
+                plugins: [prettierHtml],
+                htmlWhitespaceSensitivity: 'ignore'
+              });
+            };
+
+            return _context.abrupt("return", prettyUpInternal);
+
+          case 10:
+          case "end":
+            return _context.stop();
+        }
+      }
+    }, _callee);
+  }));
+
+  return function makePrettyUp() {
+    return _ref.apply(this, arguments);
+  };
+}();
 /**
- * Svelte source decorator.
+ * Angular source decorator.
  * @param storyFn Fn
  * @param context  StoryContext
  */
@@ -62,21 +134,25 @@ var sourceDecorator = function sourceDecorator(storyFn, context) {
   var component = context.component,
       argTypes = context.argTypes;
   var toEmit;
+  var prettyUpPromise = makePrettyUp();
   (0, _addons.useEffect)(function () {
-    if (toEmit) channel.emit(_shared.SNIPPET_RENDERED, context.id, prettyUp(template));
+    prettyUpPromise.then(function (prettyUp) {
+      if (toEmit) channel.emit(_shared.SNIPPET_RENDERED, context.id, prettyUp(toEmit));
+    });
   });
+  prettyUpPromise.then(function (prettyUp) {
+    if (component && !userDefinedTemplate) {
+      var _source = (0, _renderer.computesTemplateSourceFromComponent)(component, props, argTypes); // We might have a story with a Directive or Service defined as the component
+      // In these cases there might exist a template, even if we aren't able to create source from component
 
-  if (component && !userDefinedTemplate) {
-    var source = (0, _renderer.computesTemplateSourceFromComponent)(component, props, argTypes); // We might have a story with a Directive or Service defined as the component
-    // In these cases there might exist a template, even if we aren't able to create source from component
 
-    if (source || template) {
-      toEmit = prettyUp(source || template);
+      if (_source || template) {
+        toEmit = prettyUp(_source || template);
+      }
+    } else if (template) {
+      toEmit = prettyUp(template);
     }
-  } else if (template) {
-    toEmit = prettyUp(template);
-  }
-
+  });
   return story;
 };
 

package/dist/cjs/frameworks/vue/sourceDecorator.js

@@ -1,12 +1,6 @@
 "use strict";
 
-require("core-js/modules/es.symbol.js");
-
-require("core-js/modules/es.symbol.description.js");
-
-require("core-js/modules/es.object.to-string.js");
-
-require("core-js/modules/es.symbol.iterator.js");
+require("core-js/modules/es.weak-map.js");
 
 require("core-js/modules/es.string.iterator.js");
 
@@ -14,6 +8,14 @@ require("core-js/modules/es.array.iterator.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");
+
 require("core-js/modules/es.array.from.js");
 
 require("core-js/modules/es.array.slice.js");
@@ -26,6 +28,12 @@ Object.defineProperty(exports, "__esModule", {
 exports.vnodeToString = vnodeToString;
 exports.sourceDecorator = exports.skipSourceRender = void 0;
 
+require("regenerator-runtime/runtime.js");
+
+require("core-js/modules/es.promise.js");
+
+require("core-js/modules/es.object.to-string.js");
+
 require("core-js/modules/es.array.join.js");
 
 require("core-js/modules/es.array.filter.js");
@@ -52,14 +60,8 @@ var _addons = require("@storybook/addons");
 
 var _clientLogger = require("@storybook/client-logger");
 
-var _standalone = _interopRequireDefault(require("prettier/standalone"));
-
-var _parserHtml = _interopRequireDefault(require("prettier/parser-html"));
-
 var _shared = require("../../shared");
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
 
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
@@ -82,6 +84,14 @@ function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToAr
 
 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 _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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 skipSourceRender = function skipSourceRender(context) {
   var _context$parameters$d;
 
@@ -125,13 +135,50 @@ var sourceDecorator = function sourceDecorator(storyFn, context) {
       try {
         var storyNode = lookupStoryInstance(this, storyComponent);
         var code = vnodeToString(storyNode._vnode);
-        channel.emit(_shared.SNIPPET_RENDERED, (context || {}).id, _standalone.default.format("<template>".concat(code, "</template>"), {
-          parser: 'vue',
-          plugins: [_parserHtml.default],
-          // Because the parsed vnode missing spaces right before/after the surround tag,
-          // we always get weird wrapped code without this option.
-          htmlWhitespaceSensitivity: 'ignore'
-        }));
+
+        var emitFormattedTemplate = /*#__PURE__*/function () {
+          var _ref = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+            var prettier, prettierHtml;
+            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('prettier/standalone'));
+                    });
+
+                  case 2:
+                    prettier = _context.sent;
+                    _context.next = 5;
+                    return Promise.resolve().then(function () {
+                      return _interopRequireWildcard(require('prettier/parser-html'));
+                    });
+
+                  case 5:
+                    prettierHtml = _context.sent;
+                    channel.emit(_shared.SNIPPET_RENDERED, (context || {}).id, prettier.format("<template>".concat(code, "</template>"), {
+                      parser: 'vue',
+                      plugins: [prettierHtml],
+                      // Because the parsed vnode missing spaces right before/after the surround tag,
+                      // we always get weird wrapped code without this option.
+                      htmlWhitespaceSensitivity: 'ignore'
+                    }));
+
+                  case 7:
+                  case "end":
+                    return _context.stop();
+                }
+              }
+            }, _callee);
+          }));
+
+          return function emitFormattedTemplate() {
+            return _ref.apply(this, arguments);
+          };
+        }();
+
+        emitFormattedTemplate();
       } catch (e) {
         _clientLogger.logger.warn("Failed to generate dynamic story source: ".concat(e));
       }
@@ -145,17 +192,17 @@ exports.sourceDecorator = sourceDecorator;
 function vnodeToString(vnode) {
   var _vnode$data, _vnode$componentOptio, _vnode$data2;
 
-  var attrString = [].concat(_toConsumableArray((_vnode$data = vnode.data) !== null && _vnode$data !== void 0 && _vnode$data.slot ? [['slot', vnode.data.slot]] : []), [['class', stringifyClassAttribute(vnode)]], _toConsumableArray((_vnode$componentOptio = vnode.componentOptions) !== null && _vnode$componentOptio !== void 0 && _vnode$componentOptio.propsData ? Object.entries(vnode.componentOptions.propsData) : []), _toConsumableArray((_vnode$data2 = vnode.data) !== null && _vnode$data2 !== void 0 && _vnode$data2.attrs ? Object.entries(vnode.data.attrs) : [])).filter(function (_ref, index, list) {
-    var _ref2 = _slicedToArray(_ref, 1),
-        name = _ref2[0];
+  var attrString = [].concat(_toConsumableArray((_vnode$data = vnode.data) !== null && _vnode$data !== void 0 && _vnode$data.slot ? [['slot', vnode.data.slot]] : []), [['class', stringifyClassAttribute(vnode)]], _toConsumableArray((_vnode$componentOptio = vnode.componentOptions) !== null && _vnode$componentOptio !== void 0 && _vnode$componentOptio.propsData ? Object.entries(vnode.componentOptions.propsData) : []), _toConsumableArray((_vnode$data2 = vnode.data) !== null && _vnode$data2 !== void 0 && _vnode$data2.attrs ? Object.entries(vnode.data.attrs) : [])).filter(function (_ref2, index, list) {
+    var _ref3 = _slicedToArray(_ref2, 1),
+        name = _ref3[0];
 
     return list.findIndex(function (item) {
       return item[0] === name;
     }) === index;
-  }).map(function (_ref3) {
-    var _ref4 = _slicedToArray(_ref3, 2),
-        name = _ref4[0],
-        value = _ref4[1];
+  }).map(function (_ref4) {
+    var _ref5 = _slicedToArray(_ref4, 2),
+        name = _ref5[0],
+        value = _ref5[1];
 
     return stringifyAttr(name, value);
   }).filter(Boolean).join(' ');
@@ -222,14 +269,14 @@ function normalizeClassBinding(binding) {
   }
 
   if (_typeof(binding) === 'object') {
-    return Object.entries(binding).filter(function (_ref5) {
-      var _ref6 = _slicedToArray(_ref5, 2),
-          active = _ref6[1];
+    return Object.entries(binding).filter(function (_ref6) {
+      var _ref7 = _slicedToArray(_ref6, 2),
+          active = _ref7[1];
 
       return !!active;
-    }).map(function (_ref7) {
-      var _ref8 = _slicedToArray(_ref7, 1),
-          className = _ref8[0];
+    }).map(function (_ref8) {
+      var _ref9 = _slicedToArray(_ref8, 1),
+          className = _ref9[0];
 
       return className;
     });

package/dist/esm/blocks/DocsStory.js

@@ -49,6 +49,7 @@ export var DocsStory = function DocsStory(_ref) {
   }), /*#__PURE__*/React.createElement(Canvas, {
     withToolbar: withToolbar
   }, /*#__PURE__*/React.createElement(Story, {
-    id: id
+    id: id,
+    parameters: parameters
   })));
 };

package/dist/esm/frameworks/angular/compodoc.js

@@ -274,8 +274,10 @@ var extractDefaultValue = function extractDefaultValue(property) {
 };
 
 var resolveTypealias = function resolveTypealias(compodocType) {
+  var _compodocJson$miscell, _compodocJson$miscell2;
+
   var compodocJson = getCompodocJson();
-  var typeAlias = compodocJson === null || compodocJson === void 0 ? void 0 : compodocJson.miscellaneous.typealiases.find(function (x) {
+  var typeAlias = compodocJson === null || compodocJson === void 0 ? void 0 : (_compodocJson$miscell = compodocJson.miscellaneous) === null || _compodocJson$miscell === void 0 ? void 0 : (_compodocJson$miscell2 = _compodocJson$miscell.typealiases) === null || _compodocJson$miscell2 === void 0 ? void 0 : _compodocJson$miscell2.find(function (x) {
     return x.name === compodocType;
   });
   return typeAlias ? resolveTypealias(typeAlias.rawtype) : compodocType;

package/dist/esm/frameworks/angular/sourceDecorator.js

@@ -1,7 +1,13 @@
+import "regenerator-runtime/runtime.js";
+import "core-js/modules/es.promise.js";
+import "core-js/modules/es.object.to-string.js";
+
+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); }); }; }
+
 import { addons, useEffect } from '@storybook/addons';
 import { computesTemplateSourceFromComponent } from '@storybook/angular/renderer';
-import prettierHtml from 'prettier/parser-html';
-import prettier from 'prettier/standalone';
 import { SNIPPET_RENDERED, SourceType } from '../../shared';
 export var skipSourceRender = function skipSourceRender(context) {
   var _context$parameters$d;
@@ -16,16 +22,58 @@ export var skipSourceRender = function skipSourceRender(context) {
 
   return (sourceParams === null || sourceParams === void 0 ? void 0 : sourceParams.code) || (sourceParams === null || sourceParams === void 0 ? void 0 : sourceParams.type) === SourceType.CODE;
 };
+var prettyUpInternal;
 
-var prettyUp = function prettyUp(source) {
-  return prettier.format(source, {
-    parser: 'angular',
-    plugins: [prettierHtml],
-    htmlWhitespaceSensitivity: 'ignore'
-  });
-};
+var makePrettyUp = /*#__PURE__*/function () {
+  var _ref = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+    var prettierHtml, prettier;
+    return regeneratorRuntime.wrap(function _callee$(_context) {
+      while (1) {
+        switch (_context.prev = _context.next) {
+          case 0:
+            if (!prettyUpInternal) {
+              _context.next = 2;
+              break;
+            }
+
+            return _context.abrupt("return", prettyUpInternal);
+
+          case 2:
+            _context.next = 4;
+            return import('prettier/parser-html');
+
+          case 4:
+            prettierHtml = _context.sent;
+            _context.next = 7;
+            return import('prettier/standalone');
+
+          case 7:
+            prettier = _context.sent;
+
+            prettyUpInternal = function prettyUpInternal(source) {
+              return prettier.format(source, {
+                parser: 'angular',
+                plugins: [prettierHtml],
+                htmlWhitespaceSensitivity: 'ignore'
+              });
+            };
+
+            return _context.abrupt("return", prettyUpInternal);
+
+          case 10:
+          case "end":
+            return _context.stop();
+        }
+      }
+    }, _callee);
+  }));
+
+  return function makePrettyUp() {
+    return _ref.apply(this, arguments);
+  };
+}();
 /**
- * Svelte source decorator.
+ * Angular source decorator.
  * @param storyFn Fn
  * @param context  StoryContext
  */
@@ -45,20 +93,24 @@ export var sourceDecorator = function sourceDecorator(storyFn, context) {
   var component = context.component,
       argTypes = context.argTypes;
   var toEmit;
+  var prettyUpPromise = makePrettyUp();
   useEffect(function () {
-    if (toEmit) channel.emit(SNIPPET_RENDERED, context.id, prettyUp(template));
+    prettyUpPromise.then(function (prettyUp) {
+      if (toEmit) channel.emit(SNIPPET_RENDERED, context.id, prettyUp(toEmit));
+    });
   });
+  prettyUpPromise.then(function (prettyUp) {
+    if (component && !userDefinedTemplate) {
+      var _source = computesTemplateSourceFromComponent(component, props, argTypes); // We might have a story with a Directive or Service defined as the component
+      // In these cases there might exist a template, even if we aren't able to create source from component
 
-  if (component && !userDefinedTemplate) {
-    var source = computesTemplateSourceFromComponent(component, props, argTypes); // We might have a story with a Directive or Service defined as the component
-    // In these cases there might exist a template, even if we aren't able to create source from component
 
-    if (source || template) {
-      toEmit = prettyUp(source || template);
+      if (_source || template) {
+        toEmit = prettyUp(_source || template);
+      }
+    } else if (template) {
+      toEmit = prettyUp(template);
     }
-  } else if (template) {
-    toEmit = prettyUp(template);
-  }
-
+  });
   return story;
 };

package/dist/esm/frameworks/vue/sourceDecorator.js

@@ -20,6 +20,9 @@ function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToAr
 
 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; }
 
+import "regenerator-runtime/runtime.js";
+import "core-js/modules/es.promise.js";
+import "core-js/modules/es.object.to-string.js";
 import "core-js/modules/es.array.join.js";
 import "core-js/modules/es.array.filter.js";
 import "core-js/modules/es.array.map.js";
@@ -33,7 +36,6 @@ import "core-js/modules/es.array.includes.js";
 import "core-js/modules/es.string.includes.js";
 import "core-js/modules/es.symbol.js";
 import "core-js/modules/es.symbol.description.js";
-import "core-js/modules/es.object.to-string.js";
 import "core-js/modules/es.symbol.iterator.js";
 import "core-js/modules/es.string.iterator.js";
 import "core-js/modules/es.array.iterator.js";
@@ -42,11 +44,13 @@ import "core-js/modules/es.array.from.js";
 import "core-js/modules/es.array.slice.js";
 import "core-js/modules/es.function.name.js";
 
+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); }); }; }
+
 /* eslint no-underscore-dangle: ["error", { "allow": ["_vnode"] }] */
 import { addons } from '@storybook/addons';
 import { logger } from '@storybook/client-logger';
-import prettier from 'prettier/standalone';
-import prettierHtml from 'prettier/parser-html';
 import { SourceType, SNIPPET_RENDERED } from '../../shared';
 export var skipSourceRender = function skipSourceRender(context) {
   var _context$parameters$d;
@@ -87,13 +91,46 @@ export var sourceDecorator = function sourceDecorator(storyFn, context) {
       try {
         var storyNode = lookupStoryInstance(this, storyComponent);
         var code = vnodeToString(storyNode._vnode);
-        channel.emit(SNIPPET_RENDERED, (context || {}).id, prettier.format("<template>".concat(code, "</template>"), {
-          parser: 'vue',
-          plugins: [prettierHtml],
-          // Because the parsed vnode missing spaces right before/after the surround tag,
-          // we always get weird wrapped code without this option.
-          htmlWhitespaceSensitivity: 'ignore'
-        }));
+
+        var emitFormattedTemplate = /*#__PURE__*/function () {
+          var _ref = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+            var prettier, prettierHtml;
+            return regeneratorRuntime.wrap(function _callee$(_context) {
+              while (1) {
+                switch (_context.prev = _context.next) {
+                  case 0:
+                    _context.next = 2;
+                    return import('prettier/standalone');
+
+                  case 2:
+                    prettier = _context.sent;
+                    _context.next = 5;
+                    return import('prettier/parser-html');
+
+                  case 5:
+                    prettierHtml = _context.sent;
+                    channel.emit(SNIPPET_RENDERED, (context || {}).id, prettier.format("<template>".concat(code, "</template>"), {
+                      parser: 'vue',
+                      plugins: [prettierHtml],
+                      // Because the parsed vnode missing spaces right before/after the surround tag,
+                      // we always get weird wrapped code without this option.
+                      htmlWhitespaceSensitivity: 'ignore'
+                    }));
+
+                  case 7:
+                  case "end":
+                    return _context.stop();
+                }
+              }
+            }, _callee);
+          }));
+
+          return function emitFormattedTemplate() {
+            return _ref.apply(this, arguments);
+          };
+        }();
+
+        emitFormattedTemplate();
       } catch (e) {
         logger.warn("Failed to generate dynamic story source: ".concat(e));
       }
@@ -104,17 +141,17 @@ export var sourceDecorator = function sourceDecorator(storyFn, context) {
 export function vnodeToString(vnode) {
   var _vnode$data, _vnode$componentOptio, _vnode$data2;
 
-  var attrString = [].concat(_toConsumableArray((_vnode$data = vnode.data) !== null && _vnode$data !== void 0 && _vnode$data.slot ? [['slot', vnode.data.slot]] : []), [['class', stringifyClassAttribute(vnode)]], _toConsumableArray((_vnode$componentOptio = vnode.componentOptions) !== null && _vnode$componentOptio !== void 0 && _vnode$componentOptio.propsData ? Object.entries(vnode.componentOptions.propsData) : []), _toConsumableArray((_vnode$data2 = vnode.data) !== null && _vnode$data2 !== void 0 && _vnode$data2.attrs ? Object.entries(vnode.data.attrs) : [])).filter(function (_ref, index, list) {
-    var _ref2 = _slicedToArray(_ref, 1),
-        name = _ref2[0];
+  var attrString = [].concat(_toConsumableArray((_vnode$data = vnode.data) !== null && _vnode$data !== void 0 && _vnode$data.slot ? [['slot', vnode.data.slot]] : []), [['class', stringifyClassAttribute(vnode)]], _toConsumableArray((_vnode$componentOptio = vnode.componentOptions) !== null && _vnode$componentOptio !== void 0 && _vnode$componentOptio.propsData ? Object.entries(vnode.componentOptions.propsData) : []), _toConsumableArray((_vnode$data2 = vnode.data) !== null && _vnode$data2 !== void 0 && _vnode$data2.attrs ? Object.entries(vnode.data.attrs) : [])).filter(function (_ref2, index, list) {
+    var _ref3 = _slicedToArray(_ref2, 1),
+        name = _ref3[0];
 
     return list.findIndex(function (item) {
       return item[0] === name;
     }) === index;
-  }).map(function (_ref3) {
-    var _ref4 = _slicedToArray(_ref3, 2),
-        name = _ref4[0],
-        value = _ref4[1];
+  }).map(function (_ref4) {
+    var _ref5 = _slicedToArray(_ref4, 2),
+        name = _ref5[0],
+        value = _ref5[1];
 
     return stringifyAttr(name, value);
   }).filter(Boolean).join(' ');
@@ -181,14 +218,14 @@ function normalizeClassBinding(binding) {
   }
 
   if (_typeof(binding) === 'object') {
-    return Object.entries(binding).filter(function (_ref5) {
-      var _ref6 = _slicedToArray(_ref5, 2),
-          active = _ref6[1];
+    return Object.entries(binding).filter(function (_ref6) {
+      var _ref7 = _slicedToArray(_ref6, 2),
+          active = _ref7[1];
 
       return !!active;
-    }).map(function (_ref7) {
-      var _ref8 = _slicedToArray(_ref7, 1),
-          className = _ref8[0];
+    }).map(function (_ref8) {
+      var _ref9 = _slicedToArray(_ref8, 1),
+          className = _ref9[0];
 
       return className;
     });

package/dist/modern/blocks/DocsStory.js

@@ -42,6 +42,7 @@ export const DocsStory = ({
   }), /*#__PURE__*/React.createElement(Canvas, {
     withToolbar: withToolbar
   }, /*#__PURE__*/React.createElement(Story, {
-    id: id
+    id: id,
+    parameters: parameters
   })));
 };

package/dist/modern/frameworks/angular/compodoc.js

@@ -225,8 +225,10 @@ const extractDefaultValue = property => {
 };
 
 const resolveTypealias = compodocType => {
+  var _compodocJson$miscell, _compodocJson$miscell2;
+
   const compodocJson = getCompodocJson();
-  const typeAlias = compodocJson === null || compodocJson === void 0 ? void 0 : compodocJson.miscellaneous.typealiases.find(x => x.name === compodocType);
+  const typeAlias = compodocJson === null || compodocJson === void 0 ? void 0 : (_compodocJson$miscell = compodocJson.miscellaneous) === null || _compodocJson$miscell === void 0 ? void 0 : (_compodocJson$miscell2 = _compodocJson$miscell.typealiases) === null || _compodocJson$miscell2 === void 0 ? void 0 : _compodocJson$miscell2.find(x => x.name === compodocType);
   return typeAlias ? resolveTypealias(typeAlias.rawtype) : compodocType;
 };
 

package/dist/modern/frameworks/angular/sourceDecorator.js

@@ -1,7 +1,5 @@
 import { addons, useEffect } from '@storybook/addons';
 import { computesTemplateSourceFromComponent } from '@storybook/angular/renderer';
-import prettierHtml from 'prettier/parser-html';
-import prettier from 'prettier/standalone';
 import { SNIPPET_RENDERED, SourceType } from '../../shared';
 export const skipSourceRender = context => {
   var _context$parameters$d;
@@ -16,16 +14,28 @@ export const skipSourceRender = context => {
 
   return (sourceParams === null || sourceParams === void 0 ? void 0 : sourceParams.code) || (sourceParams === null || sourceParams === void 0 ? void 0 : sourceParams.type) === SourceType.CODE;
 };
+let prettyUpInternal;
 
-const prettyUp = source => {
-  return prettier.format(source, {
-    parser: 'angular',
-    plugins: [prettierHtml],
-    htmlWhitespaceSensitivity: 'ignore'
-  });
+const makePrettyUp = async () => {
+  if (prettyUpInternal) {
+    return prettyUpInternal;
+  }
+
+  const prettierHtml = await import('prettier/parser-html');
+  const prettier = await import('prettier/standalone');
+
+  prettyUpInternal = source => {
+    return prettier.format(source, {
+      parser: 'angular',
+      plugins: [prettierHtml],
+      htmlWhitespaceSensitivity: 'ignore'
+    });
+  };
+
+  return prettyUpInternal;
 };
 /**
- * Svelte source decorator.
+ * Angular source decorator.
  * @param storyFn Fn
  * @param context  StoryContext
  */
@@ -49,20 +59,23 @@ export const sourceDecorator = (storyFn, context) => {
     argTypes
   } = context;
   let toEmit;
+  const prettyUpPromise = makePrettyUp();
   useEffect(() => {
-    if (toEmit) channel.emit(SNIPPET_RENDERED, context.id, prettyUp(template));
+    prettyUpPromise.then(prettyUp => {
+      if (toEmit) channel.emit(SNIPPET_RENDERED, context.id, prettyUp(toEmit));
+    });
   });
+  prettyUpPromise.then(prettyUp => {
+    if (component && !userDefinedTemplate) {
+      const source = computesTemplateSourceFromComponent(component, props, argTypes); // We might have a story with a Directive or Service defined as the component
+      // In these cases there might exist a template, even if we aren't able to create source from component
 
-  if (component && !userDefinedTemplate) {
-    const source = computesTemplateSourceFromComponent(component, props, argTypes); // We might have a story with a Directive or Service defined as the component
-    // In these cases there might exist a template, even if we aren't able to create source from component
-
-    if (source || template) {
-      toEmit = prettyUp(source || template);
+      if (source || template) {
+        toEmit = prettyUp(source || template);
+      }
+    } else if (template) {
+      toEmit = prettyUp(template);
     }
-  } else if (template) {
-    toEmit = prettyUp(template);
-  }
-
+  });
   return story;
 };

package/dist/modern/frameworks/vue/sourceDecorator.js

@@ -3,8 +3,6 @@ import "core-js/modules/es.array.reduce.js";
 /* eslint no-underscore-dangle: ["error", { "allow": ["_vnode"] }] */
 import { addons } from '@storybook/addons';
 import { logger } from '@storybook/client-logger';
-import prettier from 'prettier/standalone';
-import prettierHtml from 'prettier/parser-html';
 import { SourceType, SNIPPET_RENDERED } from '../../shared';
 export const skipSourceRender = context => {
   var _context$parameters$d;
@@ -46,13 +44,20 @@ export const sourceDecorator = (storyFn, context) => {
       try {
         const storyNode = lookupStoryInstance(this, storyComponent);
         const code = vnodeToString(storyNode._vnode);
-        channel.emit(SNIPPET_RENDERED, (context || {}).id, prettier.format(`<template>${code}</template>`, {
-          parser: 'vue',
-          plugins: [prettierHtml],
-          // Because the parsed vnode missing spaces right before/after the surround tag,
-          // we always get weird wrapped code without this option.
-          htmlWhitespaceSensitivity: 'ignore'
-        }));
+
+        const emitFormattedTemplate = async () => {
+          const prettier = await import('prettier/standalone');
+          const prettierHtml = await import('prettier/parser-html');
+          channel.emit(SNIPPET_RENDERED, (context || {}).id, prettier.format(`<template>${code}</template>`, {
+            parser: 'vue',
+            plugins: [prettierHtml],
+            // Because the parsed vnode missing spaces right before/after the surround tag,
+            // we always get weird wrapped code without this option.
+            htmlWhitespaceSensitivity: 'ignore'
+          }));
+        };
+
+        emitFormattedTemplate();
       } catch (e) {
         logger.warn(`Failed to generate dynamic story source: ${e}`);
       }

package/dist/ts3.4/frameworks/angular/sourceDecorator.d.ts

@@ -2,7 +2,7 @@ import { PartialStoryFn } from '@storybook/csf';
 import { StoryContext, AngularFramework } from '@storybook/angular';
 export declare const skipSourceRender: (context: StoryContext) => any;
 /**
- * Svelte source decorator.
+ * Angular source decorator.
  * @param storyFn Fn
  * @param context  StoryContext
  */

package/dist/ts3.9/frameworks/angular/sourceDecorator.d.ts

@@ -2,7 +2,7 @@ import { PartialStoryFn } from '@storybook/csf';
 import { StoryContext, AngularFramework } from '@storybook/angular';
 export declare const skipSourceRender: (context: StoryContext) => any;
 /**
- * Svelte source decorator.
+ * Angular source decorator.
  * @param storyFn Fn
  * @param context  StoryContext
  */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-docs",
-  "version": "6.4.0-beta.21",
+  "version": "6.4.0-beta.25",
   "description": "Document component usage and properties in Markdown",
   "keywords": [
     "addon",
@@ -63,21 +63,21 @@
     "@mdx-js/loader": "^1.6.22",
     "@mdx-js/mdx": "^1.6.22",
     "@mdx-js/react": "^1.6.22",
-    "@storybook/addons": "6.4.0-beta.21",
-    "@storybook/api": "6.4.0-beta.21",
-    "@storybook/builder-webpack4": "6.4.0-beta.21",
-    "@storybook/client-logger": "6.4.0-beta.21",
-    "@storybook/components": "6.4.0-beta.21",
-    "@storybook/core": "6.4.0-beta.21",
-    "@storybook/core-events": "6.4.0-beta.21",
+    "@storybook/addons": "6.4.0-beta.25",
+    "@storybook/api": "6.4.0-beta.25",
+    "@storybook/builder-webpack4": "6.4.0-beta.25",
+    "@storybook/client-logger": "6.4.0-beta.25",
+    "@storybook/components": "6.4.0-beta.25",
+    "@storybook/core": "6.4.0-beta.25",
+    "@storybook/core-events": "6.4.0-beta.25",
     "@storybook/csf": "0.0.2--canary.87bc651.0",
-    "@storybook/csf-tools": "6.4.0-beta.21",
-    "@storybook/node-logger": "6.4.0-beta.21",
-    "@storybook/postinstall": "6.4.0-beta.21",
-    "@storybook/preview-web": "6.4.0-beta.21",
-    "@storybook/source-loader": "6.4.0-beta.21",
-    "@storybook/store": "6.4.0-beta.21",
-    "@storybook/theming": "6.4.0-beta.21",
+    "@storybook/csf-tools": "6.4.0-beta.25",
+    "@storybook/node-logger": "6.4.0-beta.25",
+    "@storybook/postinstall": "6.4.0-beta.25",
+    "@storybook/preview-web": "6.4.0-beta.25",
+    "@storybook/source-loader": "6.4.0-beta.25",
+    "@storybook/store": "6.4.0-beta.25",
+    "@storybook/theming": "6.4.0-beta.25",
     "acorn": "^7.4.1",
     "acorn-jsx": "^5.3.1",
     "acorn-walk": "^7.2.0",
@@ -106,11 +106,11 @@
     "@babel/core": "^7.12.10",
     "@emotion/core": "^10.1.1",
     "@emotion/styled": "^10.0.27",
-    "@storybook/angular": "6.4.0-beta.21",
-    "@storybook/html": "6.4.0-beta.21",
-    "@storybook/react": "6.4.0-beta.21",
-    "@storybook/vue": "6.4.0-beta.21",
-    "@storybook/web-components": "6.4.0-beta.21",
+    "@storybook/angular": "6.4.0-beta.25",
+    "@storybook/html": "6.4.0-beta.25",
+    "@storybook/react": "6.4.0-beta.25",
+    "@storybook/vue": "6.4.0-beta.25",
+    "@storybook/web-components": "6.4.0-beta.25",
     "@types/cross-spawn": "^6.0.2",
     "@types/doctrine": "^0.0.3",
     "@types/enzyme": "^3.10.8",
@@ -140,12 +140,12 @@
     "zone.js": "^0.11.3"
   },
   "peerDependencies": {
-    "@storybook/angular": "6.4.0-beta.21",
-    "@storybook/html": "6.4.0-beta.21",
-    "@storybook/react": "6.4.0-beta.21",
-    "@storybook/vue": "6.4.0-beta.21",
-    "@storybook/vue3": "6.4.0-beta.21",
-    "@storybook/web-components": "6.4.0-beta.21",
+    "@storybook/angular": "6.4.0-beta.25",
+    "@storybook/html": "6.4.0-beta.25",
+    "@storybook/react": "6.4.0-beta.25",
+    "@storybook/vue": "6.4.0-beta.25",
+    "@storybook/vue3": "6.4.0-beta.25",
+    "@storybook/web-components": "6.4.0-beta.25",
     "lit": "^2.0.0-rc.1",
     "lit-html": "^1.4.1 || ^2.0.0-rc.3",
     "react": "^16.8.0 || ^17.0.0",
@@ -202,7 +202,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "eb83ef6aefb6791324e2c70567bdc128cef09d92",
+  "gitHead": "5bf101067e5b9387ce092301bea6ab4ee432f777",
   "sbmodern": "dist/modern/index.js",
   "storybook": {
     "displayName": "Docs",