How to use the downshift.useSelect.stateChangeTypes function in downshift

To help you get started, we’ve selected a few downshift examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github WordPress / gutenberg / packages / components / src / custom-select-control / index.js View on Github external
{ selectedItem },
	{ type, changes, props: { items } }
) => {
	switch ( type ) {
		case useSelect.stateChangeTypes.ToggleButtonKeyDownArrowDown:
			// If we already have a selected item, try to select the next one,
			// without circular navigation. Otherwise, select the first item.
			return {
				selectedItem:
					items[
						selectedItem ?
							Math.min( items.indexOf( selectedItem ) + 1, items.length - 1 ) :
							0
					],
			};
		case useSelect.stateChangeTypes.ToggleButtonKeyDownArrowUp:
			// If we already have a selected item, try to select the previous one,
			// without circular navigation. Otherwise, select the last item.
			return {
				selectedItem:
					items[
						selectedItem ?
							Math.max( items.indexOf( selectedItem ) - 1, 0 ) :
							items.length - 1
					],
			};
		default:
			return changes;
	}
};
export default function CustomSelectControl( {

downshift

🏎 A set of primitives to build simple, flexible, WAI-ARIA compliant React autocomplete, combobox or select dropdown components.

MIT
Latest version published 3 months ago

Package Health Score

100 / 100
Full package analysis