Remove variant/destructive

cultureamp · Jul 18, 2024 · 8626b91 · 8626b91
1 parent 68f941e
commit 8626b91
Show file tree

Hide file tree

Showing 6 changed files with 9 additions and 46 deletions.
diff --git a/packages/components/src/__actions__/Menu/v3/MenuItem.module.scss b/packages/components/src/__actions__/Menu/v3/MenuItem.module.scss
@@ -31,11 +31,3 @@
 .item[data-disabled] {
   opacity: 0.3;
 }
-
-.item.destructive {
-  color: var(--color-red-600);
-}
-
-.item.destructive[data-focused] {
-  background-color: var(--color-red-100);
-}
diff --git a/packages/components/src/__actions__/Menu/v3/MenuItem.tsx b/packages/components/src/__actions__/Menu/v3/MenuItem.tsx
@@ -11,24 +11,16 @@ export type MenuItemProps = RACMenuItemProps & {
    * Provides positioning for an icon to the left of the menu item content
    */
   icon?: ReactNode
-  /**
-   * Adjusts the styling to distinguish the action in some way
-   */
-  variant?: "default" | "destructive"
 }
 
 /**
  * A MenuItem represents an individual action in a Menu.
  */
 export const MenuItem = forwardRef<HTMLDivElement, MenuItemProps>(
-  ({ className, icon, children, variant, ...props }, ref): JSX.Element => (
+  ({ className, icon, children, ...props }, ref): JSX.Element => (
     <RACMenuItem
       ref={ref}
-      className={mergeClassNames(
-        styles.item,
-        variant === "destructive" && styles.destructive,
-        className
-      )}
+      className={mergeClassNames(styles.item, className)}
       {...props}
     >
       <>

diff --git a/packages/components/src/__actions__/Menu/v3/_docs/Menu.docs.stories.tsx b/packages/components/src/__actions__/Menu/v3/_docs/Menu.docs.stories.tsx
@@ -34,9 +34,7 @@ const DefaultMenuItems = (): ReactNode => (
     <MenuItem icon={<EditIcon role="presentation" />}>Edit</MenuItem>
     <MenuItem icon={<ArrowUpIcon role="presentation" />}>Move Up</MenuItem>
     <MenuItem icon={<ArrowDownIcon role="presentation" />}>Move Down</MenuItem>
-    <MenuItem icon={<TrashIcon role="presentation" />} variant="destructive">
-      Delete
-    </MenuItem>
+    <MenuItem icon={<TrashIcon role="presentation" />}>Delete</MenuItem>
   </>
 )
 
@@ -84,12 +82,7 @@ export const ItemsDont: Story = {
       </RACButton>
       <Popover>
         <Menu>
-          <MenuItem
-            icon={<TrashIcon role="presentation" />}
-            variant="destructive"
-          >
-            Delete
-          </MenuItem>
+          <MenuItem icon={<TrashIcon role="presentation" />}>Delete</MenuItem>
         </Menu>
       </Popover>
     </MenuTrigger>
@@ -217,7 +210,7 @@ export const MenuItemLabelsDont: Story = {
         <Menu {...args}>
           <MenuItem>Save comment</MenuItem>
           <MenuItem>Edit comment</MenuItem>
-          <MenuItem variant="destructive">Delete comment</MenuItem>
+          <MenuItem>Delete comment</MenuItem>
         </Menu>
       </Popover>
     </MenuTrigger>

diff --git a/packages/components/src/__actions__/Menu/v3/_docs/Menu.mdx b/packages/components/src/__actions__/Menu/v3/_docs/Menu.mdx
@@ -40,7 +40,7 @@ import * as MenuStories from "./Menu.stories"
     <Menu>
       <MenuItem>Save</MenuItem>
       <MenuItem>Edit</MenuItem>
-      <MenuItem variant="destructive">Delete</MenuItem>
+      <MenuItem>Delete</MenuItem>
     </Menu>
   </Popover>
 </TooltipTrigger>

diff --git a/packages/components/src/__actions__/Menu/v3/_docs/Menu.spec.stories.tsx b/packages/components/src/__actions__/Menu/v3/_docs/Menu.spec.stories.tsx
@@ -74,17 +74,8 @@ export const KitchenSink: Story = {
             </MenuItem>
           </Section>
           <Section>
-            <MenuItem
-              icon={<TrashIcon role="presentation" />}
-              variant="destructive"
-            >
-              Delete
-            </MenuItem>
-            <MenuItem
-              icon={<TrashIcon role="presentation" />}
-              variant="destructive"
-              isDisabled
-            >
+            <MenuItem icon={<TrashIcon role="presentation" />}>Delete</MenuItem>
+            <MenuItem icon={<TrashIcon role="presentation" />} isDisabled>
               Delete but disabled
             </MenuItem>
             <MenuItem>Other action</MenuItem>

diff --git a/packages/components/src/__actions__/Menu/v3/_docs/Menu.stories.tsx b/packages/components/src/__actions__/Menu/v3/_docs/Menu.stories.tsx
@@ -46,12 +46,7 @@ export const Playground: Story = {
           <MenuItem icon={<ArrowDownIcon role="presentation" />}>
             Move Down
           </MenuItem>
-          <MenuItem
-            icon={<TrashIcon role="presentation" />}
-            variant="destructive"
-          >
-            Delete
-          </MenuItem>
+          <MenuItem icon={<TrashIcon role="presentation" />}>Delete</MenuItem>
         </Menu>
       </Popover>
     </MenuTrigger>