useSelection

The useSelection hook facilitates letting the user select one or more items from a list or array. You need to pass this list/array to the hook.

Example

import { useSelection } from '@freesewing/react/hooks/useFilter'

const MyComponent = ({ items = [] }) => {
  const {
    count,
    selection,
    setSelection,
    toggle,
    toggleAll,
  } = useSelection(items)

  // ...
}

Return value

Calling the hook returns an object with the following properties:

• count
• selection
• setSelection
• toggle
• toggleAll

count

This holds the number of items currently selected.

selection

This holds an object of selected items where the key is the index and the value the item itself. Call selection.values() to get an array.

setSelection

This is a method that sets the selection manually, typically not used.

toggle

This is a method that takes an index and toggles the selection for that item.

toggleAll

This is a method will select all items, unless all items are currently selected. In that case, it will select zero items.