From c2daca399164db79675a574578966a04120e1e55 Mon Sep 17 00:00:00 2001 From: Jon Rohan Date: Thu, 22 Jan 2026 22:43:47 +0000 Subject: [PATCH 1/5] feat(ActionList): update loading styles for specific child elements --- packages/react/src/ActionList/ActionList.module.css | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/packages/react/src/ActionList/ActionList.module.css b/packages/react/src/ActionList/ActionList.module.css index 9cc0d09eef7..e40c2ee1d2c 100644 --- a/packages/react/src/ActionList/ActionList.module.css +++ b/packages/react/src/ActionList/ActionList.module.css @@ -278,7 +278,11 @@ &:where([data-loading='true']), &:has([data-loading='true']) { - & * { + & .ItemLabel, + & .Description, + & .LeadingVisual, + & .TrailingVisual, + & .VisualWrap { color: var(--fgColor-muted); } } From d3319db70eb0f5212a8609e6c27e42bb355f8aaa Mon Sep 17 00:00:00 2001 From: Jon Rohan Date: Fri, 23 Jan 2026 18:18:03 +0000 Subject: [PATCH 2/5] Scan only the trailingaction for data-loading --- packages/react/src/ActionList/ActionList.module.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/ActionList/ActionList.module.css b/packages/react/src/ActionList/ActionList.module.css index e40c2ee1d2c..58c54bde158 100644 --- a/packages/react/src/ActionList/ActionList.module.css +++ b/packages/react/src/ActionList/ActionList.module.css @@ -277,7 +277,7 @@ } &:where([data-loading='true']), - &:has([data-loading='true']) { + &:has(.TrailingAction [data-loading='true']) { & .ItemLabel, & .Description, & .LeadingVisual, From 0c7be886df977157a6fc281aa8cdcf1262e098cd Mon Sep 17 00:00:00 2001 From: Jon Rohan Date: Fri, 23 Jan 2026 19:08:36 +0000 Subject: [PATCH 3/5] Update to direct descendent selector --- packages/react/src/ActionList/ActionList.module.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/react/src/ActionList/ActionList.module.css b/packages/react/src/ActionList/ActionList.module.css index 1d184888279..b73d34512be 100644 --- a/packages/react/src/ActionList/ActionList.module.css +++ b/packages/react/src/ActionList/ActionList.module.css @@ -277,7 +277,7 @@ } &:where([data-loading='true']), - &:has(.TrailingAction [data-loading='true']) { + & > [data-loading='true'] { & .ItemLabel, & .Description, & .LeadingVisual, From 8dcc929a932deadb7dbeb76a73665c356f566ad1 Mon Sep 17 00:00:00 2001 From: Jon Rohan Date: Fri, 23 Jan 2026 13:02:02 -0800 Subject: [PATCH 4/5] Optimize CSS selectors in ActionList Optimizes CSS selector performance in ActionList by replacing expensive universal selectors (`*`) and broad `:has()` queries with targeted class selectors. --- .changeset/orange-walls-buy.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/orange-walls-buy.md diff --git a/.changeset/orange-walls-buy.md b/.changeset/orange-walls-buy.md new file mode 100644 index 00000000000..29c42bf332c --- /dev/null +++ b/.changeset/orange-walls-buy.md @@ -0,0 +1,5 @@ +--- +"@primer/react": patch +--- + +feat(ActionList): Optimizes CSS selector performance in ActionList by replacing expensive universal selectors (`*`) and broad `:has()` queries with targeted class selectors. From 79b2187f9bd8b53911b662d91ee5365a74970fe1 Mon Sep 17 00:00:00 2001 From: Jon Rohan Date: Fri, 23 Jan 2026 14:17:17 -0800 Subject: [PATCH 5/5] Update packages/react/src/ActionList/ActionList.module.css Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> --- packages/react/src/ActionList/ActionList.module.css | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/react/src/ActionList/ActionList.module.css b/packages/react/src/ActionList/ActionList.module.css index b73d34512be..1e24e4d07cf 100644 --- a/packages/react/src/ActionList/ActionList.module.css +++ b/packages/react/src/ActionList/ActionList.module.css @@ -282,6 +282,7 @@ & .Description, & .LeadingVisual, & .TrailingVisual, + & .LeadingAction, & .VisualWrap { color: var(--fgColor-muted); }