From 55807913e98cd800f96d8d36a1f9ce2f0b24e004 Mon Sep 17 00:00:00 2001 From: Michael Shilman Date: Sat, 8 May 2021 14:54:45 +0800 Subject: [PATCH] Extract addon-queryparams from monorepo --- addons/queryparams/README.md | 66 --------------- addons/queryparams/package.json | 82 ------------------- addons/queryparams/preset.js | 9 -- addons/queryparams/src/constants.ts | 3 - addons/queryparams/src/index.ts | 31 ------- addons/queryparams/src/preset/addDecorator.ts | 3 - addons/queryparams/src/typings.d.ts | 1 - addons/queryparams/tsconfig.json | 18 ---- examples/official-storybook/main.ts | 1 - examples/official-storybook/package.json | 1 - lib/cli/src/versions.json | 1 - nx.json | 3 - package.json | 1 - workspace.json | 4 - yarn.lock | 29 ------- 15 files changed, 253 deletions(-) delete mode 100644 addons/queryparams/README.md delete mode 100644 addons/queryparams/package.json delete mode 100644 addons/queryparams/preset.js delete mode 100755 addons/queryparams/src/constants.ts delete mode 100644 addons/queryparams/src/index.ts delete mode 100644 addons/queryparams/src/preset/addDecorator.ts delete mode 100644 addons/queryparams/src/typings.d.ts delete mode 100644 addons/queryparams/tsconfig.json diff --git a/addons/queryparams/README.md b/addons/queryparams/README.md deleted file mode 100644 index 0befd0e5e69a..000000000000 --- a/addons/queryparams/README.md +++ /dev/null @@ -1,66 +0,0 @@ -# storybook-addon-queryparams - -This storybook addon can be helpful if your components need special query parameters to work the way you want them to. It allows you to mock query params per story so that you can easily reproduce different states of your component. - -## Getting started - -First, install the addon. - -```sh -$ yarn add @storybook/addon-queryparams --dev -``` - -Register it by adding it in the addons attribute in your `main.js` file (create this file inside your storybook config directory if needed). - -```js -module.exports = { - addons: ['@storybook/addon-queryparams'], -}; -``` - -In your story, add the `withQuery` decorator and define the query parameters you want to mock: - -```js -import React from 'react'; -import { Button } from '@storybook/react/demo'; -import { withQuery } from '@storybook/addon-queryparams'; - -export default { - title: 'Button', - component: Button, - decorators: [withQuery], - parameters: { - query: { - mock: 'Hello world!', - }, - }, -}; - -export const WithMockedSearch = () => { - const urlParams = new URLSearchParams(document.location.search); - const mockedParam = urlParams.get('mock'); - return
Mocked value: {mockedParam}
; -}; -``` - -
- Example with storiesOf API - -```js -import React from 'react'; -import { storiesOf } from '@storybook/react'; - -storiesOf('button', module) - .addParameters({ - query: { - mock: 'Hello World!', - }, - }) - .add('Prints the mocked parameter', () => { - const urlParams = new URLSearchParams(document.location.search); - const mockedParam = urlParams.get('mock'); - return
Mocked value: {mockedParam}
; - }); -``` - -
diff --git a/addons/queryparams/package.json b/addons/queryparams/package.json deleted file mode 100644 index f37b4943e862..000000000000 --- a/addons/queryparams/package.json +++ /dev/null @@ -1,82 +0,0 @@ -{ - "name": "@storybook/addon-queryparams", - "version": "6.3.0-alpha.21", - "description": "parameter addon for storybook", - "keywords": [ - "addon", - "query", - "storybook", - "data-state" - ], - "homepage": "https://github.com/storybookjs/storybook#readme", - "bugs": { - "url": "https://github.com/storybookjs/storybook/issues" - }, - "repository": { - "type": "git", - "url": "git+https://github.com/storybookjs/storybook.git", - "directory": "addons/addon-queryparams" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/storybook" - }, - "license": "MIT", - "main": "dist/cjs/index.js", - "module": "dist/esm/index.js", - "types": "dist/ts3.9/index.d.ts", - "typesVersions": { - "<3.8": { - "*": [ - "dist/ts3.4/*" - ] - } - }, - "files": [ - "dist/**/*", - "README.md", - "*.js", - "*.d.ts" - ], - "scripts": { - "prepare": "node ../../scripts/prepare.js" - }, - "dependencies": { - "@storybook/addons": "6.3.0-alpha.21", - "@storybook/api": "6.3.0-alpha.21", - "@storybook/client-logger": "6.3.0-alpha.21", - "@storybook/components": "6.3.0-alpha.21", - "@storybook/core-events": "6.3.0-alpha.21", - "@storybook/theming": "6.3.0-alpha.21", - "core-js": "^3.8.2", - "global": "^4.4.0", - "qs": "^6.10.0", - "regenerator-runtime": "^0.13.7", - "ts-dedent": "^2.0.0" - }, - "devDependencies": { - "@types/webpack-env": "^1.16.0" - }, - "peerDependencies": { - "react": "^16.8.0 || ^17.0.0", - "react-dom": "^16.8.0 || ^17.0.0" - }, - "peerDependenciesMeta": { - "react": { - "optional": true - }, - "react-dom": { - "optional": true - } - }, - "publishConfig": { - "access": "public" - }, - "gitHead": "c3ffd75d5ae104f678f2f0bea2042b017373aa4a", - "storybook": { - "displayName": "Query params", - "unsupportedFrameworks": [ - "react-native" - ] - } -} diff --git a/addons/queryparams/preset.js b/addons/queryparams/preset.js deleted file mode 100644 index c98b2907c03e..000000000000 --- a/addons/queryparams/preset.js +++ /dev/null @@ -1,9 +0,0 @@ -function config(entry = [], { addDecorator = true } = {}) { - const queryParamsConfig = []; - if (addDecorator) { - queryParamsConfig.push(require.resolve('./dist/esm/preset/addDecorator')); - } - return [...entry, ...queryParamsConfig]; -} - -module.exports = { config }; diff --git a/addons/queryparams/src/constants.ts b/addons/queryparams/src/constants.ts deleted file mode 100755 index d8fc643d74ba..000000000000 --- a/addons/queryparams/src/constants.ts +++ /dev/null @@ -1,3 +0,0 @@ -export const ADDON_ID = 'storybook/queryparams'; -export const PANEL_ID = `${ADDON_ID}/panel`; -export const PARAM_KEY = `query`; diff --git a/addons/queryparams/src/index.ts b/addons/queryparams/src/index.ts deleted file mode 100644 index 0070b840986b..000000000000 --- a/addons/queryparams/src/index.ts +++ /dev/null @@ -1,31 +0,0 @@ -import { document, history } from 'global'; -import qs from 'qs'; - -import { makeDecorator, StoryContext, StoryGetter } from '@storybook/addons'; - -import { PARAM_KEY } from './constants'; - -export const withQuery = makeDecorator({ - name: 'withQuery', - parameterName: PARAM_KEY, - skipIfNoParametersOrOptions: true, - wrapper: (getStory: StoryGetter, context: StoryContext, { parameters }) => { - const { location } = document; - const currentQuery = qs.parse(location.search, { ignoreQueryPrefix: true }); - const additionalQuery = - typeof parameters === 'string' - ? qs.parse(parameters, { ignoreQueryPrefix: true }) - : parameters; - - const newLocation = new URL(document.location.href); - newLocation.search = qs.stringify({ ...currentQuery, ...additionalQuery }); - - history.replaceState({}, document.title, newLocation.toString()); - - return getStory(context); - }, -}); - -if (module && module.hot && module.hot.decline) { - module.hot.decline(); -} diff --git a/addons/queryparams/src/preset/addDecorator.ts b/addons/queryparams/src/preset/addDecorator.ts deleted file mode 100644 index f04053309f79..000000000000 --- a/addons/queryparams/src/preset/addDecorator.ts +++ /dev/null @@ -1,3 +0,0 @@ -import { withQuery } from '../index'; - -export const decorators = [withQuery]; diff --git a/addons/queryparams/src/typings.d.ts b/addons/queryparams/src/typings.d.ts deleted file mode 100644 index 2f4eb9cf4fd9..000000000000 --- a/addons/queryparams/src/typings.d.ts +++ /dev/null @@ -1 +0,0 @@ -declare module 'global'; diff --git a/addons/queryparams/tsconfig.json b/addons/queryparams/tsconfig.json deleted file mode 100644 index d1ee4fc75941..000000000000 --- a/addons/queryparams/tsconfig.json +++ /dev/null @@ -1,18 +0,0 @@ -{ - "extends": "../../tsconfig.json", - "compilerOptions": { - "rootDir": "./src", - "types": ["webpack-env"] - }, - "include": [ - "src/**/*" - ], - "exclude": [ - "src/**/*.test.*", - "src/**/tests/**/*", - "src/**/__tests__/**/*", - "src/**/*.stories.*", - "src/**/*.mockdata.*", - "src/**/__testfixtures__/**" - ] -} diff --git a/examples/official-storybook/main.ts b/examples/official-storybook/main.ts index 3522ffe7dae3..452b071a0518 100644 --- a/examples/official-storybook/main.ts +++ b/examples/official-storybook/main.ts @@ -29,7 +29,6 @@ const config: StorybookConfig = { '@storybook/addon-a11y', '@storybook/addon-jest', '@storybook/addon-graphql', - '@storybook/addon-queryparams', ], core: { builder: 'webpack4', diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json index cdc55e4d4bc0..5f7418b3cc8f 100644 --- a/examples/official-storybook/package.json +++ b/examples/official-storybook/package.json @@ -27,7 +27,6 @@ "@storybook/addon-jest": "6.3.0-alpha.21", "@storybook/addon-knobs": "6.3.0-alpha.21", "@storybook/addon-links": "6.3.0-alpha.21", - "@storybook/addon-queryparams": "6.3.0-alpha.21", "@storybook/addon-storyshots": "6.3.0-alpha.21", "@storybook/addon-storyshots-puppeteer": "6.3.0-alpha.21", "@storybook/addon-storysource": "6.3.0-alpha.21", diff --git a/lib/cli/src/versions.json b/lib/cli/src/versions.json index 9d707beb0c1c..98eaf62df8c2 100644 --- a/lib/cli/src/versions.json +++ b/lib/cli/src/versions.json @@ -13,7 +13,6 @@ "@storybook/addon-jest": "6.3.0-alpha.21", "@storybook/addon-knobs": "6.3.0-alpha.21", "@storybook/addon-links": "6.3.0-alpha.21", - "@storybook/addon-queryparams": "6.3.0-alpha.21", "@storybook/addon-storyshots": "6.3.0-alpha.21", "@storybook/addon-storyshots-puppeteer": "6.3.0-alpha.21", "@storybook/addon-storysource": "6.3.0-alpha.21", diff --git a/nx.json b/nx.json index d259ff9dd781..a75ad528a53f 100644 --- a/nx.json +++ b/nx.json @@ -61,9 +61,6 @@ "@storybook/addon-links": { "implicitDependencies": [] }, - "@storybook/addon-queryparams": { - "implicitDependencies": [] - }, "@storybook/addon-storyshots": { "implicitDependencies": [] }, diff --git a/package.json b/package.json index 859a9c1b8e02..24f5ba0894a4 100644 --- a/package.json +++ b/package.json @@ -134,7 +134,6 @@ "@storybook/addon-jest": "workspace:*", "@storybook/addon-knobs": "workspace:*", "@storybook/addon-links": "workspace:*", - "@storybook/addon-queryparams": "workspace:*", "@storybook/addon-storyshots": "workspace:*", "@storybook/addon-storyshots-puppeteer": "workspace:*", "@storybook/addon-storysource": "workspace:*", diff --git a/workspace.json b/workspace.json index f54a9d9a03bc..369d9905af4c 100644 --- a/workspace.json +++ b/workspace.json @@ -57,10 +57,6 @@ "root": "addons/links", "type": "library" }, - "@storybook/addon-queryparams": { - "root": "addons/queryparams", - "type": "library" - }, "@storybook/addon-storyshots": { "root": "addons/storyshots/storyshots-core", "type": "library" diff --git a/yarn.lock b/yarn.lock index 155b9c4fd14b..9797eafd6d42 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5965,33 +5965,6 @@ __metadata: languageName: node linkType: hard -"@storybook/addon-queryparams@6.3.0-alpha.21, @storybook/addon-queryparams@workspace:*, @storybook/addon-queryparams@workspace:addons/queryparams": - version: 0.0.0-use.local - resolution: "@storybook/addon-queryparams@workspace:addons/queryparams" - dependencies: - "@storybook/addons": 6.3.0-alpha.21 - "@storybook/api": 6.3.0-alpha.21 - "@storybook/client-logger": 6.3.0-alpha.21 - "@storybook/components": 6.3.0-alpha.21 - "@storybook/core-events": 6.3.0-alpha.21 - "@storybook/theming": 6.3.0-alpha.21 - "@types/webpack-env": ^1.16.0 - core-js: ^3.8.2 - global: ^4.4.0 - qs: ^6.10.0 - regenerator-runtime: ^0.13.7 - ts-dedent: ^2.0.0 - peerDependencies: - react: ^16.8.0 || ^17.0.0 - react-dom: ^16.8.0 || ^17.0.0 - peerDependenciesMeta: - react: - optional: true - react-dom: - optional: true - languageName: unknown - linkType: soft - "@storybook/addon-storyshots-puppeteer@6.3.0-alpha.21, @storybook/addon-storyshots-puppeteer@workspace:*, @storybook/addon-storyshots-puppeteer@workspace:addons/storyshots/storyshots-puppeteer": version: 0.0.0-use.local resolution: "@storybook/addon-storyshots-puppeteer@workspace:addons/storyshots/storyshots-puppeteer" @@ -7195,7 +7168,6 @@ __metadata: "@storybook/addon-jest": "workspace:*" "@storybook/addon-knobs": "workspace:*" "@storybook/addon-links": "workspace:*" - "@storybook/addon-queryparams": "workspace:*" "@storybook/addon-storyshots": "workspace:*" "@storybook/addon-storyshots-puppeteer": "workspace:*" "@storybook/addon-storysource": "workspace:*" @@ -31403,7 +31375,6 @@ fsevents@^1.2.7: "@storybook/addon-jest": 6.3.0-alpha.21 "@storybook/addon-knobs": 6.3.0-alpha.21 "@storybook/addon-links": 6.3.0-alpha.21 - "@storybook/addon-queryparams": 6.3.0-alpha.21 "@storybook/addon-storyshots": 6.3.0-alpha.21 "@storybook/addon-storyshots-puppeteer": 6.3.0-alpha.21 "@storybook/addon-storysource": 6.3.0-alpha.21