haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-23 20:37:42 +00:00
Code Issues Releases Wiki Activity

[a11y] my libs: added 'keyboard access' for 'star/unstar', op menu & ops

Browse Source
This commit is contained in:
llj
2021-09-22 10:48:25 +08:00
parent ace2ea7a3e
commit 4db1ef92e3
2 changed files with 24 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
frontend/src/pages/my-libs/mylib-repo-menu.js
View File

@@ -27,10 +27,22 @@ class MylibRepoMenu extends React.Component {
this.props.onMenuItemClick(operation);
}
onMenuItemKeyDown = (e) => {
if (e.key == 'Enter' || e.key == 'Space') {
this.onMenuItemClick(e);
}
}
onDropdownToggleClick = (e) => {
this.toggleOperationMenu(e);
}
onDropdownToggleKeyDown = (e) => {
if (e.key == 'Enter' || e.key == 'Space') {
this.onDropdownToggleClick(e);
}
}
toggleOperationMenu = (e) => {
let dataset = e.target ? e.target.dataset : null;
if (dataset && dataset.toggle && dataset.toggle === 'Rename') {
@@ -134,19 +146,20 @@ class MylibRepoMenu extends React.Component {
return (
<Dropdown isOpen={this.state.isItemMenuShow} toggle={this.toggleOperationMenu}>
<DropdownToggle
tag="i"
className="sf-dropdown-toggle sf2-icon-caret-down"
className="sf-dropdown-toggle sf2-icon-caret-down border-0 p-0"
title={gettext('More Operations')}
// onClick={this.clickOperationMenuToggle}
onClick={this.onDropdownToggleClick}
onKeyDown={this.onDropdownToggleKeyDown}
data-toggle="dropdown"
aria-expanded={this.state.isItemMenuShow}
aria-haspopup={true}
style={{'minWidth': '0'}}
/>
<DropdownMenu>
{operations.map((item, index)=> {
if (item == 'Divider') {
return <DropdownItem key={index} divider />;
} else {
return (<DropdownItem key={index} data-toggle={item} onClick={this.onMenuItemClick}>{this.translateOperations(item)}</DropdownItem>);
return (<DropdownItem key={index} data-toggle={item} onClick={this.onMenuItemClick} onKeyDown={this.onMenuItemKeyDown}>{this.translateOperations(item)}</DropdownItem>);
}
})}
</DropdownMenu>