| 928 | } |
| 929 | |
| 930 | focusValue(direction: 'previous' | 'next') { |
| 931 | const { selectValue, focusedValue } = this.state; |
| 932 | |
| 933 | // Only multiselects support value focusing |
| 934 | if (!this.props.isMulti) return; |
| 935 | |
| 936 | this.setState({ |
| 937 | focusedOption: null, |
| 938 | }); |
| 939 | |
| 940 | let focusedIndex = selectValue.indexOf(focusedValue!); |
| 941 | if (!focusedValue) { |
| 942 | focusedIndex = -1; |
| 943 | } |
| 944 | |
| 945 | const lastIndex = selectValue.length - 1; |
| 946 | let nextFocus = -1; |
| 947 | if (!selectValue.length) return; |
| 948 | |
| 949 | switch (direction) { |
| 950 | case 'previous': |
| 951 | if (focusedIndex === 0) { |
| 952 | // don't cycle from the start to the end |
| 953 | nextFocus = 0; |
| 954 | } else if (focusedIndex === -1) { |
| 955 | // if nothing is focused, focus the last value first |
| 956 | nextFocus = lastIndex; |
| 957 | } else { |
| 958 | nextFocus = focusedIndex - 1; |
| 959 | } |
| 960 | break; |
| 961 | case 'next': |
| 962 | if (focusedIndex > -1 && focusedIndex < lastIndex) { |
| 963 | nextFocus = focusedIndex + 1; |
| 964 | } |
| 965 | break; |
| 966 | } |
| 967 | this.setState({ |
| 968 | inputIsHidden: nextFocus !== -1, |
| 969 | focusedValue: selectValue[nextFocus], |
| 970 | }); |
| 971 | } |
| 972 | |
| 973 | focusOption(direction: FocusDirection = 'first') { |
| 974 | const { pageSize } = this.props; |