ActionList: Fix leaky disabled description styles (#4566)

* replace leaky & with data-component

* Create stupid-stingrays-sparkle.md

Author: siddharthkp

.changeset/stupid-stingrays-sparkle.md

@@ -0,0 +1,5 @@
+---
+"@primer/react": patch
+---
+
+ActionList: Fix leaky description styles for disabled item

packages/react/src/ActionList/Description.tsx

@@ -28,23 +28,15 @@ export const Description: React.FC<React.PropsWithChildren<ActionListDescription
     minWidth: 0,
     marginLeft: variant === 'block' ? 0 : 2,
     color: 'fg.muted',
-    'li[aria-disabled="true"] &': {
-      color: 'inherit',
-    },
-    'li[data-variant="danger"]:hover &, li[data-variant="danger"]:active &': {
-      color: 'inherit',
-    },
+    'li[aria-disabled="true"] &[data-component="ActionList.Description"]': {color: 'inherit'},
+    'li[data-variant="danger"]:hover &[data-component="ActionList.Description"], li[data-variant="danger"]:active &[data-component="ActionList.Description"]':
+      {color: 'inherit'},
   }
 
   const {blockDescriptionId, inlineDescriptionId} = React.useContext(ItemContext)
 
   return variant === 'block' ? (
-    <Box
-      as="span"
-      // huh why?
-      sx={merge(styles, sx as SxProp)}
-      id={blockDescriptionId}
-    >
+    <Box as="span" sx={merge(styles, sx as SxProp)} id={blockDescriptionId} data-component="ActionList.Description">
       {props.children}
     </Box>
   ) : (
@@ -54,6 +46,7 @@ export const Description: React.FC<React.PropsWithChildren<ActionListDescription
       title={props.children as string}
       inline={true}
       maxWidth="100%"
+      data-component="ActionList.Description"
     >
       {props.children}
     </Truncate>