From d4e234f52bf63e632d41fe947801d2c16da0b61f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Arma=C4=9Fan?= <broccolinisoup@github.com>
Date: Thu, 16 May 2024 13:50:31 +1000
Subject: [PATCH] Update NavList to use the new GroupHeading API and add an
 `as` prop to specify the heading level (h3 to match with the default) (#4593)

* Add the default heading level with the as prop for NAvlist.Group

* Create calm-insects-boil.md

* update the comment
---
 .changeset/calm-insects-boil.md        | 5 +++++
 packages/react/src/NavList/NavList.tsx | 4 +++-
 2 files changed, 8 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/calm-insects-boil.md

diff --git a/.changeset/calm-insects-boil.md b/.changeset/calm-insects-boil.md
new file mode 100644
index 00000000000..1aba232fec9
--- /dev/null
+++ b/.changeset/calm-insects-boil.md
@@ -0,0 +1,5 @@
+---
+"@primer/react": patch
+---
+
+Update NavList to use the new ActionList.GroupHeading API and Add an "as" prop to specify the heading level as default h3. (No changes expected in the rendered HTML)
diff --git a/packages/react/src/NavList/NavList.tsx b/packages/react/src/NavList/NavList.tsx
index 3d75cb700c6..2da5b8bcef2 100644
--- a/packages/react/src/NavList/NavList.tsx
+++ b/packages/react/src/NavList/NavList.tsx
@@ -259,7 +259,9 @@ const Group: React.FC<NavListGroupProps> = ({title, children, sx: sxProp = defau
     <>
       {/* Hide divider if the group is the first item in the list */}
       <ActionList.Divider sx={{'&:first-child': {display: 'none'}}} />
-      <ActionList.Group {...props} title={title} sx={sxProp}>
+      <ActionList.Group {...props} sx={sxProp}>
+        {/* Setting up the default value for the heading level. TODO: API update to give flexibility to NavList.Group title's heading level */}
+        <ActionList.GroupHeading as="h3">{title}</ActionList.GroupHeading>
         {children}
       </ActionList.Group>
     </>