From 8570188f6a623cf31841f1b25179cb593ccae6e1 Mon Sep 17 00:00:00 2001 From: Michael Shilman Date: Sat, 12 Mar 2022 11:52:20 +0800 Subject: [PATCH 01/17] Addon-docs: Refactor common libraries into docs-utils --- addons/docs/common-preset.js | 19 - addons/docs/package.json | 101 +--- addons/docs/preset.js | 28 +- addons/docs/src/blocks/ArgsTable.tsx | 2 +- addons/docs/src/blocks/Description.tsx | 3 +- addons/docs/src/lib/index.ts | 1 - lib/docs-tools/README.md | 6 + lib/docs-tools/package.json | 60 +++ .../__testfixtures__/proptypes/arrays.js | 0 .../__testfixtures__/proptypes/enums.js | 0 .../__testfixtures__/proptypes/misc.js | 0 .../__testfixtures__/proptypes/objects.js | 0 .../__testfixtures__/proptypes/react.js | 0 .../__testfixtures__/proptypes/scalars.js | 0 .../__testfixtures__/typescript/aliases.tsx | 0 .../__testfixtures__/typescript/arrays.tsx | 0 .../__testfixtures__/typescript/enums.tsx | 0 .../__testfixtures__/typescript/functions.tsx | 0 .../typescript/interfaces.tsx | 0 .../typescript/intersections.tsx | 0 .../__testfixtures__/typescript/optionals.tsx | 0 .../__testfixtures__/typescript/records.tsx | 0 .../__testfixtures__/typescript/scalars.tsx | 0 .../__testfixtures__/typescript/tuples.tsx | 0 .../__testfixtures__/typescript/unions.tsx | 0 .../src/argTypes}/convert/convert.test.ts | 0 .../src/argTypes}/convert/flow/convert.ts | 0 .../src/argTypes}/convert/flow/index.ts | 0 .../src/argTypes}/convert/flow/types.ts | 0 .../docs-tools/src/argTypes}/convert/index.ts | 0 .../argTypes}/convert/proptypes/convert.ts | 0 .../src/argTypes}/convert/proptypes/index.ts | 0 .../src/argTypes}/convert/proptypes/types.ts | 0 .../argTypes}/convert/typescript/convert.ts | 0 .../src/argTypes}/convert/typescript/index.ts | 0 .../src/argTypes}/convert/typescript/types.ts | 0 .../docs-tools/src/argTypes}/convert/utils.ts | 0 .../src/argTypes}/docgen/PropDef.ts | 0 .../src/argTypes}/docgen/createPropDef.ts | 2 +- .../docgen/extractDocgenProps.test.ts | 2 +- .../argTypes}/docgen/extractDocgenProps.ts | 2 +- .../docgen/flow/createDefaultValue.ts | 2 +- .../docgen/flow/createPropDef.test.ts | 0 .../argTypes}/docgen/flow/createPropDef.ts | 0 .../src/argTypes}/docgen/flow/createType.ts | 2 +- .../docs-tools/src/argTypes}/docgen/index.ts | 1 + .../docgen/typeScript/createDefaultValue.ts | 2 +- .../docgen/typeScript/createPropDef.test.ts | 0 .../docgen/typeScript/createPropDef.ts | 0 .../argTypes}/docgen/typeScript/createType.ts | 2 +- .../docs-tools/src/argTypes}/docgen/types.ts | 2 +- .../argTypes}/docgen/utils/defaultValue.ts | 0 .../src/argTypes}/docgen/utils/docgenInfo.ts | 2 +- .../src/argTypes}/docgen/utils/index.ts | 0 .../src/argTypes}/docgen/utils/string.ts | 0 .../src/argTypes/enhanceArgTypes.test.ts | 269 ++++++++++ .../src/argTypes/enhanceArgTypes.ts | 20 + lib/docs-tools/src/argTypes/index.ts | 8 + .../src/argTypes}/jsdocParser.test.ts | 0 .../docs-tools/src/argTypes}/jsdocParser.ts | 0 lib/docs-tools/src/argTypes/types.ts | 1 + lib/docs-tools/src/argTypes/typings.d.ts | 1 + .../docs-tools/src/argTypes}/utils.test.ts | 0 .../docs-tools/src/argTypes}/utils.ts | 2 +- lib/docs-tools/src/index.ts | 2 + lib/docs-tools/src/shared.ts | 28 + lib/docs-tools/tsconfig.json | 20 + nx.json | 3 + package.json | 1 + workspace.json | 4 + yarn.lock | 481 +++--------------- 71 files changed, 526 insertions(+), 553 deletions(-) delete mode 100644 addons/docs/common-preset.js delete mode 100644 addons/docs/src/lib/index.ts create mode 100644 lib/docs-tools/README.md create mode 100644 lib/docs-tools/package.json rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/__testfixtures__/proptypes/arrays.js (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/__testfixtures__/proptypes/enums.js (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/__testfixtures__/proptypes/misc.js (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/__testfixtures__/proptypes/objects.js (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/__testfixtures__/proptypes/react.js (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/__testfixtures__/proptypes/scalars.js (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/__testfixtures__/typescript/aliases.tsx (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/__testfixtures__/typescript/arrays.tsx (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/__testfixtures__/typescript/enums.tsx (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/__testfixtures__/typescript/functions.tsx (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/__testfixtures__/typescript/interfaces.tsx (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/__testfixtures__/typescript/intersections.tsx (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/__testfixtures__/typescript/optionals.tsx (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/__testfixtures__/typescript/records.tsx (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/__testfixtures__/typescript/scalars.tsx (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/__testfixtures__/typescript/tuples.tsx (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/__testfixtures__/typescript/unions.tsx (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/convert.test.ts (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/flow/convert.ts (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/flow/index.ts (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/flow/types.ts (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/index.ts (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/proptypes/convert.ts (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/proptypes/index.ts (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/proptypes/types.ts (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/typescript/convert.ts (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/typescript/index.ts (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/typescript/types.ts (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/convert/utils.ts (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/docgen/PropDef.ts (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/docgen/createPropDef.ts (98%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/docgen/extractDocgenProps.test.ts (99%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/docgen/extractDocgenProps.ts (98%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/docgen/flow/createDefaultValue.ts (91%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/docgen/flow/createPropDef.test.ts (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/docgen/flow/createPropDef.ts (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/docgen/flow/createType.ts (97%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/docgen/index.ts (76%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/docgen/typeScript/createDefaultValue.ts (87%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/docgen/typeScript/createPropDef.test.ts (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/docgen/typeScript/createPropDef.ts (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/docgen/typeScript/createType.ts (89%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/docgen/types.ts (96%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/docgen/utils/defaultValue.ts (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/docgen/utils/docgenInfo.ts (92%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/docgen/utils/index.ts (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/docgen/utils/string.ts (100%) create mode 100644 lib/docs-tools/src/argTypes/enhanceArgTypes.test.ts create mode 100644 lib/docs-tools/src/argTypes/enhanceArgTypes.ts create mode 100644 lib/docs-tools/src/argTypes/index.ts rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/jsdocParser.test.ts (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/jsdocParser.ts (100%) create mode 100644 lib/docs-tools/src/argTypes/types.ts create mode 100644 lib/docs-tools/src/argTypes/typings.d.ts rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/utils.test.ts (100%) rename {addons/docs/src/lib => lib/docs-tools/src/argTypes}/utils.ts (91%) create mode 100644 lib/docs-tools/src/index.ts create mode 100644 lib/docs-tools/src/shared.ts create mode 100644 lib/docs-tools/tsconfig.json diff --git a/addons/docs/common-preset.js b/addons/docs/common-preset.js deleted file mode 100644 index 462287ef422..00000000000 --- a/addons/docs/common-preset.js +++ /dev/null @@ -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, -}; diff --git a/addons/docs/package.json b/addons/docs/package.json index be11849af7b..879c601d659 100644 --- a/addons/docs/package.json +++ b/addons/docs/package.json @@ -55,22 +55,17 @@ "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/react": "^1.6.22", "@storybook/addons": "6.5.0-alpha.47", "@storybook/api": "6.5.0-alpha.47", - "@storybook/builder-webpack4": "6.5.0-alpha.47", - "@storybook/client-logger": "6.5.0-alpha.47", "@storybook/components": "6.5.0-alpha.47", - "@storybook/core": "6.5.0-alpha.47", + "@storybook/core-common": "6.5.0-alpha.47", "@storybook/core-events": "6.5.0-alpha.47", "@storybook/csf": "0.0.2--canary.87bc651.0", - "@storybook/csf-tools": "6.5.0-alpha.47", + "@storybook/docs-tools": "6.5.0-alpha.47", "@storybook/mdx1-csf": "canary", "@storybook/node-logger": "6.5.0-alpha.47", "@storybook/postinstall": "6.5.0-alpha.47", @@ -78,134 +73,44 @@ "@storybook/source-loader": "6.5.0-alpha.47", "@storybook/store": "6.5.0-alpha.47", "@storybook/theming": "6.5.0-alpha.47", - "acorn": "^7.4.1", - "acorn-jsx": "^5.3.1", - "acorn-walk": "^7.2.0", "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", - "loader-utils": "^2.0.0", "lodash": "^4.17.21", - "nanoid": "^3.1.23", - "p-limit": "^3.1.0", - "prettier": ">=2.2.1 <=2.3.0", - "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.47", - "@storybook/html": "6.5.0-alpha.47", "@storybook/mdx2-csf": "canary", - "@storybook/react": "6.5.0-alpha.47", - "@storybook/vue": "6.5.0-alpha.47", - "@storybook/web-components": "6.5.0-alpha.47", - "@types/cross-spawn": "^6.0.2", - "@types/doctrine": "^0.0.3", - "@types/estree": "^0.0.44", - "@types/loader-utils": "^2.0.0", - "@types/prop-types": "^15.7.3", - "@types/tmp": "^0.2.0", "@types/util-deprecate": "^1.0.0", "babel-loader": "^8.0.0", - "babel-plugin-react-docgen": "^4.2.1", - "cross-spawn": "^7.0.3", - "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", - "sveltedoc-parser": "4.1.0", - "tmp": "^0.2.1", - "vue": "^2.6.10", - "webpack": "4", - "zone.js": "^0.11.3" + "webpack": "4" }, "peerDependencies": { - "@storybook/angular": "6.5.0-alpha.47", - "@storybook/html": "6.5.0-alpha.47", "@storybook/mdx2-csf": "*", - "@storybook/react": "6.5.0-alpha.47", - "@storybook/vue": "6.5.0-alpha.47", - "@storybook/vue3": "6.5.0-alpha.47", - "@storybook/web-components": "6.5.0-alpha.47", - "lit": "^2.0.0", - "lit-html": "^1.4.1 || ^2.0.0", "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/builder-webpack4": { "optional": true }, "@storybook/builder-webpack5": { "optional": true }, - "@storybook/html": { - "optional": true - }, - "@storybook/manager-webpack4": { - "optional": true - }, - "@storybook/manager-webpack5": { - "optional": true - }, "@storybook/mdx2-csf": { "optional": true }, - "@storybook/react": { - "optional": true - }, - "@storybook/vue": { - "optional": true - }, - "@storybook/vue3": { - "optional": true - }, - "@storybook/web-components": { - "optional": true - }, - "lit": { - "optional": true - }, - "lit-html": { - "optional": true - }, "react": { "optional": true }, "react-dom": { "optional": true }, - "svelte": { - "optional": true - }, - "sveltedoc-parser": { - "optional": true - }, - "vue": { - "optional": true - }, "webpack": { "optional": true } diff --git a/addons/docs/preset.js b/addons/docs/preset.js index dfce06bdfda..c318823dc33 100644 --- a/addons/docs/preset.js +++ b/addons/docs/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'); -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), - ]; +function managerEntries(entry = [], options) { + return [...entry, findDistEsm(__dirname, 'register')]; +} + +function config(entry = [], options = {}) { + return [findDistEsm(__dirname, 'frameworks/common/config'), ...entry]; +} + +module.exports = { + webpack, + managerEntries, + config, }; diff --git a/addons/docs/src/blocks/ArgsTable.tsx b/addons/docs/src/blocks/ArgsTable.tsx index 8efc0c5ecfd..56f0e8edba3 100644 --- a/addons/docs/src/blocks/ArgsTable.tsx +++ b/addons/docs/src/blocks/ArgsTable.tsx @@ -7,6 +7,7 @@ import { SortType, TabbedArgsTable, } from '@storybook/components'; +import { ArgTypesExtractor } from '@storybook/docs-tools'; import { addons } from '@storybook/addons'; import { filterArgTypes, PropDescriptor } from '@storybook/store'; import Events from '@storybook/core-events'; @@ -15,7 +16,6 @@ import { StrictArgTypes, Args } from '@storybook/csf'; import { DocsContext, DocsContextProps } from './DocsContext'; import { Component, CURRENT_SELECTION, PRIMARY_STORY } from './types'; import { getComponentName } from './utils'; -import { ArgTypesExtractor } from '../lib/docgen/types'; import { lookupStoryId } from './Story'; import { useStory } from './useStory'; diff --git a/addons/docs/src/blocks/Description.tsx b/addons/docs/src/blocks/Description.tsx index 2f92c105e16..2c55f10e740 100644 --- a/addons/docs/src/blocks/Description.tsx +++ b/addons/docs/src/blocks/Description.tsx @@ -1,8 +1,9 @@ import React, { FunctionComponent, useContext } from 'react'; import { Description, DescriptionProps as PureDescriptionProps } from '@storybook/components'; +import { str } from '@storybook/docs-tools'; + import { DocsContext, DocsContextProps } from './DocsContext'; import { Component, CURRENT_SELECTION } from './types'; -import { str } from '../lib/docgen'; export enum DescriptionType { INFO = 'info', diff --git a/addons/docs/src/lib/index.ts b/addons/docs/src/lib/index.ts deleted file mode 100644 index 04bca77e0de..00000000000 --- a/addons/docs/src/lib/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from './utils'; diff --git a/lib/docs-tools/README.md b/lib/docs-tools/README.md new file mode 100644 index 00000000000..548b6955045 --- /dev/null +++ b/lib/docs-tools/README.md @@ -0,0 +1,6 @@ +# Storybook Docs Utils + +Shared utility functions for frameworks to implement docs + +- ArgType extraction +- Dynamic snippet generation diff --git a/lib/docs-tools/package.json b/lib/docs-tools/package.json new file mode 100644 index 00000000000..a78b5a3c7d5 --- /dev/null +++ b/lib/docs-tools/package.json @@ -0,0 +1,60 @@ +{ + "name": "@storybook/docs-tools", + "version": "6.5.0-alpha.47", + "description": "Shared utility functions for frameworks to implement docs", + "keywords": [ + "storybook" + ], + "homepage": "https://github.com/storybookjs/storybook/tree/main/lib/docs-tools", + "bugs": { + "url": "https://github.com/storybookjs/storybook/issues" + }, + "repository": { + "type": "git", + "url": "https://github.com/storybookjs/storybook.git", + "directory": "lib/docs-tools" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/storybook" + }, + "license": "MIT", + "sideEffects": false, + "main": "dist/cjs/index.js", + "module": "dist/esm/index.js", + "types": "dist/ts3.9/index.d.ts", + "typesVersions": { + "<3.8": { + "dist/ts3.9/*": [ + "dist/ts3.4/*" + ] + } + }, + "files": [ + "dist/**/*", + "README.md", + "*.js", + "*.d.ts" + ], + "scripts": { + "prepare": "node ../../scripts/prepare.js" + }, + "dependencies": { + "@babel/core": "^7.12.10", + "@storybook/csf": "0.0.2--canary.87bc651.0", + "@storybook/store": "6.5.0-alpha.47", + "core-js": "^3.8.2", + "doctrine": "^3.0.0", + "lodash": "^4.17.21", + "regenerator-runtime": "^0.13.7" + }, + "devDependencies": { + "jest-specific-snapshot": "^4.0.0", + "require-from-string": "^2.0.2" + }, + "publishConfig": { + "access": "public" + }, + "gitHead": "af457c20c773f57bea0504bf525a2f74852fe94a", + "sbmodern": "dist/modern/index.js" +} diff --git a/addons/docs/src/lib/convert/__testfixtures__/proptypes/arrays.js b/lib/docs-tools/src/argTypes/convert/__testfixtures__/proptypes/arrays.js similarity index 100% rename from addons/docs/src/lib/convert/__testfixtures__/proptypes/arrays.js rename to lib/docs-tools/src/argTypes/convert/__testfixtures__/proptypes/arrays.js diff --git a/addons/docs/src/lib/convert/__testfixtures__/proptypes/enums.js b/lib/docs-tools/src/argTypes/convert/__testfixtures__/proptypes/enums.js similarity index 100% rename from addons/docs/src/lib/convert/__testfixtures__/proptypes/enums.js rename to lib/docs-tools/src/argTypes/convert/__testfixtures__/proptypes/enums.js diff --git a/addons/docs/src/lib/convert/__testfixtures__/proptypes/misc.js b/lib/docs-tools/src/argTypes/convert/__testfixtures__/proptypes/misc.js similarity index 100% rename from addons/docs/src/lib/convert/__testfixtures__/proptypes/misc.js rename to lib/docs-tools/src/argTypes/convert/__testfixtures__/proptypes/misc.js diff --git a/addons/docs/src/lib/convert/__testfixtures__/proptypes/objects.js b/lib/docs-tools/src/argTypes/convert/__testfixtures__/proptypes/objects.js similarity index 100% rename from addons/docs/src/lib/convert/__testfixtures__/proptypes/objects.js rename to lib/docs-tools/src/argTypes/convert/__testfixtures__/proptypes/objects.js diff --git a/addons/docs/src/lib/convert/__testfixtures__/proptypes/react.js b/lib/docs-tools/src/argTypes/convert/__testfixtures__/proptypes/react.js similarity index 100% rename from addons/docs/src/lib/convert/__testfixtures__/proptypes/react.js rename to lib/docs-tools/src/argTypes/convert/__testfixtures__/proptypes/react.js diff --git a/addons/docs/src/lib/convert/__testfixtures__/proptypes/scalars.js b/lib/docs-tools/src/argTypes/convert/__testfixtures__/proptypes/scalars.js similarity index 100% rename from addons/docs/src/lib/convert/__testfixtures__/proptypes/scalars.js rename to lib/docs-tools/src/argTypes/convert/__testfixtures__/proptypes/scalars.js diff --git a/addons/docs/src/lib/convert/__testfixtures__/typescript/aliases.tsx b/lib/docs-tools/src/argTypes/convert/__testfixtures__/typescript/aliases.tsx similarity index 100% rename from addons/docs/src/lib/convert/__testfixtures__/typescript/aliases.tsx rename to lib/docs-tools/src/argTypes/convert/__testfixtures__/typescript/aliases.tsx diff --git a/addons/docs/src/lib/convert/__testfixtures__/typescript/arrays.tsx b/lib/docs-tools/src/argTypes/convert/__testfixtures__/typescript/arrays.tsx similarity index 100% rename from addons/docs/src/lib/convert/__testfixtures__/typescript/arrays.tsx rename to lib/docs-tools/src/argTypes/convert/__testfixtures__/typescript/arrays.tsx diff --git a/addons/docs/src/lib/convert/__testfixtures__/typescript/enums.tsx b/lib/docs-tools/src/argTypes/convert/__testfixtures__/typescript/enums.tsx similarity index 100% rename from addons/docs/src/lib/convert/__testfixtures__/typescript/enums.tsx rename to lib/docs-tools/src/argTypes/convert/__testfixtures__/typescript/enums.tsx diff --git a/addons/docs/src/lib/convert/__testfixtures__/typescript/functions.tsx b/lib/docs-tools/src/argTypes/convert/__testfixtures__/typescript/functions.tsx similarity index 100% rename from addons/docs/src/lib/convert/__testfixtures__/typescript/functions.tsx rename to lib/docs-tools/src/argTypes/convert/__testfixtures__/typescript/functions.tsx diff --git a/addons/docs/src/lib/convert/__testfixtures__/typescript/interfaces.tsx b/lib/docs-tools/src/argTypes/convert/__testfixtures__/typescript/interfaces.tsx similarity index 100% rename from addons/docs/src/lib/convert/__testfixtures__/typescript/interfaces.tsx rename to lib/docs-tools/src/argTypes/convert/__testfixtures__/typescript/interfaces.tsx diff --git a/addons/docs/src/lib/convert/__testfixtures__/typescript/intersections.tsx b/lib/docs-tools/src/argTypes/convert/__testfixtures__/typescript/intersections.tsx similarity index 100% rename from addons/docs/src/lib/convert/__testfixtures__/typescript/intersections.tsx rename to lib/docs-tools/src/argTypes/convert/__testfixtures__/typescript/intersections.tsx diff --git a/addons/docs/src/lib/convert/__testfixtures__/typescript/optionals.tsx b/lib/docs-tools/src/argTypes/convert/__testfixtures__/typescript/optionals.tsx similarity index 100% rename from addons/docs/src/lib/convert/__testfixtures__/typescript/optionals.tsx rename to lib/docs-tools/src/argTypes/convert/__testfixtures__/typescript/optionals.tsx diff --git a/addons/docs/src/lib/convert/__testfixtures__/typescript/records.tsx b/lib/docs-tools/src/argTypes/convert/__testfixtures__/typescript/records.tsx similarity index 100% rename from addons/docs/src/lib/convert/__testfixtures__/typescript/records.tsx rename to lib/docs-tools/src/argTypes/convert/__testfixtures__/typescript/records.tsx diff --git a/addons/docs/src/lib/convert/__testfixtures__/typescript/scalars.tsx b/lib/docs-tools/src/argTypes/convert/__testfixtures__/typescript/scalars.tsx similarity index 100% rename from addons/docs/src/lib/convert/__testfixtures__/typescript/scalars.tsx rename to lib/docs-tools/src/argTypes/convert/__testfixtures__/typescript/scalars.tsx diff --git a/addons/docs/src/lib/convert/__testfixtures__/typescript/tuples.tsx b/lib/docs-tools/src/argTypes/convert/__testfixtures__/typescript/tuples.tsx similarity index 100% rename from addons/docs/src/lib/convert/__testfixtures__/typescript/tuples.tsx rename to lib/docs-tools/src/argTypes/convert/__testfixtures__/typescript/tuples.tsx diff --git a/addons/docs/src/lib/convert/__testfixtures__/typescript/unions.tsx b/lib/docs-tools/src/argTypes/convert/__testfixtures__/typescript/unions.tsx similarity index 100% rename from addons/docs/src/lib/convert/__testfixtures__/typescript/unions.tsx rename to lib/docs-tools/src/argTypes/convert/__testfixtures__/typescript/unions.tsx diff --git a/addons/docs/src/lib/convert/convert.test.ts b/lib/docs-tools/src/argTypes/convert/convert.test.ts similarity index 100% rename from addons/docs/src/lib/convert/convert.test.ts rename to lib/docs-tools/src/argTypes/convert/convert.test.ts diff --git a/addons/docs/src/lib/convert/flow/convert.ts b/lib/docs-tools/src/argTypes/convert/flow/convert.ts similarity index 100% rename from addons/docs/src/lib/convert/flow/convert.ts rename to lib/docs-tools/src/argTypes/convert/flow/convert.ts diff --git a/addons/docs/src/lib/convert/flow/index.ts b/lib/docs-tools/src/argTypes/convert/flow/index.ts similarity index 100% rename from addons/docs/src/lib/convert/flow/index.ts rename to lib/docs-tools/src/argTypes/convert/flow/index.ts diff --git a/addons/docs/src/lib/convert/flow/types.ts b/lib/docs-tools/src/argTypes/convert/flow/types.ts similarity index 100% rename from addons/docs/src/lib/convert/flow/types.ts rename to lib/docs-tools/src/argTypes/convert/flow/types.ts diff --git a/addons/docs/src/lib/convert/index.ts b/lib/docs-tools/src/argTypes/convert/index.ts similarity index 100% rename from addons/docs/src/lib/convert/index.ts rename to lib/docs-tools/src/argTypes/convert/index.ts diff --git a/addons/docs/src/lib/convert/proptypes/convert.ts b/lib/docs-tools/src/argTypes/convert/proptypes/convert.ts similarity index 100% rename from addons/docs/src/lib/convert/proptypes/convert.ts rename to lib/docs-tools/src/argTypes/convert/proptypes/convert.ts diff --git a/addons/docs/src/lib/convert/proptypes/index.ts b/lib/docs-tools/src/argTypes/convert/proptypes/index.ts similarity index 100% rename from addons/docs/src/lib/convert/proptypes/index.ts rename to lib/docs-tools/src/argTypes/convert/proptypes/index.ts diff --git a/addons/docs/src/lib/convert/proptypes/types.ts b/lib/docs-tools/src/argTypes/convert/proptypes/types.ts similarity index 100% rename from addons/docs/src/lib/convert/proptypes/types.ts rename to lib/docs-tools/src/argTypes/convert/proptypes/types.ts diff --git a/addons/docs/src/lib/convert/typescript/convert.ts b/lib/docs-tools/src/argTypes/convert/typescript/convert.ts similarity index 100% rename from addons/docs/src/lib/convert/typescript/convert.ts rename to lib/docs-tools/src/argTypes/convert/typescript/convert.ts diff --git a/addons/docs/src/lib/convert/typescript/index.ts b/lib/docs-tools/src/argTypes/convert/typescript/index.ts similarity index 100% rename from addons/docs/src/lib/convert/typescript/index.ts rename to lib/docs-tools/src/argTypes/convert/typescript/index.ts diff --git a/addons/docs/src/lib/convert/typescript/types.ts b/lib/docs-tools/src/argTypes/convert/typescript/types.ts similarity index 100% rename from addons/docs/src/lib/convert/typescript/types.ts rename to lib/docs-tools/src/argTypes/convert/typescript/types.ts diff --git a/addons/docs/src/lib/convert/utils.ts b/lib/docs-tools/src/argTypes/convert/utils.ts similarity index 100% rename from addons/docs/src/lib/convert/utils.ts rename to lib/docs-tools/src/argTypes/convert/utils.ts diff --git a/addons/docs/src/lib/docgen/PropDef.ts b/lib/docs-tools/src/argTypes/docgen/PropDef.ts similarity index 100% rename from addons/docs/src/lib/docgen/PropDef.ts rename to lib/docs-tools/src/argTypes/docgen/PropDef.ts diff --git a/addons/docs/src/lib/docgen/createPropDef.ts b/lib/docs-tools/src/argTypes/docgen/createPropDef.ts similarity index 98% rename from addons/docs/src/lib/docgen/createPropDef.ts rename to lib/docs-tools/src/argTypes/docgen/createPropDef.ts index 3916a3aeff3..e39bb07c6ea 100644 --- a/addons/docs/src/lib/docgen/createPropDef.ts +++ b/lib/docs-tools/src/argTypes/docgen/createPropDef.ts @@ -1,4 +1,4 @@ -import { PropDefaultValue } from '@storybook/components'; +import { PropDefaultValue } from './PropDef'; import { PropDef, TypeSystem, DocgenInfo, DocgenType, DocgenPropDefaultValue } from './types'; import { JsDocParsingResult } from '../jsdocParser'; import { createSummaryValue } from '../utils'; diff --git a/addons/docs/src/lib/docgen/extractDocgenProps.test.ts b/lib/docs-tools/src/argTypes/docgen/extractDocgenProps.test.ts similarity index 99% rename from addons/docs/src/lib/docgen/extractDocgenProps.test.ts rename to lib/docs-tools/src/argTypes/docgen/extractDocgenProps.test.ts index 5195cf2e4b3..01c0f16cb05 100644 --- a/addons/docs/src/lib/docgen/extractDocgenProps.test.ts +++ b/lib/docs-tools/src/argTypes/docgen/extractDocgenProps.test.ts @@ -1,6 +1,6 @@ /* eslint-disable no-underscore-dangle */ -import { Component } from '../../blocks/types'; +import { Component } from '../types'; import { extractComponentProps } from './extractDocgenProps'; const DOCGEN_SECTION = 'props'; diff --git a/addons/docs/src/lib/docgen/extractDocgenProps.ts b/lib/docs-tools/src/argTypes/docgen/extractDocgenProps.ts similarity index 98% rename from addons/docs/src/lib/docgen/extractDocgenProps.ts rename to lib/docs-tools/src/argTypes/docgen/extractDocgenProps.ts index c7a9090adf4..3a0bd81a632 100644 --- a/addons/docs/src/lib/docgen/extractDocgenProps.ts +++ b/lib/docs-tools/src/argTypes/docgen/extractDocgenProps.ts @@ -1,4 +1,4 @@ -import { Component } from '../../blocks/types'; +import { Component } from '../types'; import { ExtractedJsDoc, parseJsDoc } from '../jsdocParser'; import { PropDef, DocgenInfo, TypeSystem } from './types'; import { getDocgenSection, isValidDocgenSection, getDocgenDescription } from './utils'; diff --git a/addons/docs/src/lib/docgen/flow/createDefaultValue.ts b/lib/docs-tools/src/argTypes/docgen/flow/createDefaultValue.ts similarity index 91% rename from addons/docs/src/lib/docgen/flow/createDefaultValue.ts rename to lib/docs-tools/src/argTypes/docgen/flow/createDefaultValue.ts index a9be5f0fe9d..4e505ff99c0 100644 --- a/addons/docs/src/lib/docgen/flow/createDefaultValue.ts +++ b/lib/docs-tools/src/argTypes/docgen/flow/createDefaultValue.ts @@ -1,4 +1,4 @@ -import { PropDefaultValue } from '@storybook/components'; +import { PropDefaultValue } from '../PropDef'; import { DocgenPropDefaultValue, DocgenPropType } from '../types'; import { createSummaryValue, isTooLongForDefaultValueSummary } from '../../utils'; import { isDefaultValueBlacklisted } from '../utils/defaultValue'; diff --git a/addons/docs/src/lib/docgen/flow/createPropDef.test.ts b/lib/docs-tools/src/argTypes/docgen/flow/createPropDef.test.ts similarity index 100% rename from addons/docs/src/lib/docgen/flow/createPropDef.test.ts rename to lib/docs-tools/src/argTypes/docgen/flow/createPropDef.test.ts diff --git a/addons/docs/src/lib/docgen/flow/createPropDef.ts b/lib/docs-tools/src/argTypes/docgen/flow/createPropDef.ts similarity index 100% rename from addons/docs/src/lib/docgen/flow/createPropDef.ts rename to lib/docs-tools/src/argTypes/docgen/flow/createPropDef.ts diff --git a/addons/docs/src/lib/docgen/flow/createType.ts b/lib/docs-tools/src/argTypes/docgen/flow/createType.ts similarity index 97% rename from addons/docs/src/lib/docgen/flow/createType.ts rename to lib/docs-tools/src/argTypes/docgen/flow/createType.ts index 2e9d86a93a4..9ff87d4c877 100644 --- a/addons/docs/src/lib/docgen/flow/createType.ts +++ b/lib/docs-tools/src/argTypes/docgen/flow/createType.ts @@ -1,4 +1,4 @@ -import { PropType } from '@storybook/components'; +import { PropType } from '../PropDef'; import { DocgenFlowType } from '../types'; import { createSummaryValue, isTooLongForTypeSummary } from '../../utils'; diff --git a/addons/docs/src/lib/docgen/index.ts b/lib/docs-tools/src/argTypes/docgen/index.ts similarity index 76% rename from addons/docs/src/lib/docgen/index.ts rename to lib/docs-tools/src/argTypes/docgen/index.ts index 4116325caa8..ade7440d7c3 100644 --- a/addons/docs/src/lib/docgen/index.ts +++ b/lib/docs-tools/src/argTypes/docgen/index.ts @@ -1,3 +1,4 @@ export * from './types'; export * from './utils'; export * from './extractDocgenProps'; +export * from './PropDef'; diff --git a/addons/docs/src/lib/docgen/typeScript/createDefaultValue.ts b/lib/docs-tools/src/argTypes/docgen/typeScript/createDefaultValue.ts similarity index 87% rename from addons/docs/src/lib/docgen/typeScript/createDefaultValue.ts rename to lib/docs-tools/src/argTypes/docgen/typeScript/createDefaultValue.ts index 14bfcf67b68..fd4d0478892 100644 --- a/addons/docs/src/lib/docgen/typeScript/createDefaultValue.ts +++ b/lib/docs-tools/src/argTypes/docgen/typeScript/createDefaultValue.ts @@ -1,4 +1,4 @@ -import { PropDefaultValue } from '@storybook/components'; +import { PropDefaultValue } from '../PropDef'; import { DocgenInfo } from '../types'; import { createSummaryValue } from '../../utils'; import { isDefaultValueBlacklisted } from '../utils/defaultValue'; diff --git a/addons/docs/src/lib/docgen/typeScript/createPropDef.test.ts b/lib/docs-tools/src/argTypes/docgen/typeScript/createPropDef.test.ts similarity index 100% rename from addons/docs/src/lib/docgen/typeScript/createPropDef.test.ts rename to lib/docs-tools/src/argTypes/docgen/typeScript/createPropDef.test.ts diff --git a/addons/docs/src/lib/docgen/typeScript/createPropDef.ts b/lib/docs-tools/src/argTypes/docgen/typeScript/createPropDef.ts similarity index 100% rename from addons/docs/src/lib/docgen/typeScript/createPropDef.ts rename to lib/docs-tools/src/argTypes/docgen/typeScript/createPropDef.ts diff --git a/addons/docs/src/lib/docgen/typeScript/createType.ts b/lib/docs-tools/src/argTypes/docgen/typeScript/createType.ts similarity index 89% rename from addons/docs/src/lib/docgen/typeScript/createType.ts rename to lib/docs-tools/src/argTypes/docgen/typeScript/createType.ts index c2022c90d4f..9aa53722f04 100644 --- a/addons/docs/src/lib/docgen/typeScript/createType.ts +++ b/lib/docs-tools/src/argTypes/docgen/typeScript/createType.ts @@ -1,4 +1,4 @@ -import { PropType } from '@storybook/components'; +import { PropType } from '../PropDef'; import { DocgenInfo } from '../types'; import { createSummaryValue } from '../../utils'; diff --git a/addons/docs/src/lib/docgen/types.ts b/lib/docs-tools/src/argTypes/docgen/types.ts similarity index 96% rename from addons/docs/src/lib/docgen/types.ts rename to lib/docs-tools/src/argTypes/docgen/types.ts index c1e9c8734f3..3f6cd1d3020 100644 --- a/addons/docs/src/lib/docgen/types.ts +++ b/lib/docs-tools/src/argTypes/docgen/types.ts @@ -1,6 +1,6 @@ import type { StrictArgTypes } from '@storybook/csf'; import type { PropDef } from './PropDef'; -import type { Component } from '../../blocks/types'; +import type { Component } from '../types'; export type PropsExtractor = (component: Component) => { rows?: PropDef[] } | null; diff --git a/addons/docs/src/lib/docgen/utils/defaultValue.ts b/lib/docs-tools/src/argTypes/docgen/utils/defaultValue.ts similarity index 100% rename from addons/docs/src/lib/docgen/utils/defaultValue.ts rename to lib/docs-tools/src/argTypes/docgen/utils/defaultValue.ts diff --git a/addons/docs/src/lib/docgen/utils/docgenInfo.ts b/lib/docs-tools/src/argTypes/docgen/utils/docgenInfo.ts similarity index 92% rename from addons/docs/src/lib/docgen/utils/docgenInfo.ts rename to lib/docs-tools/src/argTypes/docgen/utils/docgenInfo.ts index da7f21f7a06..73da47deca5 100644 --- a/addons/docs/src/lib/docgen/utils/docgenInfo.ts +++ b/lib/docs-tools/src/argTypes/docgen/utils/docgenInfo.ts @@ -1,6 +1,6 @@ /* eslint-disable no-underscore-dangle */ -import { Component } from '../../../blocks/types'; +import { Component } from '../../types'; import { str } from './string'; export function hasDocgen(component: Component): boolean { diff --git a/addons/docs/src/lib/docgen/utils/index.ts b/lib/docs-tools/src/argTypes/docgen/utils/index.ts similarity index 100% rename from addons/docs/src/lib/docgen/utils/index.ts rename to lib/docs-tools/src/argTypes/docgen/utils/index.ts diff --git a/addons/docs/src/lib/docgen/utils/string.ts b/lib/docs-tools/src/argTypes/docgen/utils/string.ts similarity index 100% rename from addons/docs/src/lib/docgen/utils/string.ts rename to lib/docs-tools/src/argTypes/docgen/utils/string.ts diff --git a/lib/docs-tools/src/argTypes/enhanceArgTypes.test.ts b/lib/docs-tools/src/argTypes/enhanceArgTypes.test.ts new file mode 100644 index 00000000000..5380ac6a4ef --- /dev/null +++ b/lib/docs-tools/src/argTypes/enhanceArgTypes.test.ts @@ -0,0 +1,269 @@ +import type { ArgTypes } from '@storybook/api'; +import type { StrictInputType } from '@storybook/csf'; +import { enhanceArgTypes } from './enhanceArgTypes'; + +expect.addSnapshotSerializer({ + print: (val: any) => JSON.stringify(val, null, 2), + test: (val) => typeof val !== 'string', +}); + +const enhance = ({ + argType, + arg, + extractedArgTypes, + isArgsStory = true, +}: { + argType?: StrictInputType; + arg?: any; + extractedArgTypes?: ArgTypes; + isArgsStory?: boolean; +}) => { + const context = { + componentId: 'foo', + title: 'foo', + kind: 'foo', + id: 'foo--bar', + name: 'bar', + story: 'bar', + component: 'dummy', + parameters: { + __isArgsStory: isArgsStory, + docs: { + extractArgTypes: extractedArgTypes && (() => extractedArgTypes), + }, + }, + argTypes: argType && { input: argType }, + initialArgs: { input: arg }, + args: { input: arg }, + globals: {}, + }; + return enhanceArgTypes(context); +}; + +describe('enhanceArgTypes', () => { + describe('no-args story function', () => { + it('should no-op', () => { + expect( + enhance({ + argType: { name: 'input', foo: 'unmodified', type: { name: 'number' } }, + isArgsStory: false, + }).input + ).toMatchInlineSnapshot(` + { + "name": "input", + "foo": "unmodified", + "type": { + "name": "number" + } + } + `); + }); + }); + describe('args story function', () => { + describe('single-source input', () => { + describe('argTypes input', () => { + it('number', () => { + expect( + enhance({ + argType: { name: 'input', type: { name: 'number' } }, + }).input + ).toMatchInlineSnapshot(` + { + "name": "input", + "type": { + "name": "number" + } + } + `); + }); + }); + + describe('extraction from component', () => { + it('number', () => { + expect( + enhance({ extractedArgTypes: { input: { name: 'input', type: { name: 'number' } } } }) + .input + ).toMatchInlineSnapshot(` + { + "name": "input", + "type": { + "name": "number" + } + } + `); + }); + }); + + describe('controls input', () => { + it('range', () => { + expect( + enhance({ + argType: { name: 'input', control: { type: 'range', min: 0, max: 100 } }, + }).input + ).toMatchInlineSnapshot(` + { + "name": "input", + "control": { + "type": "range", + "min": 0, + "max": 100 + } + } + `); + }); + it('options', () => { + expect( + enhance({ + argType: { name: 'input', control: { type: 'radio', options: [1, 2] } }, + }).input + ).toMatchInlineSnapshot(` + { + "name": "input", + "control": { + "type": "radio", + "options": [ + 1, + 2 + ] + } + } + `); + }); + }); + }); + + describe('mixed-source input', () => { + it('user-specified argTypes take precedence over extracted argTypes', () => { + expect( + enhance({ + argType: { name: 'input', type: { name: 'number' } }, + extractedArgTypes: { input: { type: { name: 'string' } } }, + }).input + ).toMatchInlineSnapshot(` + { + "type": { + "name": "number" + }, + "name": "input" + } + `); + }); + + it('user-specified argTypes take precedence over inferred argTypes', () => { + expect( + enhance({ + argType: { name: 'input', type: { name: 'number' } }, + arg: 'hello', + }).input + ).toMatchInlineSnapshot(` + { + "name": "input", + "type": { + "name": "number" + } + } + `); + }); + + it('extracted argTypes take precedence over inferred argTypes', () => { + expect( + enhance({ + extractedArgTypes: { input: { type: { name: 'string' } } }, + arg: 6, + }).input + ).toMatchInlineSnapshot(` + { + "type": { + "name": "string" + } + } + `); + }); + + it('user-specified controls take precedence over inferred controls', () => { + expect( + enhance({ + argType: { name: 'input', defaultValue: 5, control: { type: 'range', step: 50 } }, + arg: 3, + extractedArgTypes: { input: { name: 'input' } }, + }).input + ).toMatchInlineSnapshot(` + { + "name": "input", + "defaultValue": 5, + "control": { + "type": "range", + "step": 50 + } + } + `); + }); + + it('includes extracted argTypes when there are no user-specified argTypes', () => { + expect( + enhance({ + arg: 3, + extractedArgTypes: { input: { name: 'input' }, foo: { type: { name: 'number' } } }, + }) + ).toMatchInlineSnapshot(` + { + "input": { + "name": "input" + }, + "foo": { + "type": { + "name": "number" + } + } + } + `); + }); + + it('includes extracted argTypes when user-specified argTypes match', () => { + expect( + enhance({ + argType: { name: 'input', type: { name: 'number' } }, + extractedArgTypes: { input: { name: 'input' }, foo: { type: { name: 'number' } } }, + }) + ).toMatchInlineSnapshot(` + { + "input": { + "name": "input", + "type": { + "name": "number" + } + }, + "foo": { + "type": { + "name": "number" + } + } + } + `); + }); + + it('excludes extracted argTypes when user-specified argTypes do not match', () => { + expect( + enhance({ + argType: { name: 'input', type: { name: 'number' } }, + extractedArgTypes: { foo: { type: { name: 'number' } } }, + }) + ).toMatchInlineSnapshot(` + { + "foo": { + "type": { + "name": "number" + } + }, + "input": { + "name": "input", + "type": { + "name": "number" + } + } + } + `); + }); + }); + }); +}); diff --git a/lib/docs-tools/src/argTypes/enhanceArgTypes.ts b/lib/docs-tools/src/argTypes/enhanceArgTypes.ts new file mode 100644 index 00000000000..540b80e56b4 --- /dev/null +++ b/lib/docs-tools/src/argTypes/enhanceArgTypes.ts @@ -0,0 +1,20 @@ +import { AnyFramework, StoryContextForEnhancers } from '@storybook/csf'; +import { combineParameters } from '@storybook/store'; + +export const enhanceArgTypes = ( + context: StoryContextForEnhancers +) => { + const { + component, + argTypes: userArgTypes, + parameters: { docs = {} }, + } = context; + const { extractArgTypes } = docs; + + const extractedArgTypes = extractArgTypes && component ? extractArgTypes(component) : {}; + const withExtractedTypes = extractedArgTypes + ? combineParameters(extractedArgTypes, userArgTypes) + : userArgTypes; + + return withExtractedTypes; +}; diff --git a/lib/docs-tools/src/argTypes/index.ts b/lib/docs-tools/src/argTypes/index.ts new file mode 100644 index 00000000000..44761ab8643 --- /dev/null +++ b/lib/docs-tools/src/argTypes/index.ts @@ -0,0 +1,8 @@ +export * from './convert'; +export * from './docgen'; + +export * from './jsdocParser'; +export * from './types'; +export * from './utils'; + +export * from './enhanceArgTypes'; diff --git a/addons/docs/src/lib/jsdocParser.test.ts b/lib/docs-tools/src/argTypes/jsdocParser.test.ts similarity index 100% rename from addons/docs/src/lib/jsdocParser.test.ts rename to lib/docs-tools/src/argTypes/jsdocParser.test.ts diff --git a/addons/docs/src/lib/jsdocParser.ts b/lib/docs-tools/src/argTypes/jsdocParser.ts similarity index 100% rename from addons/docs/src/lib/jsdocParser.ts rename to lib/docs-tools/src/argTypes/jsdocParser.ts diff --git a/lib/docs-tools/src/argTypes/types.ts b/lib/docs-tools/src/argTypes/types.ts new file mode 100644 index 00000000000..d0f1029edef --- /dev/null +++ b/lib/docs-tools/src/argTypes/types.ts @@ -0,0 +1 @@ +export type Component = any; diff --git a/lib/docs-tools/src/argTypes/typings.d.ts b/lib/docs-tools/src/argTypes/typings.d.ts new file mode 100644 index 00000000000..2496ff59dc1 --- /dev/null +++ b/lib/docs-tools/src/argTypes/typings.d.ts @@ -0,0 +1 @@ +declare module 'require-from-string'; diff --git a/addons/docs/src/lib/utils.test.ts b/lib/docs-tools/src/argTypes/utils.test.ts similarity index 100% rename from addons/docs/src/lib/utils.test.ts rename to lib/docs-tools/src/argTypes/utils.test.ts diff --git a/addons/docs/src/lib/utils.ts b/lib/docs-tools/src/argTypes/utils.ts similarity index 91% rename from addons/docs/src/lib/utils.ts rename to lib/docs-tools/src/argTypes/utils.ts index b623c12e19b..b0f7b6ddf14 100644 --- a/addons/docs/src/lib/utils.ts +++ b/lib/docs-tools/src/argTypes/utils.ts @@ -1,4 +1,4 @@ -import { PropSummaryValue } from '@storybook/components'; +import { PropSummaryValue } from './docgen'; export const MAX_TYPE_SUMMARY_LENGTH = 90; export const MAX_DEFAULT_VALUE_SUMMARY_LENGTH = 50; diff --git a/lib/docs-tools/src/index.ts b/lib/docs-tools/src/index.ts new file mode 100644 index 00000000000..42f31e5436c --- /dev/null +++ b/lib/docs-tools/src/index.ts @@ -0,0 +1,2 @@ +export * from './argTypes'; +export * from './shared'; diff --git a/lib/docs-tools/src/shared.ts b/lib/docs-tools/src/shared.ts new file mode 100644 index 00000000000..178bf46ca38 --- /dev/null +++ b/lib/docs-tools/src/shared.ts @@ -0,0 +1,28 @@ +export const ADDON_ID = 'storybook/docs'; +export const PANEL_ID = `${ADDON_ID}/panel`; +export const PARAM_KEY = `docs`; + +export const SNIPPET_RENDERED = `${ADDON_ID}/snippet-rendered`; + +export enum SourceType { + /** + * AUTO is the default + * + * Use the CODE logic if: + * - the user has set a custom source snippet in `docs.source.code` story parameter + * - the story is not an args-based story + * + * Use the DYNAMIC rendered snippet if the story is an args story + */ + AUTO = 'auto', + + /** + * Render the code extracted by source-loader + */ + CODE = 'code', + + /** + * Render dynamically-rendered source snippet from the story's virtual DOM (currently React only) + */ + DYNAMIC = 'dynamic', +} diff --git a/lib/docs-tools/tsconfig.json b/lib/docs-tools/tsconfig.json new file mode 100644 index 00000000000..fb14222847d --- /dev/null +++ b/lib/docs-tools/tsconfig.json @@ -0,0 +1,20 @@ +{ + "extends": "../../tsconfig.json", + "compilerOptions": { + "rootDir": "./src", + "types": [ + "node" + ] + }, + "include": [ + "src/**/*" + ], + "exclude": [ + "src/**/*.test.*", + "src/**/tests/**/*", + "src/**/__tests__/**/*", + "src/**/*.stories.*", + "src/**/*.mockdata.*", + "src/**/__testfixtures__/**" + ] +} \ No newline at end of file diff --git a/nx.json b/nx.json index 663353aee34..588fa7bfcf8 100644 --- a/nx.json +++ b/nx.json @@ -70,6 +70,9 @@ "@storybook/angular": { "implicitDependencies": [] }, + "@storybook/docs-tools": { + "implicitDependencies": [] + }, "@storybook/ember": { "implicitDependencies": [] }, diff --git a/package.json b/package.json index e966b634fab..d40d3be31cc 100644 --- a/package.json +++ b/package.json @@ -164,6 +164,7 @@ "@storybook/core": "workspace:*", "@storybook/core-events": "workspace:*", "@storybook/csf-tools": "workspace:*", + "@storybook/docs-tools": "workspace:*", "@storybook/ember": "workspace:*", "@storybook/eslint-config-storybook": "^2.4.0", "@storybook/html": "workspace:*", diff --git a/workspace.json b/workspace.json index f4ea5394d9c..9fcfaf6e853 100644 --- a/workspace.json +++ b/workspace.json @@ -69,6 +69,10 @@ "root": "app/angular", "type": "library" }, + "@storybook/docs-tools": { + "root": "app/docs-tools", + "type": "library" + }, "@storybook/ember": { "root": "app/ember", "type": "library" diff --git a/yarn.lock b/yarn.lock index f80961de801..4eeacf2cdb4 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2768,32 +2768,6 @@ __metadata: languageName: node linkType: hard -"@ember/test-helpers@npm:^2.1.4": - version: 2.6.0 - resolution: "@ember/test-helpers@npm:2.6.0" - dependencies: - "@ember/test-waiters": ^3.0.0 - broccoli-debug: ^0.6.5 - broccoli-funnel: ^3.0.8 - ember-cli-babel: ^7.26.6 - ember-cli-htmlbars: ^5.7.1 - ember-destroyable-polyfill: ^2.0.3 - checksum: 76f125590f683e4af22be0242657fe4ccbfd97950d8db33f17519638e9a84ba859489650410b80f2ec8d81eb34f577883f65309a2fc63c178ff75759ebc18b35 - languageName: node - linkType: hard - -"@ember/test-waiters@npm:^3.0.0": - version: 3.0.1 - resolution: "@ember/test-waiters@npm:3.0.1" - dependencies: - calculate-cache-key-for-tree: ^2.0.0 - ember-cli-babel: ^7.26.6 - ember-cli-version-checker: ^5.1.2 - semver: ^7.3.5 - checksum: 5c4ed1a8e6851a8cfbccad268073932920bc575b36e22da2351feeab2ee73810f620d707194c73c6dff0a5aca3440952102b96519cd54cc4f9cc4957a1abcf41 - languageName: node - linkType: hard - "@emotion/cache@npm:^10.0.27": version: 10.0.29 resolution: "@emotion/cache@npm:10.0.29" @@ -2840,7 +2814,7 @@ __metadata: languageName: node linkType: hard -"@emotion/is-prop-valid@npm:0.8.8, @emotion/is-prop-valid@npm:^0.8.1, @emotion/is-prop-valid@npm:^0.8.6, @emotion/is-prop-valid@npm:^0.8.8": +"@emotion/is-prop-valid@npm:0.8.8, @emotion/is-prop-valid@npm:^0.8.1, @emotion/is-prop-valid@npm:^0.8.6": version: 0.8.8 resolution: "@emotion/is-prop-valid@npm:0.8.8" dependencies: @@ -2914,14 +2888,14 @@ __metadata: languageName: node linkType: hard -"@emotion/stylis@npm:0.8.5, @emotion/stylis@npm:^0.8.4": +"@emotion/stylis@npm:0.8.5": version: 0.8.5 resolution: "@emotion/stylis@npm:0.8.5" checksum: f109e3f11cb0d48e8658aaa23578c5bcfe35e297819cfb089a3de6ba8dc0f89b0960474922690c6028df5d2e1895b4967f2fb280642c030054c312f1e137ce26 languageName: node linkType: hard -"@emotion/unitless@npm:0.7.5, @emotion/unitless@npm:^0.7.0, @emotion/unitless@npm:^0.7.4": +"@emotion/unitless@npm:0.7.5, @emotion/unitless@npm:^0.7.0": version: 0.7.5 resolution: "@emotion/unitless@npm:0.7.5" checksum: 4d0d94f53cb97b4481bbfa394953e1899a0b877644642ba9dd7247c27eb8c48e14e22aeb11411d7d9874685ad85dd5fb5b50eb78c6d8840eb56a84b92dcef2f4 @@ -4492,13 +4466,6 @@ __metadata: languageName: node linkType: hard -"@lit/reactive-element@npm:^1.3.0": - version: 1.3.0 - resolution: "@lit/reactive-element@npm:1.3.0" - checksum: a92a6762d8d9f1be19720021034fb20c6e446a6c530257668e536a0468156fa44276b301d0b1ffa34161ec986e09628a477542a0e40acfc37edbc7f29c7b7f39 - languageName: node - linkType: hard - "@mdx-js/mdx@npm:^1.6.22": version: 1.6.22 resolution: "@mdx-js/mdx@npm:1.6.22" @@ -6353,134 +6320,53 @@ __metadata: version: 0.0.0-use.local resolution: "@storybook/addon-docs@workspace:addons/docs" dependencies: - "@angular/core": ^11.2.14 "@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 - "@emotion/core": ^10.3.1 - "@emotion/styled": ^10.0.27 "@jest/transform": ^26.6.2 "@mdx-js/react": ^1.6.22 "@storybook/addons": 6.5.0-alpha.47 - "@storybook/angular": 6.5.0-alpha.47 "@storybook/api": 6.5.0-alpha.47 - "@storybook/builder-webpack4": 6.5.0-alpha.47 - "@storybook/client-logger": 6.5.0-alpha.47 "@storybook/components": 6.5.0-alpha.47 - "@storybook/core": 6.5.0-alpha.47 + "@storybook/core-common": 6.5.0-alpha.47 "@storybook/core-events": 6.5.0-alpha.47 "@storybook/csf": 0.0.2--canary.87bc651.0 - "@storybook/csf-tools": 6.5.0-alpha.47 - "@storybook/html": 6.5.0-alpha.47 + "@storybook/docs-tools": 6.5.0-alpha.47 "@storybook/mdx1-csf": canary "@storybook/mdx2-csf": canary "@storybook/node-logger": 6.5.0-alpha.47 "@storybook/postinstall": 6.5.0-alpha.47 "@storybook/preview-web": 6.5.0-alpha.47 - "@storybook/react": 6.5.0-alpha.47 "@storybook/source-loader": 6.5.0-alpha.47 "@storybook/store": 6.5.0-alpha.47 "@storybook/theming": 6.5.0-alpha.47 - "@storybook/vue": 6.5.0-alpha.47 - "@storybook/web-components": 6.5.0-alpha.47 - "@types/cross-spawn": ^6.0.2 - "@types/doctrine": ^0.0.3 - "@types/estree": ^0.0.44 - "@types/loader-utils": ^2.0.0 - "@types/prop-types": ^15.7.3 - "@types/tmp": ^0.2.0 "@types/util-deprecate": ^1.0.0 - acorn: ^7.4.1 - acorn-jsx: ^5.3.1 - acorn-walk: ^7.2.0 babel-loader: ^8.0.0 - babel-plugin-react-docgen: ^4.2.1 core-js: ^3.8.2 - cross-spawn: ^7.0.3 - doctrine: ^3.0.0 - escodegen: ^2.0.0 fast-deep-equal: ^3.1.3 global: ^4.4.0 - html-tags: ^3.1.0 - jest: ^26.6.3 - jest-specific-snapshot: ^4.0.0 - lit-element: ^3.0.2 - lit-html: ^2.0.2 - loader-utils: ^2.0.0 lodash: ^4.17.21 - nanoid: ^3.1.23 - p-limit: ^3.1.0 - prettier: ">=2.2.1 <=2.3.0" - 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 - require-from-string: ^2.0.2 - rxjs: ^6.6.3 - styled-components: ^5.2.1 - sveltedoc-parser: 4.1.0 - tmp: ^0.2.1 ts-dedent: ^2.0.0 util-deprecate: ^1.0.2 - vue: ^2.6.10 webpack: 4 - zone.js: ^0.11.3 peerDependencies: - "@storybook/angular": 6.5.0-alpha.47 - "@storybook/html": 6.5.0-alpha.47 "@storybook/mdx2-csf": "*" - "@storybook/react": 6.5.0-alpha.47 - "@storybook/vue": 6.5.0-alpha.47 - "@storybook/vue3": 6.5.0-alpha.47 - "@storybook/web-components": 6.5.0-alpha.47 - lit: ^2.0.0 - lit-html: ^1.4.1 || ^2.0.0 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/builder-webpack4": optional: true "@storybook/builder-webpack5": optional: true - "@storybook/html": - optional: true - "@storybook/manager-webpack4": - optional: true - "@storybook/manager-webpack5": - optional: true "@storybook/mdx2-csf": optional: true - "@storybook/react": - optional: true - "@storybook/vue": - optional: true - "@storybook/vue3": - optional: true - "@storybook/web-components": - optional: true - lit: - optional: true - lit-html: - optional: true react: optional: true react-dom: optional: true - svelte: - optional: true - sveltedoc-parser: - optional: true - vue: - optional: true webpack: optional: true languageName: unknown @@ -6965,38 +6851,43 @@ __metadata: "@nrwl/workspace": ^11.6.3 "@storybook/addons": 6.5.0-alpha.47 "@storybook/api": 6.5.0-alpha.47 + "@storybook/client-logger": 6.5.0-alpha.47 "@storybook/core": 6.5.0-alpha.47 "@storybook/core-common": 6.5.0-alpha.47 "@storybook/core-events": 6.5.0-alpha.47 "@storybook/csf": 0.0.2--canary.87bc651.0 + "@storybook/docs-tools": 6.5.0-alpha.47 "@storybook/node-logger": 6.5.0-alpha.47 "@storybook/semver": ^7.3.2 "@storybook/store": 6.5.0-alpha.47 "@types/autoprefixer": ^9.7.2 - "@types/jest": ^26.0.16 "@types/node": ^14.14.20 || ^16.0.0 "@types/react": ^16.14.23 "@types/react-dom": ^16.9.14 "@types/webpack-env": ^1.16.0 autoprefixer: ^9.8.6 core-js: ^3.8.2 + cross-spawn: ^7.0.3 find-up: ^5.0.0 fork-ts-checker-webpack-plugin: ^4.1.6 global: ^4.4.0 jest: ^26.6.3 jest-preset-angular: ^8.3.2 + jest-specific-snapshot: ^4.0.0 + nanoid: ^3.1.23 + p-limit: ^3.1.0 postcss: ^7.0.36 postcss-loader: ^4.2.0 + prettier: ">=2.2.1 <=2.3.0" raw-loader: ^4.0.2 react: ^16.14.0 react-dom: ^16.14.0 read-pkg-up: ^7.0.1 regenerator-runtime: ^0.13.7 sass-loader: ^10.1.0 - strip-json-comments: 3.1.1 telejson: ^5.3.3 + tmp: ^0.2.1 ts-dedent: ^2.0.0 - ts-jest: ^26.4.4 ts-loader: ^8.0.14 tsconfig-paths-webpack-plugin: ^3.3.0 util-deprecate: ^1.0.2 @@ -7699,6 +7590,22 @@ __metadata: languageName: node linkType: hard +"@storybook/docs-tools@6.5.0-alpha.47, @storybook/docs-tools@workspace:*, @storybook/docs-tools@workspace:lib/docs-tools": + version: 0.0.0-use.local + resolution: "@storybook/docs-tools@workspace:lib/docs-tools" + dependencies: + "@babel/core": ^7.12.10 + "@storybook/csf": 0.0.2--canary.87bc651.0 + "@storybook/store": 6.5.0-alpha.47 + core-js: ^3.8.2 + doctrine: ^3.0.0 + jest-specific-snapshot: ^4.0.0 + lodash: ^4.17.21 + regenerator-runtime: ^0.13.7 + require-from-string: ^2.0.2 + languageName: unknown + linkType: soft + "@storybook/ember-cli-storybook@npm:^0.2.1": version: 0.2.1 resolution: "@storybook/ember-cli-storybook@npm:0.2.1" @@ -7715,9 +7622,9 @@ __metadata: version: 0.0.0-use.local resolution: "@storybook/ember@workspace:app/ember" dependencies: - "@ember/test-helpers": ^2.1.4 "@storybook/core": 6.5.0-alpha.47 "@storybook/core-common": 6.5.0-alpha.47 + "@storybook/docs-tools": 6.5.0-alpha.47 "@storybook/store": 6.5.0-alpha.47 core-js: ^3.8.2 global: ^4.4.0 @@ -7808,10 +7715,10 @@ __metadata: resolution: "@storybook/html@workspace:app/html" dependencies: "@storybook/addons": 6.5.0-alpha.47 - "@storybook/client-api": 6.5.0-alpha.47 "@storybook/core": 6.5.0-alpha.47 "@storybook/core-common": 6.5.0-alpha.47 "@storybook/csf": 0.0.2--canary.87bc651.0 + "@storybook/docs-tools": 6.5.0-alpha.47 "@storybook/preview-web": 6.5.0-alpha.47 "@storybook/store": 6.5.0-alpha.47 "@types/node": ^14.14.20 || ^16.0.0 @@ -7824,6 +7731,7 @@ __metadata: read-pkg-up: ^7.0.1 regenerator-runtime: ^0.13.7 ts-dedent: ^2.0.0 + webpack: 4 peerDependencies: "@babel/core": "*" bin: @@ -8183,33 +8091,42 @@ __metadata: "@babel/preset-react": ^7.12.10 "@pmmmwh/react-refresh-webpack-plugin": ^0.5.3 "@storybook/addons": 6.5.0-alpha.47 - "@storybook/client-api": 6.5.0-alpha.47 + "@storybook/client-logger": 6.5.0-alpha.47 "@storybook/core": 6.5.0-alpha.47 "@storybook/core-common": 6.5.0-alpha.47 "@storybook/csf": 0.0.2--canary.87bc651.0 + "@storybook/docs-tools": 6.5.0-alpha.47 "@storybook/node-logger": 6.5.0-alpha.47 "@storybook/react-docgen-typescript-plugin": 1.0.2-canary.6.9d540b91e815f8fc2f8829189deb00553559ff63.0 "@storybook/semver": ^7.3.2 "@storybook/store": 6.5.0-alpha.47 "@types/node": ^14.14.20 || ^16.0.0 - "@types/prompts": ^2.0.9 + "@types/util-deprecate": ^1.0.0 "@types/webpack-env": ^1.16.0 + acorn: ^7.4.1 + acorn-jsx: ^5.3.1 + acorn-walk: ^7.2.0 babel-plugin-add-react-displayname: ^0.0.5 - babel-plugin-named-asset-import: ^0.3.1 babel-plugin-react-docgen: ^4.2.1 core-js: ^3.8.2 + escodegen: ^2.0.0 global: ^4.4.0 + html-tags: ^3.1.0 lodash: ^4.17.21 prop-types: ^15.7.2 + react-element-to-jsx-string: ^14.3.4 react-refresh: ^0.11.0 read-pkg-up: ^7.0.1 regenerator-runtime: ^0.13.7 ts-dedent: ^2.0.0 + util-deprecate: ^1.0.2 webpack: 4 peerDependencies: "@babel/core": ^7.11.5 + jest-specific-snapshot: ^4.0.0 react: ^16.8.0 || ^17.0.0 react-dom: ^16.8.0 || ^17.0.0 + require-from-string: ^2.0.2 peerDependenciesMeta: "@babel/core": optional: true @@ -8297,6 +8214,7 @@ __metadata: "@storybook/core": "workspace:*" "@storybook/core-events": "workspace:*" "@storybook/csf-tools": "workspace:*" + "@storybook/docs-tools": "workspace:*" "@storybook/ember": "workspace:*" "@storybook/eslint-config-storybook": ^2.4.0 "@storybook/html": "workspace:*" @@ -8617,21 +8535,27 @@ __metadata: resolution: "@storybook/svelte@workspace:app/svelte" dependencies: "@storybook/addons": 6.5.0-alpha.47 + "@storybook/client-logger": 6.5.0-alpha.47 "@storybook/core": 6.5.0-alpha.47 "@storybook/core-common": 6.5.0-alpha.47 "@storybook/csf": 0.0.2--canary.87bc651.0 + "@storybook/docs-tools": 6.5.0-alpha.47 + "@storybook/node-logger": 6.5.0-alpha.47 "@storybook/store": 6.5.0-alpha.47 + "@types/loader-utils": ^2.0.0 "@types/webpack-env": ^1.16.0 core-js: ^3.8.2 global: ^4.4.0 + loader-utils: ^2.0.0 react: 16.14.0 react-dom: 16.14.0 read-pkg-up: ^7.0.1 regenerator-runtime: ^0.13.7 svelte: ^3.31.2 svelte-loader: ^3.0.0 - sveltedoc-parser: ^4.1.0 + sveltedoc-parser: 4.1.0 ts-dedent: ^2.0.0 + webpack: 4 peerDependencies: "@babel/core": "*" svelte: ^3.1.0 @@ -8753,6 +8677,7 @@ __metadata: "@storybook/core": 6.5.0-alpha.47 "@storybook/core-common": 6.5.0-alpha.47 "@storybook/csf": 0.0.2--canary.87bc651.0 + "@storybook/docs-tools": 6.5.0-alpha.47 "@storybook/store": 6.5.0-alpha.47 "@types/node": ^14.14.20 || ^16.0.0 "@types/webpack-env": ^1.16.0 @@ -8787,14 +8712,17 @@ __metadata: resolution: "@storybook/vue@workspace:app/vue" dependencies: "@storybook/addons": 6.5.0-alpha.47 + "@storybook/client-logger": 6.5.0-alpha.47 "@storybook/core": 6.5.0-alpha.47 "@storybook/core-common": 6.5.0-alpha.47 "@storybook/csf": 0.0.2--canary.87bc651.0 + "@storybook/docs-tools": 6.5.0-alpha.47 "@storybook/store": 6.5.0-alpha.47 "@types/node": ^14.14.20 || ^16.0.0 "@types/webpack-env": ^1.16.0 core-js: ^3.8.2 global: ^4.4.0 + prettier: ">=2.2.1 <=2.3.0" react: 16.14.0 react-dom: 16.14.0 read-pkg-up: ^7.0.1 @@ -8821,7 +8749,7 @@ __metadata: languageName: unknown linkType: soft -"@storybook/web-components@6.5.0-alpha.47, @storybook/web-components@workspace:*, @storybook/web-components@workspace:app/web-components": +"@storybook/web-components@workspace:*, @storybook/web-components@workspace:app/web-components": version: 0.0.0-use.local resolution: "@storybook/web-components@workspace:app/web-components" dependencies: @@ -8830,9 +8758,11 @@ __metadata: "@babel/preset-env": ^7.12.11 "@storybook/addons": 6.5.0-alpha.47 "@storybook/client-api": 6.5.0-alpha.47 + "@storybook/client-logger": 6.5.0-alpha.47 "@storybook/core": 6.5.0-alpha.47 "@storybook/core-common": 6.5.0-alpha.47 "@storybook/csf": 0.0.2--canary.87bc651.0 + "@storybook/docs-tools": 6.5.0-alpha.47 "@storybook/preview-web": 6.5.0-alpha.47 "@storybook/store": 6.5.0-alpha.47 "@types/node": ^14.14.20 || ^16.0.0 @@ -9597,13 +9527,6 @@ __metadata: languageName: node linkType: hard -"@types/estree@npm:^0.0.44": - version: 0.0.44 - resolution: "@types/estree@npm:0.0.44" - checksum: 3659c1f020b3b4351a30301a46ad0321189316bf75288823d606c4b561c5a64d28591712cd706763aafa35690c51dece35a7567c676896814c31e48ffc3b135f - languageName: node - linkType: hard - "@types/estree@npm:^0.0.46": version: 0.0.46 resolution: "@types/estree@npm:0.0.46" @@ -10398,13 +10321,6 @@ __metadata: languageName: node linkType: hard -"@types/tmp@npm:^0.2.0": - version: 0.2.3 - resolution: "@types/tmp@npm:0.2.3" - checksum: a9a32d723b483713ef537af31caddfcc2129ba21a0d56f5e4eef39508e07d415b1ec7327486d15b2cd4ac277deaaef0f8368ed1a0f4029e5ef5c393f9c15856b - languageName: node - linkType: hard - "@types/trusted-types@npm:^2.0.2": version: 2.0.2 resolution: "@types/trusted-types@npm:2.0.2" @@ -12443,7 +12359,7 @@ __metadata: languageName: node linkType: hard -"acorn@npm:^8.0.0, acorn@npm:^8.2.4, acorn@npm:^8.4.1, acorn@npm:^8.5.0, acorn@npm:^8.6.0": +"acorn@npm:^8.0.0, acorn@npm:^8.2.4, acorn@npm:^8.4.1, acorn@npm:^8.5.0": version: 8.7.0 resolution: "acorn@npm:8.7.0" bin: @@ -13434,21 +13350,6 @@ __metadata: languageName: node linkType: hard -"async-disk-cache@npm:^2.0.0": - version: 2.1.0 - resolution: "async-disk-cache@npm:2.1.0" - dependencies: - debug: ^4.1.1 - heimdalljs: ^0.2.3 - istextorbinary: ^2.5.1 - mkdirp: ^0.5.0 - rimraf: ^3.0.0 - rsvp: ^4.8.5 - username-sync: ^1.0.2 - checksum: 131110af8f0c21ebdc32154c6650bf9156589fcf2c237cf2935128855dc4d543db94c1b6315bf65c85dcc8c3d4d3e9ab4428983b5ee54d20bc6593735237088b - languageName: node - linkType: hard - "async-each@npm:^1.0.1": version: 1.0.3 resolution: "async-each@npm:1.0.3" @@ -13874,17 +13775,6 @@ __metadata: languageName: node linkType: hard -"babel-plugin-debug-macros@npm:^0.2.0": - version: 0.2.0 - resolution: "babel-plugin-debug-macros@npm:0.2.0" - dependencies: - semver: ^5.3.0 - peerDependencies: - "@babel/core": ^7.0.0-beta.42 - checksum: d70d26a0e3ceeb5af0c91b0726448cec237f433afa5b493ba344a615f63ab29576c92e391f834c8c7cce57a549bf7a3e5f663771dac216daaf9887727090d901 - languageName: node - linkType: hard - "babel-plugin-debug-macros@npm:^0.3.3, babel-plugin-debug-macros@npm:^0.3.4": version: 0.3.4 resolution: "babel-plugin-debug-macros@npm:0.3.4" @@ -13967,19 +13857,6 @@ __metadata: languageName: node linkType: hard -"babel-plugin-htmlbars-inline-precompile@npm:^5.0.0": - version: 5.3.1 - resolution: "babel-plugin-htmlbars-inline-precompile@npm:5.3.1" - dependencies: - babel-plugin-ember-modules-api-polyfill: ^3.5.0 - line-column: ^1.0.2 - magic-string: ^0.25.7 - parse-static-imports: ^1.1.0 - string.prototype.matchall: ^4.0.5 - checksum: 8a93893d22f5dc6cb8c271c228311b3cb60b01df247f592e0d88df88b690114f7193fc2175c72de3ad3898a81a53dc0c407c6f059801315dea912e5628c9a5fa - languageName: node - linkType: hard - "babel-plugin-istanbul@npm:^5.1.0": version: 5.2.0 resolution: "babel-plugin-istanbul@npm:5.2.0" @@ -14074,7 +13951,7 @@ __metadata: languageName: node linkType: hard -"babel-plugin-named-asset-import@npm:^0.3.1, babel-plugin-named-asset-import@npm:^0.3.6, babel-plugin-named-asset-import@npm:^0.3.7": +"babel-plugin-named-asset-import@npm:^0.3.6, babel-plugin-named-asset-import@npm:^0.3.7": version: 0.3.8 resolution: "babel-plugin-named-asset-import@npm:0.3.8" peerDependencies: @@ -14161,7 +14038,7 @@ __metadata: languageName: node linkType: hard -"babel-plugin-styled-components@npm:>= 1, babel-plugin-styled-components@npm:>= 1.12.0": +"babel-plugin-styled-components@npm:>= 1": version: 2.0.6 resolution: "babel-plugin-styled-components@npm:2.0.6" dependencies: @@ -14597,7 +14474,7 @@ __metadata: languageName: node linkType: hard -"binaryextensions@npm:1 || 2, binaryextensions@npm:^2.1.2": +"binaryextensions@npm:1 || 2": version: 2.3.0 resolution: "binaryextensions@npm:2.3.0" checksum: 5b118f3b864a9908109c93d0534e21983c0cf2e064c00e2866f60af3920179c85f1ca74275271b66c9381d8d5ea8c9bd254d50cf279dbcb3a9dfb9e40baaa3f2 @@ -15069,21 +14946,6 @@ __metadata: languageName: node linkType: hard -"broccoli-funnel@npm:^3.0.8": - version: 3.0.8 - resolution: "broccoli-funnel@npm:3.0.8" - dependencies: - array-equal: ^1.0.0 - broccoli-plugin: ^4.0.7 - debug: ^4.1.1 - fs-tree-diff: ^2.0.1 - heimdalljs: ^0.2.0 - minimatch: ^3.0.0 - walk-sync: ^2.0.2 - checksum: 0cffcd9e8b075151348a59ff37e20a3b235e70b3c8ae58c39b6dfe35d2242e00d06d670cac8a412b459a04fb6427ae186ddaf2834f6492ed4a96163f119c7f27 - languageName: node - linkType: hard - "broccoli-kitchen-sink-helpers@npm:^0.2.5": version: 0.2.9 resolution: "broccoli-kitchen-sink-helpers@npm:0.2.9" @@ -15230,25 +15092,6 @@ __metadata: languageName: node linkType: hard -"broccoli-persistent-filter@npm:^3.1.2": - version: 3.1.2 - resolution: "broccoli-persistent-filter@npm:3.1.2" - dependencies: - async-disk-cache: ^2.0.0 - async-promise-queue: ^1.0.3 - broccoli-plugin: ^4.0.3 - fs-tree-diff: ^2.0.0 - hash-for-dep: ^1.5.0 - heimdalljs: ^0.2.1 - heimdalljs-logger: ^0.1.7 - promise-map-series: ^0.2.1 - rimraf: ^3.0.0 - symlink-or-copy: ^1.0.1 - sync-disk-cache: ^2.0.0 - checksum: 349d716019c1e273eff4ef93233d7753e66610a5b9aacdcc4e1b3faecdc4ea7b2a9ed8ad982ae1ba7a5bce35a470637d4db0c9534300952582c630f4cc14485a - languageName: node - linkType: hard - "broccoli-plugin@npm:1.1.0": version: 1.1.0 resolution: "broccoli-plugin@npm:1.1.0" @@ -15300,7 +15143,7 @@ __metadata: languageName: node linkType: hard -"broccoli-plugin@npm:^4.0.2, broccoli-plugin@npm:^4.0.3, broccoli-plugin@npm:^4.0.7": +"broccoli-plugin@npm:^4.0.2": version: 4.0.7 resolution: "broccoli-plugin@npm:4.0.7" dependencies: @@ -18355,17 +18198,6 @@ __metadata: languageName: node linkType: hard -"css-to-react-native@npm:^3.0.0": - version: 3.0.0 - resolution: "css-to-react-native@npm:3.0.0" - dependencies: - camelize: ^1.0.0 - css-color-keywords: ^1.0.0 - postcss-value-parser: ^4.0.2 - checksum: 03dcf5381ff6a888e3621aaffd812fd52df803d01c264b99142a9f73942007c2e953bd27339d6e2da2504a940a2b0d3cc702d3a737165703a0d8ae9c5626c1c1 - languageName: node - linkType: hard - "css-tree@npm:1.0.0-alpha.37": version: 1.0.0-alpha.37 resolution: "css-tree@npm:1.0.0-alpha.37" @@ -19920,16 +19752,6 @@ __metadata: languageName: node linkType: hard -"editions@npm:^2.2.0": - version: 2.3.1 - resolution: "editions@npm:2.3.1" - dependencies: - errlop: ^2.0.0 - semver: ^6.3.0 - checksum: 18a507230eff7a16e4f6839323ba9a9c9504a3ae46efcf6d0512fe639a43e64c977f17b2f586987e319f8308674d148f0201e960ef29d3d0207e65f8fe5d77e9 - languageName: node - linkType: hard - "ee-first@npm:1.1.1": version: 1.1.1 resolution: "ee-first@npm:1.1.1" @@ -20027,7 +19849,7 @@ __metadata: languageName: node linkType: hard -"ember-cli-babel@npm:^7.1.2, ember-cli-babel@npm:^7.13.0, ember-cli-babel@npm:^7.13.2, ember-cli-babel@npm:^7.19.0, ember-cli-babel@npm:^7.22.1, ember-cli-babel@npm:^7.23.0, ember-cli-babel@npm:^7.26.6, ember-cli-babel@npm:^7.5.0, ember-cli-babel@npm:^7.7.3": +"ember-cli-babel@npm:^7.1.2, ember-cli-babel@npm:^7.13.0, ember-cli-babel@npm:^7.13.2, ember-cli-babel@npm:^7.19.0, ember-cli-babel@npm:^7.22.1, ember-cli-babel@npm:^7.23.0, ember-cli-babel@npm:^7.5.0, ember-cli-babel@npm:^7.7.3": version: 7.26.11 resolution: "ember-cli-babel@npm:7.26.11" dependencies: @@ -20094,30 +19916,6 @@ __metadata: languageName: node linkType: hard -"ember-cli-htmlbars@npm:^5.7.1": - version: 5.7.2 - resolution: "ember-cli-htmlbars@npm:5.7.2" - dependencies: - "@ember/edition-utils": ^1.2.0 - babel-plugin-htmlbars-inline-precompile: ^5.0.0 - broccoli-debug: ^0.6.5 - broccoli-persistent-filter: ^3.1.2 - broccoli-plugin: ^4.0.3 - common-tags: ^1.8.0 - ember-cli-babel-plugin-helpers: ^1.1.1 - ember-cli-version-checker: ^5.1.2 - fs-tree-diff: ^2.0.1 - hash-for-dep: ^1.5.1 - heimdalljs-logger: ^0.1.10 - json-stable-stringify: ^1.0.1 - semver: ^7.3.4 - silent-error: ^1.1.1 - strip-bom: ^4.0.0 - walk-sync: ^2.2.0 - checksum: 7c4e69947f396056af21d1b153bcb97dd958fcfc52cc1f7cd7e84a6dc90558ca4b63bc3a77066c96da519cdd7733b565d800c4ab3643d5010612b6e322dd15dc - languageName: node - linkType: hard - "ember-cli-inject-live-reload@npm:^2.0.2": version: 2.1.0 resolution: "ember-cli-inject-live-reload@npm:2.1.0" @@ -20260,7 +20058,7 @@ __metadata: languageName: node linkType: hard -"ember-cli-version-checker@npm:^5.1.1, ember-cli-version-checker@npm:^5.1.2": +"ember-cli-version-checker@npm:^5.1.1": version: 5.1.2 resolution: "ember-cli-version-checker@npm:5.1.2" dependencies: @@ -20372,30 +20170,6 @@ __metadata: languageName: node linkType: hard -"ember-compatibility-helpers@npm:^1.2.1": - version: 1.2.6 - resolution: "ember-compatibility-helpers@npm:1.2.6" - dependencies: - babel-plugin-debug-macros: ^0.2.0 - ember-cli-version-checker: ^5.1.1 - find-up: ^5.0.0 - fs-extra: ^9.1.0 - semver: ^5.4.1 - checksum: 691390534e43623b0e339540ef42362b97e142f136487e1031ff53afc2772cce94c3b0db7dab1e09446a58c2e23d3c075af00e87805e61fb2b2a164d81daa417 - languageName: node - linkType: hard - -"ember-destroyable-polyfill@npm:^2.0.3": - version: 2.0.3 - resolution: "ember-destroyable-polyfill@npm:2.0.3" - dependencies: - ember-cli-babel: ^7.22.1 - ember-cli-version-checker: ^5.1.1 - ember-compatibility-helpers: ^1.2.1 - checksum: da2dbb6bbf7d0ca56d96aeba9ce46ad31cd3f690a376c2fdd9e6b3a111bb68c60765fd49e9a39ab7032011df7b28af21fb87a2a27e83582084bf2956b5441005 - languageName: node - linkType: hard - "ember-example@workspace:examples/ember-cli": version: 0.0.0-use.local resolution: "ember-example@workspace:examples/ember-cli" @@ -20910,13 +20684,6 @@ __metadata: languageName: node linkType: hard -"errlop@npm:^2.0.0": - version: 2.2.0 - resolution: "errlop@npm:2.2.0" - checksum: dd4bcd0cf9d3c0942dbfbf8c07d10715bbf06118d53f4b77102e8b653e421e3858abb613ff4e5f55df62f01fa54ea31a7cea620b05c43d20a2c040aac3c46085 - languageName: node - linkType: hard - "errno@npm:^0.1.1, errno@npm:^0.1.3, errno@npm:~0.1.1, errno@npm:~0.1.7": version: 0.1.8 resolution: "errno@npm:0.1.8" @@ -21690,7 +21457,7 @@ __metadata: languageName: node linkType: hard -"eslint-visitor-keys@npm:^3.0.0, eslint-visitor-keys@npm:^3.1.0": +"eslint-visitor-keys@npm:^3.0.0": version: 3.3.0 resolution: "eslint-visitor-keys@npm:3.3.0" checksum: fc6a9b5bdee8d90e35e7564fd9db10fdf507a2c089a4f0d4d3dd091f7f4ac6790547c8b1b7a760642ef819f875ef86dd5bcb8cdf01b0775f57a699f4e6a20a18 @@ -21782,17 +21549,6 @@ __metadata: languageName: node linkType: hard -"espree@npm:9.2.0": - version: 9.2.0 - resolution: "espree@npm:9.2.0" - dependencies: - acorn: ^8.6.0 - acorn-jsx: ^5.3.1 - eslint-visitor-keys: ^3.1.0 - checksum: fa0acceb6bf151193b873379ba8ee3771c93ce3b656aeb9fe4a36adcf170e315925096e8addddd2d347ae6026ab18febc5892e314e6b109b61a9c3be75f88dc0 - languageName: node - linkType: hard - "espree@npm:^7.3.0, espree@npm:^7.3.1": version: 7.3.1 resolution: "espree@npm:7.3.1" @@ -24974,7 +24730,7 @@ __metadata: languageName: node linkType: hard -"hoist-non-react-statics@npm:^3.0.0, hoist-non-react-statics@npm:^3.3.0": +"hoist-non-react-statics@npm:^3.3.0": version: 3.3.2 resolution: "hoist-non-react-statics@npm:3.3.2" dependencies: @@ -27388,17 +27144,6 @@ __metadata: languageName: node linkType: hard -"istextorbinary@npm:^2.5.1": - version: 2.6.0 - resolution: "istextorbinary@npm:2.6.0" - dependencies: - binaryextensions: ^2.1.2 - editions: ^2.2.0 - textextensions: ^2.5.0 - checksum: 43efaf1eecc740defc3f445383553ec3fe248e368c86a5ad58010a265bd3ac30f85e65216fbd5cccac6efe265e1dd6eb1a2b83f9a7707140ec335b3402fe89cc - languageName: node - linkType: hard - "iterate-iterator@npm:^1.0.1": version: 1.0.2 resolution: "iterate-iterator@npm:1.0.2" @@ -29938,16 +29683,6 @@ __metadata: languageName: node linkType: hard -"line-column@npm:^1.0.2": - version: 1.0.2 - resolution: "line-column@npm:1.0.2" - dependencies: - isarray: ^1.0.0 - isobject: ^2.0.0 - checksum: 75aa918a9791362a3369c7222689350dc6df5b040314525ba79c3682f1386e13a3ceddd6b2584b8cb5c3ab3a5b3c50c940a182772dbb6361303bf6ef65fc2d64 - languageName: node - linkType: hard - "lines-and-columns@npm:^1.1.6": version: 1.2.4 resolution: "lines-and-columns@npm:1.2.4" @@ -30028,16 +29763,6 @@ __metadata: languageName: node linkType: hard -"lit-element@npm:^3.0.2": - version: 3.2.0 - resolution: "lit-element@npm:3.2.0" - dependencies: - "@lit/reactive-element": ^1.3.0 - lit-html: ^2.2.0 - checksum: d3b3e8b7fe47c4fbf75de0dca70bfa4c7f874dede7a2a5561a4c03e5bd7b4d18ba111b1c36cea14423ab2a7fd9b8c1a4d2f224a5012ab23b3ddb46600e08d5af - languageName: node - linkType: hard - "lit-html@npm:2.0.2": version: 2.0.2 resolution: "lit-html@npm:2.0.2" @@ -30047,15 +29772,6 @@ __metadata: languageName: node linkType: hard -"lit-html@npm:^2.0.2, lit-html@npm:^2.2.0": - version: 2.2.0 - resolution: "lit-html@npm:2.2.0" - dependencies: - "@types/trusted-types": ^2.0.2 - checksum: 9e7d593c0c7b657791e919fa315f66377444741faac4de574b3b64c50bdd5a8fbda8c61274616ccc546beb26712c5f6117f4297d805beac66fb0b14a604e3d7a - languageName: node - linkType: hard - "livereload-js@npm:^3.3.1": version: 3.3.3 resolution: "livereload-js@npm:3.3.3" @@ -34699,13 +34415,6 @@ __metadata: languageName: node linkType: hard -"parse-static-imports@npm:^1.1.0": - version: 1.1.0 - resolution: "parse-static-imports@npm:1.1.0" - checksum: 24a210b3ed4fc8ab4d79a807956484a60f97cd0e8174d4c2c88c034fdba65d87ce62ec293aadee46e07d476959610a905a2b80d60b343fd525e057479cabfbbe - languageName: node - linkType: hard - "parse-url@npm:^6.0.0": version: 6.0.0 resolution: "parse-url@npm:6.0.0" @@ -42221,7 +41930,7 @@ __metadata: languageName: node linkType: hard -"string.prototype.matchall@npm:^4.0.0 || ^3.0.1, string.prototype.matchall@npm:^4.0.2, string.prototype.matchall@npm:^4.0.5, string.prototype.matchall@npm:^4.0.6": +"string.prototype.matchall@npm:^4.0.0 || ^3.0.1, string.prototype.matchall@npm:^4.0.2, string.prototype.matchall@npm:^4.0.6": version: 4.0.6 resolution: "string.prototype.matchall@npm:4.0.6" dependencies: @@ -42480,7 +42189,7 @@ __metadata: languageName: node linkType: hard -"strip-json-comments@npm:3.1.1, strip-json-comments@npm:^3.1.0, strip-json-comments@npm:^3.1.1": +"strip-json-comments@npm:^3.1.0, strip-json-comments@npm:^3.1.1": version: 3.1.1 resolution: "strip-json-comments@npm:3.1.1" checksum: 9681a6257b925a7fa0f285851c0e613cc934a50661fa7bb41ca9cbbff89686bb4a0ee366e6ecedc4daafd01e83eee0720111ab294366fe7c185e935475ebcecd @@ -42574,28 +42283,6 @@ __metadata: languageName: node linkType: hard -"styled-components@npm:^5.2.1": - version: 5.3.3 - resolution: "styled-components@npm:5.3.3" - dependencies: - "@babel/helper-module-imports": ^7.0.0 - "@babel/traverse": ^7.4.5 - "@emotion/is-prop-valid": ^0.8.8 - "@emotion/stylis": ^0.8.4 - "@emotion/unitless": ^0.7.4 - babel-plugin-styled-components: ">= 1.12.0" - css-to-react-native: ^3.0.0 - hoist-non-react-statics: ^3.0.0 - shallowequal: ^1.1.0 - supports-color: ^5.5.0 - peerDependencies: - react: ">= 16.8.0" - react-dom: ">= 16.8.0" - react-is: ">= 16.8.0" - checksum: 0fda77406c668a16c753f0778850a90d5fbeae419791dac533e3f67e77f8c767d89022626aafa169fffe8b0873e15bf71126b2bab945dc98af6079d8b90e7488 - languageName: node - linkType: hard - "styled_string@npm:0.0.1": version: 0.0.1 resolution: "styled_string@npm:0.0.1" @@ -42885,17 +42572,6 @@ __metadata: languageName: node linkType: hard -"sveltedoc-parser@npm:^4.1.0": - version: 4.3.1 - resolution: "sveltedoc-parser@npm:4.3.1" - dependencies: - eslint: 8.4.1 - espree: 9.2.0 - htmlparser2-svelte: 4.1.0 - checksum: 38e0258956fcf1bbe2ecc61286b73e96eedbec62e236c6b3adfc7055a4b2b50034b99f887a9e5eaccac233a87ccbc9434abe156f6a3ef25a640dcb54a4b99f46 - languageName: node - linkType: hard - "svg-parser@npm:^2.0.0, svg-parser@npm:^2.0.2": version: 2.0.4 resolution: "svg-parser@npm:2.0.4" @@ -43008,19 +42684,6 @@ __metadata: languageName: node linkType: hard -"sync-disk-cache@npm:^2.0.0": - version: 2.1.0 - resolution: "sync-disk-cache@npm:2.1.0" - dependencies: - debug: ^4.1.1 - heimdalljs: ^0.2.6 - mkdirp: ^0.5.0 - rimraf: ^3.0.0 - username-sync: ^1.0.2 - checksum: d1bfc95940188d500f17aaec249e45fbf55c30839d9a68be8a28606183b149beb87c76969e74372ba601ea50b42716489673ea7031334f42f98ec2f06921b59c - languageName: node - linkType: hard - "synchronous-promise@npm:^2.0.15": version: 2.0.15 resolution: "synchronous-promise@npm:2.0.15" @@ -43403,7 +43066,7 @@ __metadata: languageName: node linkType: hard -"textextensions@npm:1 || 2, textextensions@npm:^2.5.0": +"textextensions@npm:1 || 2": version: 2.6.0 resolution: "textextensions@npm:2.6.0" checksum: 02cb5eb25a0a4597d402a6971741a2d49335e699051db44e4f252ecb4249bb193f08068ecd6d880565f7b34c84832fe60f4b82119b9a2d5e3e58e85509c3dc96 @@ -45981,7 +45644,7 @@ __metadata: languageName: node linkType: hard -"vue@npm:^2.6.10, vue@npm:^2.6.12": +"vue@npm:^2.6.12": version: 2.6.14 resolution: "vue@npm:2.6.14" checksum: efbe26ccc7c1bd025b88e464ebc81217b92350a77b98049122a46ac2242e249719f930d3914e2efdeaaa521a51e6e6b1cb9ffbf95b4835ed94dc92efb481040f From 56796df6355cc9aed46f20586b747ab719d8a4ae Mon Sep 17 00:00:00 2001 From: Michael Shilman Date: Sat, 12 Mar 2022 11:53:29 +0800 Subject: [PATCH 02/17] Missing files --- addons/docs/src/frameworks/common/config.ts | 6 +- .../frameworks/common/enhanceArgTypes.test.ts | 269 ------------------ .../src/frameworks/common/enhanceArgTypes.ts | 20 -- 3 files changed, 1 insertion(+), 294 deletions(-) delete mode 100644 addons/docs/src/frameworks/common/enhanceArgTypes.test.ts delete mode 100644 addons/docs/src/frameworks/common/enhanceArgTypes.ts diff --git a/addons/docs/src/frameworks/common/config.ts b/addons/docs/src/frameworks/common/config.ts index f5ec177688f..10f3227e89d 100644 --- a/addons/docs/src/frameworks/common/config.ts +++ b/addons/docs/src/frameworks/common/config.ts @@ -1,12 +1,8 @@ -import { enhanceArgTypes } from './enhanceArgTypes'; - export const parameters = { docs: { inlineStories: false, getContainer: async () => (await import('../../blocks')).DocsContainer, getPage: async () => (await import('../../blocks')).DocsPage, - iframeHeight: 100, + iframeHeight: 110, }, }; - -export const argTypesEnhancers = [enhanceArgTypes]; diff --git a/addons/docs/src/frameworks/common/enhanceArgTypes.test.ts b/addons/docs/src/frameworks/common/enhanceArgTypes.test.ts deleted file mode 100644 index 5380ac6a4ef..00000000000 --- a/addons/docs/src/frameworks/common/enhanceArgTypes.test.ts +++ /dev/null @@ -1,269 +0,0 @@ -import type { ArgTypes } from '@storybook/api'; -import type { StrictInputType } from '@storybook/csf'; -import { enhanceArgTypes } from './enhanceArgTypes'; - -expect.addSnapshotSerializer({ - print: (val: any) => JSON.stringify(val, null, 2), - test: (val) => typeof val !== 'string', -}); - -const enhance = ({ - argType, - arg, - extractedArgTypes, - isArgsStory = true, -}: { - argType?: StrictInputType; - arg?: any; - extractedArgTypes?: ArgTypes; - isArgsStory?: boolean; -}) => { - const context = { - componentId: 'foo', - title: 'foo', - kind: 'foo', - id: 'foo--bar', - name: 'bar', - story: 'bar', - component: 'dummy', - parameters: { - __isArgsStory: isArgsStory, - docs: { - extractArgTypes: extractedArgTypes && (() => extractedArgTypes), - }, - }, - argTypes: argType && { input: argType }, - initialArgs: { input: arg }, - args: { input: arg }, - globals: {}, - }; - return enhanceArgTypes(context); -}; - -describe('enhanceArgTypes', () => { - describe('no-args story function', () => { - it('should no-op', () => { - expect( - enhance({ - argType: { name: 'input', foo: 'unmodified', type: { name: 'number' } }, - isArgsStory: false, - }).input - ).toMatchInlineSnapshot(` - { - "name": "input", - "foo": "unmodified", - "type": { - "name": "number" - } - } - `); - }); - }); - describe('args story function', () => { - describe('single-source input', () => { - describe('argTypes input', () => { - it('number', () => { - expect( - enhance({ - argType: { name: 'input', type: { name: 'number' } }, - }).input - ).toMatchInlineSnapshot(` - { - "name": "input", - "type": { - "name": "number" - } - } - `); - }); - }); - - describe('extraction from component', () => { - it('number', () => { - expect( - enhance({ extractedArgTypes: { input: { name: 'input', type: { name: 'number' } } } }) - .input - ).toMatchInlineSnapshot(` - { - "name": "input", - "type": { - "name": "number" - } - } - `); - }); - }); - - describe('controls input', () => { - it('range', () => { - expect( - enhance({ - argType: { name: 'input', control: { type: 'range', min: 0, max: 100 } }, - }).input - ).toMatchInlineSnapshot(` - { - "name": "input", - "control": { - "type": "range", - "min": 0, - "max": 100 - } - } - `); - }); - it('options', () => { - expect( - enhance({ - argType: { name: 'input', control: { type: 'radio', options: [1, 2] } }, - }).input - ).toMatchInlineSnapshot(` - { - "name": "input", - "control": { - "type": "radio", - "options": [ - 1, - 2 - ] - } - } - `); - }); - }); - }); - - describe('mixed-source input', () => { - it('user-specified argTypes take precedence over extracted argTypes', () => { - expect( - enhance({ - argType: { name: 'input', type: { name: 'number' } }, - extractedArgTypes: { input: { type: { name: 'string' } } }, - }).input - ).toMatchInlineSnapshot(` - { - "type": { - "name": "number" - }, - "name": "input" - } - `); - }); - - it('user-specified argTypes take precedence over inferred argTypes', () => { - expect( - enhance({ - argType: { name: 'input', type: { name: 'number' } }, - arg: 'hello', - }).input - ).toMatchInlineSnapshot(` - { - "name": "input", - "type": { - "name": "number" - } - } - `); - }); - - it('extracted argTypes take precedence over inferred argTypes', () => { - expect( - enhance({ - extractedArgTypes: { input: { type: { name: 'string' } } }, - arg: 6, - }).input - ).toMatchInlineSnapshot(` - { - "type": { - "name": "string" - } - } - `); - }); - - it('user-specified controls take precedence over inferred controls', () => { - expect( - enhance({ - argType: { name: 'input', defaultValue: 5, control: { type: 'range', step: 50 } }, - arg: 3, - extractedArgTypes: { input: { name: 'input' } }, - }).input - ).toMatchInlineSnapshot(` - { - "name": "input", - "defaultValue": 5, - "control": { - "type": "range", - "step": 50 - } - } - `); - }); - - it('includes extracted argTypes when there are no user-specified argTypes', () => { - expect( - enhance({ - arg: 3, - extractedArgTypes: { input: { name: 'input' }, foo: { type: { name: 'number' } } }, - }) - ).toMatchInlineSnapshot(` - { - "input": { - "name": "input" - }, - "foo": { - "type": { - "name": "number" - } - } - } - `); - }); - - it('includes extracted argTypes when user-specified argTypes match', () => { - expect( - enhance({ - argType: { name: 'input', type: { name: 'number' } }, - extractedArgTypes: { input: { name: 'input' }, foo: { type: { name: 'number' } } }, - }) - ).toMatchInlineSnapshot(` - { - "input": { - "name": "input", - "type": { - "name": "number" - } - }, - "foo": { - "type": { - "name": "number" - } - } - } - `); - }); - - it('excludes extracted argTypes when user-specified argTypes do not match', () => { - expect( - enhance({ - argType: { name: 'input', type: { name: 'number' } }, - extractedArgTypes: { foo: { type: { name: 'number' } } }, - }) - ).toMatchInlineSnapshot(` - { - "foo": { - "type": { - "name": "number" - } - }, - "input": { - "name": "input", - "type": { - "name": "number" - } - } - } - `); - }); - }); - }); -}); diff --git a/addons/docs/src/frameworks/common/enhanceArgTypes.ts b/addons/docs/src/frameworks/common/enhanceArgTypes.ts deleted file mode 100644 index 540b80e56b4..00000000000 --- a/addons/docs/src/frameworks/common/enhanceArgTypes.ts +++ /dev/null @@ -1,20 +0,0 @@ -import { AnyFramework, StoryContextForEnhancers } from '@storybook/csf'; -import { combineParameters } from '@storybook/store'; - -export const enhanceArgTypes = ( - context: StoryContextForEnhancers -) => { - const { - component, - argTypes: userArgTypes, - parameters: { docs = {} }, - } = context; - const { extractArgTypes } = docs; - - const extractedArgTypes = extractArgTypes && component ? extractArgTypes(component) : {}; - const withExtractedTypes = extractedArgTypes - ? combineParameters(extractedArgTypes, userArgTypes) - : userArgTypes; - - return withExtractedTypes; -}; From e772002895ce3a08f63d44831241118c42b3c4d8 Mon Sep 17 00:00:00 2001 From: Michael Shilman Date: Sat, 12 Mar 2022 12:27:25 +0800 Subject: [PATCH 03/17] Angular: Add docs preset to framework --- addons/docs/angular/index.d.ts | 2 +- addons/docs/angular/index.js | 8 +++++++- app/angular/package.json | 11 ++++++++--- app/angular/src/builders/build-storybook/index.ts | 2 +- .../__testfixtures__/doc-button/argtypes.snapshot | 0 .../doc-button/compodoc-posix.snapshot | 0 .../doc-button/compodoc-windows.snapshot | 0 .../client/docs}/__testfixtures__/doc-button/input.ts | 0 .../__testfixtures__/doc-button/properties.snapshot | 0 .../docs}/__testfixtures__/doc-button/tsconfig.json | 0 .../src/client/docs}/angular-properties.test.ts | 1 + .../angular/src/client/docs}/compodoc.test.ts | 0 .../angular/src/client/docs}/compodoc.ts | 0 .../angular => app/angular/src/client/docs}/config.ts | 4 +++- .../angular => app/angular/src/client/docs}/index.ts | 0 .../angular/src/client/docs}/prepareForInline.ts | 4 ++-- .../angular/src/client/docs}/sourceDecorator.ts | 6 +++--- .../angular => app/angular/src/client/docs}/types.ts | 0 .../src/server/framework-preset-angular-docs.ts | 7 +++++++ app/angular/src/server/preset.ts | 1 + yarn.lock | 1 + 21 files changed, 35 insertions(+), 12 deletions(-) rename {addons/docs/src/frameworks/angular => app/angular/src/client/docs}/__testfixtures__/doc-button/argtypes.snapshot (100%) rename {addons/docs/src/frameworks/angular => app/angular/src/client/docs}/__testfixtures__/doc-button/compodoc-posix.snapshot (100%) rename {addons/docs/src/frameworks/angular => app/angular/src/client/docs}/__testfixtures__/doc-button/compodoc-windows.snapshot (100%) rename {addons/docs/src/frameworks/angular => app/angular/src/client/docs}/__testfixtures__/doc-button/input.ts (100%) rename {addons/docs/src/frameworks/angular => app/angular/src/client/docs}/__testfixtures__/doc-button/properties.snapshot (100%) rename {addons/docs/src/frameworks/angular => app/angular/src/client/docs}/__testfixtures__/doc-button/tsconfig.json (100%) rename {addons/docs/src/frameworks/angular => app/angular/src/client/docs}/angular-properties.test.ts (99%) rename {addons/docs/src/frameworks/angular => app/angular/src/client/docs}/compodoc.test.ts (100%) rename {addons/docs/src/frameworks/angular => app/angular/src/client/docs}/compodoc.ts (100%) rename {addons/docs/src/frameworks/angular => app/angular/src/client/docs}/config.ts (81%) rename {addons/docs/src/frameworks/angular => app/angular/src/client/docs}/index.ts (100%) rename {addons/docs/src/frameworks/angular => app/angular/src/client/docs}/prepareForInline.ts (87%) rename {addons/docs/src/frameworks/angular => app/angular/src/client/docs}/sourceDecorator.ts (91%) rename {addons/docs/src/frameworks/angular => app/angular/src/client/docs}/types.ts (100%) create mode 100644 app/angular/src/server/framework-preset-angular-docs.ts diff --git a/addons/docs/angular/index.d.ts b/addons/docs/angular/index.d.ts index f2a8c405207..f63f89b4d1f 100644 --- a/addons/docs/angular/index.d.ts +++ b/addons/docs/angular/index.d.ts @@ -1 +1 @@ -export * from '../dist/ts3.9/frameworks/angular/index.d'; +export declare const setCompodocJson: (compodocJson: any) => void; diff --git a/addons/docs/angular/index.js b/addons/docs/angular/index.js index aab19f758f2..3fd4c7ea527 100644 --- a/addons/docs/angular/index.js +++ b/addons/docs/angular/index.js @@ -1 +1,7 @@ -module.exports = require('../dist/esm/frameworks/angular/index'); +/* eslint-disable no-underscore-dangle */ +/* global window */ + +export const setCompodocJson = (compodocJson) => { + // @ts-ignore + window.__STORYBOOK_COMPODOC_JSON__ = compodocJson; +}; diff --git a/app/angular/package.json b/app/angular/package.json index bc404778a8b..d2e8907486d 100644 --- a/app/angular/package.json +++ b/app/angular/package.json @@ -47,10 +47,12 @@ "dependencies": { "@storybook/addons": "6.5.0-alpha.47", "@storybook/api": "6.5.0-alpha.47", + "@storybook/client-logger": "6.5.0-alpha.47", "@storybook/core": "6.5.0-alpha.47", "@storybook/core-common": "6.5.0-alpha.47", "@storybook/core-events": "6.5.0-alpha.47", "@storybook/csf": "0.0.2--canary.87bc651.0", + "@storybook/docs-tools": "6.5.0-alpha.47", "@storybook/node-logger": "6.5.0-alpha.47", "@storybook/semver": "^7.3.2", "@storybook/store": "6.5.0-alpha.47", @@ -63,15 +65,17 @@ "find-up": "^5.0.0", "fork-ts-checker-webpack-plugin": "^4.1.6", "global": "^4.4.0", + "nanoid": "^3.1.23", + "p-limit": "^3.1.0", "postcss": "^7.0.36", "postcss-loader": "^4.2.0", + "prettier": ">=2.2.1 <=2.3.0", "raw-loader": "^4.0.2", "react": "^16.14.0", "react-dom": "^16.14.0", "read-pkg-up": "^7.0.1", "regenerator-runtime": "^0.13.7", "sass-loader": "^10.1.0", - "strip-json-comments": "3.1.1", "telejson": "^5.3.3", "ts-dedent": "^2.0.0", "ts-loader": "^8.0.14", @@ -93,10 +97,11 @@ "@angular/platform-browser-dynamic": "^11.2.14", "@nrwl/workspace": "^11.6.3", "@types/autoprefixer": "^9.7.2", - "@types/jest": "^26.0.16", + "cross-spawn": "^7.0.3", "jest": "^26.6.3", "jest-preset-angular": "^8.3.2", - "ts-jest": "^26.4.4" + "jest-specific-snapshot": "^4.0.0", + "tmp": "^0.2.1" }, "peerDependencies": { "@angular-devkit/architect": ">=0.8.9", diff --git a/app/angular/src/builders/build-storybook/index.ts b/app/angular/src/builders/build-storybook/index.ts index 63c47785c9c..4fe76129d37 100644 --- a/app/angular/src/builders/build-storybook/index.ts +++ b/app/angular/src/builders/build-storybook/index.ts @@ -12,12 +12,12 @@ import { catchError, map, mapTo, switchMap } from 'rxjs/operators'; import { sync as findUpSync } from 'find-up'; // eslint-disable-next-line import/no-extraneous-dependencies -import buildStandalone, { StandaloneOptions } from '@storybook/angular/standalone'; import { BrowserBuilderOptions, ExtraEntryPoint, StylePreprocessorOptions, } from '@angular-devkit/build-angular'; +import buildStandalone, { StandaloneOptions } from '../../../standalone'; import { runCompodoc } from '../utils/run-compodoc'; import { buildStandaloneErrorHandler } from '../utils/build-standalone-errors-handler'; diff --git a/addons/docs/src/frameworks/angular/__testfixtures__/doc-button/argtypes.snapshot b/app/angular/src/client/docs/__testfixtures__/doc-button/argtypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/angular/__testfixtures__/doc-button/argtypes.snapshot rename to app/angular/src/client/docs/__testfixtures__/doc-button/argtypes.snapshot diff --git a/addons/docs/src/frameworks/angular/__testfixtures__/doc-button/compodoc-posix.snapshot b/app/angular/src/client/docs/__testfixtures__/doc-button/compodoc-posix.snapshot similarity index 100% rename from addons/docs/src/frameworks/angular/__testfixtures__/doc-button/compodoc-posix.snapshot rename to app/angular/src/client/docs/__testfixtures__/doc-button/compodoc-posix.snapshot diff --git a/addons/docs/src/frameworks/angular/__testfixtures__/doc-button/compodoc-windows.snapshot b/app/angular/src/client/docs/__testfixtures__/doc-button/compodoc-windows.snapshot similarity index 100% rename from addons/docs/src/frameworks/angular/__testfixtures__/doc-button/compodoc-windows.snapshot rename to app/angular/src/client/docs/__testfixtures__/doc-button/compodoc-windows.snapshot diff --git a/addons/docs/src/frameworks/angular/__testfixtures__/doc-button/input.ts b/app/angular/src/client/docs/__testfixtures__/doc-button/input.ts similarity index 100% rename from addons/docs/src/frameworks/angular/__testfixtures__/doc-button/input.ts rename to app/angular/src/client/docs/__testfixtures__/doc-button/input.ts diff --git a/addons/docs/src/frameworks/angular/__testfixtures__/doc-button/properties.snapshot b/app/angular/src/client/docs/__testfixtures__/doc-button/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/angular/__testfixtures__/doc-button/properties.snapshot rename to app/angular/src/client/docs/__testfixtures__/doc-button/properties.snapshot diff --git a/addons/docs/src/frameworks/angular/__testfixtures__/doc-button/tsconfig.json b/app/angular/src/client/docs/__testfixtures__/doc-button/tsconfig.json similarity index 100% rename from addons/docs/src/frameworks/angular/__testfixtures__/doc-button/tsconfig.json rename to app/angular/src/client/docs/__testfixtures__/doc-button/tsconfig.json diff --git a/addons/docs/src/frameworks/angular/angular-properties.test.ts b/app/angular/src/client/docs/angular-properties.test.ts similarity index 99% rename from addons/docs/src/frameworks/angular/angular-properties.test.ts rename to app/angular/src/client/docs/angular-properties.test.ts index 8532c65b03d..49c7f5661a6 100644 --- a/addons/docs/src/frameworks/angular/angular-properties.test.ts +++ b/app/angular/src/client/docs/angular-properties.test.ts @@ -6,6 +6,7 @@ import { sync as spawnSync } from 'cross-spawn'; import { findComponentByName, extractArgTypesFromData } from './compodoc'; +// @ts-ignore const { SNAPSHOT_OS } = global; // File hierarchy: __testfixtures__ / some-test-case / input.* diff --git a/addons/docs/src/frameworks/angular/compodoc.test.ts b/app/angular/src/client/docs/compodoc.test.ts similarity index 100% rename from addons/docs/src/frameworks/angular/compodoc.test.ts rename to app/angular/src/client/docs/compodoc.test.ts diff --git a/addons/docs/src/frameworks/angular/compodoc.ts b/app/angular/src/client/docs/compodoc.ts similarity index 100% rename from addons/docs/src/frameworks/angular/compodoc.ts rename to app/angular/src/client/docs/compodoc.ts diff --git a/addons/docs/src/frameworks/angular/config.ts b/app/angular/src/client/docs/config.ts similarity index 81% rename from addons/docs/src/frameworks/angular/config.ts rename to app/angular/src/client/docs/config.ts index 25f9626ec4d..70f19c61d0f 100644 --- a/addons/docs/src/frameworks/angular/config.ts +++ b/app/angular/src/client/docs/config.ts @@ -1,4 +1,4 @@ -import { SourceType } from '../../shared'; +import { SourceType, enhanceArgTypes } from '@storybook/docs-tools'; import { extractArgTypes, extractComponentDescription } from './compodoc'; import { sourceDecorator } from './sourceDecorator'; import { prepareForInline } from './prepareForInline'; @@ -18,3 +18,5 @@ export const parameters = { }; export const decorators = [sourceDecorator]; + +export const argTypesEnhancers = [enhanceArgTypes]; diff --git a/addons/docs/src/frameworks/angular/index.ts b/app/angular/src/client/docs/index.ts similarity index 100% rename from addons/docs/src/frameworks/angular/index.ts rename to app/angular/src/client/docs/index.ts diff --git a/addons/docs/src/frameworks/angular/prepareForInline.ts b/app/angular/src/client/docs/prepareForInline.ts similarity index 87% rename from addons/docs/src/frameworks/angular/prepareForInline.ts rename to app/angular/src/client/docs/prepareForInline.ts index 3e07c842248..4568782e824 100644 --- a/addons/docs/src/frameworks/angular/prepareForInline.ts +++ b/app/angular/src/client/docs/prepareForInline.ts @@ -2,9 +2,9 @@ import React from 'react'; import pLimit from 'p-limit'; import { nanoid } from 'nanoid'; -import { AngularFramework, StoryContext } from '@storybook/angular'; -import { rendererFactory } from '@storybook/angular/renderer'; import { PartialStoryFn } from '@storybook/csf'; +import { AngularFramework, StoryContext } from '..'; +import { rendererFactory } from '../../renderer'; const limit = pLimit(1); diff --git a/addons/docs/src/frameworks/angular/sourceDecorator.ts b/app/angular/src/client/docs/sourceDecorator.ts similarity index 91% rename from addons/docs/src/frameworks/angular/sourceDecorator.ts rename to app/angular/src/client/docs/sourceDecorator.ts index 1c38edbd17f..63c27e470f0 100644 --- a/addons/docs/src/frameworks/angular/sourceDecorator.ts +++ b/app/angular/src/client/docs/sourceDecorator.ts @@ -1,8 +1,8 @@ import { addons, useEffect } from '@storybook/addons'; import type { PartialStoryFn } from '@storybook/csf'; -import type { StoryContext, AngularFramework } from '@storybook/angular'; -import { computesTemplateSourceFromComponent } from '@storybook/angular/renderer'; -import { SNIPPET_RENDERED, SourceType } from '../../shared'; +import { SNIPPET_RENDERED, SourceType } from '@storybook/docs-tools'; +import { StoryContext, AngularFramework } from '..'; +import { computesTemplateSourceFromComponent } from '../../renderer'; export const skipSourceRender = (context: StoryContext) => { const sourceParams = context?.parameters.docs?.source; diff --git a/addons/docs/src/frameworks/angular/types.ts b/app/angular/src/client/docs/types.ts similarity index 100% rename from addons/docs/src/frameworks/angular/types.ts rename to app/angular/src/client/docs/types.ts diff --git a/app/angular/src/server/framework-preset-angular-docs.ts b/app/angular/src/server/framework-preset-angular-docs.ts new file mode 100644 index 00000000000..53f2fe09efa --- /dev/null +++ b/app/angular/src/server/framework-preset-angular-docs.ts @@ -0,0 +1,7 @@ +import path from 'path'; +import { StorybookConfig } from '@storybook/core-common'; + +export const config: StorybookConfig['config'] = (entry = [], options) => { + console.log({ options }); + return [...entry, path.join(__dirname, '../../../dist/ts3.9/client/docs/config')]; +}; diff --git a/app/angular/src/server/preset.ts b/app/angular/src/server/preset.ts index c4b3c1ffc72..ab7d7dd6305 100644 --- a/app/angular/src/server/preset.ts +++ b/app/angular/src/server/preset.ts @@ -9,4 +9,5 @@ export const addons: StorybookConfig['addons'] = [ require.resolve('./framework-preset-angular'), require.resolve('./framework-preset-angular-cli'), require.resolve('./framework-preset-angular-ivy'), + require.resolve('./framework-preset-angular-docs'), ]; diff --git a/yarn.lock b/yarn.lock index 4eeacf2cdb4..bbc677dd26d 100644 --- a/yarn.lock +++ b/yarn.lock @@ -8100,6 +8100,7 @@ __metadata: "@storybook/react-docgen-typescript-plugin": 1.0.2-canary.6.9d540b91e815f8fc2f8829189deb00553559ff63.0 "@storybook/semver": ^7.3.2 "@storybook/store": 6.5.0-alpha.47 + "@types/estree": ^0.0.51 "@types/node": ^14.14.20 || ^16.0.0 "@types/util-deprecate": ^1.0.0 "@types/webpack-env": ^1.16.0 From b9604088040ebd7d7eeb5c59afa8cb06b43150c8 Mon Sep 17 00:00:00 2001 From: Michael Shilman Date: Sat, 12 Mar 2022 12:28:11 +0800 Subject: [PATCH 04/17] Ember: Add docs preset to framework --- addons/docs/ember/index.js | 7 ++- app/ember/package.json | 2 +- app/ember/src/client/docs/config.js | 12 +++++ .../ember/src/client/docs}/index.js | 0 .../ember/src/client/docs}/jsondoc.js | 0 .../ember/src/client/preview/docs}/config.js | 0 app/ember/src/client/preview/docs/index.js | 1 + app/ember/src/client/preview/docs/jsondoc.js | 50 +++++++++++++++++++ .../src/server/framework-preset-ember-docs.ts | 6 +++ app/ember/src/server/options.ts | 5 +- 10 files changed, 80 insertions(+), 3 deletions(-) create mode 100644 app/ember/src/client/docs/config.js rename {addons/docs/src/frameworks/ember => app/ember/src/client/docs}/index.js (100%) rename {addons/docs/src/frameworks/ember => app/ember/src/client/docs}/jsondoc.js (100%) rename {addons/docs/src/frameworks/ember => app/ember/src/client/preview/docs}/config.js (100%) create mode 100644 app/ember/src/client/preview/docs/index.js create mode 100644 app/ember/src/client/preview/docs/jsondoc.js create mode 100644 app/ember/src/server/framework-preset-ember-docs.ts diff --git a/addons/docs/ember/index.js b/addons/docs/ember/index.js index edcab7e3604..b4ff874067c 100644 --- a/addons/docs/ember/index.js +++ b/addons/docs/ember/index.js @@ -1 +1,6 @@ -module.exports = require('../dist/esm/frameworks/ember'); +/* eslint-disable no-underscore-dangle */ +/* global window */ + +export const setJSONDoc = (jsondoc) => { + window.__EMBER_GENERATED_DOC_JSON__ = jsondoc; +}; diff --git a/app/ember/package.json b/app/ember/package.json index 99391bedf8e..44cc842a48e 100644 --- a/app/ember/package.json +++ b/app/ember/package.json @@ -42,9 +42,9 @@ "prepare": "node ../../scripts/prepare.js" }, "dependencies": { - "@ember/test-helpers": "^2.1.4", "@storybook/core": "6.5.0-alpha.47", "@storybook/core-common": "6.5.0-alpha.47", + "@storybook/docs-tools": "6.5.0-alpha.47", "@storybook/store": "6.5.0-alpha.47", "core-js": "^3.8.2", "global": "^4.4.0", diff --git a/app/ember/src/client/docs/config.js b/app/ember/src/client/docs/config.js new file mode 100644 index 00000000000..042ec16227e --- /dev/null +++ b/app/ember/src/client/docs/config.js @@ -0,0 +1,12 @@ +import { enhanceArgTypes } from '@storybook/docs-tools'; +import { extractArgTypes, extractComponentDescription } from './jsondoc'; + +export const parameters = { + docs: { + iframeHeight: 80, + extractArgTypes, + extractComponentDescription, + }, +}; + +export const argTypesEnhancers = [enhanceArgTypes]; diff --git a/addons/docs/src/frameworks/ember/index.js b/app/ember/src/client/docs/index.js similarity index 100% rename from addons/docs/src/frameworks/ember/index.js rename to app/ember/src/client/docs/index.js diff --git a/addons/docs/src/frameworks/ember/jsondoc.js b/app/ember/src/client/docs/jsondoc.js similarity index 100% rename from addons/docs/src/frameworks/ember/jsondoc.js rename to app/ember/src/client/docs/jsondoc.js diff --git a/addons/docs/src/frameworks/ember/config.js b/app/ember/src/client/preview/docs/config.js similarity index 100% rename from addons/docs/src/frameworks/ember/config.js rename to app/ember/src/client/preview/docs/config.js diff --git a/app/ember/src/client/preview/docs/index.js b/app/ember/src/client/preview/docs/index.js new file mode 100644 index 00000000000..fab7166db9d --- /dev/null +++ b/app/ember/src/client/preview/docs/index.js @@ -0,0 +1 @@ +export { setJSONDoc } from './jsondoc'; diff --git a/app/ember/src/client/preview/docs/jsondoc.js b/app/ember/src/client/preview/docs/jsondoc.js new file mode 100644 index 00000000000..f9e648ebc21 --- /dev/null +++ b/app/ember/src/client/preview/docs/jsondoc.js @@ -0,0 +1,50 @@ +/* eslint-disable no-underscore-dangle */ +/* global window */ + +export const setJSONDoc = (jsondoc) => { + window.__EMBER_GENERATED_DOC_JSON__ = jsondoc; +}; +export const getJSONDoc = () => { + return window.__EMBER_GENERATED_DOC_JSON__; +}; + +export const extractArgTypes = (componentName) => { + const json = getJSONDoc(); + if (!(json && json.included)) { + return null; + } + const componentDoc = json.included.find((doc) => doc.attributes.name === componentName); + + if (!componentDoc) { + return null; + } + return componentDoc.attributes.arguments.reduce((acc, prop) => { + acc[prop.name] = { + name: prop.name, + defaultValue: prop.defaultValue, + description: prop.description, + table: { + defaultValue: { summary: prop.defaultValue }, + type: { + summary: prop.type, + required: prop.tags.length ? prop.tags.some((tag) => tag.name === 'required') : false, + }, + }, + }; + return acc; + }, {}); +}; + +export const extractComponentDescription = (componentName) => { + const json = getJSONDoc(); + if (!(json && json.included)) { + return null; + } + const componentDoc = json.included.find((doc) => doc.attributes.name === componentName); + + if (!componentDoc) { + return null; + } + + return componentDoc.attributes.description; +}; diff --git a/app/ember/src/server/framework-preset-ember-docs.ts b/app/ember/src/server/framework-preset-ember-docs.ts new file mode 100644 index 00000000000..d2103c02d53 --- /dev/null +++ b/app/ember/src/server/framework-preset-ember-docs.ts @@ -0,0 +1,6 @@ +import type { StorybookConfig } from '@storybook/core-common'; +import { findDistEsm } from '@storybook/core-common'; + +export const config: StorybookConfig['config'] = (entry = []) => { + return [...entry, findDistEsm(__dirname, 'client/docs/config')]; +}; diff --git a/app/ember/src/server/options.ts b/app/ember/src/server/options.ts index 7f7d42a3c56..e418b10f04b 100644 --- a/app/ember/src/server/options.ts +++ b/app/ember/src/server/options.ts @@ -4,5 +4,8 @@ import type { LoadOptions } from '@storybook/core-common'; export default { packageJson: sync({ cwd: __dirname }).packageJson, framework: 'ember', - frameworkPresets: [require.resolve('./framework-preset-babel-ember.js')], + frameworkPresets: [ + require.resolve('./framework-preset-babel-ember.js'), + require.resolve('./framework-preset-ember-docs.js'), + ], } as LoadOptions; From 0de7cd0605d68c9f8681367f280b93528c44953b Mon Sep 17 00:00:00 2001 From: Michael Shilman Date: Sat, 12 Mar 2022 12:29:05 +0800 Subject: [PATCH 05/17] HTML: Add docs preset to framework --- app/html/package.json | 5 +++-- .../html => app/html/src/client/docs}/config.ts | 2 +- .../html/src/client/docs}/prepareForInline.tsx | 0 .../html/src/client/docs}/sourceDecorator.test.ts | 5 ++--- .../html/src/client/docs}/sourceDecorator.ts | 5 ++--- app/html/src/server/framework-preset-html-docs.ts | 5 +++++ app/html/src/server/options.ts | 5 ++++- app/html/tsconfig.json | 15 ++++----------- 8 files changed, 21 insertions(+), 21 deletions(-) rename {addons/docs/src/frameworks/html => app/html/src/client/docs}/config.ts (86%) rename {addons/docs/src/frameworks/html => app/html/src/client/docs}/prepareForInline.tsx (100%) rename {addons/docs/src/frameworks/html => app/html/src/client/docs}/sourceDecorator.test.ts (95%) rename {addons/docs/src/frameworks/html => app/html/src/client/docs}/sourceDecorator.ts (94%) create mode 100644 app/html/src/server/framework-preset-html-docs.ts diff --git a/app/html/package.json b/app/html/package.json index ebc2c1e9bb3..526e31ba877 100644 --- a/app/html/package.json +++ b/app/html/package.json @@ -46,10 +46,10 @@ }, "dependencies": { "@storybook/addons": "6.5.0-alpha.47", - "@storybook/client-api": "6.5.0-alpha.47", "@storybook/core": "6.5.0-alpha.47", "@storybook/core-common": "6.5.0-alpha.47", "@storybook/csf": "0.0.2--canary.87bc651.0", + "@storybook/docs-tools": "6.5.0-alpha.47", "@storybook/preview-web": "6.5.0-alpha.47", "@storybook/store": "6.5.0-alpha.47", "@types/node": "^14.14.20 || ^16.0.0", @@ -61,7 +61,8 @@ "react-dom": "16.14.0", "read-pkg-up": "^7.0.1", "regenerator-runtime": "^0.13.7", - "ts-dedent": "^2.0.0" + "ts-dedent": "^2.0.0", + "webpack": "4" }, "peerDependencies": { "@babel/core": "*" diff --git a/addons/docs/src/frameworks/html/config.ts b/app/html/src/client/docs/config.ts similarity index 86% rename from addons/docs/src/frameworks/html/config.ts rename to app/html/src/client/docs/config.ts index 007800d5da9..73dd8ea8a5e 100644 --- a/addons/docs/src/frameworks/html/config.ts +++ b/app/html/src/client/docs/config.ts @@ -1,6 +1,6 @@ +import { SourceType } from '@storybook/docs-tools'; import { sourceDecorator } from './sourceDecorator'; import { prepareForInline } from './prepareForInline'; -import { SourceType } from '../../shared'; export const decorators = [sourceDecorator]; diff --git a/addons/docs/src/frameworks/html/prepareForInline.tsx b/app/html/src/client/docs/prepareForInline.tsx similarity index 100% rename from addons/docs/src/frameworks/html/prepareForInline.tsx rename to app/html/src/client/docs/prepareForInline.tsx diff --git a/addons/docs/src/frameworks/html/sourceDecorator.test.ts b/app/html/src/client/docs/sourceDecorator.test.ts similarity index 95% rename from addons/docs/src/frameworks/html/sourceDecorator.test.ts rename to app/html/src/client/docs/sourceDecorator.test.ts index 59e19ab083d..18e5e3ace14 100644 --- a/addons/docs/src/frameworks/html/sourceDecorator.test.ts +++ b/app/html/src/client/docs/sourceDecorator.test.ts @@ -1,7 +1,6 @@ -import { addons, useEffect } from '@storybook/addons'; -import type { StoryContext } from '@storybook/addons'; +import { SNIPPET_RENDERED } from '@storybook/docs-tools'; +import { addons, StoryContext, useEffect } from '@storybook/addons'; import { sourceDecorator } from './sourceDecorator'; -import { SNIPPET_RENDERED } from '../../shared'; jest.mock('@storybook/addons'); const mockedAddons = addons as jest.Mocked; diff --git a/addons/docs/src/frameworks/html/sourceDecorator.ts b/app/html/src/client/docs/sourceDecorator.ts similarity index 94% rename from addons/docs/src/frameworks/html/sourceDecorator.ts rename to app/html/src/client/docs/sourceDecorator.ts index 58fa63a1b98..d9076dd35f0 100644 --- a/addons/docs/src/frameworks/html/sourceDecorator.ts +++ b/app/html/src/client/docs/sourceDecorator.ts @@ -1,10 +1,9 @@ /* global window */ +import { SNIPPET_RENDERED, SourceType } from '@storybook/docs-tools'; import { addons, useEffect } from '@storybook/addons'; import type { ArgsStoryFn, PartialStoryFn, StoryContext } from '@storybook/csf'; import dedent from 'ts-dedent'; -import type { HtmlFramework } from '@storybook/html'; - -import { SNIPPET_RENDERED, SourceType } from '../../shared'; +import type { HtmlFramework } from '..'; function skipSourceRender(context: StoryContext) { const sourceParams = context?.parameters.docs?.source; diff --git a/app/html/src/server/framework-preset-html-docs.ts b/app/html/src/server/framework-preset-html-docs.ts new file mode 100644 index 00000000000..f742f32da24 --- /dev/null +++ b/app/html/src/server/framework-preset-html-docs.ts @@ -0,0 +1,5 @@ +import { findDistEsm, StorybookConfig } from '@storybook/core-common'; + +export const config: StorybookConfig['config'] = (entry = []) => { + return [...entry, findDistEsm(__dirname, 'client/docs/config')]; +}; diff --git a/app/html/src/server/options.ts b/app/html/src/server/options.ts index 5888e8a10ec..581ab6ea98f 100644 --- a/app/html/src/server/options.ts +++ b/app/html/src/server/options.ts @@ -4,5 +4,8 @@ import type { LoadOptions } from '@storybook/core-common'; export default { packageJson: sync({ cwd: __dirname }).packageJson, framework: 'html', - frameworkPresets: [require.resolve('./framework-preset-html')], + frameworkPresets: [ + require.resolve('./framework-preset-html'), + require.resolve('./framework-preset-html-docs'), + ], } as LoadOptions; diff --git a/app/html/tsconfig.json b/app/html/tsconfig.json index 77e11bbd2ab..a7b3b6102f4 100644 --- a/app/html/tsconfig.json +++ b/app/html/tsconfig.json @@ -2,15 +2,8 @@ "extends": "../../tsconfig.json", "compilerOptions": { "rootDir": "./src", - "types": [ - "webpack-env", - "node" - ] + "types": ["webpack-env", "node"] }, - "include": [ - "src/**/*" - ], - "exclude": [ - "src/__tests__/**/*" - ] -} \ No newline at end of file + "include": ["src/**/*"], + "exclude": ["src/**/*.test.*", "src/__tests__/**/*"] +} From 12f9e15e94836a44e1f92be90671c5472d0c99d5 Mon Sep 17 00:00:00 2001 From: Michael Shilman Date: Sat, 12 Mar 2022 12:30:47 +0800 Subject: [PATCH 06/17] Svelte: Add docs preset to framework --- app/svelte/package.json | 10 ++++++++-- app/svelte/src/client/docs/HOC.svelte | 7 +++++++ .../svelte => app/svelte/src/client/docs}/config.ts | 3 +++ .../svelte/src/client/docs}/extractArgTypes.test.ts | 0 .../svelte/src/client/docs}/extractArgTypes.ts | 2 +- .../client/docs}/extractComponentDescription.test.ts | 0 .../src/client/docs}/extractComponentDescription.ts | 2 +- .../svelte/src/client/docs}/prepareForInline.ts | 4 +++- .../svelte/src/client/docs}/sample/MockButton.svelte | 0 .../svelte/src/client/docs}/sourceDecorator.test.ts | 0 .../svelte/src/client/docs}/sourceDecorator.ts | 2 +- .../svelte/src/server/framework-preset-svelte-docs.ts | 9 +++++++-- app/svelte/src/server/options.ts | 5 ++++- .../svelte/src/server}/svelte-docgen-loader.ts | 2 ++ 14 files changed, 37 insertions(+), 9 deletions(-) create mode 100644 app/svelte/src/client/docs/HOC.svelte rename {addons/docs/src/frameworks/svelte => app/svelte/src/client/docs}/config.ts (79%) rename {addons/docs/src/frameworks/svelte => app/svelte/src/client/docs}/extractArgTypes.test.ts (100%) rename {addons/docs/src/frameworks/svelte => app/svelte/src/client/docs}/extractArgTypes.ts (97%) rename {addons/docs/src/frameworks/svelte => app/svelte/src/client/docs}/extractComponentDescription.test.ts (100%) rename {addons/docs/src/frameworks/svelte => app/svelte/src/client/docs}/extractComponentDescription.ts (80%) rename {addons/docs/src/frameworks/svelte => app/svelte/src/client/docs}/prepareForInline.ts (75%) rename {addons/docs/src/frameworks/svelte => app/svelte/src/client/docs}/sample/MockButton.svelte (100%) rename {addons/docs/src/frameworks/svelte => app/svelte/src/client/docs}/sourceDecorator.test.ts (100%) rename {addons/docs/src/frameworks/svelte => app/svelte/src/client/docs}/sourceDecorator.ts (98%) rename addons/docs/src/frameworks/svelte/preset.ts => app/svelte/src/server/framework-preset-svelte-docs.ts (62%) rename {addons/docs/src/frameworks/svelte => app/svelte/src/server}/svelte-docgen-loader.ts (98%) diff --git a/app/svelte/package.json b/app/svelte/package.json index 51660c347e6..54d41c4777a 100644 --- a/app/svelte/package.json +++ b/app/svelte/package.json @@ -47,20 +47,26 @@ }, "dependencies": { "@storybook/addons": "6.5.0-alpha.47", + "@storybook/client-logger": "6.5.0-alpha.47", "@storybook/core": "6.5.0-alpha.47", "@storybook/core-common": "6.5.0-alpha.47", "@storybook/csf": "0.0.2--canary.87bc651.0", + "@storybook/docs-tools": "6.5.0-alpha.47", + "@storybook/node-logger": "6.5.0-alpha.47", "@storybook/store": "6.5.0-alpha.47", "core-js": "^3.8.2", "global": "^4.4.0", + "loader-utils": "^2.0.0", "react": "16.14.0", "react-dom": "16.14.0", "read-pkg-up": "^7.0.1", "regenerator-runtime": "^0.13.7", - "sveltedoc-parser": "^4.1.0", - "ts-dedent": "^2.0.0" + "sveltedoc-parser": "4.1.0", + "ts-dedent": "^2.0.0", + "webpack": "4" }, "devDependencies": { + "@types/loader-utils": "^2.0.0", "@types/webpack-env": "^1.16.0", "svelte": "^3.31.2", "svelte-loader": "^3.0.0" diff --git a/app/svelte/src/client/docs/HOC.svelte b/app/svelte/src/client/docs/HOC.svelte new file mode 100644 index 00000000000..0b6c3618701 --- /dev/null +++ b/app/svelte/src/client/docs/HOC.svelte @@ -0,0 +1,7 @@ + + + \ No newline at end of file diff --git a/addons/docs/src/frameworks/svelte/config.ts b/app/svelte/src/client/docs/config.ts similarity index 79% rename from addons/docs/src/frameworks/svelte/config.ts rename to app/svelte/src/client/docs/config.ts index 033474d23f7..5f96a79cd1a 100644 --- a/addons/docs/src/frameworks/svelte/config.ts +++ b/app/svelte/src/client/docs/config.ts @@ -1,3 +1,4 @@ +import { enhanceArgTypes } from '@storybook/docs-tools'; import { extractArgTypes } from './extractArgTypes'; import { extractComponentDescription } from './extractComponentDescription'; import { prepareForInline } from './prepareForInline'; @@ -13,3 +14,5 @@ export const parameters = { }; export const decorators = [sourceDecorator]; + +export const argTypesEnhancers = [enhanceArgTypes]; diff --git a/addons/docs/src/frameworks/svelte/extractArgTypes.test.ts b/app/svelte/src/client/docs/extractArgTypes.test.ts similarity index 100% rename from addons/docs/src/frameworks/svelte/extractArgTypes.test.ts rename to app/svelte/src/client/docs/extractArgTypes.test.ts diff --git a/addons/docs/src/frameworks/svelte/extractArgTypes.ts b/app/svelte/src/client/docs/extractArgTypes.ts similarity index 97% rename from addons/docs/src/frameworks/svelte/extractArgTypes.ts rename to app/svelte/src/client/docs/extractArgTypes.ts index be6dcbcd85f..91e28729c1a 100644 --- a/addons/docs/src/frameworks/svelte/extractArgTypes.ts +++ b/app/svelte/src/client/docs/extractArgTypes.ts @@ -7,7 +7,7 @@ import type { JSDocTypeConst, } from 'sveltedoc-parser/typings'; -import type { ArgTypesExtractor } from '../../lib/docgen'; +import type { ArgTypesExtractor } from '@storybook/docs-tools'; type ComponentWithDocgen = { __docgen: SvelteComponentDoc; diff --git a/addons/docs/src/frameworks/svelte/extractComponentDescription.test.ts b/app/svelte/src/client/docs/extractComponentDescription.test.ts similarity index 100% rename from addons/docs/src/frameworks/svelte/extractComponentDescription.test.ts rename to app/svelte/src/client/docs/extractComponentDescription.test.ts diff --git a/addons/docs/src/frameworks/svelte/extractComponentDescription.ts b/app/svelte/src/client/docs/extractComponentDescription.ts similarity index 80% rename from addons/docs/src/frameworks/svelte/extractComponentDescription.ts rename to app/svelte/src/client/docs/extractComponentDescription.ts index 28227129941..d2213c8ee4a 100644 --- a/addons/docs/src/frameworks/svelte/extractComponentDescription.ts +++ b/app/svelte/src/client/docs/extractComponentDescription.ts @@ -1,4 +1,4 @@ -import { Component } from '../../blocks/types'; +type Component = any; export function extractComponentDescription(component?: Component): string { if (!component) { diff --git a/addons/docs/src/frameworks/svelte/prepareForInline.ts b/app/svelte/src/client/docs/prepareForInline.ts similarity index 75% rename from addons/docs/src/frameworks/svelte/prepareForInline.ts rename to app/svelte/src/client/docs/prepareForInline.ts index 8c84f650b78..7d5ac7587b3 100644 --- a/addons/docs/src/frameworks/svelte/prepareForInline.ts +++ b/app/svelte/src/client/docs/prepareForInline.ts @@ -1,8 +1,10 @@ +/* eslint-disable import/no-extraneous-dependencies */ import { AnyFramework, StoryFn } from '@storybook/csf'; import React from 'react'; -import HOC from '@storybook/addon-docs/svelte/HOC.svelte'; +// @ts-ignore +import HOC from '@storybook/svelte/src/client/docs/HOC.svelte'; export const prepareForInline = (storyFn: StoryFn) => { const el = React.useRef(null); diff --git a/addons/docs/src/frameworks/svelte/sample/MockButton.svelte b/app/svelte/src/client/docs/sample/MockButton.svelte similarity index 100% rename from addons/docs/src/frameworks/svelte/sample/MockButton.svelte rename to app/svelte/src/client/docs/sample/MockButton.svelte diff --git a/addons/docs/src/frameworks/svelte/sourceDecorator.test.ts b/app/svelte/src/client/docs/sourceDecorator.test.ts similarity index 100% rename from addons/docs/src/frameworks/svelte/sourceDecorator.test.ts rename to app/svelte/src/client/docs/sourceDecorator.test.ts diff --git a/addons/docs/src/frameworks/svelte/sourceDecorator.ts b/app/svelte/src/client/docs/sourceDecorator.ts similarity index 98% rename from addons/docs/src/frameworks/svelte/sourceDecorator.ts rename to app/svelte/src/client/docs/sourceDecorator.ts index 3a98f3af22c..d449523197b 100644 --- a/addons/docs/src/frameworks/svelte/sourceDecorator.ts +++ b/app/svelte/src/client/docs/sourceDecorator.ts @@ -1,7 +1,7 @@ import { addons, useEffect } from '@storybook/addons'; import type { ArgTypes, Args, StoryContext, AnyFramework } from '@storybook/csf'; -import { SourceType, SNIPPET_RENDERED } from '../../shared'; +import { SourceType, SNIPPET_RENDERED } from '@storybook/docs-tools'; /** * Check if the sourcecode should be generated. diff --git a/addons/docs/src/frameworks/svelte/preset.ts b/app/svelte/src/server/framework-preset-svelte-docs.ts similarity index 62% rename from addons/docs/src/frameworks/svelte/preset.ts rename to app/svelte/src/server/framework-preset-svelte-docs.ts index 20004fc4722..ba1a7fee016 100644 --- a/addons/docs/src/frameworks/svelte/preset.ts +++ b/app/svelte/src/server/framework-preset-svelte-docs.ts @@ -1,7 +1,8 @@ import path from 'path'; -import { Configuration } from 'webpack'; -import type { Options } from '@storybook/core-common'; +import { findDistEsm, Options, StorybookConfig } from '@storybook/core-common'; + +type Configuration = any; export async function webpackFinal(webpackConfig: Configuration, options: Options) { const svelteOptions = await options.presets.apply('svelteOptions', {} as any, options); @@ -15,3 +16,7 @@ export async function webpackFinal(webpackConfig: Configuration, options: Option return webpackConfig; } + +export const config: StorybookConfig['config'] = (entry = []) => { + return [...entry, findDistEsm(__dirname, 'client/docs/config')]; +}; diff --git a/app/svelte/src/server/options.ts b/app/svelte/src/server/options.ts index ee8c399d9af..7fe93a0ea14 100644 --- a/app/svelte/src/server/options.ts +++ b/app/svelte/src/server/options.ts @@ -4,5 +4,8 @@ import { LoadOptions } from '@storybook/core-common'; export default { packageJson: sync({ cwd: __dirname }).packageJson, framework: 'svelte', - frameworkPresets: [require.resolve('./framework-preset-svelte.js')], + frameworkPresets: [ + require.resolve('./framework-preset-svelte.js'), + require.resolve('./framework-preset-svelte-docs.js'), + ], } as LoadOptions; diff --git a/addons/docs/src/frameworks/svelte/svelte-docgen-loader.ts b/app/svelte/src/server/svelte-docgen-loader.ts similarity index 98% rename from addons/docs/src/frameworks/svelte/svelte-docgen-loader.ts rename to app/svelte/src/server/svelte-docgen-loader.ts index fcd09698431..8206c87cbf9 100644 --- a/addons/docs/src/frameworks/svelte/svelte-docgen-loader.ts +++ b/app/svelte/src/server/svelte-docgen-loader.ts @@ -69,6 +69,8 @@ export default async function svelteDocgen(source: string) { let docgen = ''; try { + // FIXME + // @ts-ignore const componentDoc = await svelteDoc.parse(options); // get filename for source content From 23ac884c4984aa24527b24de9964be0ee03f731f Mon Sep 17 00:00:00 2001 From: Michael Shilman Date: Sat, 12 Mar 2022 12:36:30 +0800 Subject: [PATCH 07/17] React: Add docs preset to framework --- app/react/package.json | 18 ++++++++++++++---- .../10017-ts-union/argTypes.snapshot | 0 .../10017-ts-union/docgen.snapshot | 0 .../__testfixtures__/10017-ts-union/input.tsx | 0 .../10017-ts-union/properties.snapshot | 0 .../argTypes.snapshot | 0 .../docgen.snapshot | 0 .../10278-ts-multiple-components/input.tsx | 0 .../properties.snapshot | 0 .../8140-js-prop-types-oneof/argTypes.snapshot | 0 .../8140-js-prop-types-oneof/docgen.snapshot | 0 .../8140-js-prop-types-oneof/input.js | 0 .../properties.snapshot | 0 .../8143-ts-imported-types/argTypes.snapshot | 0 .../8143-ts-imported-types/docgen.snapshot | 0 .../8143-ts-imported-types/input.tsx | 0 .../8143-ts-imported-types/properties.snapshot | 0 .../8143-ts-imported-types/types.ts | 0 .../argTypes.snapshot | 0 .../8143-ts-react-fc-generics/docgen.snapshot | 0 .../8143-ts-react-fc-generics/input.tsx | 0 .../properties.snapshot | 0 .../8279-js-styled-docgen/argTypes.snapshot | 0 .../8279-js-styled-docgen/docgen.snapshot | 0 .../8279-js-styled-docgen/input.js | 0 .../8279-js-styled-docgen/properties.snapshot | 0 .../argTypes.snapshot | 0 .../8428-js-static-prop-types/docgen.snapshot | 0 .../8428-js-static-prop-types/input.js | 0 .../properties.snapshot | 0 .../argTypes.snapshot | 0 .../8663-js-styled-components/docgen.snapshot | 0 .../8663-js-styled-components/input.js | 0 .../properties.snapshot | 0 .../8740-ts-multi-props/argTypes.snapshot | 0 .../8740-ts-multi-props/docgen.snapshot | 0 .../8740-ts-multi-props/input.tsx | 0 .../8740-ts-multi-props/properties.snapshot | 0 .../8894-9511-ts-forward-ref/argTypes.snapshot | 0 .../8894-9511-ts-forward-ref/docgen.snapshot | 0 .../8894-9511-ts-forward-ref/input.tsx | 0 .../properties.snapshot | 0 .../9023-js-hoc/argTypes.snapshot | 0 .../9023-js-hoc/docgen.snapshot | 0 .../__testfixtures__/9023-js-hoc/input.js | 0 .../9023-js-hoc/properties.snapshot | 0 .../9399-js-proptypes-shape/argTypes.snapshot | 0 .../9399-js-proptypes-shape/docgen.snapshot | 0 .../9399-js-proptypes-shape/input.js | 0 .../properties.snapshot | 0 .../9465-ts-type-props/argTypes.snapshot | 0 .../9465-ts-type-props/docgen.snapshot | 0 .../9465-ts-type-props/input.tsx | 0 .../9465-ts-type-props/properties.snapshot | 0 .../9493-ts-display-name/argTypes.snapshot | 0 .../9493-ts-display-name/docgen.snapshot | 0 .../9493-ts-display-name/input.tsx | 0 .../9493-ts-display-name/properties.snapshot | 0 .../argTypes.snapshot | 0 .../docgen.snapshot | 0 .../9556-ts-react-default-exports/input.tsx | 0 .../properties.snapshot | 0 .../9575-ts-camel-case/argTypes.snapshot | 0 .../9575-ts-camel-case/docgen.snapshot | 0 .../9575-ts-camel-case/input.tsx | 0 .../9575-ts-camel-case/properties.snapshot | 0 .../9586-js-react-memo/argTypes.snapshot | 0 .../9586-js-react-memo/docgen.snapshot | 0 .../9586-js-react-memo/input.js | 0 .../9586-js-react-memo/properties.snapshot | 0 .../9591-ts-import-types/Bar.tsx | 0 .../9591-ts-import-types/argTypes.snapshot | 0 .../9591-ts-import-types/docgen.snapshot | 0 .../9591-ts-import-types/input.tsx | 0 .../9591-ts-import-types/properties.snapshot | 0 .../9592-ts-styled-props/argTypes.snapshot | 0 .../9592-ts-styled-props/docgen.snapshot | 0 .../9592-ts-styled-props/input.tsx | 0 .../9592-ts-styled-props/properties.snapshot | 0 .../9626-js-default-values/argTypes.snapshot | 0 .../9626-js-default-values/docgen.snapshot | 0 .../9626-js-default-values/input.js | 0 .../9626-js-default-values/properties.snapshot | 0 .../argTypes.snapshot | 0 .../9668-js-proptypes-no-jsdoc/docgen.snapshot | 0 .../9668-js-proptypes-no-jsdoc/input.js | 0 .../properties.snapshot | 0 .../9721-ts-deprecated-jsdoc/argTypes.snapshot | 0 .../9721-ts-deprecated-jsdoc/docgen.snapshot | 0 .../9721-ts-deprecated-jsdoc/input.tsx | 0 .../properties.snapshot | 0 .../9764-ts-extend-props/argTypes.snapshot | 0 .../9764-ts-extend-props/docgen.snapshot | 0 .../9764-ts-extend-props/input.tsx | 0 .../9764-ts-extend-props/properties.snapshot | 0 .../9827-ts-default-values/argTypes.snapshot | 0 .../9827-ts-default-values/docgen.snapshot | 0 .../9827-ts-default-values/input.tsx | 0 .../9827-ts-default-values/properties.snapshot | 0 .../9832-ts-enum-export/argTypes.snapshot | 0 .../9832-ts-enum-export/docgen.snapshot | 0 .../9832-ts-enum-export/input.tsx | 0 .../9832-ts-enum-export/properties.snapshot | 0 .../9922-ts-component-props/argTypes.snapshot | 0 .../9922-ts-component-props/docgen.snapshot | 0 .../9922-ts-component-props/input.tsx | 0 .../properties.snapshot | 0 .../client/docs}/__testfixtures__/imported.js | 0 .../js-class-component/argTypes.snapshot | 0 .../js-class-component/docgen.snapshot | 0 .../js-class-component/input.js | 0 .../js-class-component/properties.snapshot | 0 .../argTypes.snapshot | 0 .../docgen.snapshot | 0 .../input.js | 0 .../properties.snapshot | 0 .../argTypes.snapshot | 0 .../docgen.snapshot | 0 .../input.js | 0 .../properties.snapshot | 0 .../js-function-component/argTypes.snapshot | 0 .../js-function-component/docgen.snapshot | 0 .../js-function-component/input.js | 0 .../js-function-component/properties.snapshot | 0 .../argTypes.snapshot | 0 .../docgen.snapshot | 0 .../input.tsx | 0 .../properties.snapshot | 0 .../ts-function-component/argTypes.snapshot | 0 .../ts-function-component/docgen.snapshot | 0 .../ts-function-component/input.tsx | 0 .../ts-function-component/properties.snapshot | 0 .../react/src/client/docs}/config.ts | 6 ++++-- .../react/src/client/docs}/extractArgTypes.ts | 2 +- .../react/src/client/docs}/extractProps.ts | 6 ++++-- .../src/client/docs}/jsxDecorator.test.tsx | 2 +- .../react/src/client/docs}/jsxDecorator.tsx | 6 +++--- .../react/src/client/docs}/lib/captions.ts | 0 .../src/client/docs}/lib/componentTypes.ts | 0 .../lib/defaultValues/createDefaultValue.ts | 8 ++++++-- .../defaultValues/createFromRawDefaultProp.ts | 10 +++++++--- .../docs}/lib/defaultValues/generateArray.ts | 7 +++++-- .../docs}/lib/defaultValues/generateObject.ts | 8 ++++++-- .../client/docs}/lib/defaultValues/index.ts | 0 .../lib/defaultValues/prettyIdentifier.ts | 0 .../react/src/client/docs}/lib/generateCode.ts | 0 .../react/src/client/docs}/lib/index.ts | 0 .../docs}/lib/inspection/acornParser.test.ts | 0 .../client/docs}/lib/inspection/acornParser.ts | 0 .../src/client/docs}/lib/inspection/index.ts | 0 .../docs}/lib/inspection/inspectValue.ts | 0 .../src/client/docs}/lib/inspection/types.ts | 0 .../react/src/client/docs}/lib/isHtmlTag.ts | 0 .../src/client/docs}/propTypes/createType.ts | 8 ++++++-- .../propTypes/generateFuncSignature.test.ts | 2 +- .../docs}/propTypes/generateFuncSignature.ts | 2 +- .../client/docs}/propTypes/handleProp.test.tsx | 4 ++-- .../src/client/docs}/propTypes/handleProp.ts | 5 +++-- .../docs}/propTypes/rawDefaultPropResolvers.ts | 2 +- .../src/client/docs}/propTypes/sortProps.ts | 5 +++-- .../client/docs}/react-argtypes.stories.tsx | 6 ++++-- .../src/client/docs}/react-properties.test.ts | 12 ++++++------ .../docs}/typeScript/handleProp.test.tsx | 5 +++-- .../src/client/docs}/typeScript/handleProp.ts | 2 +- .../src/server/framework-preset-react-docs.ts | 7 +++++++ app/react/src/server/preset.ts | 1 + app/react/tsconfig.json | 15 ++++----------- 167 files changed, 94 insertions(+), 55 deletions(-) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/10017-ts-union/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/10017-ts-union/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/10017-ts-union/input.tsx (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/10017-ts-union/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/10278-ts-multiple-components/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/10278-ts-multiple-components/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/10278-ts-multiple-components/input.tsx (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/10278-ts-multiple-components/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8140-js-prop-types-oneof/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8140-js-prop-types-oneof/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8140-js-prop-types-oneof/input.js (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8140-js-prop-types-oneof/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8143-ts-imported-types/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8143-ts-imported-types/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8143-ts-imported-types/input.tsx (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8143-ts-imported-types/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8143-ts-imported-types/types.ts (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8143-ts-react-fc-generics/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8143-ts-react-fc-generics/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8143-ts-react-fc-generics/input.tsx (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8143-ts-react-fc-generics/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8279-js-styled-docgen/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8279-js-styled-docgen/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8279-js-styled-docgen/input.js (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8279-js-styled-docgen/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8428-js-static-prop-types/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8428-js-static-prop-types/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8428-js-static-prop-types/input.js (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8428-js-static-prop-types/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8663-js-styled-components/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8663-js-styled-components/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8663-js-styled-components/input.js (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8663-js-styled-components/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8740-ts-multi-props/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8740-ts-multi-props/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8740-ts-multi-props/input.tsx (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8740-ts-multi-props/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8894-9511-ts-forward-ref/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8894-9511-ts-forward-ref/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8894-9511-ts-forward-ref/input.tsx (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/8894-9511-ts-forward-ref/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9023-js-hoc/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9023-js-hoc/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9023-js-hoc/input.js (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9023-js-hoc/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9399-js-proptypes-shape/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9399-js-proptypes-shape/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9399-js-proptypes-shape/input.js (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9399-js-proptypes-shape/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9465-ts-type-props/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9465-ts-type-props/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9465-ts-type-props/input.tsx (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9465-ts-type-props/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9493-ts-display-name/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9493-ts-display-name/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9493-ts-display-name/input.tsx (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9493-ts-display-name/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9556-ts-react-default-exports/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9556-ts-react-default-exports/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9556-ts-react-default-exports/input.tsx (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9556-ts-react-default-exports/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9575-ts-camel-case/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9575-ts-camel-case/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9575-ts-camel-case/input.tsx (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9575-ts-camel-case/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9586-js-react-memo/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9586-js-react-memo/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9586-js-react-memo/input.js (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9586-js-react-memo/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9591-ts-import-types/Bar.tsx (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9591-ts-import-types/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9591-ts-import-types/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9591-ts-import-types/input.tsx (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9591-ts-import-types/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9592-ts-styled-props/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9592-ts-styled-props/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9592-ts-styled-props/input.tsx (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9592-ts-styled-props/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9626-js-default-values/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9626-js-default-values/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9626-js-default-values/input.js (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9626-js-default-values/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9668-js-proptypes-no-jsdoc/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9668-js-proptypes-no-jsdoc/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9668-js-proptypes-no-jsdoc/input.js (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9668-js-proptypes-no-jsdoc/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9721-ts-deprecated-jsdoc/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9721-ts-deprecated-jsdoc/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9721-ts-deprecated-jsdoc/input.tsx (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9721-ts-deprecated-jsdoc/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9764-ts-extend-props/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9764-ts-extend-props/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9764-ts-extend-props/input.tsx (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9764-ts-extend-props/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9827-ts-default-values/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9827-ts-default-values/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9827-ts-default-values/input.tsx (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9827-ts-default-values/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9832-ts-enum-export/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9832-ts-enum-export/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9832-ts-enum-export/input.tsx (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9832-ts-enum-export/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9922-ts-component-props/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9922-ts-component-props/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9922-ts-component-props/input.tsx (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/9922-ts-component-props/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/imported.js (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/js-class-component/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/js-class-component/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/js-class-component/input.js (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/js-class-component/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/js-function-component-inline-defaults-no-propTypes/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/js-function-component-inline-defaults-no-propTypes/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/js-function-component-inline-defaults-no-propTypes/input.js (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/js-function-component-inline-defaults-no-propTypes/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/js-function-component-inline-defaults/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/js-function-component-inline-defaults/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/js-function-component-inline-defaults/input.js (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/js-function-component-inline-defaults/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/js-function-component/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/js-function-component/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/js-function-component/input.js (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/js-function-component/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/ts-function-component-inline-defaults/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/ts-function-component-inline-defaults/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/ts-function-component-inline-defaults/input.tsx (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/ts-function-component-inline-defaults/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/ts-function-component/argTypes.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/ts-function-component/docgen.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/ts-function-component/input.tsx (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/__testfixtures__/ts-function-component/properties.snapshot (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/config.ts (73%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/extractArgTypes.ts (91%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/extractProps.ts (94%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/jsxDecorator.test.tsx (99%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/jsxDecorator.tsx (97%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/lib/captions.ts (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/lib/componentTypes.ts (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/lib/defaultValues/createDefaultValue.ts (94%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/lib/defaultValues/createFromRawDefaultProp.ts (96%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/lib/defaultValues/generateArray.ts (79%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/lib/defaultValues/generateObject.ts (80%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/lib/defaultValues/index.ts (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/lib/defaultValues/prettyIdentifier.ts (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/lib/generateCode.ts (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/lib/index.ts (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/lib/inspection/acornParser.test.ts (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/lib/inspection/acornParser.ts (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/lib/inspection/index.ts (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/lib/inspection/inspectValue.ts (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/lib/inspection/types.ts (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/lib/isHtmlTag.ts (100%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/propTypes/createType.ts (98%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/propTypes/generateFuncSignature.test.ts (99%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/propTypes/generateFuncSignature.ts (93%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/propTypes/handleProp.test.tsx (99%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/propTypes/handleProp.ts (92%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/propTypes/rawDefaultPropResolvers.ts (95%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/propTypes/sortProps.ts (85%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/react-argtypes.stories.tsx (97%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/react-properties.test.ts (96%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/typeScript/handleProp.test.tsx (99%) rename {addons/docs/src/frameworks/react => app/react/src/client/docs}/typeScript/handleProp.ts (93%) create mode 100644 app/react/src/server/framework-preset-react-docs.ts diff --git a/app/react/package.json b/app/react/package.json index 389119642ae..dc2c621e57c 100644 --- a/app/react/package.json +++ b/app/react/package.json @@ -50,37 +50,47 @@ "@babel/preset-react": "^7.12.10", "@pmmmwh/react-refresh-webpack-plugin": "^0.5.3", "@storybook/addons": "6.5.0-alpha.47", + "@storybook/client-logger": "6.5.0-alpha.47", "@storybook/core": "6.5.0-alpha.47", "@storybook/core-common": "6.5.0-alpha.47", "@storybook/csf": "0.0.2--canary.87bc651.0", + "@storybook/docs-tools": "6.5.0-alpha.47", "@storybook/node-logger": "6.5.0-alpha.47", "@storybook/react-docgen-typescript-plugin": "1.0.2-canary.6.9d540b91e815f8fc2f8829189deb00553559ff63.0", "@storybook/semver": "^7.3.2", "@storybook/store": "6.5.0-alpha.47", + "@types/estree": "^0.0.51", "@types/node": "^14.14.20 || ^16.0.0", "@types/webpack-env": "^1.16.0", + "acorn": "^7.4.1", + "acorn-jsx": "^5.3.1", + "acorn-walk": "^7.2.0", "babel-plugin-add-react-displayname": "^0.0.5", - "babel-plugin-named-asset-import": "^0.3.1", "babel-plugin-react-docgen": "^4.2.1", "core-js": "^3.8.2", + "escodegen": "^2.0.0", "global": "^4.4.0", + "html-tags": "^3.1.0", "lodash": "^4.17.21", "prop-types": "^15.7.2", + "react-element-to-jsx-string": "^14.3.4", "react-refresh": "^0.11.0", "read-pkg-up": "^7.0.1", "regenerator-runtime": "^0.13.7", "ts-dedent": "^2.0.0", + "util-deprecate": "^1.0.2", "webpack": ">=4.43.0 <6.0.0" }, "devDependencies": { - "@storybook/client-api": "6.5.0-alpha.47", - "@types/prompts": "^2.0.9", + "@types/util-deprecate": "^1.0.0", "webpack": "4" }, "peerDependencies": { "@babel/core": "^7.11.5", + "jest-specific-snapshot": "^4.0.0", "react": "^16.8.0 || ^17.0.0", - "react-dom": "^16.8.0 || ^17.0.0" + "react-dom": "^16.8.0 || ^17.0.0", + "require-from-string": "^2.0.2" }, "peerDependenciesMeta": { "@babel/core": { diff --git a/addons/docs/src/frameworks/react/__testfixtures__/10017-ts-union/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/10017-ts-union/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/10017-ts-union/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/10017-ts-union/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/10017-ts-union/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/10017-ts-union/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/10017-ts-union/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/10017-ts-union/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/10017-ts-union/input.tsx b/app/react/src/client/docs/__testfixtures__/10017-ts-union/input.tsx similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/10017-ts-union/input.tsx rename to app/react/src/client/docs/__testfixtures__/10017-ts-union/input.tsx diff --git a/addons/docs/src/frameworks/react/__testfixtures__/10017-ts-union/properties.snapshot b/app/react/src/client/docs/__testfixtures__/10017-ts-union/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/10017-ts-union/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/10017-ts-union/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/10278-ts-multiple-components/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/10278-ts-multiple-components/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/10278-ts-multiple-components/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/10278-ts-multiple-components/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/10278-ts-multiple-components/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/10278-ts-multiple-components/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/10278-ts-multiple-components/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/10278-ts-multiple-components/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/10278-ts-multiple-components/input.tsx b/app/react/src/client/docs/__testfixtures__/10278-ts-multiple-components/input.tsx similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/10278-ts-multiple-components/input.tsx rename to app/react/src/client/docs/__testfixtures__/10278-ts-multiple-components/input.tsx diff --git a/addons/docs/src/frameworks/react/__testfixtures__/10278-ts-multiple-components/properties.snapshot b/app/react/src/client/docs/__testfixtures__/10278-ts-multiple-components/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/10278-ts-multiple-components/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/10278-ts-multiple-components/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8140-js-prop-types-oneof/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/8140-js-prop-types-oneof/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8140-js-prop-types-oneof/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/8140-js-prop-types-oneof/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8140-js-prop-types-oneof/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/8140-js-prop-types-oneof/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8140-js-prop-types-oneof/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/8140-js-prop-types-oneof/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8140-js-prop-types-oneof/input.js b/app/react/src/client/docs/__testfixtures__/8140-js-prop-types-oneof/input.js similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8140-js-prop-types-oneof/input.js rename to app/react/src/client/docs/__testfixtures__/8140-js-prop-types-oneof/input.js diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8140-js-prop-types-oneof/properties.snapshot b/app/react/src/client/docs/__testfixtures__/8140-js-prop-types-oneof/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8140-js-prop-types-oneof/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/8140-js-prop-types-oneof/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8143-ts-imported-types/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/8143-ts-imported-types/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8143-ts-imported-types/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/8143-ts-imported-types/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8143-ts-imported-types/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/8143-ts-imported-types/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8143-ts-imported-types/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/8143-ts-imported-types/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8143-ts-imported-types/input.tsx b/app/react/src/client/docs/__testfixtures__/8143-ts-imported-types/input.tsx similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8143-ts-imported-types/input.tsx rename to app/react/src/client/docs/__testfixtures__/8143-ts-imported-types/input.tsx diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8143-ts-imported-types/properties.snapshot b/app/react/src/client/docs/__testfixtures__/8143-ts-imported-types/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8143-ts-imported-types/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/8143-ts-imported-types/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8143-ts-imported-types/types.ts b/app/react/src/client/docs/__testfixtures__/8143-ts-imported-types/types.ts similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8143-ts-imported-types/types.ts rename to app/react/src/client/docs/__testfixtures__/8143-ts-imported-types/types.ts diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8143-ts-react-fc-generics/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/8143-ts-react-fc-generics/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8143-ts-react-fc-generics/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/8143-ts-react-fc-generics/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8143-ts-react-fc-generics/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/8143-ts-react-fc-generics/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8143-ts-react-fc-generics/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/8143-ts-react-fc-generics/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8143-ts-react-fc-generics/input.tsx b/app/react/src/client/docs/__testfixtures__/8143-ts-react-fc-generics/input.tsx similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8143-ts-react-fc-generics/input.tsx rename to app/react/src/client/docs/__testfixtures__/8143-ts-react-fc-generics/input.tsx diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8143-ts-react-fc-generics/properties.snapshot b/app/react/src/client/docs/__testfixtures__/8143-ts-react-fc-generics/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8143-ts-react-fc-generics/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/8143-ts-react-fc-generics/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8279-js-styled-docgen/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/8279-js-styled-docgen/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8279-js-styled-docgen/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/8279-js-styled-docgen/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8279-js-styled-docgen/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/8279-js-styled-docgen/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8279-js-styled-docgen/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/8279-js-styled-docgen/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8279-js-styled-docgen/input.js b/app/react/src/client/docs/__testfixtures__/8279-js-styled-docgen/input.js similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8279-js-styled-docgen/input.js rename to app/react/src/client/docs/__testfixtures__/8279-js-styled-docgen/input.js diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8279-js-styled-docgen/properties.snapshot b/app/react/src/client/docs/__testfixtures__/8279-js-styled-docgen/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8279-js-styled-docgen/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/8279-js-styled-docgen/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8428-js-static-prop-types/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/8428-js-static-prop-types/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8428-js-static-prop-types/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/8428-js-static-prop-types/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8428-js-static-prop-types/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/8428-js-static-prop-types/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8428-js-static-prop-types/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/8428-js-static-prop-types/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8428-js-static-prop-types/input.js b/app/react/src/client/docs/__testfixtures__/8428-js-static-prop-types/input.js similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8428-js-static-prop-types/input.js rename to app/react/src/client/docs/__testfixtures__/8428-js-static-prop-types/input.js diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8428-js-static-prop-types/properties.snapshot b/app/react/src/client/docs/__testfixtures__/8428-js-static-prop-types/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8428-js-static-prop-types/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/8428-js-static-prop-types/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8663-js-styled-components/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/8663-js-styled-components/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8663-js-styled-components/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/8663-js-styled-components/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8663-js-styled-components/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/8663-js-styled-components/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8663-js-styled-components/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/8663-js-styled-components/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8663-js-styled-components/input.js b/app/react/src/client/docs/__testfixtures__/8663-js-styled-components/input.js similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8663-js-styled-components/input.js rename to app/react/src/client/docs/__testfixtures__/8663-js-styled-components/input.js diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8663-js-styled-components/properties.snapshot b/app/react/src/client/docs/__testfixtures__/8663-js-styled-components/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8663-js-styled-components/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/8663-js-styled-components/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8740-ts-multi-props/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/8740-ts-multi-props/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8740-ts-multi-props/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/8740-ts-multi-props/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8740-ts-multi-props/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/8740-ts-multi-props/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8740-ts-multi-props/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/8740-ts-multi-props/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8740-ts-multi-props/input.tsx b/app/react/src/client/docs/__testfixtures__/8740-ts-multi-props/input.tsx similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8740-ts-multi-props/input.tsx rename to app/react/src/client/docs/__testfixtures__/8740-ts-multi-props/input.tsx diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8740-ts-multi-props/properties.snapshot b/app/react/src/client/docs/__testfixtures__/8740-ts-multi-props/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8740-ts-multi-props/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/8740-ts-multi-props/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8894-9511-ts-forward-ref/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/8894-9511-ts-forward-ref/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8894-9511-ts-forward-ref/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/8894-9511-ts-forward-ref/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8894-9511-ts-forward-ref/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/8894-9511-ts-forward-ref/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8894-9511-ts-forward-ref/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/8894-9511-ts-forward-ref/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8894-9511-ts-forward-ref/input.tsx b/app/react/src/client/docs/__testfixtures__/8894-9511-ts-forward-ref/input.tsx similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8894-9511-ts-forward-ref/input.tsx rename to app/react/src/client/docs/__testfixtures__/8894-9511-ts-forward-ref/input.tsx diff --git a/addons/docs/src/frameworks/react/__testfixtures__/8894-9511-ts-forward-ref/properties.snapshot b/app/react/src/client/docs/__testfixtures__/8894-9511-ts-forward-ref/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/8894-9511-ts-forward-ref/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/8894-9511-ts-forward-ref/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9023-js-hoc/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/9023-js-hoc/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9023-js-hoc/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/9023-js-hoc/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9023-js-hoc/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/9023-js-hoc/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9023-js-hoc/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/9023-js-hoc/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9023-js-hoc/input.js b/app/react/src/client/docs/__testfixtures__/9023-js-hoc/input.js similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9023-js-hoc/input.js rename to app/react/src/client/docs/__testfixtures__/9023-js-hoc/input.js diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9023-js-hoc/properties.snapshot b/app/react/src/client/docs/__testfixtures__/9023-js-hoc/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9023-js-hoc/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/9023-js-hoc/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9399-js-proptypes-shape/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/9399-js-proptypes-shape/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9399-js-proptypes-shape/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/9399-js-proptypes-shape/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9399-js-proptypes-shape/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/9399-js-proptypes-shape/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9399-js-proptypes-shape/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/9399-js-proptypes-shape/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9399-js-proptypes-shape/input.js b/app/react/src/client/docs/__testfixtures__/9399-js-proptypes-shape/input.js similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9399-js-proptypes-shape/input.js rename to app/react/src/client/docs/__testfixtures__/9399-js-proptypes-shape/input.js diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9399-js-proptypes-shape/properties.snapshot b/app/react/src/client/docs/__testfixtures__/9399-js-proptypes-shape/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9399-js-proptypes-shape/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/9399-js-proptypes-shape/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9465-ts-type-props/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/9465-ts-type-props/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9465-ts-type-props/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/9465-ts-type-props/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9465-ts-type-props/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/9465-ts-type-props/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9465-ts-type-props/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/9465-ts-type-props/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9465-ts-type-props/input.tsx b/app/react/src/client/docs/__testfixtures__/9465-ts-type-props/input.tsx similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9465-ts-type-props/input.tsx rename to app/react/src/client/docs/__testfixtures__/9465-ts-type-props/input.tsx diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9465-ts-type-props/properties.snapshot b/app/react/src/client/docs/__testfixtures__/9465-ts-type-props/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9465-ts-type-props/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/9465-ts-type-props/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9493-ts-display-name/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/9493-ts-display-name/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9493-ts-display-name/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/9493-ts-display-name/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9493-ts-display-name/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/9493-ts-display-name/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9493-ts-display-name/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/9493-ts-display-name/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9493-ts-display-name/input.tsx b/app/react/src/client/docs/__testfixtures__/9493-ts-display-name/input.tsx similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9493-ts-display-name/input.tsx rename to app/react/src/client/docs/__testfixtures__/9493-ts-display-name/input.tsx diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9493-ts-display-name/properties.snapshot b/app/react/src/client/docs/__testfixtures__/9493-ts-display-name/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9493-ts-display-name/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/9493-ts-display-name/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9556-ts-react-default-exports/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/9556-ts-react-default-exports/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9556-ts-react-default-exports/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/9556-ts-react-default-exports/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9556-ts-react-default-exports/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/9556-ts-react-default-exports/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9556-ts-react-default-exports/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/9556-ts-react-default-exports/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9556-ts-react-default-exports/input.tsx b/app/react/src/client/docs/__testfixtures__/9556-ts-react-default-exports/input.tsx similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9556-ts-react-default-exports/input.tsx rename to app/react/src/client/docs/__testfixtures__/9556-ts-react-default-exports/input.tsx diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9556-ts-react-default-exports/properties.snapshot b/app/react/src/client/docs/__testfixtures__/9556-ts-react-default-exports/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9556-ts-react-default-exports/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/9556-ts-react-default-exports/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9575-ts-camel-case/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/9575-ts-camel-case/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9575-ts-camel-case/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/9575-ts-camel-case/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9575-ts-camel-case/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/9575-ts-camel-case/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9575-ts-camel-case/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/9575-ts-camel-case/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9575-ts-camel-case/input.tsx b/app/react/src/client/docs/__testfixtures__/9575-ts-camel-case/input.tsx similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9575-ts-camel-case/input.tsx rename to app/react/src/client/docs/__testfixtures__/9575-ts-camel-case/input.tsx diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9575-ts-camel-case/properties.snapshot b/app/react/src/client/docs/__testfixtures__/9575-ts-camel-case/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9575-ts-camel-case/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/9575-ts-camel-case/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9586-js-react-memo/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/9586-js-react-memo/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9586-js-react-memo/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/9586-js-react-memo/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9586-js-react-memo/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/9586-js-react-memo/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9586-js-react-memo/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/9586-js-react-memo/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9586-js-react-memo/input.js b/app/react/src/client/docs/__testfixtures__/9586-js-react-memo/input.js similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9586-js-react-memo/input.js rename to app/react/src/client/docs/__testfixtures__/9586-js-react-memo/input.js diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9586-js-react-memo/properties.snapshot b/app/react/src/client/docs/__testfixtures__/9586-js-react-memo/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9586-js-react-memo/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/9586-js-react-memo/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9591-ts-import-types/Bar.tsx b/app/react/src/client/docs/__testfixtures__/9591-ts-import-types/Bar.tsx similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9591-ts-import-types/Bar.tsx rename to app/react/src/client/docs/__testfixtures__/9591-ts-import-types/Bar.tsx diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9591-ts-import-types/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/9591-ts-import-types/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9591-ts-import-types/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/9591-ts-import-types/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9591-ts-import-types/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/9591-ts-import-types/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9591-ts-import-types/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/9591-ts-import-types/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9591-ts-import-types/input.tsx b/app/react/src/client/docs/__testfixtures__/9591-ts-import-types/input.tsx similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9591-ts-import-types/input.tsx rename to app/react/src/client/docs/__testfixtures__/9591-ts-import-types/input.tsx diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9591-ts-import-types/properties.snapshot b/app/react/src/client/docs/__testfixtures__/9591-ts-import-types/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9591-ts-import-types/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/9591-ts-import-types/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9592-ts-styled-props/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/9592-ts-styled-props/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9592-ts-styled-props/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/9592-ts-styled-props/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9592-ts-styled-props/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/9592-ts-styled-props/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9592-ts-styled-props/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/9592-ts-styled-props/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9592-ts-styled-props/input.tsx b/app/react/src/client/docs/__testfixtures__/9592-ts-styled-props/input.tsx similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9592-ts-styled-props/input.tsx rename to app/react/src/client/docs/__testfixtures__/9592-ts-styled-props/input.tsx diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9592-ts-styled-props/properties.snapshot b/app/react/src/client/docs/__testfixtures__/9592-ts-styled-props/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9592-ts-styled-props/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/9592-ts-styled-props/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9626-js-default-values/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/9626-js-default-values/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9626-js-default-values/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/9626-js-default-values/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9626-js-default-values/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/9626-js-default-values/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9626-js-default-values/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/9626-js-default-values/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9626-js-default-values/input.js b/app/react/src/client/docs/__testfixtures__/9626-js-default-values/input.js similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9626-js-default-values/input.js rename to app/react/src/client/docs/__testfixtures__/9626-js-default-values/input.js diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9626-js-default-values/properties.snapshot b/app/react/src/client/docs/__testfixtures__/9626-js-default-values/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9626-js-default-values/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/9626-js-default-values/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9668-js-proptypes-no-jsdoc/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/9668-js-proptypes-no-jsdoc/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9668-js-proptypes-no-jsdoc/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/9668-js-proptypes-no-jsdoc/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9668-js-proptypes-no-jsdoc/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/9668-js-proptypes-no-jsdoc/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9668-js-proptypes-no-jsdoc/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/9668-js-proptypes-no-jsdoc/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9668-js-proptypes-no-jsdoc/input.js b/app/react/src/client/docs/__testfixtures__/9668-js-proptypes-no-jsdoc/input.js similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9668-js-proptypes-no-jsdoc/input.js rename to app/react/src/client/docs/__testfixtures__/9668-js-proptypes-no-jsdoc/input.js diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9668-js-proptypes-no-jsdoc/properties.snapshot b/app/react/src/client/docs/__testfixtures__/9668-js-proptypes-no-jsdoc/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9668-js-proptypes-no-jsdoc/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/9668-js-proptypes-no-jsdoc/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9721-ts-deprecated-jsdoc/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/9721-ts-deprecated-jsdoc/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9721-ts-deprecated-jsdoc/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/9721-ts-deprecated-jsdoc/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9721-ts-deprecated-jsdoc/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/9721-ts-deprecated-jsdoc/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9721-ts-deprecated-jsdoc/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/9721-ts-deprecated-jsdoc/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9721-ts-deprecated-jsdoc/input.tsx b/app/react/src/client/docs/__testfixtures__/9721-ts-deprecated-jsdoc/input.tsx similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9721-ts-deprecated-jsdoc/input.tsx rename to app/react/src/client/docs/__testfixtures__/9721-ts-deprecated-jsdoc/input.tsx diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9721-ts-deprecated-jsdoc/properties.snapshot b/app/react/src/client/docs/__testfixtures__/9721-ts-deprecated-jsdoc/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9721-ts-deprecated-jsdoc/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/9721-ts-deprecated-jsdoc/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9764-ts-extend-props/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/9764-ts-extend-props/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9764-ts-extend-props/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/9764-ts-extend-props/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9764-ts-extend-props/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/9764-ts-extend-props/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9764-ts-extend-props/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/9764-ts-extend-props/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9764-ts-extend-props/input.tsx b/app/react/src/client/docs/__testfixtures__/9764-ts-extend-props/input.tsx similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9764-ts-extend-props/input.tsx rename to app/react/src/client/docs/__testfixtures__/9764-ts-extend-props/input.tsx diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9764-ts-extend-props/properties.snapshot b/app/react/src/client/docs/__testfixtures__/9764-ts-extend-props/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9764-ts-extend-props/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/9764-ts-extend-props/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9827-ts-default-values/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/9827-ts-default-values/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9827-ts-default-values/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/9827-ts-default-values/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9827-ts-default-values/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/9827-ts-default-values/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9827-ts-default-values/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/9827-ts-default-values/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9827-ts-default-values/input.tsx b/app/react/src/client/docs/__testfixtures__/9827-ts-default-values/input.tsx similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9827-ts-default-values/input.tsx rename to app/react/src/client/docs/__testfixtures__/9827-ts-default-values/input.tsx diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9827-ts-default-values/properties.snapshot b/app/react/src/client/docs/__testfixtures__/9827-ts-default-values/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9827-ts-default-values/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/9827-ts-default-values/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9832-ts-enum-export/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/9832-ts-enum-export/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9832-ts-enum-export/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/9832-ts-enum-export/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9832-ts-enum-export/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/9832-ts-enum-export/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9832-ts-enum-export/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/9832-ts-enum-export/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9832-ts-enum-export/input.tsx b/app/react/src/client/docs/__testfixtures__/9832-ts-enum-export/input.tsx similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9832-ts-enum-export/input.tsx rename to app/react/src/client/docs/__testfixtures__/9832-ts-enum-export/input.tsx diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9832-ts-enum-export/properties.snapshot b/app/react/src/client/docs/__testfixtures__/9832-ts-enum-export/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9832-ts-enum-export/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/9832-ts-enum-export/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9922-ts-component-props/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/9922-ts-component-props/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9922-ts-component-props/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/9922-ts-component-props/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9922-ts-component-props/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/9922-ts-component-props/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9922-ts-component-props/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/9922-ts-component-props/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9922-ts-component-props/input.tsx b/app/react/src/client/docs/__testfixtures__/9922-ts-component-props/input.tsx similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9922-ts-component-props/input.tsx rename to app/react/src/client/docs/__testfixtures__/9922-ts-component-props/input.tsx diff --git a/addons/docs/src/frameworks/react/__testfixtures__/9922-ts-component-props/properties.snapshot b/app/react/src/client/docs/__testfixtures__/9922-ts-component-props/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/9922-ts-component-props/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/9922-ts-component-props/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/imported.js b/app/react/src/client/docs/__testfixtures__/imported.js similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/imported.js rename to app/react/src/client/docs/__testfixtures__/imported.js diff --git a/addons/docs/src/frameworks/react/__testfixtures__/js-class-component/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/js-class-component/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/js-class-component/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/js-class-component/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/js-class-component/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/js-class-component/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/js-class-component/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/js-class-component/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/js-class-component/input.js b/app/react/src/client/docs/__testfixtures__/js-class-component/input.js similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/js-class-component/input.js rename to app/react/src/client/docs/__testfixtures__/js-class-component/input.js diff --git a/addons/docs/src/frameworks/react/__testfixtures__/js-class-component/properties.snapshot b/app/react/src/client/docs/__testfixtures__/js-class-component/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/js-class-component/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/js-class-component/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/js-function-component-inline-defaults-no-propTypes/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/js-function-component-inline-defaults-no-propTypes/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/js-function-component-inline-defaults-no-propTypes/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/js-function-component-inline-defaults-no-propTypes/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/js-function-component-inline-defaults-no-propTypes/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/js-function-component-inline-defaults-no-propTypes/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/js-function-component-inline-defaults-no-propTypes/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/js-function-component-inline-defaults-no-propTypes/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/js-function-component-inline-defaults-no-propTypes/input.js b/app/react/src/client/docs/__testfixtures__/js-function-component-inline-defaults-no-propTypes/input.js similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/js-function-component-inline-defaults-no-propTypes/input.js rename to app/react/src/client/docs/__testfixtures__/js-function-component-inline-defaults-no-propTypes/input.js diff --git a/addons/docs/src/frameworks/react/__testfixtures__/js-function-component-inline-defaults-no-propTypes/properties.snapshot b/app/react/src/client/docs/__testfixtures__/js-function-component-inline-defaults-no-propTypes/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/js-function-component-inline-defaults-no-propTypes/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/js-function-component-inline-defaults-no-propTypes/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/js-function-component-inline-defaults/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/js-function-component-inline-defaults/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/js-function-component-inline-defaults/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/js-function-component-inline-defaults/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/js-function-component-inline-defaults/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/js-function-component-inline-defaults/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/js-function-component-inline-defaults/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/js-function-component-inline-defaults/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/js-function-component-inline-defaults/input.js b/app/react/src/client/docs/__testfixtures__/js-function-component-inline-defaults/input.js similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/js-function-component-inline-defaults/input.js rename to app/react/src/client/docs/__testfixtures__/js-function-component-inline-defaults/input.js diff --git a/addons/docs/src/frameworks/react/__testfixtures__/js-function-component-inline-defaults/properties.snapshot b/app/react/src/client/docs/__testfixtures__/js-function-component-inline-defaults/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/js-function-component-inline-defaults/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/js-function-component-inline-defaults/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/js-function-component/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/js-function-component/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/js-function-component/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/js-function-component/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/js-function-component/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/js-function-component/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/js-function-component/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/js-function-component/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/js-function-component/input.js b/app/react/src/client/docs/__testfixtures__/js-function-component/input.js similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/js-function-component/input.js rename to app/react/src/client/docs/__testfixtures__/js-function-component/input.js diff --git a/addons/docs/src/frameworks/react/__testfixtures__/js-function-component/properties.snapshot b/app/react/src/client/docs/__testfixtures__/js-function-component/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/js-function-component/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/js-function-component/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/ts-function-component-inline-defaults/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/ts-function-component-inline-defaults/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/ts-function-component-inline-defaults/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/ts-function-component-inline-defaults/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/ts-function-component-inline-defaults/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/ts-function-component-inline-defaults/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/ts-function-component-inline-defaults/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/ts-function-component-inline-defaults/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/ts-function-component-inline-defaults/input.tsx b/app/react/src/client/docs/__testfixtures__/ts-function-component-inline-defaults/input.tsx similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/ts-function-component-inline-defaults/input.tsx rename to app/react/src/client/docs/__testfixtures__/ts-function-component-inline-defaults/input.tsx diff --git a/addons/docs/src/frameworks/react/__testfixtures__/ts-function-component-inline-defaults/properties.snapshot b/app/react/src/client/docs/__testfixtures__/ts-function-component-inline-defaults/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/ts-function-component-inline-defaults/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/ts-function-component-inline-defaults/properties.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/ts-function-component/argTypes.snapshot b/app/react/src/client/docs/__testfixtures__/ts-function-component/argTypes.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/ts-function-component/argTypes.snapshot rename to app/react/src/client/docs/__testfixtures__/ts-function-component/argTypes.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/ts-function-component/docgen.snapshot b/app/react/src/client/docs/__testfixtures__/ts-function-component/docgen.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/ts-function-component/docgen.snapshot rename to app/react/src/client/docs/__testfixtures__/ts-function-component/docgen.snapshot diff --git a/addons/docs/src/frameworks/react/__testfixtures__/ts-function-component/input.tsx b/app/react/src/client/docs/__testfixtures__/ts-function-component/input.tsx similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/ts-function-component/input.tsx rename to app/react/src/client/docs/__testfixtures__/ts-function-component/input.tsx diff --git a/addons/docs/src/frameworks/react/__testfixtures__/ts-function-component/properties.snapshot b/app/react/src/client/docs/__testfixtures__/ts-function-component/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/react/__testfixtures__/ts-function-component/properties.snapshot rename to app/react/src/client/docs/__testfixtures__/ts-function-component/properties.snapshot diff --git a/addons/docs/src/frameworks/react/config.ts b/app/react/src/client/docs/config.ts similarity index 73% rename from addons/docs/src/frameworks/react/config.ts rename to app/react/src/client/docs/config.ts index e2614d15b36..393befc2415 100644 --- a/addons/docs/src/frameworks/react/config.ts +++ b/app/react/src/client/docs/config.ts @@ -1,8 +1,8 @@ import type { PartialStoryFn } from '@storybook/csf'; -import type { ReactFramework } from '@storybook/react'; +import { extractComponentDescription, enhanceArgTypes } from '@storybook/docs-tools'; +import { ReactFramework } from '..'; import { extractArgTypes } from './extractArgTypes'; -import { extractComponentDescription } from '../../lib/docgen'; import { jsxDecorator } from './jsxDecorator'; export const parameters = { @@ -16,3 +16,5 @@ export const parameters = { }; export const decorators = [jsxDecorator]; + +export const argTypesEnhancers = [enhanceArgTypes]; diff --git a/addons/docs/src/frameworks/react/extractArgTypes.ts b/app/react/src/client/docs/extractArgTypes.ts similarity index 91% rename from addons/docs/src/frameworks/react/extractArgTypes.ts rename to app/react/src/client/docs/extractArgTypes.ts index 161725abe37..333052be43e 100644 --- a/addons/docs/src/frameworks/react/extractArgTypes.ts +++ b/app/react/src/client/docs/extractArgTypes.ts @@ -1,5 +1,5 @@ import type { StrictArgTypes } from '@storybook/csf'; -import type { PropDef, ArgTypesExtractor } from '../../lib/docgen'; +import type { PropDef, ArgTypesExtractor } from '@storybook/docs-tools'; import { extractProps } from './extractProps'; export const extractArgTypes: ArgTypesExtractor = (component) => { diff --git a/addons/docs/src/frameworks/react/extractProps.ts b/app/react/src/client/docs/extractProps.ts similarity index 94% rename from addons/docs/src/frameworks/react/extractProps.ts rename to app/react/src/client/docs/extractProps.ts index 008aa8b2611..e763fd9e374 100644 --- a/addons/docs/src/frameworks/react/extractProps.ts +++ b/app/react/src/client/docs/extractProps.ts @@ -5,12 +5,14 @@ import { extractComponentProps, PropsExtractor, TypeSystem, -} from '../../lib/docgen'; -import { Component } from '../../blocks/types'; +} from '@storybook/docs-tools'; import { enhancePropTypesProps } from './propTypes/handleProp'; import { enhanceTypeScriptProps } from './typeScript/handleProp'; import { isMemo } from './lib'; +// FIXME +type Component = any; + export interface PropDefMap { [p: string]: PropDef; } diff --git a/addons/docs/src/frameworks/react/jsxDecorator.test.tsx b/app/react/src/client/docs/jsxDecorator.test.tsx similarity index 99% rename from addons/docs/src/frameworks/react/jsxDecorator.test.tsx rename to app/react/src/client/docs/jsxDecorator.test.tsx index b18e9984c51..40eb7c57b74 100644 --- a/addons/docs/src/frameworks/react/jsxDecorator.test.tsx +++ b/app/react/src/client/docs/jsxDecorator.test.tsx @@ -2,8 +2,8 @@ import React from 'react'; import PropTypes from 'prop-types'; import { addons, StoryContext, useEffect } from '@storybook/addons'; +import { SNIPPET_RENDERED } from '@storybook/docs-tools'; import { renderJsx, jsxDecorator } from './jsxDecorator'; -import { SNIPPET_RENDERED } from '../../shared'; jest.mock('@storybook/addons'); const mockedAddons = addons as jest.Mocked; diff --git a/addons/docs/src/frameworks/react/jsxDecorator.tsx b/app/react/src/client/docs/jsxDecorator.tsx similarity index 97% rename from addons/docs/src/frameworks/react/jsxDecorator.tsx rename to app/react/src/client/docs/jsxDecorator.tsx index 9170adaa3cc..727ee31e5f9 100644 --- a/addons/docs/src/frameworks/react/jsxDecorator.tsx +++ b/app/react/src/client/docs/jsxDecorator.tsx @@ -5,11 +5,11 @@ import deprecate from 'util-deprecate'; import { addons, useEffect } from '@storybook/addons'; import { StoryContext, ArgsStoryFn, PartialStoryFn } from '@storybook/csf'; +import { SourceType, SNIPPET_RENDERED, getDocgenSection } from '@storybook/docs-tools'; import { logger } from '@storybook/client-logger'; -import { ReactFramework } from '@storybook/react'; -import { SourceType, SNIPPET_RENDERED } from '../../shared'; -import { getDocgenSection } from '../../lib/docgen'; +import { ReactFramework } from '..'; + import { isMemo, isForwardRef } from './lib'; type JSXOptions = Options & { diff --git a/addons/docs/src/frameworks/react/lib/captions.ts b/app/react/src/client/docs/lib/captions.ts similarity index 100% rename from addons/docs/src/frameworks/react/lib/captions.ts rename to app/react/src/client/docs/lib/captions.ts diff --git a/addons/docs/src/frameworks/react/lib/componentTypes.ts b/app/react/src/client/docs/lib/componentTypes.ts similarity index 100% rename from addons/docs/src/frameworks/react/lib/componentTypes.ts rename to app/react/src/client/docs/lib/componentTypes.ts diff --git a/addons/docs/src/frameworks/react/lib/defaultValues/createDefaultValue.ts b/app/react/src/client/docs/lib/defaultValues/createDefaultValue.ts similarity index 94% rename from addons/docs/src/frameworks/react/lib/defaultValues/createDefaultValue.ts rename to app/react/src/client/docs/lib/defaultValues/createDefaultValue.ts index c4cd930e101..c2fb441d32c 100644 --- a/addons/docs/src/frameworks/react/lib/defaultValues/createDefaultValue.ts +++ b/app/react/src/client/docs/lib/defaultValues/createDefaultValue.ts @@ -1,4 +1,9 @@ -import { PropDefaultValue } from '@storybook/components'; +import { + createSummaryValue, + isTooLongForDefaultValueSummary, + PropDefaultValue, +} from '@storybook/docs-tools'; + import { FUNCTION_CAPTION, ELEMENT_CAPTION } from '../captions'; import { InspectionFunction, @@ -9,7 +14,6 @@ import { inspectValue, } from '../inspection'; import { isHtmlTag } from '../isHtmlTag'; -import { createSummaryValue, isTooLongForDefaultValueSummary } from '../../../../lib'; import { generateCode } from '../generateCode'; import { generateObject } from './generateObject'; import { generateArray } from './generateArray'; diff --git a/addons/docs/src/frameworks/react/lib/defaultValues/createFromRawDefaultProp.ts b/app/react/src/client/docs/lib/defaultValues/createFromRawDefaultProp.ts similarity index 96% rename from addons/docs/src/frameworks/react/lib/defaultValues/createFromRawDefaultProp.ts rename to app/react/src/client/docs/lib/defaultValues/createFromRawDefaultProp.ts index 6ef614385b5..1fba89efa58 100644 --- a/addons/docs/src/frameworks/react/lib/defaultValues/createFromRawDefaultProp.ts +++ b/app/react/src/client/docs/lib/defaultValues/createFromRawDefaultProp.ts @@ -1,11 +1,15 @@ -import { PropDefaultValue } from '@storybook/components'; import isPlainObject from 'lodash/isPlainObject'; import isFunction from 'lodash/isFunction'; import isString from 'lodash/isString'; // @ts-ignore import reactElementToJSXString from 'react-element-to-jsx-string'; -import { createSummaryValue, isTooLongForDefaultValueSummary } from '../../../../lib'; -import { PropDef } from '../../../../lib/docgen'; +import { + PropDef, + createSummaryValue, + isTooLongForDefaultValueSummary, + PropDefaultValue, +} from '@storybook/docs-tools'; + import { inspectValue, InspectionFunction } from '../inspection'; import { generateObject } from './generateObject'; import { generateArray } from './generateArray'; diff --git a/addons/docs/src/frameworks/react/lib/defaultValues/generateArray.ts b/app/react/src/client/docs/lib/defaultValues/generateArray.ts similarity index 79% rename from addons/docs/src/frameworks/react/lib/defaultValues/generateArray.ts rename to app/react/src/client/docs/lib/defaultValues/generateArray.ts index 6956b097931..8d80f9a371f 100644 --- a/addons/docs/src/frameworks/react/lib/defaultValues/generateArray.ts +++ b/app/react/src/client/docs/lib/defaultValues/generateArray.ts @@ -1,7 +1,10 @@ -import { PropDefaultValue } from '@storybook/components'; +import { + createSummaryValue, + isTooLongForDefaultValueSummary, + PropDefaultValue, +} from '@storybook/docs-tools'; import { ARRAY_CAPTION } from '../captions'; import { InspectionResult, InspectionArray } from '../inspection'; -import { createSummaryValue, isTooLongForDefaultValueSummary } from '../../../../lib'; import { generateArrayCode } from '../generateCode'; export function generateArray({ inferredType, ast }: InspectionResult): PropDefaultValue { diff --git a/addons/docs/src/frameworks/react/lib/defaultValues/generateObject.ts b/app/react/src/client/docs/lib/defaultValues/generateObject.ts similarity index 80% rename from addons/docs/src/frameworks/react/lib/defaultValues/generateObject.ts rename to app/react/src/client/docs/lib/defaultValues/generateObject.ts index c831271d6a6..2aa6e45e7a3 100644 --- a/addons/docs/src/frameworks/react/lib/defaultValues/generateObject.ts +++ b/app/react/src/client/docs/lib/defaultValues/generateObject.ts @@ -1,7 +1,11 @@ -import { PropDefaultValue } from '@storybook/components'; +import { + createSummaryValue, + isTooLongForDefaultValueSummary, + PropDefaultValue, +} from '@storybook/docs-tools'; + import { OBJECT_CAPTION } from '../captions'; import { InspectionResult, InspectionArray } from '../inspection'; -import { createSummaryValue, isTooLongForDefaultValueSummary } from '../../../../lib'; import { generateObjectCode } from '../generateCode'; export function generateObject({ inferredType, ast }: InspectionResult): PropDefaultValue { diff --git a/addons/docs/src/frameworks/react/lib/defaultValues/index.ts b/app/react/src/client/docs/lib/defaultValues/index.ts similarity index 100% rename from addons/docs/src/frameworks/react/lib/defaultValues/index.ts rename to app/react/src/client/docs/lib/defaultValues/index.ts diff --git a/addons/docs/src/frameworks/react/lib/defaultValues/prettyIdentifier.ts b/app/react/src/client/docs/lib/defaultValues/prettyIdentifier.ts similarity index 100% rename from addons/docs/src/frameworks/react/lib/defaultValues/prettyIdentifier.ts rename to app/react/src/client/docs/lib/defaultValues/prettyIdentifier.ts diff --git a/addons/docs/src/frameworks/react/lib/generateCode.ts b/app/react/src/client/docs/lib/generateCode.ts similarity index 100% rename from addons/docs/src/frameworks/react/lib/generateCode.ts rename to app/react/src/client/docs/lib/generateCode.ts diff --git a/addons/docs/src/frameworks/react/lib/index.ts b/app/react/src/client/docs/lib/index.ts similarity index 100% rename from addons/docs/src/frameworks/react/lib/index.ts rename to app/react/src/client/docs/lib/index.ts diff --git a/addons/docs/src/frameworks/react/lib/inspection/acornParser.test.ts b/app/react/src/client/docs/lib/inspection/acornParser.test.ts similarity index 100% rename from addons/docs/src/frameworks/react/lib/inspection/acornParser.test.ts rename to app/react/src/client/docs/lib/inspection/acornParser.test.ts diff --git a/addons/docs/src/frameworks/react/lib/inspection/acornParser.ts b/app/react/src/client/docs/lib/inspection/acornParser.ts similarity index 100% rename from addons/docs/src/frameworks/react/lib/inspection/acornParser.ts rename to app/react/src/client/docs/lib/inspection/acornParser.ts diff --git a/addons/docs/src/frameworks/react/lib/inspection/index.ts b/app/react/src/client/docs/lib/inspection/index.ts similarity index 100% rename from addons/docs/src/frameworks/react/lib/inspection/index.ts rename to app/react/src/client/docs/lib/inspection/index.ts diff --git a/addons/docs/src/frameworks/react/lib/inspection/inspectValue.ts b/app/react/src/client/docs/lib/inspection/inspectValue.ts similarity index 100% rename from addons/docs/src/frameworks/react/lib/inspection/inspectValue.ts rename to app/react/src/client/docs/lib/inspection/inspectValue.ts diff --git a/addons/docs/src/frameworks/react/lib/inspection/types.ts b/app/react/src/client/docs/lib/inspection/types.ts similarity index 100% rename from addons/docs/src/frameworks/react/lib/inspection/types.ts rename to app/react/src/client/docs/lib/inspection/types.ts diff --git a/addons/docs/src/frameworks/react/lib/isHtmlTag.ts b/app/react/src/client/docs/lib/isHtmlTag.ts similarity index 100% rename from addons/docs/src/frameworks/react/lib/isHtmlTag.ts rename to app/react/src/client/docs/lib/isHtmlTag.ts diff --git a/addons/docs/src/frameworks/react/propTypes/createType.ts b/app/react/src/client/docs/propTypes/createType.ts similarity index 98% rename from addons/docs/src/frameworks/react/propTypes/createType.ts rename to app/react/src/client/docs/propTypes/createType.ts index 6af9bc58289..45796b657a4 100644 --- a/addons/docs/src/frameworks/react/propTypes/createType.ts +++ b/app/react/src/client/docs/propTypes/createType.ts @@ -1,6 +1,10 @@ import { PropType } from '@storybook/components'; -import { createSummaryValue, isTooLongForTypeSummary } from '../../../lib'; -import { ExtractedProp, DocgenPropType } from '../../../lib/docgen'; +import { + ExtractedProp, + DocgenPropType, + createSummaryValue, + isTooLongForTypeSummary, +} from '@storybook/docs-tools'; import { generateFuncSignature, generateShortFuncSignature, diff --git a/addons/docs/src/frameworks/react/propTypes/generateFuncSignature.test.ts b/app/react/src/client/docs/propTypes/generateFuncSignature.test.ts similarity index 99% rename from addons/docs/src/frameworks/react/propTypes/generateFuncSignature.test.ts rename to app/react/src/client/docs/propTypes/generateFuncSignature.test.ts index 92f6575c937..d7ed578f7e5 100644 --- a/addons/docs/src/frameworks/react/propTypes/generateFuncSignature.test.ts +++ b/app/react/src/client/docs/propTypes/generateFuncSignature.test.ts @@ -1,5 +1,5 @@ import { generateFuncSignature, generateShortFuncSignature } from './generateFuncSignature'; -import { parseJsDoc } from '../../../lib/jsdocParser'; +import { parseJsDoc } from '@storybook/docs-tools'; describe('generateFuncSignature', () => { it('should return an empty string when there is no @params and @returns tags', () => { diff --git a/addons/docs/src/frameworks/react/propTypes/generateFuncSignature.ts b/app/react/src/client/docs/propTypes/generateFuncSignature.ts similarity index 93% rename from addons/docs/src/frameworks/react/propTypes/generateFuncSignature.ts rename to app/react/src/client/docs/propTypes/generateFuncSignature.ts index 0d6b6c251d8..2e1b500a9e5 100644 --- a/addons/docs/src/frameworks/react/propTypes/generateFuncSignature.ts +++ b/app/react/src/client/docs/propTypes/generateFuncSignature.ts @@ -1,4 +1,4 @@ -import { ExtractedJsDocParam, ExtractedJsDocReturns } from '../../../lib/jsdocParser'; +import { ExtractedJsDocParam, ExtractedJsDocReturns } from '@storybook/docs-tools'; export function generateFuncSignature( params: ExtractedJsDocParam[], diff --git a/addons/docs/src/frameworks/react/propTypes/handleProp.test.tsx b/app/react/src/client/docs/propTypes/handleProp.test.tsx similarity index 99% rename from addons/docs/src/frameworks/react/propTypes/handleProp.test.tsx rename to app/react/src/client/docs/propTypes/handleProp.test.tsx index 4483a6a1f75..84dfecd350e 100644 --- a/addons/docs/src/frameworks/react/propTypes/handleProp.test.tsx +++ b/app/react/src/client/docs/propTypes/handleProp.test.tsx @@ -2,15 +2,15 @@ import PropTypes from 'prop-types'; import React from 'react'; -import { Component } from '../../../blocks/types'; import { PropDef, extractComponentProps, DocgenInfo, DocgenPropDefaultValue, -} from '../../../lib/docgen'; +} from '@storybook/docs-tools'; import { enhancePropTypesProp, enhancePropTypesProps } from './handleProp'; +type Component = any; const DOCGEN_SECTION = 'props'; function ReactComponent() { diff --git a/addons/docs/src/frameworks/react/propTypes/handleProp.ts b/app/react/src/client/docs/propTypes/handleProp.ts similarity index 92% rename from addons/docs/src/frameworks/react/propTypes/handleProp.ts rename to app/react/src/client/docs/propTypes/handleProp.ts index 232c1d0cf89..a59022ffd7e 100644 --- a/addons/docs/src/frameworks/react/propTypes/handleProp.ts +++ b/app/react/src/client/docs/propTypes/handleProp.ts @@ -1,10 +1,11 @@ -import { PropDef, ExtractedProp } from '../../../lib/docgen'; +import { PropDef, ExtractedProp } from '@storybook/docs-tools'; import { createType } from './createType'; import { createDefaultValue, createDefaultValueFromRawDefaultProp } from '../lib/defaultValues'; -import { Component } from '../../../blocks/types'; import { keepOriginalDefinitionOrder } from './sortProps'; import { rawDefaultPropTypeResolvers } from './rawDefaultPropResolvers'; +type Component = any; + export function enhancePropTypesProp(extractedProp: ExtractedProp, rawDefaultProp?: any): PropDef { const { propDef } = extractedProp; diff --git a/addons/docs/src/frameworks/react/propTypes/rawDefaultPropResolvers.ts b/app/react/src/client/docs/propTypes/rawDefaultPropResolvers.ts similarity index 95% rename from addons/docs/src/frameworks/react/propTypes/rawDefaultPropResolvers.ts rename to app/react/src/client/docs/propTypes/rawDefaultPropResolvers.ts index 9433159adde..692554e7e37 100644 --- a/addons/docs/src/frameworks/react/propTypes/rawDefaultPropResolvers.ts +++ b/app/react/src/client/docs/propTypes/rawDefaultPropResolvers.ts @@ -1,5 +1,5 @@ +import { createSummaryValue } from '@storybook/docs-tools'; import { TypeResolver, extractFunctionName, createTypeResolvers } from '../lib/defaultValues'; -import { createSummaryValue } from '../../../lib'; import { FUNCTION_CAPTION, ELEMENT_CAPTION } from '../lib'; import { getPrettyElementIdentifier, diff --git a/addons/docs/src/frameworks/react/propTypes/sortProps.ts b/app/react/src/client/docs/propTypes/sortProps.ts similarity index 85% rename from addons/docs/src/frameworks/react/propTypes/sortProps.ts rename to app/react/src/client/docs/propTypes/sortProps.ts index 4cc5720a134..4d5dbb19e14 100644 --- a/addons/docs/src/frameworks/react/propTypes/sortProps.ts +++ b/app/react/src/client/docs/propTypes/sortProps.ts @@ -1,5 +1,6 @@ -import { PropDef } from '../../../lib/docgen'; -import { Component } from '../../../blocks/types'; +import { PropDef } from '@storybook/docs-tools'; + +type Component = any; // react-docgen doesn't returned the props in the order they were defined in the "propTypes" object of the component. // This function re-order them by their original definition order. diff --git a/addons/docs/src/frameworks/react/react-argtypes.stories.tsx b/app/react/src/client/docs/react-argtypes.stories.tsx similarity index 97% rename from addons/docs/src/frameworks/react/react-argtypes.stories.tsx rename to app/react/src/client/docs/react-argtypes.stories.tsx index 5f98016d96a..5f9511115c8 100644 --- a/addons/docs/src/frameworks/react/react-argtypes.stories.tsx +++ b/app/react/src/client/docs/react-argtypes.stories.tsx @@ -1,12 +1,14 @@ import React, { useState } from 'react'; import mapValues from 'lodash/mapValues'; -import { storiesOf, StoryContext } from '@storybook/react'; import { ArgsTable } from '@storybook/components'; import { Args } from '@storybook/api'; import { inferControls } from '@storybook/store'; +import { storiesOf, StoryContext } from '..'; import { extractArgTypes } from './extractArgTypes'; -import { Component } from '../../blocks'; + +// FIXME +type Component = any; const argsTableProps = (component: Component) => { const argTypes = extractArgTypes(component); diff --git a/addons/docs/src/frameworks/react/react-properties.test.ts b/app/react/src/client/docs/react-properties.test.ts similarity index 96% rename from addons/docs/src/frameworks/react/react-properties.test.ts rename to app/react/src/client/docs/react-properties.test.ts index da14c62a932..d2cc707dded 100644 --- a/addons/docs/src/frameworks/react/react-properties.test.ts +++ b/app/react/src/client/docs/react-properties.test.ts @@ -1,16 +1,16 @@ import 'jest-specific-snapshot'; import path from 'path'; import fs from 'fs'; - -import { transformFileSync, transformSync } from '@babel/core'; -import { inferControls } from '@storybook/store'; -import type { StoryContext } from '@storybook/react'; -import type { AnyFramework } from '@storybook/csf'; import requireFromString from 'require-from-string'; +import { transformFileSync, transformSync } from '@babel/core'; +import { inferControls } from '@storybook/store'; +import type { AnyFramework } from '@storybook/csf'; +import { normalizeNewlines } from '@storybook/docs-tools'; + +import type { StoryContext } from '..'; import { extractProps } from './extractProps'; import { extractArgTypes } from './extractArgTypes'; -import { normalizeNewlines } from '../../lib/utils'; // jest.mock('../imported', () => () => ({ imported: 'imported-value' }), { virtual: true }); diff --git a/addons/docs/src/frameworks/react/typeScript/handleProp.test.tsx b/app/react/src/client/docs/typeScript/handleProp.test.tsx similarity index 99% rename from addons/docs/src/frameworks/react/typeScript/handleProp.test.tsx rename to app/react/src/client/docs/typeScript/handleProp.test.tsx index 1071979909c..e00a21df83d 100644 --- a/addons/docs/src/frameworks/react/typeScript/handleProp.test.tsx +++ b/app/react/src/client/docs/typeScript/handleProp.test.tsx @@ -1,15 +1,16 @@ /* eslint-disable no-underscore-dangle */ import React from 'react'; -import { Component } from '../../../blocks/types'; import { PropDef, extractComponentProps, DocgenInfo, DocgenPropDefaultValue, -} from '../../../lib/docgen'; +} from '@storybook/docs-tools'; import { enhanceTypeScriptProp } from './handleProp'; +type Component = any; + const DOCGEN_SECTION = 'props'; function ReactComponent() { diff --git a/addons/docs/src/frameworks/react/typeScript/handleProp.ts b/app/react/src/client/docs/typeScript/handleProp.ts similarity index 93% rename from addons/docs/src/frameworks/react/typeScript/handleProp.ts rename to app/react/src/client/docs/typeScript/handleProp.ts index eeecb2db81f..2d7d13522ef 100644 --- a/addons/docs/src/frameworks/react/typeScript/handleProp.ts +++ b/app/react/src/client/docs/typeScript/handleProp.ts @@ -1,4 +1,4 @@ -import { PropDef, ExtractedProp } from '../../../lib/docgen'; +import { PropDef, ExtractedProp } from '@storybook/docs-tools'; import { createDefaultValue, createDefaultValueFromRawDefaultProp } from '../lib/defaultValues'; export function enhanceTypeScriptProp(extractedProp: ExtractedProp, rawDefaultProp?: any): PropDef { diff --git a/app/react/src/server/framework-preset-react-docs.ts b/app/react/src/server/framework-preset-react-docs.ts new file mode 100644 index 00000000000..4b83b052047 --- /dev/null +++ b/app/react/src/server/framework-preset-react-docs.ts @@ -0,0 +1,7 @@ +import type { StorybookConfig } from '@storybook/core-common'; +import { findDistEsm } from '@storybook/core-common'; + +export const config: StorybookConfig['config'] = (entry = [], options) => { + console.log({ options }); + return [...entry, findDistEsm(__dirname, 'client/docs/config')]; +}; diff --git a/app/react/src/server/preset.ts b/app/react/src/server/preset.ts index 4370c920f60..aa847f76bef 100644 --- a/app/react/src/server/preset.ts +++ b/app/react/src/server/preset.ts @@ -10,4 +10,5 @@ export const addons: StorybookConfig['addons'] = [ require.resolve('./framework-preset-react'), require.resolve('./framework-preset-cra'), require.resolve('./framework-preset-react-docgen'), + require.resolve('./framework-preset-react-docs'), ]; diff --git a/app/react/tsconfig.json b/app/react/tsconfig.json index ea47a78eb47..b16c7ffdcb0 100644 --- a/app/react/tsconfig.json +++ b/app/react/tsconfig.json @@ -2,16 +2,9 @@ "extends": "../../tsconfig.json", "compilerOptions": { "rootDir": "./src", - "types": [ - "webpack-env", - "node" - ], + "types": ["webpack-env", "node"], "resolveJsonModule": true }, - "include": [ - "src/**/*" - ], - "exclude": [ - "src/**/*.test.*" - ] -} \ No newline at end of file + "include": ["src/**/*"], + "exclude": ["src/**/*.test.*", "src/**/__testfixtures__/**"] +} From 3a2114317216a959cff1596e9c7c3726a366982e Mon Sep 17 00:00:00 2001 From: Michael Shilman Date: Sat, 12 Mar 2022 12:37:52 +0800 Subject: [PATCH 08/17] Vue: Move docs preset to framework --- app/vue/package.json | 3 + app/vue/src/client/docs/config.ts | 19 ++ .../vue/src/client/docs}/extractArgTypes.ts | 5 +- app/vue/src/client/docs/prepareForInline.ts | 39 +++ .../src/client/docs}/sourceDecorator.test.ts | 0 app/vue/src/client/docs/sourceDecorator.ts | 242 ++++++++++++++++++ .../vue/src/client/preview/docs}/config.ts | 6 +- .../client/preview/docs/extractArgTypes.ts | 86 +++++++ .../client/preview/docs}/prepareForInline.ts | 2 +- .../preview/docs/sourceDecorator.test.ts | 144 +++++++++++ .../client/preview/docs}/sourceDecorator.ts | 5 +- .../src/server/framework-preset-vue-docs.ts | 6 +- app/vue/src/server/options.ts | 5 +- .../src/stories/addon-docs.stories.mdx | 4 +- .../src/stories/components/app.stories.js | 2 +- 15 files changed, 556 insertions(+), 12 deletions(-) create mode 100644 app/vue/src/client/docs/config.ts rename {addons/docs/src/frameworks/vue => app/vue/src/client/docs}/extractArgTypes.ts (92%) create mode 100644 app/vue/src/client/docs/prepareForInline.ts rename {addons/docs/src/frameworks/vue => app/vue/src/client/docs}/sourceDecorator.test.ts (100%) create mode 100644 app/vue/src/client/docs/sourceDecorator.ts rename {addons/docs/src/frameworks/vue => app/vue/src/client/preview/docs}/config.ts (72%) create mode 100644 app/vue/src/client/preview/docs/extractArgTypes.ts rename {addons/docs/src/frameworks/vue => app/vue/src/client/preview/docs}/prepareForInline.ts (95%) create mode 100644 app/vue/src/client/preview/docs/sourceDecorator.test.ts rename {addons/docs/src/frameworks/vue => app/vue/src/client/preview/docs}/sourceDecorator.ts (97%) rename addons/docs/src/frameworks/vue/preset.ts => app/vue/src/server/framework-preset-vue-docs.ts (77%) diff --git a/app/vue/package.json b/app/vue/package.json index a04a7959c62..93d8141cd50 100644 --- a/app/vue/package.json +++ b/app/vue/package.json @@ -46,14 +46,17 @@ }, "dependencies": { "@storybook/addons": "6.5.0-alpha.47", + "@storybook/client-logger": "6.5.0-alpha.47", "@storybook/core": "6.5.0-alpha.47", "@storybook/core-common": "6.5.0-alpha.47", "@storybook/csf": "0.0.2--canary.87bc651.0", + "@storybook/docs-tools": "6.5.0-alpha.47", "@storybook/store": "6.5.0-alpha.47", "@types/node": "^14.14.20 || ^16.0.0", "@types/webpack-env": "^1.16.0", "core-js": "^3.8.2", "global": "^4.4.0", + "prettier": ">=2.2.1 <=2.3.0", "react": "16.14.0", "react-dom": "16.14.0", "read-pkg-up": "^7.0.1", diff --git a/app/vue/src/client/docs/config.ts b/app/vue/src/client/docs/config.ts new file mode 100644 index 00000000000..fe69d10e31d --- /dev/null +++ b/app/vue/src/client/docs/config.ts @@ -0,0 +1,19 @@ +import { extractComponentDescription, enhanceArgTypes } from '@storybook/docs-tools'; +import { extractArgTypes } from './extractArgTypes'; +import { prepareForInline } from './prepareForInline'; +import { sourceDecorator } from './sourceDecorator'; + +export const parameters = { + foobar: 'baz', + docs: { + inlineStories: true, + iframeHeight: 120, + prepareForInline, + extractArgTypes, + extractComponentDescription, + }, +}; + +export const decorators = [sourceDecorator]; + +export const argTypesEnhancers = [enhanceArgTypes]; diff --git a/addons/docs/src/frameworks/vue/extractArgTypes.ts b/app/vue/src/client/docs/extractArgTypes.ts similarity index 92% rename from addons/docs/src/frameworks/vue/extractArgTypes.ts rename to app/vue/src/client/docs/extractArgTypes.ts index 2df96363b27..92a9f113e9c 100644 --- a/addons/docs/src/frameworks/vue/extractArgTypes.ts +++ b/app/vue/src/client/docs/extractArgTypes.ts @@ -1,7 +1,6 @@ import type { StrictArgTypes } from '@storybook/csf'; -import { hasDocgen, extractComponentProps } from '../../lib/docgen'; -import type { ArgTypesExtractor, DocgenInfo, PropDef } from '../../lib/docgen'; -import { convert } from '../../lib/convert'; +import type { ArgTypesExtractor, DocgenInfo, PropDef } from '@storybook/docs-tools'; +import { hasDocgen, extractComponentProps, convert } from '@storybook/docs-tools'; const SECTIONS = ['props', 'events', 'slots', 'methods']; diff --git a/app/vue/src/client/docs/prepareForInline.ts b/app/vue/src/client/docs/prepareForInline.ts new file mode 100644 index 00000000000..f9c4fa17645 --- /dev/null +++ b/app/vue/src/client/docs/prepareForInline.ts @@ -0,0 +1,39 @@ +import React from 'react'; +import Vue from 'vue'; +import type { StoryContext, PartialStoryFn } from '@storybook/csf'; +import type { VueFramework } from '../preview/types-6-0'; + +// Inspired by https://github.com/egoist/vue-to-react, +// modified to store args as props in the root store + +// FIXME get this from @storybook/vue +const COMPONENT = 'STORYBOOK_COMPONENT'; +const VALUES = 'STORYBOOK_VALUES'; + +export const prepareForInline = ( + storyFn: PartialStoryFn, + { args }: StoryContext +) => { + const component = storyFn(); + const el = React.useRef(null); + + // FIXME: This recreates the Vue instance every time, which should be optimized + React.useEffect(() => { + const root = new Vue({ + el: el.current, + data() { + return { + [COMPONENT]: component, + [VALUES]: args, + }; + }, + render(h) { + const children = this[COMPONENT] ? [h(this[COMPONENT])] : undefined; + return h('div', { attrs: { id: 'root' } }, children); + }, + }); + return () => root.$destroy(); + }); + + return React.createElement('div', null, React.createElement('div', { ref: el })); +}; diff --git a/addons/docs/src/frameworks/vue/sourceDecorator.test.ts b/app/vue/src/client/docs/sourceDecorator.test.ts similarity index 100% rename from addons/docs/src/frameworks/vue/sourceDecorator.test.ts rename to app/vue/src/client/docs/sourceDecorator.test.ts diff --git a/app/vue/src/client/docs/sourceDecorator.ts b/app/vue/src/client/docs/sourceDecorator.ts new file mode 100644 index 00000000000..534426b1cbd --- /dev/null +++ b/app/vue/src/client/docs/sourceDecorator.ts @@ -0,0 +1,242 @@ +/* eslint no-underscore-dangle: ["error", { "allow": ["_vnode"] }] */ + +import type { StoryContext } from '@storybook/csf'; +import { addons } from '@storybook/addons'; +import { logger } from '@storybook/client-logger'; +import type Vue from 'vue'; + +import { SourceType, SNIPPET_RENDERED } from '@storybook/docs-tools'; +import type { VueFramework } from '../preview/types-6-0'; + +export const skipSourceRender = (context: StoryContext) => { + const sourceParams = context?.parameters.docs?.source; + const isArgsStory = context?.parameters.__isArgsStory; + + // always render if the user forces it + if (sourceParams?.type === SourceType.DYNAMIC) { + return false; + } + + // never render if the user is forcing the block to render code, or + // if the user provides code, or if it's not an args story. + return !isArgsStory || sourceParams?.code || sourceParams?.type === SourceType.CODE; +}; + +export const sourceDecorator = (storyFn: any, context: StoryContext) => { + const story = storyFn(); + console.log({ story }); + + // See ../react/jsxDecorator.tsx + if (skipSourceRender(context)) { + return story; + } + + const channel = addons.getChannel(); + + const storyComponent = getStoryComponent(story.options.STORYBOOK_WRAPS); + + return { + components: { + Story: story, + }, + // We need to wait until the wrapper component to be mounted so Vue runtime + // struct VNode tree. We get `this._vnode == null` if switch to `created` + // lifecycle hook. + mounted() { + // Theoretically this does not happens but we need to check it. + if (!this._vnode) { + return; + } + + try { + const storyNode = lookupStoryInstance(this, storyComponent); + + const code = vnodeToString(storyNode._vnode); + + const emitFormattedTemplate = async () => { + const prettier = await import('prettier/standalone'); + const prettierHtml = await import('prettier/parser-html'); + + channel.emit( + SNIPPET_RENDERED, + (context || {}).id, + prettier.format(``, { + 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}`); + } + }, + template: '', + }; +}; + +export function vnodeToString(vnode: Vue.VNode): string { + const attrString = [ + ...(vnode.data?.slot ? ([['slot', vnode.data.slot]] as [string, any][]) : []), + ['class', stringifyClassAttribute(vnode)], + ...(vnode.componentOptions?.propsData ? Object.entries(vnode.componentOptions.propsData) : []), + ...(vnode.data?.attrs ? Object.entries(vnode.data.attrs) : []), + ] + .filter(([name], index, list) => list.findIndex((item) => item[0] === name) === index) + .map(([name, value]) => stringifyAttr(name, value)) + .filter(Boolean) + .join(' '); + + if (!vnode.componentOptions) { + // Non-component elements (div, span, etc...) + if (vnode.tag) { + if (!vnode.children) { + return `<${vnode.tag} ${attrString}/>`; + } + + return `<${vnode.tag} ${attrString}>${vnode.children.map(vnodeToString).join('')}`; + } + + // TextNode + if (vnode.text) { + if (/[<>"&]/.test(vnode.text)) { + return `{{\`${vnode.text.replace(/`/g, '\\`')}\`}}`; + } + + return vnode.text; + } + + // Unknown + return ''; + } + + // Probably users never see the "unknown-component". It seems that vnode.tag + // is always set. + const tag = vnode.componentOptions.tag || vnode.tag || 'unknown-component'; + + if (!vnode.componentOptions.children) { + return `<${tag} ${attrString}/>`; + } + + return `<${tag} ${attrString}>${vnode.componentOptions.children + .map(vnodeToString) + .join('')}`; +} + +function stringifyClassAttribute(vnode: Vue.VNode): string | undefined { + if (!vnode.data || (!vnode.data.staticClass && !vnode.data.class)) { + return undefined; + } + + return ( + [...(vnode.data.staticClass?.split(' ') ?? []), ...normalizeClassBinding(vnode.data.class)] + .filter(Boolean) + .join(' ') || undefined + ); +} + +// https://vuejs.org/v2/guide/class-and-style.html#Binding-HTML-Classes +function normalizeClassBinding(binding: unknown): readonly string[] { + if (!binding) { + return []; + } + + if (typeof binding === 'string') { + return [binding]; + } + + if (binding instanceof Array) { + // To handle an object-in-array binding smartly, we use recursion + return binding.map(normalizeClassBinding).reduce((a, b) => [...a, ...b], []); + } + + if (typeof binding === 'object') { + return Object.entries(binding) + .filter(([, active]) => !!active) + .map(([className]) => className); + } + + // Unknown class binding + return []; +} + +function stringifyAttr(attrName: string, value?: any): string | null { + if (typeof value === 'undefined' || typeof value === 'function') { + return null; + } + + if (value === true) { + return attrName; + } + + if (typeof value === 'string') { + return `${attrName}=${quote(value)}`; + } + + // TODO: Better serialization (unquoted object key, Symbol/Classes, etc...) + // Seems like Prettier don't format JSON-look object (= when keys are quoted) + return `:${attrName}=${quote(JSON.stringify(value))}`; +} + +function quote(value: string) { + return value.includes(`"`) && !value.includes(`'`) + ? `'${value}'` + : `"${value.replace(/"/g, '"')}"`; +} + +/** + * Skip decorators and grab a story component itself. + * https://github.com/pocka/storybook-addon-vue-info/pull/113 + */ +function getStoryComponent(w: any) { + let matched = w; + + while ( + matched && + matched.options && + matched.options.components && + matched.options.components.story && + matched.options.components.story.options && + matched.options.components.story.options.STORYBOOK_WRAPS + ) { + matched = matched.options.components.story.options.STORYBOOK_WRAPS; + } + return matched; +} + +interface VueInternal { + // We need to access this private property, in order to grab the vnode of the + // component instead of the "vnode of the parent of the component". + // Probably it's safe to rely on this because vm.$vnode is a reference for this. + // https://github.com/vuejs/vue/issues/6070#issuecomment-314389883 + _vnode: Vue.VNode; +} + +/** + * Find the story's instance from VNode tree. + */ +function lookupStoryInstance(instance: Vue, storyComponent: any): (Vue & VueInternal) | null { + if ( + instance.$vnode && + instance.$vnode.componentOptions && + instance.$vnode.componentOptions.Ctor === storyComponent + ) { + return instance as Vue & VueInternal; + } + + for (let i = 0, l = instance.$children.length; i < l; i += 1) { + const found = lookupStoryInstance(instance.$children[i], storyComponent); + + if (found) { + return found; + } + } + + return null; +} diff --git a/addons/docs/src/frameworks/vue/config.ts b/app/vue/src/client/preview/docs/config.ts similarity index 72% rename from addons/docs/src/frameworks/vue/config.ts rename to app/vue/src/client/preview/docs/config.ts index a5e41a72613..225bf3a0d25 100644 --- a/addons/docs/src/frameworks/vue/config.ts +++ b/app/vue/src/client/preview/docs/config.ts @@ -1,11 +1,15 @@ +import { extractComponentDescription } from '@storybook/docs-tools'; import { extractArgTypes } from './extractArgTypes'; -import { extractComponentDescription } from '../../lib/docgen'; import { prepareForInline } from './prepareForInline'; import { sourceDecorator } from './sourceDecorator'; +console.log('hello2'); + export const parameters = { + foobar: 'baz', docs: { inlineStories: true, + iframeHeight: 120, prepareForInline, extractArgTypes, extractComponentDescription, diff --git a/app/vue/src/client/preview/docs/extractArgTypes.ts b/app/vue/src/client/preview/docs/extractArgTypes.ts new file mode 100644 index 00000000000..92a9f113e9c --- /dev/null +++ b/app/vue/src/client/preview/docs/extractArgTypes.ts @@ -0,0 +1,86 @@ +import type { StrictArgTypes } from '@storybook/csf'; +import type { ArgTypesExtractor, DocgenInfo, PropDef } from '@storybook/docs-tools'; +import { hasDocgen, extractComponentProps, convert } from '@storybook/docs-tools'; + +const SECTIONS = ['props', 'events', 'slots', 'methods']; + +/** + * Check if "@values" tag is defined within docgenInfo. + * If true, then propDef is mutated. + */ +function isEnum(propDef: PropDef, docgenInfo: DocgenInfo): false | PropDef { + // cast as any, since "values" doesn't exist in DocgenInfo type + const { type, values } = docgenInfo as any; + const matched = Array.isArray(values) && values.length && type.name !== 'enum'; + + if (!matched) return false; + + const enumString = values.join(', '); + let { summary } = propDef.type; + summary = summary ? `${summary}: ${enumString}` : enumString; + + Object.assign(propDef.type, { + ...propDef.type, + name: 'enum', + value: values, + summary, + }); + return propDef; +} + +/** + * @returns {Array} result + * @returns {PropDef} result.def - propDef + * @returns {boolean} result.isChanged - flag whether propDef is mutated or not. + * this is needed to prevent sbType from performing convert(docgenInfo). + */ +function verifyPropDef(propDef: PropDef, docgenInfo: DocgenInfo): [PropDef, boolean] { + let def = propDef; + let isChanged = false; + + // another callback can be added here. + // callback is mutually exclusive from each other. + const callbacks = [isEnum]; + for (let i = 0, len = callbacks.length; i < len; i += 1) { + const matched = callbacks[i](propDef, docgenInfo); + if (matched) { + def = matched; + isChanged = true; + } + } + + return [def, isChanged]; +} + +export const extractArgTypes: ArgTypesExtractor = (component) => { + if (!hasDocgen(component)) { + return null; + } + const results: StrictArgTypes = {}; + SECTIONS.forEach((section) => { + const props = extractComponentProps(component, section); + props.forEach(({ propDef, docgenInfo, jsDocTags }) => { + const [result, isPropDefChanged] = verifyPropDef(propDef, docgenInfo); + const { name, type, description, defaultValue: defaultSummary, required } = result; + + let sbType; + if (isPropDefChanged) { + sbType = type; + } else { + sbType = section === 'props' ? convert(docgenInfo) : { name: 'void' }; + } + results[name] = { + name, + description, + type: { required, ...sbType }, + table: { + type, + jsDocTags, + defaultValue: defaultSummary, + category: section, + }, + }; + }); + }); + return results; +}; diff --git a/addons/docs/src/frameworks/vue/prepareForInline.ts b/app/vue/src/client/preview/docs/prepareForInline.ts similarity index 95% rename from addons/docs/src/frameworks/vue/prepareForInline.ts rename to app/vue/src/client/preview/docs/prepareForInline.ts index 151710fcb50..3696a6bb768 100644 --- a/addons/docs/src/frameworks/vue/prepareForInline.ts +++ b/app/vue/src/client/preview/docs/prepareForInline.ts @@ -1,7 +1,7 @@ import React from 'react'; import Vue from 'vue'; import type { StoryContext, PartialStoryFn } from '@storybook/csf'; -import type { VueFramework } from '@storybook/vue'; +import type { VueFramework } from '../types-6-0'; // Inspired by https://github.com/egoist/vue-to-react, // modified to store args as props in the root store diff --git a/app/vue/src/client/preview/docs/sourceDecorator.test.ts b/app/vue/src/client/preview/docs/sourceDecorator.test.ts new file mode 100644 index 00000000000..54695c1ea84 --- /dev/null +++ b/app/vue/src/client/preview/docs/sourceDecorator.test.ts @@ -0,0 +1,144 @@ +/* eslint no-underscore-dangle: ["error", { "allow": ["_vnode"] }] */ + +import { ComponentOptions } from 'vue'; +import Vue from 'vue/dist/vue'; +import { vnodeToString } from './sourceDecorator'; + +expect.addSnapshotSerializer({ + print: (val: any) => val, + test: (val) => typeof val === 'string', +}); + +const getVNode = (Component: ComponentOptions) => { + const vm = new Vue({ + render(h: (c: any) => unknown) { + return h(Component); + }, + }).$mount(); + + return vm.$children[0]._vnode; +}; + +describe('vnodeToString', () => { + it('basic', () => { + expect( + vnodeToString( + getVNode({ + template: ``, + }) + ) + ).toMatchInlineSnapshot(``); + }); + + it('static class', () => { + expect( + vnodeToString( + getVNode({ + template: ``, + }) + ) + ).toMatchInlineSnapshot(``); + }); + + it('string dynamic class', () => { + expect( + vnodeToString( + getVNode({ + template: ``, + }) + ) + ).toMatchInlineSnapshot(``); + }); + + it('non-string dynamic class', () => { + expect( + vnodeToString( + getVNode({ + template: ``, + }) + ) + ).toMatchInlineSnapshot(``); + }); + + it('array dynamic class', () => { + expect( + vnodeToString( + getVNode({ + template: ``, + }) + ) + ).toMatchInlineSnapshot(``); + }); + + it('object dynamic class', () => { + expect( + vnodeToString( + getVNode({ + template: ``, + }) + ) + ).toMatchInlineSnapshot(``); + }); + + it('merge dynamic and static classes', () => { + expect( + vnodeToString( + getVNode({ + template: ``, + }) + ) + ).toMatchInlineSnapshot(``); + }); + + it('attributes', () => { + const MyComponent: ComponentOptions = { + props: ['propA', 'propB', 'propC', 'propD', 'propE', 'propF', 'propG'], + template: '
', + }; + + expect( + vnodeToString( + getVNode({ + components: { MyComponent }, + data(): { props: Record } { + return { + props: { + propA: 'propA', + propB: 1, + propC: null, + propD: { + foo: 'bar', + }, + propE: true, + propF() { + const foo = 'bar'; + + return foo; + }, + propG: undefined, + }, + }; + }, + template: ``, + }) + ) + ).toMatchInlineSnapshot( + `` + ); + }); + + it('children', () => { + expect( + vnodeToString( + getVNode({ + template: ` +
+
+ +
+
`, + }) + ) + ).toMatchInlineSnapshot(`
`); + }); +}); diff --git a/addons/docs/src/frameworks/vue/sourceDecorator.ts b/app/vue/src/client/preview/docs/sourceDecorator.ts similarity index 97% rename from addons/docs/src/frameworks/vue/sourceDecorator.ts rename to app/vue/src/client/preview/docs/sourceDecorator.ts index 3a8f49c399d..38eed0d20ff 100644 --- a/addons/docs/src/frameworks/vue/sourceDecorator.ts +++ b/app/vue/src/client/preview/docs/sourceDecorator.ts @@ -4,9 +4,9 @@ import type { StoryContext } from '@storybook/csf'; import { addons } from '@storybook/addons'; import { logger } from '@storybook/client-logger'; import type Vue from 'vue'; -import type { VueFramework } from '@storybook/vue'; -import { SourceType, SNIPPET_RENDERED } from '../../shared'; +import { SourceType, SNIPPET_RENDERED } from '@storybook/docs-tools'; +import type { VueFramework } from '../types-6-0'; export const skipSourceRender = (context: StoryContext) => { const sourceParams = context?.parameters.docs?.source; @@ -24,6 +24,7 @@ export const skipSourceRender = (context: StoryContext) => { export const sourceDecorator = (storyFn: any, context: StoryContext) => { const story = storyFn(); + console.log({ story }); // See ../react/jsxDecorator.tsx if (skipSourceRender(context)) { diff --git a/addons/docs/src/frameworks/vue/preset.ts b/app/vue/src/server/framework-preset-vue-docs.ts similarity index 77% rename from addons/docs/src/frameworks/vue/preset.ts rename to app/vue/src/server/framework-preset-vue-docs.ts index 5650c588cc6..86730dbf779 100644 --- a/addons/docs/src/frameworks/vue/preset.ts +++ b/app/vue/src/server/framework-preset-vue-docs.ts @@ -1,4 +1,4 @@ -import type { Options } from '@storybook/core-common'; +import { findDistEsm, Options, StorybookConfig } from '@storybook/core-common'; export function webpackFinal(webpackConfig: any = {}, options: Options) { let vueDocgenOptions = {}; @@ -26,3 +26,7 @@ export function webpackFinal(webpackConfig: any = {}, options: Options) { }); return webpackConfig; } + +export const config: StorybookConfig['config'] = (entry = []) => { + return [...entry, findDistEsm(__dirname, 'client/docs/config')]; +}; diff --git a/app/vue/src/server/options.ts b/app/vue/src/server/options.ts index e57b0499481..acb669ab409 100644 --- a/app/vue/src/server/options.ts +++ b/app/vue/src/server/options.ts @@ -4,5 +4,8 @@ import { LoadOptions } from '@storybook/core-common'; export default { packageJson: sync({ cwd: __dirname }).packageJson, framework: 'vue', - frameworkPresets: [require.resolve('./framework-preset-vue.js')], + frameworkPresets: [ + require.resolve('./framework-preset-vue.js'), + require.resolve('./framework-preset-vue-docs.js'), + ], } as LoadOptions; diff --git a/examples/vue-kitchen-sink/src/stories/addon-docs.stories.mdx b/examples/vue-kitchen-sink/src/stories/addon-docs.stories.mdx index 62481f719b8..5c0fb992edb 100644 --- a/examples/vue-kitchen-sink/src/stories/addon-docs.stories.mdx +++ b/examples/vue-kitchen-sink/src/stories/addon-docs.stories.mdx @@ -69,11 +69,11 @@ The default configuration for `addon-docs/vue` implements the `prepareForInline` To provide a tangible example of the inline/iframe rendering contexts, here's the same story rendered both ways. - + - + The biggest win here is that we don't have to worry about setting the height anymore. The story can calculate its height like any other inline element. As you can see, several of the stories on this page are quite small, but take up `500px`, because that's the default story height, and we didn't tweak the story to be an explicit height. Another huge gain here is in terms of performance. Using an iframe to render a single element is definitely unnecessary in most cases and, as you may have noticed while reading this page, can _really_ cause page performance to suffer. diff --git a/examples/vue-kitchen-sink/src/stories/components/app.stories.js b/examples/vue-kitchen-sink/src/stories/components/app.stories.js index 8f957aa3591..e58a19f78b0 100644 --- a/examples/vue-kitchen-sink/src/stories/components/app.stories.js +++ b/examples/vue-kitchen-sink/src/stories/components/app.stories.js @@ -11,4 +11,4 @@ export default { export const Default = () => ({ render: (h) => h(App), }); -Default.storyName = 'App'; +// Default.storyName = 'App'; From e6f379d8c5337fbbde19028a65f5568aad9e80be Mon Sep 17 00:00:00 2001 From: Michael Shilman Date: Sat, 12 Mar 2022 12:38:18 +0800 Subject: [PATCH 09/17] Vue3: Move docs preset to framework --- app/vue3/package.json | 1 + .../frameworks/vue3 => app/vue3/src/client/docs}/config.ts | 4 +++- .../vue3 => app/vue3/src/client/docs}/extractArgTypes.ts | 5 ++--- .../vue3 => app/vue3/src/client/docs}/prepareForInline.ts | 5 ++--- .../vue3/src/server/framework-preset-vue3-docs.ts | 6 +++++- app/vue3/src/server/options.ts | 5 ++++- 6 files changed, 17 insertions(+), 9 deletions(-) rename {addons/docs/src/frameworks/vue3 => app/vue3/src/client/docs}/config.ts (64%) rename {addons/docs/src/frameworks/vue3 => app/vue3/src/client/docs}/extractArgTypes.ts (83%) rename {addons/docs/src/frameworks/vue3 => app/vue3/src/client/docs}/prepareForInline.ts (82%) rename addons/docs/src/frameworks/vue3/preset.ts => app/vue3/src/server/framework-preset-vue3-docs.ts (77%) diff --git a/app/vue3/package.json b/app/vue3/package.json index 16dfdc7f4db..cea9439315a 100644 --- a/app/vue3/package.json +++ b/app/vue3/package.json @@ -49,6 +49,7 @@ "@storybook/core": "6.5.0-alpha.47", "@storybook/core-common": "6.5.0-alpha.47", "@storybook/csf": "0.0.2--canary.87bc651.0", + "@storybook/docs-tools": "6.5.0-alpha.47", "@storybook/store": "6.5.0-alpha.47", "@types/node": "^14.14.20 || ^16.0.0", "@types/webpack-env": "^1.16.0", diff --git a/addons/docs/src/frameworks/vue3/config.ts b/app/vue3/src/client/docs/config.ts similarity index 64% rename from addons/docs/src/frameworks/vue3/config.ts rename to app/vue3/src/client/docs/config.ts index 4a4fd37a39f..dd87a14d1a7 100644 --- a/addons/docs/src/frameworks/vue3/config.ts +++ b/app/vue3/src/client/docs/config.ts @@ -1,5 +1,5 @@ +import { extractComponentDescription, enhanceArgTypes } from '@storybook/docs-tools'; import { extractArgTypes } from './extractArgTypes'; -import { extractComponentDescription } from '../../lib/docgen'; import { prepareForInline } from './prepareForInline'; export const parameters = { @@ -10,3 +10,5 @@ export const parameters = { extractComponentDescription, }, }; + +export const argTypesEnhancers = [enhanceArgTypes]; diff --git a/addons/docs/src/frameworks/vue3/extractArgTypes.ts b/app/vue3/src/client/docs/extractArgTypes.ts similarity index 83% rename from addons/docs/src/frameworks/vue3/extractArgTypes.ts rename to app/vue3/src/client/docs/extractArgTypes.ts index ef05e29c846..c7a3e419959 100644 --- a/addons/docs/src/frameworks/vue3/extractArgTypes.ts +++ b/app/vue3/src/client/docs/extractArgTypes.ts @@ -1,7 +1,6 @@ import type { StrictArgTypes } from '@storybook/csf'; -import { hasDocgen, extractComponentProps } from '../../lib/docgen'; -import type { ArgTypesExtractor } from '../../lib/docgen'; -import { convert } from '../../lib/convert'; +import type { ArgTypesExtractor } from '@storybook/docs-tools'; +import { hasDocgen, extractComponentProps, convert } from '@storybook/docs-tools'; const SECTIONS = ['props', 'events', 'slots']; diff --git a/addons/docs/src/frameworks/vue3/prepareForInline.ts b/app/vue3/src/client/docs/prepareForInline.ts similarity index 82% rename from addons/docs/src/frameworks/vue3/prepareForInline.ts rename to app/vue3/src/client/docs/prepareForInline.ts index 3c41236f944..155f9253b83 100644 --- a/addons/docs/src/frameworks/vue3/prepareForInline.ts +++ b/app/vue3/src/client/docs/prepareForInline.ts @@ -1,8 +1,7 @@ import React from 'react'; import * as Vue from 'vue'; -import { app } from '@storybook/vue3'; -import type { StoryContext, PartialStoryFn } from '@storybook/csf'; -import type { VueFramework } from '@storybook/vue3'; +import { StoryContext, PartialStoryFn } from '@storybook/csf'; +import { app, VueFramework } from '../index'; // This is cast as `any` to workaround type errors caused by Vue 2 types const { render, h } = Vue as any; diff --git a/addons/docs/src/frameworks/vue3/preset.ts b/app/vue3/src/server/framework-preset-vue3-docs.ts similarity index 77% rename from addons/docs/src/frameworks/vue3/preset.ts rename to app/vue3/src/server/framework-preset-vue3-docs.ts index c8e044caf8e..f830fcf96d9 100644 --- a/addons/docs/src/frameworks/vue3/preset.ts +++ b/app/vue3/src/server/framework-preset-vue3-docs.ts @@ -1,4 +1,4 @@ -import type { Options } from '@storybook/core-common'; +import { findDistEsm, Options, StorybookConfig } from '@storybook/core-common'; export function webpackFinal(webpackConfig: any = {}, options: Options) { let vueDocgenOptions = {}; @@ -26,3 +26,7 @@ export function webpackFinal(webpackConfig: any = {}, options: Options) { }); return webpackConfig; } + +export const config: StorybookConfig['config'] = (entry = []) => { + return [...entry, findDistEsm(__dirname, 'client/docs/config')]; +}; diff --git a/app/vue3/src/server/options.ts b/app/vue3/src/server/options.ts index 6cd0f3261d0..f649466ece9 100644 --- a/app/vue3/src/server/options.ts +++ b/app/vue3/src/server/options.ts @@ -4,5 +4,8 @@ import type { LoadOptions } from '@storybook/core-common'; export default { packageJson: sync({ cwd: __dirname }).packageJson, framework: 'vue3', - frameworkPresets: [require.resolve('./framework-preset-vue3')], + frameworkPresets: [ + require.resolve('./framework-preset-vue3'), + require.resolve('./framework-preset-vue3-docs'), + ], } as LoadOptions; From 32e4de9c941808a91e13de547ad2f98cd04dfcb7 Mon Sep 17 00:00:00 2001 From: Michael Shilman Date: Sat, 12 Mar 2022 12:39:32 +0800 Subject: [PATCH 10/17] Web-components: Move docs preset to framework --- app/web-components/package.json | 2 + .../__testfixtures__/custom-elements.json | 0 .../custom-elements.snapshot | 0 .../lit-element-demo-card/input.js | 0 .../lit-element-demo-card/properties.snapshot | 0 .../lit-html-welcome/custom-elements.snapshot | 0 .../lit-html-welcome/input.js | 0 .../lit-html-welcome/properties.snapshot | 0 .../web-components/src/client/docs}/config.ts | 4 +- .../src/client/docs}/custom-elements.test.ts | 0 .../src/client/docs}/custom-elements.ts | 2 +- .../src/client/docs}/prepareForInline.ts | 4 +- .../src/client/docs}/sourceDecorator.test.ts | 2 +- .../src/client/docs}/sourceDecorator.ts | 4 +- .../docs}/web-components-properties.test.ts | 0 .../framework-preset-web-components-docs.ts | 6 + app/web-components/src/server/options.ts | 5 +- app/web-components/tsconfig.json | 15 +- .../web-components-kitchen-sink/package.json | 1 + .../web-components-kitchen-sink/yarn.lock | 433 +++++++----------- 20 files changed, 196 insertions(+), 282 deletions(-) rename {addons/docs/src/frameworks/web-components => app/web-components/src/client/docs}/__testfixtures__/custom-elements.json (100%) rename {addons/docs/src/frameworks/web-components => app/web-components/src/client/docs}/__testfixtures__/lit-element-demo-card/custom-elements.snapshot (100%) rename {addons/docs/src/frameworks/web-components => app/web-components/src/client/docs}/__testfixtures__/lit-element-demo-card/input.js (100%) rename {addons/docs/src/frameworks/web-components => app/web-components/src/client/docs}/__testfixtures__/lit-element-demo-card/properties.snapshot (100%) rename {addons/docs/src/frameworks/web-components => app/web-components/src/client/docs}/__testfixtures__/lit-html-welcome/custom-elements.snapshot (100%) rename {addons/docs/src/frameworks/web-components => app/web-components/src/client/docs}/__testfixtures__/lit-html-welcome/input.js (100%) rename {addons/docs/src/frameworks/web-components => app/web-components/src/client/docs}/__testfixtures__/lit-html-welcome/properties.snapshot (100%) rename {addons/docs/src/frameworks/web-components => app/web-components/src/client/docs}/config.ts (79%) rename {addons/docs/src/frameworks/web-components => app/web-components/src/client/docs}/custom-elements.test.ts (100%) rename {addons/docs/src/frameworks/web-components => app/web-components/src/client/docs}/custom-elements.ts (99%) rename {addons/docs/src/frameworks/web-components => app/web-components/src/client/docs}/prepareForInline.ts (89%) rename {addons/docs/src/frameworks/web-components => app/web-components/src/client/docs}/sourceDecorator.test.ts (98%) rename {addons/docs/src/frameworks/web-components => app/web-components/src/client/docs}/sourceDecorator.ts (92%) rename {addons/docs/src/frameworks/web-components => app/web-components/src/client/docs}/web-components-properties.test.ts (100%) create mode 100644 app/web-components/src/server/framework-preset-web-components-docs.ts diff --git a/app/web-components/package.json b/app/web-components/package.json index 697d491c185..1f9a52193e4 100644 --- a/app/web-components/package.json +++ b/app/web-components/package.json @@ -52,9 +52,11 @@ "@babel/preset-env": "^7.12.11", "@storybook/addons": "6.5.0-alpha.47", "@storybook/client-api": "6.5.0-alpha.47", + "@storybook/client-logger": "6.5.0-alpha.47", "@storybook/core": "6.5.0-alpha.47", "@storybook/core-common": "6.5.0-alpha.47", "@storybook/csf": "0.0.2--canary.87bc651.0", + "@storybook/docs-tools": "6.5.0-alpha.47", "@storybook/preview-web": "6.5.0-alpha.47", "@storybook/store": "6.5.0-alpha.47", "@types/node": "^14.14.20 || ^16.0.0", diff --git a/addons/docs/src/frameworks/web-components/__testfixtures__/custom-elements.json b/app/web-components/src/client/docs/__testfixtures__/custom-elements.json similarity index 100% rename from addons/docs/src/frameworks/web-components/__testfixtures__/custom-elements.json rename to app/web-components/src/client/docs/__testfixtures__/custom-elements.json diff --git a/addons/docs/src/frameworks/web-components/__testfixtures__/lit-element-demo-card/custom-elements.snapshot b/app/web-components/src/client/docs/__testfixtures__/lit-element-demo-card/custom-elements.snapshot similarity index 100% rename from addons/docs/src/frameworks/web-components/__testfixtures__/lit-element-demo-card/custom-elements.snapshot rename to app/web-components/src/client/docs/__testfixtures__/lit-element-demo-card/custom-elements.snapshot diff --git a/addons/docs/src/frameworks/web-components/__testfixtures__/lit-element-demo-card/input.js b/app/web-components/src/client/docs/__testfixtures__/lit-element-demo-card/input.js similarity index 100% rename from addons/docs/src/frameworks/web-components/__testfixtures__/lit-element-demo-card/input.js rename to app/web-components/src/client/docs/__testfixtures__/lit-element-demo-card/input.js diff --git a/addons/docs/src/frameworks/web-components/__testfixtures__/lit-element-demo-card/properties.snapshot b/app/web-components/src/client/docs/__testfixtures__/lit-element-demo-card/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/web-components/__testfixtures__/lit-element-demo-card/properties.snapshot rename to app/web-components/src/client/docs/__testfixtures__/lit-element-demo-card/properties.snapshot diff --git a/addons/docs/src/frameworks/web-components/__testfixtures__/lit-html-welcome/custom-elements.snapshot b/app/web-components/src/client/docs/__testfixtures__/lit-html-welcome/custom-elements.snapshot similarity index 100% rename from addons/docs/src/frameworks/web-components/__testfixtures__/lit-html-welcome/custom-elements.snapshot rename to app/web-components/src/client/docs/__testfixtures__/lit-html-welcome/custom-elements.snapshot diff --git a/addons/docs/src/frameworks/web-components/__testfixtures__/lit-html-welcome/input.js b/app/web-components/src/client/docs/__testfixtures__/lit-html-welcome/input.js similarity index 100% rename from addons/docs/src/frameworks/web-components/__testfixtures__/lit-html-welcome/input.js rename to app/web-components/src/client/docs/__testfixtures__/lit-html-welcome/input.js diff --git a/addons/docs/src/frameworks/web-components/__testfixtures__/lit-html-welcome/properties.snapshot b/app/web-components/src/client/docs/__testfixtures__/lit-html-welcome/properties.snapshot similarity index 100% rename from addons/docs/src/frameworks/web-components/__testfixtures__/lit-html-welcome/properties.snapshot rename to app/web-components/src/client/docs/__testfixtures__/lit-html-welcome/properties.snapshot diff --git a/addons/docs/src/frameworks/web-components/config.ts b/app/web-components/src/client/docs/config.ts similarity index 79% rename from addons/docs/src/frameworks/web-components/config.ts rename to app/web-components/src/client/docs/config.ts index 30273896e17..e0363ff6664 100644 --- a/addons/docs/src/frameworks/web-components/config.ts +++ b/app/web-components/src/client/docs/config.ts @@ -1,7 +1,7 @@ +import { SourceType, enhanceArgTypes } from '@storybook/docs-tools'; import { extractArgTypes, extractComponentDescription } from './custom-elements'; import { sourceDecorator } from './sourceDecorator'; import { prepareForInline } from './prepareForInline'; -import { SourceType } from '../../shared'; export const decorators = [sourceDecorator]; @@ -17,3 +17,5 @@ export const parameters = { }, }, }; + +export const argTypesEnhancers = [enhanceArgTypes]; diff --git a/addons/docs/src/frameworks/web-components/custom-elements.test.ts b/app/web-components/src/client/docs/custom-elements.test.ts similarity index 100% rename from addons/docs/src/frameworks/web-components/custom-elements.test.ts rename to app/web-components/src/client/docs/custom-elements.test.ts diff --git a/addons/docs/src/frameworks/web-components/custom-elements.ts b/app/web-components/src/client/docs/custom-elements.ts similarity index 99% rename from addons/docs/src/frameworks/web-components/custom-elements.ts rename to app/web-components/src/client/docs/custom-elements.ts index 2959f1b7231..124f7a6978e 100644 --- a/addons/docs/src/frameworks/web-components/custom-elements.ts +++ b/app/web-components/src/client/docs/custom-elements.ts @@ -1,6 +1,6 @@ -import { getCustomElements, isValidComponent, isValidMetaData } from '@storybook/web-components'; import type { ArgType, ArgTypes } from '@storybook/api'; import { logger } from '@storybook/client-logger'; +import { getCustomElements, isValidComponent, isValidMetaData } from '..'; interface TagItem { name: string; diff --git a/addons/docs/src/frameworks/web-components/prepareForInline.ts b/app/web-components/src/client/docs/prepareForInline.ts similarity index 89% rename from addons/docs/src/frameworks/web-components/prepareForInline.ts rename to app/web-components/src/client/docs/prepareForInline.ts index 75f7cc5a430..b501854839e 100644 --- a/addons/docs/src/frameworks/web-components/prepareForInline.ts +++ b/app/web-components/src/client/docs/prepareForInline.ts @@ -1,9 +1,9 @@ import type { PartialStoryFn } from '@storybook/csf'; -import { WebComponentsFramework } from '@storybook/web-components'; import React from 'react'; - import { render } from 'lit-html'; +import { WebComponentsFramework } from '..'; + export const prepareForInline = (storyFn: PartialStoryFn) => { class Story extends React.Component { wrapperRef = React.createRef(); diff --git a/addons/docs/src/frameworks/web-components/sourceDecorator.test.ts b/app/web-components/src/client/docs/sourceDecorator.test.ts similarity index 98% rename from addons/docs/src/frameworks/web-components/sourceDecorator.test.ts rename to app/web-components/src/client/docs/sourceDecorator.test.ts index 3e97052855d..9b900bfb83a 100644 --- a/addons/docs/src/frameworks/web-components/sourceDecorator.test.ts +++ b/app/web-components/src/client/docs/sourceDecorator.test.ts @@ -2,8 +2,8 @@ import { html } from 'lit-html'; import { styleMap } from 'lit-html/directives/style-map'; import { addons, useEffect } from '@storybook/addons'; import type { StoryContext } from '@storybook/addons'; +import { SNIPPET_RENDERED } from '@storybook/docs-tools'; import { sourceDecorator } from './sourceDecorator'; -import { SNIPPET_RENDERED } from '../../shared'; jest.mock('@storybook/addons'); const mockedAddons = addons as jest.Mocked; diff --git a/addons/docs/src/frameworks/web-components/sourceDecorator.ts b/app/web-components/src/client/docs/sourceDecorator.ts similarity index 92% rename from addons/docs/src/frameworks/web-components/sourceDecorator.ts rename to app/web-components/src/client/docs/sourceDecorator.ts index 91c7aeca9f6..e321db557ac 100644 --- a/addons/docs/src/frameworks/web-components/sourceDecorator.ts +++ b/app/web-components/src/client/docs/sourceDecorator.ts @@ -2,9 +2,9 @@ import { render } from 'lit-html'; import type { ArgsStoryFn, PartialStoryFn, StoryContext } from '@storybook/csf'; import { addons, useEffect } from '@storybook/addons'; -import type { WebComponentsFramework } from '@storybook/web-components'; +import { SNIPPET_RENDERED, SourceType } from '@storybook/docs-tools'; -import { SNIPPET_RENDERED, SourceType } from '../../shared'; +import type { WebComponentsFramework } from '..'; function skipSourceRender(context: StoryContext) { const sourceParams = context?.parameters.docs?.source; diff --git a/addons/docs/src/frameworks/web-components/web-components-properties.test.ts b/app/web-components/src/client/docs/web-components-properties.test.ts similarity index 100% rename from addons/docs/src/frameworks/web-components/web-components-properties.test.ts rename to app/web-components/src/client/docs/web-components-properties.test.ts diff --git a/app/web-components/src/server/framework-preset-web-components-docs.ts b/app/web-components/src/server/framework-preset-web-components-docs.ts new file mode 100644 index 00000000000..3b8f15d9bc0 --- /dev/null +++ b/app/web-components/src/server/framework-preset-web-components-docs.ts @@ -0,0 +1,6 @@ +// eslint-disable-next-line import/no-extraneous-dependencies +import { findDistEsm, StorybookConfig } from '@storybook/core-common'; + +export const config: StorybookConfig['config'] = (entry = []) => { + return [...entry, findDistEsm(__dirname, 'client/docs/config')]; +}; diff --git a/app/web-components/src/server/options.ts b/app/web-components/src/server/options.ts index 8b40200e0ac..b70f0969426 100644 --- a/app/web-components/src/server/options.ts +++ b/app/web-components/src/server/options.ts @@ -4,5 +4,8 @@ import type { LoadOptions } from '@storybook/core-common'; export default { packageJson: sync({ cwd: __dirname }).packageJson, framework: 'web-components', - frameworkPresets: [require.resolve('./framework-preset-web-components')], + frameworkPresets: [ + require.resolve('./framework-preset-web-components'), + require.resolve('./framework-preset-web-components-docs'), + ], } as LoadOptions; diff --git a/app/web-components/tsconfig.json b/app/web-components/tsconfig.json index 77e11bbd2ab..a7b3b6102f4 100644 --- a/app/web-components/tsconfig.json +++ b/app/web-components/tsconfig.json @@ -2,15 +2,8 @@ "extends": "../../tsconfig.json", "compilerOptions": { "rootDir": "./src", - "types": [ - "webpack-env", - "node" - ] + "types": ["webpack-env", "node"] }, - "include": [ - "src/**/*" - ], - "exclude": [ - "src/__tests__/**/*" - ] -} \ No newline at end of file + "include": ["src/**/*"], + "exclude": ["src/**/*.test.*", "src/__tests__/**/*"] +} diff --git a/examples/web-components-kitchen-sink/package.json b/examples/web-components-kitchen-sink/package.json index 06de0008b15..19d274a6aa2 100644 --- a/examples/web-components-kitchen-sink/package.json +++ b/examples/web-components-kitchen-sink/package.json @@ -40,6 +40,7 @@ "@storybook/core-events": "portal:../../lib/core-events", "@storybook/core-server": "portal:../../lib/core-server", "@storybook/csf-tools": "portal:../../lib/csf-tools", + "@storybook/docs-tools": "portal:../../lib/docs-tools", "@storybook/jest": "^0.0.5", "@storybook/manager-webpack4": "portal:../../lib/manager-webpack4", "@storybook/node-logger": "portal:../../lib/node-logger", diff --git a/examples/web-components-kitchen-sink/yarn.lock b/examples/web-components-kitchen-sink/yarn.lock index 61c88f1f068..ed91380c35f 100644 --- a/examples/web-components-kitchen-sink/yarn.lock +++ b/examples/web-components-kitchen-sink/yarn.lock @@ -1686,13 +1686,6 @@ __metadata: languageName: node linkType: hard -"@base2/pretty-print-object@npm:1.0.1": - version: 1.0.1 - resolution: "@base2/pretty-print-object@npm:1.0.1" - checksum: 98f77ea185a30c854897feb2a68fe51be8451a1a0b531bac61a5dd67033926a0ba0c9be6e0f819b8cb72ca349b3e7648bf81c12fd21df0b45219c75a3a75784b - languageName: node - linkType: hard - "@bcoe/v8-coverage@npm:^0.2.3": version: 0.2.3 resolution: "@bcoe/v8-coverage@npm:0.2.3" @@ -2121,14 +2114,14 @@ __metadata: version: 0.0.0-use.local resolution: "@storybook/addon-a11y@portal:../../addons/a11y::locator=web-components-kitchen-sink%40workspace%3A." dependencies: - "@storybook/addons": 6.5.0-alpha.46 - "@storybook/api": 6.5.0-alpha.46 - "@storybook/channels": 6.5.0-alpha.46 - "@storybook/client-logger": 6.5.0-alpha.46 - "@storybook/components": 6.5.0-alpha.46 - "@storybook/core-events": 6.5.0-alpha.46 + "@storybook/addons": 6.5.0-alpha.47 + "@storybook/api": 6.5.0-alpha.47 + "@storybook/channels": 6.5.0-alpha.47 + "@storybook/client-logger": 6.5.0-alpha.47 + "@storybook/components": 6.5.0-alpha.47 + "@storybook/core-events": 6.5.0-alpha.47 "@storybook/csf": 0.0.2--canary.87bc651.0 - "@storybook/theming": 6.5.0-alpha.46 + "@storybook/theming": 6.5.0-alpha.47 axe-core: ^4.2.0 core-js: ^3.8.2 global: ^4.4.0 @@ -2152,12 +2145,12 @@ __metadata: version: 0.0.0-use.local resolution: "@storybook/addon-actions@portal:../../addons/actions::locator=web-components-kitchen-sink%40workspace%3A." dependencies: - "@storybook/addons": 6.5.0-alpha.46 - "@storybook/api": 6.5.0-alpha.46 - "@storybook/components": 6.5.0-alpha.46 - "@storybook/core-events": 6.5.0-alpha.46 + "@storybook/addons": 6.5.0-alpha.47 + "@storybook/api": 6.5.0-alpha.47 + "@storybook/components": 6.5.0-alpha.47 + "@storybook/core-events": 6.5.0-alpha.47 "@storybook/csf": 0.0.2--canary.87bc651.0 - "@storybook/theming": 6.5.0-alpha.46 + "@storybook/theming": 6.5.0-alpha.47 core-js: ^3.8.2 fast-deep-equal: ^3.1.3 global: ^4.4.0 @@ -2185,13 +2178,13 @@ __metadata: version: 0.0.0-use.local resolution: "@storybook/addon-backgrounds@portal:../../addons/backgrounds::locator=web-components-kitchen-sink%40workspace%3A." dependencies: - "@storybook/addons": 6.5.0-alpha.46 - "@storybook/api": 6.5.0-alpha.46 - "@storybook/client-logger": 6.5.0-alpha.46 - "@storybook/components": 6.5.0-alpha.46 - "@storybook/core-events": 6.5.0-alpha.46 + "@storybook/addons": 6.5.0-alpha.47 + "@storybook/api": 6.5.0-alpha.47 + "@storybook/client-logger": 6.5.0-alpha.47 + "@storybook/components": 6.5.0-alpha.47 + "@storybook/core-events": 6.5.0-alpha.47 "@storybook/csf": 0.0.2--canary.87bc651.0 - "@storybook/theming": 6.5.0-alpha.46 + "@storybook/theming": 6.5.0-alpha.47 core-js: ^3.8.2 global: ^4.4.0 memoizerific: ^1.11.3 @@ -2213,15 +2206,15 @@ __metadata: version: 0.0.0-use.local resolution: "@storybook/addon-controls@portal:../../addons/controls::locator=web-components-kitchen-sink%40workspace%3A." dependencies: - "@storybook/addons": 6.5.0-alpha.46 - "@storybook/api": 6.5.0-alpha.46 - "@storybook/client-logger": 6.5.0-alpha.46 - "@storybook/components": 6.5.0-alpha.46 - "@storybook/core-common": 6.5.0-alpha.46 + "@storybook/addons": 6.5.0-alpha.47 + "@storybook/api": 6.5.0-alpha.47 + "@storybook/client-logger": 6.5.0-alpha.47 + "@storybook/components": 6.5.0-alpha.47 + "@storybook/core-common": 6.5.0-alpha.47 "@storybook/csf": 0.0.2--canary.87bc651.0 - "@storybook/node-logger": 6.5.0-alpha.46 - "@storybook/store": 6.5.0-alpha.46 - "@storybook/theming": 6.5.0-alpha.46 + "@storybook/node-logger": 6.5.0-alpha.47 + "@storybook/store": 6.5.0-alpha.47 + "@storybook/theming": 6.5.0-alpha.47 core-js: ^3.8.2 lodash: ^4.17.21 ts-dedent: ^2.0.0 @@ -2240,103 +2233,48 @@ __metadata: version: 0.0.0-use.local resolution: "@storybook/addon-docs@portal:../../addons/docs::locator=web-components-kitchen-sink%40workspace%3A." 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/react": ^1.6.22 - "@storybook/addons": 6.5.0-alpha.46 - "@storybook/api": 6.5.0-alpha.46 - "@storybook/builder-webpack4": 6.5.0-alpha.46 - "@storybook/client-logger": 6.5.0-alpha.46 - "@storybook/components": 6.5.0-alpha.46 - "@storybook/core": 6.5.0-alpha.46 - "@storybook/core-events": 6.5.0-alpha.46 + "@storybook/addons": 6.5.0-alpha.47 + "@storybook/api": 6.5.0-alpha.47 + "@storybook/components": 6.5.0-alpha.47 + "@storybook/core-common": 6.5.0-alpha.47 + "@storybook/core-events": 6.5.0-alpha.47 "@storybook/csf": 0.0.2--canary.87bc651.0 - "@storybook/csf-tools": 6.5.0-alpha.46 + "@storybook/docs-tools": 6.5.0-alpha.47 "@storybook/mdx1-csf": canary - "@storybook/node-logger": 6.5.0-alpha.46 - "@storybook/postinstall": 6.5.0-alpha.46 - "@storybook/preview-web": 6.5.0-alpha.46 - "@storybook/source-loader": 6.5.0-alpha.46 - "@storybook/store": 6.5.0-alpha.46 - "@storybook/theming": 6.5.0-alpha.46 - acorn: ^7.4.1 - acorn-jsx: ^5.3.1 - acorn-walk: ^7.2.0 + "@storybook/node-logger": 6.5.0-alpha.47 + "@storybook/postinstall": 6.5.0-alpha.47 + "@storybook/preview-web": 6.5.0-alpha.47 + "@storybook/source-loader": 6.5.0-alpha.47 + "@storybook/store": 6.5.0-alpha.47 + "@storybook/theming": 6.5.0-alpha.47 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 - loader-utils: ^2.0.0 lodash: ^4.17.21 - nanoid: ^3.1.23 - p-limit: ^3.1.0 - prettier: ">=2.2.1 <=2.3.0" - 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 peerDependencies: - "@storybook/angular": 6.5.0-alpha.46 - "@storybook/html": 6.5.0-alpha.46 "@storybook/mdx2-csf": "*" - "@storybook/react": 6.5.0-alpha.46 - "@storybook/vue": 6.5.0-alpha.46 - "@storybook/vue3": 6.5.0-alpha.46 - "@storybook/web-components": 6.5.0-alpha.46 - lit: ^2.0.0 - lit-html: ^1.4.1 || ^2.0.0 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/builder-webpack4": optional: true "@storybook/builder-webpack5": optional: true - "@storybook/html": - optional: true - "@storybook/manager-webpack4": - optional: true - "@storybook/manager-webpack5": - optional: true "@storybook/mdx2-csf": optional: true - "@storybook/react": - optional: true - "@storybook/vue": - optional: true - "@storybook/vue3": - optional: true - "@storybook/web-components": - optional: true - lit: - optional: true - lit-html: - optional: true react: optional: true react-dom: optional: true - svelte: - optional: true - sveltedoc-parser: - optional: true - vue: - optional: true webpack: optional: true languageName: node @@ -2372,11 +2310,11 @@ __metadata: version: 0.0.0-use.local resolution: "@storybook/addon-links@portal:../../addons/links::locator=web-components-kitchen-sink%40workspace%3A." dependencies: - "@storybook/addons": 6.5.0-alpha.46 - "@storybook/client-logger": 6.5.0-alpha.46 - "@storybook/core-events": 6.5.0-alpha.46 + "@storybook/addons": 6.5.0-alpha.47 + "@storybook/client-logger": 6.5.0-alpha.47 + "@storybook/core-events": 6.5.0-alpha.47 "@storybook/csf": 0.0.2--canary.87bc651.0 - "@storybook/router": 6.5.0-alpha.46 + "@storybook/router": 6.5.0-alpha.47 "@types/qs": ^6.9.5 core-js: ^3.8.2 global: ^4.4.0 @@ -2400,12 +2338,12 @@ __metadata: resolution: "@storybook/addon-storyshots@portal:../../addons/storyshots/storyshots-core::locator=web-components-kitchen-sink%40workspace%3A." dependencies: "@jest/transform": ^26.6.2 - "@storybook/addons": 6.5.0-alpha.46 + "@storybook/addons": 6.5.0-alpha.47 "@storybook/babel-plugin-require-context-hook": 1.0.1 - "@storybook/client-api": 6.5.0-alpha.46 - "@storybook/core": 6.5.0-alpha.46 - "@storybook/core-client": 6.5.0-alpha.46 - "@storybook/core-common": 6.5.0-alpha.46 + "@storybook/client-api": 6.5.0-alpha.47 + "@storybook/core": 6.5.0-alpha.47 + "@storybook/core-client": 6.5.0-alpha.47 + "@storybook/core-common": 6.5.0-alpha.47 "@storybook/csf": 0.0.2--canary.87bc651.0 "@types/glob": ^7.1.3 "@types/jest": ^26.0.16 @@ -2475,13 +2413,13 @@ __metadata: version: 0.0.0-use.local resolution: "@storybook/addon-storysource@portal:../../addons/storysource::locator=web-components-kitchen-sink%40workspace%3A." dependencies: - "@storybook/addons": 6.5.0-alpha.46 - "@storybook/api": 6.5.0-alpha.46 - "@storybook/client-logger": 6.5.0-alpha.46 - "@storybook/components": 6.5.0-alpha.46 - "@storybook/router": 6.5.0-alpha.46 - "@storybook/source-loader": 6.5.0-alpha.46 - "@storybook/theming": 6.5.0-alpha.46 + "@storybook/addons": 6.5.0-alpha.47 + "@storybook/api": 6.5.0-alpha.47 + "@storybook/client-logger": 6.5.0-alpha.47 + "@storybook/components": 6.5.0-alpha.47 + "@storybook/router": 6.5.0-alpha.47 + "@storybook/source-loader": 6.5.0-alpha.47 + "@storybook/theming": 6.5.0-alpha.47 core-js: ^3.8.2 estraverse: ^5.2.0 loader-utils: ^2.0.0 @@ -2504,12 +2442,12 @@ __metadata: version: 0.0.0-use.local resolution: "@storybook/addon-viewport@portal:../../addons/viewport::locator=web-components-kitchen-sink%40workspace%3A." dependencies: - "@storybook/addons": 6.5.0-alpha.46 - "@storybook/api": 6.5.0-alpha.46 - "@storybook/client-logger": 6.5.0-alpha.46 - "@storybook/components": 6.5.0-alpha.46 - "@storybook/core-events": 6.5.0-alpha.46 - "@storybook/theming": 6.5.0-alpha.46 + "@storybook/addons": 6.5.0-alpha.47 + "@storybook/api": 6.5.0-alpha.47 + "@storybook/client-logger": 6.5.0-alpha.47 + "@storybook/components": 6.5.0-alpha.47 + "@storybook/core-events": 6.5.0-alpha.47 + "@storybook/theming": 6.5.0-alpha.47 core-js: ^3.8.2 global: ^4.4.0 memoizerific: ^1.11.3 @@ -2530,13 +2468,13 @@ __metadata: version: 0.0.0-use.local resolution: "@storybook/addons@portal:../../lib/addons::locator=web-components-kitchen-sink%40workspace%3A." dependencies: - "@storybook/api": 6.5.0-alpha.46 - "@storybook/channels": 6.5.0-alpha.46 - "@storybook/client-logger": 6.5.0-alpha.46 - "@storybook/core-events": 6.5.0-alpha.46 + "@storybook/api": 6.5.0-alpha.47 + "@storybook/channels": 6.5.0-alpha.47 + "@storybook/client-logger": 6.5.0-alpha.47 + "@storybook/core-events": 6.5.0-alpha.47 "@storybook/csf": 0.0.2--canary.87bc651.0 - "@storybook/router": 6.5.0-alpha.46 - "@storybook/theming": 6.5.0-alpha.46 + "@storybook/router": 6.5.0-alpha.47 + "@storybook/theming": 6.5.0-alpha.47 "@types/webpack-env": ^1.16.0 core-js: ^3.8.2 global: ^4.4.0 @@ -2551,13 +2489,13 @@ __metadata: version: 0.0.0-use.local resolution: "@storybook/api@portal:../../lib/api::locator=web-components-kitchen-sink%40workspace%3A." dependencies: - "@storybook/channels": 6.5.0-alpha.46 - "@storybook/client-logger": 6.5.0-alpha.46 - "@storybook/core-events": 6.5.0-alpha.46 + "@storybook/channels": 6.5.0-alpha.47 + "@storybook/client-logger": 6.5.0-alpha.47 + "@storybook/core-events": 6.5.0-alpha.47 "@storybook/csf": 0.0.2--canary.87bc651.0 - "@storybook/router": 6.5.0-alpha.46 + "@storybook/router": 6.5.0-alpha.47 "@storybook/semver": ^7.3.2 - "@storybook/theming": 6.5.0-alpha.46 + "@storybook/theming": 6.5.0-alpha.47 core-js: ^3.8.2 fast-deep-equal: ^3.1.3 global: ^4.4.0 @@ -2586,22 +2524,22 @@ __metadata: resolution: "@storybook/builder-webpack4@portal:../../lib/builder-webpack4::locator=web-components-kitchen-sink%40workspace%3A." dependencies: "@babel/core": ^7.12.10 - "@storybook/addons": 6.5.0-alpha.46 - "@storybook/api": 6.5.0-alpha.46 - "@storybook/channel-postmessage": 6.5.0-alpha.46 - "@storybook/channels": 6.5.0-alpha.46 - "@storybook/client-api": 6.5.0-alpha.46 - "@storybook/client-logger": 6.5.0-alpha.46 - "@storybook/components": 6.5.0-alpha.46 - "@storybook/core-common": 6.5.0-alpha.46 - "@storybook/core-events": 6.5.0-alpha.46 - "@storybook/node-logger": 6.5.0-alpha.46 - "@storybook/preview-web": 6.5.0-alpha.46 - "@storybook/router": 6.5.0-alpha.46 + "@storybook/addons": 6.5.0-alpha.47 + "@storybook/api": 6.5.0-alpha.47 + "@storybook/channel-postmessage": 6.5.0-alpha.47 + "@storybook/channels": 6.5.0-alpha.47 + "@storybook/client-api": 6.5.0-alpha.47 + "@storybook/client-logger": 6.5.0-alpha.47 + "@storybook/components": 6.5.0-alpha.47 + "@storybook/core-common": 6.5.0-alpha.47 + "@storybook/core-events": 6.5.0-alpha.47 + "@storybook/node-logger": 6.5.0-alpha.47 + "@storybook/preview-web": 6.5.0-alpha.47 + "@storybook/router": 6.5.0-alpha.47 "@storybook/semver": ^7.3.2 - "@storybook/store": 6.5.0-alpha.46 - "@storybook/theming": 6.5.0-alpha.46 - "@storybook/ui": 6.5.0-alpha.46 + "@storybook/store": 6.5.0-alpha.47 + "@storybook/theming": 6.5.0-alpha.47 + "@storybook/ui": 6.5.0-alpha.47 "@types/node": ^14.0.10 || ^16.0.0 "@types/webpack": ^4.41.26 autoprefixer: ^9.8.6 @@ -2645,9 +2583,9 @@ __metadata: version: 0.0.0-use.local resolution: "@storybook/channel-postmessage@portal:../../lib/channel-postmessage::locator=web-components-kitchen-sink%40workspace%3A." dependencies: - "@storybook/channels": 6.5.0-alpha.46 - "@storybook/client-logger": 6.5.0-alpha.46 - "@storybook/core-events": 6.5.0-alpha.46 + "@storybook/channels": 6.5.0-alpha.47 + "@storybook/client-logger": 6.5.0-alpha.47 + "@storybook/core-events": 6.5.0-alpha.47 core-js: ^3.8.2 global: ^4.4.0 qs: ^6.10.0 @@ -2659,8 +2597,8 @@ __metadata: version: 0.0.0-use.local resolution: "@storybook/channel-websocket@portal:../../lib/channel-websocket::locator=web-components-kitchen-sink%40workspace%3A." dependencies: - "@storybook/channels": 6.5.0-alpha.46 - "@storybook/client-logger": 6.5.0-alpha.46 + "@storybook/channels": 6.5.0-alpha.47 + "@storybook/client-logger": 6.5.0-alpha.47 core-js: ^3.8.2 global: ^4.4.0 telejson: ^5.3.3 @@ -2681,13 +2619,13 @@ __metadata: version: 0.0.0-use.local resolution: "@storybook/client-api@portal:../../lib/client-api::locator=web-components-kitchen-sink%40workspace%3A." dependencies: - "@storybook/addons": 6.5.0-alpha.46 - "@storybook/channel-postmessage": 6.5.0-alpha.46 - "@storybook/channels": 6.5.0-alpha.46 - "@storybook/client-logger": 6.5.0-alpha.46 - "@storybook/core-events": 6.5.0-alpha.46 + "@storybook/addons": 6.5.0-alpha.47 + "@storybook/channel-postmessage": 6.5.0-alpha.47 + "@storybook/channels": 6.5.0-alpha.47 + "@storybook/client-logger": 6.5.0-alpha.47 + "@storybook/core-events": 6.5.0-alpha.47 "@storybook/csf": 0.0.2--canary.87bc651.0 - "@storybook/store": 6.5.0-alpha.46 + "@storybook/store": 6.5.0-alpha.47 "@types/qs": ^6.9.5 "@types/webpack-env": ^1.16.0 core-js: ^3.8.2 @@ -2720,9 +2658,9 @@ __metadata: version: 0.0.0-use.local resolution: "@storybook/components@portal:../../lib/components::locator=web-components-kitchen-sink%40workspace%3A." dependencies: - "@storybook/client-logger": 6.5.0-alpha.46 + "@storybook/client-logger": 6.5.0-alpha.47 "@storybook/csf": 0.0.2--canary.87bc651.0 - "@storybook/theming": 6.5.0-alpha.46 + "@storybook/theming": 6.5.0-alpha.47 core-js: ^3.8.2 regenerator-runtime: ^0.13.7 peerDependencies: @@ -2735,16 +2673,16 @@ __metadata: version: 0.0.0-use.local resolution: "@storybook/core-client@portal:../../lib/core-client::locator=web-components-kitchen-sink%40workspace%3A." dependencies: - "@storybook/addons": 6.5.0-alpha.46 - "@storybook/channel-postmessage": 6.5.0-alpha.46 - "@storybook/channel-websocket": 6.5.0-alpha.46 - "@storybook/client-api": 6.5.0-alpha.46 - "@storybook/client-logger": 6.5.0-alpha.46 - "@storybook/core-events": 6.5.0-alpha.46 + "@storybook/addons": 6.5.0-alpha.47 + "@storybook/channel-postmessage": 6.5.0-alpha.47 + "@storybook/channel-websocket": 6.5.0-alpha.47 + "@storybook/client-api": 6.5.0-alpha.47 + "@storybook/client-logger": 6.5.0-alpha.47 + "@storybook/core-events": 6.5.0-alpha.47 "@storybook/csf": 0.0.2--canary.87bc651.0 - "@storybook/preview-web": 6.5.0-alpha.46 - "@storybook/store": 6.5.0-alpha.46 - "@storybook/ui": 6.5.0-alpha.46 + "@storybook/preview-web": 6.5.0-alpha.47 + "@storybook/store": 6.5.0-alpha.47 + "@storybook/ui": 6.5.0-alpha.47 airbnb-js-shims: ^2.2.1 ansi-to-html: ^0.6.11 core-js: ^3.8.2 @@ -2791,7 +2729,7 @@ __metadata: "@babel/preset-react": ^7.12.10 "@babel/preset-typescript": ^7.12.7 "@babel/register": ^7.12.1 - "@storybook/node-logger": 6.5.0-alpha.46 + "@storybook/node-logger": 6.5.0-alpha.47 "@storybook/semver": ^7.3.2 "@types/node": ^14.0.10 || ^16.0.0 "@types/pretty-hrtime": ^1.0.0 @@ -2841,16 +2779,16 @@ __metadata: resolution: "@storybook/core-server@portal:../../lib/core-server::locator=web-components-kitchen-sink%40workspace%3A." dependencies: "@discoveryjs/json-ext": ^0.5.3 - "@storybook/builder-webpack4": 6.5.0-alpha.46 - "@storybook/core-client": 6.5.0-alpha.46 - "@storybook/core-common": 6.5.0-alpha.46 - "@storybook/core-events": 6.5.0-alpha.46 + "@storybook/builder-webpack4": 6.5.0-alpha.47 + "@storybook/core-client": 6.5.0-alpha.47 + "@storybook/core-common": 6.5.0-alpha.47 + "@storybook/core-events": 6.5.0-alpha.47 "@storybook/csf": 0.0.2--canary.87bc651.0 - "@storybook/csf-tools": 6.5.0-alpha.46 - "@storybook/manager-webpack4": 6.5.0-alpha.46 - "@storybook/node-logger": 6.5.0-alpha.46 + "@storybook/csf-tools": 6.5.0-alpha.47 + "@storybook/manager-webpack4": 6.5.0-alpha.47 + "@storybook/node-logger": 6.5.0-alpha.47 "@storybook/semver": ^7.3.2 - "@storybook/store": 6.5.0-alpha.46 + "@storybook/store": 6.5.0-alpha.47 "@types/node": ^14.0.10 || ^16.0.0 "@types/node-fetch": ^2.5.7 "@types/pretty-hrtime": ^1.0.0 @@ -2901,8 +2839,8 @@ __metadata: version: 0.0.0-use.local resolution: "@storybook/core@portal:../../lib/core::locator=web-components-kitchen-sink%40workspace%3A." dependencies: - "@storybook/core-client": 6.5.0-alpha.46 - "@storybook/core-server": 6.5.0-alpha.46 + "@storybook/core-client": 6.5.0-alpha.47 + "@storybook/core-server": 6.5.0-alpha.47 peerDependencies: react: ^16.8.0 || ^17.0.0 react-dom: ^16.8.0 || ^17.0.0 @@ -2952,6 +2890,19 @@ __metadata: languageName: node linkType: hard +"@storybook/docs-tools@portal:../../lib/docs-tools::locator=web-components-kitchen-sink%40workspace%3A.": + version: 0.0.0-use.local + resolution: "@storybook/docs-tools@portal:../../lib/docs-tools::locator=web-components-kitchen-sink%40workspace%3A." + dependencies: + "@babel/core": ^7.12.10 + "@storybook/csf": 0.0.2--canary.87bc651.0 + "@storybook/store": 6.5.0-alpha.47 + core-js: ^3.8.2 + doctrine: ^3.0.0 + regenerator-runtime: ^0.13.7 + languageName: node + linkType: soft + "@storybook/manager-webpack4@portal:../../lib/manager-webpack4::locator=web-components-kitchen-sink%40workspace%3A.": version: 0.0.0-use.local resolution: "@storybook/manager-webpack4@portal:../../lib/manager-webpack4::locator=web-components-kitchen-sink%40workspace%3A." @@ -2959,12 +2910,12 @@ __metadata: "@babel/core": ^7.12.10 "@babel/plugin-transform-template-literals": ^7.12.1 "@babel/preset-react": ^7.12.10 - "@storybook/addons": 6.5.0-alpha.46 - "@storybook/core-client": 6.5.0-alpha.46 - "@storybook/core-common": 6.5.0-alpha.46 - "@storybook/node-logger": 6.5.0-alpha.46 - "@storybook/theming": 6.5.0-alpha.46 - "@storybook/ui": 6.5.0-alpha.46 + "@storybook/addons": 6.5.0-alpha.47 + "@storybook/core-client": 6.5.0-alpha.47 + "@storybook/core-common": 6.5.0-alpha.47 + "@storybook/node-logger": 6.5.0-alpha.47 + "@storybook/theming": 6.5.0-alpha.47 + "@storybook/ui": 6.5.0-alpha.47 "@types/node": ^14.0.10 || ^16.0.0 "@types/webpack": ^4.41.26 babel-loader: ^8.0.0 @@ -3043,12 +2994,12 @@ __metadata: version: 0.0.0-use.local resolution: "@storybook/preview-web@portal:../../lib/preview-web::locator=web-components-kitchen-sink%40workspace%3A." dependencies: - "@storybook/addons": 6.5.0-alpha.46 - "@storybook/channel-postmessage": 6.5.0-alpha.46 - "@storybook/client-logger": 6.5.0-alpha.46 - "@storybook/core-events": 6.5.0-alpha.46 + "@storybook/addons": 6.5.0-alpha.47 + "@storybook/channel-postmessage": 6.5.0-alpha.47 + "@storybook/client-logger": 6.5.0-alpha.47 + "@storybook/core-events": 6.5.0-alpha.47 "@storybook/csf": 0.0.2--canary.87bc651.0 - "@storybook/store": 6.5.0-alpha.46 + "@storybook/store": 6.5.0-alpha.47 ansi-to-html: ^0.6.11 core-js: ^3.8.2 global: ^4.4.0 @@ -3069,7 +3020,7 @@ __metadata: version: 0.0.0-use.local resolution: "@storybook/router@portal:../../lib/router::locator=web-components-kitchen-sink%40workspace%3A." dependencies: - "@storybook/client-logger": 6.5.0-alpha.46 + "@storybook/client-logger": 6.5.0-alpha.47 core-js: ^3.8.2 regenerator-runtime: ^0.13.7 peerDependencies: @@ -3094,8 +3045,8 @@ __metadata: version: 0.0.0-use.local resolution: "@storybook/source-loader@portal:../../lib/source-loader::locator=web-components-kitchen-sink%40workspace%3A." dependencies: - "@storybook/addons": 6.5.0-alpha.46 - "@storybook/client-logger": 6.5.0-alpha.46 + "@storybook/addons": 6.5.0-alpha.47 + "@storybook/client-logger": 6.5.0-alpha.47 "@storybook/csf": 0.0.2--canary.87bc651.0 core-js: ^3.8.2 estraverse: ^5.2.0 @@ -3114,9 +3065,9 @@ __metadata: version: 0.0.0-use.local resolution: "@storybook/store@portal:../../lib/store::locator=web-components-kitchen-sink%40workspace%3A." dependencies: - "@storybook/addons": 6.5.0-alpha.46 - "@storybook/client-logger": 6.5.0-alpha.46 - "@storybook/core-events": 6.5.0-alpha.46 + "@storybook/addons": 6.5.0-alpha.47 + "@storybook/client-logger": 6.5.0-alpha.47 + "@storybook/core-events": 6.5.0-alpha.47 "@storybook/csf": 0.0.2--canary.87bc651.0 core-js: ^3.8.2 fast-deep-equal: ^3.1.3 @@ -3139,7 +3090,7 @@ __metadata: version: 0.0.0-use.local resolution: "@storybook/theming@portal:../../lib/theming::locator=web-components-kitchen-sink%40workspace%3A." dependencies: - "@storybook/client-logger": 6.5.0-alpha.46 + "@storybook/client-logger": 6.5.0-alpha.47 core-js: ^3.8.2 regenerator-runtime: ^0.13.7 peerDependencies: @@ -3152,15 +3103,15 @@ __metadata: version: 0.0.0-use.local resolution: "@storybook/ui@portal:../../lib/ui::locator=web-components-kitchen-sink%40workspace%3A." dependencies: - "@storybook/addons": 6.5.0-alpha.46 - "@storybook/api": 6.5.0-alpha.46 - "@storybook/channels": 6.5.0-alpha.46 - "@storybook/client-logger": 6.5.0-alpha.46 - "@storybook/components": 6.5.0-alpha.46 - "@storybook/core-events": 6.5.0-alpha.46 - "@storybook/router": 6.5.0-alpha.46 + "@storybook/addons": 6.5.0-alpha.47 + "@storybook/api": 6.5.0-alpha.47 + "@storybook/channels": 6.5.0-alpha.47 + "@storybook/client-logger": 6.5.0-alpha.47 + "@storybook/components": 6.5.0-alpha.47 + "@storybook/core-events": 6.5.0-alpha.47 + "@storybook/router": 6.5.0-alpha.47 "@storybook/semver": ^7.3.2 - "@storybook/theming": 6.5.0-alpha.46 + "@storybook/theming": 6.5.0-alpha.47 core-js: ^3.8.2 regenerator-runtime: ^0.13.7 resolve-from: ^5.0.0 @@ -3177,13 +3128,15 @@ __metadata: "@babel/plugin-syntax-dynamic-import": ^7.8.3 "@babel/plugin-syntax-import-meta": ^7.10.4 "@babel/preset-env": ^7.12.11 - "@storybook/addons": 6.5.0-alpha.46 - "@storybook/client-api": 6.5.0-alpha.46 - "@storybook/core": 6.5.0-alpha.46 - "@storybook/core-common": 6.5.0-alpha.46 + "@storybook/addons": 6.5.0-alpha.47 + "@storybook/client-api": 6.5.0-alpha.47 + "@storybook/client-logger": 6.5.0-alpha.47 + "@storybook/core": 6.5.0-alpha.47 + "@storybook/core-common": 6.5.0-alpha.47 "@storybook/csf": 0.0.2--canary.87bc651.0 - "@storybook/preview-web": 6.5.0-alpha.46 - "@storybook/store": 6.5.0-alpha.46 + "@storybook/docs-tools": 6.5.0-alpha.47 + "@storybook/preview-web": 6.5.0-alpha.47 + "@storybook/store": 6.5.0-alpha.47 "@types/node": ^14.14.20 || ^16.0.0 "@types/webpack-env": ^1.16.0 babel-plugin-bundled-import-meta: ^0.3.1 @@ -3779,16 +3732,7 @@ __metadata: languageName: node linkType: hard -"acorn-jsx@npm:^5.3.1": - version: 5.3.2 - resolution: "acorn-jsx@npm:5.3.2" - peerDependencies: - acorn: ^6.0.0 || ^7.0.0 || ^8.0.0 - checksum: 4c54868fbef3b8d58927d5e33f0a4de35f59012fe7b12cf9dfbb345fb8f46607709e1c4431be869a23fb63c151033d84c4198fa9f79385cec34fcb1dd53974c1 - languageName: node - linkType: hard - -"acorn-walk@npm:^7.1.1, acorn-walk@npm:^7.2.0": +"acorn-walk@npm:^7.1.1": version: 7.2.0 resolution: "acorn-walk@npm:7.2.0" checksum: ff99f3406ed8826f7d6ef6ac76b7608f099d45a1ff53229fa267125da1924188dbacf02e7903dfcfd2ae4af46f7be8847dc7d564c73c4e230dfb69c8ea8e6b4c @@ -3804,7 +3748,7 @@ __metadata: languageName: node linkType: hard -"acorn@npm:^7.1.1, acorn@npm:^7.4.1": +"acorn@npm:^7.1.1": version: 7.4.1 resolution: "acorn@npm:7.4.1" bin: @@ -7606,13 +7550,6 @@ fsevents@^1.2.7: languageName: node linkType: hard -"html-tags@npm:^3.1.0": - version: 3.1.0 - resolution: "html-tags@npm:3.1.0" - checksum: 057986ab130901137cf78d8561f47176c6874cc6ceb3bbc301fb5871d65f0efa83b3fb922ce8a90e0999e33ff4ab37006b560e60a1d3efc6a456510454711936 - languageName: node - linkType: hard - "html-void-elements@npm:^1.0.0": version: 1.0.5 resolution: "html-void-elements@npm:1.0.5" @@ -8270,13 +8207,6 @@ fsevents@^1.2.7: languageName: node linkType: hard -"is-plain-object@npm:5.0.0": - version: 5.0.0 - resolution: "is-plain-object@npm:5.0.0" - checksum: 893e42bad832aae3511c71fd61c0bf61aa3a6d853061c62a307261842727d0d25f761ce9379f7ba7226d6179db2a3157efa918e7fe26360f3bf0842d9f28942c - languageName: node - linkType: hard - "is-plain-object@npm:^2.0.3, is-plain-object@npm:^2.0.4": version: 2.0.4 resolution: "is-plain-object@npm:2.0.4" @@ -10140,15 +10070,6 @@ fsevents@^1.2.7: languageName: node linkType: hard -"nanoid@npm:^3.1.23": - version: 3.1.23 - resolution: "nanoid@npm:3.1.23" - bin: - nanoid: bin/nanoid.cjs - checksum: a3207f946e2db59f8095118d5c57615f217e7f8a743bdb83212e222bd263516dbd83db226675d9b8634ed928ff2019db96ca06825a391af4256b02f7bec4b443 - languageName: node - linkType: hard - "nanomatch@npm:^1.2.9": version: 1.2.13 resolution: "nanomatch@npm:1.2.13" @@ -10650,7 +10571,7 @@ fsevents@^1.2.7: languageName: node linkType: hard -"p-limit@npm:^3.0.2, p-limit@npm:^3.1.0": +"p-limit@npm:^3.0.2": version: 3.1.0 resolution: "p-limit@npm:3.1.0" dependencies: @@ -11534,20 +11455,6 @@ fsevents@^1.2.7: languageName: node linkType: hard -"react-element-to-jsx-string@npm:^14.3.4": - version: 14.3.4 - resolution: "react-element-to-jsx-string@npm:14.3.4" - dependencies: - "@base2/pretty-print-object": 1.0.1 - is-plain-object: 5.0.0 - react-is: 17.0.2 - peerDependencies: - react: ^0.14.8 || ^15.0.1 || ^16.0.0 || ^17.0.1 - react-dom: ^0.14.8 || ^15.0.1 || ^16.0.0 || ^17.0.1 - checksum: 4ead664b2e26e76af57c9ce2f2a46e79fda1d3a408afb5f34d03357d195b7f41a1a86bb9286b6d6ba76c9c2611fe56bc038665cf27fdb56f571d235ddfce9ffb - languageName: node - linkType: hard - "react-inspector@npm:^5.1.0": version: 5.1.1 resolution: "react-inspector@npm:5.1.1" @@ -11561,7 +11468,7 @@ fsevents@^1.2.7: languageName: node linkType: hard -"react-is@npm:17.0.2, react-is@npm:^16.12.0 || ^17.0.0, react-is@npm:^17.0.1, react-is@npm:^17.0.2": +"react-is@npm:^16.12.0 || ^17.0.0, react-is@npm:^17.0.1, react-is@npm:^17.0.2": version: 17.0.2 resolution: "react-is@npm:17.0.2" checksum: 2bdb6b93fbb1820b024b496042cce405c57e2f85e777c9aabd55f9b26d145408f9f74f5934676ffdc46f3dcff656d78413a6e43968e7b3f92eea35b3052e9053 From e89658c4d66462704d3f9c8763c752594c170845 Mon Sep 17 00:00:00 2001 From: Michael Shilman Date: Sat, 12 Mar 2022 17:46:03 +0800 Subject: [PATCH 11/17] Fix typo --- workspace.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/workspace.json b/workspace.json index 9fcfaf6e853..010773cb947 100644 --- a/workspace.json +++ b/workspace.json @@ -70,7 +70,7 @@ "type": "library" }, "@storybook/docs-tools": { - "root": "app/docs-tools", + "root": "lib/docs-tools", "type": "library" }, "@storybook/ember": { From b43f8006c9b4068176642eeaa5f8727aabbfcbab Mon Sep 17 00:00:00 2001 From: Michael Shilman Date: Sat, 12 Mar 2022 18:41:10 +0800 Subject: [PATCH 12/17] React: Simplify docs preset --- .../server/framework-preset-react-docgen.ts | 53 ------------------ ...ts => framework-preset-react-docs.test.ts} | 2 +- .../src/server/framework-preset-react-docs.ts | 55 ++++++++++++++++++- app/react/src/server/preset.ts | 1 - 4 files changed, 54 insertions(+), 57 deletions(-) delete mode 100644 app/react/src/server/framework-preset-react-docgen.ts rename app/react/src/server/{framework-preset-react-docgen.test.ts => framework-preset-react-docs.test.ts} (97%) diff --git a/app/react/src/server/framework-preset-react-docgen.ts b/app/react/src/server/framework-preset-react-docgen.ts deleted file mode 100644 index dece10b0113..00000000000 --- a/app/react/src/server/framework-preset-react-docgen.ts +++ /dev/null @@ -1,53 +0,0 @@ -import type { TransformOptions } from '@babel/core'; -import type { Configuration } from 'webpack'; -import ReactDocgenTypescriptPlugin from '@storybook/react-docgen-typescript-plugin'; -import type { Options, TypescriptConfig } from '@storybook/core-common'; - -export async function babel(config: TransformOptions, { presets }: Options) { - const typescriptOptions = await presets.apply('typescript', {} as any); - - const { reactDocgen } = typescriptOptions; - - if (typeof reactDocgen !== 'string') { - return config; - } - - return { - ...config, - overrides: [ - { - test: reactDocgen === 'react-docgen' ? /\.(mjs|tsx?|jsx?)$/ : /\.(mjs|jsx?)$/, - plugins: [ - [ - require.resolve('babel-plugin-react-docgen'), - { - DOC_GEN_COLLECTION_NAME: 'STORYBOOK_REACT_CLASSES', - }, - ], - ], - }, - ], - }; -} - -export async function webpackFinal(config: Configuration, { presets }: Options) { - const typescriptOptions = await presets.apply('typescript', {} as any); - - const { reactDocgen, reactDocgenTypescriptOptions } = typescriptOptions; - - if (reactDocgen !== 'react-docgen-typescript') { - return config; - } - - return { - ...config, - plugins: [ - ...config.plugins, - new ReactDocgenTypescriptPlugin({ - ...reactDocgenTypescriptOptions, - // We *need* this set so that RDT returns default values in the same format as react-docgen - savePropValueAsString: true, - }), - ], - }; -} diff --git a/app/react/src/server/framework-preset-react-docgen.test.ts b/app/react/src/server/framework-preset-react-docs.test.ts similarity index 97% rename from app/react/src/server/framework-preset-react-docgen.test.ts rename to app/react/src/server/framework-preset-react-docs.test.ts index 28b27989a91..74a98428e4a 100644 --- a/app/react/src/server/framework-preset-react-docgen.test.ts +++ b/app/react/src/server/framework-preset-react-docs.test.ts @@ -1,6 +1,6 @@ import ReactDocgenTypescriptPlugin from '@storybook/react-docgen-typescript-plugin'; import type { TypescriptConfig } from '@storybook/core-common'; -import * as preset from './framework-preset-react-docgen'; +import * as preset from './framework-preset-react-docs'; describe('framework-preset-react-docgen', () => { const babelPluginReactDocgenPath = require.resolve('babel-plugin-react-docgen'); diff --git a/app/react/src/server/framework-preset-react-docs.ts b/app/react/src/server/framework-preset-react-docs.ts index 4b83b052047..c9f4b507447 100644 --- a/app/react/src/server/framework-preset-react-docs.ts +++ b/app/react/src/server/framework-preset-react-docs.ts @@ -1,7 +1,58 @@ -import type { StorybookConfig } from '@storybook/core-common'; +import type { StorybookConfig, Options, TypescriptConfig } from '@storybook/core-common'; import { findDistEsm } from '@storybook/core-common'; +import type { TransformOptions } from '@babel/core'; +import type { Configuration } from 'webpack'; +import ReactDocgenTypescriptPlugin from '@storybook/react-docgen-typescript-plugin'; + +export async function babel(config: TransformOptions, { presets }: Options) { + const typescriptOptions = await presets.apply('typescript', {} as any); + + const { reactDocgen } = typescriptOptions; + + if (typeof reactDocgen !== 'string') { + return config; + } + + return { + ...config, + overrides: [ + { + test: reactDocgen === 'react-docgen' ? /\.(mjs|tsx?|jsx?)$/ : /\.(mjs|jsx?)$/, + plugins: [ + [ + require.resolve('babel-plugin-react-docgen'), + { + DOC_GEN_COLLECTION_NAME: 'STORYBOOK_REACT_CLASSES', + }, + ], + ], + }, + ], + }; +} + +export async function webpackFinal(config: Configuration, { presets }: Options) { + const typescriptOptions = await presets.apply('typescript', {} as any); + + const { reactDocgen, reactDocgenTypescriptOptions } = typescriptOptions; + + if (reactDocgen !== 'react-docgen-typescript') { + return config; + } + + return { + ...config, + plugins: [ + ...config.plugins, + new ReactDocgenTypescriptPlugin({ + ...reactDocgenTypescriptOptions, + // We *need* this set so that RDT returns default values in the same format as react-docgen + savePropValueAsString: true, + }), + ], + }; +} export const config: StorybookConfig['config'] = (entry = [], options) => { - console.log({ options }); return [...entry, findDistEsm(__dirname, 'client/docs/config')]; }; diff --git a/app/react/src/server/preset.ts b/app/react/src/server/preset.ts index aa847f76bef..b0807877e88 100644 --- a/app/react/src/server/preset.ts +++ b/app/react/src/server/preset.ts @@ -9,6 +9,5 @@ export const config: StorybookConfig['config'] = (entries = []) => [ export const addons: StorybookConfig['addons'] = [ require.resolve('./framework-preset-react'), require.resolve('./framework-preset-cra'), - require.resolve('./framework-preset-react-docgen'), require.resolve('./framework-preset-react-docs'), ]; From 8537b2461e8c085e1b480efa77df83c18c0dba88 Mon Sep 17 00:00:00 2001 From: Michael Shilman Date: Sat, 12 Mar 2022 18:41:29 +0800 Subject: [PATCH 13/17] Fix linting errors --- .../src/builders/build-storybook/index.ts | 3 +- .../src/client/docs/propTypes/createType.ts | 9 ++---- .../propTypes/generateFuncSignature.test.ts | 2 +- .../client/docs/react-argtypes.stories.tsx | 30 ------------------- .../lit-element-demo-card/input.js | 1 + .../framework-preset-web-components-docs.ts | 1 - 6 files changed, 5 insertions(+), 41 deletions(-) diff --git a/app/angular/src/builders/build-storybook/index.ts b/app/angular/src/builders/build-storybook/index.ts index 4fe76129d37..8fce4536070 100644 --- a/app/angular/src/builders/build-storybook/index.ts +++ b/app/angular/src/builders/build-storybook/index.ts @@ -10,13 +10,12 @@ import { from, Observable, of, throwError } from 'rxjs'; import type { CLIOptions } from '@storybook/core-common'; import { catchError, map, mapTo, switchMap } from 'rxjs/operators'; import { sync as findUpSync } from 'find-up'; - -// eslint-disable-next-line import/no-extraneous-dependencies import { BrowserBuilderOptions, ExtraEntryPoint, StylePreprocessorOptions, } from '@angular-devkit/build-angular'; + import buildStandalone, { StandaloneOptions } from '../../../standalone'; import { runCompodoc } from '../utils/run-compodoc'; import { buildStandaloneErrorHandler } from '../utils/build-standalone-errors-handler'; diff --git a/app/react/src/client/docs/propTypes/createType.ts b/app/react/src/client/docs/propTypes/createType.ts index 45796b657a4..cc3286dce0c 100644 --- a/app/react/src/client/docs/propTypes/createType.ts +++ b/app/react/src/client/docs/propTypes/createType.ts @@ -1,10 +1,5 @@ -import { PropType } from '@storybook/components'; -import { - ExtractedProp, - DocgenPropType, - createSummaryValue, - isTooLongForTypeSummary, -} from '@storybook/docs-tools'; +import type { ExtractedProp, DocgenPropType, PropType } from '@storybook/docs-tools'; +import { createSummaryValue, isTooLongForTypeSummary } from '@storybook/docs-tools'; import { generateFuncSignature, generateShortFuncSignature, diff --git a/app/react/src/client/docs/propTypes/generateFuncSignature.test.ts b/app/react/src/client/docs/propTypes/generateFuncSignature.test.ts index d7ed578f7e5..c62464b01e1 100644 --- a/app/react/src/client/docs/propTypes/generateFuncSignature.test.ts +++ b/app/react/src/client/docs/propTypes/generateFuncSignature.test.ts @@ -1,5 +1,5 @@ -import { generateFuncSignature, generateShortFuncSignature } from './generateFuncSignature'; import { parseJsDoc } from '@storybook/docs-tools'; +import { generateFuncSignature, generateShortFuncSignature } from './generateFuncSignature'; describe('generateFuncSignature', () => { it('should return an empty string when there is no @params and @returns tags', () => { diff --git a/app/react/src/client/docs/react-argtypes.stories.tsx b/app/react/src/client/docs/react-argtypes.stories.tsx index 5f9511115c8..9a14a0c39f6 100644 --- a/app/react/src/client/docs/react-argtypes.stories.tsx +++ b/app/react/src/client/docs/react-argtypes.stories.tsx @@ -53,36 +53,6 @@ const ArgsStory = ({ component }: any) => { ); }; -const typescriptFixtures = [ - 'aliases', - 'arrays', - 'enums', - 'functions', - 'interfaces', - 'intersections', - 'records', - 'scalars', - 'tuples', - 'unions', - 'optionals', -]; - -const typescriptStories = storiesOf('ArgTypes/TypeScript', module); -typescriptFixtures.forEach((fixture) => { - // eslint-disable-next-line import/no-dynamic-require, global-require, no-shadow - const { Component } = require(`../../lib/convert/__testfixtures__/typescript/${fixture}`); - typescriptStories.add(fixture, () => ); -}); - -const proptypesFixtures = ['arrays', 'enums', 'misc', 'objects', 'react', 'scalars']; - -const proptypesStories = storiesOf('ArgTypes/PropTypes', module); -proptypesFixtures.forEach((fixture) => { - // eslint-disable-next-line import/no-dynamic-require, global-require, no-shadow - const { Component } = require(`../../lib/convert/__testfixtures__/proptypes/${fixture}`); - proptypesStories.add(fixture, () => ); -}); - const issuesFixtures = [ 'js-class-component', 'js-function-component', diff --git a/app/web-components/src/client/docs/__testfixtures__/lit-element-demo-card/input.js b/app/web-components/src/client/docs/__testfixtures__/lit-element-demo-card/input.js index 64f03ae29da..8ac6852e911 100644 --- a/app/web-components/src/client/docs/__testfixtures__/lit-element-demo-card/input.js +++ b/app/web-components/src/client/docs/__testfixtures__/lit-element-demo-card/input.js @@ -1,3 +1,4 @@ +/* eslint-disable import/no-unresolved */ import global from 'global'; import { LitElement, html, css } from 'lit-element'; diff --git a/app/web-components/src/server/framework-preset-web-components-docs.ts b/app/web-components/src/server/framework-preset-web-components-docs.ts index 3b8f15d9bc0..f742f32da24 100644 --- a/app/web-components/src/server/framework-preset-web-components-docs.ts +++ b/app/web-components/src/server/framework-preset-web-components-docs.ts @@ -1,4 +1,3 @@ -// eslint-disable-next-line import/no-extraneous-dependencies import { findDistEsm, StorybookConfig } from '@storybook/core-common'; export const config: StorybookConfig['config'] = (entry = []) => { From bfc4e77d7ae53df62e4f164bfa1a195b0f88627b Mon Sep 17 00:00:00 2001 From: Michael Shilman Date: Sat, 12 Mar 2022 18:59:50 +0800 Subject: [PATCH 14/17] Fix failing unit tests --- app/angular/package.json | 1 + .../src/builders/build-storybook/index.ts | 3 +- .../doc-button/compodoc-undefined.snapshot | 1326 +++++++++++++++++ .../src/stories/components/app.stories.js | 2 +- .../cra-ts-essentials_manager-dev-posix | 2 +- .../cra-ts-essentials_manager-prod-posix | 2 +- .../cra-ts-essentials_preview-dev-posix | 8 +- .../cra-ts-essentials_preview-prod-posix | 8 +- .../html-kitchen-sink_manager-dev-posix | 2 +- .../html-kitchen-sink_manager-prod-posix | 2 +- .../html-kitchen-sink_preview-dev-posix | 4 +- .../html-kitchen-sink_preview-prod-posix | 4 +- .../__snapshots__/vue-3-cli_manager-dev-posix | 2 +- .../vue-3-cli_manager-prod-posix | 2 +- .../__snapshots__/vue-3-cli_preview-dev-posix | 4 +- .../vue-3-cli_preview-prod-posix | 4 +- ...-components-kitchen-sink_manager-dev-posix | 2 +- ...components-kitchen-sink_manager-prod-posix | 2 +- ...-components-kitchen-sink_preview-dev-posix | 4 +- ...components-kitchen-sink_preview-prod-posix | 4 +- yarn.lock | 8 + 21 files changed, 1366 insertions(+), 30 deletions(-) create mode 100644 app/angular/src/client/docs/__testfixtures__/doc-button/compodoc-undefined.snapshot diff --git a/app/angular/package.json b/app/angular/package.json index d2e8907486d..f7ee539a516 100644 --- a/app/angular/package.json +++ b/app/angular/package.json @@ -97,6 +97,7 @@ "@angular/platform-browser-dynamic": "^11.2.14", "@nrwl/workspace": "^11.6.3", "@types/autoprefixer": "^9.7.2", + "@types/tmp": "^0.2.3", "cross-spawn": "^7.0.3", "jest": "^26.6.3", "jest-preset-angular": "^8.3.2", diff --git a/app/angular/src/builders/build-storybook/index.ts b/app/angular/src/builders/build-storybook/index.ts index 8fce4536070..1995b4efa56 100644 --- a/app/angular/src/builders/build-storybook/index.ts +++ b/app/angular/src/builders/build-storybook/index.ts @@ -16,7 +16,8 @@ import { StylePreprocessorOptions, } from '@angular-devkit/build-angular'; -import buildStandalone, { StandaloneOptions } from '../../../standalone'; +// eslint-disable-next-line import/no-extraneous-dependencies +import buildStandalone, { StandaloneOptions } from '@storybook/angular/standalone'; import { runCompodoc } from '../utils/run-compodoc'; import { buildStandaloneErrorHandler } from '../utils/build-standalone-errors-handler'; diff --git a/app/angular/src/client/docs/__testfixtures__/doc-button/compodoc-undefined.snapshot b/app/angular/src/client/docs/__testfixtures__/doc-button/compodoc-undefined.snapshot new file mode 100644 index 00000000000..1bddf9b7550 --- /dev/null +++ b/app/angular/src/client/docs/__testfixtures__/doc-button/compodoc-undefined.snapshot @@ -0,0 +1,1326 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`angular component properties doc-button 1`] = ` +Object { + "classes": Array [], + "components": Array [ + Object { + "accessors": Object { + "inputValue": Object { + "getSignature": Object { + "description": "

Getter for inputValue.

+", + "line": 115, + "name": "inputValue", + "rawdescription": " +Getter for \`inputValue\`.", + "returnType": "", + "type": "", + }, + "name": "inputValue", + "setSignature": Object { + "args": Array [ + Object { + "deprecated": false, + "deprecationMessage": "", + "name": "value", + "type": "string", + }, + ], + "deprecated": false, + "deprecationMessage": "", + "description": "

Setter for inputValue that is also an @Input.

+", + "jsdoctags": Array [ + Object { + "deprecated": false, + "deprecationMessage": "", + "name": "value", + "tagName": Object { + "text": "param", + }, + "type": "string", + }, + ], + "line": 110, + "name": "inputValue", + "rawdescription": " +Setter for \`inputValue\` that is also an \`@Input\`.", + "returnType": "void", + "type": "void", + }, + }, + "item": Object { + "name": "item", + "setSignature": Object { + "args": Array [ + Object { + "deprecated": false, + "deprecationMessage": "", + "name": "item", + "type": "T[]", + }, + ], + "deprecated": false, + "deprecationMessage": "", + "jsdoctags": Array [ + Object { + "deprecated": false, + "deprecationMessage": "", + "name": "item", + "tagName": Object { + "text": "param", + }, + "type": "T[]", + }, + ], + "line": 195, + "name": "item", + "returnType": "void", + "type": "void", + }, + }, + "value": Object { + "getSignature": Object { + "description": "

Get the private value.

+", + "line": 154, + "name": "value", + "rawdescription": " +Get the private value.", + "returnType": "string | number", + "type": "", + }, + "name": "value", + "setSignature": Object { + "args": Array [ + Object { + "deprecated": false, + "deprecationMessage": "", + "name": "value", + "type": "string | number", + }, + ], + "deprecated": false, + "deprecationMessage": "", + "description": "

Set the private value.

+", + "jsdoctags": Array [ + Object { + "deprecated": false, + "deprecationMessage": "", + "name": "value", + "tagName": Object { + "text": "param", + }, + "type": "string | number", + }, + ], + "line": 149, + "name": "value", + "rawdescription": " +Set the private value.", + "returnType": "void", + "type": "void", + }, + }, + }, + "assetsDirs": Array [], + "deprecated": false, + "deprecationMessage": "", + "description": "

This is a simple button that demonstrates various JSDoc handling in Storybook Docs for Angular.

+

It supports markdown, so you can embed formatted text, +like bold, italic, and inline code.

+
+

How you like dem apples?! It's never been easier to document all your components.

+
+", + "encapsulation": Array [], + "entryComponents": Array [], + "file": "app/angular/src/client/docs/__testfixtures__/doc-button/input.ts", + "hostBindings": Array [ + Object { + "decorators": Array [], + "defaultValue": "false", + "deprecated": false, + "deprecationMessage": "", + "line": 124, + "name": "class.focused", + "type": "boolean", + }, + ], + "hostListeners": Array [ + Object { + "args": Array [ + Object { + "deprecated": false, + "deprecationMessage": "", + "name": "btn", + "type": "", + }, + ], + "argsDecorator": Array [ + "$event.target", + ], + "deprecated": false, + "deprecationMessage": "", + "line": 120, + "name": "click", + }, + ], + "id": "component-InputComponent-d145da25329b094ee29610c45a9e46387cb39eddb2a67b4c9fadb84bcec76eacd60d131e48d98b2ee5725dedd25f2eb299b704e8e0a34307d6e84f6e57d57044", + "inputs": Array [], + "inputsClass": Array [ + Object { + "decorators": Array [], + "deprecated": false, + "deprecationMessage": "", + "description": "

Specify the accent-type of the button

+", + "line": 56, + "name": "accent", + "rawdescription": " +Specify the accent-type of the button", + "type": "ButtonAccent", + }, + Object { + "decorators": Array [], + "defaultValue": "'secondary'", + "deprecated": false, + "deprecationMessage": "", + "description": "

Appearance style of the button.

+", + "line": 52, + "name": "appearance", + "rawdescription": " +Appearance style of the button.", + "type": "\\"primary\\" | \\"secondary\\"", + }, + Object { + "decorators": Array [], + "deprecated": false, + "deprecationMessage": "", + "description": "

Setter for inputValue that is also an @Input.

+", + "line": 110, + "name": "inputValue", + "rawdescription": " +Setter for \`inputValue\` that is also an \`@Input\`.", + "type": "string", + }, + Object { + "decorators": Array [], + "defaultValue": "false", + "deprecated": false, + "deprecationMessage": "", + "description": "

Sets the button to a disabled state.

+", + "line": 60, + "name": "isDisabled", + "rawdescription": " +Sets the button to a disabled state.", + "type": "boolean", + }, + Object { + "decorators": Array [], + "deprecated": false, + "deprecationMessage": "", + "line": 195, + "name": "item", + "type": "T[]", + }, + Object { + "decorators": Array [], + "deprecated": false, + "deprecationMessage": "", + "description": "

The inner text of the button.

+", + "jsdoctags": Array [ + Object { + "comment": "", + "end": 1525, + "flags": 4227072, + "kind": 325, + "modifierFlagsCache": 0, + "pos": 1512, + "tagName": Object { + "end": 1521, + "escapedText": "required", + "flags": 4227072, + "kind": 79, + "modifierFlagsCache": 0, + "pos": 1513, + "transformFlags": 0, + }, + "transformFlags": 0, + }, + ], + "line": 68, + "name": "label", + "rawdescription": " + +The inner text of the button. + +", + "type": "string", + }, + Object { + "decorators": Array [], + "deprecated": false, + "deprecationMessage": "", + "line": 192, + "name": "showKeyAlias", + "type": "", + }, + Object { + "decorators": Array [], + "defaultValue": "'medium'", + "deprecated": false, + "deprecationMessage": "", + "description": "

Size of the button.

+", + "line": 72, + "name": "size", + "rawdescription": " +Size of the button.", + "type": "ButtonSize", + }, + Object { + "decorators": Array [], + "deprecated": false, + "deprecationMessage": "", + "description": "

Specifies some arbitrary object

+", + "line": 75, + "name": "someDataObject", + "rawdescription": " +Specifies some arbitrary object", + "type": "ISomeInterface", + }, + Object { + "decorators": Array [], + "defaultValue": "false", + "deprecated": true, + "deprecationMessage": "", + "description": "

Some input you shouldn't use.

+", + "jsdoctags": Array [ + Object { + "comment": "", + "end": 1802, + "flags": 4227072, + "kind": 329, + "modifierFlagsCache": 0, + "pos": 1787, + "tagName": Object { + "end": 1798, + "escapedText": "deprecated", + "flags": 4227072, + "kind": 79, + "modifierFlagsCache": 0, + "pos": 1788, + "transformFlags": 0, + }, + "transformFlags": 0, + }, + ], + "line": 83, + "name": "somethingYouShouldNotUse", + "rawdescription": " + +Some input you shouldn't use. + +", + "type": "boolean", + }, + ], + "methodsClass": Array [ + Object { + "args": Array [ + Object { + "deprecated": false, + "deprecationMessage": "", + "name": "x", + "type": "number", + }, + Object { + "deprecated": false, + "deprecationMessage": "", + "name": "y", + "type": "string | number", + }, + ], + "deprecated": false, + "deprecationMessage": "", + "description": "

An internal calculation method which adds x and y together.

+", + "jsdoctags": Array [ + Object { + "comment": "

Some number you'd like to use.

+", + "deprecated": false, + "deprecationMessage": "", + "name": Object { + "end": 3518, + "escapedText": "x", + "flags": 4227072, + "kind": 79, + "modifierFlagsCache": 0, + "pos": 3517, + "transformFlags": 0, + }, + "tagName": Object { + "end": 3516, + "escapedText": "param", + "flags": 4227072, + "kind": 79, + "modifierFlagsCache": 0, + "pos": 3511, + "transformFlags": 0, + }, + "type": "number", + }, + Object { + "comment": "

Some other number or string you'd like to use, will have parseInt() applied before calculation.

+", + "deprecated": false, + "deprecationMessage": "", + "name": Object { + "end": 3563, + "escapedText": "y", + "flags": 4227072, + "kind": 79, + "modifierFlagsCache": 0, + "pos": 3562, + "transformFlags": 0, + }, + "tagName": Object { + "end": 3561, + "escapedText": "param", + "flags": 4227072, + "kind": 79, + "modifierFlagsCache": 0, + "pos": 3556, + "transformFlags": 0, + }, + "type": "string | number", + }, + ], + "line": 164, + "modifierKind": Array [ + 123, + ], + "name": "calc", + "optional": false, + "rawdescription": " + +An internal calculation method which adds \`x\` and \`y\` together. + +", + "returnType": "number", + "typeParameters": Array [], + }, + Object { + "args": Array [ + Object { + "deprecated": false, + "deprecationMessage": "", + "name": "btn", + "type": "", + }, + ], + "decorators": Array [ + Object { + "name": "HostListener", + "stringifiedArguments": "'click', ['$event.target']", + }, + ], + "deprecated": false, + "deprecationMessage": "", + "jsdoctags": Array [ + Object { + "deprecated": false, + "deprecationMessage": "", + "name": "btn", + "tagName": Object { + "text": "param", + }, + "type": "", + }, + ], + "line": 120, + "name": "onClickListener", + "optional": false, + "returnType": "void", + "typeParameters": Array [], + }, + Object { + "args": Array [ + Object { + "deprecated": false, + "deprecationMessage": "", + "name": "password", + "type": "string", + }, + ], + "deprecated": false, + "deprecationMessage": "", + "description": "

A private method.

+", + "jsdoctags": Array [ + Object { + "comment": "

Some password.

+", + "deprecated": false, + "deprecationMessage": "", + "name": Object { + "end": 4079, + "escapedText": "password", + "flags": 4227072, + "kind": 79, + "modifierFlagsCache": 0, + "pos": 4071, + "transformFlags": 0, + }, + "tagName": Object { + "end": 4070, + "escapedText": "param", + "flags": 4227072, + "kind": 79, + "modifierFlagsCache": 0, + "pos": 4065, + "transformFlags": 0, + }, + "type": "string", + }, + ], + "line": 187, + "modifierKind": Array [ + 121, + ], + "name": "privateMethod", + "optional": false, + "rawdescription": " + +A private method. + +", + "returnType": "void", + "typeParameters": Array [], + }, + Object { + "args": Array [ + Object { + "deprecated": false, + "deprecationMessage": "", + "name": "id", + "optional": true, + "type": "number", + }, + ], + "deprecated": false, + "deprecationMessage": "", + "description": "

A protected method.

+", + "jsdoctags": Array [ + Object { + "comment": "

Some id.

+", + "deprecated": false, + "deprecationMessage": "", + "name": Object { + "end": 3938, + "escapedText": "id", + "flags": 4227072, + "kind": 79, + "modifierFlagsCache": 0, + "pos": 3936, + "transformFlags": 0, + }, + "optional": true, + "tagName": Object { + "end": 3935, + "escapedText": "param", + "flags": 4227072, + "kind": 79, + "modifierFlagsCache": 0, + "pos": 3930, + "transformFlags": 0, + }, + "type": "number", + }, + ], + "line": 178, + "modifierKind": Array [ + 122, + ], + "name": "protectedMethod", + "optional": false, + "rawdescription": " + +A protected method. + +", + "returnType": "void", + "typeParameters": Array [], + }, + Object { + "args": Array [ + Object { + "deprecated": false, + "deprecationMessage": "", + "name": "things", + "type": "ISomeInterface", + }, + ], + "deprecated": false, + "deprecationMessage": "", + "description": "

A public method using an interface.

+", + "jsdoctags": Array [ + Object { + "deprecated": false, + "deprecationMessage": "", + "name": "things", + "tagName": Object { + "text": "param", + }, + "type": "ISomeInterface", + }, + ], + "line": 169, + "modifierKind": Array [ + 123, + ], + "name": "publicMethod", + "optional": false, + "rawdescription": " +A public method using an interface.", + "returnType": "void", + "typeParameters": Array [], + }, + ], + "name": "InputComponent", + "outputs": Array [], + "outputsClass": Array [ + Object { + "defaultValue": "new EventEmitter()", + "deprecated": false, + "deprecationMessage": "", + "description": "

Handler to be called when the button is clicked by a user.

+

Will also block the emission of the event if isDisabled is true.

+", + "line": 91, + "name": "onClick", + "rawdescription": " + +Handler to be called when the button is clicked by a user. + +Will also block the emission of the event if \`isDisabled\` is true. +", + "type": "EventEmitter", + }, + ], + "propertiesClass": Array [ + Object { + "defaultValue": "'some value'", + "deprecated": false, + "deprecationMessage": "", + "description": "", + "line": 106, + "modifierKind": Array [ + 121, + ], + "name": "_inputValue", + "optional": false, + "type": "string", + }, + Object { + "defaultValue": "'Private hello'", + "deprecated": false, + "deprecationMessage": "", + "description": "

Private value.

+", + "line": 146, + "modifierKind": Array [ + 121, + ], + "name": "_value", + "optional": false, + "rawdescription": " +Private value.", + "type": "string", + }, + Object { + "decorators": Array [ + Object { + "name": "ViewChild", + "stringifiedArguments": "'buttonRef', {static: false}", + }, + ], + "deprecated": false, + "deprecationMessage": "", + "description": "", + "line": 48, + "name": "buttonRef", + "optional": false, + "type": "ElementRef", + }, + Object { + "decorators": Array [ + Object { + "name": "HostBinding", + "stringifiedArguments": "'class.focused'", + }, + ], + "defaultValue": "false", + "deprecated": false, + "deprecationMessage": "", + "description": "", + "line": 124, + "name": "focus", + "optional": false, + "type": "", + }, + Object { + "defaultValue": "'Public hello'", + "deprecated": false, + "deprecationMessage": "", + "description": "

Public value.

+", + "line": 143, + "modifierKind": Array [ + 123, + ], + "name": "internalProperty", + "optional": false, + "rawdescription": " +Public value.", + "type": "string", + }, + Object { + "deprecated": false, + "deprecationMessage": "", + "description": "", + "line": 199, + "modifierKind": Array [ + 123, + ], + "name": "processedItem", + "optional": false, + "type": "T[]", + }, + ], + "providers": Array [], + "rawdescription": " + +This is a simple button that demonstrates various JSDoc handling in Storybook Docs for Angular. + +It supports [markdown](https://en.wikipedia.org/wiki/Markdown), so you can embed formatted text, +like **bold**, _italic_, and \`inline code\`. + +> How you like dem apples?! It's never been easier to document all your components. + +", + "selector": "doc-button", + "sourceCode": "import { + Component, + ElementRef, + EventEmitter, + HostBinding, + HostListener, + Input, + Output, + ViewChild, +} from '@angular/core'; + +export const exportedConstant = 'An exported constant'; + +export type ButtonSize = 'small' | 'medium' | 'large' | 'xlarge'; + +export enum ButtonAccent { + 'Normal' = 'Normal', + 'High' = 'High', +} + +export interface ISomeInterface { + one: string; + two: boolean; + three: any[]; +} + +/** + * This is a simple button that demonstrates various JSDoc handling in Storybook Docs for Angular. + * + * It supports [markdown](https://en.wikipedia.org/wiki/Markdown), so you can embed formatted text, + * like **bold**, _italic_, and \`inline code\`. + * + * > How you like dem apples?! It's never been easier to document all your components. + * + * @string Hello world + * @link [Example](http://example.com) + * @code \`ThingThing\` + * @html aaa + */ +@Component({ + selector: 'doc-button', + template: '', +}) +export class InputComponent { + @ViewChild('buttonRef', { static: false }) buttonRef: ElementRef; + + /** Appearance style of the button. */ + @Input() + public appearance: 'primary' | 'secondary' = 'secondary'; + + /** Specify the accent-type of the button */ + @Input() + public accent: ButtonAccent; + + /** Sets the button to a disabled state. */ + @Input() + public isDisabled = false; + + /** + * The inner text of the button. + * + * @required + */ + @Input() + public label: string; + + /** Size of the button. */ + @Input() + public size?: ButtonSize = 'medium'; + + /** Specifies some arbitrary object */ + @Input() public someDataObject: ISomeInterface; + + /** + * Some input you shouldn't use. + * + * @deprecated + */ + @Input() + public somethingYouShouldNotUse = false; + + /** + * Handler to be called when the button is clicked by a user. + * + * Will also block the emission of the event if \`isDisabled\` is true. + */ + @Output() + public onClick = new EventEmitter(); + + /** + * This is an internal method that we don't want to document and have added the \`ignore\` annotation to. + * + * @ignore + */ + public handleClick(event: Event) { + event.stopPropagation(); + + if (!this.isDisabled) { + this.onClick.emit(event); + } + } + + private _inputValue = 'some value'; + + /** Setter for \`inputValue\` that is also an \`@Input\`. */ + @Input() + public set inputValue(value: string) { + this._inputValue = value; + } + + /** Getter for \`inputValue\`. */ + public get inputValue() { + return this._inputValue; + } + + @HostListener('click', ['$event.target']) + onClickListener(btn) { + console.log('button', btn); + } + + @HostBinding('class.focused') focus = false; + + /** + * Returns all the CSS classes for the button. + * + * @ignore + */ + public get classes(): string[] { + return [this.appearance, this.size] + .filter((_class) => !!_class) + .map((_class) => \`btn-\${_class}\`); + } + + /** + * @ignore + */ + public ignoredProperty = 'Ignore me'; + + /** Public value. */ + public internalProperty = 'Public hello'; + + /** Private value. */ + private _value = 'Private hello'; + + /** Set the private value. */ + public set value(value: string | number) { + this._value = \`\${value}\`; + } + + /** Get the private value. */ + public get value(): string | number { + return this._value; + } + + /** + * An internal calculation method which adds \`x\` and \`y\` together. + * + * @param x Some number you'd like to use. + * @param y Some other number or string you'd like to use, will have \`parseInt()\` applied before calculation. + */ + public calc(x: number, y: string | number): number { + return x + parseInt(\`\${y}\`, 10); + } + + /** A public method using an interface. */ + public publicMethod(things: ISomeInterface) { + console.log(things); + } + + /** + * A protected method. + * + * @param id Some \`id\`. + */ + protected protectedMethod(id?: number) { + console.log(id); + } + + /** + * A private method. + * + * @param password Some \`password\`. + */ + private privateMethod(password: string) { + console.log(password); + } + + @Input('showKeyAlias') + public showKey: keyof T; + + @Input() + public set item(item: T[]) { + this.processedItem = item; + } + + public processedItem: T[]; +} +", + "styleUrls": Array [], + "styleUrlsData": "", + "styles": Array [], + "stylesData": "", + "template": "", + "templateUrl": Array [], + "type": "component", + "viewProviders": Array [], + }, + ], + "coverage": Object { + "count": 21, + "files": Array [ + Object { + "coverageCount": "16/25", + "coveragePercent": 64, + "filePath": "app/angular/src/client/docs/__testfixtures__/doc-button/input.ts", + "linktype": "component", + "name": "InputComponent", + "status": "good", + "type": "component", + }, + Object { + "coverageCount": "0/4", + "coveragePercent": 0, + "filePath": "app/angular/src/client/docs/__testfixtures__/doc-button/input.ts", + "linktype": "interface", + "name": "ISomeInterface", + "status": "low", + "type": "interface", + }, + Object { + "coverageCount": "0/1", + "coveragePercent": 0, + "filePath": "app/angular/src/client/docs/__testfixtures__/doc-button/input.ts", + "linksubtype": "variable", + "linktype": "miscellaneous", + "name": "exportedConstant", + "status": "low", + "type": "variable", + }, + ], + "status": "low", + }, + "directives": Array [], + "guards": Array [], + "injectables": Array [], + "interceptors": Array [], + "interfaces": Array [ + Object { + "deprecated": false, + "deprecationMessage": "", + "file": "app/angular/src/client/docs/__testfixtures__/doc-button/input.ts", + "id": "interface-ISomeInterface-d145da25329b094ee29610c45a9e46387cb39eddb2a67b4c9fadb84bcec76eacd60d131e48d98b2ee5725dedd25f2eb299b704e8e0a34307d6e84f6e57d57044", + "indexSignatures": Array [], + "kind": 165, + "methods": Array [], + "name": "ISomeInterface", + "properties": Array [ + Object { + "deprecated": false, + "deprecationMessage": "", + "description": "", + "line": 25, + "name": "one", + "optional": false, + "type": "string", + }, + Object { + "deprecated": false, + "deprecationMessage": "", + "description": "", + "line": 27, + "name": "three", + "optional": false, + "type": "any[]", + }, + Object { + "deprecated": false, + "deprecationMessage": "", + "description": "", + "line": 26, + "name": "two", + "optional": false, + "type": "boolean", + }, + ], + "sourceCode": "import { + Component, + ElementRef, + EventEmitter, + HostBinding, + HostListener, + Input, + Output, + ViewChild, +} from '@angular/core'; + +export const exportedConstant = 'An exported constant'; + +export type ButtonSize = 'small' | 'medium' | 'large' | 'xlarge'; + +export enum ButtonAccent { + 'Normal' = 'Normal', + 'High' = 'High', +} + +export interface ISomeInterface { + one: string; + two: boolean; + three: any[]; +} + +/** + * This is a simple button that demonstrates various JSDoc handling in Storybook Docs for Angular. + * + * It supports [markdown](https://en.wikipedia.org/wiki/Markdown), so you can embed formatted text, + * like **bold**, _italic_, and \`inline code\`. + * + * > How you like dem apples?! It's never been easier to document all your components. + * + * @string Hello world + * @link [Example](http://example.com) + * @code \`ThingThing\` + * @html aaa + */ +@Component({ + selector: 'doc-button', + template: '', +}) +export class InputComponent { + @ViewChild('buttonRef', { static: false }) buttonRef: ElementRef; + + /** Appearance style of the button. */ + @Input() + public appearance: 'primary' | 'secondary' = 'secondary'; + + /** Specify the accent-type of the button */ + @Input() + public accent: ButtonAccent; + + /** Sets the button to a disabled state. */ + @Input() + public isDisabled = false; + + /** + * The inner text of the button. + * + * @required + */ + @Input() + public label: string; + + /** Size of the button. */ + @Input() + public size?: ButtonSize = 'medium'; + + /** Specifies some arbitrary object */ + @Input() public someDataObject: ISomeInterface; + + /** + * Some input you shouldn't use. + * + * @deprecated + */ + @Input() + public somethingYouShouldNotUse = false; + + /** + * Handler to be called when the button is clicked by a user. + * + * Will also block the emission of the event if \`isDisabled\` is true. + */ + @Output() + public onClick = new EventEmitter(); + + /** + * This is an internal method that we don't want to document and have added the \`ignore\` annotation to. + * + * @ignore + */ + public handleClick(event: Event) { + event.stopPropagation(); + + if (!this.isDisabled) { + this.onClick.emit(event); + } + } + + private _inputValue = 'some value'; + + /** Setter for \`inputValue\` that is also an \`@Input\`. */ + @Input() + public set inputValue(value: string) { + this._inputValue = value; + } + + /** Getter for \`inputValue\`. */ + public get inputValue() { + return this._inputValue; + } + + @HostListener('click', ['$event.target']) + onClickListener(btn) { + console.log('button', btn); + } + + @HostBinding('class.focused') focus = false; + + /** + * Returns all the CSS classes for the button. + * + * @ignore + */ + public get classes(): string[] { + return [this.appearance, this.size] + .filter((_class) => !!_class) + .map((_class) => \`btn-\${_class}\`); + } + + /** + * @ignore + */ + public ignoredProperty = 'Ignore me'; + + /** Public value. */ + public internalProperty = 'Public hello'; + + /** Private value. */ + private _value = 'Private hello'; + + /** Set the private value. */ + public set value(value: string | number) { + this._value = \`\${value}\`; + } + + /** Get the private value. */ + public get value(): string | number { + return this._value; + } + + /** + * An internal calculation method which adds \`x\` and \`y\` together. + * + * @param x Some number you'd like to use. + * @param y Some other number or string you'd like to use, will have \`parseInt()\` applied before calculation. + */ + public calc(x: number, y: string | number): number { + return x + parseInt(\`\${y}\`, 10); + } + + /** A public method using an interface. */ + public publicMethod(things: ISomeInterface) { + console.log(things); + } + + /** + * A protected method. + * + * @param id Some \`id\`. + */ + protected protectedMethod(id?: number) { + console.log(id); + } + + /** + * A private method. + * + * @param password Some \`password\`. + */ + private privateMethod(password: string) { + console.log(password); + } + + @Input('showKeyAlias') + public showKey: keyof T; + + @Input() + public set item(item: T[]) { + this.processedItem = item; + } + + public processedItem: T[]; +} +", + "type": "interface", + }, + ], + "miscellaneous": Object { + "enumerations": Array [ + Object { + "childs": Array [ + Object { + "deprecated": false, + "deprecationMessage": "", + "name": "Normal", + "value": "Normal", + }, + Object { + "deprecated": false, + "deprecationMessage": "", + "name": "High", + "value": "High", + }, + ], + "ctype": "miscellaneous", + "deprecated": false, + "deprecationMessage": "", + "description": "", + "file": "app/angular/src/client/docs/__testfixtures__/doc-button/input.ts", + "name": "ButtonAccent", + "subtype": "enum", + }, + ], + "functions": Array [], + "groupedEnumerations": Object { + "app/angular/src/client/docs/__testfixtures__/doc-button/input.ts": Array [ + Object { + "childs": Array [ + Object { + "deprecated": false, + "deprecationMessage": "", + "name": "Normal", + "value": "Normal", + }, + Object { + "deprecated": false, + "deprecationMessage": "", + "name": "High", + "value": "High", + }, + ], + "ctype": "miscellaneous", + "deprecated": false, + "deprecationMessage": "", + "description": "", + "file": "app/angular/src/client/docs/__testfixtures__/doc-button/input.ts", + "name": "ButtonAccent", + "subtype": "enum", + }, + ], + }, + "groupedFunctions": Object {}, + "groupedTypeAliases": Object { + "app/angular/src/client/docs/__testfixtures__/doc-button/input.ts": Array [ + Object { + "ctype": "miscellaneous", + "deprecated": false, + "deprecationMessage": "", + "description": "", + "file": "app/angular/src/client/docs/__testfixtures__/doc-button/input.ts", + "kind": 186, + "name": "ButtonSize", + "rawtype": "\\"small\\" | \\"medium\\" | \\"large\\" | \\"xlarge\\"", + "subtype": "typealias", + }, + ], + }, + "groupedVariables": Object { + "app/angular/src/client/docs/__testfixtures__/doc-button/input.ts": Array [ + Object { + "ctype": "miscellaneous", + "defaultValue": "'An exported constant'", + "deprecated": false, + "deprecationMessage": "", + "file": "app/angular/src/client/docs/__testfixtures__/doc-button/input.ts", + "name": "exportedConstant", + "subtype": "variable", + "type": "string", + }, + ], + }, + "typealiases": Array [ + Object { + "ctype": "miscellaneous", + "deprecated": false, + "deprecationMessage": "", + "description": "", + "file": "app/angular/src/client/docs/__testfixtures__/doc-button/input.ts", + "kind": 186, + "name": "ButtonSize", + "rawtype": "\\"small\\" | \\"medium\\" | \\"large\\" | \\"xlarge\\"", + "subtype": "typealias", + }, + ], + "variables": Array [ + Object { + "ctype": "miscellaneous", + "defaultValue": "'An exported constant'", + "deprecated": false, + "deprecationMessage": "", + "file": "app/angular/src/client/docs/__testfixtures__/doc-button/input.ts", + "name": "exportedConstant", + "subtype": "variable", + "type": "string", + }, + ], + }, + "modules": Array [], + "pipes": Array [], + "routes": Array [], +} +`; diff --git a/examples/vue-kitchen-sink/src/stories/components/app.stories.js b/examples/vue-kitchen-sink/src/stories/components/app.stories.js index e58a19f78b0..8f957aa3591 100644 --- a/examples/vue-kitchen-sink/src/stories/components/app.stories.js +++ b/examples/vue-kitchen-sink/src/stories/components/app.stories.js @@ -11,4 +11,4 @@ export default { export const Default = () => ({ render: (h) => h(App), }); -// Default.storyName = 'App'; +Default.storyName = 'App'; diff --git a/lib/core-server/src/__snapshots__/cra-ts-essentials_manager-dev-posix b/lib/core-server/src/__snapshots__/cra-ts-essentials_manager-dev-posix index 33b3a2b90ae..51e1c74a02f 100644 --- a/lib/core-server/src/__snapshots__/cra-ts-essentials_manager-dev-posix +++ b/lib/core-server/src/__snapshots__/cra-ts-essentials_manager-dev-posix @@ -6,7 +6,7 @@ Object { "NODE_MODULES/@storybook/addon-ie11/dist/event-source-polyfill.js", "ROOT/lib/core-client/dist/esm/globals/polyfills.js", "ROOT/lib/core-client/dist/esm/manager/index.js", - "ROOT/addons/docs/dist/esm/register.js", + "ROOT/addons/docs/dist/esm/register", "ROOT/addons/controls/dist/esm/register.js", "ROOT/addons/actions/dist/esm/register.js", "ROOT/addons/backgrounds/dist/esm/register.js", diff --git a/lib/core-server/src/__snapshots__/cra-ts-essentials_manager-prod-posix b/lib/core-server/src/__snapshots__/cra-ts-essentials_manager-prod-posix index 6fbcb3d087a..28bb2d32108 100644 --- a/lib/core-server/src/__snapshots__/cra-ts-essentials_manager-prod-posix +++ b/lib/core-server/src/__snapshots__/cra-ts-essentials_manager-prod-posix @@ -6,7 +6,7 @@ Object { "NODE_MODULES/@storybook/addon-ie11/dist/event-source-polyfill.js", "ROOT/lib/core-client/dist/esm/globals/polyfills.js", "ROOT/lib/core-client/dist/esm/manager/index.js", - "ROOT/addons/docs/dist/esm/register.js", + "ROOT/addons/docs/dist/esm/register", "ROOT/addons/controls/dist/esm/register.js", "ROOT/addons/actions/dist/esm/register.js", "ROOT/addons/backgrounds/dist/esm/register.js", diff --git a/lib/core-server/src/__snapshots__/cra-ts-essentials_preview-dev-posix b/lib/core-server/src/__snapshots__/cra-ts-essentials_preview-dev-posix index 32009fdc209..c0f5cd0fede 100644 --- a/lib/core-server/src/__snapshots__/cra-ts-essentials_preview-dev-posix +++ b/lib/core-server/src/__snapshots__/cra-ts-essentials_preview-dev-posix @@ -8,8 +8,8 @@ Object { "NODE_MODULES/webpack-hot-middleware/client.js?reload=true&quiet=false&noInfo=undefined", "NODE_MODULES/@storybook/addon-ie11/dist/event-source-polyfill.js", "ROOT/storybook-init-framework-entry.js", - "ROOT/addons/docs/dist/esm/frameworks/common/config.js-generated-config-entry.js", - "ROOT/addons/docs/dist/esm/frameworks/react/config.js-generated-config-entry.js", + "ROOT/addons/docs/dist/esm/frameworks/common/config-generated-config-entry.js", + "ROOT/app/react/dist/esm/client/docs/config-generated-config-entry.js", "ROOT/app/react/dist/esm/client/preview/config-generated-config-entry.js", "ROOT/addons/actions/dist/esm/preset/addDecorator.js-generated-config-entry.js", "ROOT/addons/actions/dist/esm/preset/addArgs.js-generated-config-entry.js", @@ -86,7 +86,7 @@ Object { "babelrc": false, "cacheCompression": false, "cacheDirectory": true, - "cacheIdentifier": "development:babel-plugin-named-asset-import@0.3.8:babel-preset-react-app@10.0.1:react-dev-utils@11.0.4:react-scripts@4.0.3", + "cacheIdentifier": "development:babel-plugin-named-asset-import@:babel-preset-react-app@10.0.1:react-dev-utils@11.0.4:react-scripts@4.0.3", "compact": false, "configFile": false, "customize": "NODE_MODULES/babel-preset-react-app/webpack-overrides.js", @@ -147,7 +147,7 @@ Object { "babelrc": false, "cacheCompression": false, "cacheDirectory": true, - "cacheIdentifier": "development:babel-plugin-named-asset-import@0.3.8:babel-preset-react-app@10.0.1:react-dev-utils@11.0.4:react-scripts@4.0.3", + "cacheIdentifier": "development:babel-plugin-named-asset-import@:babel-preset-react-app@10.0.1:react-dev-utils@11.0.4:react-scripts@4.0.3", "compact": false, "configFile": false, "inputSourceMap": true, diff --git a/lib/core-server/src/__snapshots__/cra-ts-essentials_preview-prod-posix b/lib/core-server/src/__snapshots__/cra-ts-essentials_preview-prod-posix index 4f85422ed50..e6371f7c088 100644 --- a/lib/core-server/src/__snapshots__/cra-ts-essentials_preview-prod-posix +++ b/lib/core-server/src/__snapshots__/cra-ts-essentials_preview-prod-posix @@ -7,8 +7,8 @@ Object { "ROOT/lib/core-client/dist/esm/globals/globals.js", "NODE_MODULES/@storybook/addon-ie11/dist/event-source-polyfill.js", "ROOT/storybook-init-framework-entry.js", - "ROOT/addons/docs/dist/esm/frameworks/common/config.js-generated-config-entry.js", - "ROOT/addons/docs/dist/esm/frameworks/react/config.js-generated-config-entry.js", + "ROOT/addons/docs/dist/esm/frameworks/common/config-generated-config-entry.js", + "ROOT/app/react/dist/esm/client/docs/config-generated-config-entry.js", "ROOT/app/react/dist/esm/client/preview/config-generated-config-entry.js", "ROOT/addons/actions/dist/esm/preset/addDecorator.js-generated-config-entry.js", "ROOT/addons/actions/dist/esm/preset/addArgs.js-generated-config-entry.js", @@ -85,7 +85,7 @@ Object { "babelrc": false, "cacheCompression": false, "cacheDirectory": true, - "cacheIdentifier": "production:babel-plugin-named-asset-import@0.3.8:babel-preset-react-app@10.0.1:react-dev-utils@11.0.4:react-scripts@4.0.3", + "cacheIdentifier": "production:babel-plugin-named-asset-import@:babel-preset-react-app@10.0.1:react-dev-utils@11.0.4:react-scripts@4.0.3", "compact": true, "configFile": false, "customize": "NODE_MODULES/babel-preset-react-app/webpack-overrides.js", @@ -145,7 +145,7 @@ Object { "babelrc": false, "cacheCompression": false, "cacheDirectory": true, - "cacheIdentifier": "production:babel-plugin-named-asset-import@0.3.8:babel-preset-react-app@10.0.1:react-dev-utils@11.0.4:react-scripts@4.0.3", + "cacheIdentifier": "production:babel-plugin-named-asset-import@:babel-preset-react-app@10.0.1:react-dev-utils@11.0.4:react-scripts@4.0.3", "compact": false, "configFile": false, "inputSourceMap": true, diff --git a/lib/core-server/src/__snapshots__/html-kitchen-sink_manager-dev-posix b/lib/core-server/src/__snapshots__/html-kitchen-sink_manager-dev-posix index af9a49f22ed..b0b601e85c6 100644 --- a/lib/core-server/src/__snapshots__/html-kitchen-sink_manager-dev-posix +++ b/lib/core-server/src/__snapshots__/html-kitchen-sink_manager-dev-posix @@ -5,7 +5,7 @@ Object { "entry": Array [ "ROOT/lib/core-client/dist/esm/globals/polyfills.js", "ROOT/lib/core-client/dist/esm/manager/index.js", - "ROOT/addons/docs/dist/esm/register.js", + "ROOT/addons/docs/dist/esm/register", "ROOT/addons/a11y/dist/esm/register.js", "ROOT/addons/actions/dist/esm/register.js", "ROOT/addons/backgrounds/dist/esm/register.js", diff --git a/lib/core-server/src/__snapshots__/html-kitchen-sink_manager-prod-posix b/lib/core-server/src/__snapshots__/html-kitchen-sink_manager-prod-posix index 8f50e4fbc06..6b9d055e21b 100644 --- a/lib/core-server/src/__snapshots__/html-kitchen-sink_manager-prod-posix +++ b/lib/core-server/src/__snapshots__/html-kitchen-sink_manager-prod-posix @@ -5,7 +5,7 @@ Object { "entry": Array [ "ROOT/lib/core-client/dist/esm/globals/polyfills.js", "ROOT/lib/core-client/dist/esm/manager/index.js", - "ROOT/addons/docs/dist/esm/register.js", + "ROOT/addons/docs/dist/esm/register", "ROOT/addons/a11y/dist/esm/register.js", "ROOT/addons/actions/dist/esm/register.js", "ROOT/addons/backgrounds/dist/esm/register.js", diff --git a/lib/core-server/src/__snapshots__/html-kitchen-sink_preview-dev-posix b/lib/core-server/src/__snapshots__/html-kitchen-sink_preview-dev-posix index 8329a956d31..97d781a3de9 100644 --- a/lib/core-server/src/__snapshots__/html-kitchen-sink_preview-dev-posix +++ b/lib/core-server/src/__snapshots__/html-kitchen-sink_preview-dev-posix @@ -7,9 +7,9 @@ Object { "ROOT/lib/core-client/dist/esm/globals/globals.js", "NODE_MODULES/webpack-hot-middleware/client.js?reload=true&quiet=false&noInfo=undefined", "ROOT/storybook-init-framework-entry.js", - "ROOT/addons/docs/dist/esm/frameworks/common/config.js-generated-config-entry.js", - "ROOT/addons/docs/dist/esm/frameworks/html/config.js-generated-config-entry.js", + "ROOT/addons/docs/dist/esm/frameworks/common/config-generated-config-entry.js", "ROOT/app/html/dist/esm/client/preview/config-generated-config-entry.js", + "ROOT/app/html/dist/esm/client/docs/config-generated-config-entry.js", "ROOT/addons/a11y/dist/esm/a11yRunner.js-generated-config-entry.js", "ROOT/addons/a11y/dist/esm/a11yHighlight.js-generated-config-entry.js", "ROOT/addons/actions/dist/esm/preset/addDecorator.js-generated-config-entry.js", diff --git a/lib/core-server/src/__snapshots__/html-kitchen-sink_preview-prod-posix b/lib/core-server/src/__snapshots__/html-kitchen-sink_preview-prod-posix index fb86a9f3753..b70aaf53938 100644 --- a/lib/core-server/src/__snapshots__/html-kitchen-sink_preview-prod-posix +++ b/lib/core-server/src/__snapshots__/html-kitchen-sink_preview-prod-posix @@ -6,9 +6,9 @@ Object { "ROOT/lib/core-client/dist/esm/globals/polyfills.js", "ROOT/lib/core-client/dist/esm/globals/globals.js", "ROOT/storybook-init-framework-entry.js", - "ROOT/addons/docs/dist/esm/frameworks/common/config.js-generated-config-entry.js", - "ROOT/addons/docs/dist/esm/frameworks/html/config.js-generated-config-entry.js", + "ROOT/addons/docs/dist/esm/frameworks/common/config-generated-config-entry.js", "ROOT/app/html/dist/esm/client/preview/config-generated-config-entry.js", + "ROOT/app/html/dist/esm/client/docs/config-generated-config-entry.js", "ROOT/addons/a11y/dist/esm/a11yRunner.js-generated-config-entry.js", "ROOT/addons/a11y/dist/esm/a11yHighlight.js-generated-config-entry.js", "ROOT/addons/actions/dist/esm/preset/addDecorator.js-generated-config-entry.js", diff --git a/lib/core-server/src/__snapshots__/vue-3-cli_manager-dev-posix b/lib/core-server/src/__snapshots__/vue-3-cli_manager-dev-posix index ff3201dcc1b..891dad8796c 100644 --- a/lib/core-server/src/__snapshots__/vue-3-cli_manager-dev-posix +++ b/lib/core-server/src/__snapshots__/vue-3-cli_manager-dev-posix @@ -6,7 +6,7 @@ Object { "ROOT/lib/core-client/dist/esm/globals/polyfills.js", "ROOT/lib/core-client/dist/esm/manager/index.js", "ROOT/addons/links/dist/esm/register.js", - "ROOT/addons/docs/dist/esm/register.js", + "ROOT/addons/docs/dist/esm/register", "ROOT/addons/controls/dist/esm/register.js", "ROOT/addons/actions/dist/esm/register.js", "ROOT/addons/backgrounds/dist/esm/register.js", diff --git a/lib/core-server/src/__snapshots__/vue-3-cli_manager-prod-posix b/lib/core-server/src/__snapshots__/vue-3-cli_manager-prod-posix index d5cc7d3c6f2..99eb742814c 100644 --- a/lib/core-server/src/__snapshots__/vue-3-cli_manager-prod-posix +++ b/lib/core-server/src/__snapshots__/vue-3-cli_manager-prod-posix @@ -6,7 +6,7 @@ Object { "ROOT/lib/core-client/dist/esm/globals/polyfills.js", "ROOT/lib/core-client/dist/esm/manager/index.js", "ROOT/addons/links/dist/esm/register.js", - "ROOT/addons/docs/dist/esm/register.js", + "ROOT/addons/docs/dist/esm/register", "ROOT/addons/controls/dist/esm/register.js", "ROOT/addons/actions/dist/esm/register.js", "ROOT/addons/backgrounds/dist/esm/register.js", diff --git a/lib/core-server/src/__snapshots__/vue-3-cli_preview-dev-posix b/lib/core-server/src/__snapshots__/vue-3-cli_preview-dev-posix index c8f18c578b6..fe42332cf78 100644 --- a/lib/core-server/src/__snapshots__/vue-3-cli_preview-dev-posix +++ b/lib/core-server/src/__snapshots__/vue-3-cli_preview-dev-posix @@ -7,9 +7,9 @@ Object { "ROOT/lib/core-client/dist/esm/globals/globals.js", "NODE_MODULES/webpack-hot-middleware/client.js?reload=true&quiet=false&noInfo=undefined", "ROOT/storybook-init-framework-entry.js", - "ROOT/addons/docs/dist/esm/frameworks/common/config.js-generated-config-entry.js", - "ROOT/addons/docs/dist/esm/frameworks/vue3/config.js-generated-config-entry.js", + "ROOT/addons/docs/dist/esm/frameworks/common/config-generated-config-entry.js", "ROOT/app/vue3/dist/esm/client/preview/config-generated-config-entry.js", + "ROOT/app/vue3/dist/esm/client/docs/config-generated-config-entry.js", "ROOT/addons/links/dist/esm/preset/addDecorator.js-generated-config-entry.js", "ROOT/addons/actions/dist/esm/preset/addDecorator.js-generated-config-entry.js", "ROOT/addons/actions/dist/esm/preset/addArgs.js-generated-config-entry.js", diff --git a/lib/core-server/src/__snapshots__/vue-3-cli_preview-prod-posix b/lib/core-server/src/__snapshots__/vue-3-cli_preview-prod-posix index f5394fba46a..4792caed2d1 100644 --- a/lib/core-server/src/__snapshots__/vue-3-cli_preview-prod-posix +++ b/lib/core-server/src/__snapshots__/vue-3-cli_preview-prod-posix @@ -6,9 +6,9 @@ Object { "ROOT/lib/core-client/dist/esm/globals/polyfills.js", "ROOT/lib/core-client/dist/esm/globals/globals.js", "ROOT/storybook-init-framework-entry.js", - "ROOT/addons/docs/dist/esm/frameworks/common/config.js-generated-config-entry.js", - "ROOT/addons/docs/dist/esm/frameworks/vue3/config.js-generated-config-entry.js", + "ROOT/addons/docs/dist/esm/frameworks/common/config-generated-config-entry.js", "ROOT/app/vue3/dist/esm/client/preview/config-generated-config-entry.js", + "ROOT/app/vue3/dist/esm/client/docs/config-generated-config-entry.js", "ROOT/addons/links/dist/esm/preset/addDecorator.js-generated-config-entry.js", "ROOT/addons/actions/dist/esm/preset/addDecorator.js-generated-config-entry.js", "ROOT/addons/actions/dist/esm/preset/addArgs.js-generated-config-entry.js", diff --git a/lib/core-server/src/__snapshots__/web-components-kitchen-sink_manager-dev-posix b/lib/core-server/src/__snapshots__/web-components-kitchen-sink_manager-dev-posix index 1d69b08207f..1c0d32d308b 100644 --- a/lib/core-server/src/__snapshots__/web-components-kitchen-sink_manager-dev-posix +++ b/lib/core-server/src/__snapshots__/web-components-kitchen-sink_manager-dev-posix @@ -5,7 +5,7 @@ Object { "entry": Array [ "ROOT/lib/core-client/dist/esm/globals/polyfills.js", "ROOT/lib/core-client/dist/esm/manager/index.js", - "ROOT/addons/docs/dist/esm/register.js", + "ROOT/addons/docs/dist/esm/register", "ROOT/addons/controls/dist/esm/register.js", "ROOT/addons/a11y/dist/esm/register.js", "ROOT/addons/actions/dist/esm/register.js", diff --git a/lib/core-server/src/__snapshots__/web-components-kitchen-sink_manager-prod-posix b/lib/core-server/src/__snapshots__/web-components-kitchen-sink_manager-prod-posix index 23f5ae4c2e3..c090d10a586 100644 --- a/lib/core-server/src/__snapshots__/web-components-kitchen-sink_manager-prod-posix +++ b/lib/core-server/src/__snapshots__/web-components-kitchen-sink_manager-prod-posix @@ -5,7 +5,7 @@ Object { "entry": Array [ "ROOT/lib/core-client/dist/esm/globals/polyfills.js", "ROOT/lib/core-client/dist/esm/manager/index.js", - "ROOT/addons/docs/dist/esm/register.js", + "ROOT/addons/docs/dist/esm/register", "ROOT/addons/controls/dist/esm/register.js", "ROOT/addons/a11y/dist/esm/register.js", "ROOT/addons/actions/dist/esm/register.js", diff --git a/lib/core-server/src/__snapshots__/web-components-kitchen-sink_preview-dev-posix b/lib/core-server/src/__snapshots__/web-components-kitchen-sink_preview-dev-posix index 553b23c0d6f..c816a27405c 100644 --- a/lib/core-server/src/__snapshots__/web-components-kitchen-sink_preview-dev-posix +++ b/lib/core-server/src/__snapshots__/web-components-kitchen-sink_preview-dev-posix @@ -7,9 +7,9 @@ Object { "ROOT/lib/core-client/dist/esm/globals/globals.js", "NODE_MODULES/webpack-hot-middleware/client.js?reload=true&quiet=false&noInfo=undefined", "ROOT/storybook-init-framework-entry.js", - "ROOT/addons/docs/dist/esm/frameworks/common/config.js-generated-config-entry.js", - "ROOT/addons/docs/dist/esm/frameworks/web-components/config.js-generated-config-entry.js", + "ROOT/addons/docs/dist/esm/frameworks/common/config-generated-config-entry.js", "ROOT/app/web-components/dist/esm/client/preview/config-generated-config-entry.js", + "ROOT/app/web-components/dist/esm/client/docs/config-generated-config-entry.js", "ROOT/addons/a11y/dist/esm/a11yRunner.js-generated-config-entry.js", "ROOT/addons/a11y/dist/esm/a11yHighlight.js-generated-config-entry.js", "ROOT/addons/actions/dist/esm/preset/addDecorator.js-generated-config-entry.js", diff --git a/lib/core-server/src/__snapshots__/web-components-kitchen-sink_preview-prod-posix b/lib/core-server/src/__snapshots__/web-components-kitchen-sink_preview-prod-posix index 0118654b4c3..c7b0fb4ff3e 100644 --- a/lib/core-server/src/__snapshots__/web-components-kitchen-sink_preview-prod-posix +++ b/lib/core-server/src/__snapshots__/web-components-kitchen-sink_preview-prod-posix @@ -6,9 +6,9 @@ Object { "ROOT/lib/core-client/dist/esm/globals/polyfills.js", "ROOT/lib/core-client/dist/esm/globals/globals.js", "ROOT/storybook-init-framework-entry.js", - "ROOT/addons/docs/dist/esm/frameworks/common/config.js-generated-config-entry.js", - "ROOT/addons/docs/dist/esm/frameworks/web-components/config.js-generated-config-entry.js", + "ROOT/addons/docs/dist/esm/frameworks/common/config-generated-config-entry.js", "ROOT/app/web-components/dist/esm/client/preview/config-generated-config-entry.js", + "ROOT/app/web-components/dist/esm/client/docs/config-generated-config-entry.js", "ROOT/addons/a11y/dist/esm/a11yRunner.js-generated-config-entry.js", "ROOT/addons/a11y/dist/esm/a11yHighlight.js-generated-config-entry.js", "ROOT/addons/actions/dist/esm/preset/addDecorator.js-generated-config-entry.js", diff --git a/yarn.lock b/yarn.lock index bbc677dd26d..efcad8df3f9 100644 --- a/yarn.lock +++ b/yarn.lock @@ -6864,6 +6864,7 @@ __metadata: "@types/node": ^14.14.20 || ^16.0.0 "@types/react": ^16.14.23 "@types/react-dom": ^16.9.14 + "@types/tmp": ^0.2.3 "@types/webpack-env": ^1.16.0 autoprefixer: ^9.8.6 core-js: ^3.8.2 @@ -10322,6 +10323,13 @@ __metadata: languageName: node linkType: hard +"@types/tmp@npm:^0.2.3": + version: 0.2.3 + resolution: "@types/tmp@npm:0.2.3" + checksum: a9a32d723b483713ef537af31caddfcc2129ba21a0d56f5e4eef39508e07d415b1ec7327486d15b2cd4ac277deaaef0f8368ed1a0f4029e5ef5c393f9c15856b + languageName: node + linkType: hard + "@types/trusted-types@npm:^2.0.2": version: 2.0.2 resolution: "@types/trusted-types@npm:2.0.2" From 0b0164f44de33c3aba15fb6b17328bbd8c176934 Mon Sep 17 00:00:00 2001 From: Michael Shilman Date: Sun, 13 Mar 2022 18:29:16 +0800 Subject: [PATCH 15/17] Update yarn.lock --- examples/web-components-kitchen-sink/yarn.lock | 1 + 1 file changed, 1 insertion(+) diff --git a/examples/web-components-kitchen-sink/yarn.lock b/examples/web-components-kitchen-sink/yarn.lock index ed91380c35f..648b38a1cb1 100644 --- a/examples/web-components-kitchen-sink/yarn.lock +++ b/examples/web-components-kitchen-sink/yarn.lock @@ -2899,6 +2899,7 @@ __metadata: "@storybook/store": 6.5.0-alpha.47 core-js: ^3.8.2 doctrine: ^3.0.0 + lodash: ^4.17.21 regenerator-runtime: ^0.13.7 languageName: node linkType: soft From 24e4128942b53c90a2dec3cc408bfee51500ca6d Mon Sep 17 00:00:00 2001 From: Michael Shilman Date: Sun, 13 Mar 2022 20:55:25 +0800 Subject: [PATCH 16/17] Update addons/docs/src/frameworks/common/config.ts --- addons/docs/src/frameworks/common/config.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/addons/docs/src/frameworks/common/config.ts b/addons/docs/src/frameworks/common/config.ts index 10f3227e89d..20632390005 100644 --- a/addons/docs/src/frameworks/common/config.ts +++ b/addons/docs/src/frameworks/common/config.ts @@ -3,6 +3,6 @@ export const parameters = { inlineStories: false, getContainer: async () => (await import('../../blocks')).DocsContainer, getPage: async () => (await import('../../blocks')).DocsPage, - iframeHeight: 110, + iframeHeight: 100, }, }; From a84f75a75e257602a87afa503a6ca43206dd8a0e Mon Sep 17 00:00:00 2001 From: Michael Shilman Date: Sun, 13 Mar 2022 21:19:56 +0800 Subject: [PATCH 17/17] Vue: Clean up docs preset --- app/vue/src/client/docs/config.ts | 1 - app/vue/src/client/preview/docs/config.ts | 19 -- .../client/preview/docs/extractArgTypes.ts | 86 ------- .../client/preview/docs/prepareForInline.ts | 39 --- .../preview/docs/sourceDecorator.test.ts | 144 ----------- .../client/preview/docs/sourceDecorator.ts | 242 ------------------ 6 files changed, 531 deletions(-) delete mode 100644 app/vue/src/client/preview/docs/config.ts delete mode 100644 app/vue/src/client/preview/docs/extractArgTypes.ts delete mode 100644 app/vue/src/client/preview/docs/prepareForInline.ts delete mode 100644 app/vue/src/client/preview/docs/sourceDecorator.test.ts delete mode 100644 app/vue/src/client/preview/docs/sourceDecorator.ts diff --git a/app/vue/src/client/docs/config.ts b/app/vue/src/client/docs/config.ts index fe69d10e31d..537773e4dfb 100644 --- a/app/vue/src/client/docs/config.ts +++ b/app/vue/src/client/docs/config.ts @@ -4,7 +4,6 @@ import { prepareForInline } from './prepareForInline'; import { sourceDecorator } from './sourceDecorator'; export const parameters = { - foobar: 'baz', docs: { inlineStories: true, iframeHeight: 120, diff --git a/app/vue/src/client/preview/docs/config.ts b/app/vue/src/client/preview/docs/config.ts deleted file mode 100644 index 225bf3a0d25..00000000000 --- a/app/vue/src/client/preview/docs/config.ts +++ /dev/null @@ -1,19 +0,0 @@ -import { extractComponentDescription } from '@storybook/docs-tools'; -import { extractArgTypes } from './extractArgTypes'; -import { prepareForInline } from './prepareForInline'; -import { sourceDecorator } from './sourceDecorator'; - -console.log('hello2'); - -export const parameters = { - foobar: 'baz', - docs: { - inlineStories: true, - iframeHeight: 120, - prepareForInline, - extractArgTypes, - extractComponentDescription, - }, -}; - -export const decorators = [sourceDecorator]; diff --git a/app/vue/src/client/preview/docs/extractArgTypes.ts b/app/vue/src/client/preview/docs/extractArgTypes.ts deleted file mode 100644 index 92a9f113e9c..00000000000 --- a/app/vue/src/client/preview/docs/extractArgTypes.ts +++ /dev/null @@ -1,86 +0,0 @@ -import type { StrictArgTypes } from '@storybook/csf'; -import type { ArgTypesExtractor, DocgenInfo, PropDef } from '@storybook/docs-tools'; -import { hasDocgen, extractComponentProps, convert } from '@storybook/docs-tools'; - -const SECTIONS = ['props', 'events', 'slots', 'methods']; - -/** - * Check if "@values" tag is defined within docgenInfo. - * If true, then propDef is mutated. - */ -function isEnum(propDef: PropDef, docgenInfo: DocgenInfo): false | PropDef { - // cast as any, since "values" doesn't exist in DocgenInfo type - const { type, values } = docgenInfo as any; - const matched = Array.isArray(values) && values.length && type.name !== 'enum'; - - if (!matched) return false; - - const enumString = values.join(', '); - let { summary } = propDef.type; - summary = summary ? `${summary}: ${enumString}` : enumString; - - Object.assign(propDef.type, { - ...propDef.type, - name: 'enum', - value: values, - summary, - }); - return propDef; -} - -/** - * @returns {Array} result - * @returns {PropDef} result.def - propDef - * @returns {boolean} result.isChanged - flag whether propDef is mutated or not. - * this is needed to prevent sbType from performing convert(docgenInfo). - */ -function verifyPropDef(propDef: PropDef, docgenInfo: DocgenInfo): [PropDef, boolean] { - let def = propDef; - let isChanged = false; - - // another callback can be added here. - // callback is mutually exclusive from each other. - const callbacks = [isEnum]; - for (let i = 0, len = callbacks.length; i < len; i += 1) { - const matched = callbacks[i](propDef, docgenInfo); - if (matched) { - def = matched; - isChanged = true; - } - } - - return [def, isChanged]; -} - -export const extractArgTypes: ArgTypesExtractor = (component) => { - if (!hasDocgen(component)) { - return null; - } - const results: StrictArgTypes = {}; - SECTIONS.forEach((section) => { - const props = extractComponentProps(component, section); - props.forEach(({ propDef, docgenInfo, jsDocTags }) => { - const [result, isPropDefChanged] = verifyPropDef(propDef, docgenInfo); - const { name, type, description, defaultValue: defaultSummary, required } = result; - - let sbType; - if (isPropDefChanged) { - sbType = type; - } else { - sbType = section === 'props' ? convert(docgenInfo) : { name: 'void' }; - } - results[name] = { - name, - description, - type: { required, ...sbType }, - table: { - type, - jsDocTags, - defaultValue: defaultSummary, - category: section, - }, - }; - }); - }); - return results; -}; diff --git a/app/vue/src/client/preview/docs/prepareForInline.ts b/app/vue/src/client/preview/docs/prepareForInline.ts deleted file mode 100644 index 3696a6bb768..00000000000 --- a/app/vue/src/client/preview/docs/prepareForInline.ts +++ /dev/null @@ -1,39 +0,0 @@ -import React from 'react'; -import Vue from 'vue'; -import type { StoryContext, PartialStoryFn } from '@storybook/csf'; -import type { VueFramework } from '../types-6-0'; - -// Inspired by https://github.com/egoist/vue-to-react, -// modified to store args as props in the root store - -// FIXME get this from @storybook/vue -const COMPONENT = 'STORYBOOK_COMPONENT'; -const VALUES = 'STORYBOOK_VALUES'; - -export const prepareForInline = ( - storyFn: PartialStoryFn, - { args }: StoryContext -) => { - const component = storyFn(); - const el = React.useRef(null); - - // FIXME: This recreates the Vue instance every time, which should be optimized - React.useEffect(() => { - const root = new Vue({ - el: el.current, - data() { - return { - [COMPONENT]: component, - [VALUES]: args, - }; - }, - render(h) { - const children = this[COMPONENT] ? [h(this[COMPONENT])] : undefined; - return h('div', { attrs: { id: 'root' } }, children); - }, - }); - return () => root.$destroy(); - }); - - return React.createElement('div', null, React.createElement('div', { ref: el })); -}; diff --git a/app/vue/src/client/preview/docs/sourceDecorator.test.ts b/app/vue/src/client/preview/docs/sourceDecorator.test.ts deleted file mode 100644 index 54695c1ea84..00000000000 --- a/app/vue/src/client/preview/docs/sourceDecorator.test.ts +++ /dev/null @@ -1,144 +0,0 @@ -/* eslint no-underscore-dangle: ["error", { "allow": ["_vnode"] }] */ - -import { ComponentOptions } from 'vue'; -import Vue from 'vue/dist/vue'; -import { vnodeToString } from './sourceDecorator'; - -expect.addSnapshotSerializer({ - print: (val: any) => val, - test: (val) => typeof val === 'string', -}); - -const getVNode = (Component: ComponentOptions) => { - const vm = new Vue({ - render(h: (c: any) => unknown) { - return h(Component); - }, - }).$mount(); - - return vm.$children[0]._vnode; -}; - -describe('vnodeToString', () => { - it('basic', () => { - expect( - vnodeToString( - getVNode({ - template: ``, - }) - ) - ).toMatchInlineSnapshot(``); - }); - - it('static class', () => { - expect( - vnodeToString( - getVNode({ - template: ``, - }) - ) - ).toMatchInlineSnapshot(``); - }); - - it('string dynamic class', () => { - expect( - vnodeToString( - getVNode({ - template: ``, - }) - ) - ).toMatchInlineSnapshot(``); - }); - - it('non-string dynamic class', () => { - expect( - vnodeToString( - getVNode({ - template: ``, - }) - ) - ).toMatchInlineSnapshot(``); - }); - - it('array dynamic class', () => { - expect( - vnodeToString( - getVNode({ - template: ``, - }) - ) - ).toMatchInlineSnapshot(``); - }); - - it('object dynamic class', () => { - expect( - vnodeToString( - getVNode({ - template: ``, - }) - ) - ).toMatchInlineSnapshot(``); - }); - - it('merge dynamic and static classes', () => { - expect( - vnodeToString( - getVNode({ - template: ``, - }) - ) - ).toMatchInlineSnapshot(``); - }); - - it('attributes', () => { - const MyComponent: ComponentOptions = { - props: ['propA', 'propB', 'propC', 'propD', 'propE', 'propF', 'propG'], - template: '
', - }; - - expect( - vnodeToString( - getVNode({ - components: { MyComponent }, - data(): { props: Record } { - return { - props: { - propA: 'propA', - propB: 1, - propC: null, - propD: { - foo: 'bar', - }, - propE: true, - propF() { - const foo = 'bar'; - - return foo; - }, - propG: undefined, - }, - }; - }, - template: ``, - }) - ) - ).toMatchInlineSnapshot( - `` - ); - }); - - it('children', () => { - expect( - vnodeToString( - getVNode({ - template: ` -
-
- -
-
`, - }) - ) - ).toMatchInlineSnapshot(`
`); - }); -}); diff --git a/app/vue/src/client/preview/docs/sourceDecorator.ts b/app/vue/src/client/preview/docs/sourceDecorator.ts deleted file mode 100644 index 38eed0d20ff..00000000000 --- a/app/vue/src/client/preview/docs/sourceDecorator.ts +++ /dev/null @@ -1,242 +0,0 @@ -/* eslint no-underscore-dangle: ["error", { "allow": ["_vnode"] }] */ - -import type { StoryContext } from '@storybook/csf'; -import { addons } from '@storybook/addons'; -import { logger } from '@storybook/client-logger'; -import type Vue from 'vue'; - -import { SourceType, SNIPPET_RENDERED } from '@storybook/docs-tools'; -import type { VueFramework } from '../types-6-0'; - -export const skipSourceRender = (context: StoryContext) => { - const sourceParams = context?.parameters.docs?.source; - const isArgsStory = context?.parameters.__isArgsStory; - - // always render if the user forces it - if (sourceParams?.type === SourceType.DYNAMIC) { - return false; - } - - // never render if the user is forcing the block to render code, or - // if the user provides code, or if it's not an args story. - return !isArgsStory || sourceParams?.code || sourceParams?.type === SourceType.CODE; -}; - -export const sourceDecorator = (storyFn: any, context: StoryContext) => { - const story = storyFn(); - console.log({ story }); - - // See ../react/jsxDecorator.tsx - if (skipSourceRender(context)) { - return story; - } - - const channel = addons.getChannel(); - - const storyComponent = getStoryComponent(story.options.STORYBOOK_WRAPS); - - return { - components: { - Story: story, - }, - // We need to wait until the wrapper component to be mounted so Vue runtime - // struct VNode tree. We get `this._vnode == null` if switch to `created` - // lifecycle hook. - mounted() { - // Theoretically this does not happens but we need to check it. - if (!this._vnode) { - return; - } - - try { - const storyNode = lookupStoryInstance(this, storyComponent); - - const code = vnodeToString(storyNode._vnode); - - const emitFormattedTemplate = async () => { - const prettier = await import('prettier/standalone'); - const prettierHtml = await import('prettier/parser-html'); - - channel.emit( - SNIPPET_RENDERED, - (context || {}).id, - prettier.format(``, { - 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}`); - } - }, - template: '', - }; -}; - -export function vnodeToString(vnode: Vue.VNode): string { - const attrString = [ - ...(vnode.data?.slot ? ([['slot', vnode.data.slot]] as [string, any][]) : []), - ['class', stringifyClassAttribute(vnode)], - ...(vnode.componentOptions?.propsData ? Object.entries(vnode.componentOptions.propsData) : []), - ...(vnode.data?.attrs ? Object.entries(vnode.data.attrs) : []), - ] - .filter(([name], index, list) => list.findIndex((item) => item[0] === name) === index) - .map(([name, value]) => stringifyAttr(name, value)) - .filter(Boolean) - .join(' '); - - if (!vnode.componentOptions) { - // Non-component elements (div, span, etc...) - if (vnode.tag) { - if (!vnode.children) { - return `<${vnode.tag} ${attrString}/>`; - } - - return `<${vnode.tag} ${attrString}>${vnode.children.map(vnodeToString).join('')}`; - } - - // TextNode - if (vnode.text) { - if (/[<>"&]/.test(vnode.text)) { - return `{{\`${vnode.text.replace(/`/g, '\\`')}\`}}`; - } - - return vnode.text; - } - - // Unknown - return ''; - } - - // Probably users never see the "unknown-component". It seems that vnode.tag - // is always set. - const tag = vnode.componentOptions.tag || vnode.tag || 'unknown-component'; - - if (!vnode.componentOptions.children) { - return `<${tag} ${attrString}/>`; - } - - return `<${tag} ${attrString}>${vnode.componentOptions.children - .map(vnodeToString) - .join('')}`; -} - -function stringifyClassAttribute(vnode: Vue.VNode): string | undefined { - if (!vnode.data || (!vnode.data.staticClass && !vnode.data.class)) { - return undefined; - } - - return ( - [...(vnode.data.staticClass?.split(' ') ?? []), ...normalizeClassBinding(vnode.data.class)] - .filter(Boolean) - .join(' ') || undefined - ); -} - -// https://vuejs.org/v2/guide/class-and-style.html#Binding-HTML-Classes -function normalizeClassBinding(binding: unknown): readonly string[] { - if (!binding) { - return []; - } - - if (typeof binding === 'string') { - return [binding]; - } - - if (binding instanceof Array) { - // To handle an object-in-array binding smartly, we use recursion - return binding.map(normalizeClassBinding).reduce((a, b) => [...a, ...b], []); - } - - if (typeof binding === 'object') { - return Object.entries(binding) - .filter(([, active]) => !!active) - .map(([className]) => className); - } - - // Unknown class binding - return []; -} - -function stringifyAttr(attrName: string, value?: any): string | null { - if (typeof value === 'undefined' || typeof value === 'function') { - return null; - } - - if (value === true) { - return attrName; - } - - if (typeof value === 'string') { - return `${attrName}=${quote(value)}`; - } - - // TODO: Better serialization (unquoted object key, Symbol/Classes, etc...) - // Seems like Prettier don't format JSON-look object (= when keys are quoted) - return `:${attrName}=${quote(JSON.stringify(value))}`; -} - -function quote(value: string) { - return value.includes(`"`) && !value.includes(`'`) - ? `'${value}'` - : `"${value.replace(/"/g, '"')}"`; -} - -/** - * Skip decorators and grab a story component itself. - * https://github.com/pocka/storybook-addon-vue-info/pull/113 - */ -function getStoryComponent(w: any) { - let matched = w; - - while ( - matched && - matched.options && - matched.options.components && - matched.options.components.story && - matched.options.components.story.options && - matched.options.components.story.options.STORYBOOK_WRAPS - ) { - matched = matched.options.components.story.options.STORYBOOK_WRAPS; - } - return matched; -} - -interface VueInternal { - // We need to access this private property, in order to grab the vnode of the - // component instead of the "vnode of the parent of the component". - // Probably it's safe to rely on this because vm.$vnode is a reference for this. - // https://github.com/vuejs/vue/issues/6070#issuecomment-314389883 - _vnode: Vue.VNode; -} - -/** - * Find the story's instance from VNode tree. - */ -function lookupStoryInstance(instance: Vue, storyComponent: any): (Vue & VueInternal) | null { - if ( - instance.$vnode && - instance.$vnode.componentOptions && - instance.$vnode.componentOptions.Ctor === storyComponent - ) { - return instance as Vue & VueInternal; - } - - for (let i = 0, l = instance.$children.length; i < l; i += 1) { - const found = lookupStoryInstance(instance.$children[i], storyComponent); - - if (found) { - return found; - } - } - - return null; -}