docs: add storybook migrated badge (#3690)

Adds the migrated status to components that have been migrated fully to S2. A migrated badge to the storybook toolbar should now appear for those components.

Author: marissahuysentruyt

.storybook/preview.js

@@ -85,6 +85,11 @@ export const parameters = {
 				color: "#fff",
 				description: "Should not be used and will not receive updates.",
 			},
+			migrated: {
+				background: "rgb(84, 36, 219)",
+				color: "#fff",
+				description: "Migrated to Spectrum 2.",
+			},
 		},
 	},
 	// Set an empty object to avoid the "undefined" value in the ComponentDetails doc block

components/actionbutton/stories/actionbutton.stories.js

@@ -103,7 +103,10 @@ export default {
 			story: {
 				height: "auto",
 			},
-		}
+		},
+		status: {
+			type: "migrated",
+		},
 	},
 	decorators: [
 		withDownStateDimensionCapture,

components/actiongroup/stories/actiongroup.stories.js

@@ -99,6 +99,9 @@ export default {
 		},
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 	},
 	tags: ["migrated"],
 };

components/alertbanner/stories/alertbanner.stories.js

@@ -75,6 +75,9 @@ export default {
 		},
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 	},
 	tags: ["migrated"],
 };

components/avatar/stories/avatar.stories.js

@@ -59,6 +59,9 @@ export default {
 		},
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 	},
 	tags: ["migrated"],
 };

components/breadcrumb/stories/breadcrumb.stories.js

@@ -139,6 +139,9 @@ export default {
 		},
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		}
 	},
 };
 

components/button/stories/button.stories.js

@@ -101,6 +101,9 @@ export default {
 		},
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 	},
 	decorators: [
 		withDownStateDimensionCapture,

components/buttongroup/stories/buttongroup.stories.js

@@ -64,6 +64,9 @@ export default {
 		},
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 	},
 	tags: ["migrated"],
 };

components/checkbox/stories/checkbox.stories.js

@@ -61,6 +61,9 @@ export default {
 		},
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 	},
 };
 

components/closebutton/stories/closebutton.stories.js

@@ -52,6 +52,9 @@ export default {
 		},
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 	},
 	tags: ["migrated"],
 };

components/coachmark/stories/coachmark.stories.js

@@ -5,9 +5,9 @@ import metadata from "../dist/metadata.json";
 import packageJson from "../package.json";
 import { CoachMarkGroup } from "./coachmark.test.js";
 import {
-	Template,
-	CoachmarkMenuStatesTemplate,
 	CoachMarkMediaOptionsTemplate,
+	CoachmarkMenuStatesTemplate,
+	Template,
 } from "./template.js";
 
 /**
@@ -99,6 +99,9 @@ export default {
 				height: "525px",
 			},
 		},
+		status: {
+			type: "migrated",
+		},
 	},
 };
 

components/colorarea/stories/colorarea.stories.js

@@ -49,6 +49,9 @@ export default {
 		},
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 	},
 	tags: ["migrated"],
 };

components/colorhandle/stories/colorhandle.stories.js

@@ -52,6 +52,9 @@ export default {
 		},
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 	},
 };
 

components/colorloupe/stories/colorloupe.stories.js

@@ -45,6 +45,9 @@ export default {
 		},
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 	},
 	tags: ["migrated"],
 };

components/colorslider/stories/colorslider.stories.js

@@ -71,6 +71,9 @@ export default {
 		},
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 	},
 };
 

components/colorwheel/stories/colorwheel.stories.js

@@ -63,6 +63,9 @@ export default {
 		},
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 	},
 };
 

components/dial/stories/dial.stories.js

@@ -35,6 +35,9 @@ export default {
 	parameters: {
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 	},
 	tags: ["migrated"],
 };

components/dialog/stories/dialog.stories.js

@@ -1,8 +1,8 @@
 import { withUnderlayWrapper } from "@spectrum-css/preview/decorators";
 import { disableDefaultModes } from "@spectrum-css/preview/modes";
 import { isOpen, size } from "@spectrum-css/preview/types";
-import { Template as Table } from "@spectrum-css/table/stories/template.js";
 import { Template as Steplist } from "@spectrum-css/steplist/stories/template.js";
+import { Template as Table } from "@spectrum-css/table/stories/template.js";
 import { Template as Typography } from "@spectrum-css/typography/stories/template.js";
 import metadata from "../dist/metadata.json";
 import packageJson from "../package.json";
@@ -163,6 +163,9 @@ export default {
 		packageJson,
 		metadata,
 		layout: "fullscreen",
+		status: {
+			type: "migrated",
+		},
 	},
 	decorators: [
 		withUnderlayWrapper,

components/divider/stories/divider.stories.js

@@ -38,6 +38,9 @@ export default {
 		},
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 	},
 };
 

components/dropzone/stories/dropzone.stories.js

@@ -46,6 +46,9 @@ export default {
 		},
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 	},
 };
 

components/fieldgroup/stories/fieldgroup.stories.js

@@ -96,6 +96,9 @@ export default {
 		},
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 	},
 };
 

components/fieldlabel/stories/fieldlabel.stories.js

@@ -52,6 +52,9 @@ export default {
 		},
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 	},
 	tags: ["migrated"],
 };

components/form/stories/form.stories.js

@@ -107,6 +107,9 @@ export default {
 	parameters: {
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 	},
 	tags: ["migrated"],
 };

components/helptext/stories/helptext.stories.js

@@ -63,6 +63,9 @@ export default {
 		},
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 	},
 };
 

components/icon/stories/icon.stories.js

@@ -98,6 +98,9 @@ export default {
 			type: "figma",
 			url: "https://www.figma.com/design/9qeVZSJ9t0kv6r7njzgHx7/S2-%2F-Styles-visualizer-(WIP)?node-id=295-24257&t=ZC7fyaQ0VQYQ5VYM-1",
 		},
+		status: {
+			type: "migrated",
+		},
 	},
 };
 

components/illustratedmessage/stories/illustratedmessage.stories.js

@@ -75,6 +75,9 @@ export default {
 		},
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 		layout: "centered"
 	},
 };

components/infieldbutton/stories/infieldbutton.stories.js

@@ -59,6 +59,9 @@ export default {
 		},
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 	},
 	decorators: [
 		withDownStateDimensionCapture,

components/infieldprogresscircle/stories/infieldprogresscircle.stories.js

@@ -30,7 +30,10 @@ export default {
 		},
 		packageJson,
 		metadata,
-	}
+		status: {
+			type: "migrated",
+		},
+	},
 };
 
 export const Default = InfieldProgressCircleGroup.bind({});

components/inlinealert/stories/inlinealert.stories.js

@@ -101,6 +101,9 @@ export default {
 		},
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 	},
 };
 

components/link/stories/link.stories.js

@@ -89,7 +89,10 @@ export default {
 		},
 		packageJson,
 		metadata,
-	}
+		status: {
+			type: "migrated",
+		},
+	},
 };
 
 export const Default = LinkGroup.bind({});

components/opacitycheckerboard/stories/opacitycheckerboard.stories.js

@@ -42,6 +42,9 @@ export default {
 	parameters: {
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 	},
 	tags: ["migrated"],
 };

components/pagination/stories/pagination.stories.js

@@ -70,6 +70,9 @@ export default {
 		},
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 	},
 	tags: ["migrated"],
 };

components/picker/stories/picker.stories.js

@@ -145,6 +145,9 @@ export default {
 		downState: {
 			selectors: [".spectrum-Picker:not(:disabled, .is-disabled, .is-loading)"],
 		},
+		status: {
+			type: "migrated",
+		},
 	},
 	decorators: [
 		withDownStateDimensionCapture,

components/popover/stories/popover.stories.js

@@ -98,6 +98,9 @@ export default {
 		},
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 	},
 };
 

components/progressbar/stories/progressbar.stories.js

@@ -98,6 +98,9 @@ export default {
 		},
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 	},
 	tags: ["migrated"],
 };

components/progresscircle/stories/progresscircle.stories.js

@@ -45,6 +45,9 @@ export default {
 		},
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 	},
 };
 

components/radio/stories/radio.stories.js

@@ -66,6 +66,9 @@ export default {
 		},
 		packageJson,
 		metadata,
+		status: {
+			type: "migrated",
+		},
 	},
 };