mirror of
https://github.com/facebook/docusaurus.git
synced 2025-08-04 01:09:20 +02:00
fix(v2): disable tab focus on collapsed doc sidebar items (#2625)
This commit is contained in:
parent
409f8788dc
commit
2c4490a1ff
1 changed files with 11 additions and 4 deletions
|
@ -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} />
|
||||
)}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue