From 8e2c82d17e5ea512698baadb4a0b3c7f93e4acca Mon Sep 17 00:00:00 2001
From: Stephanie Hong <41085564+JelloBagel@users.noreply.github.com>
Date: Tue, 21 May 2024 21:34:14 +0000
Subject: [PATCH 1/3] Add custom aria label to TreeView.Item

---
 packages/react/src/TreeView/TreeView.test.tsx | 24 +++++++++++++++++++
 packages/react/src/TreeView/TreeView.tsx      |  7 +++++-
 2 files changed, 30 insertions(+), 1 deletion(-)

diff --git a/packages/react/src/TreeView/TreeView.test.tsx b/packages/react/src/TreeView/TreeView.test.tsx
index ff48cbde3b6..3dc535270fa 100644
--- a/packages/react/src/TreeView/TreeView.test.tsx
+++ b/packages/react/src/TreeView/TreeView.test.tsx
@@ -47,6 +47,30 @@ describe('Markup', () => {
     expect(items).toHaveLength(3)
   })
 
+  it('uses treeitem aria label', () => {
+    const {queryAllByRole} = renderWithTheme(
+      <>
+        <TreeView>
+          <TreeView.Item id="item-1" aria-label="Test tree item 1">
+            Item 1
+          </TreeView.Item>
+          <TreeView.Item id="item-2" aria-labelledby="test-description">
+            Item 2
+          </TreeView.Item>
+          <TreeView.Item id="item-2">Item 3</TreeView.Item>
+        </TreeView>
+        <span id="test-description">Tree item 2 description</span>
+      </>,
+    )
+
+    const items = queryAllByRole('treeitem')
+    expect(items).toHaveLength(3)
+    expect(items[0]).toHaveAccessibleName('Test tree item 1')
+    expect(items[1]).toHaveAccessibleName('Tree item 2 description')
+    expect(items[2]).toHaveAttribute('aria-labelledby')
+    expect(items[2]).toHaveAccessibleName('Item 3')
+  })
+
   it('hides subtrees by default', () => {
     const {queryByRole} = renderWithTheme(
       <TreeView aria-label="Test tree">
diff --git a/packages/react/src/TreeView/TreeView.tsx b/packages/react/src/TreeView/TreeView.tsx
index 06aa13321c6..51d970d444a 100644
--- a/packages/react/src/TreeView/TreeView.tsx
+++ b/packages/react/src/TreeView/TreeView.tsx
@@ -352,6 +352,8 @@ Root.displayName = 'TreeView'
 // TreeView.Item
 
 export type TreeViewItemProps = {
+  'aria-label'?: React.AriaAttributes['aria-label']
+  'aria-labelledby'?: React.AriaAttributes['aria-labelledby']
   id: string
   children: React.ReactNode
   containIntrinsicSize?: string
@@ -375,6 +377,8 @@ const Item = React.forwardRef<HTMLElement, TreeViewItemProps>(
       onSelect,
       children,
       className,
+      'aria-label': ariaLabel,
+      'aria-labelledby': ariaLabelledby,
     },
     ref,
   ) => {
@@ -472,7 +476,8 @@ const Item = React.forwardRef<HTMLElement, TreeViewItemProps>(
           tabIndex={0}
           id={itemId}
           role="treeitem"
-          aria-labelledby={labelId}
+          aria-label={ariaLabel}
+          aria-labelledby={ariaLabel ? undefined : ariaLabelledby || labelId}
           aria-describedby={`${leadingVisualId} ${trailingVisualId}`}
           aria-level={level}
           aria-expanded={isSubTreeEmpty ? undefined : isExpanded}

From a4371904734ab67bd4c6cdafc5627ba376a7076a Mon Sep 17 00:00:00 2001
From: Stephanie Hong <41085564+JelloBagel@users.noreply.github.com>
Date: Tue, 21 May 2024 21:37:52 +0000
Subject: [PATCH 2/3] Add changelog

---
 .changeset/hungry-rockets-smell.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/hungry-rockets-smell.md

diff --git a/.changeset/hungry-rockets-smell.md b/.changeset/hungry-rockets-smell.md
new file mode 100644
index 00000000000..41b33cebe40
--- /dev/null
+++ b/.changeset/hungry-rockets-smell.md
@@ -0,0 +1,5 @@
+---
+'@primer/react': minor
+---
+
+Add custom aria label to TreeView.Item

From 32dc53f9681e01cc86ef44b2562f4ee2540dce73 Mon Sep 17 00:00:00 2001
From: Stephanie Hong <41085564+JelloBagel@users.noreply.github.com>
Date: Tue, 28 May 2024 08:44:57 -0700
Subject: [PATCH 3/3] Update hungry-rockets-smell.md

---
 .changeset/hungry-rockets-smell.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.changeset/hungry-rockets-smell.md b/.changeset/hungry-rockets-smell.md
index 41b33cebe40..ff29319f0a6 100644
--- a/.changeset/hungry-rockets-smell.md
+++ b/.changeset/hungry-rockets-smell.md
@@ -2,4 +2,4 @@
 '@primer/react': minor
 ---
 
-Add custom aria label to TreeView.Item
+Add an ability to provide custom `aria-label` and `aria-labelledby` to `TreeView.Item`