feat!: remove unstable variants (#41)

mitodl · Jan 22, 2025 · de3184d · de3184d
1 parent 3d4809c
commit de3184d
Show file tree

Hide file tree

Showing 3 changed files with 1 addition and 49 deletions.
diff --git a/src/components/Button/ActionButton.stories.tsx b/src/components/Button/ActionButton.stories.tsx
@@ -26,9 +26,6 @@ const VARIANTS = enumValues<ActionButtonProps["variant"]>({
   tertiary: true,
   bordered: true,
   text: true,
-  unstable_noBorder: true,
-  unstable_inverted: true,
-  unstable_success: true,
 })
 const STABLE_VARIANTS = VARIANTS.filter((v) => !v.startsWith("unstable"))
 const SIZES = enumValues<ActionButtonProps["size"]>({

diff --git a/src/components/Button/Button.stories.tsx b/src/components/Button/Button.stories.tsx
@@ -27,9 +27,6 @@ const VARIANTS = enumValues<ButtonProps["variant"]>({
   tertiary: true,
   bordered: true,
   text: true,
-  unstable_noBorder: true,
-  unstable_inverted: true,
-  unstable_success: true,
 })
 const STABLE_VARIANTS = VARIANTS.filter((v) => !v.startsWith("unstable"))
 const SIZES = enumValues<ButtonProps["size"]>({

diff --git a/src/components/Button/Button.tsx b/src/components/Button/Button.tsx
@@ -8,15 +8,7 @@ import {
   LinkAdapterPropsOverrides,
 } from "../LinkAdapter/LinkAdapter"
 
-type ButtonVariant =
-  | "primary"
-  | "secondary"
-  | "tertiary"
-  | "text"
-  | "bordered"
-  | "unstable_noBorder"
-  | "unstable_inverted"
-  | "unstable_success"
+type ButtonVariant = "primary" | "secondary" | "tertiary" | "text" | "bordered"
 type ButtonSize = "small" | "medium" | "large"
 type ButtonEdge = "circular" | "rounded" | "none"
 
@@ -152,22 +144,6 @@ const buttonStyles = (props: ButtonStyleProps & { theme: Theme }) => {
         boxShadow: "none",
       },
     },
-    variant === "unstable_success" && {
-      backgroundColor: colors.darkGreen,
-      color: colors.white,
-      border: "none",
-      /* Shadow/04dp */
-      boxShadow:
-        "0px 2px 4px 0px rgba(37, 38, 43, 0.10), 0px 3px 8px 0px rgba(37, 38, 43, 0.12)",
-      ":hover:not(:disabled)": {
-        backgroundColor: colors.darkGreen,
-        boxShadow: "none",
-      },
-      ":disabled": {
-        backgroundColor: colors.silverGray,
-        boxShadow: "none",
-      },
-    },
     variant === "secondary" && {
       color: colors.red,
       backgroundColor: "transparent",
@@ -207,18 +183,6 @@ const buttonStyles = (props: ButtonStyleProps & { theme: Theme }) => {
         color: colors.silverGrayDark,
       },
     },
-    variant === "unstable_noBorder" && {
-      backgroundColor: colors.white,
-      color: colors.darkGray2,
-      border: "none",
-      ":hover:not(:disabled)": {
-        // darkGray1 at 6% alpha
-        backgroundColor: "rgba(64, 70, 76, 0.06)",
-      },
-      ":disabled": {
-        color: colors.silverGray,
-      },
-    },
     variant === "tertiary" && {
       color: colors.darkGray2,
       border: "none",
@@ -231,12 +195,6 @@ const buttonStyles = (props: ButtonStyleProps & { theme: Theme }) => {
         color: colors.silverGrayLight,
       },
     },
-    variant === "unstable_inverted" && {
-      backgroundColor: colors.white,
-      color: colors.mitRed,
-      borderColor: colors.mitRed,
-      borderStyle: "solid",
-    },
     // edge
     edge === "rounded" && {
       borderRadius: "4px",