From 60f035410fe9a4bc4f241bccca4935423c7fe1c7 Mon Sep 17 00:00:00 2001
From: anujupadhyay123 <anuju2024@gmail.com>
Date: Wed, 2 Jul 2025 13:14:07 +0530
Subject: [PATCH] fix/The toggle navigation menu button is not keyboard
 accessible

---
 packages/ui-components/Containers/NavBar/index.tsx | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/packages/ui-components/Containers/NavBar/index.tsx b/packages/ui-components/Containers/NavBar/index.tsx
index 6fcc1fd05b35d..e079114c4a028 100644
--- a/packages/ui-components/Containers/NavBar/index.tsx
+++ b/packages/ui-components/Containers/NavBar/index.tsx
@@ -55,7 +55,17 @@ const NavBar: FC<PropsWithChildren<NavbarProps>> = ({
           className={style.sidebarItemTogglerLabel}
           htmlFor="sidebarItemToggler"
           role="button"
+          tabIndex={0}
           aria-label={sidebarItemTogglerAriaLabel}
+          onKeyDown={e => {
+            if (e.key === 'Enter' || e.key === ' ') {
+              e.preventDefault();
+              const input = document.getElementById(
+                'sidebarItemToggler'
+              ) as HTMLInputElement;
+              input?.click(); // Triggers input toggle
+            }
+          }}
         >
           {navInteractionIcons[isMenuOpen ? 'close' : 'show']}
         </Label.Root>