From 23ba07d902538714245ff953aff03bb3c1d392a5 Mon Sep 17 00:00:00 2001
From: Josh Black <joshblack@users.noreply.github.com>
Date: Wed, 12 Apr 2023 10:11:59 -0500
Subject: [PATCH 1/4] fix(PageLayout): update Pane to warn instead of error

---
 src/PageLayout/PageLayout.tsx | 17 ++++++++++++-----
 1 file changed, 12 insertions(+), 5 deletions(-)

diff --git a/src/PageLayout/PageLayout.tsx b/src/PageLayout/PageLayout.tsx
index b00ae151710..1f270c582ad 100644
--- a/src/PageLayout/PageLayout.tsx
+++ b/src/PageLayout/PageLayout.tsx
@@ -10,6 +10,7 @@ import {Theme} from '../ThemeProvider'
 import {canUseDOM} from '../utils/environment'
 import {invariant} from '../utils/invariant'
 import {useOverflow} from '../utils/useOverflow'
+import {warning} from '../utils/warning'
 import VisuallyHidden from '../_VisuallyHidden'
 import {useStickyPaneHeight} from './useStickyPaneHeight'
 
@@ -652,13 +653,19 @@ const Pane = React.forwardRef<HTMLDivElement, React.PropsWithChildren<PageLayout
 
     const paneId = useId(id)
 
-    let labelProp = undefined
+    let labelProp: {'aria-labelledby'?: string; 'aria-label'?: string} = {}
     if (hasOverflow) {
-      invariant(label !== undefined || labelledBy !== undefined)
+      warning(
+        label === undefined && labelledBy === undefined,
+        'The <PageLayout.Pane> has overflow and `aria-label` or `aria-labelledby` has not been set. ' +
+          'Please provide `aria-label` or `aria-labelledby` to <PageLayout.Pane> in order to label this ' +
+          'region.',
+      )
+
       if (labelledBy) {
-        labelProp = {'aria-labelledby': labelledBy}
-      } else {
-        labelProp = {'aria-label': label}
+        labelProp['aria-labelledby'] = labelledBy
+      } else if (label) {
+        labelProp['aria-label'] = label
       }
     }
 

From 67c852a83b29549d4b135809ad94da46c1fc3c15 Mon Sep 17 00:00:00 2001
From: Josh Black <joshblack@users.noreply.github.com>
Date: Wed, 12 Apr 2023 10:12:22 -0500
Subject: [PATCH 2/4] chore: add changeset

---
 .changeset/strange-yaks-wink.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/strange-yaks-wink.md

diff --git a/.changeset/strange-yaks-wink.md b/.changeset/strange-yaks-wink.md
new file mode 100644
index 00000000000..2c78509526d
--- /dev/null
+++ b/.changeset/strange-yaks-wink.md
@@ -0,0 +1,5 @@
+---
+'@primer/react': patch
+---
+
+Update PageLayout.Pane to provide a warning instead of an error when overflow is detected and no label has been provided

From 0739c8f81b6aeff26e7fbfb77a461a8d76738732 Mon Sep 17 00:00:00 2001
From: Josh Black <joshblack@users.noreply.github.com>
Date: Wed, 12 Apr 2023 10:12:45 -0500
Subject: [PATCH 3/4] chore: remove invariant

---
 src/PageLayout/PageLayout.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/PageLayout/PageLayout.tsx b/src/PageLayout/PageLayout.tsx
index 1f270c582ad..069c4e5724f 100644
--- a/src/PageLayout/PageLayout.tsx
+++ b/src/PageLayout/PageLayout.tsx
@@ -8,7 +8,6 @@ import {useSlots} from '../hooks/useSlots'
 import {BetterSystemStyleObject, merge, SxProp} from '../sx'
 import {Theme} from '../ThemeProvider'
 import {canUseDOM} from '../utils/environment'
-import {invariant} from '../utils/invariant'
 import {useOverflow} from '../utils/useOverflow'
 import {warning} from '../utils/warning'
 import VisuallyHidden from '../_VisuallyHidden'

From af386b5f4bd73c70898757d6ab5b285bcc7f868f Mon Sep 17 00:00:00 2001
From: Josh Black <joshblack@users.noreply.github.com>
Date: Wed, 12 Apr 2023 10:46:27 -0500
Subject: [PATCH 4/4] chore: address eslint violations

---
 src/PageLayout/PageLayout.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/PageLayout/PageLayout.tsx b/src/PageLayout/PageLayout.tsx
index 069c4e5724f..13b181e448e 100644
--- a/src/PageLayout/PageLayout.tsx
+++ b/src/PageLayout/PageLayout.tsx
@@ -652,7 +652,7 @@ const Pane = React.forwardRef<HTMLDivElement, React.PropsWithChildren<PageLayout
 
     const paneId = useId(id)
 
-    let labelProp: {'aria-labelledby'?: string; 'aria-label'?: string} = {}
+    const labelProp: {'aria-labelledby'?: string; 'aria-label'?: string} = {}
     if (hasOverflow) {
       warning(
         label === undefined && labelledBy === undefined,