diff --git a/.changeset/lucky-coins-guess.md b/.changeset/lucky-coins-guess.md
index 6377f43d809..5862e44ff31 100644
--- a/.changeset/lucky-coins-guess.md
+++ b/.changeset/lucky-coins-guess.md
@@ -1,5 +1,7 @@
---
-"@primer/react": patch
+"@primer/react": major
---
-Use createRoot instead of ReactDOM.render for React 18 compatibility.
+ConfirmationDialog: Use createRoot instead of ReactDOM.render for React 18 compatibility.
+
+
diff --git a/.changeset/yellow-windows-accept.md b/.changeset/yellow-windows-accept.md
index 79b7a1079fb..5390f04ebd0 100644
--- a/.changeset/yellow-windows-accept.md
+++ b/.changeset/yellow-windows-accept.md
@@ -2,4 +2,6 @@
"@primer/react": major
---
-Removes PageLayout.Pane position prop.
+Removes PageLayout.Pane position prop. The layout is now decided by the order in which PageLayout.Pane and PageLayout.Content appear in the DOM.
+
+
diff --git a/src/PageLayout/PageLayout.docs.json b/src/PageLayout/PageLayout.docs.json
index 5da95e2cce0..fd999fca3dc 100644
--- a/src/PageLayout/PageLayout.docs.json
+++ b/src/PageLayout/PageLayout.docs.json
@@ -121,19 +121,6 @@
"type": "string | undefined",
"description": "Id of an element that acts as a label for the pane. Required if the pane overflows and doesn't have aria-label."
},
- {
- "name": "position",
- "type": "| 'start' | 'end' | { narrow?: | 'start' | 'end' regular?: | 'start' | 'end' wide?: | 'start' | 'end' }",
- "defaultValue": "'end'",
- "description": ""
- },
- {
- "name": "positionWhenNarrow",
- "type": "| 'inherit' | 'start' | 'end'",
- "defaultValue": "'inherit'",
- "deprecated": true,
- "description": "Use the position prop with a responsive value instead."
- },
{
"name": "width",
"type": "| 'small' | 'medium' | 'large' | { min: string max: string default: string }",
diff --git a/src/PageLayout/PageLayout.test.tsx b/src/PageLayout/PageLayout.test.tsx
index dec502086b7..ba41f499091 100644
--- a/src/PageLayout/PageLayout.test.tsx
+++ b/src/PageLayout/PageLayout.test.tsx
@@ -70,7 +70,7 @@ describe('PageLayout', () => {
Header
Content
- Pane
+ Pane
Footer
,
diff --git a/src/PageLayout/PageLayout.tsx b/src/PageLayout/PageLayout.tsx
index 11caa1f97c8..e6de1a73259 100644
--- a/src/PageLayout/PageLayout.tsx
+++ b/src/PageLayout/PageLayout.tsx
@@ -493,21 +493,6 @@ const isPaneWidth = (width: PaneWidth | CustomWidthOptions): width is PaneWidth
}
export type PageLayoutPaneProps = {
- /**
- * @deprecated Use the `position` prop with a responsive value instead.
- *
- * Before:
- * ```
- * position="start"
- * positionWhenNarrow="end"
- * ```
- *
- * After:
- * ```
- * position={{regular: 'start', narrow: 'end'}}
- * ```
- */
- positionWhenNarrow?: 'inherit' | keyof typeof panePositions
'aria-labelledby'?: string
'aria-label'?: string
width?: PaneWidth | CustomWidthOptions
@@ -537,11 +522,6 @@ export type PageLayoutPaneProps = {
id?: string
} & SxProp
-const panePositions = {
- start: REGION_ORDER.paneStart,
- end: REGION_ORDER.paneEnd,
-}
-
const paneWidths = {
small: ['100%', null, '240px', '256px'],
medium: ['100%', null, '256px', '296px'],
@@ -555,8 +535,6 @@ const Pane = React.forwardRef