diff options
author | ThibG <thib@sitedethib.com> | 2019-08-06 11:59:58 +0200 |
---|---|---|
committer | Eugen Rochko <eugen@zeonfederated.com> | 2019-08-06 11:59:58 +0200 |
commit | 27a0d02d0d960163e98595b05412c0d03a4875d0 (patch) | |
tree | b2a80e80eec0448ef0d03c06c1aff6c540cd9df5 /app/javascript/mastodon/components/icon_button.js | |
parent | a12f1a0baf3d31ecc9779c25b4bf4a0c9bd95543 (diff) |
Improve keyboard navigation in privacy dropdown (#11492)
* Trap tab in privacy dropdown * Give focus back to last focused element when privacy dropdown menu closes * Actually give back focus to the element that had it before clicking the dropdown
Diffstat (limited to 'app/javascript/mastodon/components/icon_button.js')
-rw-r--r-- | app/javascript/mastodon/components/icon_button.js | 18 |
1 files changed, 18 insertions, 0 deletions
diff --git a/app/javascript/mastodon/components/icon_button.js b/app/javascript/mastodon/components/icon_button.js index 9d8a8d06b..a727359e9 100644 --- a/app/javascript/mastodon/components/icon_button.js +++ b/app/javascript/mastodon/components/icon_button.js @@ -12,6 +12,8 @@ export default class IconButton extends React.PureComponent { title: PropTypes.string.isRequired, icon: PropTypes.string.isRequired, onClick: PropTypes.func, + onMouseDown: PropTypes.func, + onKeyDown: PropTypes.func, size: PropTypes.number, active: PropTypes.bool, pressed: PropTypes.bool, @@ -42,6 +44,18 @@ export default class IconButton extends React.PureComponent { } } + handleMouseDown = (e) => { + if (!this.props.disabled && this.props.onMouseDown) { + this.props.onMouseDown(e); + } + } + + handleKeyDown = (e) => { + if (!this.props.disabled && this.props.onKeyDown) { + this.props.onKeyDown(e); + } + } + render () { const style = { fontSize: `${this.props.size}px`, @@ -84,6 +98,8 @@ export default class IconButton extends React.PureComponent { title={title} className={classes} onClick={this.handleClick} + onMouseDown={this.handleMouseDown} + onKeyDown={this.handleKeyDown} style={style} tabIndex={tabIndex} disabled={disabled} @@ -103,6 +119,8 @@ export default class IconButton extends React.PureComponent { title={title} className={classes} onClick={this.handleClick} + onMouseDown={this.handleMouseDown} + onKeyDown={this.handleKeyDown} style={style} tabIndex={tabIndex} disabled={disabled} |