From f52a2b50ff8639703a82441dcdee604be62b93c6 Mon Sep 17 00:00:00 2001
From: OM MISHRA <152969928+howwohmm@users.noreply.github.com>
Date: Tue, 24 Mar 2026 21:29:23 +0530
Subject: [PATCH] fix(DashboardSidebar): add overflow-hidden to footer slot
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The footer slot lacked an overflow constraint, so child components like
UNavigationMenu could exceed the sidebar width. The body slot already
uses overflow-y-auto which establishes a BFC — add overflow-hidden to
footer for the same containment.

Fixes #6231
---
 src/theme/dashboard-sidebar.ts                                  | 2 +-
 test/components/__snapshots__/DashboardSidebar-vue.spec.ts.snap | 2 +-
 test/components/__snapshots__/DashboardSidebar.spec.ts.snap     | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/theme/dashboard-sidebar.ts b/src/theme/dashboard-sidebar.ts
index 669b23f160..bd0cde8f56 100644
--- a/src/theme/dashboard-sidebar.ts
+++ b/src/theme/dashboard-sidebar.ts
@@ -3,7 +3,7 @@ export default {
     root: 'relative hidden lg:flex flex-col min-h-svh min-w-16 w-(--width) shrink-0',
     header: 'h-(--ui-header-height) shrink-0 flex items-center gap-1.5 px-4',
     body: 'flex flex-col gap-4 flex-1 overflow-y-auto px-4 py-2',
-    footer: 'shrink-0 flex items-center gap-1.5 px-4 py-2',
+    footer: 'shrink-0 flex items-center gap-1.5 overflow-hidden px-4 py-2',
     toggle: '',
     handle: '',
     content: 'lg:hidden',
diff --git a/test/components/__snapshots__/DashboardSidebar-vue.spec.ts.snap b/test/components/__snapshots__/DashboardSidebar-vue.spec.ts.snap
index e7206c1673..d3868548f9 100644
--- a/test/components/__snapshots__/DashboardSidebar-vue.spec.ts.snap
+++ b/test/components/__snapshots__/DashboardSidebar-vue.spec.ts.snap
@@ -110,7 +110,7 @@ exports[`DashboardSidebar > renders with footer slot correctly 1`] = `
   <div id="dashboard-sidebar-v-0" data-collapsed="false" data-dragging="false" data-slot="root" class="relative hidden lg:flex flex-col min-h-svh min-w-16 w-(--width) shrink-0 border-e border-default" style="--width: 15%;">
     <!--v-if-->
     <div data-slot="body" class="flex flex-col gap-4 flex-1 overflow-y-auto px-4 py-2"></div>
-    <div data-slot="footer" class="shrink-0 flex items-center gap-1.5 px-4 py-2">Footer slot</div>
+    <div data-slot="footer" class="shrink-0 flex items-center gap-1.5 overflow-hidden px-4 py-2">Footer slot</div>
   </div>
   <!--v-if-->
   <!--v-if-->
diff --git a/test/components/__snapshots__/DashboardSidebar.spec.ts.snap b/test/components/__snapshots__/DashboardSidebar.spec.ts.snap
index 1eb48bfbe0..0d0e0bb01b 100644
--- a/test/components/__snapshots__/DashboardSidebar.spec.ts.snap
+++ b/test/components/__snapshots__/DashboardSidebar.spec.ts.snap
@@ -110,7 +110,7 @@ exports[`DashboardSidebar > renders with footer slot correctly 1`] = `
   <div id="dashboard-sidebar-v-0-0-0" data-collapsed="false" data-dragging="false" data-slot="root" class="relative hidden lg:flex flex-col min-h-svh min-w-16 w-(--width) shrink-0 border-e border-default" style="--width: 15%;">
     <!--v-if-->
     <div data-slot="body" class="flex flex-col gap-4 flex-1 overflow-y-auto px-4 py-2"></div>
-    <div data-slot="footer" class="shrink-0 flex items-center gap-1.5 px-4 py-2">Footer slot</div>
+    <div data-slot="footer" class="shrink-0 flex items-center gap-1.5 overflow-hidden px-4 py-2">Footer slot</div>
   </div>
   <!--v-if-->
   <!--v-if-->