Merge 88ede85 into d44a4cf

primer · Dec 11, 2024 · 4467279 · 4467279
2 parents d44a4cf + 88ede85
commit 4467279
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 3 deletions.
diff --git a/.changeset/eight-bears-worry.md b/.changeset/eight-bears-worry.md
@@ -0,0 +1,5 @@
+---
+"@primer/react": patch
+---
+
+ActionList color bug fixes
diff --git a/packages/react/src/ActionList/Item.tsx b/packages/react/src/ActionList/Item.tsx
@@ -155,7 +155,7 @@ export const Item = React.forwardRef<HTMLLIElement, ActionListItemProps>(
         '&:focus-visible, > a.focus-visible, &:focus.focus-visible': {
           outline: 'none',
           border: `2 solid`,
-          boxShadow: `0 0 0 2px ${theme?.colors.accent.emphasis}`,
+          boxShadow: `0 0 0 2px var(--focus-outlineColor)`,
         },
         '&:active:not([aria-disabled]):not([data-inactive])': {
           backgroundColor: `actionListItem.${variant}.activeBg`,

diff --git a/packages/react/src/ActionList/Selection.tsx b/packages/react/src/ActionList/Selection.tsx
@@ -66,7 +66,7 @@ export const Selection: React.FC<React.PropsWithChildren<SelectionProps>> = ({se
     <LeadingVisualContainer data-component="ActionList.Selection" sx={{minWidth: '16px'}}>
       <Box
         sx={{
-          borderColor: selected ? 'accent.fg' : 'neutral.emphasis',
+          borderColor: selected ? 'var(--control-checked-borderColor-rest)' : 'var(--control-borderColor-rest)',
           borderStyle: 'solid',
           borderWidth: '1',
           borderRadius: '1',
@@ -76,7 +76,7 @@ export const Selection: React.FC<React.PropsWithChildren<SelectionProps>> = ({se
           margin: '0',
           placeContent: 'center',
           width: 'var(--base-size-16, 16px)',
-          backgroundColor: selected ? 'accent.fg' : 'canvas.default',
+          backgroundColor: selected ? 'var(--control-checked-bgColor-rest)' : 'canvas.default',
           transition: selected
             ? 'background-color, border-color 80ms cubic-bezier(0.33, 1, 0.68, 1)'
             : 'background-color, border-color 80ms cubic-bezier(0.32, 0, 0.67, 0) 0ms',