When the drawer is in ClipMode "Never" and Variant Temporary you can'…

src/wwwroot/NavigationObserver.js

@@ -52,6 +52,9 @@ let hasInitialized = false;
             if (responsiveDrawer) {
                 MudDrawerInterop.monitorResize(responsiveDrawer);
             }
+
+            document.removeEventListener('click', this.handleOutsideClick);
+            document.addEventListener('click', this.handleOutsideClick);
         },
 
         monitorResize(responsiveDrawer) {
@@ -108,6 +111,19 @@ let hasInitialized = false;
             MudDrawerInterop.toggleDrawer(targetDrawerId);
         },
 
+        handleOutsideClick: function (event) {
+            const mudDrawer = document.querySelector('.mud-drawer.mud-drawer--open');
+
+            if (!mudDrawer) return;
+
+            if (mudDrawer.contains(event.target) || event.target.closest('[data-mud-drawer-toggle]')) {
+                return;
+            }
+
+            const drawerId = mudDrawer.id ? mudDrawer.id : '_no_id_provided_';
+            MudDrawerInterop.toggleDrawer(drawerId);
+        },
+
         toggleDrawer: function (drawerId) {
             let mudDrawer;
 

tests/StaticInput.UnitTests.Viewer/Components/Tests/NavMenu/NavMenuDrawerToggleNeverTest.razor

@@ -0,0 +1,24 @@
+<MudLayout>
+    <MudAppBar Elevation="1" Fixed="false">
+        <MudStaticNavDrawerToggle id="static-left-toggle" DrawerId="static-temporary"
+                                  Icon="@Icons.Material.Filled.KeyboardDoubleArrowRight" Color="Color.Inherit"
+                                  Edge="Edge.Start"/>
+        <MudSpacer/>
+    </MudAppBar>
+    <MudDrawer id="static-temporary" Elevation="1" Anchor="Anchor.Start" Variant="@DrawerVariant.Temporary"
+               ClipMode="DrawerClipMode.Never">
+        <MudDrawerHeader>
+            <MudText Typo="Typo.h6">Temporary</MudText>
+        </MudDrawerHeader>
+        <MudNavMenu>
+            <MudNavLink Match="NavLinkMatch.All">Store</MudNavLink>
+            <MudNavLink Match="NavLinkMatch.All">Library</MudNavLink>
+            <MudNavLink Match="NavLinkMatch.All">Community</MudNavLink>
+        </MudNavMenu>
+    </MudDrawer>
+    <MudPaper Class="d-flex justify-center" Style="height:200px; overflow:hidden; position:relative;">
+        <MudAlert id="static-content" Class="absolute align-self-center" Severity="Severity.Success">
+            Text inside MudContainer
+        </MudAlert>
+    </MudPaper>
+</MudLayout>

tests/StaticInput.UnitTests/Components/NavMenuTests.cs

@@ -79,5 +79,39 @@ public async Task Toggle_MudDrawer()
             miniClasses = await miniDawer.GetAttributeAsync("class");
             miniClasses.Should().Contain("mud-drawer--closed");
         }
+
+        [Fact]
+        public async Task MudDrawerTemporary_ClickOutside_Closed()
+        {
+            var url = typeof(NavMenuDrawerToggleNeverTest).ToQueryString();
+            await Page.GotoAsync(url);
+
+            var leftToggle = Page.Locator("#static-left-toggle");
+            var temporaryDrawer = Page.Locator("#static-temporary");
+
+            var drawerBox = await temporaryDrawer.BoundingBoxAsync();
+            drawerBox.Should().NotBeNull();
+
+            var temporaryClasses = await temporaryDrawer.GetAttributeAsync("class");
+            temporaryClasses.Should().NotBeNullOrEmpty();
+            temporaryClasses.Should().Contain("mud-drawer--closed");
+
+            await leftToggle.ClickAsync();
+            temporaryClasses = await temporaryDrawer.GetAttributeAsync("class");
+            temporaryClasses.Should().Contain("mud-drawer--open");
+
+            await temporaryDrawer.ClickAsync();
+            temporaryClasses = await temporaryDrawer.GetAttributeAsync("class");
+            temporaryClasses.Should().Contain("mud-drawer--open");
+
+            await Page.Mouse.ClickAsync(drawerBox!.Width+100, 10);
+
+            temporaryClasses = await temporaryDrawer.GetAttributeAsync("class");
+            temporaryClasses.Should().Contain("mud-drawer--closed");
+
+            await leftToggle.ClickAsync();
+            temporaryClasses = await temporaryDrawer.GetAttributeAsync("class");
+            temporaryClasses.Should().Contain("mud-drawer--open");
+        }
     }
 }