3pp-mirror/docusaurus
1
0
Fork 0
mirror of https://github.com/facebook/docusaurus.git synced 2025-08-06 10:20:09 +02:00
Code Issues Projects Releases Packages Wiki Activity

fix(v2): disable tab focus on collapsed doc sidebar items (#2625)

Browse source
This commit is contained in:
Alexey Pyltsyn 2020-04-19 16:28:08 +03:00 • committed by GitHub
parent 409f8788dc
commit 2c4490a1ff
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 11 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

15
packages/docusaurus-theme-classic/src/theme/DocSidebar/index.js
View file

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