diff --git a/docs/lib/Components/DropdownsPage.js b/docs/lib/Components/DropdownsPage.js index 302cb63e0..c0257ced7 100644 --- a/docs/lib/Components/DropdownsPage.js +++ b/docs/lib/Components/DropdownsPage.js @@ -57,6 +57,7 @@ export default class DropdownPage extends React.Component {
{`Dropdown.propTypes = { + a11y: PropTypes.bool, // defaults to true. Set to false to enable more bootstrap like tabbing behavior disabled: PropTypes.bool, direction: PropTypes.oneOf(['up', 'down', 'left', 'right']), group: PropTypes.bool, diff --git a/src/Dropdown.js b/src/Dropdown.js index 2fa6e33e5..b5beb360d 100644 --- a/src/Dropdown.js +++ b/src/Dropdown.js @@ -9,6 +9,7 @@ import { DropdownContext } from './DropdownContext'; import { mapToCssModules, omit, keyCodes, tagPropType } from './utils'; const propTypes = { + a11y: PropTypes.bool, disabled: PropTypes.bool, direction: PropTypes.oneOf(['up', 'down', 'left', 'right']), group: PropTypes.bool, @@ -27,6 +28,7 @@ const propTypes = { }; const defaultProps = { + a11y: true, isOpen: false, direction: 'down', nav: false, @@ -114,7 +116,7 @@ class Dropdown extends React.Component { handleKeyDown(e) { if ( /input|textarea/i.test(e.target.tagName) - || (keyCodes.tab === e.which && e.target.getAttribute('role') !== 'menuitem') + || (keyCodes.tab === e.which && (e.target.getAttribute('role') !== 'menuitem' || !this.props.a11y)) ) { return; }