useCollectionStore
Creates a collection store to control Collection components.
Code examples
Optional Props
defaultItems
T[] | undefined = []
The defaut value for the
items state.
items
T[]
Lists all items along with their metadata. This state is automatically
updated when an item is registered or unregistered using the
registerItem
function.
setItems
BivariantCallback<(items: T[]) => void> | undefined
A callback that gets called when the
items state
changes.
Code examples
const [items, setItems] = useState([]);
store
Store<Partial<S>> | undefined
Another store object that will be kept in sync with the original store.
Live examples
Return Props
registerItem
BivariantCallback<(item: T) => () => void>
Registers an item in the collection. This function returns a cleanup function that unregisters the item.
Code examples
const unregisterItem = store.registerItem({ id: "item-1" });
// on cleanup
unregisterItem();
renderItem
BivariantCallback<(item: T) => () => void>
Renders an item in the collection. This function returns a cleanup function that unmounts the item.
Code examples
const unrenderItem = store.renderItem({ id: "item-1" });
// on cleanup
unrenderItem();
item
(id: string | null | undefined) => T | null
Gets an item by its id.
Live examples
Code examples
const item = store.item("item-1");
getState
() => S
Returns the current store state.
setState
<K extends keyof S>(key: K, value: SetStateAction<S[K]>) => void
Sets a state value.
useState
UseState<StoreState<T>>
Re-renders the component when the state changes and returns the current state.