docs(divider): remove MDX file to utilize auto-docs

Author: marissahuysentruyt

components/divider/stories/divider.mdx

@@ -47,6 +47,9 @@ export default {
 	},
 };
 
+/**
+ * The default size for divider is medium.
+ */
 export const Default = Template.bind({});
 Default.args = {};
 
@@ -78,6 +81,7 @@ const AllDividerSizes = (args) => html`
 
 /*
  * Stories for the MDX "Docs" only.
+ * "storyName" refers to the display name/heading for a component
  */
 export const Large = Template.bind({});
 Large.tags = ["docs-only"];
@@ -97,25 +101,11 @@ Small.parameters = {
 	chromatic: { disableSnapshot: true },
 };
 
-export const StaticWhite = Template.bind({});
-StaticWhite.tags = ["docs-only"];
-StaticWhite.args = {
-	staticColor: "white",
-};
-StaticWhite.parameters = {
-	chromatic: { disableSnapshot: true },
-};
-
-export const StaticBlack = Template.bind({});
-StaticBlack.tags = ["docs-only"];
-StaticBlack.args = {
-	staticColor: "black",
-};
-StaticBlack.parameters = {
-	chromatic: { disableSnapshot: true },
-};
-
+/**
+ * When a vertical divider is used inside of a flex container, use `align-self: stretch; height: auto;` on the divider.
+ */
 export const VerticalGroup = AllDividerSizes.bind({});
+VerticalGroup.storyName = "Vertical";
 VerticalGroup.tags = ["docs-only"];
 VerticalGroup.args = {
 	vertical: true,
@@ -125,6 +115,7 @@ VerticalGroup.parameters = {
 };
 
 export const StaticWhiteGroup = AllDividerSizes.bind({});
+StaticWhiteGroup.storyName = "Static white";
 StaticWhiteGroup.tags = ["docs-only"];
 StaticWhiteGroup.args = {
 	staticColor: "white",
@@ -134,6 +125,7 @@ StaticWhiteGroup.parameters = {
 };
 
 export const StaticBlackGroup = AllDividerSizes.bind({});
+StaticBlackGroup.storyName = "Static black";
 StaticBlackGroup.tags = ["docs-only"];
 StaticBlackGroup.args = {
 	staticColor: "black",