From c860537149ce170e48e7b68a2a81514c43d48df7 Mon Sep 17 00:00:00 2001
From: Mayank <9084735+mayank99@users.noreply.github.com>
Date: Wed, 29 Jul 2026 11:37:54 -0400
Subject: [PATCH 1/2] fix `Dialog` and `Drawer` scroll lock

---
 .changeset/blue-frogs-visit.md             |  5 +++++
 packages/mui/src/~components.css           |  1 +
 packages/mui/src/~components/MuiDialog.css |  8 ++++++++
 packages/mui/src/~components/MuiDrawer.css | 12 ++++++++++++
 4 files changed, 26 insertions(+)
 create mode 100644 .changeset/blue-frogs-visit.md
 create mode 100644 packages/mui/src/~components/MuiDrawer.css

diff --git a/.changeset/blue-frogs-visit.md b/.changeset/blue-frogs-visit.md
new file mode 100644
index 000000000000..3ffb333bdc0a
--- /dev/null
+++ b/.changeset/blue-frogs-visit.md
@@ -0,0 +1,5 @@
+---
+"@stratakit/mui": patch
+---
+
+Fixed an issue where the viewport was still scrollable when a `Dialog` or `Drawer` was open.
diff --git a/packages/mui/src/~components.css b/packages/mui/src/~components.css
index 416adc5e1728..5a646fdd3622 100644
--- a/packages/mui/src/~components.css
+++ b/packages/mui/src/~components.css
@@ -17,6 +17,7 @@
 @import "./~components/MuiCard.css";
 @import "./~components/MuiCheckbox.css";
 @import "./~components/MuiChip.css";
+@import "./~components/MuiDrawer.css";
 @import "./~components/MuiDialog.css";
 @import "./~components/MuiDivider.css";
 @import "./~components/MuiForm.css";
diff --git a/packages/mui/src/~components/MuiDialog.css b/packages/mui/src/~components/MuiDialog.css
index c8733a6f0f54..729502fdc342 100644
--- a/packages/mui/src/~components/MuiDialog.css
+++ b/packages/mui/src/~components/MuiDialog.css
@@ -3,6 +3,14 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 
+/**
+ * Prevents the viewport from scrolling when a Dialog is open.
+ * This is necessary because the equivalent JS doesn't work when Dialog is rendered in a portal container.
+ */
+:is(html, body):where(:has(.MuiDialog-root:not(.MuiModal-root.MuiModal-hidden))) {
+	overflow: clip;
+}
+
 .MuiDialog-paper {
 	--✨min-inset: var(--stratakit-space-x4);
 
diff --git a/packages/mui/src/~components/MuiDrawer.css b/packages/mui/src/~components/MuiDrawer.css
new file mode 100644
index 000000000000..b85faed063c5
--- /dev/null
+++ b/packages/mui/src/~components/MuiDrawer.css
@@ -0,0 +1,12 @@
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+
+/**
+ * Prevents the viewport from scrolling when a Drawer is open.
+ * This is necessary because the equivalent JS doesn't work when Drawer is rendered in a portal container.
+ */
+:is(html, body):where(:has(.MuiDrawer-root:not(.MuiModal-root.MuiModal-hidden))) {
+	overflow: clip;
+}

From b4078be3b90d1b48e9675605c31679bbd9eeaba6 Mon Sep 17 00:00:00 2001
From: Mayank <9084735+mayank99@users.noreply.github.com>
Date: Wed, 29 Jul 2026 12:30:36 -0400
Subject: [PATCH 2/2] disableScrollLock

---
 packages/mui/src/~createTheme.tsx | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

diff --git a/packages/mui/src/~createTheme.tsx b/packages/mui/src/~createTheme.tsx
index 063ae622abe4..aa22f19b331c 100644
--- a/packages/mui/src/~createTheme.tsx
+++ b/packages/mui/src/~createTheme.tsx
@@ -335,7 +335,12 @@ function createTheme(args: CreateThemeArgs) {
 				},
 			},
 			MuiContainer: { defaultProps: { component: Role.div } },
-			MuiDialog: { defaultProps: { component: Role.div } },
+			MuiDialog: {
+				defaultProps: {
+					component: Role.div,
+					disableScrollLock: true, // Handled in MuiDialog.css instead.
+				},
+			},
 			MuiDialogContentText: {
 				defaultProps: {
 					component: Role.p,
@@ -349,7 +354,12 @@ function createTheme(args: CreateThemeArgs) {
 				},
 			},
 			MuiDivider: { defaultProps: { component: MuiDivider } },
-			MuiDrawer: { defaultProps: { component: Role.div } },
+			MuiDrawer: {
+				defaultProps: {
+					component: Role.div,
+					disableScrollLock: true, // Handled in MuiDrawer.css instead.
+				},
+			},
 			MuiFab: {
 				defaultProps: {
 					component: MuiButtonBase,