diff --git a/addons/essentials/package.json b/addons/essentials/package.json index 88fdc7c266cb..d3783e1d6f93 100644 --- a/addons/essentials/package.json +++ b/addons/essentials/package.json @@ -43,6 +43,7 @@ "@storybook/addon-backgrounds": "6.3.0-beta.8", "@storybook/addon-controls": "6.3.0-beta.8", "@storybook/addon-docs": "6.3.0-beta.8", + "@storybook/addon-measure": "^1.1.0", "@storybook/addon-toolbars": "6.3.0-beta.8", "@storybook/addon-viewport": "6.3.0-beta.8", "@storybook/addons": "6.3.0-beta.8", @@ -50,6 +51,7 @@ "@storybook/node-logger": "6.3.0-beta.8", "core-js": "^3.8.2", "regenerator-runtime": "^0.13.7", + "storybook-addon-outline": "^1.3.2", "ts-dedent": "^2.0.0" }, "devDependencies": { diff --git a/addons/essentials/src/index.ts b/addons/essentials/src/index.ts index eb21585e1c7c..b281ec05be15 100644 --- a/addons/essentials/src/index.ts +++ b/addons/essentials/src/index.ts @@ -37,9 +37,9 @@ export function addons(options: PresetOptions = {}) { const main = requireMain(options.configDir); return ( - ['docs', 'controls', 'actions', 'backgrounds', 'viewport', 'toolbars'] + ['docs', 'controls', 'actions', 'backgrounds', 'viewport', 'toolbars', 'measure', 'outline'] .filter((key) => (options as any)[key] !== false) - .map((key) => `@storybook/addon-${key}`) + .map((key) => (key === 'outline' ? `storybook-addon-${key}` : `@storybook/addon-${key}`)) .filter((addon) => !checkInstalled(addon, main)) // Use `require.resolve` to ensure Yarn PnP compatibility // Files of various addons should be resolved in the context of `addon-essentials` as they are listed as deps here diff --git a/lib/components/src/Zoom/Zoom.stories.tsx b/lib/components/src/Zoom/Zoom.stories.tsx index d6a34819af65..1877a9e5e1da 100644 --- a/lib/components/src/Zoom/Zoom.stories.tsx +++ b/lib/components/src/Zoom/Zoom.stories.tsx @@ -85,6 +85,12 @@ iFrameActualSize.args = { active: true, }; +// The iFrame stories are disabled because useGlobals works in practice +// but, for some reason breaks in the stories for Zoom.iFrame +iFrameActualSize.parameters = { + chromatic: { disableSnapshot: true }, +}; + export const iFrameZoomedIn = TemplateIFrame.bind({}); iFrameZoomedIn.args = { @@ -92,9 +98,17 @@ iFrameZoomedIn.args = { active: true, }; +iFrameZoomedIn.parameters = { + chromatic: { disableSnapshot: true }, +}; + export const iFrameZoomedOut = TemplateIFrame.bind({}); iFrameZoomedOut.args = { scale: 3, active: true, }; + +iFrameZoomedOut.parameters = { + chromatic: { disableSnapshot: true }, +}; diff --git a/lib/core-server/src/__snapshots__/cra-ts-essentials_manager-dev b/lib/core-server/src/__snapshots__/cra-ts-essentials_manager-dev index 83370ad33924..ea57edea43d4 100644 --- a/lib/core-server/src/__snapshots__/cra-ts-essentials_manager-dev +++ b/lib/core-server/src/__snapshots__/cra-ts-essentials_manager-dev @@ -10,6 +10,8 @@ Object { "ROOT/addons/actions/dist/esm/register.js", "ROOT/addons/backgrounds/dist/esm/register.js", "ROOT/addons/toolbars/dist/esm/register.js", + "NODE_MODULES/@storybook/addon-measure/dist/preset/manager.js", + "NODE_MODULES/storybook-addon-outline/dist/preset/register.js", "ROOT/examples/cra-ts-essentials/.storybook/generated-refs.js", ], "keys": Array [ diff --git a/lib/core-server/src/__snapshots__/cra-ts-essentials_manager-prod b/lib/core-server/src/__snapshots__/cra-ts-essentials_manager-prod index 0212b0967543..fb56b8e23196 100644 --- a/lib/core-server/src/__snapshots__/cra-ts-essentials_manager-prod +++ b/lib/core-server/src/__snapshots__/cra-ts-essentials_manager-prod @@ -10,6 +10,8 @@ Object { "ROOT/addons/actions/dist/esm/register.js", "ROOT/addons/backgrounds/dist/esm/register.js", "ROOT/addons/toolbars/dist/esm/register.js", + "NODE_MODULES/@storybook/addon-measure/dist/preset/manager.js", + "NODE_MODULES/storybook-addon-outline/dist/preset/register.js", "ROOT/examples/cra-ts-essentials/.storybook/generated-refs.js", ], "keys": Array [ diff --git a/lib/core-server/src/__snapshots__/cra-ts-essentials_preview-dev b/lib/core-server/src/__snapshots__/cra-ts-essentials_preview-dev index 87985b9ad2eb..a7e3815cca0c 100644 --- a/lib/core-server/src/__snapshots__/cra-ts-essentials_preview-dev +++ b/lib/core-server/src/__snapshots__/cra-ts-essentials_preview-dev @@ -12,6 +12,8 @@ Object { "ROOT/addons/actions/dist/esm/preset/addArgs.js-generated-other-entry.js", "ROOT/addons/backgrounds/dist/esm/preset/addDecorator.js-generated-other-entry.js", "ROOT/addons/backgrounds/dist/esm/preset/addParameter.js-generated-other-entry.js", + "NODE_MODULES/@storybook/addon-measure/dist/preset/preview.js-generated-other-entry.js", + "NODE_MODULES/storybook-addon-outline/dist/preset/addDecorator.js-generated-other-entry.js", "ROOT/examples/cra-ts-essentials/.storybook/preview.js-generated-config-entry.js", "ROOT/examples/cra-ts-essentials/.storybook/generated-stories-entry.js", "NODE_MODULES/webpack-hot-middleware/client.js?reload=true&quiet=false&noInfo=undefined", diff --git a/lib/core-server/src/__snapshots__/cra-ts-essentials_preview-prod b/lib/core-server/src/__snapshots__/cra-ts-essentials_preview-prod index 5a53237ccf02..04152dfda9ae 100644 --- a/lib/core-server/src/__snapshots__/cra-ts-essentials_preview-prod +++ b/lib/core-server/src/__snapshots__/cra-ts-essentials_preview-prod @@ -12,6 +12,8 @@ Object { "ROOT/addons/actions/dist/esm/preset/addArgs.js-generated-other-entry.js", "ROOT/addons/backgrounds/dist/esm/preset/addDecorator.js-generated-other-entry.js", "ROOT/addons/backgrounds/dist/esm/preset/addParameter.js-generated-other-entry.js", + "NODE_MODULES/@storybook/addon-measure/dist/preset/preview.js-generated-other-entry.js", + "NODE_MODULES/storybook-addon-outline/dist/preset/addDecorator.js-generated-other-entry.js", "ROOT/examples/cra-ts-essentials/.storybook/preview.js-generated-config-entry.js", "ROOT/examples/cra-ts-essentials/.storybook/generated-stories-entry.js", ], diff --git a/lib/core-server/src/__snapshots__/vue-3-cli_manager-dev b/lib/core-server/src/__snapshots__/vue-3-cli_manager-dev index 03a3d689a6ea..c913a3320c12 100644 --- a/lib/core-server/src/__snapshots__/vue-3-cli_manager-dev +++ b/lib/core-server/src/__snapshots__/vue-3-cli_manager-dev @@ -12,6 +12,8 @@ Object { "ROOT/addons/backgrounds/dist/esm/register.js", "ROOT/addons/viewport/dist/esm/register.js", "ROOT/addons/toolbars/dist/esm/register.js", + "NODE_MODULES/@storybook/addon-measure/dist/preset/manager.js", + "NODE_MODULES/storybook-addon-outline/dist/preset/register.js", "ROOT/examples/vue-3-cli/.storybook/generated-refs.js", ], "keys": Array [ diff --git a/lib/core-server/src/__snapshots__/vue-3-cli_manager-prod b/lib/core-server/src/__snapshots__/vue-3-cli_manager-prod index 5b2c5afa9c6f..85073a7b973a 100644 --- a/lib/core-server/src/__snapshots__/vue-3-cli_manager-prod +++ b/lib/core-server/src/__snapshots__/vue-3-cli_manager-prod @@ -12,6 +12,8 @@ Object { "ROOT/addons/backgrounds/dist/esm/register.js", "ROOT/addons/viewport/dist/esm/register.js", "ROOT/addons/toolbars/dist/esm/register.js", + "NODE_MODULES/@storybook/addon-measure/dist/preset/manager.js", + "NODE_MODULES/storybook-addon-outline/dist/preset/register.js", "ROOT/examples/vue-3-cli/.storybook/generated-refs.js", ], "keys": Array [ diff --git a/lib/core-server/src/__snapshots__/vue-3-cli_preview-dev b/lib/core-server/src/__snapshots__/vue-3-cli_preview-dev index 430b678a3eb1..1f591eda5dca 100644 --- a/lib/core-server/src/__snapshots__/vue-3-cli_preview-dev +++ b/lib/core-server/src/__snapshots__/vue-3-cli_preview-dev @@ -13,6 +13,8 @@ Object { "ROOT/addons/actions/dist/esm/preset/addArgs.js-generated-other-entry.js", "ROOT/addons/backgrounds/dist/esm/preset/addDecorator.js-generated-other-entry.js", "ROOT/addons/backgrounds/dist/esm/preset/addParameter.js-generated-other-entry.js", + "NODE_MODULES/@storybook/addon-measure/dist/preset/preview.js-generated-other-entry.js", + "NODE_MODULES/storybook-addon-outline/dist/preset/addDecorator.js-generated-other-entry.js", "ROOT/examples/vue-3-cli/.storybook/preview.ts-generated-config-entry.js", "ROOT/examples/vue-3-cli/.storybook/generated-stories-entry.js", "NODE_MODULES/webpack-hot-middleware/client.js?reload=true&quiet=false&noInfo=undefined", diff --git a/lib/core-server/src/__snapshots__/vue-3-cli_preview-prod b/lib/core-server/src/__snapshots__/vue-3-cli_preview-prod index 0f003c430c31..933ce531b676 100644 --- a/lib/core-server/src/__snapshots__/vue-3-cli_preview-prod +++ b/lib/core-server/src/__snapshots__/vue-3-cli_preview-prod @@ -13,6 +13,8 @@ Object { "ROOT/addons/actions/dist/esm/preset/addArgs.js-generated-other-entry.js", "ROOT/addons/backgrounds/dist/esm/preset/addDecorator.js-generated-other-entry.js", "ROOT/addons/backgrounds/dist/esm/preset/addParameter.js-generated-other-entry.js", + "NODE_MODULES/@storybook/addon-measure/dist/preset/preview.js-generated-other-entry.js", + "NODE_MODULES/storybook-addon-outline/dist/preset/addDecorator.js-generated-other-entry.js", "ROOT/examples/vue-3-cli/.storybook/preview.ts-generated-config-entry.js", "ROOT/examples/vue-3-cli/.storybook/generated-stories-entry.js", ], diff --git a/scripts/verdaccio.yaml b/scripts/verdaccio.yaml index 6beeb4654648..995aa3734305 100644 --- a/scripts/verdaccio.yaml +++ b/scripts/verdaccio.yaml @@ -59,6 +59,10 @@ packages: access: $all publish: $all proxy: npmjs + '@storybook/addon-measure': + access: $all + publish: $all + proxy: npmjs # storybook packages are NOT proxied to global registry # allowing us to republish any version during tests diff --git a/yarn.lock b/yarn.lock index a7111d3c4d88..bad1c2a65dd7 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5807,6 +5807,7 @@ __metadata: "@storybook/addon-backgrounds": 6.3.0-beta.8 "@storybook/addon-controls": 6.3.0-beta.8 "@storybook/addon-docs": 6.3.0-beta.8 + "@storybook/addon-measure": ^1.1.0 "@storybook/addon-toolbars": 6.3.0-beta.8 "@storybook/addon-viewport": 6.3.0-beta.8 "@storybook/addons": 6.3.0-beta.8 @@ -5817,6 +5818,7 @@ __metadata: "@types/webpack-env": ^1.16.0 core-js: ^3.8.2 regenerator-runtime: ^0.13.7 + storybook-addon-outline: ^1.3.2 ts-dedent: ^2.0.0 peerDependencies: "@babel/core": ^7.9.6 @@ -5897,6 +5899,26 @@ __metadata: languageName: unknown linkType: soft +"@storybook/addon-measure@npm:^1.1.0": + version: 1.1.0 + resolution: "@storybook/addon-measure@npm:1.1.0" + peerDependencies: + "@storybook/addons": ^6.3.0-beta.1 + "@storybook/api": ^6.3.0-beta.1 + "@storybook/components": ^6.3.0-beta.1 + "@storybook/core-events": ^6.3.0-beta.1 + "@storybook/theming": ^6.3.0-beta.1 + react: ^16.8.0 || ^17.0.0 + react-dom: ^16.8.0 || ^17.0.0 + peerDependenciesMeta: + react: + optional: true + react-dom: + optional: true + checksum: 33441086c7870b58fe718e3084b7fd7ff194938c243ac156a132eb7ee6e66b0e03d3556ab061b47fcc28ffdc134428502f9aeb67c615075f0869f34ae773a366 + languageName: node + linkType: hard + "@storybook/addon-postcss@npm:^2.0.0": version: 2.0.0 resolution: "@storybook/addon-postcss@npm:2.0.0" @@ -6096,7 +6118,7 @@ __metadata: languageName: unknown linkType: soft -"@storybook/addons@6.3.0-beta.8, @storybook/addons@workspace:*, @storybook/addons@workspace:lib/addons": +"@storybook/addons@6.3.0-beta.8, @storybook/addons@^6.3.0-beta.6, @storybook/addons@workspace:*, @storybook/addons@workspace:lib/addons": version: 0.0.0-use.local resolution: "@storybook/addons@workspace:lib/addons" dependencies: @@ -6193,7 +6215,7 @@ __metadata: languageName: unknown linkType: soft -"@storybook/api@6.3.0-beta.8, @storybook/api@workspace:*, @storybook/api@workspace:lib/api": +"@storybook/api@6.3.0-beta.8, @storybook/api@^6.3.0-beta.6, @storybook/api@workspace:*, @storybook/api@workspace:lib/api": version: 0.0.0-use.local resolution: "@storybook/api@workspace:lib/api" dependencies: @@ -6530,7 +6552,7 @@ __metadata: languageName: unknown linkType: soft -"@storybook/components@6.3.0-beta.8, @storybook/components@workspace:*, @storybook/components@workspace:lib/components": +"@storybook/components@6.3.0-beta.8, @storybook/components@^6.3.0-beta.6, @storybook/components@workspace:*, @storybook/components@workspace:lib/components": version: 0.0.0-use.local resolution: "@storybook/components@workspace:lib/components" dependencies: @@ -6662,7 +6684,7 @@ __metadata: languageName: unknown linkType: soft -"@storybook/core-events@6.3.0-beta.8, @storybook/core-events@workspace:*, @storybook/core-events@workspace:lib/core-events": +"@storybook/core-events@6.3.0-beta.8, @storybook/core-events@^6.3.0-beta.6, @storybook/core-events@workspace:*, @storybook/core-events@workspace:lib/core-events": version: 0.0.0-use.local resolution: "@storybook/core-events@workspace:lib/core-events" dependencies: @@ -39037,6 +39059,22 @@ resolve@1.19.0: languageName: node linkType: hard +"storybook-addon-outline@npm:^1.3.2": + version: 1.3.2 + resolution: "storybook-addon-outline@npm:1.3.2" + dependencies: + "@storybook/addons": ^6.3.0-beta.6 + "@storybook/api": ^6.3.0-beta.6 + "@storybook/components": ^6.3.0-beta.6 + "@storybook/core-events": ^6.3.0-beta.6 + ts-dedent: ^2.1.1 + peerDependencies: + react: ^16.8.0 || ^17.0.0 + react-dom: ^16.8.0 || ^17.0.0 + checksum: 75586ff5093ab904ad1d5d98b0934d009192ebb02db4ae986f40f50e4b72e0ce131afa46932d68dca6e9849a13e7355cb7745b19dc60e5b9624a696eb8b611aa + languageName: node + linkType: hard + "storybook@workspace:lib/cli-storybook": version: 0.0.0-use.local resolution: "storybook@workspace:lib/cli-storybook" @@ -40977,6 +41015,13 @@ resolve@1.19.0: languageName: node linkType: hard +"ts-dedent@npm:^2.1.1": + version: 2.1.1 + resolution: "ts-dedent@npm:2.1.1" + checksum: 7ac68dbc2e864db6e3f0500a8b6af5bf775020bfe09816cf647469e06acdcb76d2a24b1b0211614c3c44e0978aa081a51a3dde6b8f211a68f945cbc177f7f9c2 + languageName: node + linkType: hard + "ts-essentials@npm:^2.0.3": version: 2.0.12 resolution: "ts-essentials@npm:2.0.12"