mirror of
https://github.com/Unleash/unleash.git
synced 2025-02-09 00:18:00 +01:00
feat: keyboard navigation filter item (#5667)
This commit is contained in:
parent
5ba588f59a
commit
6bf54a2f24
@ -11,8 +11,9 @@ export const StyledDropdown = styled('div')(({ theme }) => ({
|
|||||||
export const StyledListItem = styled(ListItem)(({ theme }) => ({
|
export const StyledListItem = styled(ListItem)(({ theme }) => ({
|
||||||
paddingLeft: theme.spacing(1),
|
paddingLeft: theme.spacing(1),
|
||||||
cursor: 'pointer',
|
cursor: 'pointer',
|
||||||
'&:hover': {
|
'&:hover, &:focus': {
|
||||||
backgroundColor: theme.palette.action.hover,
|
backgroundColor: theme.palette.action.hover,
|
||||||
|
outline: 'none',
|
||||||
},
|
},
|
||||||
}));
|
}));
|
||||||
|
|
||||||
|
@ -9,6 +9,7 @@ import {
|
|||||||
StyledTextField,
|
StyledTextField,
|
||||||
} from './FilterItem.styles';
|
} from './FilterItem.styles';
|
||||||
import { FilterItemChip } from './FilterItemChip/FilterItemChip';
|
import { FilterItemChip } from './FilterItemChip/FilterItemChip';
|
||||||
|
import { onEnter } from '../../common/Search/SearchSuggestions/onEnter';
|
||||||
|
|
||||||
export interface IFilterItemProps {
|
export interface IFilterItemProps {
|
||||||
name: string;
|
name: string;
|
||||||
@ -159,6 +160,10 @@ export const FilterItem: FC<IFilterItemProps> = ({
|
|||||||
key={option.value}
|
key={option.value}
|
||||||
dense
|
dense
|
||||||
disablePadding
|
disablePadding
|
||||||
|
tabIndex={0}
|
||||||
|
onKeyDown={onEnter(
|
||||||
|
handleToggle(option.value),
|
||||||
|
)}
|
||||||
onClick={handleToggle(option.value)}
|
onClick={handleToggle(option.value)}
|
||||||
>
|
>
|
||||||
<StyledCheckbox
|
<StyledCheckbox
|
||||||
|
Loading…
Reference in New Issue
Block a user