From 32f873d663831ad37fdd177873c4882b64e20c2b Mon Sep 17 00:00:00 2001
From: Armagan Ersoz <broccolinisoup@github.com>
Date: Wed, 22 Mar 2023 16:33:53 +1000
Subject: [PATCH 1/2] do not render the activeclassname when there is no prop
 'to'

---
 src/Breadcrumbs/Breadcrumbs.tsx | 2 +-
 src/SubNav.tsx                  | 2 +-
 src/TabNav/TabNav.tsx           | 2 +-
 src/UnderlineNav.tsx            | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/Breadcrumbs/Breadcrumbs.tsx b/src/Breadcrumbs/Breadcrumbs.tsx
index 7f20c870cba..f479d7c04ec 100644
--- a/src/Breadcrumbs/Breadcrumbs.tsx
+++ b/src/Breadcrumbs/Breadcrumbs.tsx
@@ -59,7 +59,7 @@ type StyledBreadcrumbsItemProps = {
 } & SxProp
 
 const BreadcrumbsItem = styled.a.attrs<StyledBreadcrumbsItemProps>(props => ({
-  activeClassName: typeof props.to === 'string' ? 'selected' : '',
+  activeClassName: typeof props.to === 'string' ? 'selected' : undefined,
   className: classnames(props.selected && SELECTED_CLASS, props.className),
   'aria-current': props.selected ? 'page' : null,
 }))<StyledBreadcrumbsItemProps>`
diff --git a/src/SubNav.tsx b/src/SubNav.tsx
index 7c38bbc2c53..a8e35279ee7 100644
--- a/src/SubNav.tsx
+++ b/src/SubNav.tsx
@@ -63,7 +63,7 @@ type StyledSubNavLinkProps = {
 } & SxProp
 
 const SubNavLink = styled.a.attrs<StyledSubNavLinkProps>(props => ({
-  activeClassName: typeof props.to === 'string' ? 'selected' : '',
+  activeClassName: typeof props.to === 'string' ? 'selected' : undefined,
   className: classnames(ITEM_CLASS, props.selected && SELECTED_CLASS, props.className),
 }))<StyledSubNavLinkProps>`
   padding-left: ${get('space.3')};
diff --git a/src/TabNav/TabNav.tsx b/src/TabNav/TabNav.tsx
index b0fa7373da1..e3d46809af4 100644
--- a/src/TabNav/TabNav.tsx
+++ b/src/TabNav/TabNav.tsx
@@ -81,7 +81,7 @@ export type TabNavLinkProps = React.DetailedHTMLProps<React.HTMLAttributes<HTMLA
 } & SxProp
 
 const TabNavLink = styled.a.attrs<TabNavLinkProps>(props => ({
-  activeClassName: typeof props.to === 'string' ? 'selected' : '',
+  activeClassName: typeof props.to === 'string' ? 'selected' : undefined,
   className: classnames(ITEM_CLASS, props.selected && SELECTED_CLASS, props.className),
   role: 'tab',
   'aria-selected': !!props.selected,
diff --git a/src/UnderlineNav.tsx b/src/UnderlineNav.tsx
index a4c43803c1c..56721e3f93e 100644
--- a/src/UnderlineNav.tsx
+++ b/src/UnderlineNav.tsx
@@ -70,7 +70,7 @@ type StyledUnderlineNavLinkProps = {
 } & SxProp
 
 const UnderlineNavLink = styled.a.attrs<StyledUnderlineNavLinkProps>(props => ({
-  activeClassName: typeof props.to === 'string' ? 'selected' : '',
+  activeClassName: typeof props.to === 'string' ? 'selected' : undefined,
   className: classnames(ITEM_CLASS, props.selected && SELECTED_CLASS, props.className),
 }))<StyledUnderlineNavLinkProps>`
   padding: ${get('space.3')} ${get('space.2')};

From f6b10966e062f13ff5f862a5536df690bb873cb2 Mon Sep 17 00:00:00 2001
From: Armagan Ersoz <broccolinisoup@github.com>
Date: Wed, 22 Mar 2023 16:57:50 +1000
Subject: [PATCH 2/2] add changeset

---
 .changeset/stupid-bats-end.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/stupid-bats-end.md

diff --git a/.changeset/stupid-bats-end.md b/.changeset/stupid-bats-end.md
new file mode 100644
index 00000000000..0ecab62f117
--- /dev/null
+++ b/.changeset/stupid-bats-end.md
@@ -0,0 +1,5 @@
+---
+'@primer/react': patch
+---
+
+Stop rendering `activeClassName` when there is no `to` prop is passed for react-router (TabNav, SubNav, BreadCrumb, UnderlineNav v1)