@storybook/addon-docs 6.5.0-alpha.5 → 6.5.0-alpha.52

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-docs",
-  "version": "6.5.0-alpha.5",
+  "version": "6.5.0-alpha.52",
   "description": "Document component usage and properties in Markdown",
   "keywords": [
     "addon",
@@ -40,6 +40,7 @@
     "common/**/*",
     "ember/**/*",
     "html/**/*",
+    "svelte/**/*",
     "postinstall/**/*",
     "react/**/*",
     "vue/**/*",
@@ -54,130 +55,54 @@
     "prepare": "node ../../scripts/prepare.js"
   },
   "dependencies": {
-    "@babel/core": "^7.12.10",
-    "@babel/generator": "^7.12.11",
-    "@babel/parser": "^7.12.11",
     "@babel/plugin-transform-react-jsx": "^7.12.12",
     "@babel/preset-env": "^7.12.11",
     "@jest/transform": "^26.6.2",
-    "@mdx-js/loader": "^1.6.22",
-    "@mdx-js/mdx": "^1.6.22",
     "@mdx-js/react": "^1.6.22",
-    "@storybook/addons": "6.5.0-alpha.5",
-    "@storybook/api": "6.5.0-alpha.5",
-    "@storybook/builder-webpack4": "6.5.0-alpha.5",
-    "@storybook/client-logger": "6.5.0-alpha.5",
-    "@storybook/components": "6.5.0-alpha.5",
-    "@storybook/core": "6.5.0-alpha.5",
-    "@storybook/core-events": "6.5.0-alpha.5",
-    "@storybook/csf": "0.0.2--canary.87bc651.0",
-    "@storybook/csf-tools": "6.5.0-alpha.5",
-    "@storybook/node-logger": "6.5.0-alpha.5",
-    "@storybook/postinstall": "6.5.0-alpha.5",
-    "@storybook/preview-web": "6.5.0-alpha.5",
-    "@storybook/source-loader": "6.5.0-alpha.5",
-    "@storybook/store": "6.5.0-alpha.5",
-    "@storybook/theming": "6.5.0-alpha.5",
-    "acorn": "^7.4.1",
-    "acorn-jsx": "^5.3.1",
-    "acorn-walk": "^7.2.0",
+    "@storybook/addons": "6.5.0-alpha.52",
+    "@storybook/api": "6.5.0-alpha.52",
+    "@storybook/components": "6.5.0-alpha.52",
+    "@storybook/core-common": "6.5.0-alpha.52",
+    "@storybook/core-events": "6.5.0-alpha.52",
+    "@storybook/csf": "0.0.2--canary.507502b.0",
+    "@storybook/docs-tools": "6.5.0-alpha.52",
+    "@storybook/mdx1-csf": "canary",
+    "@storybook/node-logger": "6.5.0-alpha.52",
+    "@storybook/postinstall": "6.5.0-alpha.52",
+    "@storybook/preview-web": "6.5.0-alpha.52",
+    "@storybook/source-loader": "6.5.0-alpha.52",
+    "@storybook/store": "6.5.0-alpha.52",
+    "@storybook/theming": "6.5.0-alpha.52",
     "core-js": "^3.8.2",
-    "doctrine": "^3.0.0",
-    "escodegen": "^2.0.0",
     "fast-deep-equal": "^3.1.3",
     "global": "^4.4.0",
-    "html-tags": "^3.1.0",
-    "js-string-escape": "^1.0.1",
-    "loader-utils": "^2.0.0",
     "lodash": "^4.17.21",
-    "nanoid": "^3.1.23",
-    "p-limit": "^3.1.0",
-    "prettier": "^2.2.1",
-    "prop-types": "^15.7.2",
-    "react-element-to-jsx-string": "^14.3.4",
-    "regenerator-runtime": "^0.13.7",
     "remark-external-links": "^8.0.0",
     "remark-slug": "^6.0.0",
     "ts-dedent": "^2.0.0",
     "util-deprecate": "^1.0.2"
   },
   "devDependencies": {
-    "@angular/core": "^11.2.14",
     "@babel/core": "^7.12.10",
-    "@emotion/core": "^10.3.1",
-    "@emotion/styled": "^10.0.27",
-    "@storybook/angular": "6.5.0-alpha.5",
-    "@storybook/html": "6.5.0-alpha.5",
-    "@storybook/react": "6.5.0-alpha.5",
-    "@storybook/vue": "6.5.0-alpha.5",
-    "@storybook/web-components": "6.5.0-alpha.5",
-    "@types/cross-spawn": "^6.0.2",
-    "@types/doctrine": "^0.0.3",
-    "@types/enzyme": "^3.10.8",
-    "@types/estree": "^0.0.44",
-    "@types/jest": "^26.0.16",
-    "@types/loader-utils": "^2.0.0",
-    "@types/prop-types": "^15.7.3",
-    "@types/tmp": "^0.2.0",
+    "@storybook/mdx2-csf": "canary",
     "@types/util-deprecate": "^1.0.0",
     "babel-loader": "^8.0.0",
-    "babel-plugin-react-docgen": "^4.2.1",
-    "cross-spawn": "^7.0.3",
-    "fs-extra": "^9.0.1",
-    "jest": "^26.6.3",
-    "jest-specific-snapshot": "^4.0.0",
-    "lit-element": "^3.0.2",
-    "lit-html": "^2.0.2",
-    "require-from-string": "^2.0.2",
-    "rxjs": "^6.6.3",
-    "styled-components": "^5.2.1",
-    "terser-webpack-plugin": "^5.0.3",
-    "tmp": "^0.2.1",
-    "tslib": "^2.1.0",
-    "vue": "^2.6.10",
-    "web-component-analyzer": "^1.1.6",
-    "webpack": "4",
-    "zone.js": "^0.11.3"
+    "webpack": "4"
   },
   "peerDependencies": {
-    "@storybook/angular": "6.5.0-alpha.5",
-    "@storybook/html": "6.5.0-alpha.5",
-    "@storybook/react": "6.5.0-alpha.5",
-    "@storybook/vue": "6.5.0-alpha.5",
-    "@storybook/vue3": "6.5.0-alpha.5",
-    "@storybook/web-components": "6.5.0-alpha.5",
-    "lit": "^2.0.0",
-    "lit-html": "^1.4.1 || ^2.0.0",
+    "@storybook/mdx2-csf": "*",
     "react": "^16.8.0 || ^17.0.0",
     "react-dom": "^16.8.0 || ^17.0.0",
-    "svelte": "^3.31.2",
-    "sveltedoc-parser": "^4.1.0",
-    "vue": "^2.6.10 || ^3.0.0",
     "webpack": "*"
   },
   "peerDependenciesMeta": {
-    "@storybook/angular": {
-      "optional": true
-    },
-    "@storybook/html": {
-      "optional": true
-    },
-    "@storybook/react": {
-      "optional": true
-    },
-    "@storybook/vue": {
-      "optional": true
-    },
-    "@storybook/vue3": {
+    "@storybook/builder-webpack4": {
       "optional": true
     },
-    "@storybook/web-components": {
+    "@storybook/builder-webpack5": {
       "optional": true
     },
-    "lit": {
-      "optional": true
-    },
-    "lit-html": {
+    "@storybook/mdx2-csf": {
       "optional": true
     },
     "react": {
@@ -186,15 +111,6 @@
     "react-dom": {
       "optional": true
     },
-    "svelte": {
-      "optional": true
-    },
-    "sveltedoc-parser": {
-      "optional": true
-    },
-    "vue": {
-      "optional": true
-    },
     "webpack": {
       "optional": true
     }
@@ -202,7 +118,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "df18f2ad3794d61c59c6458f66f73635502b8963",
+  "gitHead": "863b3811b24a4703645a09286059bc6d95bd2e65",
   "sbmodern": "dist/modern/index.js",
   "storybook": {
     "displayName": "Docs",

package/preset.js

@@ -1,16 +1,16 @@
-const getFrameworkPresets = (framework) => {
-  try {
-    return [require.resolve(`./dist/cjs/frameworks/${framework}/preset`)];
-  } catch (err) {
-    // there is no custom config for the user's framework, do nothing
-    return [];
-  }
-};
+const { findDistEsm } = require('@storybook/core-common');
+const { webpack } = require('./dist/cjs/frameworks/common/preset');
+
+function managerEntries(entry = [], options) {
+  return [...entry, findDistEsm(__dirname, 'register')];
+}
+
+function config(entry = [], options = {}) {
+  return [findDistEsm(__dirname, 'frameworks/common/config'), ...entry];
+}
 
-module.exports = (storybookOptions, presetOptions) => {
-  return [
-    { name: require.resolve('./common-preset'), options: presetOptions },
-    { name: require.resolve('./dist/cjs/frameworks/common/preset'), options: presetOptions },
-    ...getFrameworkPresets(storybookOptions.framework),
-  ];
+module.exports = {
+  webpack,
+  managerEntries,
+  config,
 };

package/register.js

@@ -1 +1,2 @@
+/* eslint-disable import/extensions */
 require('./dist/esm/register.js');

package/common-preset.js

@@ -1,19 +0,0 @@
-function managerEntries(entry = [], options) {
-  return [...entry, require.resolve('./dist/esm/register')];
-}
-
-function config(entry = [], options = {}) {
-  const { framework } = options;
-  const docsConfig = [require.resolve('./dist/esm/frameworks/common/config')];
-  try {
-    docsConfig.push(require.resolve(`./dist/esm/frameworks/${framework}/config`));
-  } catch (err) {
-    // there is no custom config for the user's framework, do nothing
-  }
-  return [...docsConfig, ...entry];
-}
-
-module.exports = {
-  managerEntries,
-  config,
-};

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

@@ -1,397 +0,0 @@
-"use strict";
-
-require("core-js/modules/es.object.to-string.js");
-
-require("core-js/modules/es.symbol.iterator.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");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.extractComponentDescription = exports.extractArgTypes = exports.extractArgTypesFromData = exports.extractType = exports.findComponentByName = exports.checkValidCompodocJson = exports.checkValidComponentOrDirective = exports.getCompodocJson = exports.setCompodocJson = exports.isMethod = void 0;
-
-require("core-js/modules/es.function.name.js");
-
-require("core-js/modules/es.array.find.js");
-
-require("core-js/modules/es.array.map.js");
-
-require("core-js/modules/es.array.concat.js");
-
-require("core-js/modules/es.array.join.js");
-
-require("core-js/modules/es.string.split.js");
-
-require("core-js/modules/es.regexp.exec.js");
-
-require("core-js/modules/es.array.includes.js");
-
-require("core-js/modules/es.number.constructor.js");
-
-require("core-js/modules/web.dom-collections.for-each.js");
-
-require("core-js/modules/es.string.replace.js");
-
-require("core-js/modules/es.object.assign.js");
-
-require("core-js/modules/es.symbol.js");
-
-require("core-js/modules/es.symbol.description.js");
-
-var _clientLogger = require("@storybook/client-logger");
-
-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); }
-
-var isMethod = function isMethod(methodOrProp) {
-  return methodOrProp.args !== undefined;
-};
-
-exports.isMethod = isMethod;
-
-var setCompodocJson = function setCompodocJson(compodocJson) {
-  // @ts-ignore
-  window.__STORYBOOK_COMPODOC_JSON__ = compodocJson;
-}; // @ts-ignore
-
-
-exports.setCompodocJson = setCompodocJson;
-
-var getCompodocJson = function getCompodocJson() {
-  return window.__STORYBOOK_COMPODOC_JSON__;
-};
-
-exports.getCompodocJson = getCompodocJson;
-
-var checkValidComponentOrDirective = function checkValidComponentOrDirective(component) {
-  if (!component.name) {
-    throw new Error("Invalid component ".concat(JSON.stringify(component)));
-  }
-};
-
-exports.checkValidComponentOrDirective = checkValidComponentOrDirective;
-
-var checkValidCompodocJson = function checkValidCompodocJson(compodocJson) {
-  if (!compodocJson || !compodocJson.components) {
-    throw new Error('Invalid compodoc JSON');
-  }
-};
-
-exports.checkValidCompodocJson = checkValidCompodocJson;
-
-var hasDecorator = function hasDecorator(item, decoratorName) {
-  return item.decorators && item.decorators.find(function (x) {
-    return x.name === decoratorName;
-  });
-};
-
-var mapPropertyToSection = function mapPropertyToSection(item) {
-  if (hasDecorator(item, 'ViewChild')) {
-    return 'view child';
-  }
-
-  if (hasDecorator(item, 'ViewChildren')) {
-    return 'view children';
-  }
-
-  if (hasDecorator(item, 'ContentChild')) {
-    return 'content child';
-  }
-
-  if (hasDecorator(item, 'ContentChildren')) {
-    return 'content children';
-  }
-
-  return 'properties';
-};
-
-var mapItemToSection = function mapItemToSection(key, item) {
-  switch (key) {
-    case 'methods':
-    case 'methodsClass':
-      return 'methods';
-
-    case 'inputsClass':
-      return 'inputs';
-
-    case 'outputsClass':
-      return 'outputs';
-
-    case 'properties':
-    case 'propertiesClass':
-      if (isMethod(item)) {
-        throw new Error("Cannot be of type Method if key === 'propertiesClass'");
-      }
-
-      return mapPropertyToSection(item);
-
-    default:
-      throw new Error("Unknown key: ".concat(key));
-  }
-};
-
-var findComponentByName = function findComponentByName(name, compodocJson) {
-  return compodocJson.components.find(function (c) {
-    return c.name === name;
-  }) || compodocJson.directives.find(function (c) {
-    return c.name === name;
-  }) || compodocJson.pipes.find(function (c) {
-    return c.name === name;
-  }) || compodocJson.injectables.find(function (c) {
-    return c.name === name;
-  }) || compodocJson.classes.find(function (c) {
-    return c.name === name;
-  });
-};
-
-exports.findComponentByName = findComponentByName;
-
-var getComponentData = function getComponentData(component) {
-  if (!component) {
-    return null;
-  }
-
-  checkValidComponentOrDirective(component);
-  var compodocJson = getCompodocJson();
-
-  if (!compodocJson) {
-    return null;
-  }
-
-  checkValidCompodocJson(compodocJson);
-  var name = component.name;
-  var metadata = findComponentByName(name, compodocJson);
-
-  if (!metadata) {
-    _clientLogger.logger.warn("Component not found in compodoc JSON: '".concat(name, "'"));
-  }
-
-  return metadata;
-};
-
-var displaySignature = function displaySignature(item) {
-  var args = item.args.map(function (arg) {
-    return "".concat(arg.name).concat(arg.optional ? '?' : '', ": ").concat(arg.type);
-  });
-  return "(".concat(args.join(', '), ") => ").concat(item.returnType);
-};
-
-var extractTypeFromValue = function extractTypeFromValue(defaultValue) {
-  var valueType = _typeof(defaultValue);
-
-  return defaultValue || valueType === 'number' || valueType === 'boolean' || valueType === 'string' ? valueType : null;
-};
-
-var extractEnumValues = function extractEnumValues(compodocType) {
-  var _compodocJson$miscell, _compodocJson$miscell2;
-
-  var compodocJson = getCompodocJson();
-  var enumType = compodocJson === null || compodocJson === void 0 ? void 0 : (_compodocJson$miscell = compodocJson.miscellaneous) === null || _compodocJson$miscell === void 0 ? void 0 : (_compodocJson$miscell2 = _compodocJson$miscell.enumerations) === null || _compodocJson$miscell2 === void 0 ? void 0 : _compodocJson$miscell2.find(function (x) {
-    return x.name === compodocType;
-  });
-
-  if (enumType !== null && enumType !== void 0 && enumType.childs.every(function (x) {
-    return x.value;
-  })) {
-    return enumType.childs.map(function (x) {
-      return x.value;
-    });
-  }
-
-  if (typeof compodocType !== 'string' || compodocType.indexOf('|') === -1) {
-    return null;
-  }
-
-  try {
-    return compodocType.split('|').map(function (value) {
-      return JSON.parse(value);
-    });
-  } catch (e) {
-    return null;
-  }
-};
-
-var extractType = function extractType(property, defaultValue) {
-  var compodocType = property.type || extractTypeFromValue(defaultValue);
-
-  switch (compodocType) {
-    case 'string':
-    case 'boolean':
-    case 'number':
-      return {
-        name: compodocType
-      };
-
-    case undefined:
-    case null:
-      return {
-        name: 'void'
-      };
-
-    default:
-      {
-        var resolvedType = resolveTypealias(compodocType);
-        var enumValues = extractEnumValues(resolvedType);
-        return enumValues ? {
-          name: 'enum',
-          value: enumValues
-        } : {
-          name: 'object'
-        };
-      }
-  }
-};
-
-exports.extractType = extractType;
-
-var castDefaultValue = function castDefaultValue(property, defaultValue) {
-  var compodocType = property.type; // All these checks are necessary as compodoc does not always set the type ie. @HostBinding have empty types.
-  // null and undefined also have 'any' type
-
-  if (['boolean', 'number', 'string', 'EventEmitter'].includes(compodocType)) {
-    switch (compodocType) {
-      case 'boolean':
-        return defaultValue === 'true';
-
-      case 'number':
-        return Number(defaultValue);
-
-      case 'EventEmitter':
-        return undefined;
-
-      default:
-        return defaultValue;
-    }
-  } else {
-    switch (defaultValue) {
-      case 'true':
-        return true;
-
-      case 'false':
-        return false;
-
-      case 'null':
-        return null;
-
-      case 'undefined':
-        return undefined;
-
-      default:
-        return defaultValue;
-    }
-  }
-};
-
-var extractDefaultValueFromComments = function extractDefaultValueFromComments(property, value) {
-  var commentValue = value;
-  property.jsdoctags.forEach(function (tag) {
-    if (['default', 'defaultvalue'].includes(tag.tagName.escapedText)) {
-      // @ts-ignore
-      var dom = new window.DOMParser().parseFromString(tag.comment, 'text/html');
-      commentValue = dom.body.textContent;
-    }
-  });
-  return commentValue;
-};
-
-var extractDefaultValue = function extractDefaultValue(property) {
-  try {
-    var _property$defaultValu, _property$jsdoctags;
-
-    var value = (_property$defaultValu = property.defaultValue) === null || _property$defaultValu === void 0 ? void 0 : _property$defaultValu.replace(/^'(.*)'$/, '$1');
-    value = castDefaultValue(property, value);
-
-    if (value == null && ((_property$jsdoctags = property.jsdoctags) === null || _property$jsdoctags === void 0 ? void 0 : _property$jsdoctags.length) > 0) {
-      value = extractDefaultValueFromComments(property, value);
-    }
-
-    return value;
-  } catch (err) {
-    _clientLogger.logger.debug("Error extracting ".concat(property.name, ": ").concat(property.defaultValue));
-
-    return undefined;
-  }
-};
-
-var resolveTypealias = function resolveTypealias(compodocType) {
-  var _compodocJson$miscell3, _compodocJson$miscell4;
-
-  var compodocJson = getCompodocJson();
-  var typeAlias = compodocJson === null || compodocJson === void 0 ? void 0 : (_compodocJson$miscell3 = compodocJson.miscellaneous) === null || _compodocJson$miscell3 === void 0 ? void 0 : (_compodocJson$miscell4 = _compodocJson$miscell3.typealiases) === null || _compodocJson$miscell4 === void 0 ? void 0 : _compodocJson$miscell4.find(function (x) {
-    return x.name === compodocType;
-  });
-  return typeAlias ? resolveTypealias(typeAlias.rawtype) : compodocType;
-};
-
-var extractArgTypesFromData = function extractArgTypesFromData(componentData) {
-  var sectionToItems = {};
-  var compodocClasses = ['component', 'directive'].includes(componentData.type) ? ['propertiesClass', 'methodsClass', 'inputsClass', 'outputsClass'] : ['properties', 'methods'];
-  compodocClasses.forEach(function (key) {
-    var data = componentData[key] || [];
-    data.forEach(function (item) {
-      var section = mapItemToSection(key, item);
-      var defaultValue = isMethod(item) ? undefined : extractDefaultValue(item);
-      var type = isMethod(item) || section !== 'inputs' && section !== 'properties' ? {
-        name: 'void'
-      } : extractType(item, defaultValue);
-      var action = section === 'outputs' ? {
-        action: item.name
-      } : {};
-      var argType = Object.assign({
-        name: item.name,
-        description: item.rawdescription || item.description,
-        defaultValue: defaultValue,
-        type: type
-      }, action, {
-        table: {
-          category: section,
-          type: {
-            summary: isMethod(item) ? displaySignature(item) : item.type,
-            required: isMethod(item) ? false : !item.optional
-          },
-          defaultValue: {
-            summary: defaultValue
-          }
-        }
-      });
-
-      if (!sectionToItems[section]) {
-        sectionToItems[section] = [];
-      }
-
-      sectionToItems[section].push(argType);
-    });
-  });
-  var SECTIONS = ['properties', 'inputs', 'outputs', 'methods', 'view child', 'view children', 'content child', 'content children'];
-  var argTypes = {};
-  SECTIONS.forEach(function (section) {
-    var items = sectionToItems[section];
-
-    if (items) {
-      items.forEach(function (argType) {
-        argTypes[argType.name] = argType;
-      });
-    }
-  });
-  return argTypes;
-};
-
-exports.extractArgTypesFromData = extractArgTypesFromData;
-
-var extractArgTypes = function extractArgTypes(component) {
-  var componentData = getComponentData(component);
-  return componentData && extractArgTypesFromData(componentData);
-};
-
-exports.extractArgTypes = extractArgTypes;
-
-var extractComponentDescription = function extractComponentDescription(component) {
-  var componentData = getComponentData(component);
-  return componentData && (componentData.rawdescription || componentData.description);
-};
-
-exports.extractComponentDescription = extractComponentDescription;

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

@@ -1,31 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.decorators = exports.parameters = void 0;
-
-var _shared = require("../../shared");
-
-var _compodoc = require("./compodoc");
-
-var _sourceDecorator = require("./sourceDecorator");
-
-var _prepareForInline = require("./prepareForInline");
-
-var parameters = {
-  docs: {
-    // probably set this to true by default once it's battle-tested
-    inlineStories: false,
-    prepareForInline: _prepareForInline.prepareForInline,
-    extractArgTypes: _compodoc.extractArgTypes,
-    extractComponentDescription: _compodoc.extractComponentDescription,
-    source: {
-      type: _shared.SourceType.DYNAMIC,
-      language: 'html'
-    }
-  }
-};
-exports.parameters = parameters;
-var decorators = [_sourceDecorator.sourceDecorator];
-exports.decorators = decorators;