diff --git a/.circleci/config.yml b/.circleci/config.yml index 20a2e64737b0..0ba0d0d3d638 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -125,7 +125,7 @@ jobs: executor: class: medium+ name: sb_node_14_browsers - parallelism: 7 + parallelism: 6 steps: - git-shallow-clone/checkout_advanced: clone_options: '--depth 1 --verbose' diff --git a/.vscode/launch.json b/.vscode/launch.json index 0fcff3c6e02e..3b2c18a27cd6 100644 --- a/.vscode/launch.json +++ b/.vscode/launch.json @@ -3,36 +3,23 @@ // Hover to view descriptions of existing attributes. // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 "version": "0.2.0", - "configurations": [{ - "type": "node", - "request": "launch", - "name": "official-storybook", - "runtimeExecutable": "npm", - "cwd": "${workspaceFolder}/code/examples/official-storybook", - "runtimeArgs": [ - "run-script", - "debug" - ], - "port": 9229, - "skipFiles": [ - "/**" - ] - }, { - "type": "node", - "request": "launch", - "name": "cli html", - "cwd": "${workspaceFolder}/code/lib/cli/stories", - "runtimeArgs": [ - "--inspect-brk", - "${workspaceFolder}/code/lib/cli/bin/index.js", - "init", - "--type", - "html" - ], - "port": 9229, - "skipFiles": [ - "/**" - ] - } + "configurations": [ + { + "type": "node", + "request": "launch", + "name": "cli html", + "cwd": "${workspaceFolder}/code/lib/cli/stories", + "runtimeArgs": [ + "--inspect-brk", + "${workspaceFolder}/code/lib/cli/bin/index.js", + "init", + "--type", + "html" + ], + "port": 9229, + "skipFiles": [ + "/**" + ] + } ] -} +} \ No newline at end of file diff --git a/README.md b/README.md index 8684d6747bc9..8df5d2c674b2 100644 --- a/README.md +++ b/README.md @@ -90,17 +90,18 @@ For additional help, join us in the [Storybook Discord](https://discord.gg/story | Renderer | Demo | | |----------------------------------------------------------------|--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|---------------------------------------------------------------------------------------------------------------------------------------------------| -| [React](code/renderers/react) | [![Storybook demo](https://img.shields.io/npm/v/@storybook/react/latest?style=flat-square&color=blue&label)](https://storybookjs.netlify.com/official-storybook/?path=/story/*) | [![React](https://img.shields.io/npm/dm/@storybook/react?style=flat-square&color=eee)](code/renderers/react) | -| [Vue](code/renderers/vue) | [![Storybook demo](https://img.shields.io/npm/v/@storybook/vue/latest?style=flat-square&color=blue&label)](https://storybookjs.netlify.com/vue-kitchen-sink/) | [![Vue](https://img.shields.io/npm/dm/@storybook/vue?style=flat-square&color=eee)](code/renderers/vue) | -| [Angular](code/frameworks/angular/) | [![Storybook demo](https://img.shields.io/npm/v/@storybook/angular/latest?style=flat-square&color=blue&label)](https://storybookjs.netlify.com/angular-cli/) | [![Angular](https://img.shields.io/npm/dm/@storybook/angular?style=flat-square&color=eee)](code/frameworks/angular/) | -| [Web components](code/renderers/web-components) | [![Storybook demo](https://img.shields.io/npm/v/@storybook/web-components/latest?style=flat-square&color=blue&label)](https://storybookjs.netlify.com/web-components-kitchen-sink/) | [![Svelte](https://img.shields.io/npm/dm/@storybook/web-components?style=flat-square&color=eee)](code/renderers/web-components) | -| [React Native](https://github.com/storybookjs/react-native) | - | [![React Native](https://img.shields.io/npm/dm/@storybook/react-native?style=flat-square&color=eee)](https://github.com/storybookjs/react-native) | -| [HTML](code/renderers/html) | [![Storybook demo](https://img.shields.io/npm/v/@storybook/html/latest?style=flat-square&color=blue&label)](https://storybookjs.netlify.com/html-kitchen-sink/) | [![HTML](https://img.shields.io/npm/dm/@storybook/html?style=flat-square&color=eee)](code/renderers/html) | -| [Ember](code/frameworks/ember/) | [![Storybook demo](https://img.shields.io/npm/v/@storybook/ember/latest?style=flat-square&color=blue&label)](https://storybookjs.netlify.com/ember-cli/) | [![Ember](https://img.shields.io/npm/dm/@storybook/ember?style=flat-square&color=eee)](code/frameworks/ember/) | -| [Svelte](code/renderers/svelte) | [![Storybook demo](https://img.shields.io/npm/v/@storybook/svelte/latest?style=flat-square&color=blue&label)](https://storybookjs.netlify.com/svelte-kitchen-sink/) | [![Svelte](https://img.shields.io/npm/dm/@storybook/svelte?style=flat-square&color=eee)](code/renderers/svelte) | -| [Preact](code/renderers/preact) | [![Storybook demo](https://img.shields.io/npm/v/@storybook/preact/latest?style=flat-square&color=blue&label)](https://storybookjs.netlify.com/preact-kitchen-sink/) | [![Preact](https://img.shields.io/npm/dm/@storybook/preact?style=flat-square&color=eee)](code/renderers/preact) | -| [Marionette.js](https://github.com/storybookjs/marionette) | - | [![Marionette.js](https://img.shields.io/npm/dm/@storybook/marionette?style=flat-square&color=eee)](https://github.com/storybookjs/marionette) | -| [Android, iOS, Flutter](https://github.com/storybookjs/native) | [![Storybook demo](https://img.shields.io/npm/v/@storybook/native/latest?style=flat-square&color=blue&label)](https://storybookjs.github.io/native/@storybook/native-flutter-example/index.html) | [![Native](https://img.shields.io/npm/dm/@storybook/native?style=flat-square&color=eee)](https://github.com/storybookjs/native) | +| ? | TODO, the link below will break | [![React](https://img.shields.io/npm/dm/@storybook/react?style=flat-square&color=eee)](code/renderers/react) | +| [React](code/renderers/react) | [![Storybook demo](https://img.shields.io/npm/v/@storybook/react/latest?style=flat-square&color=blue&label)](https://storybookjs.netlify.com/official-storybook/?path=/story/*) | [![React](https://img.shields.io/npm/dm/@storybook/react?style=flat-square&color=eee)](code/renderers/react) | +| [Vue](code/renderers/vue) | [![Storybook demo](https://img.shields.io/npm/v/@storybook/vue/latest?style=flat-square&color=blue&label)](https://storybookjs.netlify.com/vue-kitchen-sink/) | [![Vue](https://img.shields.io/npm/dm/@storybook/vue?style=flat-square&color=eee)](code/renderers/vue) | +| [Angular](code/frameworks/angular/) | [![Storybook demo](https://img.shields.io/npm/v/@storybook/angular/latest?style=flat-square&color=blue&label)](https://storybookjs.netlify.com/angular-cli/) | [![Angular](https://img.shields.io/npm/dm/@storybook/angular?style=flat-square&color=eee)](code/frameworks/angular/) | +| [Web components](code/renderers/web-components) | [![Storybook demo](https://img.shields.io/npm/v/@storybook/web-components/latest?style=flat-square&color=blue&label)](https://storybookjs.netlify.com/web-components-kitchen-sink/) | [![Svelte](https://img.shields.io/npm/dm/@storybook/web-components?style=flat-square&color=eee)](code/renderers/web-components) | +| [React Native](https://github.com/storybookjs/react-native) | - | [![React Native](https://img.shields.io/npm/dm/@storybook/react-native?style=flat-square&color=eee)](https://github.com/storybookjs/react-native) | +| [HTML](code/renderers/html) | [![Storybook demo](https://img.shields.io/npm/v/@storybook/html/latest?style=flat-square&color=blue&label)](https://storybookjs.netlify.com/html-kitchen-sink/) | [![HTML](https://img.shields.io/npm/dm/@storybook/html?style=flat-square&color=eee)](code/renderers/html) | +| [Ember](code/frameworks/ember/) | [![Storybook demo](https://img.shields.io/npm/v/@storybook/ember/latest?style=flat-square&color=blue&label)](https://storybookjs.netlify.com/ember-cli/) | [![Ember](https://img.shields.io/npm/dm/@storybook/ember?style=flat-square&color=eee)](code/frameworks/ember/) | +| [Svelte](code/renderers/svelte) | [![Storybook demo](https://img.shields.io/npm/v/@storybook/svelte/latest?style=flat-square&color=blue&label)](https://storybookjs.netlify.com/svelte-kitchen-sink/) | [![Svelte](https://img.shields.io/npm/dm/@storybook/svelte?style=flat-square&color=eee)](code/renderers/svelte) | +| [Preact](code/renderers/preact) | [![Storybook demo](https://img.shields.io/npm/v/@storybook/preact/latest?style=flat-square&color=blue&label)](https://storybookjs.netlify.com/preact-kitchen-sink/) | [![Preact](https://img.shields.io/npm/dm/@storybook/preact?style=flat-square&color=eee)](code/renderers/preact) | +| [Marionette.js](https://github.com/storybookjs/marionette) | - | [![Marionette.js](https://img.shields.io/npm/dm/@storybook/marionette?style=flat-square&color=eee)](https://github.com/storybookjs/marionette) | +| [Android, iOS, Flutter](https://github.com/storybookjs/native) | [![Storybook demo](https://img.shields.io/npm/v/@storybook/native/latest?style=flat-square&color=blue&label)](https://storybookjs.github.io/native/@storybook/native-flutter-example/index.html) | [![Native](https://img.shields.io/npm/dm/@storybook/native?style=flat-square&color=eee)](https://github.com/storybookjs/native) | ### Sub Projects diff --git a/code/addons/docs/docs/docspage.md b/code/addons/docs/docs/docspage.md index 7b62abace14e..e59c6144a612 100644 --- a/code/addons/docs/docs/docspage.md +++ b/code/addons/docs/docs/docspage.md @@ -145,7 +145,7 @@ export default { }; ``` -You can interleave your own components to customize the auto-generated contents of the page, or pass in different options to the blocks to customize their appearance. For more info see the examples in [official-storybook](https://github.com/storybookjs/storybook/blob/next/code/examples/official-storybook/stories/addon-docs/addon-docs-blocks.stories.js). +You can interleave your own components to customize the auto-generated contents of the page, or pass in different options to the blocks to customize their appearance. ## Story file names diff --git a/code/addons/docs/src/typings.d.ts b/code/addons/docs/src/typings.d.ts index 711442922516..94baba6cf528 100644 --- a/code/addons/docs/src/typings.d.ts +++ b/code/addons/docs/src/typings.d.ts @@ -4,7 +4,6 @@ declare module '@egoist/vue-to-react'; declare module 'remark-slug'; declare module 'remark-external-links'; declare module 'babel-plugin-react-docgen'; -declare module 'styled-components'; declare module 'acorn-jsx'; declare module 'vue/dist/vue'; diff --git a/code/addons/docs/template/stories/stories-mdx/colorpalette.stories.mdx b/code/addons/docs/template/stories/stories-mdx/colorpalette.stories.mdx deleted file mode 100644 index c038dc2638ac..000000000000 --- a/code/addons/docs/template/stories/stories-mdx/colorpalette.stories.mdx +++ /dev/null @@ -1,23 +0,0 @@ -import { Meta, ColorPalette, ColorItem } from '@storybook/addon-docs'; - - - - - - - - - diff --git a/code/addons/docs/template/stories/stories-mdx/markdown.stories.mdx b/code/addons/docs/template/stories/stories-mdx/markdown.stories.mdx deleted file mode 100644 index 44b053c61619..000000000000 --- a/code/addons/docs/template/stories/stories-mdx/markdown.stories.mdx +++ /dev/null @@ -1,155 +0,0 @@ -import { Meta } from '@storybook/addon-docs'; - - - -# Markdown - -This is a basic **docs-only MDX** that demonstrates a whole mess of Mardown formatting. - -# h1 Heading - -## h2 Heading - -### h3 Heading - -#### h4 Heading - -##### h5 Heading - -###### h6 Heading - -## Paragraphs - -The Storybook design system codifies existing UI components into a central, well-maintained repository. It is built to address having to paste the same components into multiple projects again and again. This simplifies building UI's with Storybook's design patterns. - -SDS was created by Kyle Suss, Dominic Nguyen (me!), and Michael Shilman with invaluable accessibility contributions from Jimmy Somsanith. - -## Emphasis - -**This is bold text** - -**_This is bold italic text_** - -_This is italic text_ - -_This is italic text_ - -~~Strikethrough~~ - -## Blockquotes - -> Blockquotes can also be nested... -> -> > ...by using additional greater-than signs right next to each other... -> > -> > > ...or with spaces between arrows. - -## Lists - -Unordered - -- Create a list by starting a line with `+`, `-`, or `*` -- Sub-lists are made by indenting 2 spaces: - - Marker character change forces new list start: - - Ac tristique libero volutpat at - * Facilisis in pretium nisl aliquet - - Nulla volutpat aliquam velit -- Very easy! - - Marker character change forces new list start: - - Ac tristique libero volutpat at - * Facilisis in pretium nisl aliquet - - Nulla volutpat aliquam velit -- Final item - -Ordered - -1. Lorem ipsum dolor sit amet -2. Consectetur adipiscing elit -3. Integer molestie lorem at massa - -Start numbering with offset: - -57. foo -1. bar - -## Code - -Inline `code` - -Indented code - - // Some comments - line 1 of code - line 2 of code - line 3 of code - -Block code "fences" - -``` -Sample text here... -``` - -JS syntax highlighting - -```js -var foo = function (bar) { - return bar++; -}; - -console.log(foo(5)); -``` - -CSS syntax - -```css -.foo { - color: #eee; -} -``` - -HTML syntax - -```html -

yo html

- -

And here we go

-``` - -## Tables - -| Option | Description | -| ------ | ------------------------------------------------------------------------- | -| data | path to data files to supply the data that will be passed into templates. | -| engine | engine to be used for processing templates. Handlebars is the default. | -| ext | extension to be used for dest files. | - -Right aligned columns - -| Option | Description | -| -----: | ------------------------------------------------------------------------: | -| data | path to data files to supply the data that will be passed into templates. | -| engine | engine to be used for processing templates. Handlebars is the default. | -| ext | extension to be used for dest files. | - -## Links - -[external link](https://hichroma.com) - -[external link with title](https://hichroma.com 'Insert title!') - -[link to in page anchor](#h1-heading) - -[link to another story (docs, without prefix)](/docs/addons-docs-docs-only--page) - -[link to another story (docs)](?path=/docs/addons-docs-docs-only--page) - -[link to another story (canvas)](?path=/story/addons-docs-buttongroup--basic) - -[link to about page](?path=/settings/about) - -[link to absolute local url](/absolute) - -## Images - -![Minion](https://octodex.github.com/images/minion.png) -![Stormtroopocat](https://octodex.github.com/images/stormtroopocat.jpg 'The Stormtroopocat') diff --git a/code/addons/storyshots/storyshots-puppeteer/README.md b/code/addons/storyshots/storyshots-puppeteer/README.md index c3d9def10d9b..2175c1d436d4 100644 --- a/code/addons/storyshots/storyshots-puppeteer/README.md +++ b/code/addons/storyshots/storyshots-puppeteer/README.md @@ -199,7 +199,6 @@ Those can be customized with `setupTimeout` and `testTimeout` parameters. ### Integrate Puppeteer storyshots with regular app You may want to use another Jest project to run your Puppeteer storyshots as they require more resources: Chrome and Storybook built/served. -You can find a working example of this in the [official-storybook](https://github.com/storybookjs/storybook/tree/main/examples/official-storybook) example. ### Integrate Puppeteer storyshots with [Create React App](https://github.com/facebookincubator/create-react-app) diff --git a/code/examples/README.md b/code/examples/README.md index 09321964d372..08d771ce3db0 100644 --- a/code/examples/README.md +++ b/code/examples/README.md @@ -4,7 +4,6 @@ Live examples of these: ### Next release -- [React Official](https://next--storybookjs.netlify.com/official-storybook/) - [Vue](https://next--storybookjs.netlify.com/vue-kitchen-sink/) - [Angular](https://next--storybookjs.netlify.com/angular-cli/) - [HTML](https://next--storybookjs.netlify.com/html-kitchen-sink/) @@ -14,7 +13,6 @@ Live examples of these: ### Current release -- [React Official](https://storybookjs.netlify.com/official-storybook/) - [Vue](https://storybookjs.netlify.com/vue-kitchen-sink/) - [Angular](https://storybookjs.netlify.com/angular-cli/) - [HTML](https://storybookjs.netlify.com/html-kitchen-sink/) diff --git a/code/examples/official-storybook/.env b/code/examples/official-storybook/.env deleted file mode 100644 index 23af4d561fae..000000000000 --- a/code/examples/official-storybook/.env +++ /dev/null @@ -1 +0,0 @@ -DOTENV_DISPLAY_WARNING=none diff --git a/code/examples/official-storybook/.env.development b/code/examples/official-storybook/.env.development deleted file mode 100644 index 3746c482ab58..000000000000 --- a/code/examples/official-storybook/.env.development +++ /dev/null @@ -1 +0,0 @@ -DOTENV_DEVELOPMENT_DISPLAY_WARNING=true diff --git a/code/examples/official-storybook/README.md b/code/examples/official-storybook/README.md deleted file mode 100644 index 2ada0aa35033..000000000000 --- a/code/examples/official-storybook/README.md +++ /dev/null @@ -1,14 +0,0 @@ -# Official storybook - -This storybook includes stories for: - -- `@storybook/components` - reusable UI components for addon authors -- `@storybook/ui` - the UI of storybook itself -- `@storybook/addon-*` - various addons. -- `@storybook/other-*` - various examples. - -## How to make new `build-storybook`s: - -```sh -sudo ln -s ../../{new-example}/storybook-static /Users/{user}/{location-of-storybook-repo}/core/examples/official-storybook/built-storybookjs/{new-example} -``` diff --git a/code/examples/official-storybook/babel.config.js b/code/examples/official-storybook/babel.config.js deleted file mode 100644 index d8878bebe583..000000000000 --- a/code/examples/official-storybook/babel.config.js +++ /dev/null @@ -1,3 +0,0 @@ -module.exports = { - presets: ['@babel/preset-react', '@babel/preset-typescript'], -}; diff --git a/code/examples/official-storybook/components/BaseButton.js b/code/examples/official-storybook/components/BaseButton.js deleted file mode 100644 index 17b2ce719fda..000000000000 --- a/code/examples/official-storybook/components/BaseButton.js +++ /dev/null @@ -1,28 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; - -/** BaseButton component description imported from comments inside the component file */ -const BaseButton = ({ disabled, label, onClick, style }) => ( - -); - -BaseButton.defaultProps = { - disabled: false, - onClick: () => {}, - style: {}, -}; - -BaseButton.propTypes = { - /** Boolean indicating whether the button should render as disabled */ - disabled: PropTypes.bool, - /** button label. */ - label: PropTypes.string.isRequired, - /** onClick handler */ - onClick: PropTypes.func, - /** Custom styles */ - style: PropTypes.shape({}), -}; - -export default BaseButton; diff --git a/code/examples/official-storybook/components/ButtonGroup.js b/code/examples/official-storybook/components/ButtonGroup.js deleted file mode 100644 index 6b8187dac6bb..000000000000 --- a/code/examples/official-storybook/components/ButtonGroup.js +++ /dev/null @@ -1,36 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; - -/** ButtonGroup component description from docgen */ -export const ButtonGroup = ({ background, children }) => ( -
{children}
-); - -ButtonGroup.defaultProps = { - background: '#ff0', - children: null, -}; - -ButtonGroup.propTypes = { - /** - * Background color for the group - */ - background: PropTypes.string, - children: PropTypes.arrayOf(PropTypes.element), -}; - -/** SubGroup component description from docgen */ -export const SubGroup = ({ background, children }) =>
{children}
; - -SubGroup.defaultProps = { - background: '#0f0', - children: null, -}; - -SubGroup.propTypes = { - /** - * Background color for the sub-group - */ - background: PropTypes.string, - children: PropTypes.arrayOf(PropTypes.element), -}; diff --git a/code/examples/official-storybook/components/DelayedRender.js b/code/examples/official-storybook/components/DelayedRender.js deleted file mode 100644 index 85ec79e1a6af..000000000000 --- a/code/examples/official-storybook/components/DelayedRender.js +++ /dev/null @@ -1,30 +0,0 @@ -import React, { Component } from 'react'; -import PropTypes from 'prop-types'; - -export default class DelayedRender extends Component { - static propTypes = { - children: PropTypes.node.isRequired, - }; - - state = { - show: false, - }; - - componentDidMount() { - this.showTO = setTimeout(() => { - this.setState({ - show: true, - }); - }, 1000); - } - - componentWillUnmount() { - clearTimeout(this.showTO); - } - - render() { - const { show } = this.state; - const { children } = this.props; - return show ? children :
; - } -} diff --git a/code/examples/official-storybook/components/DocgenButton.js b/code/examples/official-storybook/components/DocgenButton.js deleted file mode 100644 index 801605b18845..000000000000 --- a/code/examples/official-storybook/components/DocgenButton.js +++ /dev/null @@ -1,176 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; - -/** - * DocgenButton component description imported from comments inside the component file, - * - * *Important Note*: Unlike with normal `` elements, setting this will - * not validate the input contents. This is because in this project we use - * Formik and Yup to validate fields at the form-level, not at the individual - * input level. It is still very important to set this value properly for - * accessibility and user experience. - * - * Here's a list to test out formatting. - * - * * `"number"` Any number not represented by a more specific type. - * * `"password"` A password. - * * `"email"` An email address. - * * `"tel"` A phone or fax number. Shows the phone number keypad on - * mobile keyboards. - * - * Here is a test for code blocks - * - * ```jsx - * const Foo = () => ( - *
foo
- * ); - * ``` - */ -export const DocgenButton = ({ disabled, label, onClick }) => ( - -); - -DocgenButton.defaultProps = { - disabled: false, - onClick: () => {}, - optionalString: 'Default String', - one: { key: 1 }, - two: { - thing: { - id: 2, - func: () => {}, - arr: [], - }, - }, - obj: { - key: 'value', - }, - shape: { - id: 3, - func: () => {}, - arr: [], - shape: { - shape: { - foo: 'bar', - }, - }, - }, - arrayOf: [1, 2, 3], - msg: new Set(), - enm: 'News', - enmEval: 'Photos', - union: 'hello', -}; - -/* eslint-disable react/no-unused-prop-types */ - -DocgenButton.propTypes = { - /** Boolean indicating whether the button should render as disabled */ - disabled: PropTypes.bool, - /** button label. */ - label: PropTypes.string.isRequired, - /** onClick handler */ - onClick: PropTypes.func, - /** - * A simple `objectOf` propType. - */ - one: PropTypes.objectOf(PropTypes.number), - /** - * A very complex `objectOf` propType. - */ - two: PropTypes.objectOf( - PropTypes.shape({ - /** - * Just an internal propType for a shape. - * It's also required, and as you can see it supports multi-line comments! - */ - id: PropTypes.number.isRequired, - /** - * A simple non-required function - */ - func: PropTypes.func, - /** - * An `arrayOf` shape - */ - arr: PropTypes.arrayOf( - PropTypes.shape({ - /** - * 5-level deep propType definition and still works. - */ - index: PropTypes.number.isRequired, - }) - ), - }) - ), - - /** - * Plain object propType (use shape!!) - */ - obj: PropTypes.object, // eslint-disable-line react/forbid-prop-types - - /** - * propType for shape with nested arrayOf - * - * Also, multi-line description - */ - shape: PropTypes.shape({ - /** - * Just an internal propType for a shape. - * It's also required, and as you can see it supports multi-line comments! - */ - id: PropTypes.number.isRequired, - /** - * A simple non-required function - */ - func: PropTypes.func, - /** - * An `arrayOf` shape - */ - arr: PropTypes.arrayOf( - PropTypes.shape({ - /** - * 5-level deep propType definition and still works. - */ - index: PropTypes.number.isRequired, - }) - ), - - shape: PropTypes.shape({ - shape: PropTypes.shape({ - foo: PropTypes.string, - }), - }), - }), - - /** - * array of a certain type - */ - arrayOf: PropTypes.arrayOf(PropTypes.number), - - /** - * `instanceOf` is also supported and the custom type will be shown instead of `instanceOf` - */ - msg: PropTypes.instanceOf(Set), - /** - * `oneOf` is basically an Enum which is also supported but can be pretty big. - * - * Testing a list: - * - * - `News` first - * - `Photos` second - */ - enm: PropTypes.oneOf(['News', 'Photos']), - enmEval: PropTypes.oneOf((() => ['News', 'Photos'])()), - /** - * A multi-type prop is also valid and is displayed as `Union` - */ - union: PropTypes.oneOfType([PropTypes.string, PropTypes.instanceOf(Set)]), - /** - * test string with a comment that has - * two identical lines - * two identical lines - */ - optionalString: PropTypes.string, -}; diff --git a/code/examples/official-storybook/components/ForwardRefButton.js b/code/examples/official-storybook/components/ForwardRefButton.js deleted file mode 100644 index 67e704dd8c26..000000000000 --- a/code/examples/official-storybook/components/ForwardRefButton.js +++ /dev/null @@ -1,47 +0,0 @@ -import React, { forwardRef } from 'react'; -import PropTypes from 'prop-types'; -import BaseButton from './BaseButton'; - -const ForwardRefButtonRender = ({ label, ...props }, ref) => ( - -); - -ForwardRefButtonRender.propTypes = { - /** Boolean indicating whether the button should render as disabled */ - disabled: PropTypes.bool, - /** button label. */ - label: PropTypes.string.isRequired, - /** onClick handler */ - onClick: PropTypes.func, - /** Custom styles */ - style: PropTypes.shape({}), -}; - -ForwardRefButtonRender.defaultProps = { - disabled: false, - onClick: () => {}, - style: {}, -}; - -export const ForwardRefButtonInnerPropTypes = forwardRef(ForwardRefButtonRender); - -export const ForwardRefButtonOuterPropTypes = forwardRef(({ label, ...props }, ref) => ( - -)); - -ForwardRefButtonOuterPropTypes.defaultProps = { - disabled: false, - onClick: () => {}, - style: {}, -}; - -ForwardRefButtonOuterPropTypes.propTypes = { - /** Boolean indicating whether the button should render as disabled */ - disabled: PropTypes.bool, - /** button label. */ - label: PropTypes.string.isRequired, - /** onClick handler */ - onClick: PropTypes.func, - /** Custom styles */ - style: PropTypes.shape({}), -}; diff --git a/code/examples/official-storybook/components/ImportedPropsButton.js b/code/examples/official-storybook/components/ImportedPropsButton.js deleted file mode 100644 index b8a1e7e88cd6..000000000000 --- a/code/examples/official-storybook/components/ImportedPropsButton.js +++ /dev/null @@ -1,15 +0,0 @@ -import React from 'react'; -import { DocgenButton } from './DocgenButton'; - -/** Button component description */ -const ImportedPropsButton = ({ disabled, label, onClick }) => ( - -); - -ImportedPropsButton.defaultProps = DocgenButton.defaultProps; - -ImportedPropsButton.propTypes = DocgenButton.propTypes; - -export default ImportedPropsButton; diff --git a/code/examples/official-storybook/components/MemoButton.js b/code/examples/official-storybook/components/MemoButton.js deleted file mode 100644 index 8e8dc72a7d33..000000000000 --- a/code/examples/official-storybook/components/MemoButton.js +++ /dev/null @@ -1,5 +0,0 @@ -import React from 'react'; - -import BaseButton from './BaseButton'; - -export const MemoButton = React.memo(BaseButton); diff --git a/code/examples/official-storybook/components/NamedExportButton.js b/code/examples/official-storybook/components/NamedExportButton.js deleted file mode 100644 index 8a0491c24b77..000000000000 --- a/code/examples/official-storybook/components/NamedExportButton.js +++ /dev/null @@ -1,24 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import BaseButton from './BaseButton'; - -const NamedExportButton = (props) => ; - -NamedExportButton.defaultProps = { - disabled: false, - onClick: () => {}, - style: {}, -}; - -NamedExportButton.propTypes = { - /** Boolean indicating whether the button should render as disabled */ - disabled: PropTypes.bool, - /** button label. */ - label: PropTypes.string.isRequired, - /** onClick handler */ - onClick: PropTypes.func, - /** Custom styles */ - style: PropTypes.shape({}), -}; - -export { NamedExportButton }; diff --git a/code/examples/official-storybook/components/OptionalButton.tsx b/code/examples/official-storybook/components/OptionalButton.tsx deleted file mode 100644 index dc10a20c4937..000000000000 --- a/code/examples/official-storybook/components/OptionalButton.tsx +++ /dev/null @@ -1,14 +0,0 @@ -import React from 'react'; - -// Repro #11019 -interface Props { - kind?: 'a' | 'b'; - disabled?: boolean; -} - -export const OptionalButton = ({ disabled = false, kind = 'a' }: Props) => ( - // eslint-disable-next-line react/button-has-type - -); - -export default OptionalButton; diff --git a/code/examples/official-storybook/components/TableComponent.js b/code/examples/official-storybook/components/TableComponent.js deleted file mode 100644 index 0a738c793be3..000000000000 --- a/code/examples/official-storybook/components/TableComponent.js +++ /dev/null @@ -1,52 +0,0 @@ -/* eslint-disable react/forbid-prop-types */ -import React from 'react'; -import PropTypes from 'prop-types'; - -const Red = (props) => ; -const TableComponent = ({ propDefinitions }) => { - const props = propDefinitions.map( - ({ property, propType, required, description, defaultValue }) => ( - - - {property} - {required ? * : null} - - {propType.name} - {JSON.stringify(defaultValue)} - {description} - - ) - ); - - return ( - - - - - - - - - - {props} -
nametypedefaultdescription
- ); -}; - -TableComponent.defaultProps = { - propDefinitions: [], -}; - -TableComponent.propTypes = { - propDefinitions: PropTypes.arrayOf( - PropTypes.shape({ - property: PropTypes.string.isRequired, - propType: PropTypes.oneOfType([PropTypes.object, PropTypes.string]).isRequired, - required: PropTypes.bool.isRequired, - description: PropTypes.string, - defaultValue: PropTypes.any, - }) - ), -}; - -export default TableComponent; diff --git a/code/examples/official-storybook/components/TsButton.tsx b/code/examples/official-storybook/components/TsButton.tsx deleted file mode 100644 index d9ca92f59252..000000000000 --- a/code/examples/official-storybook/components/TsButton.tsx +++ /dev/null @@ -1,26 +0,0 @@ -import React, { FC } from 'react'; - -export type Type = 'default' | 'action'; - -interface Props { - /** - * Click event handler - * @default null - */ - onClick?: () => void; - - /** - * Button type yo - */ - type?: Type; -} - -const Button: FC = ({ children, type = 'default', onClick }) => { - return ( - - ); -}; - -export default Button; diff --git a/code/examples/official-storybook/components/addon-a11y/Button.js b/code/examples/official-storybook/components/addon-a11y/Button.js deleted file mode 100644 index 293f6ca97303..000000000000 --- a/code/examples/official-storybook/components/addon-a11y/Button.js +++ /dev/null @@ -1,48 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; - -const styles = { - button: { - padding: '12px 6px', - fontSize: '12px', - lineHeight: '16px', - borderRadius: '5px', - }, - ok: { - backgroundColor: '#028402', - color: '#ffffff', - }, - wrong: { - color: '#ffffff', - backgroundColor: '#4caf50', - }, -}; - -function Button({ content, disabled, contrast }) { - return ( - - ); -} - -Button.propTypes = { - content: PropTypes.string, - disabled: PropTypes.bool, - contrast: PropTypes.oneOf(['ok', 'wrong']), -}; - -Button.defaultProps = { - content: 'null', - disabled: false, - contrast: 'ok', -}; - -export default Button; diff --git a/code/examples/official-storybook/components/addon-a11y/Form/Input.js b/code/examples/official-storybook/components/addon-a11y/Form/Input.js deleted file mode 100644 index f5fca29664d8..000000000000 --- a/code/examples/official-storybook/components/addon-a11y/Form/Input.js +++ /dev/null @@ -1,22 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; - -function Input({ id, value, type, placeholder }) { - return ; -} - -Input.propTypes = { - type: PropTypes.oneOf(['text', 'password']), - id: PropTypes.string, - value: PropTypes.string, - placeholder: PropTypes.string, -}; - -Input.defaultProps = { - type: null, - id: null, - value: null, - placeholder: null, -}; - -export default Input; diff --git a/code/examples/official-storybook/components/addon-a11y/Form/Label.js b/code/examples/official-storybook/components/addon-a11y/Form/Label.js deleted file mode 100644 index 5f3799a6ac6c..000000000000 --- a/code/examples/official-storybook/components/addon-a11y/Form/Label.js +++ /dev/null @@ -1,23 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; - -const styles = { - label: { - padding: '0 6px', - }, -}; - -function Label({ id, content }) { - return ( - - ); -} - -Label.propTypes = { - content: PropTypes.string.isRequired, - id: PropTypes.string.isRequired, -}; - -export default Label; diff --git a/code/examples/official-storybook/components/addon-a11y/Form/Row.js b/code/examples/official-storybook/components/addon-a11y/Form/Row.js deleted file mode 100644 index 51f87b040529..000000000000 --- a/code/examples/official-storybook/components/addon-a11y/Form/Row.js +++ /dev/null @@ -1,25 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; - -import Label from './Label'; -import Input from './Input'; - -function Row({ label, input }) { - return ( -
- {label} - {input} -
- ); -} - -Row.propTypes = { - label: PropTypes.shape({ type: PropTypes.oneOf([Label]) }), - input: PropTypes.shape({ type: PropTypes.oneOf([Input]) }).isRequired, -}; - -Row.defaultProps = { - label: null, -}; - -export default Row; diff --git a/code/examples/official-storybook/components/addon-a11y/Form/index.js b/code/examples/official-storybook/components/addon-a11y/Form/index.js deleted file mode 100644 index c893c0a55dd6..000000000000 --- a/code/examples/official-storybook/components/addon-a11y/Form/index.js +++ /dev/null @@ -1,5 +0,0 @@ -import Input from './Input'; -import Label from './Label'; -import Row from './Row'; - -export { Input, Label, Row }; diff --git a/code/examples/official-storybook/components/addon-measure/ShadowRoot.js b/code/examples/official-storybook/components/addon-measure/ShadowRoot.js deleted file mode 100644 index 161e357992c8..000000000000 --- a/code/examples/official-storybook/components/addon-measure/ShadowRoot.js +++ /dev/null @@ -1,63 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import { drawSelectedElement } from '../../../../addons/measure/src/box-model/visualizer'; -import { init, destroy } from '../../../../addons/measure/src/box-model/canvas'; - -export const ShadowRoot = ({ label = 'Hello from shadow DOM', drawMode = 'ROOT' }) => { - const ref = React.useRef(); - - React.useEffect(() => { - if (!ref.current.attachShadow) return; - - ref.current.attachShadow({ mode: 'open' }); - - ref.current.shadowRoot.innerHTML = ` - - - `; - - init(); - drawSelectedElement(drawMode === 'ROOT' ? ref.current : ref.current.shadowRoot.children[1]); - - // eslint-disable-next-line consistent-return - return () => { - destroy(); - }; - }, []); - - return
; -}; - -ShadowRoot.propTypes = { - label: PropTypes.string, - drawMode: PropTypes.oneOf(['ROOT', 'NESTED']), -}; - -ShadowRoot.defaultProps = { - label: 'Hello from shadow DOM', - drawMode: 'ROOT', -}; diff --git a/code/examples/official-storybook/components/addon-measure/Visualization.js b/code/examples/official-storybook/components/addon-measure/Visualization.js deleted file mode 100644 index 6862e2073e19..000000000000 --- a/code/examples/official-storybook/components/addon-measure/Visualization.js +++ /dev/null @@ -1,34 +0,0 @@ -import React, { useEffect, useRef } from 'react'; -import PropTypes from 'prop-types'; -import { drawSelectedElement } from '../../../../addons/measure/src/box-model/visualizer'; -import { init, destroy } from '../../../../addons/measure/src/box-model/canvas'; - -export const Visualization = ({ render }) => { - const element = useRef(null); - - useEffect(() => { - if (element.current) { - init(); - drawSelectedElement(element.current); - } - - return () => { - destroy(); - }; - }, [element]); - - return ( -
- {render(element)} -
- ); -}; - -Visualization.propTypes = { - render: PropTypes.func.isRequired, -}; diff --git a/code/examples/official-storybook/components/page/Button.js b/code/examples/official-storybook/components/page/Button.js deleted file mode 100644 index cb9aad8c06cf..000000000000 --- a/code/examples/official-storybook/components/page/Button.js +++ /dev/null @@ -1,32 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import './button.css'; - -/** - * Primary UI component for user interaction - */ -export const Button = ({ primary, size, label, ...props }) => { - const mode = primary ? 'storybook-button--primary' : 'storybook-button--secondary'; - return ( - - ); -}; - -Button.propTypes = { - primary: PropTypes.bool, - size: PropTypes.oneOf(['small', 'medium', 'large']), - label: PropTypes.string.isRequired, - onClick: PropTypes.func, -}; - -Button.defaultProps = { - primary: false, - size: 'medium', - onClick: undefined, -}; diff --git a/code/examples/official-storybook/components/page/Header.js b/code/examples/official-storybook/components/page/Header.js deleted file mode 100644 index e6eea8f07ee6..000000000000 --- a/code/examples/official-storybook/components/page/Header.js +++ /dev/null @@ -1,52 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; - -import { Button } from './Button'; -import './header.css'; - -export const Header = ({ user, onLogin, onLogout, onCreateAccount }) => ( -
-
-
- - - - - - - -

Acme

-
-
- {user ? ( -
-
-
-); - -Header.propTypes = { - user: PropTypes.shape({}), - onLogin: PropTypes.func.isRequired, - onLogout: PropTypes.func.isRequired, - onCreateAccount: PropTypes.func.isRequired, -}; - -Header.defaultProps = { - user: null, -}; diff --git a/code/examples/official-storybook/components/page/Page.js b/code/examples/official-storybook/components/page/Page.js deleted file mode 100644 index b8abe417aac8..000000000000 --- a/code/examples/official-storybook/components/page/Page.js +++ /dev/null @@ -1,74 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; - -import { Header } from './Header'; -import './page.css'; - -export const Page = ({ user, onLogin, onLogout, onCreateAccount }) => ( -
-
- -
-

Pages in Storybook

-

- We recommend building UIs with a{' '} - - component-driven - {' '} - process starting with atomic components and ending with pages. -

-

- Render pages with mock data. This makes it easy to build and review page states without - needing to navigate to them in your app. Here are some handy patterns for managing page data - in Storybook: -

-
    -
  • - Use a higher-level connected component. Storybook helps you compose such data from the - "args" of child component stories -
    • -
  • - Assemble data in the page component from your services. You can mock these services out - using Storybook. -
    • -
-

- Get a guided tutorial on component-driven development at{' '} - - Storybook tutorials - - . Read more in the{' '} - - docs - - . -

-
- Tip Adjust the width of the canvas with the{' '} - - - - - - Viewports addon in the toolbar -
-
-
-); -Page.propTypes = { - user: PropTypes.shape({}), - onLogin: PropTypes.func, - onLogout: PropTypes.func, - onCreateAccount: PropTypes.func, -}; - -Page.defaultProps = { - user: null, - onLogin: () => {}, - onLogout: () => {}, - onCreateAccount: () => {}, -}; diff --git a/code/examples/official-storybook/components/page/button.css b/code/examples/official-storybook/components/page/button.css deleted file mode 100644 index dc91dc76370b..000000000000 --- a/code/examples/official-storybook/components/page/button.css +++ /dev/null @@ -1,30 +0,0 @@ -.storybook-button { - font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; - font-weight: 700; - border: 0; - border-radius: 3em; - cursor: pointer; - display: inline-block; - line-height: 1; -} -.storybook-button--primary { - color: white; - background-color: #1ea7fd; -} -.storybook-button--secondary { - color: #333; - background-color: transparent; - box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 0px 1px inset; -} -.storybook-button--small { - font-size: 12px; - padding: 10px 16px; -} -.storybook-button--medium { - font-size: 14px; - padding: 11px 20px; -} -.storybook-button--large { - font-size: 16px; - padding: 12px 24px; -} diff --git a/code/examples/official-storybook/components/page/header.css b/code/examples/official-storybook/components/page/header.css deleted file mode 100644 index c1a97056ed44..000000000000 --- a/code/examples/official-storybook/components/page/header.css +++ /dev/null @@ -1,26 +0,0 @@ -.wrapper { - font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; - border-bottom: 1px solid rgba(0, 0, 0, 0.1); - padding: 15px 20px; - display: flex; - align-items: center; - justify-content: space-between; -} - -svg { - display: inline-block; - vertical-align: top; -} - -.title { - font-weight: 900; - font-size: 20px; - line-height: 1; - margin: 6px 0 6px 10px; - display: inline-block; - vertical-align: top; -} - -button + button { - margin-left: 10px; -} diff --git a/code/examples/official-storybook/components/page/page.css b/code/examples/official-storybook/components/page/page.css deleted file mode 100644 index b67e9d4d1ed5..000000000000 --- a/code/examples/official-storybook/components/page/page.css +++ /dev/null @@ -1,73 +0,0 @@ -article { - background-color: #fff; -} - -section { - font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; - font-size: 14px; - line-height: 24px; - padding: 48px 20px; - margin: 0 auto; - max-width: 600px; - color: #333; -} - -.page-title { - font-weight: 900; - font-size: 32px; - line-height: 1; - margin: 0 0 4px; - display: inline-block; - vertical-align: top; -} - -p { - margin: 1em 0; -} - -a { - text-decoration: none; - color: #1ea7fd; -} - -ul { - padding-left: 30px; - margin: 1em 0; -} - -li { - margin-bottom: 8px; -} - -.tip { - display: inline-block; - border-radius: 1em; - font-size: 11px; - line-height: 12px; - font-weight: 700; - background: #e7fdd8; - color: #66bf3c; - padding: 4px 12px; - margin-right: 10px; - vertical-align: top; -} - -.tip-wrapper { - font-size: 13px; - line-height: 20px; - margin-top: 40px; - margin-bottom: 40px; -} - -.tip-wrapper svg { - display: inline-block; - height: 12px; - width: 12px; - margin-right: 4px; - vertical-align: top; - margin-top: 3px; -} - -.tip-wrapper svg path { - fill: #1ea7fd; -} diff --git a/code/examples/official-storybook/components/react-demo.tsx b/code/examples/official-storybook/components/react-demo.tsx deleted file mode 100644 index d9761532fd34..000000000000 --- a/code/examples/official-storybook/components/react-demo.tsx +++ /dev/null @@ -1,37 +0,0 @@ -import React, { FC, HTMLAttributes } from 'react'; - -const styles = { - border: '1px solid #eee', - borderRadius: 3, - backgroundColor: '#FFFFFF', - cursor: 'pointer', - fontSize: 15, - padding: '3px 10px', - margin: 10, -}; - -type ButtonProps = Pick, 'onClick'>; -export const Button: FC = ({ children, onClick }) => ( - -); - -Button.displayName = 'Button'; -Button.defaultProps = { - onClick: () => {}, -}; - -interface WelcomeProps { - showApp: () => void; -} - -export const Welcome: FC = ({ showApp }) => ( - -); -Welcome.displayName = 'Welcome'; -Welcome.defaultProps = { - showApp: () => {}, -}; diff --git a/code/examples/official-storybook/head-warning.js b/code/examples/official-storybook/head-warning.js deleted file mode 100644 index 3020333992e0..000000000000 --- a/code/examples/official-storybook/head-warning.js +++ /dev/null @@ -1,16 +0,0 @@ -import global from 'global'; - -const { document } = global; - -// HMR will cause this code to be invoked multiple times, so each warning should have a unique ID -export default function addHeadWarning(id, text) { - if (!document.getElementById(id)) { - const warning = document.createElement('h1'); - warning.textContent = text; - warning.id = id; - warning.style.backgroundColor = 'tomato'; - warning.style.padding = '10px'; - - document.body.insertBefore(warning, document.body.firstChild); - } -} diff --git a/code/examples/official-storybook/intro.stories.mdx b/code/examples/official-storybook/intro.stories.mdx deleted file mode 100644 index b192db9fded5..000000000000 --- a/code/examples/official-storybook/intro.stories.mdx +++ /dev/null @@ -1,5 +0,0 @@ - - -# Official-storybook - -Welcome to `official-storybook`, a collection of test cases and demos for `@storybook/react` and all its addons. diff --git a/code/examples/official-storybook/manager-head.html b/code/examples/official-storybook/manager-head.html deleted file mode 100644 index 7d058f58633b..000000000000 --- a/code/examples/official-storybook/manager-head.html +++ /dev/null @@ -1,5 +0,0 @@ - diff --git a/code/examples/official-storybook/manager.js b/code/examples/official-storybook/manager.js deleted file mode 100644 index 77104c4f6326..000000000000 --- a/code/examples/official-storybook/manager.js +++ /dev/null @@ -1,69 +0,0 @@ -import React from 'react'; -import { addons } from '@storybook/addons'; -import { themes, styled } from '@storybook/theming'; -import { Icons } from '@storybook/components'; - -import addHeadWarning from './head-warning'; - -addHeadWarning('manager-head-not-loaded', 'Manager head not loaded'); - -const PrefixIcon = styled(Icons)(({ theme }) => ({ - marginRight: 5, - fontSize: 'inherit', - height: 12, - width: 12, - paddingTop: 1, - display: 'inline', - alignSelf: 'center', -})); - -addons.setConfig({ - theme: themes.light, // { base: 'dark', brandTitle: 'Storybook!' }, - previewTabs: { - canvas: null, - 'storybook/docs/panel': null, - 'storybookjs/notes/panel': { title: 'Annotations', hidden: true }, - graphiql: { - hidden: true, - }, - toolbar: { - title: { hidden: false }, - zoom: { hidden: false }, - eject: { hidden: false }, - copy: { hidden: false }, - fullscreen: { hidden: false }, - }, - }, - sidebar: { - collapsedRoots: ['other'], - renderLabel: ({ id, name }) => { - const map = { - addons: ( - <> - - {name} - - ), - 'addons-a11y': ( - <> - - {name} - - ), - 'addons-a11y-basebutton': ( - <> - - {name} - - ), - 'addons-a11y-basebutton--default': ( - <> - - {name} - - ), - }; - return map[id]; - }, - }, -}); diff --git a/code/examples/official-storybook/package.json b/code/examples/official-storybook/package.json deleted file mode 100644 index 1f95747ba222..000000000000 --- a/code/examples/official-storybook/package.json +++ /dev/null @@ -1,74 +0,0 @@ -{ - "name": "official-storybook", - "version": "7.0.0-alpha.35", - "private": true, - "scripts": { - "build-storybook": "cross-env STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true storybook build -c ./", - "debug": "cross-env NODE_OPTIONS=--inspect-brk STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true storybook dev -p 9011 -c ./", - "do-storyshots-puppeteer": "../../node_modules/.bin/jest --projects=./storyshots-puppeteer", - "generate-addon-jest-testresults": "jest --config=tests/addon-jest.config.json --json --outputFile=stories/addon-jest.testresults.json", - "storybook": "cross-env STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true storybook dev -p 9011 -c ./ --no-manager-cache", - "storyshots-puppeteer": "storybook build && yarn run do-storyshots-puppeteer" - }, - "dependencies": { - "formik": "^2.2.9" - }, - "devDependencies": { - "@emotion/jest": "^11.10.0", - "@pmmmwh/react-refresh-webpack-plugin": "^0.5.5", - "@storybook/addon-a11y": "7.0.0-alpha.35", - "@storybook/addon-actions": "7.0.0-alpha.35", - "@storybook/addon-backgrounds": "7.0.0-alpha.35", - "@storybook/addon-controls": "7.0.0-alpha.35", - "@storybook/addon-docs": "7.0.0-alpha.35", - "@storybook/addon-highlight": "7.0.0-alpha.35", - "@storybook/addon-interactions": "7.0.0-alpha.35", - "@storybook/addon-jest": "7.0.0-alpha.35", - "@storybook/addon-links": "7.0.0-alpha.35", - "@storybook/addon-storyshots": "7.0.0-alpha.35", - "@storybook/addon-storyshots-puppeteer": "7.0.0-alpha.35", - "@storybook/addon-storysource": "7.0.0-alpha.35", - "@storybook/addon-toolbars": "7.0.0-alpha.35", - "@storybook/addon-viewport": "7.0.0-alpha.35", - "@storybook/addons": "7.0.0-alpha.35", - "@storybook/cli": "7.0.0-alpha.35", - "@storybook/components": "7.0.0-alpha.35", - "@storybook/core-events": "7.0.0-alpha.35", - "@storybook/design-system": "^5.4.7", - "@storybook/jest": "^0.0.10", - "@storybook/node-logger": "7.0.0-alpha.35", - "@storybook/react": "7.0.0-alpha.35", - "@storybook/react-webpack5": "7.0.0-alpha.35", - "@storybook/router": "7.0.0-alpha.35", - "@storybook/source-loader": "7.0.0-alpha.35", - "@storybook/testing-library": "0.0.14-next.0", - "@storybook/theming": "7.0.0-alpha.35", - "@testing-library/dom": "^7.31.2", - "@testing-library/user-event": "^13.1.9", - "chromatic": "^6.0.2", - "cors": "^2.8.5", - "cross-env": "^7.0.3", - "enzyme-to-json": "^3.6.1", - "eventemitter3": "^4.0.7", - "express": "^4.17.1", - "format-json": "^1.0.3", - "global": "^4.4.0", - "lodash": "^4.17.21", - "paths.macro": "^3.0.1", - "prop-types": "^15.7.2", - "react": "16.14.0", - "react-dom": "16.14.0", - "storybook": "7.0.0-alpha.35", - "terser-webpack-plugin": "^5.3.1", - "uuid-browser": "^3.1.0", - "webpack": "5" - }, - "peerDependencies": { - "puppeteer": "^2.0.0 || ^3.0.0" - }, - "storybook": { - "chromatic": { - "projectToken": "ab7m45tp9p" - } - } -} diff --git a/code/examples/official-storybook/preview-head.html b/code/examples/official-storybook/preview-head.html deleted file mode 100644 index 832d1d793982..000000000000 --- a/code/examples/official-storybook/preview-head.html +++ /dev/null @@ -1,12 +0,0 @@ - diff --git a/code/examples/official-storybook/preview.js b/code/examples/official-storybook/preview.js deleted file mode 100644 index eaf10f428bc2..000000000000 --- a/code/examples/official-storybook/preview.js +++ /dev/null @@ -1,267 +0,0 @@ -import global from 'global'; -import React, { Fragment, useEffect } from 'react'; -import isChromatic from 'chromatic/isChromatic'; -import { - Global, - ThemeProvider, - themes, - createReset, - convert, - styled, - useTheme, -} from '@storybook/theming'; -import { Symbols } from '@storybook/components'; - -import addHeadWarning from './head-warning'; - -const { document } = global; - -if (process.env.NODE_ENV === 'development') { - if (!process.env.DOTENV_DEVELOPMENT_DISPLAY_WARNING) { - addHeadWarning('dotenv-env', 'Dotenv development file not loaded'); - } - - if (!process.env.STORYBOOK_DISPLAY_WARNING) { - addHeadWarning('env-glob', 'Global storybook env var not loaded'); - } - - if (process.env.DISPLAY_WARNING) { - addHeadWarning('env-extra', 'Global non-storybook env var loaded'); - } -} - -addHeadWarning('preview-head-not-loaded', 'Preview head not loaded'); -addHeadWarning('dotenv-file-not-loaded', 'Dotenv file not loaded'); - -const ThemeBlock = styled.div( - { - position: 'absolute', - top: 0, - left: 0, - right: '50vw', - width: '50vw', - height: '100vh', - bottom: 0, - overflow: 'auto', - padding: 10, - }, - ({ theme }) => ({ - background: theme.background.content, - color: theme.color.defaultText, - }), - ({ side }) => - side === 'left' - ? { - left: 0, - right: '50vw', - } - : { - right: 0, - left: '50vw', - } -); - -const ThemeStack = styled.div( - { - position: 'relative', - minHeight: 'calc(50vh - 15px)', - }, - ({ theme }) => ({ - background: theme.background.content, - color: theme.color.defaultText, - }) -); - -const PlayFnNotice = styled.div( - { - position: 'absolute', - bottom: '1rem', - right: '1rem', - border: '1px solid #ccc', - borderRadius: '5px', - padding: '1rem', - fontSize: '12px', - '> *': { - display: 'block', - }, - }, - ({ theme }) => ({ - background: theme.background.content, - color: theme.color.defaultText, - }) -); - -const ThemedSetRoot = () => { - const theme = useTheme(); - - useEffect(() => { - document.body.style.background = theme.background.content; - document.body.style.color = theme.color.defaultText; - return () => { - // - }; - }); - - return null; -}; - -export const decorators = [ - (StoryFn, { globals, parameters, playFunction }) => { - const defaultTheme = isChromatic() && !playFunction ? 'stacked' : 'light'; - const theme = globals.theme || parameters.theme || defaultTheme; - - switch (theme) { - case 'side-by-side': { - return ( - - - - - - - - - - - - - - - - - ); - } - case 'stacked': { - return ( - - - - - - - - - - - - - - - - - ); - } - default: { - return ( - - - - - {!parameters.theme && isChromatic() && playFunction && ( - - Detected play function. - Rendering in a single theme - - )} - - - ); - } - } - }, -]; - -export const parameters = { - exportedParameter: 'exportedParameter', - actions: { argTypesRegex: '^on.*' }, - options: { - storySort: (a, b) => - a[1].kind === b[1].kind ? 0 : a[1].id.localeCompare(b[1].id, undefined, { numeric: true }), - }, - docs: { - theme: themes.light, - }, - controls: { - presetColors: [ - { color: '#ff4785', title: 'Coral' }, - { color: '#1EA7FD', title: 'Ocean' }, - { color: 'rgb(252, 82, 31)', title: 'Orange' }, - { color: 'RGBA(255, 174, 0, 0.5)', title: 'Gold' }, - { color: 'hsl(101, 52%, 49%)', title: 'Green' }, - { color: 'HSLA(179,65%,53%,0.5)', title: 'Seafoam' }, - { color: '#6F2CAC', title: 'Purple' }, - { color: '#2A0481', title: 'Ultraviolet' }, - { color: 'black' }, - { color: '#333', title: 'Darkest' }, - { color: '#444', title: 'Darker' }, - { color: '#666', title: 'Dark' }, - { color: '#999', title: 'Mediumdark' }, - { color: '#ddd', title: 'Medium' }, - { color: '#EEE', title: 'Mediumlight' }, - { color: '#F3F3F3', title: 'Light' }, - { color: '#F8F8F8', title: 'Lighter' }, - { color: '#FFFFFF', title: 'Lightest' }, - '#fe4a49', - '#FED766', - 'rgba(0, 159, 183, 1)', - 'HSLA(240,11%,91%,0.5)', - 'slategray', - ], - }, -}; - -export const globals = { - foo: 'fooValue', -}; - -export const globalTypes = { - foo: { defaultValue: 'fooDefaultValue' }, - bar: { defaultValue: 'barDefaultValue' }, - theme: { - name: 'Theme', - description: 'Global theme for components', - toolbar: { - icon: 'circlehollow', - title: 'Theme', - items: [ - { value: 'light', icon: 'circlehollow', title: 'light' }, - { value: 'dark', icon: 'circle', title: 'dark' }, - { value: 'side-by-side', icon: 'sidebar', title: 'side by side' }, - { value: 'stacked', icon: 'bottombar', title: 'stacked' }, - ], - }, - }, - locale: { - name: 'Locale', - description: 'Internationalization locale', - toolbar: { - icon: 'globe', - shortcuts: { - next: { - label: 'Go to next language', - keys: ['L'], - }, - previous: { - label: 'Go to previous language', - keys: ['K'], - }, - reset: { - label: 'Reset language', - keys: ['meta', 'shift', 'L'], - }, - }, - items: [ - { title: 'Reset locale', type: 'reset' }, - { value: 'en', right: '🇺🇸', title: 'English' }, - { value: 'es', right: '🇪🇸', title: 'Español' }, - { value: 'zh', right: '🇨🇳', title: '中文' }, - { value: 'kr', right: '🇰🇷', title: '한국어' }, - ], - }, - }, -}; - -export const loaders = [async () => ({ globalValue: 1 })]; - -export const argTypes = { color: { control: 'color' } }; -export const args = { color: 'red' }; diff --git a/code/examples/official-storybook/statics/examples/example1/example1.txt b/code/examples/official-storybook/statics/examples/example1/example1.txt deleted file mode 100644 index b01a2ca4d50e..000000000000 --- a/code/examples/official-storybook/statics/examples/example1/example1.txt +++ /dev/null @@ -1 +0,0 @@ -example1! \ No newline at end of file diff --git a/code/examples/official-storybook/statics/examples/example2/example2.txt b/code/examples/official-storybook/statics/examples/example2/example2.txt deleted file mode 100644 index 760014c6d2fb..000000000000 --- a/code/examples/official-storybook/statics/examples/example2/example2.txt +++ /dev/null @@ -1 +0,0 @@ -example2! \ No newline at end of file diff --git a/code/examples/official-storybook/statics/public/public.txt b/code/examples/official-storybook/statics/public/public.txt deleted file mode 100644 index e043990393f4..000000000000 --- a/code/examples/official-storybook/statics/public/public.txt +++ /dev/null @@ -1 +0,0 @@ -public! \ No newline at end of file diff --git a/code/examples/official-storybook/stories/addon-docs/container-override.stories.mdx b/code/examples/official-storybook/stories/addon-docs/container-override.stories.mdx deleted file mode 100644 index cefd2c593f8e..000000000000 --- a/code/examples/official-storybook/stories/addon-docs/container-override.stories.mdx +++ /dev/null @@ -1,38 +0,0 @@ -import { useRef } from 'react'; -import { Meta, DocsContainer, Story, ArgsTable } from '@storybook/addon-docs'; - - { - const countRef = useRef(); - countRef.current = (countRef.current || 0) + 1; - return ( - -
{children}
-

Container rendered {countRef.current} times

-

Try changing:

-
    -
  • the arg - story should rerender but container should not
    • -
  • a global (eg theme) - both should rerender
    • -
- - ); - }, - }, - }} -/> - -export const Component = () => { - const countRef = useRef(); - countRef.current = (countRef.current || 0) + 1; - return
Story rendered {countRef.current} times
; -}; - - - - - - diff --git a/code/examples/official-storybook/stories/addon-docs/forward-ref-inner-proptypes.stories.js b/code/examples/official-storybook/stories/addon-docs/forward-ref-inner-proptypes.stories.js deleted file mode 100644 index fc6789af1dbb..000000000000 --- a/code/examples/official-storybook/stories/addon-docs/forward-ref-inner-proptypes.stories.js +++ /dev/null @@ -1,15 +0,0 @@ -import React from 'react'; -import { ForwardRefButtonInnerPropTypes } from '../../components/ForwardRefButton'; - -export default { - title: 'Addons/Docs/ForwardRefInnerPropTypes', - component: ForwardRefButtonInnerPropTypes, - parameters: { - chromatic: { disable: true }, - docs: { source: { type: 'dynamic' } }, - }, -}; - -export const DisplaysCorrectly = () => ; -DisplaysCorrectly.storyName = - 'Displays forward ref component w/ inner propTypes correctly w/o args'; diff --git a/code/examples/official-storybook/stories/addon-docs/forward-ref-outer-proptypes.stories.js b/code/examples/official-storybook/stories/addon-docs/forward-ref-outer-proptypes.stories.js deleted file mode 100644 index 7feb23f4050d..000000000000 --- a/code/examples/official-storybook/stories/addon-docs/forward-ref-outer-proptypes.stories.js +++ /dev/null @@ -1,14 +0,0 @@ -import React from 'react'; -import { ForwardRefButtonOuterPropTypes } from '../../components/ForwardRefButton'; - -export default { - title: 'Addons/Docs/ForwardRefOuterPropTypes', - component: ForwardRefButtonOuterPropTypes, - parameters: { - chromatic: { disable: true }, - docs: { source: { type: 'dynamic' } }, - }, -}; - -export const DisplaysCorrectly = () => ; -DisplaysCorrectly.storyName = 'Displays forward ref component w/ outer propTypes correctly'; diff --git a/code/examples/official-storybook/stories/addon-docs/imported.stories.tsx b/code/examples/official-storybook/stories/addon-docs/imported.stories.tsx deleted file mode 100644 index ce1e9937ef16..000000000000 --- a/code/examples/official-storybook/stories/addon-docs/imported.stories.tsx +++ /dev/null @@ -1,6 +0,0 @@ -import React from 'react'; -import { Button } from '../../components/react-demo'; - -export default { title: 'Addons/Docs/Imported', component: Button }; -export const Basic = (args: any) => - - ); - }} - diff --git a/code/examples/official-storybook/stories/addon-docs/stories.mdx b/code/examples/official-storybook/stories/addon-docs/stories.mdx deleted file mode 100644 index b14b7e13abc9..000000000000 --- a/code/examples/official-storybook/stories/addon-docs/stories.mdx +++ /dev/null @@ -1,7 +0,0 @@ -import { Meta } from '@storybook/addon-docs'; - - - -# Stories - -Addon-docs supports `story.mdx` and `stories.mdx` for people who group their components by folder, e.g. `Button/{index.tsx,stories.mdx}`. diff --git a/code/examples/official-storybook/stories/addon-docs/title-generators.ts b/code/examples/official-storybook/stories/addon-docs/title-generators.ts deleted file mode 100644 index f5b0f0abce45..000000000000 --- a/code/examples/official-storybook/stories/addon-docs/title-generators.ts +++ /dev/null @@ -1 +0,0 @@ -export const titleFunction = (title: string) => `Addons/Docs/${title}`; diff --git a/code/examples/official-storybook/stories/addon-highlight.stories.js b/code/examples/official-storybook/stories/addon-highlight.stories.js deleted file mode 100644 index 8f6dc6bfcb9e..000000000000 --- a/code/examples/official-storybook/stories/addon-highlight.stories.js +++ /dev/null @@ -1,104 +0,0 @@ -import React from 'react'; -import { useChannel } from '@storybook/addons'; -import { HIGHLIGHT, RESET_HIGHLIGHT } from '@storybook/addon-highlight'; -import { Page } from '../components/page/Page'; - -export default { - title: 'Addons/Highlight', - component: Page, -}; - -const Template = () => ; - -export const OneSelector = Template.bind({}); -OneSelector.decorators = [ - (storyFn) => { - const emit = useChannel({}); - - emit(HIGHLIGHT, { - elements: ['.page-title'], - }); - - return storyFn(); - }, -]; - -export const MultipleSelectors = Template.bind({}); -MultipleSelectors.decorators = [ - (storyFn) => { - const emit = useChannel({}); - - emit(HIGHLIGHT, { - elements: ['a', 'button'], - }); - - return storyFn(); - }, -]; - -export const CustomColor = Template.bind({}); -CustomColor.decorators = [ - (storyFn) => { - const emit = useChannel({}); - - emit(HIGHLIGHT, { - elements: ['.tip-wrapper'], - color: '#6c1d5c', - style: 'solid', - }); - - return storyFn(); - }, -]; - -export const OutlineStyle = Template.bind({}); -OutlineStyle.decorators = [ - (storyFn) => { - const emit = useChannel({}); - - emit(HIGHLIGHT, { - elements: ['.page-title'], - color: '#6c1d5c', - style: 'double', - }); - - return storyFn(); - }, -]; - -export const MultipleEvents = Template.bind({}); -MultipleEvents.decorators = [ - (storyFn) => { - const emit = useChannel({}); - - emit(HIGHLIGHT, { - elements: ['.tip-wrapper'], - color: '#6c1d5c', - style: 'solid', - }); - - emit(HIGHLIGHT, { - elements: ['ul'], - color: '#6c1d5c', - style: 'dotted', - }); - return storyFn(); - }, -]; - -export const Reset = Template.bind({}); -Reset.decorators = [ - (storyFn) => { - const emit = useChannel({}); - - emit(HIGHLIGHT, { - elements: ['ul'], - color: '#6c1d5c', - style: 'dotted', - }); - - emit(RESET_HIGHLIGHT); - - return storyFn(); - }, -]; diff --git a/code/examples/official-storybook/stories/addon-interactions/AccountForm.stories.tsx b/code/examples/official-storybook/stories/addon-interactions/AccountForm.stories.tsx deleted file mode 100644 index 04a715a86206..000000000000 --- a/code/examples/official-storybook/stories/addon-interactions/AccountForm.stories.tsx +++ /dev/null @@ -1,119 +0,0 @@ -/* eslint-disable @typescript-eslint/no-non-null-assertion */ -import React from 'react'; -import type { ComponentMeta, ComponentStoryObj } from '@storybook/react'; -import { userEvent, within } from '@storybook/testing-library'; - -import { AccountForm, AccountFormProps } from './AccountForm'; - -export default { - title: 'Addons/Interactions/AccountForm', - component: AccountForm, - parameters: { - layout: 'centered', - }, -} as ComponentMeta; - -type Story = ComponentStoryObj; - -const sleep = (ms: number) => new Promise((r) => setTimeout(r, ms)); - -export const Standard: Story = { - args: { passwordVerification: false }, -}; - -export const StandardEmailFilled: Story = { - ...Standard, - play: async ({ canvasElement }) => { - const canvas = within(canvasElement); - await userEvent.type(canvas.getByTestId('email'), 'michael@chromatic.com'); - }, -}; - -export const StandardEmailFailed: Story = { - ...Standard, - play: async ({ canvasElement }) => { - const canvas = within(canvasElement); - await userEvent.type(canvas.getByTestId('email'), 'michael@chromatic.com.com@com'); - await userEvent.type(canvas.getByTestId('password1'), 'testpasswordthatwontfail'); - await userEvent.click(canvas.getByTestId('submit')); - }, -}; - -export const StandardPasswordFailed: Story = { - ...Standard, - play: async (context) => { - const canvas = within(context.canvasElement); - await StandardEmailFilled.play!(context); - await userEvent.type(canvas.getByTestId('password1'), 'asdf'); - await userEvent.click(canvas.getByTestId('submit')); - }, -}; - -export const StandardFailHover: Story = { - ...StandardPasswordFailed, - play: async (context) => { - const canvas = within(context.canvasElement); - await StandardPasswordFailed.play!(context); - await sleep(100); - await userEvent.hover(canvas.getByTestId('password-error-info')); - }, -}; -StandardFailHover.parameters = { - // IE fails with userEvent.hover - chromatic: { disableSnapshot: true }, -}; - -export const Verification: Story = { - args: { passwordVerification: true }, -}; - -export const VerificationPasssword1: Story = { - ...Verification, - play: async (context) => { - const canvas = within(context.canvasElement); - await StandardEmailFilled.play!(context); - await userEvent.type(canvas.getByTestId('password1'), 'asdfasdf'); - await userEvent.click(canvas.getByTestId('submit')); - }, -}; - -export const VerificationPasswordMismatch: Story = { - ...Verification, - play: async (context) => { - const canvas = within(context.canvasElement); - await StandardEmailFilled.play!(context); - await userEvent.type(canvas.getByTestId('password1'), 'asdfasdf'); - await userEvent.type(canvas.getByTestId('password2'), 'asdf1234'); - await userEvent.click(canvas.getByTestId('submit')); - }, -}; - -export const VerificationSuccess: Story = { - ...Verification, - play: async (context) => { - const canvas = within(context.canvasElement); - await StandardEmailFilled.play!(context); - await sleep(1000); - await userEvent.type(canvas.getByTestId('password1'), 'asdfasdf', { delay: 50 }); - await sleep(1000); - await userEvent.type(canvas.getByTestId('password2'), 'asdfasdf', { delay: 50 }); - await sleep(1000); - await userEvent.click(canvas.getByTestId('submit')); - }, -}; -// IE fails with this interaction -VerificationSuccess.parameters = { - chromatic: { - disableSnapshot: true, - }, -}; - -export const StandardWithRenderFunction: Story = { - ...Standard, - render: (args: AccountFormProps) => ( -
-

This uses a custom render

- -
- ), -}; diff --git a/code/examples/official-storybook/stories/addon-interactions/AccountForm.tsx b/code/examples/official-storybook/stories/addon-interactions/AccountForm.tsx deleted file mode 100644 index 8a599f7fc09f..000000000000 --- a/code/examples/official-storybook/stories/addon-interactions/AccountForm.tsx +++ /dev/null @@ -1,553 +0,0 @@ -import React, { FC, HTMLAttributes, useCallback, useState } from 'react'; -import { keyframes, styled } from '@storybook/theming'; -import { - ErrorMessage, - Field as FormikInput, - Form as FormikForm, - Formik, - FormikProps, -} from 'formik'; -import { Icons, WithTooltip } from '@storybook/components'; - -const errorMap = { - email: { - required: { - normal: 'Please enter your email address', - tooltip: - 'We do require an email address and a password as a minimum in order to be able to create an account for you to log in with', - }, - format: { - normal: 'Please enter a correctly formatted email address', - tooltip: - 'Your email address is formatted incorrectly and is not correct - please double check for misspelling', - }, - }, - password: { - required: { - normal: 'Please enter a password', - tooltip: 'A password is required to create an account', - }, - length: { - normal: 'Please enter a password of minimum 6 characters', - tooltip: - 'For security reasons we enforce a password length of minimum 6 characters - but have no other requirements', - }, - }, - verifiedPassword: { - required: { - normal: 'Please verify your password', - tooltip: - 'Verification of your password is required to ensure no errors in the spelling of the password', - }, - match: { - normal: 'Your passwords do not match', - tooltip: - 'Your verification password has to match your password to make sure you have not misspelled', - }, - }, -}; - -// https://emailregex.com/ -const email99RegExp = new RegExp( - // eslint-disable-next-line no-useless-escape - /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/ -); - -export interface AccountFormResponse { - success: boolean; -} - -export interface AccountFormValues { - email: string; - password: string; -} - -interface FormValues extends AccountFormValues { - verifiedPassword: string; -} - -interface FormErrors { - email?: string; - emailTooltip?: string; - password?: string; - passwordTooltip?: string; - verifiedPassword?: string; - verifiedPasswordTooltip?: string; -} - -export type AccountFormProps = { - passwordVerification?: boolean; - onSubmit?: (values: AccountFormValues) => void; - onTransactionStart?: (values: AccountFormValues) => void; - onTransactionEnd?: (values: AccountFormResponse) => void; -}; - -export const AccountForm: FC = ({ - passwordVerification, - onSubmit, - onTransactionStart, - onTransactionEnd, -}) => { - const [state, setState] = useState({ - transacting: false, - transactionSuccess: false, - transactionFailure: false, - }); - - const handleFormSubmit = useCallback( - async ({ email, password }: FormValues, { setSubmitting, resetForm }) => { - if (onSubmit) { - onSubmit({ email, password }); - } - - if (onTransactionStart) { - onTransactionStart({ email, password }); - } - - setSubmitting(true); - - setState({ - ...state, - transacting: true, - }); - - await new Promise((r) => setTimeout(r, 2100)); - - const success = Math.random() < 1; - - if (onTransactionEnd) { - onTransactionEnd({ success }); - } - - setSubmitting(false); - resetForm({ values: { email: '', password: '', verifiedPassword: '' } }); - - setState({ - ...state, - transacting: false, - transactionSuccess: success === true, - transactionFailure: success === false, - }); - }, - [setState, onTransactionEnd, onTransactionStart] - ); - - return ( - - - - Storybook icon - - - - - - - - <title>Storybook - - - - - - {!state.transactionSuccess && !state.transactionFailure && ( - Create an account to join the Storybook community - )} - - {state.transactionSuccess && !state.transactionFailure && ( - -

- Everything is perfect. Your account is ready and we should probably get you started! -

-

So why don't you get started then?

- { - setState({ - transacting: false, - transactionSuccess: false, - transactionFailure: false, - }); - }} - > - Go back - - - )} - {state.transactionFailure && !state.transactionSuccess && ( - -

What a mess, this API is not working

-

- Someone should probably have a stern talking to about this, but it won't be me - coz - I'm gonna head out into the nice weather -

- { - setState({ - transacting: false, - transactionSuccess: false, - transactionFailure: false, - }); - }} - > - Go back - - - )} - {!state.transactionSuccess && !state.transactionFailure && ( - { - const errors: FormErrors = {}; - - if (!email) { - errors.email = errorMap.email.required.normal; - errors.emailTooltip = errorMap.email.required.tooltip; - } else { - const validEmail = email.match(email99RegExp); - - if (validEmail === null) { - errors.email = errorMap.email.format.normal; - errors.emailTooltip = errorMap.email.format.tooltip; - } - } - - if (!password) { - errors.password = errorMap.password.required.normal; - errors.passwordTooltip = errorMap.password.required.tooltip; - } else if (password.length < 6) { - errors.password = errorMap.password.length.normal; - errors.passwordTooltip = errorMap.password.length.tooltip; - } - - if (passwordVerification && !verifiedPassword) { - errors.verifiedPassword = errorMap.verifiedPassword.required.normal; - errors.verifiedPasswordTooltip = errorMap.verifiedPassword.required.tooltip; - } else if (passwordVerification && password !== verifiedPassword) { - errors.verifiedPassword = errorMap.verifiedPassword.match.normal; - errors.verifiedPasswordTooltip = errorMap.verifiedPassword.match.tooltip; - } - - return errors; - }} - > - {({ errors: _errors, isSubmitting, dirty }: FormikProps) => { - const errors = _errors as FormErrors; - - return ( -
- - - - {({ field }: { field: HTMLAttributes }) => ( - <> - - {errors.email && ( - {errors.emailTooltip}} - > - - - - - - )} - - )} - - - - - - {({ field }: { field: HTMLAttributes }) => ( - - )} - - {errors.password && ( - {errors.passwordTooltip}}> - - - - - - )} - - {passwordVerification && ( - - - - {({ field }: { field: HTMLAttributes }) => ( - - )} - - {errors.verifiedPassword && ( - {errors.verifiedPasswordTooltip}} - > - - - - - - )} - - )} - - - Create Account - - - Reset - - -
- ); - }} - - )} - - - ); -}; - -const Wrapper = styled.section(({ theme }) => ({ - fontFamily: theme.typography.fonts.base, - display: 'flex', - flexDirection: 'column', - alignItems: 'center', - width: 450, - padding: 32, - color: theme.color.defaultText, - backgroundColor: theme.background.content, - borderRadius: 7, -})); - -const Brand = styled.div({ - display: 'flex', - alignItems: 'center', - justifyContent: 'center', -}); - -const Title = styled.svg({ - height: 40, - zIndex: 1, - left: -32, - position: 'relative', -}); - -const logoAnimation = keyframes({ - '0': { - transform: 'rotateY(0deg)', - transformOrigin: '50% 5% 0', - }, - '100%': { - transform: 'rotateY(360deg)', - transformOrigin: '50% 5% 0', - }, -}); - -interface LogoProps { - transacting: boolean; -} - -const Logo = styled.svg( - ({ transacting }) => - transacting && { - animation: `${logoAnimation} 1250ms both infinite`, - }, - { height: 40, zIndex: 10, marginLeft: 32 } -); - -const Introduction = styled.p({ - marginTop: 20, - textAlign: 'center', -}); - -const Content = styled.div({ - display: 'flex', - alignItems: 'flex-start', - justifyContent: 'center', - width: 350, - minHeight: 189, - marginTop: 8, -}); - -const Presentation = styled.div({ - textAlign: 'center', -}); - -const Form = styled(FormikForm)({ - width: '100%', - alignSelf: 'flex-start', - '&[aria-disabled="true"]': { - opacity: 0.6, - }, -}); - -const FieldWrapper = styled.div({ - display: 'flex', - flexDirection: 'column', - justifyContent: 'stretch', - marginBottom: 10, -}); - -const Label = styled.label({ - fontSize: 13, - fontWeight: 500, - marginBottom: 6, -}); - -const Input = styled.input(({ theme }) => ({ - fontSize: 14, - color: theme.color.defaultText, - padding: '10px 15px', - borderRadius: 4, - appearance: 'none', - outline: 'none', - border: '0 none', - boxShadow: 'rgb(0 0 0 / 10%) 0px 0px 0px 1px inset', - '&:focus': { - boxShadow: 'rgb(30 167 253) 0px 0px 0px 1px inset', - }, - '&:active': { - boxShadow: 'rgb(30 167 253) 0px 0px 0px 1px inset', - }, - '&[aria-invalid="true"]': { - boxShadow: 'rgb(255 68 0) 0px 0px 0px 1px inset', - }, -})); - -const ErrorWrapper = styled.div({ - display: 'flex', - alignItems: 'flex-start', - fontSize: 11, - marginTop: 6, - cursor: 'help', -}); - -const ErrorIcon = styled(Icons)(({ theme }) => ({ - fill: theme.color.defaultText, - opacity: 0.8, - marginRight: 6, - marginLeft: 2, - marginTop: 1, -})); - -const ErrorTooltip = styled.div(({ theme }) => ({ - fontFamily: theme.typography.fonts.base, - fontSize: 13, - padding: 8, - maxWidth: 350, -})); - -const Actions = styled.div({ - alignSelf: 'stretch', - display: 'flex', - justifyContent: 'space-between', - marginTop: 24, -}); - -const Error = styled(ErrorMessage)({}); - -interface ButtonProps { - dirty?: boolean; -} - -const Button = styled.button({ - backgroundColor: 'transparent', - border: '0 none', - outline: 'none', - appearance: 'none', - fontWeight: 500, - fontSize: 12, - flexBasis: '50%', - cursor: 'pointer', - padding: '11px 16px', - borderRadius: 4, - textTransform: 'uppercase', - '&:focus': { - textDecoration: 'underline', - fontWeight: 700, - }, - '&:active': { - textDecoration: 'underline', - fontWeight: 700, - }, - '&[aria-disabled="true"]': { - cursor: 'default', - }, -}); - -const Submit = styled(Button)(({ theme, dirty }) => ({ - marginRight: 8, - backgroundColor: theme.color.secondary, - color: theme.color.lightest, - opacity: dirty ? 1 : 0.6, - boxShadow: 'rgb(30 167 253 / 10%) 0 0 0 1px inset', -})); - -const Reset = styled(Button)(({ theme }) => ({ - marginLeft: 8, - boxShadow: 'rgb(30 167 253) 0 0 0 1px inset', - color: theme.color.secondary, -})); diff --git a/code/examples/official-storybook/stories/addon-jest.stories.js b/code/examples/official-storybook/stories/addon-jest.stories.js deleted file mode 100644 index abb0aad1ae6d..000000000000 --- a/code/examples/official-storybook/stories/addon-jest.stories.js +++ /dev/null @@ -1,17 +0,0 @@ -import React from 'react'; -import { withTests as withTestsHOC } from '@storybook/addon-jest'; - -import results from './addon-jest.testresults.json'; - -export default { - title: 'Addons/Jest', - decorators: [withTestsHOC({ results })], -}; - -export const WithTests = () =>

Hello

; -WithTests.parameters = { jest: 'addon-jest' }; - -export const WithInferredTests = () =>

Inferred Tests

; - -export const DisabledTests = () =>

Disabled Tests

; -DisabledTests.parameters = { jest: { disabled: true } }; diff --git a/code/examples/official-storybook/stories/addon-jest.testresults.json b/code/examples/official-storybook/stories/addon-jest.testresults.json deleted file mode 100644 index f8cd25c7110d..000000000000 --- a/code/examples/official-storybook/stories/addon-jest.testresults.json +++ /dev/null @@ -1,140 +0,0 @@ -{ - "numFailedTestSuites": 1, - "numFailedTests": 4, - "numPassedTestSuites": 0, - "numPassedTests": 3, - "numPendingTestSuites": 0, - "numPendingTests": 2, - "numRuntimeErrorTestSuites": 0, - "numTodoTests": 2, - "numTotalTestSuites": 1, - "numTotalTests": 11, - "openHandles": [], - "snapshot": { - "added": 0, - "didUpdate": false, - "failure": true, - "filesAdded": 0, - "filesRemoved": 1, - "filesUnmatched": 0, - "filesUpdated": 0, - "matched": 0, - "total": 0, - "unchecked": 0, - "uncheckedKeysByFile": [], - "unmatched": 0, - "updated": 0 - }, - "startTime": 1564439110263, - "success": false, - "testResults": [ - { - "assertionResults": [ - { - "ancestorTitles": [], - "failureMessages": [], - "fullName": "true should be true", - "location": null, - "status": "passed", - "title": "true should be true" - }, - { - "ancestorTitles": ["In a describe: "], - "failureMessages": [], - "fullName": "In a describe: true should still be true", - "location": null, - "status": "passed", - "title": "true should still be true" - }, - { - "ancestorTitles": ["In a describe: "], - "failureMessages": [], - "fullName": "In a describe: a list should contain 3 items", - "location": null, - "status": "passed", - "title": "a list should contain 3 items" - }, - { - "ancestorTitles": ["In a describe: "], - "failureMessages": [ - "Error: \u001b[2mexpect(\u001b[22m\u001b[31mreceived\u001b[39m\u001b[2m).\u001b[22mtoEqual\u001b[2m(\u001b[22m\u001b[32mexpected\u001b[39m\u001b[2m) // deep equality\u001b[22m\n\nExpected: \u001b[32m\"everything is awesome\"\u001b[39m\nReceived: \u001b[31m\"everything is all right\"\u001b[39m\n at Object.toEqual (/Users/fabianrademacher/React/storybook/examples/official-storybook/tests/addon-jest.test.js:16:39)\n at Object.asyncJestTest (/Users/fabianrademacher/React/storybook/node_modules/jest-jasmine2/build/jasmineAsyncInstall.js:102:37)\n at resolve (/Users/fabianrademacher/React/storybook/node_modules/jest-jasmine2/build/queueRunner.js:43:12)\n at new Promise ()\n at mapper (/Users/fabianrademacher/React/storybook/node_modules/jest-jasmine2/build/queueRunner.js:26:19)\n at promise.then (/Users/fabianrademacher/React/storybook/node_modules/jest-jasmine2/build/queueRunner.js:73:41)\n at process._tickCallback (internal/process/next_tick.js:68:7)" - ], - "fullName": "In a describe: everything is awesome", - "location": null, - "status": "failed", - "title": "everything is awesome" - }, - { - "ancestorTitles": ["A bunch of failing tests: "], - "failureMessages": [ - "Error: \u001b[2mexpect(\u001b[22m\u001b[31mreceived\u001b[39m\u001b[2m).\u001b[22mtoBe\u001b[2m(\u001b[22m\u001b[32mexpected\u001b[39m\u001b[2m) // Object.is equality\u001b[22m\n\nExpected: \u001b[32mfalse\u001b[39m\nReceived: \u001b[31mtrue\u001b[39m\n at Object.toBe (/Users/fabianrademacher/React/storybook/examples/official-storybook/tests/addon-jest.test.js:22:18)\n at Object.asyncJestTest (/Users/fabianrademacher/React/storybook/node_modules/jest-jasmine2/build/jasmineAsyncInstall.js:102:37)\n at resolve (/Users/fabianrademacher/React/storybook/node_modules/jest-jasmine2/build/queueRunner.js:43:12)\n at new Promise ()\n at mapper (/Users/fabianrademacher/React/storybook/node_modules/jest-jasmine2/build/queueRunner.js:26:19)\n at promise.then (/Users/fabianrademacher/React/storybook/node_modules/jest-jasmine2/build/queueRunner.js:73:41)\n at process._tickCallback (internal/process/next_tick.js:68:7)" - ], - "fullName": "A bunch of failing tests: true should still be true", - "location": null, - "status": "failed", - "title": "true should still be true" - }, - { - "ancestorTitles": ["A bunch of failing tests: "], - "failureMessages": [ - "Error: \u001b[2mexpect(\u001b[22m\u001b[31mreceived\u001b[39m\u001b[2m).\u001b[22mtoContain\u001b[2m(\u001b[22m\u001b[32mexpected\u001b[39m\u001b[2m) // indexOf\u001b[22m\n\nExpected value: \u001b[32m301\u001b[39m\nReceived array: \u001b[31m[\"a\", \"b\", \"3\"]\u001b[39m\n at Object.toContain (/Users/fabianrademacher/React/storybook/examples/official-storybook/tests/addon-jest.test.js:26:29)\n at Object.asyncJestTest (/Users/fabianrademacher/React/storybook/node_modules/jest-jasmine2/build/jasmineAsyncInstall.js:102:37)\n at resolve (/Users/fabianrademacher/React/storybook/node_modules/jest-jasmine2/build/queueRunner.js:43:12)\n at new Promise ()\n at mapper (/Users/fabianrademacher/React/storybook/node_modules/jest-jasmine2/build/queueRunner.js:26:19)\n at promise.then (/Users/fabianrademacher/React/storybook/node_modules/jest-jasmine2/build/queueRunner.js:73:41)\n at process._tickCallback (internal/process/next_tick.js:68:7)" - ], - "fullName": "A bunch of failing tests: a list should contain 3 items", - "location": null, - "status": "failed", - "title": "a list should contain 3 items" - }, - { - "ancestorTitles": ["A bunch of failing tests: "], - "failureMessages": [ - "Error: \u001b[2mexpect(\u001b[22m\u001b[31mreceived\u001b[39m\u001b[2m).\u001b[22mtoThrow\u001b[2m()\u001b[22m\n\nReceived function did not throw\n at Object.toThrow (/Users/fabianrademacher/React/storybook/examples/official-storybook/tests/addon-jest.test.js:30:22)\n at Object.asyncJestTest (/Users/fabianrademacher/React/storybook/node_modules/jest-jasmine2/build/jasmineAsyncInstall.js:102:37)\n at resolve (/Users/fabianrademacher/React/storybook/node_modules/jest-jasmine2/build/queueRunner.js:43:12)\n at new Promise ()\n at mapper (/Users/fabianrademacher/React/storybook/node_modules/jest-jasmine2/build/queueRunner.js:26:19)\n at promise.then (/Users/fabianrademacher/React/storybook/node_modules/jest-jasmine2/build/queueRunner.js:73:41)\n at process._tickCallback (internal/process/next_tick.js:68:7)" - ], - "fullName": "A bunch of failing tests: should work", - "location": null, - "status": "failed", - "title": "should work" - }, - { - "ancestorTitles": ["A bunch of failing tests: "], - "failureMessages": [], - "fullName": "A bunch of failing tests: Test this Todo later", - "location": null, - "status": "todo", - "title": "Test this Todo later" - }, - { - "ancestorTitles": ["Skipped tests:"], - "failureMessages": [], - "fullName": "Skipped tests: Would be true if not skipped", - "location": null, - "status": "pending", - "title": "Would be true if not skipped" - }, - { - "ancestorTitles": ["Skipped tests:"], - "failureMessages": [], - "fullName": "Skipped tests: Could fail, if not skipped", - "location": null, - "status": "pending", - "title": "Could fail, if not skipped" - }, - { - "ancestorTitles": ["Skipped tests:"], - "failureMessages": [], - "fullName": "Skipped tests: Test Todo is not skipped", - "location": null, - "status": "todo", - "title": "Test Todo is not skipped" - } - ], - "endTime": 1564439111804, - "message": "\u001b[1m\u001b[31m \u001b[1m● \u001b[1mIn a describe: › everything is awesome\u001b[39m\u001b[22m\n\n \u001b[2mexpect(\u001b[22m\u001b[31mreceived\u001b[39m\u001b[2m).\u001b[22mtoEqual\u001b[2m(\u001b[22m\u001b[32mexpected\u001b[39m\u001b[2m) // deep equality\u001b[22m\n\n Expected: \u001b[32m\"everything is awesome\"\u001b[39m\n Received: \u001b[31m\"everything is all right\"\u001b[39m\n\u001b[2m\u001b[22m\n\u001b[2m \u001b[0m \u001b[90m 14 | \u001b[39m\u001b[0m\u001b[22m\n\u001b[2m \u001b[0m \u001b[90m 15 | \u001b[39m test(\u001b[32m'everything is awesome'\u001b[39m\u001b[33m,\u001b[39m () \u001b[33m=>\u001b[39m {\u001b[0m\u001b[22m\n\u001b[2m \u001b[0m\u001b[31m\u001b[1m>\u001b[2m\u001b[39m\u001b[90m 16 | \u001b[39m expect(\u001b[32m'everything is all right'\u001b[39m)\u001b[33m.\u001b[39mtoEqual(\u001b[32m'everything is awesome'\u001b[39m)\u001b[33m;\u001b[39m\u001b[0m\u001b[22m\n\u001b[2m \u001b[0m \u001b[90m | \u001b[39m \u001b[31m\u001b[1m^\u001b[2m\u001b[39m\u001b[0m\u001b[22m\n\u001b[2m \u001b[0m \u001b[90m 17 | \u001b[39m })\u001b[33m;\u001b[39m\u001b[0m\u001b[22m\n\u001b[2m \u001b[0m \u001b[90m 18 | \u001b[39m})\u001b[33m;\u001b[39m\u001b[0m\u001b[22m\n\u001b[2m \u001b[0m \u001b[90m 19 | \u001b[39m\u001b[0m\u001b[22m\n\u001b[2m\u001b[22m\n\u001b[2m \u001b[2mat Object.toEqual (\u001b[2m\u001b[0m\u001b[36mexamples/official-storybook/tests/addon-jest.test.js\u001b[39m\u001b[0m\u001b[2m:16:39)\u001b[2m\u001b[22m\n\n\u001b[1m\u001b[31m \u001b[1m● \u001b[1mA bunch of failing tests: › true should still be true\u001b[39m\u001b[22m\n\n \u001b[2mexpect(\u001b[22m\u001b[31mreceived\u001b[39m\u001b[2m).\u001b[22mtoBe\u001b[2m(\u001b[22m\u001b[32mexpected\u001b[39m\u001b[2m) // Object.is equality\u001b[22m\n\n Expected: \u001b[32mfalse\u001b[39m\n Received: \u001b[31mtrue\u001b[39m\n\u001b[2m\u001b[22m\n\u001b[2m \u001b[0m \u001b[90m 20 | \u001b[39mdescribe(\u001b[32m'A bunch of failing tests: '\u001b[39m\u001b[33m,\u001b[39m () \u001b[33m=>\u001b[39m {\u001b[0m\u001b[22m\n\u001b[2m \u001b[0m \u001b[90m 21 | \u001b[39m test(\u001b[32m'true should still be true'\u001b[39m\u001b[33m,\u001b[39m () \u001b[33m=>\u001b[39m {\u001b[0m\u001b[22m\n\u001b[2m \u001b[0m\u001b[31m\u001b[1m>\u001b[2m\u001b[39m\u001b[90m 22 | \u001b[39m expect(\u001b[36mtrue\u001b[39m)\u001b[33m.\u001b[39mtoBe(\u001b[36mfalse\u001b[39m)\u001b[33m;\u001b[39m\u001b[0m\u001b[22m\n\u001b[2m \u001b[0m \u001b[90m | \u001b[39m \u001b[31m\u001b[1m^\u001b[2m\u001b[39m\u001b[0m\u001b[22m\n\u001b[2m \u001b[0m \u001b[90m 23 | \u001b[39m })\u001b[33m;\u001b[39m\u001b[0m\u001b[22m\n\u001b[2m \u001b[0m \u001b[90m 24 | \u001b[39m\u001b[0m\u001b[22m\n\u001b[2m \u001b[0m \u001b[90m 25 | \u001b[39m test(\u001b[32m'a list should contain 3 items'\u001b[39m\u001b[33m,\u001b[39m () \u001b[33m=>\u001b[39m {\u001b[0m\u001b[22m\n\u001b[2m\u001b[22m\n\u001b[2m \u001b[2mat Object.toBe (\u001b[2m\u001b[0m\u001b[36mexamples/official-storybook/tests/addon-jest.test.js\u001b[39m\u001b[0m\u001b[2m:22:18)\u001b[2m\u001b[22m\n\n\u001b[1m\u001b[31m \u001b[1m● \u001b[1mA bunch of failing tests: › a list should contain 3 items\u001b[39m\u001b[22m\n\n \u001b[2mexpect(\u001b[22m\u001b[31mreceived\u001b[39m\u001b[2m).\u001b[22mtoContain\u001b[2m(\u001b[22m\u001b[32mexpected\u001b[39m\u001b[2m) // indexOf\u001b[22m\n\n Expected value: \u001b[32m301\u001b[39m\n Received array: \u001b[31m[\"a\", \"b\", \"3\"]\u001b[39m\n\u001b[2m\u001b[22m\n\u001b[2m \u001b[0m \u001b[90m 24 | \u001b[39m\u001b[0m\u001b[22m\n\u001b[2m \u001b[0m \u001b[90m 25 | \u001b[39m test(\u001b[32m'a list should contain 3 items'\u001b[39m\u001b[33m,\u001b[39m () \u001b[33m=>\u001b[39m {\u001b[0m\u001b[22m\n\u001b[2m \u001b[0m\u001b[31m\u001b[1m>\u001b[2m\u001b[39m\u001b[90m 26 | \u001b[39m expect([\u001b[32m'a'\u001b[39m\u001b[33m,\u001b[39m \u001b[32m'b'\u001b[39m\u001b[33m,\u001b[39m \u001b[32m'3'\u001b[39m])\u001b[33m.\u001b[39mtoContain(\u001b[35m301\u001b[39m)\u001b[33m;\u001b[39m\u001b[0m\u001b[22m\n\u001b[2m \u001b[0m \u001b[90m | \u001b[39m \u001b[31m\u001b[1m^\u001b[2m\u001b[39m\u001b[0m\u001b[22m\n\u001b[2m \u001b[0m \u001b[90m 27 | \u001b[39m })\u001b[33m;\u001b[39m\u001b[0m\u001b[22m\n\u001b[2m \u001b[0m \u001b[90m 28 | \u001b[39m\u001b[0m\u001b[22m\n\u001b[2m \u001b[0m \u001b[90m 29 | \u001b[39m test(\u001b[32m'should work'\u001b[39m\u001b[33m,\u001b[39m () \u001b[33m=>\u001b[39m {\u001b[0m\u001b[22m\n\u001b[2m\u001b[22m\n\u001b[2m \u001b[2mat Object.toContain (\u001b[2m\u001b[0m\u001b[36mexamples/official-storybook/tests/addon-jest.test.js\u001b[39m\u001b[0m\u001b[2m:26:29)\u001b[2m\u001b[22m\n\n\u001b[1m\u001b[31m \u001b[1m● \u001b[1mA bunch of failing tests: › should work\u001b[39m\u001b[22m\n\n \u001b[2mexpect(\u001b[22m\u001b[31mreceived\u001b[39m\u001b[2m).\u001b[22mtoThrow\u001b[2m()\u001b[22m\n\n Received function did not throw\n\u001b[2m\u001b[22m\n\u001b[2m \u001b[0m \u001b[90m 28 | \u001b[39m\u001b[0m\u001b[22m\n\u001b[2m \u001b[0m \u001b[90m 29 | \u001b[39m test(\u001b[32m'should work'\u001b[39m\u001b[33m,\u001b[39m () \u001b[33m=>\u001b[39m {\u001b[0m\u001b[22m\n\u001b[2m \u001b[0m\u001b[31m\u001b[1m>\u001b[2m\u001b[39m\u001b[90m 30 | \u001b[39m expect(() \u001b[33m=>\u001b[39m {})\u001b[33m.\u001b[39mtoThrow()\u001b[33m;\u001b[39m\u001b[0m\u001b[22m\n\u001b[2m \u001b[0m \u001b[90m | \u001b[39m \u001b[31m\u001b[1m^\u001b[2m\u001b[39m\u001b[0m\u001b[22m\n\u001b[2m \u001b[0m \u001b[90m 31 | \u001b[39m })\u001b[33m;\u001b[39m\u001b[0m\u001b[22m\n\u001b[2m \u001b[0m \u001b[90m 32 | \u001b[39m\u001b[0m\u001b[22m\n\u001b[2m \u001b[0m \u001b[90m 33 | \u001b[39m test\u001b[33m.\u001b[39mtodo(\u001b[32m'Test this Todo later'\u001b[39m)\u001b[0m\u001b[22m\n\u001b[2m\u001b[22m\n\u001b[2m \u001b[2mat Object.toThrow (\u001b[2m\u001b[0m\u001b[36mexamples/official-storybook/tests/addon-jest.test.js\u001b[39m\u001b[0m\u001b[2m:30:22)\u001b[2m\u001b[22m\n", - "name": "/Users/fabianrademacher/React/storybook/examples/official-storybook/tests/addon-jest.test.js", - "startTime": 1564439111282, - "status": "failed", - "summary": "" - } - ], - "wasInterrupted": false, - "coverageMap": {} -} diff --git a/code/examples/official-storybook/stories/addon-measure/BoxModel.stories.js b/code/examples/official-storybook/stories/addon-measure/BoxModel.stories.js deleted file mode 100644 index 17876cde74b4..000000000000 --- a/code/examples/official-storybook/stories/addon-measure/BoxModel.stories.js +++ /dev/null @@ -1,118 +0,0 @@ -import React from 'react'; -import { Visualization } from '../../components/addon-measure/Visualization'; - -export default { - title: 'Addons/Measure/BoxModel', - parameters: { - layout: 'fullscreen', - }, -}; - -const Template = (args) => ; - -export const MarginUniform = Template.bind({}); -MarginUniform.args = { - render: (ref) => ( -
- ), -}; - -export const MarginAsymmetric = Template.bind({}); -MarginAsymmetric.args = { - render: (ref) => ( -
- ), -}; - -export const PaddingUniform = Template.bind({}); -PaddingUniform.args = { - render: (ref) => ( -
- ), -}; - -export const PaddingAsymmetric = Template.bind({}); -PaddingAsymmetric.args = { - render: (ref) => ( -
- ), -}; - -export const BorderUniform = Template.bind({}); -BorderUniform.args = { - render: (ref) => ( -
- ), -}; - -export const BorderAsymmetric = Template.bind({}); -BorderAsymmetric.args = { - render: (ref) => ( -
- ), -}; - -export const DecimalSizing = Template.bind({}); -DecimalSizing.args = { - render: (ref) => ( -
- ), -}; diff --git a/code/examples/official-storybook/stories/addon-measure/Grid.stories.js b/code/examples/official-storybook/stories/addon-measure/Grid.stories.js deleted file mode 100644 index f9849389bf6d..000000000000 --- a/code/examples/official-storybook/stories/addon-measure/Grid.stories.js +++ /dev/null @@ -1,46 +0,0 @@ -import React from 'react'; - -export default { - title: 'Addons/Measure/Grid', -}; - -const MeasureButton = () => ( - - - -); - -export const Basic = () => ( -
-
- {[1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12].map((id) => ( -
- {id} -
- ))} -
-

- Click the measure button in the toolbar to enable the addon -

-
-); diff --git a/code/examples/official-storybook/stories/addon-measure/ShadowRoot.stories.js b/code/examples/official-storybook/stories/addon-measure/ShadowRoot.stories.js deleted file mode 100644 index eec397d9d8d7..000000000000 --- a/code/examples/official-storybook/stories/addon-measure/ShadowRoot.stories.js +++ /dev/null @@ -1,26 +0,0 @@ -import React from 'react'; - -import { ShadowRoot } from '../../components/addon-measure/ShadowRoot'; - -export default { - title: 'Addons/Measure/ShadowRoot', - component: ShadowRoot, -}; - -const Template = (args) => ( -
- -
-); - -export const Root = Template.bind({}); - -export const Nested = Template.bind({}); -Nested.args = { - drawMode: 'NESTED', -}; diff --git a/code/examples/official-storybook/stories/addon-measure/SmallNode.stories.js b/code/examples/official-storybook/stories/addon-measure/SmallNode.stories.js deleted file mode 100644 index 6a38904f5d21..000000000000 --- a/code/examples/official-storybook/stories/addon-measure/SmallNode.stories.js +++ /dev/null @@ -1,73 +0,0 @@ -import React from 'react'; -import { Visualization } from '../../components/addon-measure/Visualization'; - -export default { - title: 'Addons/Measure/SmallNode', - parameters: { - layout: 'fullscreen', - }, -}; - -const Template = (args) => ; - -export const Everything30px = Template.bind({}); -Everything30px.args = { - render: (ref) => ( -
- ), -}; - -export const Short = Template.bind({}); -Short.args = { - render: (ref) => ( -
- ), -}; - -export const Narrow = Template.bind({}); -Narrow.args = { - render: (ref) => ( -
- ), -}; - -export const Tiny = Template.bind({}); -Tiny.args = { - render: (ref) => ( -
- ), -}; diff --git a/code/examples/official-storybook/stories/addon-measure/StackingLabels.stories.js b/code/examples/official-storybook/stories/addon-measure/StackingLabels.stories.js deleted file mode 100644 index cd8197237dec..000000000000 --- a/code/examples/official-storybook/stories/addon-measure/StackingLabels.stories.js +++ /dev/null @@ -1,67 +0,0 @@ -import React from 'react'; -import { Visualization } from '../../components/addon-measure/Visualization'; - -export default { - title: 'Addons/Measure/StackingLabels', - parameters: { - layout: 'fullscreen', - }, -}; - -const Template = (args) => ; - -export const EverythingUniform = Template.bind({}); -EverythingUniform.args = { - render: (ref) => ( -
- ), -}; - -export const Asymmetric = Template.bind({}); -Asymmetric.args = { - render: (ref) => ( -
- ), -}; - -export const MoreAsymmetric = Template.bind({}); -MoreAsymmetric.args = { - render: (ref) => ( -
- ), -}; diff --git a/code/examples/official-storybook/stories/addon-outline.stories.js b/code/examples/official-storybook/stories/addon-outline.stories.js deleted file mode 100644 index 714616c6ea3e..000000000000 --- a/code/examples/official-storybook/stories/addon-outline.stories.js +++ /dev/null @@ -1,46 +0,0 @@ -import React from 'react'; - -export default { - title: 'Addons/Outline', -}; - -const OutlineButton = () => ( - - - -); - -export const Basic = () => ( -
-
- {[1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12].map((id) => ( -
- {id} -
- ))} -
-

- Click the outline button in the toolbar to toggle outlines -

-
-); diff --git a/code/examples/official-storybook/stories/addon-storyshots.stories.js b/code/examples/official-storybook/stories/addon-storyshots.stories.js deleted file mode 100644 index 057b87c42b40..000000000000 --- a/code/examples/official-storybook/stories/addon-storyshots.stories.js +++ /dev/null @@ -1,41 +0,0 @@ -/* eslint-disable storybook/use-storybook-expect */ -/* eslint-disable storybook/await-interactions */ -import React, { useState } from 'react'; -import { styled } from '@storybook/theming'; - -const BlockDiv = styled.div({ - display: 'inline-block', - height: 400, - width: 400, - background: 'hotpink', -}); - -export default { - title: 'Addons/Storyshots', -}; - -export const Block = () => { - const [hover, setHover] = useState(false); - - return ( - setHover(true)} - onMouseLeave={() => setHover(false)} - > - {hover && 'I am hovered'} - - ); -}; -Block.storyName = 'Block story'; - -Block.parameters = { - async puppeteerTest(page) { - const element = await page.$('[data-test-block]'); - await element.hover(); - const textContent = await element.getProperty('textContent'); - const text = await textContent.jsonValue(); - // eslint-disable-next-line jest/no-standalone-expect - expect(text).toBe('I am hovered'); - }, -}; diff --git a/code/examples/official-storybook/stories/demo/button.stories.js b/code/examples/official-storybook/stories/demo/button.stories.js deleted file mode 100644 index 1eb7cd97d65a..000000000000 --- a/code/examples/official-storybook/stories/demo/button.stories.js +++ /dev/null @@ -1,44 +0,0 @@ -import React, { useState } from 'react'; -import { Button } from '../../components/react-demo'; - -export default { - title: 'Other/Demo/Button', - component: Button, - id: 'demo-button-id', - parameters: { - docs: { - inlineStories: false, - description: { - component: 'Component description **markdown** override', - }, - }, - }, -}; - -export const WithText = () => ; -WithText.storyName = 'with text'; - -export const WithSomeEmoji = () => ( - -); -WithSomeEmoji.storyName = 'with some emoji'; - -export const WithCounter = () => { - const [counter, setCounter] = useState(0); - const label = `Testing: ${counter}`; - return ; -}; - -WithCounter.storyName = 'with counter'; - -WithCounter.parameters = { - docs: { - description: { - story: 'This demonstrates react hooks working inside stories. **Go team!** 🚀', - }, - }, -}; diff --git a/code/examples/official-storybook/stories/demo/button.stories.mdx b/code/examples/official-storybook/stories/demo/button.stories.mdx deleted file mode 100644 index 2e58b5902939..000000000000 --- a/code/examples/official-storybook/stories/demo/button.stories.mdx +++ /dev/null @@ -1,37 +0,0 @@ -import { useState } from 'react'; -import { Meta, Story, Canvas, ArgsTable } from '@storybook/addon-docs'; -import { Button } from '../../components/react-demo'; - - - -# Simple Button - - - -## Hello - - - - - -## Emoji - - - - - -## Counter w/ Code - - - - {() => { - const [counter, setCounter] = useState(0); - const label = `Testing: ${counter}`; - return ; - }} - - diff --git a/code/examples/official-storybook/stories/demo/csf-embedding.test.js b/code/examples/official-storybook/stories/demo/csf-embedding.test.js deleted file mode 100644 index a0fcc5b96301..000000000000 --- a/code/examples/official-storybook/stories/demo/csf-embedding.test.js +++ /dev/null @@ -1,11 +0,0 @@ -import React from 'react'; -import { render, fireEvent } from '@testing-library/react'; -import { WithCounter } from './button.stories'; - -describe('module story embedding', () => { - it('should test story state', () => { - const comp = render(); - fireEvent.click(comp.getByText('Testing: 0')); - expect(comp.getByText('Testing: 1')).toBeTruthy(); - }); -}); diff --git a/code/examples/official-storybook/stories/demo/setup.stories.tsx b/code/examples/official-storybook/stories/demo/setup.stories.tsx deleted file mode 100644 index 3c83fbbf341f..000000000000 --- a/code/examples/official-storybook/stories/demo/setup.stories.tsx +++ /dev/null @@ -1,22 +0,0 @@ -/* eslint-disable storybook/use-storybook-testing-library */ -// @TODO: use addon-interactions and remove the rule disable above -import React from 'react'; -import { screen } from '@testing-library/dom'; -import userEvent from '@testing-library/user-event'; - -const Input = () => ; - -export default { - title: 'Other/Demo/Setup', - component: Input, -}; - -export const WithPlay = { - play: async () => { - const inputs = screen.getAllByTestId('test-input'); - for (let i = 0; i < inputs.length; i += 1) { - // eslint-disable-next-line no-await-in-loop - await userEvent.type(inputs[i], 'asdfasdf', { delay: 10 }); - } - }, -}; diff --git a/code/examples/official-storybook/stories/demo/typed-button.stories.tsx b/code/examples/official-storybook/stories/demo/typed-button.stories.tsx deleted file mode 100644 index 2d8b11414e34..000000000000 --- a/code/examples/official-storybook/stories/demo/typed-button.stories.tsx +++ /dev/null @@ -1,32 +0,0 @@ -import React from 'react'; -import type { ComponentMeta, StoryFn, ComponentStoryFn } from '@storybook/react'; -import TsButton from '../../components/TsButton'; - -export default { - title: 'Other/Demo/TsButton', - component: TsButton, - decorators: [ - (StoryFn) => ( - <> - - - ), - ], -} as ComponentMeta; - -const Template: StoryFn = (args) => ; - -export const Basic = Template.bind({}); -Basic.args = { - type: 'default', - children: 'basic', -}; - -const TypedTemplate: ComponentStoryFn = (args) => ; - -export const Typed = TypedTemplate.bind({}); -Typed.args = { - type: 'action', - children: 'typed', - foo: 'bar', // should be a type error? -}; diff --git a/code/examples/official-storybook/stories/demo/welcome.stories.js b/code/examples/official-storybook/stories/demo/welcome.stories.js deleted file mode 100644 index 491b1b57e0c2..000000000000 --- a/code/examples/official-storybook/stories/demo/welcome.stories.js +++ /dev/null @@ -1,13 +0,0 @@ -import React from 'react'; -import { Welcome } from '../../components/react-demo'; - -export default { - title: 'Other/Demo/Welcome', - component: Welcome, -}; - -// Some other valid values: -// - 'other-demo-buttonmdx--with-text' -// - 'Other/Demo/ButtonMdx' -export const ToStorybook = () => {}} />; -ToStorybook.storyName = 'to Storybook'; diff --git a/code/examples/official-storybook/stories/notes/notes.md b/code/examples/official-storybook/stories/notes/notes.md deleted file mode 100644 index 13744bcc6e1d..000000000000 --- a/code/examples/official-storybook/stories/notes/notes.md +++ /dev/null @@ -1,11 +0,0 @@ -# This is a Markdown File - -#### It is imported and compiled using a webpack markdown loader - ---- - -Supports code snippets too: - -```jsx -
Foo
-``` diff --git a/code/examples/official-storybook/stories/notes/notes.mdx b/code/examples/official-storybook/stories/notes/notes.mdx deleted file mode 100644 index 90213a7cc411..000000000000 --- a/code/examples/official-storybook/stories/notes/notes.mdx +++ /dev/null @@ -1,12 +0,0 @@ -import { ArgsTable, Story } from '@storybook/addon-docs'; -import Button from '../../components/TsButton'; - -# Welcome! - -Let's write markdown without stories - -But we can still use doc blocks in our stories - - - - diff --git a/code/examples/official-storybook/storyshots-puppeteer/__image_snapshots__/storyshots-image-runner-js-image-snapshots-addons-storyshots-block-story-1-snap.png b/code/examples/official-storybook/storyshots-puppeteer/__image_snapshots__/storyshots-image-runner-js-image-snapshots-addons-storyshots-block-story-1-snap.png deleted file mode 100644 index 0d37ca666cef..000000000000 Binary files a/code/examples/official-storybook/storyshots-puppeteer/__image_snapshots__/storyshots-image-runner-js-image-snapshots-addons-storyshots-block-story-1-snap.png and /dev/null differ diff --git a/code/examples/official-storybook/storyshots-puppeteer/axe-tests.runner.js b/code/examples/official-storybook/storyshots-puppeteer/axe-tests.runner.js deleted file mode 100644 index 05dde656719d..000000000000 --- a/code/examples/official-storybook/storyshots-puppeteer/axe-tests.runner.js +++ /dev/null @@ -1,19 +0,0 @@ -/* This file is not suffixed by ".test.js" to not being run with all other test files. - * This test needs the static build of the storybook to run. - * `yarn run storyshots-puppeteer` generates the static build & uses storyshots-puppeteer. - * */ -import path from 'path'; -import initStoryshots from '@storybook/addon-storyshots'; -import { axeTest } from '@storybook/addon-storyshots-puppeteer'; -import getStorybookUrl from './getStorybookUrl'; - -const storybookUrl = getStorybookUrl(); -if (storybookUrl != null) { - initStoryshots({ - suite: 'Puppeteer tests', - storyKindRegex: /^Basics|UI/, - framework: 'react', - configPath: path.join(__dirname, '..'), - test: axeTest({ storybookUrl }), - }); -} diff --git a/code/examples/official-storybook/storyshots-puppeteer/getStorybookUrl.js b/code/examples/official-storybook/storyshots-puppeteer/getStorybookUrl.js deleted file mode 100644 index 913acc6c592c..000000000000 --- a/code/examples/official-storybook/storyshots-puppeteer/getStorybookUrl.js +++ /dev/null @@ -1,18 +0,0 @@ -import path from 'path'; -import fs from 'fs'; -import { logger } from '@storybook/node-logger'; - -export default function getStorybookUrl() { - if (process.env.USE_DEV_SERVER) { - return 'http://localhost:9011'; - } - - const pathToStorybookStatic = path.join(__dirname, '../', 'storybook-static'); - if (!fs.existsSync(pathToStorybookStatic)) { - logger.error( - 'You are running puppeteer tests without having the static build of storybook. Please run "yarn run build-storybook" before running tests.' - ); - return null; - } - return `file://${pathToStorybookStatic}`; -} diff --git a/code/examples/official-storybook/storyshots-puppeteer/jest.config.js b/code/examples/official-storybook/storyshots-puppeteer/jest.config.js deleted file mode 100644 index 427991f8b937..000000000000 --- a/code/examples/official-storybook/storyshots-puppeteer/jest.config.js +++ /dev/null @@ -1,11 +0,0 @@ -const path = require('path'); -const globalJestConfig = require('../../../jest.config'); - -const finalJestConfig = { ...globalJestConfig }; - -finalJestConfig.rootDir = path.join(__dirname, '../../..'); -finalJestConfig.testMatch = [ - '/examples/official-storybook/storyshots-puppeteer/*.runner.js', -]; - -module.exports = finalJestConfig; diff --git a/code/examples/official-storybook/storyshots-puppeteer/puppeteer-tests.runner.js b/code/examples/official-storybook/storyshots-puppeteer/puppeteer-tests.runner.js deleted file mode 100644 index df5db691816a..000000000000 --- a/code/examples/official-storybook/storyshots-puppeteer/puppeteer-tests.runner.js +++ /dev/null @@ -1,19 +0,0 @@ -/* This file is not suffixed by ".test.js" to not being run with all other test files. - * This test needs the static build of the storybook to run. - * `yarn run storyshots-puppeteer` generates the static build & uses storyshots-puppeteer. - * */ -import path from 'path'; -import initStoryshots from '@storybook/addon-storyshots'; -import { puppeteerTest } from '@storybook/addon-storyshots-puppeteer'; -import getStorybookUrl from './getStorybookUrl'; - -const storybookUrl = getStorybookUrl(); -if (storybookUrl != null) { - initStoryshots({ - suite: 'Puppeteer tests', - storyKindRegex: /^Addons\/Storyshots/, - framework: 'react', - configPath: path.join(__dirname, '..'), - test: puppeteerTest({ storybookUrl }), - }); -} diff --git a/code/examples/official-storybook/storyshots-puppeteer/storyshots-image.runner.js b/code/examples/official-storybook/storyshots-puppeteer/storyshots-image.runner.js deleted file mode 100644 index 8f69249353de..000000000000 --- a/code/examples/official-storybook/storyshots-puppeteer/storyshots-image.runner.js +++ /dev/null @@ -1,25 +0,0 @@ -/* This file is not suffixed by ".test.js" to not being run with all other test files. - * This test needs the static build of the storybook to run. - * `yarn run storyshots-puppeteer` generates the static build & uses storyshots-puppeteer. - * */ -import path from 'path'; -import initStoryshots from '@storybook/addon-storyshots'; -import { imageSnapshot } from '@storybook/addon-storyshots-puppeteer'; -import getStorybookUrl from './getStorybookUrl'; - -const storybookUrl = getStorybookUrl(); -if (storybookUrl != null) { - initStoryshots({ - suite: 'Image snapshots', - storyKindRegex: /^Addons\/Storyshots/, - framework: 'react', - configPath: path.join(__dirname, '..'), - test: imageSnapshot({ - storybookUrl, - getMatchOptions: () => ({ - failureThreshold: 0.02, // 2% threshold, - failureThresholdType: 'percent', - }), - }), - }); -} diff --git a/code/examples/official-storybook/tests/addon-jest.config.json b/code/examples/official-storybook/tests/addon-jest.config.json deleted file mode 100644 index c4d98bd88eaf..000000000000 --- a/code/examples/official-storybook/tests/addon-jest.config.json +++ /dev/null @@ -1,15 +0,0 @@ -{ - "rootDir": "../../..", - "verbose": true, - "coverageDirectory": "coverage/", - "notify": true, - "collectCoverage": true, - "collectCoverageFrom": [ - "../stories/**/*.js", - "../stories/*.js", - "!.*", - "!../stories/__test__/*", - "!../stories/**/__test__/*" - ], - "testMatch": ["/examples/official-storybook/tests/addon-jest.test.js"] -} diff --git a/code/examples/official-storybook/tests/addon-jest.test.js b/code/examples/official-storybook/tests/addon-jest.test.js deleted file mode 100644 index b33b6c4fbc93..000000000000 --- a/code/examples/official-storybook/tests/addon-jest.test.js +++ /dev/null @@ -1,46 +0,0 @@ -// This file is excluded from the `/scripts/test.js` script. (see root `jest.config.js` file) -test('true should be true', () => { - expect(true).toBe(true); -}); - -describe('In a describe: ', () => { - test('true should still be true', () => { - expect(true).toBe(true); - }); - - test('a list should contain 3 items', () => { - expect(['a', 'b', '3']).toHaveLength(3); - }); - - test('everything is awesome', () => { - expect('everything is all right').toEqual('everything is awesome'); - }); -}); - -describe('A bunch of failing tests: ', () => { - test('true should still be true', () => { - expect(true).toBe(false); - }); - - test('a list should contain 3 items', () => { - expect(['a', 'b', '3']).toContain(301); - }); - - test('should work', () => { - expect(() => {}).toThrow(); - }); - - test.todo('Test this Todo later'); -}); - -describe('Skipped tests:', () => { - test('Would be true if not skipped', () => { - expect(true).toBe(true); - }); - - test('Could fail, if not skipped', () => { - expect(() => {}).toThrow(); - }); - - test.todo('Test Todo is not skipped'); -}); diff --git a/code/examples/svelte-kitchen-sink/src/components/Button.svelte b/code/examples/svelte-kitchen-sink/src/components/Button.svelte index c444ce741385..37b084117fb2 100644 --- a/code/examples/svelte-kitchen-sink/src/components/Button.svelte +++ b/code/examples/svelte-kitchen-sink/src/components/Button.svelte @@ -35,7 +35,7 @@ } -
diff --git a/code/examples/svelte-kitchen-sink/src/components/Counter.svelte b/code/examples/svelte-kitchen-sink/src/components/Counter.svelte index 62e8bef5f3d0..a4a8f89c31e2 100644 --- a/code/examples/svelte-kitchen-sink/src/components/Counter.svelte +++ b/code/examples/svelte-kitchen-sink/src/components/Counter.svelte @@ -13,6 +13,8 @@

Svelte - Counter

You clicked {count} times

+ +
diff --git a/code/examples/svelte-kitchen-sink/src/stories/views/ActionLinkView.svelte b/code/examples/svelte-kitchen-sink/src/stories/views/ActionLinkView.svelte index 2d780e88e990..84752d893d56 100644 --- a/code/examples/svelte-kitchen-sink/src/stories/views/ActionLinkView.svelte +++ b/code/examples/svelte-kitchen-sink/src/stories/views/ActionLinkView.svelte @@ -10,6 +10,7 @@

Link Action

+ diff --git a/code/examples/svelte-kitchen-sink/src/stories/views/ArgsTableView.svelte b/code/examples/svelte-kitchen-sink/src/stories/views/ArgsTableView.svelte index c81fb0578f9f..2739ab2f0a86 100644 --- a/code/examples/svelte-kitchen-sink/src/stories/views/ArgsTableView.svelte +++ b/code/examples/svelte-kitchen-sink/src/stories/views/ArgsTableView.svelte @@ -51,17 +51,20 @@ + 
{JSON.stringify(preview, null, '  ')}
+
+
/** Close description */ dispatch('close')}/> - \ No newline at end of file + diff --git a/code/jest.config.js b/code/jest.config.js index bc6f13e83cbb..8368c65c87dd 100644 --- a/code/jest.config.js +++ b/code/jest.config.js @@ -40,7 +40,6 @@ module.exports = { '/frameworks', '/lib', '/renderers', - '/examples/official-storybook', ], transform: { '^.+\\.stories\\.[jt]sx?$': '@storybook/addon-storyshots/injectFileName', diff --git a/code/lib/codemod/src/transforms/__tests__/csf-2-to-3.test.ts b/code/lib/codemod/src/transforms/__tests__/csf-2-to-3.test.ts index 1d174e2e1304..277ca3d9ac6e 100644 --- a/code/lib/codemod/src/transforms/__tests__/csf-2-to-3.test.ts +++ b/code/lib/codemod/src/transforms/__tests__/csf-2-to-3.test.ts @@ -72,7 +72,6 @@ describe('csf-2-to-3', () => { render: (args) => , }; export const B = (args) => ; - const C = (args) => ; `); }); diff --git a/code/examples/official-storybook/main.ts b/code/lib/core-server/src/__for-testing__/main.ts similarity index 74% rename from code/examples/official-storybook/main.ts rename to code/lib/core-server/src/__for-testing__/main.ts index ad4819c63a84..0be49d5c46b1 100644 --- a/code/examples/official-storybook/main.ts +++ b/code/lib/core-server/src/__for-testing__/main.ts @@ -1,12 +1,12 @@ /// +// eslint-disable-next-line @typescript-eslint/ban-ts-comment +// @ts-ignore import type { StorybookConfig } from '@storybook/react-webpack5'; const config: StorybookConfig = { stories: [ - // FIXME: Breaks e2e tests './intro.stories.mdx', '../../lib/ui/src/**/*.stories.@(ts|tsx|js|jsx|mdx)', '../../lib/components/src/**/*.stories.@(ts|tsx|js|jsx|mdx)', - './stories/**/*.stories.@(ts|tsx|js|jsx|mdx)', './../../addons/docs/**/*.stories.@(ts|tsx|js|jsx|mdx)', './../../addons/interactions/**/*.stories.@(ts|tsx|js|jsx|mdx)', ], @@ -15,8 +15,6 @@ const config: StorybookConfig = { name: '@storybook/addon-docs', options: { transcludeMarkdown: true, - // needed if you use addon-docs in conjunction - // with addon-storysource sourceLoaderOptions: null, }, }, @@ -37,17 +35,6 @@ const config: StorybookConfig = { breakingChangesV7: false, storyStoreV7: false, }, - staticDirs: [ - './statics/public', - { - from: './statics/examples/example1', - to: '/example1', - }, - { - from: './statics/examples/example2', - to: '/example2', - }, - ], framework: { name: '@storybook/react-webpack5', options: { diff --git a/code/lib/core-server/src/core-presets.test.ts b/code/lib/core-server/src/core-presets.test.ts index 2768971ec73b..5e5fcd1678d9 100644 --- a/code/lib/core-server/src/core-presets.test.ts +++ b/code/lib/core-server/src/core-presets.test.ts @@ -127,7 +127,7 @@ const baseOptions = { managerOnly, // production docsMode: false, cache, - configDir: path.resolve(`${__dirname}/../../../examples/official-storybook/`), + configDir: path.resolve(`${__dirname}/__for-testing__/`), ci: true, managerCache: false, }; diff --git a/code/package.json b/code/package.json index 5e2644d4601c..5b0a87aaa6bf 100644 --- a/code/package.json +++ b/code/package.json @@ -80,9 +80,7 @@ "sandbox": "ts-node ../scripts/sandbox.ts", "serve-storybooks": "http-server ./built-storybooks -p 8001", "smoketest-storybooks": "cross-env STORYBOOK_DISPLAY_WARNING=true DISPLAY_WARNING=true node -r esm ../scripts/smoketest-storybooks.js", - "start": "yarn workspace official-storybook storybook --no-manager-cache", "test": "NODE_OPTIONS=--max_old_space_size=4096 jest --config ./jest.config.js", - "test-puppeteer": "jest --projects examples/official-storybook/storyshots-puppeteer", "test:cli": "npm --prefix lib/cli run test", "test:e2e-examples-playwright": "playwright test", "test:e2e-framework": "ts-node --project=../scripts/tsconfig.json ../scripts/run-e2e.ts" @@ -365,9 +363,6 @@ "preact": { "built": false }, - "styled-components": { - "built": false - }, "yorkie": { "built": false } diff --git a/code/renderers/react/template/stories/docgen-components/10017-ts-union/docgen.snapshot b/code/renderers/react/template/stories/docgen-components/10017-ts-union/docgen.snapshot index e702b18e4220..abb048595153 100644 --- a/code/renderers/react/template/stories/docgen-components/10017-ts-union/docgen.snapshot +++ b/code/renderers/react/template/stories/docgen-components/10017-ts-union/docgen.snapshot @@ -2,7 +2,6 @@ exports[`react component properties 10017-ts-union 1`] = ` "import React from 'react'; - const Avatar = ({ icon }) => { @@ -10,7 +9,6 @@ const Avatar = ({ className: \\"hello\\" }, \\"Hello Component \\", icon); }; - export const component = Avatar; Avatar.__docgenInfo = { \\"description\\": \\"\\", diff --git a/code/renderers/react/template/stories/docgen-components/10278-ts-multiple-components/docgen.snapshot b/code/renderers/react/template/stories/docgen-components/10278-ts-multiple-components/docgen.snapshot index 3947ed35573d..e254ef1f2ad2 100644 --- a/code/renderers/react/template/stories/docgen-components/10278-ts-multiple-components/docgen.snapshot +++ b/code/renderers/react/template/stories/docgen-components/10278-ts-multiple-components/docgen.snapshot @@ -3,22 +3,19 @@ exports[`react component properties 10278-ts-multiple-components 1`] = ` "/* eslint-disable react/destructuring-assignment */ import React from 'react'; - /** * A component */ const A = props => { return /*#__PURE__*/React.createElement(React.Fragment, null, \\"Hi \\", props.aProperty); }; + /** * B component */ - - const B = props => { return /*#__PURE__*/React.createElement(React.Fragment, null, \\"Hi \\", props.bProperty); }; - A.__docgenInfo = { \\"description\\": \\"A component\\", \\"methods\\": [], diff --git a/code/renderers/react/template/stories/docgen-components/8140-js-prop-types-oneof/docgen.snapshot b/code/renderers/react/template/stories/docgen-components/8140-js-prop-types-oneof/docgen.snapshot index 2b214f33aad2..cef5dd1255bc 100644 --- a/code/renderers/react/template/stories/docgen-components/8140-js-prop-types-oneof/docgen.snapshot +++ b/code/renderers/react/template/stories/docgen-components/8140-js-prop-types-oneof/docgen.snapshot @@ -2,13 +2,10 @@ exports[`react component properties 8140-js-prop-types-oneof 1`] = ` "/* eslint-disable react/require-default-props */ - /* eslint-disable react/no-unused-prop-types */ import React from 'react'; import PropTypes from 'prop-types'; - const Alert = props => /*#__PURE__*/React.createElement(React.Fragment, null, JSON.stringify(props)); - Alert.defaultProps = { mode: 'static', type: 'warning' @@ -17,12 +14,10 @@ Alert.propTypes = { mode: PropTypes.oneOf(['static', 'timed']), type: PropTypes.oneOf(['success', 'warning', 'error', 'primary']), message: PropTypes.string.isRequired, - /** * No background or border if static alert */ blank: PropTypes.bool, - /** * Allows icon override, accepts material icon name */ diff --git a/code/renderers/react/template/stories/docgen-components/8279-js-styled-docgen/argTypes.snapshot b/code/renderers/react/template/stories/docgen-components/8279-js-styled-docgen/argTypes.snapshot deleted file mode 100644 index bf6bf8c4a943..000000000000 --- a/code/renderers/react/template/stories/docgen-components/8279-js-styled-docgen/argTypes.snapshot +++ /dev/null @@ -1,3 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`react component properties 8279-js-styled-docgen 1`] = `Object {}`; diff --git a/code/renderers/react/template/stories/docgen-components/8279-js-styled-docgen/docgen.snapshot b/code/renderers/react/template/stories/docgen-components/8279-js-styled-docgen/docgen.snapshot deleted file mode 100644 index 589ae55f4534..000000000000 --- a/code/renderers/react/template/stories/docgen-components/8279-js-styled-docgen/docgen.snapshot +++ /dev/null @@ -1,25 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`react component properties 8279-js-styled-docgen 1`] = ` -"// eslint-disable-next-line import/no-extraneous-dependencies -import styled from 'styled-components'; -import PropTypes from 'prop-types'; -/** - * Use \`A\` to provide a regular link - */ - -const A = styled('a')({ - margin: '8px 0', - outline: 'none' -}); -A.displayName = 'Link'; -A.defaultProps = { - children: 'This is a link' -}; -A.propTypes = { - /** That should be the clickable element */ - children: PropTypes.node.isRequired -}; -export default A; -export const component = A;" -`; diff --git a/code/renderers/react/template/stories/docgen-components/8279-js-styled-docgen/input.jsx b/code/renderers/react/template/stories/docgen-components/8279-js-styled-docgen/input.jsx deleted file mode 100644 index 4b6b88180044..000000000000 --- a/code/renderers/react/template/stories/docgen-components/8279-js-styled-docgen/input.jsx +++ /dev/null @@ -1,24 +0,0 @@ -// eslint-disable-next-line import/no-extraneous-dependencies -import styled from 'styled-components'; -import PropTypes from 'prop-types'; - -/** - * Use `A` to provide a regular link - */ -const A = styled('a')({ - margin: '8px 0', - outline: 'none', -}); - -A.displayName = 'Link'; -A.defaultProps = { - children: 'This is a link', -}; - -A.propTypes = { - /** That should be the clickable element */ - children: PropTypes.node.isRequired, -}; -export default A; - -export const component = A; diff --git a/code/renderers/react/template/stories/docgen-components/8279-js-styled-docgen/properties.snapshot b/code/renderers/react/template/stories/docgen-components/8279-js-styled-docgen/properties.snapshot deleted file mode 100644 index b429f083fcc0..000000000000 --- a/code/renderers/react/template/stories/docgen-components/8279-js-styled-docgen/properties.snapshot +++ /dev/null @@ -1,7 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`react component properties 8279-js-styled-docgen 1`] = ` -Object { - "rows": Array [], -} -`; diff --git a/code/renderers/react/template/stories/docgen-components/8428-js-static-prop-types/docgen.snapshot b/code/renderers/react/template/stories/docgen-components/8428-js-static-prop-types/docgen.snapshot index 67ca04a2157f..7c10a7346578 100644 --- a/code/renderers/react/template/stories/docgen-components/8428-js-static-prop-types/docgen.snapshot +++ b/code/renderers/react/template/stories/docgen-components/8428-js-static-prop-types/docgen.snapshot @@ -2,27 +2,23 @@ exports[`react component properties 8428-js-static-prop-types 1`] = ` "function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } - /* eslint-disable react/no-unused-prop-types */ - /* eslint-disable react/require-default-props */ import React from 'react'; -import PropTypes from 'prop-types'; // eslint-disable-next-line react/prefer-stateless-function +import PropTypes from 'prop-types'; +// eslint-disable-next-line react/prefer-stateless-function export default class Test extends React.Component { render() { return /*#__PURE__*/React.createElement(\\"div\\", null, \\"test\\"); } - } - _defineProperty(Test, \\"propTypes\\", { /** * Please work... */ test: PropTypes.string }); - export const component = Test; Test.__docgenInfo = { \\"description\\": \\"\\", diff --git a/code/renderers/react/template/stories/docgen-components/8663-js-styled-components/argTypes.snapshot b/code/renderers/react/template/stories/docgen-components/8663-js-styled-components/argTypes.snapshot deleted file mode 100644 index 12f7441c6af0..000000000000 --- a/code/renderers/react/template/stories/docgen-components/8663-js-styled-components/argTypes.snapshot +++ /dev/null @@ -1,25 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`react component properties 8663-js-styled-components 1`] = ` -Object { - "bg": Object { - "control": Object { - "type": "text", - }, - "description": "", - "name": "bg", - "table": Object { - "defaultValue": null, - "jsDocTags": undefined, - "type": Object { - "detail": undefined, - "summary": "string", - }, - }, - "type": Object { - "name": "string", - "required": false, - }, - }, -} -`; diff --git a/code/renderers/react/template/stories/docgen-components/8663-js-styled-components/docgen.snapshot b/code/renderers/react/template/stories/docgen-components/8663-js-styled-components/docgen.snapshot deleted file mode 100644 index 53e86ec92ef5..000000000000 --- a/code/renderers/react/template/stories/docgen-components/8663-js-styled-components/docgen.snapshot +++ /dev/null @@ -1,35 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`react component properties 8663-js-styled-components 1`] = ` -"/* eslint-disable import/no-extraneous-dependencies */ - -/* eslint-disable react/require-default-props */ -import React from 'react'; -import PropTypes from 'prop-types'; -import styled from 'styled-components'; -const Box = styled.div\` - background-color: \${props => props.bg}; -\`; -Box.propTypes = { - bg: PropTypes.string -}; -export const MyBox = props => /*#__PURE__*/React.createElement(Box, props); -MyBox.propTypes = { - bg: PropTypes.string -}; -export const component = MyBox; -MyBox.__docgenInfo = { - \\"description\\": \\"\\", - \\"methods\\": [], - \\"displayName\\": \\"MyBox\\", - \\"props\\": { - \\"bg\\": { - \\"description\\": \\"\\", - \\"type\\": { - \\"name\\": \\"string\\" - }, - \\"required\\": false - } - } -};" -`; diff --git a/code/renderers/react/template/stories/docgen-components/8663-js-styled-components/input.jsx b/code/renderers/react/template/stories/docgen-components/8663-js-styled-components/input.jsx deleted file mode 100644 index c33048295c64..000000000000 --- a/code/renderers/react/template/stories/docgen-components/8663-js-styled-components/input.jsx +++ /dev/null @@ -1,21 +0,0 @@ -/* eslint-disable import/no-extraneous-dependencies */ -/* eslint-disable react/require-default-props */ -import React from 'react'; -import PropTypes from 'prop-types'; -import styled from 'styled-components'; - -const Box = styled.div` - background-color: ${(props) => props.bg}; -`; - -Box.propTypes = { - bg: PropTypes.string, -}; - -export const MyBox = (props) => ; - -MyBox.propTypes = { - bg: PropTypes.string, -}; - -export const component = MyBox; diff --git a/code/renderers/react/template/stories/docgen-components/8663-js-styled-components/properties.snapshot b/code/renderers/react/template/stories/docgen-components/8663-js-styled-components/properties.snapshot deleted file mode 100644 index e6923faff496..000000000000 --- a/code/renderers/react/template/stories/docgen-components/8663-js-styled-components/properties.snapshot +++ /dev/null @@ -1,21 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`react component properties 8663-js-styled-components 1`] = ` -Object { - "rows": Array [ - Object { - "defaultValue": null, - "description": "", - "name": "bg", - "required": false, - "sbType": Object { - "name": "string", - }, - "type": Object { - "detail": undefined, - "summary": "string", - }, - }, - ], -} -`; diff --git a/code/renderers/react/template/stories/docgen-components/9023-js-hoc/docgen.snapshot b/code/renderers/react/template/stories/docgen-components/9023-js-hoc/docgen.snapshot index a0d6b8d941a8..b525ea49f5e1 100644 --- a/code/renderers/react/template/stories/docgen-components/9023-js-hoc/docgen.snapshot +++ b/code/renderers/react/template/stories/docgen-components/9023-js-hoc/docgen.snapshot @@ -2,24 +2,19 @@ exports[`react component properties 9023-js-hoc 1`] = ` "/* eslint-disable react/require-default-props */ - /* eslint-disable react/forbid-prop-types */ - /* eslint-disable react/no-unused-prop-types */ - /* eslint-disable react/prefer-stateless-function */ import React from 'react'; -import PropTypes from 'prop-types'; // deepscan-disable-next-line +import PropTypes from 'prop-types'; +// deepscan-disable-next-line const withStyles = themeFn => Comp => Comp; - class Alert extends React.Component { render() { return /*#__PURE__*/React.createElement(React.Fragment, null, \\"Alert\\"); } - } - Alert.propTypes = { variant: PropTypes.string, dismissible: PropTypes.bool, diff --git a/code/renderers/react/template/stories/docgen-components/9399-js-proptypes-shape/docgen.snapshot b/code/renderers/react/template/stories/docgen-components/9399-js-proptypes-shape/docgen.snapshot index 396775caa8ae..4858e5cb980e 100644 --- a/code/renderers/react/template/stories/docgen-components/9399-js-proptypes-shape/docgen.snapshot +++ b/code/renderers/react/template/stories/docgen-components/9399-js-proptypes-shape/docgen.snapshot @@ -5,8 +5,9 @@ exports[`react component properties 9399-js-proptypes-shape 1`] = ` import PropTypes from 'prop-types'; export const Credits = ({ areas -}) => /*#__PURE__*/React.createElement(React.Fragment, null, JSON.stringify(areas)); // https://github.com/storybookjs/storybook/issues/9399 +}) => /*#__PURE__*/React.createElement(React.Fragment, null, JSON.stringify(areas)); +// https://github.com/storybookjs/storybook/issues/9399 Credits.propTypes = { areas: PropTypes.arrayOf(PropTypes.shape({ position: PropTypes.string.isRequired, diff --git a/code/renderers/react/template/stories/docgen-components/9465-ts-type-props/docgen.snapshot b/code/renderers/react/template/stories/docgen-components/9465-ts-type-props/docgen.snapshot index eed6ac7c10e2..bf337a2c9d41 100644 --- a/code/renderers/react/template/stories/docgen-components/9465-ts-type-props/docgen.snapshot +++ b/code/renderers/react/template/stories/docgen-components/9465-ts-type-props/docgen.snapshot @@ -2,7 +2,6 @@ exports[`react component properties 9465-ts-type-props 1`] = ` "import React from 'react'; - const Component = ({ disabled = false, children @@ -12,7 +11,6 @@ const Component = ({ React.createElement(\\"button\\", { disabled: disabled }, children); - export const component = Component; Component.__docgenInfo = { \\"description\\": \\"\\", diff --git a/code/renderers/react/template/stories/docgen-components/9493-ts-display-name/docgen.snapshot b/code/renderers/react/template/stories/docgen-components/9493-ts-display-name/docgen.snapshot index 2803e7ec6689..6f1f52928c5a 100644 --- a/code/renderers/react/template/stories/docgen-components/9493-ts-display-name/docgen.snapshot +++ b/code/renderers/react/template/stories/docgen-components/9493-ts-display-name/docgen.snapshot @@ -2,7 +2,6 @@ exports[`react component properties 9493-ts-display-name 1`] = ` "import React from 'react'; - /** * This message should show up in the Docs panel if everything works fine. */ diff --git a/code/renderers/react/template/stories/docgen-components/9556-ts-react-default-exports/docgen.snapshot b/code/renderers/react/template/stories/docgen-components/9556-ts-react-default-exports/docgen.snapshot index f859bb234989..e2793c8f420c 100644 --- a/code/renderers/react/template/stories/docgen-components/9556-ts-react-default-exports/docgen.snapshot +++ b/code/renderers/react/template/stories/docgen-components/9556-ts-react-default-exports/docgen.snapshot @@ -2,7 +2,6 @@ exports[`react component properties 9556-ts-react-default-exports 1`] = ` "function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } - /* eslint-disable react/button-has-type */ import React from 'react'; export const Button = ({ diff --git a/code/renderers/react/template/stories/docgen-components/9575-ts-camel-case/docgen.snapshot b/code/renderers/react/template/stories/docgen-components/9575-ts-camel-case/docgen.snapshot index 488595ad2c91..db00f870fb31 100644 --- a/code/renderers/react/template/stories/docgen-components/9575-ts-camel-case/docgen.snapshot +++ b/code/renderers/react/template/stories/docgen-components/9575-ts-camel-case/docgen.snapshot @@ -3,13 +3,11 @@ exports[`react component properties 9575-ts-camel-case 1`] = ` "import PropTypes from 'prop-types'; import React from 'react'; - const iconButton = function IconButton(props) { return /*#__PURE__*/React.createElement(\\"div\\", { className: \\"icon-button\\" }, \\"icon-button\\"); }; - iconButton.propTypes = { // deepscan-disable-next-line color: PropTypes.string diff --git a/code/renderers/react/template/stories/docgen-components/9586-js-react-memo/docgen.snapshot b/code/renderers/react/template/stories/docgen-components/9586-js-react-memo/docgen.snapshot index 9de1e177c96e..9734536f441f 100644 --- a/code/renderers/react/template/stories/docgen-components/9586-js-react-memo/docgen.snapshot +++ b/code/renderers/react/template/stories/docgen-components/9586-js-react-memo/docgen.snapshot @@ -3,7 +3,6 @@ exports[`react component properties 9586-js-react-memo 1`] = ` "import React from 'react'; import PropTypes from 'prop-types'; - function Button({ label, onClick @@ -13,7 +12,6 @@ function Button({ onClick: onClick }, label); } - Button.propTypes = { label: PropTypes.string.isRequired, onClick: PropTypes.func.isRequired diff --git a/code/renderers/react/template/stories/docgen-components/9591-ts-import-types/docgen.snapshot b/code/renderers/react/template/stories/docgen-components/9591-ts-import-types/docgen.snapshot index a059bf1880b0..1925d38416de 100644 --- a/code/renderers/react/template/stories/docgen-components/9591-ts-import-types/docgen.snapshot +++ b/code/renderers/react/template/stories/docgen-components/9591-ts-import-types/docgen.snapshot @@ -2,9 +2,7 @@ exports[`react component properties 9591-ts-import-types 1`] = ` "import React from 'react'; - const Other = props => /*#__PURE__*/React.createElement(\\"span\\", props, \\"Other\\"); - export const component = Other; Other.__docgenInfo = { \\"description\\": \\"\\", diff --git a/code/renderers/react/template/stories/docgen-components/9626-js-default-values/docgen.snapshot b/code/renderers/react/template/stories/docgen-components/9626-js-default-values/docgen.snapshot index 7b5b63c1440b..f65a30efed05 100644 --- a/code/renderers/react/template/stories/docgen-components/9626-js-default-values/docgen.snapshot +++ b/code/renderers/react/template/stories/docgen-components/9626-js-default-values/docgen.snapshot @@ -1,8 +1,9 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`react component properties 9626-js-default-values 1`] = ` -"import React from 'react'; // eslint-disable-next-line react/prop-types +"import React from 'react'; +// eslint-disable-next-line react/prop-types export const Tag = ({ title = 'Beta' }) => /*#__PURE__*/React.createElement(\\"div\\", null, title); diff --git a/code/renderers/react/template/stories/docgen-components/9668-js-proptypes-no-jsdoc/docgen.snapshot b/code/renderers/react/template/stories/docgen-components/9668-js-proptypes-no-jsdoc/docgen.snapshot index 83df2b79e995..51169517036b 100644 --- a/code/renderers/react/template/stories/docgen-components/9668-js-proptypes-no-jsdoc/docgen.snapshot +++ b/code/renderers/react/template/stories/docgen-components/9668-js-proptypes-no-jsdoc/docgen.snapshot @@ -2,15 +2,11 @@ exports[`react component properties 9668-js-proptypes-no-jsdoc 1`] = ` "/* eslint-disable react/forbid-prop-types */ - /* eslint-disable react/require-default-props */ - /* eslint-disable react/no-unused-prop-types */ import React from 'react'; import PropTypes from 'prop-types'; - const CCTable = props => /*#__PURE__*/React.createElement(React.Fragment, null, JSON.stringify(props)); - CCTable.propTypes = { heads: PropTypes.array.isRequired, onAddClick: PropTypes.func diff --git a/code/renderers/react/template/stories/docgen-components/9721-ts-deprecated-jsdoc/docgen.snapshot b/code/renderers/react/template/stories/docgen-components/9721-ts-deprecated-jsdoc/docgen.snapshot index 69821e3c56b5..e7a005ad2511 100644 --- a/code/renderers/react/template/stories/docgen-components/9721-ts-deprecated-jsdoc/docgen.snapshot +++ b/code/renderers/react/template/stories/docgen-components/9721-ts-deprecated-jsdoc/docgen.snapshot @@ -2,9 +2,7 @@ exports[`react component properties 9721-ts-deprecated-jsdoc 1`] = ` "import React from 'react'; - const Foo = props => /*#__PURE__*/React.createElement(React.Fragment, null, JSON.stringify(props)); - export const component = Foo; Foo.__docgenInfo = { \\"description\\": \\"\\", diff --git a/code/renderers/react/template/stories/docgen-components/9764-ts-extend-props/docgen.snapshot b/code/renderers/react/template/stories/docgen-components/9764-ts-extend-props/docgen.snapshot index af6e21ceac74..05cc2310ff40 100644 --- a/code/renderers/react/template/stories/docgen-components/9764-ts-extend-props/docgen.snapshot +++ b/code/renderers/react/template/stories/docgen-components/9764-ts-extend-props/docgen.snapshot @@ -2,9 +2,7 @@ exports[`react component properties 9764-ts-extend-props 1`] = ` "import React from 'react'; - const Radio = props => /*#__PURE__*/React.createElement(React.Fragment, null, JSON.stringify(props)); - export const component = Radio; Radio.__docgenInfo = { \\"description\\": \\"\\", diff --git a/code/renderers/react/template/stories/docgen-components/9827-ts-default-values/docgen.snapshot b/code/renderers/react/template/stories/docgen-components/9827-ts-default-values/docgen.snapshot index e029b62e2a13..b6cd0e2e6929 100644 --- a/code/renderers/react/template/stories/docgen-components/9827-ts-default-values/docgen.snapshot +++ b/code/renderers/react/template/stories/docgen-components/9827-ts-default-values/docgen.snapshot @@ -2,7 +2,6 @@ exports[`react component properties 9827-ts-default-values 1`] = ` "import React from 'react'; - const Hello = ({ title }) => { @@ -10,7 +9,6 @@ const Hello = ({ className: \\"hello\\" }, \\"Hello Component \\", title); }; - Hello.defaultProps = { title: 'this is the default :)' }; diff --git a/code/renderers/react/template/stories/docgen-components/9832-ts-enum-export/docgen.snapshot b/code/renderers/react/template/stories/docgen-components/9832-ts-enum-export/docgen.snapshot index 2af0f01d2944..e6eab8d40d58 100644 --- a/code/renderers/react/template/stories/docgen-components/9832-ts-enum-export/docgen.snapshot +++ b/code/renderers/react/template/stories/docgen-components/9832-ts-enum-export/docgen.snapshot @@ -3,12 +3,10 @@ exports[`react component properties 9832-ts-enum-export 1`] = ` "import React from 'react'; export let EnumWithExtraProps; - (function (EnumWithExtraProps) { EnumWithExtraProps[\\"key1\\"] = \\"key1\\"; EnumWithExtraProps[\\"key2\\"] = \\"key2\\"; })(EnumWithExtraProps || (EnumWithExtraProps = {})); - export const component = () => /*#__PURE__*/React.createElement(\\"div\\", null, \\"hello\\"); component.__docgenInfo = { \\"description\\": \\"\\", diff --git a/code/renderers/react/template/stories/docgen-components/9922-ts-component-props/docgen.snapshot b/code/renderers/react/template/stories/docgen-components/9922-ts-component-props/docgen.snapshot index 82936b526eef..21af06c3d5b3 100644 --- a/code/renderers/react/template/stories/docgen-components/9922-ts-component-props/docgen.snapshot +++ b/code/renderers/react/template/stories/docgen-components/9922-ts-component-props/docgen.snapshot @@ -2,7 +2,6 @@ exports[`react component properties 9922-ts-component-props 1`] = ` "import React from 'react'; - const Button = ({ children, onClick @@ -10,7 +9,6 @@ const Button = ({ onClick: onClick, type: \\"button\\" }, children); - const WrappedButton = ({ spacing, ...buttonProps @@ -19,7 +17,6 @@ const WrappedButton = ({ padding: spacing } }, /*#__PURE__*/React.createElement(Button, buttonProps)); - export const component = WrappedButton; WrappedButton.__docgenInfo = { \\"description\\": \\"\\", diff --git a/code/renderers/react/template/stories/docgen-components/jsdoc/docgen.snapshot b/code/renderers/react/template/stories/docgen-components/jsdoc/docgen.snapshot index 3a998ec095ed..8eda1b6eaeda 100644 --- a/code/renderers/react/template/stories/docgen-components/jsdoc/docgen.snapshot +++ b/code/renderers/react/template/stories/docgen-components/jsdoc/docgen.snapshot @@ -4,115 +4,95 @@ exports[`react component properties jsdoc 1`] = ` "/* eslint-disable react/require-default-props, react/no-unused-prop-types */ import React from 'react'; import PropTypes from 'prop-types'; - const JsDocProps = () => /*#__PURE__*/React.createElement(\\"div\\", null, \\"JSDoc with PropTypes!\\"); - JsDocProps.propTypes = { /** * should not be visible since it's ignored. * @ignore */ case0: PropTypes.string, - /** * simple description. */ case1: PropTypes.string, - /** * multi * lines * description */ case2: PropTypes.string, - /** * *description* **with** \`formatting\` */ case3: PropTypes.string, - /** * simple description and dummy JSDoc tag. * @param event */ case4: PropTypes.string, - /** * @param event */ case5: PropTypes.string, - /** * simple description with a @. */ case6: PropTypes.string, case7: PropTypes.func, - /** * func with a simple description. */ case8: PropTypes.func, - /** * @param event */ case9: PropTypes.func, - /** * param with name * @param event */ case10: PropTypes.func, - /** * param with name & type * @param {SyntheticEvent} event */ case11: PropTypes.func, - /** * param with name, type & description * @param {SyntheticEvent} event - React's original event */ case12: PropTypes.func, - /** * param with type * @param {SyntheticEvent} */ case13: PropTypes.func, - /** * param with type & description * @param {SyntheticEvent} - React's original event */ case14: PropTypes.func, - /** * param with name & description * @param event - React's original event */ case15: PropTypes.func, - /** * autofix event- * @param event- React's original event */ case16: PropTypes.func, - /** * autofix event. * @param event. * @returns {string} */ case17: PropTypes.func, - /** * with an empty param. * @param */ case18: PropTypes.func, - /** * with multiple empty params. * @param @@ -120,19 +100,16 @@ JsDocProps.propTypes = { * @param */ case19: PropTypes.func, - /** * with arg alias. * @arg event */ case20: PropTypes.func, - /** * with argument alias. * @argument event */ case21: PropTypes.func, - /** * with multiple params. * @param {SyntheticEvent} event @@ -140,32 +117,27 @@ JsDocProps.propTypes = { * @param {number} numberValue */ case22: PropTypes.func, - /** * with an empty returns * @returns */ case23: PropTypes.func, - /** * with a returns with a type * @returns {SyntheticEvent} */ case24: PropTypes.func, - /** * with a returns with a type & description * @returns {SyntheticEvent} - React's original event */ case25: PropTypes.func, - /** * single param and a returns * @param {string} stringValue * @returns {SyntheticEvent} - React's original event */ case26: PropTypes.func, - /** * multiple params and a returns * @param {string} stringValue @@ -173,14 +145,12 @@ JsDocProps.propTypes = { * @returns {SyntheticEvent} - React's original event */ case27: PropTypes.func, - /** * multiple returns * @returns {SyntheticEvent} - React's original event * @returns {string} - Second returns */ case28: PropTypes.func, - /** * param with unsupported JSDoc tags * @param {SyntheticEvent} event - React's original event @@ -188,85 +158,71 @@ JsDocProps.propTypes = { * @version 2 */ case29: PropTypes.func, - /** * param record type * @param {{a: number, b: string}} myType */ case30: PropTypes.func, - /** * param array type * @param {string[]} myType */ case31: PropTypes.func, - /** * param union type * @param {(number|boolean)} myType */ case32: PropTypes.func, - /** * param any type * @param {*} myType */ case33: PropTypes.func, - /** * param repeatable type * @param {...number} myType */ case34: PropTypes.func, - /** * optional param * @param {number} [myType] */ case35: PropTypes.func, - /** * optional param * @param {number} [myType] */ case36: PropTypes.func, - /** * dot in param name * @param {number} my.type */ case37: PropTypes.func, - /** * returns record type * @returns {{a: number, b: string}} */ case38: PropTypes.func, - /** * returns array type * @returns {string[]} */ case39: PropTypes.func, - /** * returns union type * @returns {(number|boolean)} */ case40: PropTypes.func, - /** * returns any type * @returns {*} */ case41: PropTypes.func, - /** * returns primitive * @returns {string} */ case42: PropTypes.func, - /** * returns void * @returns {void} diff --git a/code/renderers/react/template/stories/docgen-components/ts-jsdoc/docgen.snapshot b/code/renderers/react/template/stories/docgen-components/ts-jsdoc/docgen.snapshot index c1d7f8a0bfaa..63457d8ac4c8 100644 --- a/code/renderers/react/template/stories/docgen-components/ts-jsdoc/docgen.snapshot +++ b/code/renderers/react/template/stories/docgen-components/ts-jsdoc/docgen.snapshot @@ -2,7 +2,6 @@ exports[`react component properties ts-jsdoc 1`] = ` "import React from 'react'; - /** * Button functional component (React.FC) */ @@ -13,7 +12,6 @@ const TypeScriptProps = ({ type: \\"button\\", onClick: case1 }, \\"JSDoc with TypeScript! \\", case2); - export const component = TypeScriptProps; TypeScriptProps.__docgenInfo = { \\"description\\": \\"Button functional component (React.FC)\\", diff --git a/code/renderers/react/template/stories/docgen-components/ts-types/docgen.snapshot b/code/renderers/react/template/stories/docgen-components/ts-types/docgen.snapshot index f97ba72dc1e9..8bdd34cdee74 100644 --- a/code/renderers/react/template/stories/docgen-components/ts-types/docgen.snapshot +++ b/code/renderers/react/template/stories/docgen-components/ts-types/docgen.snapshot @@ -2,35 +2,27 @@ exports[`react component properties ts-types 1`] = ` "import React from 'react'; - function concat(a, b) { return a + b; } - var DefaultEnum; - (function (DefaultEnum) { DefaultEnum[DefaultEnum[\\"TopLeft\\"] = 0] = \\"TopLeft\\"; DefaultEnum[DefaultEnum[\\"TopRight\\"] = 1] = \\"TopRight\\"; DefaultEnum[DefaultEnum[\\"TopCenter\\"] = 2] = \\"TopCenter\\"; })(DefaultEnum || (DefaultEnum = {})); - var NumericEnum; - (function (NumericEnum) { NumericEnum[NumericEnum[\\"TopLeft\\"] = 0] = \\"TopLeft\\"; NumericEnum[NumericEnum[\\"TopRight\\"] = 1] = \\"TopRight\\"; NumericEnum[NumericEnum[\\"TopCenter\\"] = 2] = \\"TopCenter\\"; })(NumericEnum || (NumericEnum = {})); - var StringEnum; - (function (StringEnum) { StringEnum[\\"TopLeft\\"] = \\"top-left\\"; StringEnum[\\"TopRight\\"] = \\"top-right\\"; StringEnum[\\"TopCenter\\"] = \\"top-center\\"; })(StringEnum || (StringEnum = {})); - export const TypeScriptProps = () => /*#__PURE__*/React.createElement(\\"div\\", null, \\"TypeScript!\\"); TypeScriptProps.defaultProps = { any: 'Any value', diff --git a/code/workspace.json b/code/workspace.json index 85216ea9c870..23d0bc9244fa 100644 --- a/code/workspace.json +++ b/code/workspace.json @@ -421,11 +421,6 @@ "type": "library", "implicitDependencies": [] }, - "official-storybook": { - "root": "examples/official-storybook", - "type": "library", - "implicitDependencies": [] - }, "preact-example": { "root": "examples/preact-kitchen-sink", "type": "library", diff --git a/code/yarn.lock b/code/yarn.lock index 5efb54c66ff9..87fe75898ea1 100644 --- a/code/yarn.lock +++ b/code/yarn.lock @@ -399,10 +399,10 @@ __metadata: languageName: node linkType: hard -"@babel/compat-data@npm:^7.16.8, @babel/compat-data@npm:^7.17.7, @babel/compat-data@npm:^7.18.8, @babel/compat-data@npm:^7.19.3": - version: 7.19.3 - resolution: "@babel/compat-data@npm:7.19.3" - checksum: c23150ca0d39071dd35f1c0c380454c72c6518ae75e1095028a7a68cd5cc49d9061d8d58356cde8431dade28f594f5261777d2b6d8869ed794169a6971ca0098 +"@babel/compat-data@npm:^7.16.8, @babel/compat-data@npm:^7.17.7, @babel/compat-data@npm:^7.19.3, @babel/compat-data@npm:^7.19.4": + version: 7.19.4 + resolution: "@babel/compat-data@npm:7.19.4" + checksum: f6c3cec531e9c8ab2b0a7db64775f6f00e88ce1f727114cffb900c989ed3bcc42edee86cbe9c1d9f42ca2dbc490bcec91840cbe258dc7e0db82a4ea396ca1779 languageName: node linkType: hard @@ -510,14 +510,14 @@ __metadata: languageName: node linkType: hard -"@babel/generator@npm:^7.12.11, @babel/generator@npm:^7.12.5, @babel/generator@npm:^7.16.8, @babel/generator@npm:^7.19.3, @babel/generator@npm:^7.4.0, @babel/generator@npm:^7.7.2, @babel/generator@npm:^7.8.7": - version: 7.19.3 - resolution: "@babel/generator@npm:7.19.3" +"@babel/generator@npm:^7.12.11, @babel/generator@npm:^7.12.5, @babel/generator@npm:^7.16.8, @babel/generator@npm:^7.19.3, @babel/generator@npm:^7.19.4, @babel/generator@npm:^7.4.0, @babel/generator@npm:^7.7.2, @babel/generator@npm:^7.8.7": + version: 7.19.5 + resolution: "@babel/generator@npm:7.19.5" dependencies: - "@babel/types": ^7.19.3 + "@babel/types": ^7.19.4 "@jridgewell/gen-mapping": ^0.3.2 jsesc: ^2.5.1 - checksum: a9ef340a17eee394f9f7a79aaee1ee2a5db2f54414ccccb29fe1c889d9811b04547921235ff91ee0191fa215f63a3a86e6b267e2aa988f04776f07e134bf86d2 + checksum: e0308398b212bbe09648ede3838b9004362586195c5a476bd73adf16f5786253676345c80920aaf8491f1733214189e8b33e0de4969e3ee5b53a8cb2232107d6 languageName: node linkType: hard @@ -530,7 +530,7 @@ __metadata: languageName: node linkType: hard -"@babel/helper-annotate-as-pure@npm:^7.16.0, @babel/helper-annotate-as-pure@npm:^7.18.6": +"@babel/helper-annotate-as-pure@npm:^7.18.6": version: 7.18.6 resolution: "@babel/helper-annotate-as-pure@npm:7.18.6" dependencies: @@ -652,7 +652,7 @@ __metadata: languageName: node linkType: hard -"@babel/helper-module-imports@npm:^7.0.0, @babel/helper-module-imports@npm:^7.16.0, @babel/helper-module-imports@npm:^7.16.7, @babel/helper-module-imports@npm:^7.18.6, @babel/helper-module-imports@npm:^7.8.3": +"@babel/helper-module-imports@npm:^7.16.7, @babel/helper-module-imports@npm:^7.18.6, @babel/helper-module-imports@npm:^7.8.3": version: 7.18.6 resolution: "@babel/helper-module-imports@npm:7.18.6" dependencies: @@ -728,11 +728,11 @@ __metadata: linkType: hard "@babel/helper-simple-access@npm:^7.18.6": - version: 7.18.6 - resolution: "@babel/helper-simple-access@npm:7.18.6" + version: 7.19.4 + resolution: "@babel/helper-simple-access@npm:7.19.4" dependencies: - "@babel/types": ^7.18.6 - checksum: 5da522f4cec805389cc2710a33c87638dc8afce59f36af302f75827a834b7ad67b0f118e0417604a5a42817914ab161bee9dd7fdc7dbac8963b8a6afb0398152 + "@babel/types": ^7.19.4 + checksum: 23e36b7a5063200e8ec722746ac41baad70d4c192f3fff5a435e02f599cde5f2b20bb23ff15833fe8763ffebd7677be900f7f9286b848363a97adc9aab642016 languageName: node linkType: hard @@ -754,10 +754,10 @@ __metadata: languageName: node linkType: hard -"@babel/helper-string-parser@npm:^7.18.10": - version: 7.18.10 - resolution: "@babel/helper-string-parser@npm:7.18.10" - checksum: d32cba5466806e79a8e6242773619fd72dd504e5f432752811c143e7d721c18c5143322a583f18ea0e8ba579de8a5ea32552dc79ef14f76fb2990d5b71fa06ef +"@babel/helper-string-parser@npm:^7.19.4": + version: 7.19.4 + resolution: "@babel/helper-string-parser@npm:7.19.4" + checksum: e20c81582e75df2a020a1c547376668a6e1e1c2ca535a6b7abb25b83d5536c99c0d113184bbe87c1a26e923a9bb0c6e5279fca8db6bd609cd3499fafafc01598 languageName: node linkType: hard @@ -788,13 +788,13 @@ __metadata: linkType: hard "@babel/helpers@npm:^7.12.5, @babel/helpers@npm:^7.16.7, @babel/helpers@npm:^7.19.0, @babel/helpers@npm:^7.8.4": - version: 7.19.0 - resolution: "@babel/helpers@npm:7.19.0" + version: 7.19.4 + resolution: "@babel/helpers@npm:7.19.4" dependencies: "@babel/template": ^7.18.10 - "@babel/traverse": ^7.19.0 - "@babel/types": ^7.19.0 - checksum: 810d9b7927d56b2e2dad07b899d0503bf6d1fa9fa84df9dccb2283509033f1eb494c48ad1e67516293f6c40e16ae8c3528402e6c9060119bb987665396606a6e + "@babel/traverse": ^7.19.4 + "@babel/types": ^7.19.4 + checksum: e13cca08375f5fe816f01173f6cffc685c3b0605bf7fd94ac76495209f57d69e352fa93bf0ff87f63d705d53b5d5e75abd0b5c2e653776c744911140e5ae7c7e languageName: node linkType: hard @@ -809,12 +809,12 @@ __metadata: languageName: node linkType: hard -"@babel/parser@npm:^7.1.0, @babel/parser@npm:^7.11.5, @babel/parser@npm:^7.12.11, @babel/parser@npm:^7.12.7, @babel/parser@npm:^7.13.12, @babel/parser@npm:^7.13.16, @babel/parser@npm:^7.14.7, @babel/parser@npm:^7.16.12, @babel/parser@npm:^7.16.4, @babel/parser@npm:^7.16.7, @babel/parser@npm:^7.18.10, @babel/parser@npm:^7.18.4, @babel/parser@npm:^7.19.3, @babel/parser@npm:^7.4.3, @babel/parser@npm:^7.4.5, @babel/parser@npm:^7.6.0, @babel/parser@npm:^7.7.0, @babel/parser@npm:^7.8.6, @babel/parser@npm:^7.8.7, @babel/parser@npm:^7.9.6": - version: 7.19.3 - resolution: "@babel/parser@npm:7.19.3" +"@babel/parser@npm:^7.1.0, @babel/parser@npm:^7.11.5, @babel/parser@npm:^7.12.11, @babel/parser@npm:^7.12.7, @babel/parser@npm:^7.13.12, @babel/parser@npm:^7.13.16, @babel/parser@npm:^7.14.7, @babel/parser@npm:^7.16.12, @babel/parser@npm:^7.16.4, @babel/parser@npm:^7.16.7, @babel/parser@npm:^7.18.10, @babel/parser@npm:^7.18.4, @babel/parser@npm:^7.19.3, @babel/parser@npm:^7.19.4, @babel/parser@npm:^7.4.3, @babel/parser@npm:^7.4.5, @babel/parser@npm:^7.6.0, @babel/parser@npm:^7.7.0, @babel/parser@npm:^7.8.6, @babel/parser@npm:^7.8.7, @babel/parser@npm:^7.9.6": + version: 7.19.4 + resolution: "@babel/parser@npm:7.19.4" bin: parser: ./bin/babel-parser.js - checksum: 38f5869733576c55364eb926d81d5efd9cc604d9464f32beada4229af33f1a48e53bb167ad978f7565a9eed31a622c2ff85da891fe0083203d793a1d414f1e3b + checksum: 51a69ca46dcd4d303df3466bc0ac3da421fdbf3cc62c1cd59d4776561334fe048e2b2445356074fdba54905cad6389feea650c6cc69131c77e93faeae141bb78 languageName: node linkType: hard @@ -1006,18 +1006,18 @@ __metadata: languageName: node linkType: hard -"@babel/plugin-proposal-object-rest-spread@npm:^7.16.7, @babel/plugin-proposal-object-rest-spread@npm:^7.17.3, @babel/plugin-proposal-object-rest-spread@npm:^7.18.9": - version: 7.18.9 - resolution: "@babel/plugin-proposal-object-rest-spread@npm:7.18.9" +"@babel/plugin-proposal-object-rest-spread@npm:^7.16.7, @babel/plugin-proposal-object-rest-spread@npm:^7.17.3, @babel/plugin-proposal-object-rest-spread@npm:^7.19.4": + version: 7.19.4 + resolution: "@babel/plugin-proposal-object-rest-spread@npm:7.19.4" dependencies: - "@babel/compat-data": ^7.18.8 - "@babel/helper-compilation-targets": ^7.18.9 - "@babel/helper-plugin-utils": ^7.18.9 + "@babel/compat-data": ^7.19.4 + "@babel/helper-compilation-targets": ^7.19.3 + "@babel/helper-plugin-utils": ^7.19.0 "@babel/plugin-syntax-object-rest-spread": ^7.8.3 "@babel/plugin-transform-parameters": ^7.18.8 peerDependencies: "@babel/core": ^7.0.0-0 - checksum: 8e58aa40511897256f98dc558003ce3dd41073e30a9a63045eae1d5f4d9a599f5931670e19f3be62099b92be9381ccfa698c261101180dab2c257f23bde89e48 + checksum: 0c51c3ef25890ee69bec275db6d4a79b475b809dcb473cd64d5afed96f60be51d928a59356beb69e40b1328c34715e400b48322c6af823ba3792bbe52d7cc7d9 languageName: node linkType: hard @@ -1385,14 +1385,14 @@ __metadata: languageName: node linkType: hard -"@babel/plugin-transform-block-scoping@npm:^7.16.7, @babel/plugin-transform-block-scoping@npm:^7.18.9, @babel/plugin-transform-block-scoping@npm:^7.8.3": - version: 7.18.9 - resolution: "@babel/plugin-transform-block-scoping@npm:7.18.9" +"@babel/plugin-transform-block-scoping@npm:^7.16.7, @babel/plugin-transform-block-scoping@npm:^7.19.4, @babel/plugin-transform-block-scoping@npm:^7.8.3": + version: 7.19.4 + resolution: "@babel/plugin-transform-block-scoping@npm:7.19.4" dependencies: - "@babel/helper-plugin-utils": ^7.18.9 + "@babel/helper-plugin-utils": ^7.19.0 peerDependencies: "@babel/core": ^7.0.0-0 - checksum: 1645188b7bd97ee10832607c9072af5184823cfd67cd319b7fb90544d27d45b222e85118dc07581913d14b1c6b36ba100c321ecdd311b107a2fb48427bff762e + checksum: 442e93711e3951d4f14e9ef1bc15220273a3d99cb5c1f1c785dac9e32f69eab9d9f3849c82fab8f9590116b0151ae5d2026029276448552e2201733aa394135d languageName: node linkType: hard @@ -1426,14 +1426,14 @@ __metadata: languageName: node linkType: hard -"@babel/plugin-transform-destructuring@npm:^7.16.7, @babel/plugin-transform-destructuring@npm:^7.17.3, @babel/plugin-transform-destructuring@npm:^7.18.13": - version: 7.18.13 - resolution: "@babel/plugin-transform-destructuring@npm:7.18.13" +"@babel/plugin-transform-destructuring@npm:^7.16.7, @babel/plugin-transform-destructuring@npm:^7.17.3, @babel/plugin-transform-destructuring@npm:^7.19.4": + version: 7.19.4 + resolution: "@babel/plugin-transform-destructuring@npm:7.19.4" dependencies: - "@babel/helper-plugin-utils": ^7.18.9 + "@babel/helper-plugin-utils": ^7.19.0 peerDependencies: "@babel/core": ^7.0.0-0 - checksum: fd6ccf9242d9d12f3d42d0a274aa668608d8805675e72729e04b2fafa9a6613872d548847f8c9359629a0a00ab0a433385e173e99f00991161afb9c577c3bfe0 + checksum: 09f6e41b10e5c798bd9c2b09b7243b5c06088c220494aff699e604306797188698bb9f00f50963bb89707af11f979b888ff7ff0eb498a5200d64b759fc0ece34 languageName: node linkType: hard @@ -1977,10 +1977,10 @@ __metadata: linkType: hard "@babel/preset-env@npm:^7.12.11, @babel/preset-env@npm:^7.16.11, @babel/preset-env@npm:^7.16.5, @babel/preset-env@npm:^7.17.10": - version: 7.19.3 - resolution: "@babel/preset-env@npm:7.19.3" + version: 7.19.4 + resolution: "@babel/preset-env@npm:7.19.4" dependencies: - "@babel/compat-data": ^7.19.3 + "@babel/compat-data": ^7.19.4 "@babel/helper-compilation-targets": ^7.19.3 "@babel/helper-plugin-utils": ^7.19.0 "@babel/helper-validator-option": ^7.18.6 @@ -1995,7 +1995,7 @@ __metadata: "@babel/plugin-proposal-logical-assignment-operators": ^7.18.9 "@babel/plugin-proposal-nullish-coalescing-operator": ^7.18.6 "@babel/plugin-proposal-numeric-separator": ^7.18.6 - "@babel/plugin-proposal-object-rest-spread": ^7.18.9 + "@babel/plugin-proposal-object-rest-spread": ^7.19.4 "@babel/plugin-proposal-optional-catch-binding": ^7.18.6 "@babel/plugin-proposal-optional-chaining": ^7.18.9 "@babel/plugin-proposal-private-methods": ^7.18.6 @@ -2019,10 +2019,10 @@ __metadata: "@babel/plugin-transform-arrow-functions": ^7.18.6 "@babel/plugin-transform-async-to-generator": ^7.18.6 "@babel/plugin-transform-block-scoped-functions": ^7.18.6 - "@babel/plugin-transform-block-scoping": ^7.18.9 + "@babel/plugin-transform-block-scoping": ^7.19.4 "@babel/plugin-transform-classes": ^7.19.0 "@babel/plugin-transform-computed-properties": ^7.18.9 - "@babel/plugin-transform-destructuring": ^7.18.13 + "@babel/plugin-transform-destructuring": ^7.19.4 "@babel/plugin-transform-dotall-regex": ^7.18.6 "@babel/plugin-transform-duplicate-keys": ^7.18.9 "@babel/plugin-transform-exponentiation-operator": ^7.18.6 @@ -2049,7 +2049,7 @@ __metadata: "@babel/plugin-transform-unicode-escapes": ^7.18.10 "@babel/plugin-transform-unicode-regex": ^7.18.6 "@babel/preset-modules": ^0.1.5 - "@babel/types": ^7.19.3 + "@babel/types": ^7.19.4 babel-plugin-polyfill-corejs2: ^0.3.3 babel-plugin-polyfill-corejs3: ^0.6.0 babel-plugin-polyfill-regenerator: ^0.4.1 @@ -2057,7 +2057,7 @@ __metadata: semver: ^6.3.0 peerDependencies: "@babel/core": ^7.0.0-0 - checksum: de30eb89873974f36721a22e4c1b9f7cc48931e607eabc00ef43b4c39f5459b6fdc55206bd1d2ad78db313b6543bfc81c6bbf0f6928861af4dfddb04c7476f6f + checksum: a0c1e9e575c497d71ccf84242276356abb6c4fede7c52733785e988131458433dd2329bd96921465c23b30d2cad19977c23617b657d986dac3d6fed544b45a29 languageName: node linkType: hard @@ -2134,12 +2134,12 @@ __metadata: linkType: hard "@babel/runtime-corejs3@npm:^7.10.2": - version: 7.19.1 - resolution: "@babel/runtime-corejs3@npm:7.19.1" + version: 7.19.4 + resolution: "@babel/runtime-corejs3@npm:7.19.4" dependencies: core-js-pure: ^3.25.1 regenerator-runtime: ^0.13.4 - checksum: 84c509499eed1c32ad280830fc1dccb6f1cc7858dc8946709a1776781cd80e6de12820d6108f0224d4fd4070fdec1b8a2090dfa62a6cc334182a6186ef7bf0ca + checksum: 01b55c54c4b649d4897f873982ee0097b1f9d597b62a97491c5ca4b0e659bf9576914d00b2cd6d140f19497a8f5ace6efdb958eff123ffa499c422f338946deb languageName: node linkType: hard @@ -2170,12 +2170,12 @@ __metadata: languageName: node linkType: hard -"@babel/runtime@npm:^7.1.2, @babel/runtime@npm:^7.10.2, @babel/runtime@npm:^7.10.5, @babel/runtime@npm:^7.11.2, @babel/runtime@npm:^7.12.5, @babel/runtime@npm:^7.14.8, @babel/runtime@npm:^7.17.2, @babel/runtime@npm:^7.17.8, @babel/runtime@npm:^7.18.3, @babel/runtime@npm:^7.18.9, @babel/runtime@npm:^7.3.1, @babel/runtime@npm:^7.5.0, @babel/runtime@npm:^7.7.2, @babel/runtime@npm:^7.7.6, @babel/runtime@npm:^7.8.4, @babel/runtime@npm:^7.9.2": - version: 7.19.0 - resolution: "@babel/runtime@npm:7.19.0" +"@babel/runtime@npm:^7.10.2, @babel/runtime@npm:^7.10.5, @babel/runtime@npm:^7.11.2, @babel/runtime@npm:^7.12.5, @babel/runtime@npm:^7.14.8, @babel/runtime@npm:^7.17.2, @babel/runtime@npm:^7.17.8, @babel/runtime@npm:^7.18.3, @babel/runtime@npm:^7.18.9, @babel/runtime@npm:^7.3.1, @babel/runtime@npm:^7.5.0, @babel/runtime@npm:^7.7.6, @babel/runtime@npm:^7.8.4, @babel/runtime@npm:^7.9.2": + version: 7.19.4 + resolution: "@babel/runtime@npm:7.19.4" dependencies: regenerator-runtime: ^0.13.4 - checksum: 42d4f11d6a5bfcf5a3d05346e7f1aef79a53b9e1968b4dc54a0682df60284300c97de3be63f4d5dd47b404d3a1022a8a57444b5d150822ec8974757de7233f6e + checksum: 3ad7f298262cf1f060a3bf2be9f65afa3c034c9c7a2e7c9d3ec41ab58c944c86756d0e0fdfc08d178f983f48d6b5613c15253d83216fbe02b6141c13d28f12e5 languageName: node linkType: hard @@ -2221,32 +2221,32 @@ __metadata: languageName: node linkType: hard -"@babel/traverse@npm:^7.0.0, @babel/traverse@npm:^7.1.0, @babel/traverse@npm:^7.1.6, @babel/traverse@npm:^7.12.11, @babel/traverse@npm:^7.12.9, @babel/traverse@npm:^7.16.10, @babel/traverse@npm:^7.19.0, @babel/traverse@npm:^7.19.1, @babel/traverse@npm:^7.19.3, @babel/traverse@npm:^7.4.3, @babel/traverse@npm:^7.4.5, @babel/traverse@npm:^7.7.0, @babel/traverse@npm:^7.7.2, @babel/traverse@npm:^7.8.6": - version: 7.19.3 - resolution: "@babel/traverse@npm:7.19.3" +"@babel/traverse@npm:^7.1.0, @babel/traverse@npm:^7.1.6, @babel/traverse@npm:^7.12.11, @babel/traverse@npm:^7.12.9, @babel/traverse@npm:^7.16.10, @babel/traverse@npm:^7.19.0, @babel/traverse@npm:^7.19.1, @babel/traverse@npm:^7.19.3, @babel/traverse@npm:^7.19.4, @babel/traverse@npm:^7.4.3, @babel/traverse@npm:^7.4.5, @babel/traverse@npm:^7.7.0, @babel/traverse@npm:^7.7.2, @babel/traverse@npm:^7.8.6": + version: 7.19.4 + resolution: "@babel/traverse@npm:7.19.4" dependencies: "@babel/code-frame": ^7.18.6 - "@babel/generator": ^7.19.3 + "@babel/generator": ^7.19.4 "@babel/helper-environment-visitor": ^7.18.9 "@babel/helper-function-name": ^7.19.0 "@babel/helper-hoist-variables": ^7.18.6 "@babel/helper-split-export-declaration": ^7.18.6 - "@babel/parser": ^7.19.3 - "@babel/types": ^7.19.3 + "@babel/parser": ^7.19.4 + "@babel/types": ^7.19.4 debug: ^4.1.0 globals: ^11.1.0 - checksum: fd0669353ea6346f77060ed8a49987e6747ce7f0b61581d110e6c5ed3cc3dd86032d7ff9e379b658131b2d421355d454a37c4222a620d221ada2b1196f95e74d + checksum: 592312804a5d4fe87a5c9c914e94c292055e67ba9fdba6b5b0b9ea1f93008a7bc3aed7e56cdd1550ca758dba8212cf96eb82990ee4c5697a3bd407203211c020 languageName: node linkType: hard -"@babel/types@npm:^7.0.0, @babel/types@npm:^7.11.5, @babel/types@npm:^7.12.11, @babel/types@npm:^7.12.7, @babel/types@npm:^7.16.7, @babel/types@npm:^7.16.8, @babel/types@npm:^7.18.10, @babel/types@npm:^7.18.6, @babel/types@npm:^7.18.8, @babel/types@npm:^7.18.9, @babel/types@npm:^7.19.0, @babel/types@npm:^7.19.3, @babel/types@npm:^7.2.0, @babel/types@npm:^7.3.0, @babel/types@npm:^7.3.3, @babel/types@npm:^7.4.0, @babel/types@npm:^7.4.4, @babel/types@npm:^7.6.1, @babel/types@npm:^7.7.0, @babel/types@npm:^7.7.2, @babel/types@npm:^7.8.3, @babel/types@npm:^7.8.6, @babel/types@npm:^7.8.7, @babel/types@npm:^7.9.6": - version: 7.19.3 - resolution: "@babel/types@npm:7.19.3" +"@babel/types@npm:^7.0.0, @babel/types@npm:^7.11.5, @babel/types@npm:^7.12.11, @babel/types@npm:^7.12.7, @babel/types@npm:^7.16.7, @babel/types@npm:^7.16.8, @babel/types@npm:^7.18.10, @babel/types@npm:^7.18.6, @babel/types@npm:^7.18.8, @babel/types@npm:^7.18.9, @babel/types@npm:^7.19.0, @babel/types@npm:^7.19.3, @babel/types@npm:^7.19.4, @babel/types@npm:^7.2.0, @babel/types@npm:^7.3.0, @babel/types@npm:^7.3.3, @babel/types@npm:^7.4.0, @babel/types@npm:^7.4.4, @babel/types@npm:^7.6.1, @babel/types@npm:^7.7.0, @babel/types@npm:^7.7.2, @babel/types@npm:^7.8.3, @babel/types@npm:^7.8.6, @babel/types@npm:^7.8.7, @babel/types@npm:^7.9.6": + version: 7.19.4 + resolution: "@babel/types@npm:7.19.4" dependencies: - "@babel/helper-string-parser": ^7.18.10 + "@babel/helper-string-parser": ^7.19.4 "@babel/helper-validator-identifier": ^7.19.1 to-fast-properties: ^2.0.0 - checksum: a31e612300c6f7e6bd79e19553c03da1f33ea01a3d08fb91f76b2f55422b5ebf9f30a5b8c5eedc80d27fe7812c43fa9f9ff01289a09751a64b800b89dd4ca6dc + checksum: 62d0d24fc87e36666874725b05bb0895a8834f09713ec76bf28eb2b615aa80287fd3f29801a923b9ff8a90d7f8ffd4b40bc7bc4840e4a530e165cdab3e6bfb78 languageName: node linkType: hard @@ -2585,15 +2585,6 @@ __metadata: languageName: node linkType: hard -"@emotion/is-prop-valid@npm:^0.8.1": - version: 0.8.8 - resolution: "@emotion/is-prop-valid@npm:0.8.8" - dependencies: - "@emotion/memoize": 0.7.4 - checksum: f6be625f067c7fa56a12a4edaf090715616dc4fc7803c87212831f38c969350107b9709b1be54100e53153b18d9fa068eb4bf4f9ac66a37a8edf1bac9b64e279 - languageName: node - linkType: hard - "@emotion/is-prop-valid@npm:^1.2.0": version: 1.2.0 resolution: "@emotion/is-prop-valid@npm:1.2.0" @@ -2624,13 +2615,6 @@ __metadata: languageName: node linkType: hard -"@emotion/memoize@npm:0.7.4": - version: 0.7.4 - resolution: "@emotion/memoize@npm:0.7.4" - checksum: b2376548fc147b43afd1ff005a80a1a025bd7eb4fb759fdb23e96e5ff290ee8ba16628a332848d600fb91c3cdc319eee5395fa33d8875e5d5a8c4ce18cddc18e - languageName: node - linkType: hard - "@emotion/memoize@npm:^0.8.0": version: 0.8.0 resolution: "@emotion/memoize@npm:0.8.0" @@ -2705,13 +2689,6 @@ __metadata: languageName: node linkType: hard -"@emotion/unitless@npm:^0.7.0": - version: 0.7.5 - resolution: "@emotion/unitless@npm:0.7.5" - checksum: 4d0d94f53cb97b4481bbfa394953e1899a0b877644642ba9dd7247c27eb8c48e14e22aeb11411d7d9874685ad85dd5fb5b50eb78c6d8840eb56a84b92dcef2f4 - languageName: node - linkType: hard - "@emotion/unitless@npm:^0.8.0": version: 0.8.0 resolution: "@emotion/unitless@npm:0.8.0" @@ -2953,19 +2930,6 @@ __metadata: languageName: node linkType: hard -"@hypnosphi/create-react-context@npm:^0.3.1": - version: 0.3.1 - resolution: "@hypnosphi/create-react-context@npm:0.3.1" - dependencies: - gud: ^1.0.0 - warning: ^4.0.3 - peerDependencies: - prop-types: ^15.0.0 - react: ">=0.14.0" - checksum: e8072221f9f9c2c47c3ebc5bc6079f9a71938e181d2b4aa3e1d3922707bc097336d5260dad088cf47c1d6e1ff34839fa21f2505a95bddda0d7548c5a955b5691 - languageName: node - linkType: hard - "@istanbuljs/load-nyc-config@npm:^1.0.0": version: 1.1.0 resolution: "@istanbuljs/load-nyc-config@npm:1.1.0" @@ -6762,7 +6726,7 @@ __metadata: languageName: unknown linkType: soft -"@storybook/addon-storyshots-puppeteer@7.0.0-alpha.35, @storybook/addon-storyshots-puppeteer@workspace:*, @storybook/addon-storyshots-puppeteer@workspace:addons/storyshots/storyshots-puppeteer": +"@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" dependencies: @@ -7696,29 +7660,6 @@ __metadata: languageName: node linkType: hard -"@storybook/design-system@npm:^5.4.7": - version: 5.6.8 - resolution: "@storybook/design-system@npm:5.6.8" - dependencies: - "@types/pluralize": ^0.0.29 - "@types/prismjs": ^1.16.6 - copy-to-clipboard: ^3.3.1 - pluralize: ^8.0.0 - polished: ^3.6.4 - prismjs: 1.23.0 - prop-types: ^15.5.4 - react-github-button: ^0.1.11 - react-modal: ^3.11.2 - react-popper-tooltip: ^2.11.1 - styled-components: ^4.4.1 - uuid: ^3.3.3 - peerDependencies: - react: ^15.0.0 || ^16.0.0 - react-dom: ^15.0.0 || ^16.0.0 - checksum: 45d61b7fd5e8de1e8532f7372a24a0a285d33e09dfe98e6611811680deb7de1d0b608f9c64690b52d807b48ab4f88b55640cd194bca51230d9706ff08743ade8 - languageName: node - linkType: hard - "@storybook/docs-mdx@npm:0.0.1-canary.12433cf.0": version: 0.0.1-canary.12433cf.0 resolution: "@storybook/docs-mdx@npm:0.0.1-canary.12433cf.0" @@ -8635,8 +8576,6 @@ __metadata: built: false puppeteer: optional: true - styled-components: - built: false ts-loader: optional: true verdaccio: @@ -9974,16 +9913,16 @@ __metadata: linkType: hard "@types/node@npm:*, @types/node@npm:>= 8, @types/node@npm:>=10.0.0, @types/node@npm:^18.7.20": - version: 18.8.3 - resolution: "@types/node@npm:18.8.3" - checksum: 67d837c55ae33b290ec01d8adb75d695ac7e7beddda5b7646eb53382c9f29f98c3e5307b9a4ba122cbebbef4b84d18a12cff4e4312eb9d12e7acd747cc75239a + version: 18.8.4 + resolution: "@types/node@npm:18.8.4" + checksum: 2dab5a821edd12c2e435c14645dc396d568090c1703d65aef2f8a2b66abf24cce8cd925ce7c645a105c505a1457722159d6248e9f69f35c0d196fa85e0a52f3c languageName: node linkType: hard "@types/node@npm:^14.0.10 || ^16.0.0, @types/node@npm:^14.14.20 || ^16.0.0": - version: 16.11.64 - resolution: "@types/node@npm:16.11.64" - checksum: 4b5ee37e3d2dc3364abbffee7e9f4c27fc22b44305ff5920fcc1b7fe08343bf113fface6a565c2406f77f8818d5ddcfb31652df6a43e4ab971976256d176bf37 + version: 16.11.65 + resolution: "@types/node@npm:16.11.65" + checksum: 5d66c2e0119ff194b2e196b0016d5d083fd332a114cea04822fbc22a7733b2feba0db9de380a289f457312a24b2f313396084b682d670038f5b2ced2d14fc659 languageName: node linkType: hard @@ -10052,13 +9991,6 @@ __metadata: languageName: node linkType: hard -"@types/pluralize@npm:^0.0.29": - version: 0.0.29 - resolution: "@types/pluralize@npm:0.0.29" - checksum: 840796fa1db158eb4d9787758d134736e29d9a8035f5b0cbad06e3801fc64b79112ba944c83f9a1a5b94da08703f505b8315b7e0f28bfc0f8e9e1ccfead7b083 - languageName: node - linkType: hard - "@types/prettier@npm:^2.0.0, @types/prettier@npm:^2.1.5": version: 2.7.1 resolution: "@types/prettier@npm:2.7.1" @@ -10073,13 +10005,6 @@ __metadata: languageName: node linkType: hard -"@types/prismjs@npm:^1.16.6": - version: 1.26.0 - resolution: "@types/prismjs@npm:1.26.0" - checksum: dce1388a626c20b95fa2715917deef5a401eec33e9e181f202840ee3b3c7d8a84d5558c834af4c29b8e007741a6a18639b074db8ecccdd6e7de15280fc4dfdd2 - languageName: node - linkType: hard - "@types/prompts@npm:2.0.11": version: 2.0.11 resolution: "@types/prompts@npm:2.0.11" @@ -10577,12 +10502,12 @@ __metadata: linkType: hard "@typescript-eslint/eslint-plugin@npm:^5.15.0": - version: 5.39.0 - resolution: "@typescript-eslint/eslint-plugin@npm:5.39.0" + version: 5.40.0 + resolution: "@typescript-eslint/eslint-plugin@npm:5.40.0" dependencies: - "@typescript-eslint/scope-manager": 5.39.0 - "@typescript-eslint/type-utils": 5.39.0 - "@typescript-eslint/utils": 5.39.0 + "@typescript-eslint/scope-manager": 5.40.0 + "@typescript-eslint/type-utils": 5.40.0 + "@typescript-eslint/utils": 5.40.0 debug: ^4.3.4 ignore: ^5.2.0 regexpp: ^3.2.0 @@ -10594,7 +10519,7 @@ __metadata: peerDependenciesMeta: typescript: optional: true - checksum: 49e9ac59e06ac041bcc965dc6bd69f4e902b260a64fcf84e3193cf64f817d77abaf4e5b90baddadfc59ff303f5d54abadb62759cf4178451e34d35ab7d304bbb + checksum: 51e92fe54b6dcdc5a06fb355c0f33ba9d701fe9afed153e5fc07d0161273fa7aec5005d7c38da9cd59ba54019c8738e020716cd03c55527504ad596c4ffbbdb0 languageName: node linkType: hard @@ -10615,19 +10540,19 @@ __metadata: linkType: hard "@typescript-eslint/parser@npm:^5.15.0": - version: 5.39.0 - resolution: "@typescript-eslint/parser@npm:5.39.0" + version: 5.40.0 + resolution: "@typescript-eslint/parser@npm:5.40.0" dependencies: - "@typescript-eslint/scope-manager": 5.39.0 - "@typescript-eslint/types": 5.39.0 - "@typescript-eslint/typescript-estree": 5.39.0 + "@typescript-eslint/scope-manager": 5.40.0 + "@typescript-eslint/types": 5.40.0 + "@typescript-eslint/typescript-estree": 5.40.0 debug: ^4.3.4 peerDependencies: eslint: ^6.0.0 || ^7.0.0 || ^8.0.0 peerDependenciesMeta: typescript: optional: true - checksum: 29070efbd1d0053f482cf97afbd25f91d6d65d7daa28afc2e95781a02b634c5f9f37489cb75f7ac29fc16d6bce5ed56efead28c495a039848b07645c2bf555b2 + checksum: aecb9ff21e17c3d940c9ede426d177ae0ef41ff133b5bb2b5b2c39a3773a35fcf7aa7729ef7081d31fce2c8cffa75c3615ebf49bc45042b69a1754c263315e03 languageName: node linkType: hard @@ -10641,22 +10566,22 @@ __metadata: languageName: node linkType: hard -"@typescript-eslint/scope-manager@npm:5.39.0": - version: 5.39.0 - resolution: "@typescript-eslint/scope-manager@npm:5.39.0" +"@typescript-eslint/scope-manager@npm:5.40.0": + version: 5.40.0 + resolution: "@typescript-eslint/scope-manager@npm:5.40.0" dependencies: - "@typescript-eslint/types": 5.39.0 - "@typescript-eslint/visitor-keys": 5.39.0 - checksum: 42b0b6094e100eade585e5e40e376ea392d556b6a65ea93d55824346b916c7481619e55ffda2cd8ab26ef17e7b1c9a37d740079c3b10584783dc0ce20b900ed7 + "@typescript-eslint/types": 5.40.0 + "@typescript-eslint/visitor-keys": 5.40.0 + checksum: 0a27270c7f8174b0173c3200b7019d07d1bb7d37dec7f94e417c25a994a0bd646160c204c2ce647f74df0ecdf33bacb73f9e0e41560777d3d51ddb422cdf3938 languageName: node linkType: hard -"@typescript-eslint/type-utils@npm:5.39.0": - version: 5.39.0 - resolution: "@typescript-eslint/type-utils@npm:5.39.0" +"@typescript-eslint/type-utils@npm:5.40.0": + version: 5.40.0 + resolution: "@typescript-eslint/type-utils@npm:5.40.0" dependencies: - "@typescript-eslint/typescript-estree": 5.39.0 - "@typescript-eslint/utils": 5.39.0 + "@typescript-eslint/typescript-estree": 5.40.0 + "@typescript-eslint/utils": 5.40.0 debug: ^4.3.4 tsutils: ^3.21.0 peerDependencies: @@ -10664,7 +10589,7 @@ __metadata: peerDependenciesMeta: typescript: optional: true - checksum: 44d5de03056a6138684ef056c3cc787a12408839ba5e351834a72e7b60c0b8585a8a58e3fdf129de9c6a0b1909204cf9787a6fde4737e4bbd7268b3c35a4f998 + checksum: ec9350d7f2c55d7307e7f90de967ffe478c47e891f1d022173d2681b792f5a45f1f2f8cbb283a867c859a19f9c592b0ae764b46545b5d7865c78ce13d8782d38 languageName: node linkType: hard @@ -10675,10 +10600,10 @@ __metadata: languageName: node linkType: hard -"@typescript-eslint/types@npm:5.39.0": - version: 5.39.0 - resolution: "@typescript-eslint/types@npm:5.39.0" - checksum: 41f6a967f5f4d38c37fc143415e6d6cbb91f2653718e36a5d965b364bd42639f383e867374b7496fa53778150a39a99f335dbb372d947cd33052bc99e36e3927 +"@typescript-eslint/types@npm:5.40.0": + version: 5.40.0 + resolution: "@typescript-eslint/types@npm:5.40.0" + checksum: d9f328c559fe2b66c949ee0614a51b9be0d9afd688487cd712dc9f23b92aeb00dae5163336f3568b5e1e2644d539bd1586558bf8a08932dfd21cc169c6658d57 languageName: node linkType: hard @@ -10700,12 +10625,12 @@ __metadata: languageName: node linkType: hard -"@typescript-eslint/typescript-estree@npm:5.39.0": - version: 5.39.0 - resolution: "@typescript-eslint/typescript-estree@npm:5.39.0" +"@typescript-eslint/typescript-estree@npm:5.40.0": + version: 5.40.0 + resolution: "@typescript-eslint/typescript-estree@npm:5.40.0" dependencies: - "@typescript-eslint/types": 5.39.0 - "@typescript-eslint/visitor-keys": 5.39.0 + "@typescript-eslint/types": 5.40.0 + "@typescript-eslint/visitor-keys": 5.40.0 debug: ^4.3.4 globby: ^11.1.0 is-glob: ^4.0.3 @@ -10714,23 +10639,24 @@ __metadata: peerDependenciesMeta: typescript: optional: true - checksum: 509abd51213a4eb6dcb24dab9ce82a354603d3cb57bba6feac9ef35a6794b37fad69ae0228a2ad20c11c5a8a80a1fee6c82312660e30efaab611fc1ed31fde37 + checksum: a89d168729146ea5d07f451ad95368299744fbc6c2e640ad23a7b8a55ab8acc8fda0c70b5cce808fecd566e93dc7ed0c14c103cfc2a471171cde6f9f9b9a38b2 languageName: node linkType: hard -"@typescript-eslint/utils@npm:5.39.0": - version: 5.39.0 - resolution: "@typescript-eslint/utils@npm:5.39.0" +"@typescript-eslint/utils@npm:5.40.0": + version: 5.40.0 + resolution: "@typescript-eslint/utils@npm:5.40.0" dependencies: "@types/json-schema": ^7.0.9 - "@typescript-eslint/scope-manager": 5.39.0 - "@typescript-eslint/types": 5.39.0 - "@typescript-eslint/typescript-estree": 5.39.0 + "@typescript-eslint/scope-manager": 5.40.0 + "@typescript-eslint/types": 5.40.0 + "@typescript-eslint/typescript-estree": 5.40.0 eslint-scope: ^5.1.1 eslint-utils: ^3.0.0 + semver: ^7.3.7 peerDependencies: eslint: ^6.0.0 || ^7.0.0 || ^8.0.0 - checksum: ce48141ccea29cb9720be99c1cc93f6d4264c6706a29b6c9a69a01c8b9a55408f6aa053aa66c87f45e1a016be298dc4b8972d0119ef36daf8f60a4695a54f453 + checksum: ff374e26b4404ee962e85464c21040f6ebb52b650daf15f901b0ed3d9581b1611bb54b327d341faee11f07611ba6285425190fe2ad45d2764e44cbaffb96ac42 languageName: node linkType: hard @@ -10744,13 +10670,13 @@ __metadata: languageName: node linkType: hard -"@typescript-eslint/visitor-keys@npm:5.39.0": - version: 5.39.0 - resolution: "@typescript-eslint/visitor-keys@npm:5.39.0" +"@typescript-eslint/visitor-keys@npm:5.40.0": + version: 5.40.0 + resolution: "@typescript-eslint/visitor-keys@npm:5.40.0" dependencies: - "@typescript-eslint/types": 5.39.0 + "@typescript-eslint/types": 5.40.0 eslint-visitor-keys: ^3.3.0 - checksum: 3d90aad33d5f90d961a6a1cf88c2964a789d896eecbe1593361ab7107eda05feeb7dba56d921ba4adf340e5aad8c176e0996b4f545e1d25ef0d9c32957722b3f + checksum: c973fc9429fe2aeb375821645d2bb5439f80ed2e77ff89def205aba272343ed3c7b18ee0a4e718f5e753f972d0718c6c8facb3b177fdfb5b5f3be3998f9299d4 languageName: node linkType: hard @@ -11271,9 +11197,9 @@ __metadata: linkType: hard "@xmldom/xmldom@npm:^0.8.0": - version: 0.8.2 - resolution: "@xmldom/xmldom@npm:0.8.2" - checksum: f5aa52e955661df93c88f906f57e88ea650c0c823913f0892d2c2d574c8ae49a83ec491e8d9951349b4ccee08ae2c7f4aa8eae163cf543625b466cf4b4cbd820 + version: 0.8.3 + resolution: "@xmldom/xmldom@npm:0.8.3" + checksum: 26980d70907fe478e67f5c9a9ef48bc6de13cf13e24fd42f0088eb1f8d09cbb4bfb867e35ab7fcdbe4332a72cbf96e732b230844f8155e3097fc18219d556da0 languageName: node linkType: hard @@ -12865,17 +12791,6 @@ __metadata: languageName: node linkType: hard -"babel-plugin-macros@npm:^2.8.0": - version: 2.8.0 - resolution: "babel-plugin-macros@npm:2.8.0" - dependencies: - "@babel/runtime": ^7.7.2 - cosmiconfig: ^6.0.0 - resolve: ^1.12.0 - checksum: 9a101e2844a800e65662b2a8d0758bdbbe500ae02d68ef6f3466ead7eaa1350e3872b97014b20bf6f3a1a46b3c9613dfac7578af6f6ae6d4eccbd68ad7b6f228 - languageName: node - linkType: hard - "babel-plugin-macros@npm:^3.0.1, babel-plugin-macros@npm:^3.1.0": version: 3.1.0 resolution: "babel-plugin-macros@npm:3.1.0" @@ -12990,28 +12905,6 @@ __metadata: languageName: node linkType: hard -"babel-plugin-styled-components@npm:>= 1": - version: 2.0.7 - resolution: "babel-plugin-styled-components@npm:2.0.7" - dependencies: - "@babel/helper-annotate-as-pure": ^7.16.0 - "@babel/helper-module-imports": ^7.16.0 - babel-plugin-syntax-jsx: ^6.18.0 - lodash: ^4.17.11 - picomatch: ^2.3.0 - peerDependencies: - styled-components: ">= 2" - checksum: 1c639742fb177f36648077a44fd473fe050aa5c664a16ecaa8e366426c44520c2a0011682b90f5b62f3c4317c22938410a6044b7cd99eaba831c00d41a2395c1 - languageName: node - linkType: hard - -"babel-plugin-syntax-jsx@npm:^6.18.0": - version: 6.18.0 - resolution: "babel-plugin-syntax-jsx@npm:6.18.0" - checksum: d5954e9c2a3dd519f23e78674ecfba61394a8fae63499afdeca4214fad68997556ebd15ce012bbc4d527ae0e3cecc98d3e8f78004a68707122642d0df4ab7213 - languageName: node - linkType: hard - "babel-plugin-transform-runtime@npm:6.23.0": version: 6.23.0 resolution: "babel-plugin-transform-runtime@npm:6.23.0" @@ -14619,13 +14512,6 @@ __metadata: languageName: node linkType: hard -"camelize@npm:^1.0.0": - version: 1.0.0 - resolution: "camelize@npm:1.0.0" - checksum: b2cf60c12d002f6f5bff1dc56dedd9fa98767af2090c9699a0cd4da48d02f0b3939d09722028145555528b82da3140a117f92f1f9ecc7928af4fb3bfe86fec35 - languageName: node - linkType: hard - "can-symlink@npm:^1.0.0": version: 1.0.0 resolution: "can-symlink@npm:1.0.0" @@ -15144,17 +15030,6 @@ __metadata: languageName: node linkType: hard -"clipboard@npm:^2.0.0": - version: 2.0.11 - resolution: "clipboard@npm:2.0.11" - dependencies: - good-listener: ^1.2.2 - select: ^1.1.2 - tiny-emitter: ^2.0.0 - checksum: 23bdf16b875bd2dd101eeefae3c25a2fbd990b613fad3d227ca6719d1b81a3c6f69701b494393fdecd07d98380024f82d045f464124dbbafbcf0557f2921978f - languageName: node - linkType: hard - "clipboardy@npm:1.2.2": version: 1.2.2 resolution: "clipboardy@npm:1.2.2" @@ -15861,11 +15736,9 @@ __metadata: linkType: hard "convert-source-map@npm:^1.1.0, convert-source-map@npm:^1.4.0, convert-source-map@npm:^1.5.0, convert-source-map@npm:^1.5.1, convert-source-map@npm:^1.6.0, convert-source-map@npm:^1.7.0": - version: 1.8.0 - resolution: "convert-source-map@npm:1.8.0" - dependencies: - safe-buffer: ~5.1.1 - checksum: da4649990b633c070c0dab1680b89a67b9315dd2b1168d143536f667214c97e4eb4a49e5b7ff912f0196fe303e31fc16a529457436d25b2b5a89613eaf4f27fa + version: 1.9.0 + resolution: "convert-source-map@npm:1.9.0" + checksum: 281da55454bf8126cbc6625385928c43479f2060984180c42f3a86c8b8c12720a24eac260624a7d1e090004028d2dee78602330578ceec1a08e27cb8bb0a8a5b languageName: node linkType: hard @@ -16058,19 +15931,6 @@ __metadata: languageName: node linkType: hard -"cosmiconfig@npm:^6.0.0": - version: 6.0.0 - resolution: "cosmiconfig@npm:6.0.0" - dependencies: - "@types/parse-json": ^4.0.0 - import-fresh: ^3.1.0 - parse-json: ^5.0.0 - path-type: ^4.0.0 - yaml: ^1.7.2 - checksum: 666ed8732d0bf7d7fe6f8516c8ee6041e0622032e8fa26201577b883d2767ad105d03f38b34b93d1f02f26b22a89e7bab4443b9d2e7f931f48d0e944ffa038b5 - languageName: node - linkType: hard - "cosmiconfig@npm:^7.0.0, cosmiconfig@npm:^7.0.1": version: 7.0.1 resolution: "cosmiconfig@npm:7.0.1" @@ -16188,13 +16048,6 @@ __metadata: languageName: node linkType: hard -"css-color-keywords@npm:^1.0.0": - version: 1.0.0 - resolution: "css-color-keywords@npm:1.0.0" - checksum: af205a86c68e0051846ed91eb3e30b4517e1904aac040013ff1d742019b3f9369ba5658ba40901dbbc121186fc4bf0e75a814321cc3e3182fbb2feb81c6d9cb7 - languageName: node - linkType: hard - "css-has-pseudo@npm:^3.0.3": version: 3.0.4 resolution: "css-has-pseudo@npm:3.0.4" @@ -16281,17 +16134,6 @@ __metadata: languageName: node linkType: hard -"css-to-react-native@npm:^2.2.2": - version: 2.3.2 - resolution: "css-to-react-native@npm:2.3.2" - dependencies: - camelize: ^1.0.0 - css-color-keywords: ^1.0.0 - postcss-value-parser: ^3.3.0 - checksum: 37b369a52431fc356fcdfda4268ae201c8dce110e8698d8e890692cded67c7cde4872d22124e3bb026e4a2cb68e8dde4ec6e6df229206539c1d8fef70e52444e - languageName: node - linkType: hard - "css-tree@npm:^1.1.2, css-tree@npm:^1.1.3": version: 1.1.3 resolution: "css-tree@npm:1.1.3" @@ -16806,7 +16648,7 @@ __metadata: languageName: node linkType: hard -"deep-equal@npm:^1.0.0, deep-equal@npm:^1.0.1, deep-equal@npm:^1.1.1": +"deep-equal@npm:^1.0.0, deep-equal@npm:^1.0.1": version: 1.1.1 resolution: "deep-equal@npm:1.1.1" dependencies: @@ -16999,13 +16841,6 @@ __metadata: languageName: node linkType: hard -"delegate@npm:^3.1.2": - version: 3.2.0 - resolution: "delegate@npm:3.2.0" - checksum: f8512633514f375b8675018088fdd679d92b84246ad6ba1de9fbc4ea7630f7fb0ff8772ac86c37a68233885f58c6b8b70676d7366f38cb2dcbf7baa474e2362d - languageName: node - linkType: hard - "delegates@npm:^1.0.0": version: 1.0.0 resolution: "delegates@npm:1.0.0" @@ -19350,8 +19185,8 @@ __metadata: linkType: hard "eslint-plugin-react@npm:^7.19.0, eslint-plugin-react@npm:^7.22.0, eslint-plugin-react@npm:^7.27.0": - version: 7.31.9 - resolution: "eslint-plugin-react@npm:7.31.9" + version: 7.31.10 + resolution: "eslint-plugin-react@npm:7.31.10" dependencies: array-includes: ^3.1.5 array.prototype.flatmap: ^1.3.0 @@ -19369,7 +19204,7 @@ __metadata: string.prototype.matchall: ^4.0.7 peerDependencies: eslint: ^3 || ^4 || ^5 || ^6 || ^7 || ^8 - checksum: 40a4224467441aca3fda2cbd3d0f47250f314e944a575ad006e2f976f927096ad00367cfd54d1449019f863cbaeb78b5a4986e46002bde6af1ad2ed5b844b33f + checksum: 0a3ed9547e337f7eac4364f45229a8094ea4ac5073f1c4b8662f84c75284703bfebdf5dfe2cb55bcaeedec43f0445ed76ca650388f642d5ad1c9fe530bf3f159 languageName: node linkType: hard @@ -19757,7 +19592,7 @@ __metadata: languageName: node linkType: hard -"eventemitter3@npm:^4.0.0, eventemitter3@npm:^4.0.7": +"eventemitter3@npm:^4.0.0": version: 4.0.7 resolution: "eventemitter3@npm:4.0.7" checksum: 5f6d97cbcbac47be798e6355e3a7639a84ee1f7d9b199a07017f1d2f1e2fe236004d14fa5dfaeba661f94ea57805385e326236a6debbc7145c8877fbc0297c6b @@ -19866,13 +19701,6 @@ __metadata: languageName: node linkType: hard -"exenv@npm:^1.2.0": - version: 1.2.2 - resolution: "exenv@npm:1.2.2" - checksum: 4e96b355a6b9b9547237288ca779dd673b2e698458b409e88b50df09feb7c85ef94c07354b6b87bc3ed0193a94009a6f7a3c71956da12f45911c0d0f5aa3caa0 - languageName: node - linkType: hard - "exit@npm:^0.1.2": version: 0.1.2 resolution: "exit@npm:0.1.2" @@ -20990,15 +20818,6 @@ __metadata: languageName: node linkType: hard -"format-json@npm:^1.0.3": - version: 1.0.3 - resolution: "format-json@npm:1.0.3" - bin: - format-json: ./format-json.js - checksum: e42caea6fc53c49b70aaf362e5815738920941e1d521558891dbbb555ee0531a801c39382e792bf1e2c6fa58b51977761eb630f69299e80ddf52c9026a48dba7 - languageName: node - linkType: hard - "format@npm:^0.2.0": version: 0.2.2 resolution: "format@npm:0.2.2" @@ -22036,15 +21855,6 @@ __metadata: languageName: node linkType: hard -"good-listener@npm:^1.2.2": - version: 1.2.2 - resolution: "good-listener@npm:1.2.2" - dependencies: - delegate: ^3.1.2 - checksum: 5c532f2e223f1f3a12504077d6d960986979a7923fb428a26bde012b88ac57ffba1b28507f95bd16a73c1ae805fdb38d26d9442d538dd559fad159a7f58243fe - languageName: node - linkType: hard - "got@npm:^8.3.1": version: 8.3.2 resolution: "got@npm:8.3.2" @@ -22152,13 +21962,6 @@ __metadata: languageName: node linkType: hard -"gud@npm:^1.0.0": - version: 1.0.0 - resolution: "gud@npm:1.0.0" - checksum: a4db6edc18e2c4e3a22dc9e639e40a4e5650d53dae9cf384a96d5380dfa17ddda376cf6b7797a5c30d140d2532e5a69d167bdb70c2c151dd673253bac6b027f3 - languageName: node - linkType: hard - "handle-thing@npm:^2.0.0": version: 2.0.1 resolution: "handle-thing@npm:2.0.1" @@ -23397,7 +23200,7 @@ __metadata: languageName: node linkType: hard -"import-fresh@npm:^3.0.0, import-fresh@npm:^3.1.0, import-fresh@npm:^3.2.1": +"import-fresh@npm:^3.0.0, import-fresh@npm:^3.2.1": version: 3.3.0 resolution: "import-fresh@npm:3.3.0" dependencies: @@ -24438,7 +24241,7 @@ __metadata: languageName: node linkType: hard -"is-what@npm:^3.14.1, is-what@npm:^3.3.1": +"is-what@npm:^3.14.1": version: 3.14.1 resolution: "is-what@npm:3.14.1" checksum: 4b770b85454c877b6929a84fd47c318e1f8c2ff70fd72fd625bc3fde8e0c18a6e57345b6e7aa1ee9fbd1c608d27cfe885df473036c5c2e40cd2187250804a2c7 @@ -27641,11 +27444,11 @@ __metadata: linkType: hard "lit-html@npm:^2.2.0, lit-html@npm:^2.3.0": - version: 2.3.1 - resolution: "lit-html@npm:2.3.1" + version: 2.4.0 + resolution: "lit-html@npm:2.4.0" dependencies: "@types/trusted-types": ^2.0.2 - checksum: 6f758828c8199923529d76c5af4a6d45b558bb25e317026fb243a18bc68205576c4ed94afda154cb556950b81909027229c2d4bf421bc97552587f584bbcb13a + checksum: ef7293f41ff6cbfed4e477a75720d866abe7cd88073bd6f623f5a58f42883475ff3c423bbd6bf6ead044c8ab71ef04606abfca2d4e0ffc885d8560bbab89ec68 languageName: node linkType: hard @@ -28244,7 +28047,7 @@ __metadata: languageName: node linkType: hard -"lodash@npm:4.17.21, lodash@npm:4.x, lodash@npm:^4.17.11, lodash@npm:^4.17.12, lodash@npm:^4.17.13, lodash@npm:^4.17.14, lodash@npm:^4.17.15, lodash@npm:^4.17.19, lodash@npm:^4.17.20, lodash@npm:^4.17.21, lodash@npm:^4.17.4, lodash@npm:^4.17.5, lodash@npm:^4.2.1, lodash@npm:^4.5.1, lodash@npm:^4.7.0": +"lodash@npm:4.17.21, lodash@npm:4.x, lodash@npm:^4.17.12, lodash@npm:^4.17.13, lodash@npm:^4.17.14, lodash@npm:^4.17.15, lodash@npm:^4.17.19, lodash@npm:^4.17.20, lodash@npm:^4.17.21, lodash@npm:^4.17.4, lodash@npm:^4.17.5, lodash@npm:^4.2.1, lodash@npm:^4.5.1, lodash@npm:^4.7.0": version: 4.17.21 resolution: "lodash@npm:4.17.21" checksum: d8cbea072bb08655bb4c989da418994b073a608dffa608b09ac04b43a791b12aeae7cd7ad919aa4c925f33b48490b5cfe6c1f71d827956071dae2e7bb3a6b74c @@ -29128,13 +28931,6 @@ __metadata: languageName: node linkType: hard -"memoize-one@npm:^5.0.0": - version: 5.2.1 - resolution: "memoize-one@npm:5.2.1" - checksum: fd22dbe9a978a2b4f30d6a491fc02fb90792432ad0dab840dc96c1734d2bd7c9cdeb6a26130ec60507eb43230559523615873168bcbe8fafab221c30b11d54c1 - languageName: node - linkType: hard - "memoizerific@npm:^1.11.3": version: 1.11.3 resolution: "memoizerific@npm:1.11.3" @@ -29207,15 +29003,6 @@ __metadata: languageName: node linkType: hard -"merge-anything@npm:^2.2.4": - version: 2.4.4 - resolution: "merge-anything@npm:2.4.4" - dependencies: - is-what: ^3.3.1 - checksum: 62864df52af3b5cbeddd3cf6381ed0e2f23b7db8796c460e8432f7c67fbe9528bbb26427b7feef55da25b87a6a8904b3e261a76f8c8171fa945cc8da0bde1ca8 - languageName: node - linkType: hard - "merge-descriptors@npm:1.0.1": version: 1.0.1 resolution: "merge-descriptors@npm:1.0.1" @@ -29902,9 +29689,9 @@ __metadata: linkType: hard "minimist@npm:^1.1.0, minimist@npm:^1.1.1, minimist@npm:^1.1.3, minimist@npm:^1.2.0, minimist@npm:^1.2.3, minimist@npm:^1.2.5, minimist@npm:^1.2.6": - version: 1.2.6 - resolution: "minimist@npm:1.2.6" - checksum: d0b566204044481c4401abbd24cc75814e753b37268e7fe7ccc78612bf3e37bf1e45a6c43fb0b119445ea1c413c000bde013f320b7211974f2f49bcbec1d0dbf + version: 1.2.7 + resolution: "minimist@npm:1.2.7" + checksum: 8808da67ca50ee19ab2d69051d77ee78572e67297fd8a1635ecc757a15106ccdfb5b8c4d11d84750120142f1684e5329a141295728c755e5d149eedd73cc6572 languageName: node linkType: hard @@ -30371,11 +30158,11 @@ __metadata: linkType: hard "nan@npm:^2.12.1, nan@npm:^2.14.0": - version: 2.16.0 - resolution: "nan@npm:2.16.0" + version: 2.17.0 + resolution: "nan@npm:2.17.0" dependencies: node-gyp: latest - checksum: 95204e4ed2970c0411735d866b0a71f30625e9ce598d2f7c2dfc2145dcd4e8e48dda26fda2587657f91e96973044353d300a9a6d259079b342fa4b30548aa8fa + checksum: 4a231a62dba025f4c4fa814c1e6ffeb450c5cd0852b780f19fe4ea22b86ba0f1f394406dfd628c67fb7f0987e982fa230da1fbd3632258f927b8defd7046c1ad languageName: node linkType: hard @@ -30799,8 +30586,8 @@ __metadata: linkType: hard "node-gyp@npm:latest": - version: 9.2.0 - resolution: "node-gyp@npm:9.2.0" + version: 9.3.0 + resolution: "node-gyp@npm:9.3.0" dependencies: env-paths: ^2.2.0 glob: ^7.1.4 @@ -30814,7 +30601,7 @@ __metadata: which: ^2.0.2 bin: node-gyp: bin/node-gyp.js - checksum: 281dc8cbb7d4ecdc179b903c1b25fe4d1d5b70984744564a13892a93f24323f29aa38649a3ac569614ecf55c2f0804dff489347564f2945be29f7ddd4bb85a9c + checksum: 3b326bc3accca849c62503820c13d9362d142dbe4189a5a3a2f2b6de4e872303f2d6cc2dd59e044bf4ca967bfd3eeb3d0c5d8d3b77e28e4e4f8d909697ff5a7e languageName: node linkType: hard @@ -31474,64 +31261,6 @@ __metadata: languageName: node linkType: hard -"official-storybook@workspace:examples/official-storybook": - version: 0.0.0-use.local - resolution: "official-storybook@workspace:examples/official-storybook" - dependencies: - "@emotion/jest": ^11.10.0 - "@pmmmwh/react-refresh-webpack-plugin": ^0.5.5 - "@storybook/addon-a11y": 7.0.0-alpha.35 - "@storybook/addon-actions": 7.0.0-alpha.35 - "@storybook/addon-backgrounds": 7.0.0-alpha.35 - "@storybook/addon-controls": 7.0.0-alpha.35 - "@storybook/addon-docs": 7.0.0-alpha.35 - "@storybook/addon-highlight": 7.0.0-alpha.35 - "@storybook/addon-interactions": 7.0.0-alpha.35 - "@storybook/addon-jest": 7.0.0-alpha.35 - "@storybook/addon-links": 7.0.0-alpha.35 - "@storybook/addon-storyshots": 7.0.0-alpha.35 - "@storybook/addon-storyshots-puppeteer": 7.0.0-alpha.35 - "@storybook/addon-storysource": 7.0.0-alpha.35 - "@storybook/addon-toolbars": 7.0.0-alpha.35 - "@storybook/addon-viewport": 7.0.0-alpha.35 - "@storybook/addons": 7.0.0-alpha.35 - "@storybook/cli": 7.0.0-alpha.35 - "@storybook/components": 7.0.0-alpha.35 - "@storybook/core-events": 7.0.0-alpha.35 - "@storybook/design-system": ^5.4.7 - "@storybook/jest": ^0.0.10 - "@storybook/node-logger": 7.0.0-alpha.35 - "@storybook/react": 7.0.0-alpha.35 - "@storybook/react-webpack5": 7.0.0-alpha.35 - "@storybook/router": 7.0.0-alpha.35 - "@storybook/source-loader": 7.0.0-alpha.35 - "@storybook/testing-library": 0.0.14-next.0 - "@storybook/theming": 7.0.0-alpha.35 - "@testing-library/dom": ^7.31.2 - "@testing-library/user-event": ^13.1.9 - chromatic: ^6.0.2 - cors: ^2.8.5 - cross-env: ^7.0.3 - enzyme-to-json: ^3.6.1 - eventemitter3: ^4.0.7 - express: ^4.17.1 - format-json: ^1.0.3 - formik: ^2.2.9 - global: ^4.4.0 - lodash: ^4.17.21 - paths.macro: ^3.0.1 - prop-types: ^15.7.2 - react: 16.14.0 - react-dom: 16.14.0 - storybook: 7.0.0-alpha.35 - terser-webpack-plugin: ^5.3.1 - uuid-browser: ^3.1.0 - webpack: 5 - peerDependencies: - puppeteer: ^2.0.0 || ^3.0.0 - languageName: unknown - linkType: soft - "on-finished@npm:2.4.1": version: 2.4.1 resolution: "on-finished@npm:2.4.1" @@ -32444,17 +32173,6 @@ __metadata: languageName: node linkType: hard -"paths.macro@npm:^3.0.1": - version: 3.0.1 - resolution: "paths.macro@npm:3.0.1" - dependencies: - babel-plugin-macros: ^2.8.0 - find-root: ^1.1.0 - upath: ^1.2.0 - checksum: 4d7579c4c4eb3c36555160e68ce2d1493667ac71316b7fca11a8f5ddb1f4886f1540120696e15cee053e45825198ba68053ba0c9bb212d64162c834dc363c3eb - languageName: node - linkType: hard - "pause-stream@npm:0.0.11, pause-stream@npm:^0.0.11": version: 0.0.11 resolution: "pause-stream@npm:0.0.11" @@ -32729,15 +32447,6 @@ __metadata: languageName: node linkType: hard -"polished@npm:^3.6.4": - version: 3.7.2 - resolution: "polished@npm:3.7.2" - dependencies: - "@babel/runtime": ^7.12.5 - checksum: c36439946b5bfbac16c06dd7b00a89f45e07410427344e909c540ce3ddeb9b44d2ae9cc035a9d77f4551e07b9803419ae77767aec85958a0978158a95c0115d8 - languageName: node - linkType: hard - "polished@npm:^4.2.2": version: 4.2.2 resolution: "polished@npm:4.2.2" @@ -32747,13 +32456,6 @@ __metadata: languageName: node linkType: hard -"popper.js@npm:^1.14.4": - version: 1.16.1 - resolution: "popper.js@npm:1.16.1" - checksum: 1c1a826f757edb5b8c2049dfd7a9febf6ae1e9d0e51342fc715b49a0c1020fced250d26484619883651e097c5764bbcacd2f31496e3646027f079dd83e072681 - languageName: node - linkType: hard - "portfinder@npm:^1.0.25, portfinder@npm:^1.0.28": version: 1.0.32 resolution: "portfinder@npm:1.0.32" @@ -33247,13 +32949,6 @@ __metadata: languageName: node linkType: hard -"postcss-value-parser@npm:^3.3.0": - version: 3.3.1 - resolution: "postcss-value-parser@npm:3.3.1" - checksum: 23eed98d8eeadb1f9ef1db4a2757da0f1d8e7c1dac2a38d6b35d971aab9eb3c6d8a967d0e9f435558834ffcd966afbbe875a56bcc5bcdd09e663008c106b3e47 - languageName: node - linkType: hard - "postcss-value-parser@npm:^4.0.0, postcss-value-parser@npm:^4.1.0, postcss-value-parser@npm:^4.2.0": version: 4.2.0 resolution: "postcss-value-parser@npm:4.2.0" @@ -33595,18 +33290,6 @@ __metadata: languageName: node linkType: hard -"prismjs@npm:1.23.0": - version: 1.23.0 - resolution: "prismjs@npm:1.23.0" - dependencies: - clipboard: ^2.0.0 - dependenciesMeta: - clipboard: - optional: true - checksum: c40d4d2b9bbd93df03eee11c4a92153543d29e92e0cfd078d13aed2853ad4c2b3f6e529f24ae75972925db60f194d80962841a43975dae8f2ec78995f101b0b9 - languageName: node - linkType: hard - "prismjs@npm:^1.27.0": version: 1.29.0 resolution: "prismjs@npm:1.29.0" @@ -33747,7 +33430,7 @@ __metadata: languageName: node linkType: hard -"prop-types@npm:^15.5.10, prop-types@npm:^15.5.4, prop-types@npm:^15.6.1, prop-types@npm:^15.6.2, prop-types@npm:^15.7.2, prop-types@npm:^15.8.1": +"prop-types@npm:^15.6.2, prop-types@npm:^15.7.2, prop-types@npm:^15.8.1": version: 15.8.1 resolution: "prop-types@npm:15.8.1" dependencies: @@ -34523,15 +34206,6 @@ __metadata: languageName: node linkType: hard -"react-github-button@npm:^0.1.11": - version: 0.1.11 - resolution: "react-github-button@npm:0.1.11" - dependencies: - prop-types: ^15.5.10 - checksum: e00fa4f3b2dee74f45fff0c9d68d7d75eefa495d27a56ef2e2391f9600623d16b8a9f99c1d35a7b4f620dfb95dd8ed0b1a76fbbfece4be0843cd507c17a37dfa - languageName: node - linkType: hard - "react-helmet-async@npm:^1.0.7": version: 1.3.0 resolution: "react-helmet-async@npm:1.3.0" @@ -34574,7 +34248,7 @@ __metadata: languageName: node linkType: hard -"react-is@npm:^16.12.0, react-is@npm:^16.13.1, react-is@npm:^16.6.0, react-is@npm:^16.7.0, react-is@npm:^16.8.6": +"react-is@npm:^16.12.0, react-is@npm:^16.13.1, react-is@npm:^16.7.0, react-is@npm:^16.8.6": version: 16.13.1 resolution: "react-is@npm:16.13.1" checksum: 33977da7a5f1a287936a0c85639fec6ca74f4f15ef1e59a6bc20338fc73dc69555381e211f7a3529b8150a1f71e4225525b41b60b52965bda53ce7d47377ada1 @@ -34595,13 +34269,6 @@ __metadata: languageName: node linkType: hard -"react-lifecycles-compat@npm:^3.0.0": - version: 3.0.4 - resolution: "react-lifecycles-compat@npm:3.0.4" - checksum: 1d0df3c85af79df720524780f00c064d53a9dd1899d785eddb7264b378026979acbddb58a4b7e06e7d0d12aa1494fd5754562ee55d32907b15601068dae82c27 - languageName: node - linkType: hard - "react-merge-refs@npm:^1.0.0": version: 1.1.0 resolution: "react-merge-refs@npm:1.1.0" @@ -34609,34 +34276,6 @@ __metadata: languageName: node linkType: hard -"react-modal@npm:^3.11.2": - version: 3.15.1 - resolution: "react-modal@npm:3.15.1" - dependencies: - exenv: ^1.2.0 - prop-types: ^15.7.2 - react-lifecycles-compat: ^3.0.0 - warning: ^4.0.3 - peerDependencies: - react: ^0.14.0 || ^15.0.0 || ^16 || ^17 || ^18 - react-dom: ^0.14.0 || ^15.0.0 || ^16 || ^17 || ^18 - checksum: 90711c29557b9b5b13728ef65d586929c9ca2f3e3b6875d688a5ac2ed4bd3227e1ec136778b9c8236989730f942915d97c7b47f26ef1c101345bfd41197781aa - languageName: node - linkType: hard - -"react-popper-tooltip@npm:^2.11.1": - version: 2.11.1 - resolution: "react-popper-tooltip@npm:2.11.1" - dependencies: - "@babel/runtime": ^7.9.2 - react-popper: ^1.3.7 - peerDependencies: - react: ^16.6.0 - react-dom: ^16.6.0 - checksum: f81278f1ea87899ffa57fed85c2531fa583ebca424ae5522e3a1b05c5635c014b3467391e77fb9c48bbc8e7b9f1050fa9302e8ee6134a9333858b5a6e0ae1b49 - languageName: node - linkType: hard - "react-popper-tooltip@npm:^3.1.1": version: 3.1.1 resolution: "react-popper-tooltip@npm:3.1.1" @@ -34651,23 +34290,6 @@ __metadata: languageName: node linkType: hard -"react-popper@npm:^1.3.7": - version: 1.3.11 - resolution: "react-popper@npm:1.3.11" - dependencies: - "@babel/runtime": ^7.1.2 - "@hypnosphi/create-react-context": ^0.3.1 - deep-equal: ^1.1.1 - popper.js: ^1.14.4 - prop-types: ^15.6.1 - typed-styles: ^0.0.7 - warning: ^4.0.2 - peerDependencies: - react: 0.14.x || ^15.0.0 || ^16.0.0 || ^17.0.0 - checksum: d5dd1d0d4b5a3407134681b42a079fce525c94bce892ad177515d54a8cf64203eecbc30231476367e916aaff91221f5b6abd5afc207a86c698f35b7254178488 - languageName: node - linkType: hard - "react-popper@npm:^2.2.4": version: 2.3.0 resolution: "react-popper@npm:2.3.0" @@ -36810,13 +36432,6 @@ __metadata: languageName: node linkType: hard -"select@npm:^1.1.2": - version: 1.1.2 - resolution: "select@npm:1.1.2" - checksum: 5dbd871c03a52aa70ce29ab46e9115d26cb34404717e7e705e678b3b4d535bacfa0a4c4c2d32262acec7b6fdfb6827e8980ea4ef969a8681f8a0b752331a0a02 - languageName: node - linkType: hard - "selenium-webdriver@npm:3.6.0, selenium-webdriver@npm:^3.0.1": version: 3.6.0 resolution: "selenium-webdriver@npm:3.6.0" @@ -38551,30 +38166,6 @@ __metadata: languageName: node linkType: hard -"styled-components@npm:^4.4.1": - version: 4.4.1 - resolution: "styled-components@npm:4.4.1" - dependencies: - "@babel/helper-module-imports": ^7.0.0 - "@babel/traverse": ^7.0.0 - "@emotion/is-prop-valid": ^0.8.1 - "@emotion/unitless": ^0.7.0 - babel-plugin-styled-components: ">= 1" - css-to-react-native: ^2.2.2 - memoize-one: ^5.0.0 - merge-anything: ^2.2.4 - prop-types: ^15.5.4 - react-is: ^16.6.0 - stylis: ^3.5.0 - stylis-rule-sheet: ^0.0.10 - supports-color: ^5.5.0 - peerDependencies: - react: ">= 16.3.0" - react-dom: ">= 16.3.0" - checksum: a95eeb24bf953ec746ca53389c9763ef8242a25cfda1d3a4250a2bd16b614002209f57974c1a4645aedcb13b1d91186c873b23640f3fca5b4afb9eec96a8c71c - languageName: node - linkType: hard - "styled-jsx@npm:5.0.7": version: 5.0.7 resolution: "styled-jsx@npm:5.0.7" @@ -38596,15 +38187,6 @@ __metadata: languageName: node linkType: hard -"stylis-rule-sheet@npm:^0.0.10": - version: 0.0.10 - resolution: "stylis-rule-sheet@npm:0.0.10" - peerDependencies: - stylis: ^3.5.0 - checksum: 362d1a6473569f702ed814a17ecb0a71f84cb93c45aaf82d6054dd1167d60cc4d2d0bc73dc15eb069cd11ea2d91fefb572f910db64c1b5f07f81296a9c6d0f24 - languageName: node - linkType: hard - "stylis@npm:4.0.13": version: 4.0.13 resolution: "stylis@npm:4.0.13" @@ -38612,13 +38194,6 @@ __metadata: languageName: node linkType: hard -"stylis@npm:^3.5.0": - version: 3.5.4 - resolution: "stylis@npm:3.5.4" - checksum: 5da2f4527d6f3b4877bd575dca068698ddc7882d0f4c3f69178f19328726a2b885e03d759ef82bb06e9bd1a5d47f1f2ce17cc5acbeee2435d42940a261ee11fd - languageName: node - linkType: hard - "stylus-loader@npm:6.2.0": version: 6.2.0 resolution: "stylus-loader@npm:6.2.0" @@ -38880,9 +38455,9 @@ __metadata: linkType: hard "svelte@npm:^3.0.0, svelte@npm:^3.31.2, svelte@npm:^3.48.0": - version: 3.50.1 - resolution: "svelte@npm:3.50.1" - checksum: 16d5c5b6aaf36f520f7ba77aa02361a8e7cd3ec79bedca8320dbf92a6701df56d7793a924a04a3d24820b66139e5a98330121ebce86109f0579946c0d9fe7b9a + version: 3.51.0 + resolution: "svelte@npm:3.51.0" + checksum: 303b14941e684f7cbc82593d7cdc0f988c6909166cfa600d7a2b57e94c49412f4629d17ce91fd6a33edabae81379517cc357d713562c8b68a19c690df0bb8a0c languageName: node linkType: hard @@ -39423,13 +38998,6 @@ __metadata: languageName: node linkType: hard -"tiny-emitter@npm:^2.0.0": - version: 2.1.0 - resolution: "tiny-emitter@npm:2.1.0" - checksum: 459c0bd6e636e80909898220eb390e1cba2b15c430b7b06cec6ac29d87acd29ef618b9b32532283af749f5d37af3534d0e3bde29fdf6bcefbf122784333c953d - languageName: node - linkType: hard - "tiny-inflate@npm:^1.0.0, tiny-inflate@npm:^1.0.2": version: 1.0.3 resolution: "tiny-inflate@npm:1.0.3" @@ -40249,13 +39817,6 @@ __metadata: languageName: node linkType: hard -"typed-styles@npm:^0.0.7": - version: 0.0.7 - resolution: "typed-styles@npm:0.0.7" - checksum: ec159f0e538364750cf9b8f19136375df64ad364fda355e6f7a7216ebffc67f18b436722c5c6853c89f70e6507eb69e5061ceb9334fa1f54902c0f6be1b985fe - languageName: node - linkType: hard - "typedarray-to-buffer@npm:^3.1.5, typedarray-to-buffer@npm:~3.1.5": version: 3.1.5 resolution: "typedarray-to-buffer@npm:3.1.5" @@ -41123,7 +40684,7 @@ __metadata: languageName: node linkType: hard -"uuid@npm:^3.0.1, uuid@npm:^3.3.2, uuid@npm:^3.3.3": +"uuid@npm:^3.0.1, uuid@npm:^3.3.2": version: 3.4.0 resolution: "uuid@npm:3.4.0" bin: @@ -41395,8 +40956,8 @@ __metadata: linkType: hard "vite@npm:^3.1.0, vite@npm:^3.1.3": - version: 3.1.6 - resolution: "vite@npm:3.1.6" + version: 3.1.7 + resolution: "vite@npm:3.1.7" dependencies: esbuild: ^0.15.9 fsevents: ~2.3.2 @@ -41422,7 +40983,7 @@ __metadata: optional: true bin: vite: bin/vite.js - checksum: 9e572716fda647a9dd8ec6618b51d9bae20453fa7cb136bf6db7d41c1879ae7234a5cf14404b05ccac8a84291cfe412743a4b0d6c3dd68281ac1e32682d582d2 + checksum: c2156ade7e4aa1ec17fe9df1011ea6a45dad39a3ee159ecde4036f3ea643bb5226fd5d227213acfe63c7dd1ebcbae119bccf295934559a09ffcf380a537ae140 languageName: node linkType: hard @@ -42800,7 +42361,7 @@ __metadata: languageName: node linkType: hard -"yaml@npm:^1.10.0, yaml@npm:^1.10.2, yaml@npm:^1.7.2": +"yaml@npm:^1.10.0, yaml@npm:^1.10.2": version: 1.10.2 resolution: "yaml@npm:1.10.2" checksum: 5c28b9eb7adc46544f28d9a8d20c5b3cb1215a886609a2fd41f51628d8aaa5878ccd628b755dbcd29f6bb4921bd04ffbc6dcc370689bb96e594e2f9813d2605f diff --git a/docs/contribute/how-to-contribute.md b/docs/contribute/how-to-contribute.md index 198f7f978d0a..a8b56d5c85cc 100644 --- a/docs/contribute/how-to-contribute.md +++ b/docs/contribute/how-to-contribute.md @@ -14,14 +14,9 @@ In the interest of fostering an open and welcoming environment, we as contributo - [**Docs**](./documentation-updates.md): Typos, clarifications - [**Integrations**](./../api/new-frameworks.md): Integrate Storybook with your favorite library - [**Addons**](./../addons/introduction.md): Build an addon and share it with the community -- [**Examples**](https://github.com/storybookjs/storybook/tree/next/code/examples/official-storybook): Add an example/test for a feature - +- TODO ## Not sure how to get started? - [Chat in Discord #contributing](https://discord.gg/storybook) - [Browse "good first issues" to fix](https://github.com/storybookjs/storybook/issues?q=is%3Aissue+is%3Aopen+label%3A%22good+first+issue%22) - [Submit a bug report or feature request](https://github.com/storybookjs/storybook/issues) - -## Additional resources - -- [**Official Storybook**](https://next--storybookjs.netlify.app/official-storybook/): The Storybook we use to build Storybook diff --git a/scripts/build-storybooks.js b/scripts/build-storybooks.js index afd982da97b9..5af2cd9a6ead 100755 --- a/scripts/build-storybooks.js +++ b/scripts/build-storybooks.js @@ -12,7 +12,7 @@ import { filterDataForCurrentCircleCINode } from './utils/concurrency'; program .option( '--skip ', - 'Skip an example, accepts multiple values like "--skip vue-kitchen-sink official-storybook"', + 'Skip an example, accepts multiple values like "--skip vue-kitchen-sink"', (value, previous) => previous.concat([value]), [] ) diff --git a/scripts/smoketest-storybooks.js b/scripts/smoketest-storybooks.js index 7d0a39aa4e9b..2c1b9dd8fb4a 100755 --- a/scripts/smoketest-storybooks.js +++ b/scripts/smoketest-storybooks.js @@ -12,7 +12,7 @@ import { filterDataForCurrentCircleCINode } from './utils/concurrency'; program .option( '--skip ', - 'Skip an example, accepts multiple values like "--skip vue-kitchen-sink official-storybook"', + 'Skip an example, accepts multiple values like "--skip vue-kitchen-sink"', (value, previous) => previous.concat([value]), [] )