From 2c4490a1ff9b71e9fad389306653f4e14ddd2e35 Mon Sep 17 00:00:00 2001
From: Alexey Pyltsyn <lex61rus@gmail.com>
Date: Sun, 19 Apr 2020 16:28:08 +0300
Subject: [PATCH] fix(v2): disable tab focus on collapsed doc sidebar items
 (#2625)

---
 .../src/theme/DocSidebar/index.js                 | 15 +++++++++++----
 1 file changed, 11 insertions(+), 4 deletions(-)

diff --git a/packages/docusaurus-theme-classic/src/theme/DocSidebar/index.js b/packages/docusaurus-theme-classic/src/theme/DocSidebar/index.js
index a230fb6a1d59..c59c3611f437 100644
--- a/packages/docusaurus-theme-classic/src/theme/DocSidebar/index.js
+++ b/packages/docusaurus-theme-classic/src/theme/DocSidebar/index.js
@@ -17,7 +17,7 @@ import styles from './styles.module.css';
 
 const MOBILE_TOGGLE_SIZE = 24;
 
-function DocSidebarItem({item, onItemClick, collapsible}) {
+function DocSidebarItem({item, onItemClick, collapsible, ...props}) {
   const {items, href, label, type} = item;
   const [collapsed, setCollapsed] = useState(item.collapsed);
   const [prevCollapsedProp, setPreviousCollapsedProp] = useState(null);
@@ -50,12 +50,14 @@ function DocSidebarItem({item, onItemClick, collapsible}) {
                 'menu__link--active': collapsible && !item.collapsed,
               })}
               href="#!"
-              onClick={collapsible ? handleItemClick : undefined}>
+              onClick={collapsible ? handleItemClick : undefined}
+              {...props}>
               {label}
             </a>
             <ul className="menu__list">
               {items.map((childItem) => (
                 <DocSidebarItem
+                  tabIndex={collapsed ? '-1' : '0'}
                   key={childItem.label}
                   item={childItem}
                   onItemClick={onItemClick}
@@ -84,7 +86,8 @@ function DocSidebarItem({item, onItemClick, collapsible}) {
               : {
                   target: '_blank',
                   rel: 'noreferrer noopener',
-                })}>
+                })}
+            {...props}>
             {label}
           </Link>
         </li>
@@ -153,7 +156,11 @@ function DocSidebar(props) {
   return (
     <div className={styles.sidebar}>
       {hideOnScroll && (
-        <Link className={styles.sidebarLogo} to={logoLink} {...logoLinkProps}>
+        <Link
+          tabIndex="-1"
+          className={styles.sidebarLogo}
+          to={logoLink}
+          {...logoLinkProps}>
           {logoImageUrl != null && (
             <img key={isClient} src={logoImageUrl} alt={logoAlt} />
           )}