import { Key } from 'react' import { CollectionBase, Selection, Node } from '@react-types/shared' import { MultipleSelectionStateProps } from '@react-stately/selection' import { ListState, useListState } from '@react-stately/list' import { useControlledState } from '@react-stately/utils' export interface MultiSelectListProps extends CollectionBase, MultipleSelectionStateProps { /** Filter function to generate a filtered list of nodes. */ filter?: (nodes: Iterable>) => Iterable> /** @private */ suppressTextValueWarning?: boolean disallowEmptySelection?: boolean } export interface MultiSelectListState extends ListState { /** The key for the currently selected item. */ readonly selectedKeys: Selection /** Sets the selected keys. */ setSelectedKeys(keys: Set): void /** The value of the currently selected item. */ readonly selectedItems: Node[] } export function useMultiSelectListState(props: MultiSelectListProps): MultiSelectListState { const [selectedKeys, setSelectedKeys] = useControlledState( props.selectedKeys as Selection, (props.defaultSelectedKeys = new Set()), props.onSelectionChange! ) const { collection, disabledKeys, selectionManager } = useListState({ ...props, selectionMode: 'multiple', allowDuplicateSelectionEvents: true, selectedKeys, onSelectionChange: (keys: Selection) => { if (props.onSelectionChange) { props.onSelectionChange(keys) } setSelectedKeys(keys) } }) const selectedItems = selectedKeys === 'all' ? [...collection] : [...selectedKeys].map((key) => collection.getItem(key) || key) return { collection, disabledKeys, selectionManager, selectedKeys, setSelectedKeys, selectedItems } }