From b83cda6c37cd5bdd318b5cc44eff3f8bba224087 Mon Sep 17 00:00:00 2001 From: Jeppe Reinhold Date: Mon, 17 Oct 2022 10:09:41 +0200 Subject: [PATCH 01/21] move code/lib/components to code/ui/components --- code/.eslintrc.js | 2 +- .../links/src/react/components/RoutedLink.tsx | 2 +- .../framework-preset-angular-cli.test.ts | 2 +- .../core-server/src/__for-testing__/main.ts | 2 +- code/ui/.storybook/main.ts | 2 +- code/{lib => ui}/components/README.md | 0 code/{lib => ui}/components/package.json | 4 +- .../components/scripts/writeCssScript.js | 0 .../src/ActionBar/ActionBar.stories.tsx | 0 .../components/src/ActionBar/ActionBar.tsx | 0 .../components/src/Badge/Badge.stories.tsx | 0 .../components/src/Badge/Badge.tsx | 0 .../components/src/Button/Button.stories.tsx | 0 .../components/src/Button/Button.tsx | 0 .../components/src/Colors/SideBySide.tsx | 0 .../src/Colors/colorpalette.stories.mdx | 0 .../components/src/Loader/Loader.stories.tsx | 0 .../components/src/Loader/Loader.tsx | 0 .../src/ScrollArea/GlobalScrollAreaStyles.tsx | 0 .../src/ScrollArea/OverlayScrollbars.tsx | 0 .../src/ScrollArea/ScrollArea.stories.tsx | 0 .../components/src/ScrollArea/ScrollArea.tsx | 0 .../components/src/Zoom/Zoom.stories.tsx | 0 code/{lib => ui}/components/src/Zoom/Zoom.tsx | 0 .../components/src/Zoom/ZoomElement.tsx | 0 .../components/src/Zoom/ZoomIFrame.tsx | 0 .../src/Zoom/browserSupportsCssZoom.ts | 0 .../src/addon-panel/addon-panel.tsx | 0 code/{lib => ui}/components/src/bar/bar.tsx | 0 .../components/src/bar/button.stories.tsx | 0 .../{lib => ui}/components/src/bar/button.tsx | 0 .../components/src/bar/separator.tsx | 0 .../src/brand/StorybookIcon.stories.tsx | 0 .../components/src/brand/StorybookIcon.tsx | 0 .../src/brand/StorybookLogo.stories.tsx | 0 .../components/src/brand/StorybookLogo.tsx | 0 .../components/src/form/field/field.tsx | 0 .../components/src/form/form.stories.tsx | 0 .../{lib => ui}/components/src/form/index.tsx | 0 .../components/src/form/input/input.tsx | 0 .../components/src/icon/icon.stories.tsx | 0 code/{lib => ui}/components/src/icon/icon.tsx | 0 .../{lib => ui}/components/src/icon/icons.tsx | 0 code/{lib => ui}/components/src/icon/svg.tsx | 0 code/{lib => ui}/components/src/index.ts | 0 .../src/placeholder/placeholder.stories.tsx | 0 .../src/placeholder/placeholder.tsx | 0 .../components/src/shared/animation.ts | 0 .../components/src/spaced/Spaced.stories.tsx | 0 .../components/src/spaced/Spaced.tsx | 0 .../src/syntaxhighlighter/formatter.test.ts | 0 .../src/syntaxhighlighter/formatter.ts | 0 .../lazy-syntaxhighlighter.tsx | 0 .../syntaxhighlighter-types.ts | 0 .../syntaxhighlighter.stories.tsx | 0 .../syntaxhighlighter/syntaxhighlighter.tsx | 0 .../components/src/tabs/tabs.stories.tsx | 0 code/{lib => ui}/components/src/tabs/tabs.tsx | 0 .../src/tooltip/ListItem.stories.tsx | 0 .../components/src/tooltip/ListItem.tsx | 0 .../src/tooltip/Tooltip.stories.tsx | 0 .../components/src/tooltip/Tooltip.tsx | 0 .../src/tooltip/TooltipLinkList.stories.tsx | 0 .../src/tooltip/TooltipLinkList.tsx | 0 .../src/tooltip/TooltipMessage.stories.tsx | 0 .../components/src/tooltip/TooltipMessage.tsx | 0 .../src/tooltip/TooltipNote.stories.tsx | 0 .../components/src/tooltip/TooltipNote.tsx | 0 .../src/tooltip/WithTooltip.stories.tsx | 0 .../components/src/tooltip/WithTooltip.tsx | 0 .../src/tooltip/lazy-WithTooltip.tsx | 0 code/{lib => ui}/components/src/typings.d.ts | 0 .../src/typography/DocumentFormatting.tsx | 0 .../typography/DocumentFormattingSample.md | 0 .../typography/DocumentWrapper.stories.tsx | 0 .../src/typography/DocumentWrapper.tsx | 0 .../src/typography/ResetWrapper.tsx | 0 .../components/src/typography/components.tsx | 0 .../components/src/typography/elements/A.tsx | 0 .../src/typography/elements/Blockquote.tsx | 0 .../src/typography/elements/Code.tsx | 0 .../components/src/typography/elements/DL.tsx | 0 .../src/typography/elements/Div.tsx | 0 .../components/src/typography/elements/H1.tsx | 0 .../components/src/typography/elements/H2.tsx | 0 .../components/src/typography/elements/H3.tsx | 0 .../components/src/typography/elements/H4.tsx | 0 .../components/src/typography/elements/H5.tsx | 0 .../components/src/typography/elements/H6.tsx | 0 .../components/src/typography/elements/HR.tsx | 0 .../src/typography/elements/Img.tsx | 0 .../components/src/typography/elements/LI.tsx | 0 .../src/typography/elements/Link.tsx | 0 .../components/src/typography/elements/OL.tsx | 0 .../components/src/typography/elements/P.tsx | 0 .../src/typography/elements/Pre.tsx | 0 .../src/typography/elements/Span.tsx | 0 .../components/src/typography/elements/TT.tsx | 0 .../src/typography/elements/Table.tsx | 0 .../components/src/typography/elements/UL.tsx | 0 .../components/src/typography/lib/common.tsx | 0 .../src/typography/lib/isReactChildString.tsx | 0 .../src/typography/link/link.stories.tsx | 0 .../src/typography/link/link.test.tsx | 0 .../components/src/typography/link/link.tsx | 0 .../src/typography/typography.stories.mdx | 0 .../components/src/utils/getStoryHref.ts | 0 code/{lib => ui}/components/tsconfig.json | 0 .../manager/src/containers/panel.stories.tsx | 4 +- code/workspace.json | 2 +- code/yarn.lock | 4 +- docs/addons/addon-knowledge-base.md | 42 +++++++++---------- 112 files changed, 33 insertions(+), 33 deletions(-) rename code/{lib => ui}/components/README.md (100%) rename code/{lib => ui}/components/package.json (97%) rename code/{lib => ui}/components/scripts/writeCssScript.js (100%) rename code/{lib => ui}/components/src/ActionBar/ActionBar.stories.tsx (100%) rename code/{lib => ui}/components/src/ActionBar/ActionBar.tsx (100%) rename code/{lib => ui}/components/src/Badge/Badge.stories.tsx (100%) rename code/{lib => ui}/components/src/Badge/Badge.tsx (100%) rename code/{lib => ui}/components/src/Button/Button.stories.tsx (100%) rename code/{lib => ui}/components/src/Button/Button.tsx (100%) rename code/{lib => ui}/components/src/Colors/SideBySide.tsx (100%) rename code/{lib => ui}/components/src/Colors/colorpalette.stories.mdx (100%) rename code/{lib => ui}/components/src/Loader/Loader.stories.tsx (100%) rename code/{lib => ui}/components/src/Loader/Loader.tsx (100%) rename code/{lib => ui}/components/src/ScrollArea/GlobalScrollAreaStyles.tsx (100%) rename code/{lib => ui}/components/src/ScrollArea/OverlayScrollbars.tsx (100%) rename code/{lib => ui}/components/src/ScrollArea/ScrollArea.stories.tsx (100%) rename code/{lib => ui}/components/src/ScrollArea/ScrollArea.tsx (100%) rename code/{lib => ui}/components/src/Zoom/Zoom.stories.tsx (100%) rename code/{lib => ui}/components/src/Zoom/Zoom.tsx (100%) rename code/{lib => ui}/components/src/Zoom/ZoomElement.tsx (100%) rename code/{lib => ui}/components/src/Zoom/ZoomIFrame.tsx (100%) rename code/{lib => ui}/components/src/Zoom/browserSupportsCssZoom.ts (100%) rename code/{lib => ui}/components/src/addon-panel/addon-panel.tsx (100%) rename code/{lib => ui}/components/src/bar/bar.tsx (100%) rename code/{lib => ui}/components/src/bar/button.stories.tsx (100%) rename code/{lib => ui}/components/src/bar/button.tsx (100%) rename code/{lib => ui}/components/src/bar/separator.tsx (100%) rename code/{lib => ui}/components/src/brand/StorybookIcon.stories.tsx (100%) rename code/{lib => ui}/components/src/brand/StorybookIcon.tsx (100%) rename code/{lib => ui}/components/src/brand/StorybookLogo.stories.tsx (100%) rename code/{lib => ui}/components/src/brand/StorybookLogo.tsx (100%) rename code/{lib => ui}/components/src/form/field/field.tsx (100%) rename code/{lib => ui}/components/src/form/form.stories.tsx (100%) rename code/{lib => ui}/components/src/form/index.tsx (100%) rename code/{lib => ui}/components/src/form/input/input.tsx (100%) rename code/{lib => ui}/components/src/icon/icon.stories.tsx (100%) rename code/{lib => ui}/components/src/icon/icon.tsx (100%) rename code/{lib => ui}/components/src/icon/icons.tsx (100%) rename code/{lib => ui}/components/src/icon/svg.tsx (100%) rename code/{lib => ui}/components/src/index.ts (100%) rename code/{lib => ui}/components/src/placeholder/placeholder.stories.tsx (100%) rename code/{lib => ui}/components/src/placeholder/placeholder.tsx (100%) rename code/{lib => ui}/components/src/shared/animation.ts (100%) rename code/{lib => ui}/components/src/spaced/Spaced.stories.tsx (100%) rename code/{lib => ui}/components/src/spaced/Spaced.tsx (100%) rename code/{lib => ui}/components/src/syntaxhighlighter/formatter.test.ts (100%) rename code/{lib => ui}/components/src/syntaxhighlighter/formatter.ts (100%) rename code/{lib => ui}/components/src/syntaxhighlighter/lazy-syntaxhighlighter.tsx (100%) rename code/{lib => ui}/components/src/syntaxhighlighter/syntaxhighlighter-types.ts (100%) rename code/{lib => ui}/components/src/syntaxhighlighter/syntaxhighlighter.stories.tsx (100%) rename code/{lib => ui}/components/src/syntaxhighlighter/syntaxhighlighter.tsx (100%) rename code/{lib => ui}/components/src/tabs/tabs.stories.tsx (100%) rename code/{lib => ui}/components/src/tabs/tabs.tsx (100%) rename code/{lib => ui}/components/src/tooltip/ListItem.stories.tsx (100%) rename code/{lib => ui}/components/src/tooltip/ListItem.tsx (100%) rename code/{lib => ui}/components/src/tooltip/Tooltip.stories.tsx (100%) rename code/{lib => ui}/components/src/tooltip/Tooltip.tsx (100%) rename code/{lib => ui}/components/src/tooltip/TooltipLinkList.stories.tsx (100%) rename code/{lib => ui}/components/src/tooltip/TooltipLinkList.tsx (100%) rename code/{lib => ui}/components/src/tooltip/TooltipMessage.stories.tsx (100%) rename code/{lib => ui}/components/src/tooltip/TooltipMessage.tsx (100%) rename code/{lib => ui}/components/src/tooltip/TooltipNote.stories.tsx (100%) rename code/{lib => ui}/components/src/tooltip/TooltipNote.tsx (100%) rename code/{lib => ui}/components/src/tooltip/WithTooltip.stories.tsx (100%) rename code/{lib => ui}/components/src/tooltip/WithTooltip.tsx (100%) rename code/{lib => ui}/components/src/tooltip/lazy-WithTooltip.tsx (100%) rename code/{lib => ui}/components/src/typings.d.ts (100%) rename code/{lib => ui}/components/src/typography/DocumentFormatting.tsx (100%) rename code/{lib => ui}/components/src/typography/DocumentFormattingSample.md (100%) rename code/{lib => ui}/components/src/typography/DocumentWrapper.stories.tsx (100%) rename code/{lib => ui}/components/src/typography/DocumentWrapper.tsx (100%) rename code/{lib => ui}/components/src/typography/ResetWrapper.tsx (100%) rename code/{lib => ui}/components/src/typography/components.tsx (100%) rename code/{lib => ui}/components/src/typography/elements/A.tsx (100%) rename code/{lib => ui}/components/src/typography/elements/Blockquote.tsx (100%) rename code/{lib => ui}/components/src/typography/elements/Code.tsx (100%) rename code/{lib => ui}/components/src/typography/elements/DL.tsx (100%) rename code/{lib => ui}/components/src/typography/elements/Div.tsx (100%) rename code/{lib => ui}/components/src/typography/elements/H1.tsx (100%) rename code/{lib => ui}/components/src/typography/elements/H2.tsx (100%) rename code/{lib => ui}/components/src/typography/elements/H3.tsx (100%) rename code/{lib => ui}/components/src/typography/elements/H4.tsx (100%) rename code/{lib => ui}/components/src/typography/elements/H5.tsx (100%) rename code/{lib => ui}/components/src/typography/elements/H6.tsx (100%) rename code/{lib => ui}/components/src/typography/elements/HR.tsx (100%) rename code/{lib => ui}/components/src/typography/elements/Img.tsx (100%) rename code/{lib => ui}/components/src/typography/elements/LI.tsx (100%) rename code/{lib => ui}/components/src/typography/elements/Link.tsx (100%) rename code/{lib => ui}/components/src/typography/elements/OL.tsx (100%) rename code/{lib => ui}/components/src/typography/elements/P.tsx (100%) rename code/{lib => ui}/components/src/typography/elements/Pre.tsx (100%) rename code/{lib => ui}/components/src/typography/elements/Span.tsx (100%) rename code/{lib => ui}/components/src/typography/elements/TT.tsx (100%) rename code/{lib => ui}/components/src/typography/elements/Table.tsx (100%) rename code/{lib => ui}/components/src/typography/elements/UL.tsx (100%) rename code/{lib => ui}/components/src/typography/lib/common.tsx (100%) rename code/{lib => ui}/components/src/typography/lib/isReactChildString.tsx (100%) rename code/{lib => ui}/components/src/typography/link/link.stories.tsx (100%) rename code/{lib => ui}/components/src/typography/link/link.test.tsx (100%) rename code/{lib => ui}/components/src/typography/link/link.tsx (100%) rename code/{lib => ui}/components/src/typography/typography.stories.mdx (100%) rename code/{lib => ui}/components/src/utils/getStoryHref.ts (100%) rename code/{lib => ui}/components/tsconfig.json (100%) diff --git a/code/.eslintrc.js b/code/.eslintrc.js index a9a44f8459c1..8e7742dc111e 100644 --- a/code/.eslintrc.js +++ b/code/.eslintrc.js @@ -27,7 +27,7 @@ module.exports = { '**/lib/theming/**/*', '**/lib/router/**/*', '**/ui/manager/**/*', - '**/lib/components/**/*', + '**/ui/components/**/*', ], rules: { 'import/no-extraneous-dependencies': ['error', { bundledDependencies: false }], diff --git a/code/addons/links/src/react/components/RoutedLink.tsx b/code/addons/links/src/react/components/RoutedLink.tsx index a27a21221436..cfe6f4901cfa 100644 --- a/code/addons/links/src/react/components/RoutedLink.tsx +++ b/code/addons/links/src/react/components/RoutedLink.tsx @@ -1,6 +1,6 @@ import React from 'react'; -// NOTE: this is a copy of `lib/components/src/navigation/RoutedLink.tsx`. +// NOTE: this is a copy of `code/ui/components/src/navigation/RoutedLink.tsx`. // It's duplicated here because that copy has an explicit dependency on // React 16.3+, which breaks older versions of React running in the preview. // The proper DRY solution is to create a new package that doesn't depend diff --git a/code/frameworks/angular/src/server/framework-preset-angular-cli.test.ts b/code/frameworks/angular/src/server/framework-preset-angular-cli.test.ts index b61cbd025230..bda1707b6b51 100644 --- a/code/frameworks/angular/src/server/framework-preset-angular-cli.test.ts +++ b/code/frameworks/angular/src/server/framework-preset-angular-cli.test.ts @@ -819,7 +819,7 @@ const newWebpackConfiguration = ( '@storybook/api': '/Users/joe/storybook/lib/api', '@storybook/channels': '/Users/joe/storybook/lib/channels', '@storybook/channel-postmessage': '/Users/joe/storybook/lib/channel-postmessage', - '@storybook/components': '/Users/joe/storybook/lib/components', + '@storybook/components': '/Users/joe/storybook/ui/components', '@storybook/core-events': '/Users/joe/storybook/lib/core-events', '@storybook/router': '/Users/joe/storybook/lib/router', '@storybook/theming': '/Users/joe/storybook/lib/theming', diff --git a/code/lib/core-server/src/__for-testing__/main.ts b/code/lib/core-server/src/__for-testing__/main.ts index 7c5a2a9564ed..883637275c82 100644 --- a/code/lib/core-server/src/__for-testing__/main.ts +++ b/code/lib/core-server/src/__for-testing__/main.ts @@ -6,7 +6,7 @@ import type { StorybookConfig } from '@storybook/react-webpack5'; const config: StorybookConfig = { stories: [ '../../ui/manager/src/**/*.stories.@(ts|tsx|js|jsx|mdx)', - '../../lib/components/src/**/*.stories.@(ts|tsx|js|jsx|mdx)', + '../../ui/components/src/**/*.stories.@(ts|tsx|js|jsx|mdx)', './../../addons/docs/**/*.stories.@(ts|tsx|js|jsx|mdx)', './../../addons/interactions/**/*.stories.@(ts|tsx|js|jsx|mdx)', ], diff --git a/code/ui/.storybook/main.ts b/code/ui/.storybook/main.ts index 0cf89ad31f89..7ed5df74a44a 100644 --- a/code/ui/.storybook/main.ts +++ b/code/ui/.storybook/main.ts @@ -5,7 +5,7 @@ import type { StorybookConfig } from '../../frameworks/react-vite/dist'; const config: StorybookConfig = { stories: [ '../manager/src/**/*.stories.@(ts|tsx|js|jsx|mdx)', - // '../../lib/components/src/**/*.stories.@(js|jsx|ts|tsx|mdx)', + '../components/src/**/*.stories.@(js|jsx|ts|tsx|mdx)', // '../../../addons/interactions/**/*.stories.@(ts|tsx|js|jsx|mdx)', ], addons: [ diff --git a/code/lib/components/README.md b/code/ui/components/README.md similarity index 100% rename from code/lib/components/README.md rename to code/ui/components/README.md diff --git a/code/lib/components/package.json b/code/ui/components/package.json similarity index 97% rename from code/lib/components/package.json rename to code/ui/components/package.json index ea5bd76233ed..3d540fc3f4b0 100644 --- a/code/lib/components/package.json +++ b/code/ui/components/package.json @@ -5,14 +5,14 @@ "keywords": [ "storybook" ], - "homepage": "https://github.com/storybookjs/storybook/tree/main/lib/components", + "homepage": "https://github.com/storybookjs/storybook/tree/main/code/ui/components", "bugs": { "url": "https://github.com/storybookjs/storybook/issues" }, "repository": { "type": "git", "url": "https://github.com/storybookjs/storybook.git", - "directory": "lib/components" + "directory": "code/ui/components" }, "funding": { "type": "opencollective", diff --git a/code/lib/components/scripts/writeCssScript.js b/code/ui/components/scripts/writeCssScript.js similarity index 100% rename from code/lib/components/scripts/writeCssScript.js rename to code/ui/components/scripts/writeCssScript.js diff --git a/code/lib/components/src/ActionBar/ActionBar.stories.tsx b/code/ui/components/src/ActionBar/ActionBar.stories.tsx similarity index 100% rename from code/lib/components/src/ActionBar/ActionBar.stories.tsx rename to code/ui/components/src/ActionBar/ActionBar.stories.tsx diff --git a/code/lib/components/src/ActionBar/ActionBar.tsx b/code/ui/components/src/ActionBar/ActionBar.tsx similarity index 100% rename from code/lib/components/src/ActionBar/ActionBar.tsx rename to code/ui/components/src/ActionBar/ActionBar.tsx diff --git a/code/lib/components/src/Badge/Badge.stories.tsx b/code/ui/components/src/Badge/Badge.stories.tsx similarity index 100% rename from code/lib/components/src/Badge/Badge.stories.tsx rename to code/ui/components/src/Badge/Badge.stories.tsx diff --git a/code/lib/components/src/Badge/Badge.tsx b/code/ui/components/src/Badge/Badge.tsx similarity index 100% rename from code/lib/components/src/Badge/Badge.tsx rename to code/ui/components/src/Badge/Badge.tsx diff --git a/code/lib/components/src/Button/Button.stories.tsx b/code/ui/components/src/Button/Button.stories.tsx similarity index 100% rename from code/lib/components/src/Button/Button.stories.tsx rename to code/ui/components/src/Button/Button.stories.tsx diff --git a/code/lib/components/src/Button/Button.tsx b/code/ui/components/src/Button/Button.tsx similarity index 100% rename from code/lib/components/src/Button/Button.tsx rename to code/ui/components/src/Button/Button.tsx diff --git a/code/lib/components/src/Colors/SideBySide.tsx b/code/ui/components/src/Colors/SideBySide.tsx similarity index 100% rename from code/lib/components/src/Colors/SideBySide.tsx rename to code/ui/components/src/Colors/SideBySide.tsx diff --git a/code/lib/components/src/Colors/colorpalette.stories.mdx b/code/ui/components/src/Colors/colorpalette.stories.mdx similarity index 100% rename from code/lib/components/src/Colors/colorpalette.stories.mdx rename to code/ui/components/src/Colors/colorpalette.stories.mdx diff --git a/code/lib/components/src/Loader/Loader.stories.tsx b/code/ui/components/src/Loader/Loader.stories.tsx similarity index 100% rename from code/lib/components/src/Loader/Loader.stories.tsx rename to code/ui/components/src/Loader/Loader.stories.tsx diff --git a/code/lib/components/src/Loader/Loader.tsx b/code/ui/components/src/Loader/Loader.tsx similarity index 100% rename from code/lib/components/src/Loader/Loader.tsx rename to code/ui/components/src/Loader/Loader.tsx diff --git a/code/lib/components/src/ScrollArea/GlobalScrollAreaStyles.tsx b/code/ui/components/src/ScrollArea/GlobalScrollAreaStyles.tsx similarity index 100% rename from code/lib/components/src/ScrollArea/GlobalScrollAreaStyles.tsx rename to code/ui/components/src/ScrollArea/GlobalScrollAreaStyles.tsx diff --git a/code/lib/components/src/ScrollArea/OverlayScrollbars.tsx b/code/ui/components/src/ScrollArea/OverlayScrollbars.tsx similarity index 100% rename from code/lib/components/src/ScrollArea/OverlayScrollbars.tsx rename to code/ui/components/src/ScrollArea/OverlayScrollbars.tsx diff --git a/code/lib/components/src/ScrollArea/ScrollArea.stories.tsx b/code/ui/components/src/ScrollArea/ScrollArea.stories.tsx similarity index 100% rename from code/lib/components/src/ScrollArea/ScrollArea.stories.tsx rename to code/ui/components/src/ScrollArea/ScrollArea.stories.tsx diff --git a/code/lib/components/src/ScrollArea/ScrollArea.tsx b/code/ui/components/src/ScrollArea/ScrollArea.tsx similarity index 100% rename from code/lib/components/src/ScrollArea/ScrollArea.tsx rename to code/ui/components/src/ScrollArea/ScrollArea.tsx diff --git a/code/lib/components/src/Zoom/Zoom.stories.tsx b/code/ui/components/src/Zoom/Zoom.stories.tsx similarity index 100% rename from code/lib/components/src/Zoom/Zoom.stories.tsx rename to code/ui/components/src/Zoom/Zoom.stories.tsx diff --git a/code/lib/components/src/Zoom/Zoom.tsx b/code/ui/components/src/Zoom/Zoom.tsx similarity index 100% rename from code/lib/components/src/Zoom/Zoom.tsx rename to code/ui/components/src/Zoom/Zoom.tsx diff --git a/code/lib/components/src/Zoom/ZoomElement.tsx b/code/ui/components/src/Zoom/ZoomElement.tsx similarity index 100% rename from code/lib/components/src/Zoom/ZoomElement.tsx rename to code/ui/components/src/Zoom/ZoomElement.tsx diff --git a/code/lib/components/src/Zoom/ZoomIFrame.tsx b/code/ui/components/src/Zoom/ZoomIFrame.tsx similarity index 100% rename from code/lib/components/src/Zoom/ZoomIFrame.tsx rename to code/ui/components/src/Zoom/ZoomIFrame.tsx diff --git a/code/lib/components/src/Zoom/browserSupportsCssZoom.ts b/code/ui/components/src/Zoom/browserSupportsCssZoom.ts similarity index 100% rename from code/lib/components/src/Zoom/browserSupportsCssZoom.ts rename to code/ui/components/src/Zoom/browserSupportsCssZoom.ts diff --git a/code/lib/components/src/addon-panel/addon-panel.tsx b/code/ui/components/src/addon-panel/addon-panel.tsx similarity index 100% rename from code/lib/components/src/addon-panel/addon-panel.tsx rename to code/ui/components/src/addon-panel/addon-panel.tsx diff --git a/code/lib/components/src/bar/bar.tsx b/code/ui/components/src/bar/bar.tsx similarity index 100% rename from code/lib/components/src/bar/bar.tsx rename to code/ui/components/src/bar/bar.tsx diff --git a/code/lib/components/src/bar/button.stories.tsx b/code/ui/components/src/bar/button.stories.tsx similarity index 100% rename from code/lib/components/src/bar/button.stories.tsx rename to code/ui/components/src/bar/button.stories.tsx diff --git a/code/lib/components/src/bar/button.tsx b/code/ui/components/src/bar/button.tsx similarity index 100% rename from code/lib/components/src/bar/button.tsx rename to code/ui/components/src/bar/button.tsx diff --git a/code/lib/components/src/bar/separator.tsx b/code/ui/components/src/bar/separator.tsx similarity index 100% rename from code/lib/components/src/bar/separator.tsx rename to code/ui/components/src/bar/separator.tsx diff --git a/code/lib/components/src/brand/StorybookIcon.stories.tsx b/code/ui/components/src/brand/StorybookIcon.stories.tsx similarity index 100% rename from code/lib/components/src/brand/StorybookIcon.stories.tsx rename to code/ui/components/src/brand/StorybookIcon.stories.tsx diff --git a/code/lib/components/src/brand/StorybookIcon.tsx b/code/ui/components/src/brand/StorybookIcon.tsx similarity index 100% rename from code/lib/components/src/brand/StorybookIcon.tsx rename to code/ui/components/src/brand/StorybookIcon.tsx diff --git a/code/lib/components/src/brand/StorybookLogo.stories.tsx b/code/ui/components/src/brand/StorybookLogo.stories.tsx similarity index 100% rename from code/lib/components/src/brand/StorybookLogo.stories.tsx rename to code/ui/components/src/brand/StorybookLogo.stories.tsx diff --git a/code/lib/components/src/brand/StorybookLogo.tsx b/code/ui/components/src/brand/StorybookLogo.tsx similarity index 100% rename from code/lib/components/src/brand/StorybookLogo.tsx rename to code/ui/components/src/brand/StorybookLogo.tsx diff --git a/code/lib/components/src/form/field/field.tsx b/code/ui/components/src/form/field/field.tsx similarity index 100% rename from code/lib/components/src/form/field/field.tsx rename to code/ui/components/src/form/field/field.tsx diff --git a/code/lib/components/src/form/form.stories.tsx b/code/ui/components/src/form/form.stories.tsx similarity index 100% rename from code/lib/components/src/form/form.stories.tsx rename to code/ui/components/src/form/form.stories.tsx diff --git a/code/lib/components/src/form/index.tsx b/code/ui/components/src/form/index.tsx similarity index 100% rename from code/lib/components/src/form/index.tsx rename to code/ui/components/src/form/index.tsx diff --git a/code/lib/components/src/form/input/input.tsx b/code/ui/components/src/form/input/input.tsx similarity index 100% rename from code/lib/components/src/form/input/input.tsx rename to code/ui/components/src/form/input/input.tsx diff --git a/code/lib/components/src/icon/icon.stories.tsx b/code/ui/components/src/icon/icon.stories.tsx similarity index 100% rename from code/lib/components/src/icon/icon.stories.tsx rename to code/ui/components/src/icon/icon.stories.tsx diff --git a/code/lib/components/src/icon/icon.tsx b/code/ui/components/src/icon/icon.tsx similarity index 100% rename from code/lib/components/src/icon/icon.tsx rename to code/ui/components/src/icon/icon.tsx diff --git a/code/lib/components/src/icon/icons.tsx b/code/ui/components/src/icon/icons.tsx similarity index 100% rename from code/lib/components/src/icon/icons.tsx rename to code/ui/components/src/icon/icons.tsx diff --git a/code/lib/components/src/icon/svg.tsx b/code/ui/components/src/icon/svg.tsx similarity index 100% rename from code/lib/components/src/icon/svg.tsx rename to code/ui/components/src/icon/svg.tsx diff --git a/code/lib/components/src/index.ts b/code/ui/components/src/index.ts similarity index 100% rename from code/lib/components/src/index.ts rename to code/ui/components/src/index.ts diff --git a/code/lib/components/src/placeholder/placeholder.stories.tsx b/code/ui/components/src/placeholder/placeholder.stories.tsx similarity index 100% rename from code/lib/components/src/placeholder/placeholder.stories.tsx rename to code/ui/components/src/placeholder/placeholder.stories.tsx diff --git a/code/lib/components/src/placeholder/placeholder.tsx b/code/ui/components/src/placeholder/placeholder.tsx similarity index 100% rename from code/lib/components/src/placeholder/placeholder.tsx rename to code/ui/components/src/placeholder/placeholder.tsx diff --git a/code/lib/components/src/shared/animation.ts b/code/ui/components/src/shared/animation.ts similarity index 100% rename from code/lib/components/src/shared/animation.ts rename to code/ui/components/src/shared/animation.ts diff --git a/code/lib/components/src/spaced/Spaced.stories.tsx b/code/ui/components/src/spaced/Spaced.stories.tsx similarity index 100% rename from code/lib/components/src/spaced/Spaced.stories.tsx rename to code/ui/components/src/spaced/Spaced.stories.tsx diff --git a/code/lib/components/src/spaced/Spaced.tsx b/code/ui/components/src/spaced/Spaced.tsx similarity index 100% rename from code/lib/components/src/spaced/Spaced.tsx rename to code/ui/components/src/spaced/Spaced.tsx diff --git a/code/lib/components/src/syntaxhighlighter/formatter.test.ts b/code/ui/components/src/syntaxhighlighter/formatter.test.ts similarity index 100% rename from code/lib/components/src/syntaxhighlighter/formatter.test.ts rename to code/ui/components/src/syntaxhighlighter/formatter.test.ts diff --git a/code/lib/components/src/syntaxhighlighter/formatter.ts b/code/ui/components/src/syntaxhighlighter/formatter.ts similarity index 100% rename from code/lib/components/src/syntaxhighlighter/formatter.ts rename to code/ui/components/src/syntaxhighlighter/formatter.ts diff --git a/code/lib/components/src/syntaxhighlighter/lazy-syntaxhighlighter.tsx b/code/ui/components/src/syntaxhighlighter/lazy-syntaxhighlighter.tsx similarity index 100% rename from code/lib/components/src/syntaxhighlighter/lazy-syntaxhighlighter.tsx rename to code/ui/components/src/syntaxhighlighter/lazy-syntaxhighlighter.tsx diff --git a/code/lib/components/src/syntaxhighlighter/syntaxhighlighter-types.ts b/code/ui/components/src/syntaxhighlighter/syntaxhighlighter-types.ts similarity index 100% rename from code/lib/components/src/syntaxhighlighter/syntaxhighlighter-types.ts rename to code/ui/components/src/syntaxhighlighter/syntaxhighlighter-types.ts diff --git a/code/lib/components/src/syntaxhighlighter/syntaxhighlighter.stories.tsx b/code/ui/components/src/syntaxhighlighter/syntaxhighlighter.stories.tsx similarity index 100% rename from code/lib/components/src/syntaxhighlighter/syntaxhighlighter.stories.tsx rename to code/ui/components/src/syntaxhighlighter/syntaxhighlighter.stories.tsx diff --git a/code/lib/components/src/syntaxhighlighter/syntaxhighlighter.tsx b/code/ui/components/src/syntaxhighlighter/syntaxhighlighter.tsx similarity index 100% rename from code/lib/components/src/syntaxhighlighter/syntaxhighlighter.tsx rename to code/ui/components/src/syntaxhighlighter/syntaxhighlighter.tsx diff --git a/code/lib/components/src/tabs/tabs.stories.tsx b/code/ui/components/src/tabs/tabs.stories.tsx similarity index 100% rename from code/lib/components/src/tabs/tabs.stories.tsx rename to code/ui/components/src/tabs/tabs.stories.tsx diff --git a/code/lib/components/src/tabs/tabs.tsx b/code/ui/components/src/tabs/tabs.tsx similarity index 100% rename from code/lib/components/src/tabs/tabs.tsx rename to code/ui/components/src/tabs/tabs.tsx diff --git a/code/lib/components/src/tooltip/ListItem.stories.tsx b/code/ui/components/src/tooltip/ListItem.stories.tsx similarity index 100% rename from code/lib/components/src/tooltip/ListItem.stories.tsx rename to code/ui/components/src/tooltip/ListItem.stories.tsx diff --git a/code/lib/components/src/tooltip/ListItem.tsx b/code/ui/components/src/tooltip/ListItem.tsx similarity index 100% rename from code/lib/components/src/tooltip/ListItem.tsx rename to code/ui/components/src/tooltip/ListItem.tsx diff --git a/code/lib/components/src/tooltip/Tooltip.stories.tsx b/code/ui/components/src/tooltip/Tooltip.stories.tsx similarity index 100% rename from code/lib/components/src/tooltip/Tooltip.stories.tsx rename to code/ui/components/src/tooltip/Tooltip.stories.tsx diff --git a/code/lib/components/src/tooltip/Tooltip.tsx b/code/ui/components/src/tooltip/Tooltip.tsx similarity index 100% rename from code/lib/components/src/tooltip/Tooltip.tsx rename to code/ui/components/src/tooltip/Tooltip.tsx diff --git a/code/lib/components/src/tooltip/TooltipLinkList.stories.tsx b/code/ui/components/src/tooltip/TooltipLinkList.stories.tsx similarity index 100% rename from code/lib/components/src/tooltip/TooltipLinkList.stories.tsx rename to code/ui/components/src/tooltip/TooltipLinkList.stories.tsx diff --git a/code/lib/components/src/tooltip/TooltipLinkList.tsx b/code/ui/components/src/tooltip/TooltipLinkList.tsx similarity index 100% rename from code/lib/components/src/tooltip/TooltipLinkList.tsx rename to code/ui/components/src/tooltip/TooltipLinkList.tsx diff --git a/code/lib/components/src/tooltip/TooltipMessage.stories.tsx b/code/ui/components/src/tooltip/TooltipMessage.stories.tsx similarity index 100% rename from code/lib/components/src/tooltip/TooltipMessage.stories.tsx rename to code/ui/components/src/tooltip/TooltipMessage.stories.tsx diff --git a/code/lib/components/src/tooltip/TooltipMessage.tsx b/code/ui/components/src/tooltip/TooltipMessage.tsx similarity index 100% rename from code/lib/components/src/tooltip/TooltipMessage.tsx rename to code/ui/components/src/tooltip/TooltipMessage.tsx diff --git a/code/lib/components/src/tooltip/TooltipNote.stories.tsx b/code/ui/components/src/tooltip/TooltipNote.stories.tsx similarity index 100% rename from code/lib/components/src/tooltip/TooltipNote.stories.tsx rename to code/ui/components/src/tooltip/TooltipNote.stories.tsx diff --git a/code/lib/components/src/tooltip/TooltipNote.tsx b/code/ui/components/src/tooltip/TooltipNote.tsx similarity index 100% rename from code/lib/components/src/tooltip/TooltipNote.tsx rename to code/ui/components/src/tooltip/TooltipNote.tsx diff --git a/code/lib/components/src/tooltip/WithTooltip.stories.tsx b/code/ui/components/src/tooltip/WithTooltip.stories.tsx similarity index 100% rename from code/lib/components/src/tooltip/WithTooltip.stories.tsx rename to code/ui/components/src/tooltip/WithTooltip.stories.tsx diff --git a/code/lib/components/src/tooltip/WithTooltip.tsx b/code/ui/components/src/tooltip/WithTooltip.tsx similarity index 100% rename from code/lib/components/src/tooltip/WithTooltip.tsx rename to code/ui/components/src/tooltip/WithTooltip.tsx diff --git a/code/lib/components/src/tooltip/lazy-WithTooltip.tsx b/code/ui/components/src/tooltip/lazy-WithTooltip.tsx similarity index 100% rename from code/lib/components/src/tooltip/lazy-WithTooltip.tsx rename to code/ui/components/src/tooltip/lazy-WithTooltip.tsx diff --git a/code/lib/components/src/typings.d.ts b/code/ui/components/src/typings.d.ts similarity index 100% rename from code/lib/components/src/typings.d.ts rename to code/ui/components/src/typings.d.ts diff --git a/code/lib/components/src/typography/DocumentFormatting.tsx b/code/ui/components/src/typography/DocumentFormatting.tsx similarity index 100% rename from code/lib/components/src/typography/DocumentFormatting.tsx rename to code/ui/components/src/typography/DocumentFormatting.tsx diff --git a/code/lib/components/src/typography/DocumentFormattingSample.md b/code/ui/components/src/typography/DocumentFormattingSample.md similarity index 100% rename from code/lib/components/src/typography/DocumentFormattingSample.md rename to code/ui/components/src/typography/DocumentFormattingSample.md diff --git a/code/lib/components/src/typography/DocumentWrapper.stories.tsx b/code/ui/components/src/typography/DocumentWrapper.stories.tsx similarity index 100% rename from code/lib/components/src/typography/DocumentWrapper.stories.tsx rename to code/ui/components/src/typography/DocumentWrapper.stories.tsx diff --git a/code/lib/components/src/typography/DocumentWrapper.tsx b/code/ui/components/src/typography/DocumentWrapper.tsx similarity index 100% rename from code/lib/components/src/typography/DocumentWrapper.tsx rename to code/ui/components/src/typography/DocumentWrapper.tsx diff --git a/code/lib/components/src/typography/ResetWrapper.tsx b/code/ui/components/src/typography/ResetWrapper.tsx similarity index 100% rename from code/lib/components/src/typography/ResetWrapper.tsx rename to code/ui/components/src/typography/ResetWrapper.tsx diff --git a/code/lib/components/src/typography/components.tsx b/code/ui/components/src/typography/components.tsx similarity index 100% rename from code/lib/components/src/typography/components.tsx rename to code/ui/components/src/typography/components.tsx diff --git a/code/lib/components/src/typography/elements/A.tsx b/code/ui/components/src/typography/elements/A.tsx similarity index 100% rename from code/lib/components/src/typography/elements/A.tsx rename to code/ui/components/src/typography/elements/A.tsx diff --git a/code/lib/components/src/typography/elements/Blockquote.tsx b/code/ui/components/src/typography/elements/Blockquote.tsx similarity index 100% rename from code/lib/components/src/typography/elements/Blockquote.tsx rename to code/ui/components/src/typography/elements/Blockquote.tsx diff --git a/code/lib/components/src/typography/elements/Code.tsx b/code/ui/components/src/typography/elements/Code.tsx similarity index 100% rename from code/lib/components/src/typography/elements/Code.tsx rename to code/ui/components/src/typography/elements/Code.tsx diff --git a/code/lib/components/src/typography/elements/DL.tsx b/code/ui/components/src/typography/elements/DL.tsx similarity index 100% rename from code/lib/components/src/typography/elements/DL.tsx rename to code/ui/components/src/typography/elements/DL.tsx diff --git a/code/lib/components/src/typography/elements/Div.tsx b/code/ui/components/src/typography/elements/Div.tsx similarity index 100% rename from code/lib/components/src/typography/elements/Div.tsx rename to code/ui/components/src/typography/elements/Div.tsx diff --git a/code/lib/components/src/typography/elements/H1.tsx b/code/ui/components/src/typography/elements/H1.tsx similarity index 100% rename from code/lib/components/src/typography/elements/H1.tsx rename to code/ui/components/src/typography/elements/H1.tsx diff --git a/code/lib/components/src/typography/elements/H2.tsx b/code/ui/components/src/typography/elements/H2.tsx similarity index 100% rename from code/lib/components/src/typography/elements/H2.tsx rename to code/ui/components/src/typography/elements/H2.tsx diff --git a/code/lib/components/src/typography/elements/H3.tsx b/code/ui/components/src/typography/elements/H3.tsx similarity index 100% rename from code/lib/components/src/typography/elements/H3.tsx rename to code/ui/components/src/typography/elements/H3.tsx diff --git a/code/lib/components/src/typography/elements/H4.tsx b/code/ui/components/src/typography/elements/H4.tsx similarity index 100% rename from code/lib/components/src/typography/elements/H4.tsx rename to code/ui/components/src/typography/elements/H4.tsx diff --git a/code/lib/components/src/typography/elements/H5.tsx b/code/ui/components/src/typography/elements/H5.tsx similarity index 100% rename from code/lib/components/src/typography/elements/H5.tsx rename to code/ui/components/src/typography/elements/H5.tsx diff --git a/code/lib/components/src/typography/elements/H6.tsx b/code/ui/components/src/typography/elements/H6.tsx similarity index 100% rename from code/lib/components/src/typography/elements/H6.tsx rename to code/ui/components/src/typography/elements/H6.tsx diff --git a/code/lib/components/src/typography/elements/HR.tsx b/code/ui/components/src/typography/elements/HR.tsx similarity index 100% rename from code/lib/components/src/typography/elements/HR.tsx rename to code/ui/components/src/typography/elements/HR.tsx diff --git a/code/lib/components/src/typography/elements/Img.tsx b/code/ui/components/src/typography/elements/Img.tsx similarity index 100% rename from code/lib/components/src/typography/elements/Img.tsx rename to code/ui/components/src/typography/elements/Img.tsx diff --git a/code/lib/components/src/typography/elements/LI.tsx b/code/ui/components/src/typography/elements/LI.tsx similarity index 100% rename from code/lib/components/src/typography/elements/LI.tsx rename to code/ui/components/src/typography/elements/LI.tsx diff --git a/code/lib/components/src/typography/elements/Link.tsx b/code/ui/components/src/typography/elements/Link.tsx similarity index 100% rename from code/lib/components/src/typography/elements/Link.tsx rename to code/ui/components/src/typography/elements/Link.tsx diff --git a/code/lib/components/src/typography/elements/OL.tsx b/code/ui/components/src/typography/elements/OL.tsx similarity index 100% rename from code/lib/components/src/typography/elements/OL.tsx rename to code/ui/components/src/typography/elements/OL.tsx diff --git a/code/lib/components/src/typography/elements/P.tsx b/code/ui/components/src/typography/elements/P.tsx similarity index 100% rename from code/lib/components/src/typography/elements/P.tsx rename to code/ui/components/src/typography/elements/P.tsx diff --git a/code/lib/components/src/typography/elements/Pre.tsx b/code/ui/components/src/typography/elements/Pre.tsx similarity index 100% rename from code/lib/components/src/typography/elements/Pre.tsx rename to code/ui/components/src/typography/elements/Pre.tsx diff --git a/code/lib/components/src/typography/elements/Span.tsx b/code/ui/components/src/typography/elements/Span.tsx similarity index 100% rename from code/lib/components/src/typography/elements/Span.tsx rename to code/ui/components/src/typography/elements/Span.tsx diff --git a/code/lib/components/src/typography/elements/TT.tsx b/code/ui/components/src/typography/elements/TT.tsx similarity index 100% rename from code/lib/components/src/typography/elements/TT.tsx rename to code/ui/components/src/typography/elements/TT.tsx diff --git a/code/lib/components/src/typography/elements/Table.tsx b/code/ui/components/src/typography/elements/Table.tsx similarity index 100% rename from code/lib/components/src/typography/elements/Table.tsx rename to code/ui/components/src/typography/elements/Table.tsx diff --git a/code/lib/components/src/typography/elements/UL.tsx b/code/ui/components/src/typography/elements/UL.tsx similarity index 100% rename from code/lib/components/src/typography/elements/UL.tsx rename to code/ui/components/src/typography/elements/UL.tsx diff --git a/code/lib/components/src/typography/lib/common.tsx b/code/ui/components/src/typography/lib/common.tsx similarity index 100% rename from code/lib/components/src/typography/lib/common.tsx rename to code/ui/components/src/typography/lib/common.tsx diff --git a/code/lib/components/src/typography/lib/isReactChildString.tsx b/code/ui/components/src/typography/lib/isReactChildString.tsx similarity index 100% rename from code/lib/components/src/typography/lib/isReactChildString.tsx rename to code/ui/components/src/typography/lib/isReactChildString.tsx diff --git a/code/lib/components/src/typography/link/link.stories.tsx b/code/ui/components/src/typography/link/link.stories.tsx similarity index 100% rename from code/lib/components/src/typography/link/link.stories.tsx rename to code/ui/components/src/typography/link/link.stories.tsx diff --git a/code/lib/components/src/typography/link/link.test.tsx b/code/ui/components/src/typography/link/link.test.tsx similarity index 100% rename from code/lib/components/src/typography/link/link.test.tsx rename to code/ui/components/src/typography/link/link.test.tsx diff --git a/code/lib/components/src/typography/link/link.tsx b/code/ui/components/src/typography/link/link.tsx similarity index 100% rename from code/lib/components/src/typography/link/link.tsx rename to code/ui/components/src/typography/link/link.tsx diff --git a/code/lib/components/src/typography/typography.stories.mdx b/code/ui/components/src/typography/typography.stories.mdx similarity index 100% rename from code/lib/components/src/typography/typography.stories.mdx rename to code/ui/components/src/typography/typography.stories.mdx diff --git a/code/lib/components/src/utils/getStoryHref.ts b/code/ui/components/src/utils/getStoryHref.ts similarity index 100% rename from code/lib/components/src/utils/getStoryHref.ts rename to code/ui/components/src/utils/getStoryHref.ts diff --git a/code/lib/components/tsconfig.json b/code/ui/components/tsconfig.json similarity index 100% rename from code/lib/components/tsconfig.json rename to code/ui/components/tsconfig.json diff --git a/code/ui/manager/src/containers/panel.stories.tsx b/code/ui/manager/src/containers/panel.stories.tsx index c330f93c9181..9678d3eff796 100644 --- a/code/ui/manager/src/containers/panel.stories.tsx +++ b/code/ui/manager/src/containers/panel.stories.tsx @@ -11,9 +11,9 @@ TODO: this story currently breaks the whole Storybook UI (including the manager) Current findings: - Only happens when actions below are disabled, not when a11y is. - Is related to panels and addon tabs. -- Commenting out code/lib/components/src/tabs/tabs.tsx#L186 fixes the issue. +- Commenting out code/ui/components/src/tabs/tabs.tsx#L186 fixes the issue. - ... this line: {list.map(({ id, active, render }) => render({ key: id, active }))} -- The error is most likely the shenanigans we do at code/lib/components/src/tabs/tabs.tsx#childrenToList +- The error is most likely the shenanigans we do at code/ui/components/src/tabs/tabs.tsx#childrenToList export const FilteredAddons = () =>
By default all addon panels are rendered
; FilteredAddons.parameters = { diff --git a/code/workspace.json b/code/workspace.json index e942f220bc56..7248ca836f39 100644 --- a/code/workspace.json +++ b/code/workspace.json @@ -157,7 +157,7 @@ "implicitDependencies": [] }, "@storybook/components": { - "root": "lib/components", + "root": "ui/components", "type": "library", "implicitDependencies": [] }, diff --git a/code/yarn.lock b/code/yarn.lock index 38d4ec19d97c..54caeb70d588 100644 --- a/code/yarn.lock +++ b/code/yarn.lock @@ -7412,9 +7412,9 @@ __metadata: languageName: unknown linkType: soft -"@storybook/components@7.0.0-alpha.38, @storybook/components@workspace:*, @storybook/components@workspace:lib/components": +"@storybook/components@7.0.0-alpha.38, @storybook/components@workspace:*, @storybook/components@workspace:ui/components": version: 0.0.0-use.local - resolution: "@storybook/components@workspace:lib/components" + resolution: "@storybook/components@workspace:ui/components" dependencies: "@popperjs/core": ^2.6.0 "@storybook/client-logger": 7.0.0-alpha.38 diff --git a/docs/addons/addon-knowledge-base.md b/docs/addons/addon-knowledge-base.md index fd38290f4ec0..dd4aa0986bc7 100644 --- a/docs/addons/addon-knowledge-base.md +++ b/docs/addons/addon-knowledge-base.md @@ -49,30 +49,30 @@ Addon authors can develop their UIs using any React library. But we recommend us Use the components listed below with your next addon. -| Component | Source | Story | -| ------------------ | ----------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------- | -| Action Bar | [See component implementation](https://github.com/storybookjs/storybook/blob/master/lib/components/src/ActionBar/ActionBar.tsx) | [See component story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-actionbar--single-item) | -| Addon Panel | [See component implementation](https://github.com/storybookjs/storybook/blob/master/lib/components/src/addon-panel/addon-panel.tsx) | N/A | -| Badge | [See component implementation](https://github.com/storybookjs/storybook/blob/master/lib/components/src/Badge/Badge.tsx) | [See component story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-badge--all-badges) | -| Button | [See component implementation](https://github.com/storybookjs/storybook/blob/master/lib/components/src/Button/Button.tsx) | [See component story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-button--all-buttons) | -| Form | [See component implementation](https://github.com/storybookjs/storybook/blob/master/lib/components/src/form/index.tsx) | [See component story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-form-button--sizes) | -| Loader | [See component implementation](https://github.com/storybookjs/storybook/blob/master/lib/components/src/Loader/Loader.tsx) | [See component story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-loader--progress-bar) | -| PlaceHolder | [See component implementation](https://github.com/storybookjs/storybook/blob/master/lib/components/src/placeholder/placeholder.tsx) | [See component story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-placeholder--single-child) | -| Scroll Area | [See component implementation](https://github.com/storybookjs/storybook/blob/master/lib/components/src/ScrollArea/ScrollArea.tsx) | [See component story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-scrollarea--vertical) | -| Space | [See component implementation](https://github.com/storybookjs/storybook/blob/master/lib/components/src/spaced/Spaced.tsx) | [See component story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-spaced--row) | -| Syntax Highlighter | [See component implementation](https://github.com/storybookjs/storybook/blob/master/lib/components/src/syntaxhighlighter/syntaxhighlighter.tsx) | [See component story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-syntaxhighlighter--bash) | -| Tabs | [See component implementation](https://github.com/storybookjs/storybook/blob/master/lib/components/src/tabs/tabs.tsx) | [See component story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-tabs--stateful-static) | -| ToolBar | [See component implementation](https://github.com/storybookjs/storybook/blob/master/lib/components/src/bar/bar.tsx) | N/A | -| ToolTip | [See component implementation](https://github.com/storybookjs/storybook/blob/master/lib/components/src/tooltip/Tooltip.tsx) | [See component story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-tooltip-tooltip--basic-default) | -| Zoom | [See component implementation](https://github.com/storybookjs/storybook/blob/master/lib/components/src/Zoom/Zoom.tsx) | [See component story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-zoom--element-actual-size) | +| Component | Source | Story | +| ------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------- | +| Action Bar | [See component implementation](https://github.com/storybookjs/storybook/blob/master/code/ui/components/src/ActionBar/ActionBar.tsx) | [See component story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-actionbar--single-item) | +| Addon Panel | [See component implementation](https://github.com/storybookjs/storybook/blob/master/code/ui/components/src/addon-panel/addon-panel.tsx) | N/A | +| Badge | [See component implementation](https://github.com/storybookjs/storybook/blob/master/code/ui/components/src/Badge/Badge.tsx) | [See component story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-badge--all-badges) | +| Button | [See component implementation](https://github.com/storybookjs/storybook/blob/master/code/ui/components/src/Button/Button.tsx) | [See component story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-button--all-buttons) | +| Form | [See component implementation](https://github.com/storybookjs/storybook/blob/master/code/ui/components/src/form/index.tsx) | [See component story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-form-button--sizes) | +| Loader | [See component implementation](https://github.com/storybookjs/storybook/blob/master/code/ui/components/src/Loader/Loader.tsx) | [See component story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-loader--progress-bar) | +| PlaceHolder | [See component implementation](https://github.com/storybookjs/storybook/blob/master/code/ui/components/src/placeholder/placeholder.tsx) | [See component story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-placeholder--single-child) | +| Scroll Area | [See component implementation](https://github.com/storybookjs/storybook/blob/master/code/ui/components/src/ScrollArea/ScrollArea.tsx) | [See component story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-scrollarea--vertical) | +| Space | [See component implementation](https://github.com/storybookjs/storybook/blob/master/code/ui/components/src/spaced/Spaced.tsx) | [See component story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-spaced--row) | +| Syntax Highlighter | [See component implementation](https://github.com/storybookjs/storybook/blob/master/code/ui/components/src/syntaxhighlighter/syntaxhighlighter.tsx) | [See component story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-syntaxhighlighter--bash) | +| Tabs | [See component implementation](https://github.com/storybookjs/storybook/blob/master/code/ui/components/src/tabs/tabs.tsx) | [See component story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-tabs--stateful-static) | +| ToolBar | [See component implementation](https://github.com/storybookjs/storybook/blob/master/code/ui/components/src/bar/bar.tsx) | N/A | +| ToolTip | [See component implementation](https://github.com/storybookjs/storybook/blob/master/code/ui/components/src/tooltip/Tooltip.tsx) | [See component story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-tooltip-tooltip--basic-default) | +| Zoom | [See component implementation](https://github.com/storybookjs/storybook/blob/master/code/ui/components/src/Zoom/Zoom.tsx) | [See component story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-zoom--element-actual-size) | Complementing the components, also included is a set of UI primitives. Use the content listed below as a reference for styling your addon. -| Component | Source | Story | -| ------------------------------ | ------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------- | -| Color Palette (see note below) | [See implementation](https://github.com/storybookjs/storybook/tree/master/lib/components/src/Colors) | [See story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-colorpalette--page) | -| Icon | [See implementation](https://github.com/storybookjs/storybook/blob/master/lib/components/src/icon/icons.tsx) | [See story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-icon--labels) | -| Typography | [See implementation](https://github.com/storybookjs/storybook/tree/master/lib/components/src/typography) | [See story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-typography--all) | +| Component | Source | Story | +| ------------------------------ | ---------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------- | +| Color Palette (see note below) | [See implementation](https://github.com/storybookjs/storybook/tree/master/code/ui/components/src/Colors) | [See story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-colorpalette--page) | +| Icon | [See implementation](https://github.com/storybookjs/storybook/blob/master/code/ui/components/src/icon/icons.tsx) | [See story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-icon--labels) | +| Typography | [See implementation](https://github.com/storybookjs/storybook/tree/master/code/ui/components/src/typography) | [See story](https://5a375b97f4b14f0020b0cda3-wbeulgbetj.chromatic.com/?path=/story/basics-typography--all) |
The color palette implemented by @storybook/components is a high-level abstraction of the @storybook/theming package. From 79b61d3653b6f889baa74c1f1ae47c05154f2946 Mon Sep 17 00:00:00 2001 From: Jeppe Reinhold Date: Mon, 17 Oct 2022 11:20:51 +0200 Subject: [PATCH 02/21] fix Button.stories --- code/ui/.storybook/main.ts | 14 +- .../components/src/Button/Button.stories.tsx | 132 +++++++++++------- 2 files changed, 90 insertions(+), 56 deletions(-) diff --git a/code/ui/.storybook/main.ts b/code/ui/.storybook/main.ts index 7ed5df74a44a..9abb26665b3e 100644 --- a/code/ui/.storybook/main.ts +++ b/code/ui/.storybook/main.ts @@ -4,8 +4,18 @@ import type { StorybookConfig } from '../../frameworks/react-vite/dist'; const config: StorybookConfig = { stories: [ - '../manager/src/**/*.stories.@(ts|tsx|js|jsx|mdx)', - '../components/src/**/*.stories.@(js|jsx|ts|tsx|mdx)', + { + directory: '../manager/src/**/', + files: '*.stories.@(ts|tsx|js|jsx|mdx)', + titlePrefix: 'Manager', + }, + { + directory: '../components/src/**/', + files: 'Button/*.stories.@(js|jsx|ts|tsx|mdx)', + titlePrefix: 'Components', + }, + // '../components/src/**/*.stories.@(js|jsx|ts|tsx|mdx)', + // '../../../addons/interactions/**/*.stories.@(ts|tsx|js|jsx|mdx)', ], addons: [ diff --git a/code/ui/components/src/Button/Button.stories.tsx b/code/ui/components/src/Button/Button.stories.tsx index 787c55015987..588779f887f2 100644 --- a/code/ui/components/src/Button/Button.stories.tsx +++ b/code/ui/components/src/Button/Button.stories.tsx @@ -1,59 +1,83 @@ import React from 'react'; -import { storiesOf } from '@storybook/react'; +import { Args } from '@storybook/csf'; + import { Button } from './Button'; import { Icons } from '../icon/icon'; - import { Form } from '../form/index'; -const { Button: FormButton } = Form; - -storiesOf('Basics/Button', module).add('all buttons', () => ( -
-

Button that is used for forms

- Form.Button -
-

Buttons that are used for everything else

- - - -
- - - - -
- - - - - - - - -
-)); +export default { + title: 'Basics/Button', + component: Button, +}; + +export const Default = { args: { children: 'Default' } }; + +export const FormButton = { + render: (args: Args) => , + args: { children: 'Form.Button' }, +}; + +export const Primary = { args: { primary: true, children: 'Primary' } }; +export const Secondary = { args: { secondary: true, children: 'Secondary' } }; +export const Tertiary = { args: { tertiary: true, children: 'Tertiary' } }; +export const Gray = { args: { gray: true, children: 'Gray' } }; + +export const Outline = { args: { outline: true, children: 'Outline' } }; +export const OutlinePrimary = { + args: { outline: true, primary: true, children: 'Outline Primary' }, +}; +export const OutlineSecondary = { + args: { outline: true, secondary: true, children: 'Outline Secondary' }, +}; +export const OutlineTertiary = { + args: { outline: true, tertiary: true, children: 'Outline Tertiary' }, +}; + +export const Disabled = { args: { disabled: true, children: 'Disabled' } }; +export const DisabledPrimary = { + args: { disabled: true, primary: true, children: 'Disabled Priary' }, +}; +export const DisabledSecondary = { + args: { disabled: true, secondary: true, children: 'Disabled Secondary' }, +}; +export const DisabledTertiary = { + args: { disabled: true, tertiary: true, children: 'Disabled Tertiary' }, +}; +export const DisabledGray = { + args: { disabled: true, gray: true, children: 'Disabled Gray' }, +}; + +export const Small = { args: { small: true, children: 'Small' } }; +export const SmallPrimary = { + args: { small: true, primary: true, children: 'Small Priary' }, +}; +export const SmallSecondary = { + args: { small: true, secondary: true, children: 'Small Secondary' }, +}; +export const SmallTertiary = { + args: { small: true, tertiary: true, children: 'Small Tertiary' }, +}; +export const SmallGray = { + args: { small: true, gray: true, children: 'Small Gray' }, +}; + +export const IconPrimary = { + args: { + primary: true, + containsIcon: true, + title: 'link', + children: , + }, +}; +export const IconOutline = { + args: { outline: true, containsIcon: true, title: 'link', children: }, +}; +export const IconOutlineSmall = { + args: { + outline: true, + containsIcon: true, + small: true, + title: 'link', + children: , + }, +}; From 20a8761f31010081af3de1d615dcb1e67b595479 Mon Sep 17 00:00:00 2001 From: Jeppe Reinhold Date: Mon, 17 Oct 2022 11:26:16 +0200 Subject: [PATCH 03/21] upgrade Badge.stories to CSF3 --- code/ui/.storybook/main.ts | 2 +- .../ui/components/src/Badge/Badge.stories.tsx | 22 +++++++++---------- 2 files changed, 12 insertions(+), 12 deletions(-) diff --git a/code/ui/.storybook/main.ts b/code/ui/.storybook/main.ts index 9abb26665b3e..d0c3a68716ba 100644 --- a/code/ui/.storybook/main.ts +++ b/code/ui/.storybook/main.ts @@ -11,7 +11,7 @@ const config: StorybookConfig = { }, { directory: '../components/src/**/', - files: 'Button/*.stories.@(js|jsx|ts|tsx|mdx)', + files: '@(Button|Badge)/*.stories.@(js|jsx|ts|tsx|mdx)', titlePrefix: 'Components', }, // '../components/src/**/*.stories.@(js|jsx|ts|tsx|mdx)', diff --git a/code/ui/components/src/Badge/Badge.stories.tsx b/code/ui/components/src/Badge/Badge.stories.tsx index f579398065b2..c987d5a7b1cb 100644 --- a/code/ui/components/src/Badge/Badge.stories.tsx +++ b/code/ui/components/src/Badge/Badge.stories.tsx @@ -1,13 +1,13 @@ -import React from 'react'; -import { storiesOf } from '@storybook/react'; import { Badge } from './Badge'; -storiesOf('Basics/Badge', module).add('all badges', () => ( -
- Neutral - Positive - Warning - Negative - Critical -
-)); +export default { + title: 'Basics/Badge', + component: Badge, +}; + +export const Default = { args: { children: 'Default' } }; +export const Positive = { args: { status: 'positive', children: 'Positive' } }; +export const Negative = { args: { status: 'negative', children: 'Negative' } }; +export const Neutral = { args: { status: 'neutral', children: 'Neutral' } }; +export const Warning = { args: { status: 'warning', children: 'Warning' } }; +export const Critical = { args: { status: 'critical', children: 'Critical' } }; From 3c6141878d9292885ebedcca93c7a5bda5dea5e6 Mon Sep 17 00:00:00 2001 From: Jeppe Reinhold Date: Mon, 17 Oct 2022 13:22:50 +0200 Subject: [PATCH 04/21] migrate StorybookIcon, Form to CSF3 --- code/ui/.storybook/main.ts | 2 +- .../src/brand/StorybookIcon.stories.tsx | 10 +- code/ui/components/src/form/form.stories.tsx | 267 ++++++++---------- code/ui/components/src/form/input/input.tsx | 6 +- 4 files changed, 132 insertions(+), 153 deletions(-) diff --git a/code/ui/.storybook/main.ts b/code/ui/.storybook/main.ts index d0c3a68716ba..373bd92a783a 100644 --- a/code/ui/.storybook/main.ts +++ b/code/ui/.storybook/main.ts @@ -11,7 +11,7 @@ const config: StorybookConfig = { }, { directory: '../components/src/**/', - files: '@(Button|Badge)/*.stories.@(js|jsx|ts|tsx|mdx)', + files: '@(Button|Badge|brand|form)/*.stories.@(js|jsx|ts|tsx|mdx)', titlePrefix: 'Components', }, // '../components/src/**/*.stories.@(js|jsx|ts|tsx|mdx)', diff --git a/code/ui/components/src/brand/StorybookIcon.stories.tsx b/code/ui/components/src/brand/StorybookIcon.stories.tsx index 702e6deede08..1e4ae0177053 100644 --- a/code/ui/components/src/brand/StorybookIcon.stories.tsx +++ b/code/ui/components/src/brand/StorybookIcon.stories.tsx @@ -1,6 +1,8 @@ -import React from 'react'; -import { storiesOf } from '@storybook/react'; - import { StorybookIcon } from './StorybookIcon'; -storiesOf('Basics/Brand/StorybookIcon', module).add('default', () => ); +export default { + title: 'Basics/Brand/StorybookIcon', + component: StorybookIcon, +}; + +export const Default = {}; diff --git a/code/ui/components/src/form/form.stories.tsx b/code/ui/components/src/form/form.stories.tsx index a4220cf03096..09ae2867edc5 100644 --- a/code/ui/components/src/form/form.stories.tsx +++ b/code/ui/components/src/form/form.stories.tsx @@ -1,156 +1,133 @@ import React from 'react'; import { styled } from '@storybook/theming'; -import { storiesOf } from '@storybook/react'; import { action } from '@storybook/addon-actions'; -import { Input, Button, Select, Textarea } from './input/input'; -import { Field } from './field/field'; +import * as InputComponents from './input/input'; +import { Field as FieldComponent } from './field/field'; import { Spaced } from '../spaced/Spaced'; -const Flexed = styled(Field)({ display: 'flex' }); +const Flexed = styled(FieldComponent)({ display: 'flex' }); -storiesOf('Basics/Form/Field', module).add('field', () => ( - - - -)); +export default { + title: 'Basics/Form', +}; -storiesOf('Basics/Form/Select', module) - .add('sizes', () => ( - - {['auto', 'flex', '100%'].map((size) => ( - - - - ))} - - )) - .add('validations', () => ( -
- - {['error', 'warn', 'valid', null].map((valid) => ( - - - - ))} - - - - -
- )); +const sharedArgTypes = { + disabled: { + defaultValue: false, + control: { + type: 'boolean', + }, + }, + size: { + defaultValue: 'auto', + control: { + type: 'radio', + // TODO: weak typings + options: ['100%', 'auto', 'flex'] as InputComponents.Sizes[], + }, + }, + valid: { + control: { + type: 'radio', + // TODO: weak typings + options: [null, 'valid', 'warn', 'error'] as InputComponents.ValidationStates[], + }, + }, + align: { + control: { + type: 'radio', + // TODO: weak typings + options: [null, 'start', 'center', 'end'] as InputComponents.Alignments[], + }, + }, +}; -storiesOf('Basics/Form/Button', module) - .add('sizes', () => ( - - {['auto', 'flex', '100%'].map((size) => ( - - - - ))} - - )) - .add('validations', () => ( - - {['error', 'warn', 'valid', null].map((valid) => ( - - - - ))} - - )); +export const Field = { + render: (args) => ( + + + + + + + + ), + argTypes: { + label: { + defaultValue: 'label', + control: { + type: 'text', + }, + }, + }, +}; -storiesOf('Basics/Form/Textarea', module) - .add('sizes', () => ( - - {['auto', 'flex', '100%'].map((size) => ( - -