From 7a95a9a2599098a693c09bc50e2a60afcf97c99d Mon Sep 17 00:00:00 2001
From: Josh Black <joshblack@github.com>
Date: Tue, 1 Jul 2025 16:01:23 -0500
Subject: [PATCH 1/3] fix(NavList): merge sx and non-sx scenarios

---
 packages/react/src/NavList/NavList.tsx | 16 ++++------------
 1 file changed, 4 insertions(+), 12 deletions(-)

diff --git a/packages/react/src/NavList/NavList.tsx b/packages/react/src/NavList/NavList.tsx
index 360558fded8..ea838029dbf 100644
--- a/packages/react/src/NavList/NavList.tsx
+++ b/packages/react/src/NavList/NavList.tsx
@@ -285,20 +285,11 @@ export type NavListGroupProps = React.HTMLAttributes<HTMLLIElement> & {
   title?: string
 } & SxProp
 
-const defaultSx = {}
-const Group: React.FC<NavListGroupProps> = ({title, children, sx: sxProp = defaultSx, ...props}) => {
-  if (sxProp !== defaultSx) {
-    return (
-      <Box sx={sxProp} as="li" data-component="ActionList.Group">
-        {title ? <ActionList.GroupHeading>{title}</ActionList.GroupHeading> : null}
-        {children}
-      </Box>
-    )
-  }
+function Group({title, children, sx, ...rest}: NavListGroupProps) {
   return (
     <>
       <ActionList.Divider />
-      <ActionList.Group {...props}>
+      <BoxWithFallback as={ActionList.Group} {...rest} sx={sx}>
         {/* Setting up the default value for the heading level. TODO: API update to give flexibility to NavList.Group title's heading level */}
         {title ? (
           <ActionList.GroupHeading as="h3" data-component="ActionList.GroupHeading">
@@ -306,10 +297,11 @@ const Group: React.FC<NavListGroupProps> = ({title, children, sx: sxProp = defau
           </ActionList.GroupHeading>
         ) : null}
         {children}
-      </ActionList.Group>
+      </BoxWithFallback>
     </>
   )
 }
+
 // ----------------------------------------------------------------------------
 // NavList.GroupExpand
 

From dabf609ca73c40880892b63f751be91b7f7d24d8 Mon Sep 17 00:00:00 2001
From: Josh Black <joshblack@github.com>
Date: Tue, 1 Jul 2025 16:01:53 -0500
Subject: [PATCH 2/3] chore: add changeset

---
 .changeset/kind-pants-march.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/kind-pants-march.md

diff --git a/.changeset/kind-pants-march.md b/.changeset/kind-pants-march.md
new file mode 100644
index 00000000000..bcfe017c455
--- /dev/null
+++ b/.changeset/kind-pants-march.md
@@ -0,0 +1,5 @@
+---
+'@primer/react': patch
+---
+
+Update NavList.Group to render divider when `sx` is provided

From 864dc688c1ffdb755d4fe04b052f4592b273f9b7 Mon Sep 17 00:00:00 2001
From: Josh Black <joshblack@github.com>
Date: Thu, 3 Jul 2025 11:29:03 -0500
Subject: [PATCH 3/3] chore: remove BoxWithFallack usage

---
 packages/react/src/NavList/NavList.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/react/src/NavList/NavList.tsx b/packages/react/src/NavList/NavList.tsx
index ea838029dbf..25d95737b83 100644
--- a/packages/react/src/NavList/NavList.tsx
+++ b/packages/react/src/NavList/NavList.tsx
@@ -289,7 +289,7 @@ function Group({title, children, sx, ...rest}: NavListGroupProps) {
   return (
     <>
       <ActionList.Divider />
-      <BoxWithFallback as={ActionList.Group} {...rest} sx={sx}>
+      <ActionList.Group {...rest} sx={sx}>
         {/* Setting up the default value for the heading level. TODO: API update to give flexibility to NavList.Group title's heading level */}
         {title ? (
           <ActionList.GroupHeading as="h3" data-component="ActionList.GroupHeading">
@@ -297,7 +297,7 @@ function Group({title, children, sx, ...rest}: NavListGroupProps) {
           </ActionList.GroupHeading>
         ) : null}
         {children}
-      </BoxWithFallback>
+      </ActionList.Group>
     </>
   )
 }