chore(storybook): move all component-level parameters from MDX to sto…

…ry files - Import MDX Meta blocks from `@storybook/blocks` - Move any component-level parameters in MDX Meta blocks to story files - Remove `info` parameter from MDX Meta blocks (was used by a removed addon) - Remove parameters prop from MDX Meta blocks (no longer supported)
Sage · Mar 20, 2024 · 37fdeb7 · 37fdeb7
1 parent 5b8a2c5
commit 37fdeb7
Show file tree

Hide file tree

Showing 133 changed files with 80 additions and 213 deletions.
diff --git a/docs/bundle-size.mdx b/docs/bundle-size.mdx
@@ -1,4 +1,4 @@
-import { Meta } from "@storybook/addon-docs";
+import { Meta } from "@storybook/blocks";
 
 <Meta title="Documentation/Bundle Size" />
 

diff --git a/docs/colors.mdx b/docs/colors.mdx
@@ -1,4 +1,4 @@
-import { Meta } from "@storybook/addon-docs";
+import { Meta } from "@storybook/blocks";
 
 <Meta title="Documentation/Colors" />
 

diff --git a/docs/component-dos-and-donts.mdx b/docs/component-dos-and-donts.mdx
@@ -1,4 +1,4 @@
-import { Meta } from "@storybook/addon-docs";
+import { Meta } from "@storybook/blocks";
 
 <Meta title="Documentation/Component Dos and Don'ts" />
 

diff --git a/docs/extending-styles-using-styled-components.mdx b/docs/extending-styles-using-styled-components.mdx
@@ -1,4 +1,4 @@
-import { Meta, Story, Canvas } from "@storybook/addon-docs";
+import { Meta, Story, Canvas } from "@storybook/blocks";
 import styled from "styled-components";
 import Box from "../src/components/box";
 

diff --git a/docs/how-to-contribute.mdx b/docs/how-to-contribute.mdx
@@ -1,4 +1,4 @@
-import { Meta } from "@storybook/addon-docs";
+import { Meta } from "@storybook/blocks";
 
 <Meta title="Contributing/How to contribute" />
 

diff --git a/docs/i18n.mdx b/docs/i18n.mdx
@@ -1,4 +1,4 @@
-import { Meta } from "@storybook/addon-docs";
+import { Meta } from "@storybook/blocks";
 
 <Meta title="Documentation/i18n" />
 

diff --git a/docs/installation.mdx b/docs/installation.mdx
@@ -1,4 +1,4 @@
-import { Meta } from "@storybook/addon-docs";
+import { Meta } from "@storybook/blocks";
 
 <Meta title="Getting Started/Installation" />
 

diff --git a/docs/roadmap.mdx b/docs/roadmap.mdx
@@ -1,4 +1,4 @@
-import { Meta } from "@storybook/addon-docs";
+import { Meta } from "@storybook/blocks";
 
 <Meta title="Contributing/Roadmap" />
 

diff --git a/docs/usage-with-routing.mdx b/docs/usage-with-routing.mdx
@@ -1,4 +1,4 @@
-import { Meta } from "@storybook/addon-docs";
+import { Meta } from "@storybook/blocks";
 
 <Meta title="Documentation/Usage with routing" />
 

diff --git a/docs/usage.mdx b/docs/usage.mdx
@@ -1,4 +1,4 @@
-import { Meta } from "@storybook/addon-docs";
+import { Meta } from "@storybook/blocks";
 
 <Meta title="Getting Started/Usage" />
 

diff --git a/docs/using-draft-js.mdx b/docs/using-draft-js.mdx
@@ -1,4 +1,4 @@
-import { Meta } from "@storybook/addon-docs";
+import { Meta } from "@storybook/blocks";
 
 <Meta
   title="Documentation/Using DraftJS"

diff --git a/docs/validations.mdx b/docs/validations.mdx
@@ -1,13 +1,9 @@
-import { Meta, Canvas } from "@storybook/addon-docs";
+import { Meta, Canvas } from "@storybook/blocks";
 
 import * as ValidationsStories from "./validations.stories";
 
 <Meta
   title="Documentation/Validations"
-  parameters={{
-    info: { disable: true },
-    chromatic: { disableSnapshot: true },
-  }}
   of={ValidationsStories}
 />
 

diff --git a/docs/validations.stories.tsx b/docs/validations.stories.tsx
@@ -13,6 +13,9 @@ import { RadioButton, RadioButtonGroup } from "../src/components/radio-button";
 const meta: Meta = {
   title: "Documentation/Validations",
   tags: ["hideInSidebar"],
+  parameters: {
+    chromatic: { disableSnapshot: true },
+  },
 };
 
 export default meta;

diff --git a/src/components/accordion/accordion.mdx b/src/components/accordion/accordion.mdx
@@ -5,7 +5,6 @@ import * as AccordionGroupStories from "./accordion-group/accordion-group.storie
 
 <Meta
   title="Accordion"
-  parameters={{ info: { disable: true } }}
   of={AccordionStories}
 />
 

diff --git a/src/components/action-popover/action-popover.mdx b/src/components/action-popover/action-popover.mdx
@@ -8,7 +8,6 @@ import * as ActionPopoverStories from "./action-popover.stories";
 
 <Meta
   title="Action Popover"
-  parameters={{ info: { disable: true }, chromatic: { disableSnapshot: true } }}
   of={ActionPopoverStories}
 />
 

diff --git a/src/components/action-popover/action-popover.stories.tsx b/src/components/action-popover/action-popover.stories.tsx
@@ -33,6 +33,7 @@ const meta: Meta<typeof ActionPopover> = {
   argTypes: {
     ...styledSystemProps,
   },
+  parameters: { chromatic: { disableSnapshot: true } },
 };
 
 export default meta;

diff --git a/src/components/advanced-color-picker/advanced-color-picker.mdx b/src/components/advanced-color-picker/advanced-color-picker.mdx
@@ -5,7 +5,6 @@ import * as AdvancedColorPickerStories from "./advanced-color-picker.stories";
 
 <Meta
   title="Advanced Color Picker"
-  parameters={{ info: { disable: true } }}
   of={AdvancedColorPickerStories}
 />
 

diff --git a/src/components/alert/alert.mdx b/src/components/alert/alert.mdx
@@ -3,11 +3,7 @@ import * as AlertStories from "./alert.stories";
 
 <Meta
   title="Alert"
-  parameters={{
-    info: { disable: true },
-    themeProvider: { chromatic: { theme: "sage" } },
-  }}
-  of={AlertStories}
+    of={AlertStories}
 />
 
 # Alert

diff --git a/src/components/alert/alert.stories.tsx b/src/components/alert/alert.stories.tsx
@@ -8,6 +8,7 @@ import isChromatic from "../../../.storybook/isChromatic";
 const meta: Meta<typeof Alert> = {
   title: "Alert",
   component: Alert,
+  parameters: { themeProvider: { chromatic: { theme: "sage" } } },
 };
 
 export default meta;

diff --git a/src/components/anchor-navigation/anchor-navigation.mdx b/src/components/anchor-navigation/anchor-navigation.mdx
@@ -5,11 +5,7 @@ import * as AnchorNavigationStories from "./anchor-navigation.stories";
 
 <Meta
   title="Anchor Navigation"
-  parameters={{
-    info: { disable: true },
-    chromatic: { disableSnapshot: true },
-  }}
-  of={AnchorNavigationStories}
+    of={AnchorNavigationStories}
 />
 
 # Anchor Navigation

diff --git a/src/components/anchor-navigation/anchor-navigation.stories.tsx b/src/components/anchor-navigation/anchor-navigation.stories.tsx
@@ -15,6 +15,9 @@ import {
 const meta: Meta<typeof AnchorNavigation> = {
   component: AnchorNavigation,
   title: "Anchor Navigation",
+  parameters: {
+    chromatic: { disableSnapshot: true },
+  },
 };
 
 export default meta;

diff --git a/src/components/badge/badge.mdx b/src/components/badge/badge.mdx
@@ -5,7 +5,6 @@ import * as BadgeStories from "./badge.stories";
 
 <Meta
   title="Badge"
-  parameters={{ info: { disable: true } }}
   of={BadgeStories}
 />
 

diff --git a/src/components/batch-selection/batch-selection.mdx b/src/components/batch-selection/batch-selection.mdx
@@ -7,7 +7,6 @@ import * as BatchSelectionStories from "./batch-selection.stories";
 
 <Meta
   title="Batch Selection"
-  parameters={{ info: { disable: true } }}
   of={BatchSelectionStories}
 />
 

diff --git a/src/components/box/box.mdx b/src/components/box/box.mdx
@@ -2,7 +2,7 @@ import { Meta, ArgTypes, Canvas } from "@storybook/blocks";
 
 import * as BoxStories from "./box.stories";
 
-<Meta title="Box" parameters={{ info: { disable: true } }} of={BoxStories} />
+<Meta title="Box" of={BoxStories} />
 
 # Box
 

diff --git a/src/components/breadcrumbs/breadcrumbs.mdx b/src/components/breadcrumbs/breadcrumbs.mdx
@@ -6,7 +6,6 @@ import * as BreadcrumbsStories from "./breadcrumbs.stories.tsx";
 
 <Meta
   title="Breadcrumbs"
-  parameters={{ info: { disable: true } }}
   of={BreadcrumbsStories}
 />
 

diff --git a/src/components/button-bar/button-bar.mdx b/src/components/button-bar/button-bar.mdx
@@ -4,7 +4,6 @@ import * as ButtonBarStories from "./button-bar.stories";
 
 <Meta
   title="Button Bar"
-  parameters={{ info: { disable: true }, chromatic: { disableSnapshot: true } }}
   of={ButtonBarStories}
 />
 

diff --git a/src/components/button-bar/button-bar.stories.tsx b/src/components/button-bar/button-bar.stories.tsx
@@ -22,6 +22,7 @@ const meta: Meta<typeof ButtonBar> = {
   argTypes: {
     ...styledSystemProps,
   },
+  parameters: { chromatic: { disableSnapshot: true } },
 };
 
 export default meta;

diff --git a/src/components/button-minor/button-minor.mdx b/src/components/button-minor/button-minor.mdx
@@ -4,7 +4,6 @@ import * as ButtonMinorStories from "./button-minor.stories";
 
 <Meta
   title="Button Minor"
-  parameters={{ info: { disable: true } }}
   of={ButtonMinorStories}
 />
 

diff --git a/src/components/button-toggle/button-toggle.mdx b/src/components/button-toggle/button-toggle.mdx
@@ -5,11 +5,7 @@ import * as ButtonToggleGroupStories from "./button-toggle-group/button-toggle-g
 
 <Meta
   title="Button Toggle"
-  parameters={{
-    info: { disable: true },
-    themeProvider: { chromatic: { theme: "sage" } },
-  }}
-  of={ButtonToggleStories}
+    of={ButtonToggleStories}
 />
 
 # Button Toggle

diff --git a/src/components/button-toggle/button-toggle.stories.tsx b/src/components/button-toggle/button-toggle.stories.tsx
@@ -7,6 +7,7 @@ import Box from "../box";
 const meta: Meta<typeof ButtonToggle> = {
   title: "Button Toggle",
   component: ButtonToggle,
+  parameters: { themeProvider: { chromatic: { theme: "sage" } } },
 };
 
 export default meta;

diff --git a/src/components/button/button.mdx b/src/components/button/button.mdx
@@ -4,7 +4,6 @@ import * as ButtonStories from "./button.stories";
 
 <Meta
   title="Button"
-  parameters={{ info: { disable: true }, chromatic: { disableSnapshot: true } }}
   of={ButtonStories}
 />
 

diff --git a/src/components/button/button.stories.tsx b/src/components/button/button.stories.tsx
@@ -17,6 +17,7 @@ const meta: Meta<typeof Button> = {
   argTypes: {
     ...styledSystemProps,
   },
+  parameters: { chromatic: { disableSnapshot: true } },
 };
 
 export default meta;

diff --git a/src/components/carbon-provider/carbon-provider.mdx b/src/components/carbon-provider/carbon-provider.mdx
@@ -4,7 +4,6 @@ import * as CarbonProviderStories from "./carbon-provider.stories";
 
 <Meta
   title="Carbon Provider"
-  parameters={{ info: { disable: true }, chromatic: { disableSnapshot: true } }}
   of={CarbonProviderStories}
 />
 

diff --git a/src/components/carbon-provider/carbon-provider.stories.tsx b/src/components/carbon-provider/carbon-provider.stories.tsx
@@ -8,6 +8,7 @@ import { sageTheme, mintTheme } from "../../style/themes";
 const meta: Meta<typeof CarbonProvider> = {
   title: "Carbon Provider",
   component: CarbonProvider,
+  parameters: { chromatic: { disableSnapshot: true } },
 };
 
 export default meta;

diff --git a/src/components/card/card.mdx b/src/components/card/card.mdx
@@ -7,7 +7,6 @@ import * as CardRowStories from "./card-row/card-row.stories";
 
 <Meta
   title="Card"
-  parameters={{ info: { disable: true }, controls: { disable: true } }}
   of={CardStories}
 />
 

diff --git a/src/components/card/card.stories.tsx b/src/components/card/card.stories.tsx
@@ -25,6 +25,7 @@ const meta: Meta<typeof Card> = {
   argTypes: {
     ...styledSystemProps,
   },
+  parameters: { controls: { disable: true } },
 };
 
 export default meta;

diff --git a/src/components/carousel/carousel.mdx b/src/components/carousel/carousel.mdx
@@ -7,7 +7,6 @@ import * as CarouselStories from "./carousel.stories";
 
 <Meta
   title="Carousel"
-  parameters={{ info: { disable: true } }}
   of={CarouselStories}
 />
 

diff --git a/src/components/checkbox/checkbox.mdx b/src/components/checkbox/checkbox.mdx
@@ -6,7 +6,6 @@ import * as ValidationStories from "./validations.stories";
 
 <Meta
   title="Checkbox"
-  parameters={{ info: { disable: true } }}
   of={CheckboxStories}
 />
 

diff --git a/src/components/confirm/confirm.mdx b/src/components/confirm/confirm.mdx
@@ -4,11 +4,7 @@ import * as ConfirmStories from "./confirm.stories";
 
 <Meta
   title="Confirm"
-  parameters={{
-    info: { disable: true },
-    themeProvider: { chromatic: { theme: "sage" } },
-  }}
-  of={ConfirmStories}
+    of={ConfirmStories}
 />
 
 # Confirm

diff --git a/src/components/confirm/confirm.stories.tsx b/src/components/confirm/confirm.stories.tsx
@@ -8,6 +8,7 @@ import isChromatic from "../../../.storybook/isChromatic";
 const meta: Meta<typeof Confirm> = {
   title: "Confirm",
   component: Confirm,
+  parameters: { themeProvider: { chromatic: { theme: "sage" } } },
 };
 
 export default meta;

diff --git a/src/components/content/content-test.stories.mdx b/src/components/content/content-test.stories.mdx
diff --git a/src/components/content/content.mdx b/src/components/content/content.mdx
@@ -4,7 +4,6 @@ import * as ContentStories from "./content.stories.tsx";
 
 <Meta
   title="Content"
-  parameters={{ info: { disable: true }, controls: { disabled: true } }}
   of={ContentStories}
 />
 

diff --git a/src/components/content/content.stories.tsx b/src/components/content/content.stories.tsx
@@ -20,6 +20,7 @@ const meta: Meta<typeof Content> = {
   argTypes: {
     ...styledSystemProps,
   },
+  parameters: { controls: { disabled: true } },
 };
 
 export default meta;

diff --git a/src/components/date-range/date-range.mdx b/src/components/date-range/date-range.mdx
@@ -5,7 +5,6 @@ import * as DateRangeStories from "./date-range.stories";
 
 <Meta
   title="Date Range"
-  parameters={{ info: { disable: true } }}
   of={DateRangeStories}
 />
-Original file line number
+Diff line change
@@ Expand Up @@
     <Meta
       title="Accordion"
-      parameters={{ info: { disable: true } }}
       of={AccordionStories}
     />
@@ Expand Down @@