import React from 'react'; import PropTypes from 'prop-types'; import {Button} from './index'; import {KEYCODES} from './constants'; import {onEventCapture} from './utils'; /** * @ngdoc react * @name ButtonList * @description List of buttons */ class ButtonList extends React.PureComponent { static propTypes: any; static defaultProps: any; dom: any; constructor(props) { super(props); this.dom = { startButton: null, endButton: null, }; } onKeyDown(index, event) { if (event.keyCode !== KEYCODES.TAB) { return; } if (event.shiftKey === false && index === this.props.buttonList.length - 1) { // Last button, bring focus back to first button onEventCapture(event); this.dom.startButton.focus(); } else if (event.shiftKey === true && this.props.captureShiftTab && index === 0) { // First button, take focus back to last button onEventCapture(event); this.dom.endButton.focus(); } } render() { const {buttonList} = this.props; return (
{buttonList.map((buttonProps, index) => (
); } } ButtonList.propTypes = { buttonList: PropTypes.array, captureShiftTab: PropTypes.bool, }; ButtonList.defaultProps = { buttonList: [], captureShiftTab: true, }; export default ButtonList;