This package has been deprecated

Author message:

Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

@billogram/use-dropdown

A React hook for dropdown components

Install

yarn add @billogram/use-dropdown

Usage

import useDropdown from '@billogram/use-dropdown';

See types for exported types.

useDropdown

It is important that implemented dropdowns conform with WAI-ARIA best practices.

const listRef = React.useRef<HTMLElement>(null);
const optionsRef = React.useRef(new Map<number, HTMLElement | null>());

const {
    change,
    close,
    expanded,
    handleKeyDown,
    handleKeyPress,
    highlightedIndex,
    isTypeahead,
    open,
    selectedOption,
    toggle,
} = useDropdown<Options>({
    disabled: false,
    isExpandedInitial: false,
    listNode: listRef.current,
    optionNodes: Array.from(optionsRef.current.values()),
    options: [],
    onChange: noop,
    onClose: noop,
    shouldTriggerChangeOnEnterOrSpace: true,
    value: '',
});

Note

This library is being published with our use cases in mind and is not necessarily meant to be consumed by the broader public. We probably won't take your feature requests unless they align with our own needs.

License

MIT