UNPKG

@mantine/hooks

Version:

A collection of 50+ hooks for state and UI management

77 lines (76 loc) 2.58 kB
"use client"; let react = require("react"); //#region packages/@mantine/hooks/src/use-list-state/use-list-state.ts function useListState(initialValue = []) { const [state, setState] = (0, react.useState)(initialValue); const append = (0, react.useCallback)((...items) => setState((current) => [...current, ...items]), []); const prepend = (0, react.useCallback)((...items) => setState((current) => [...items, ...current]), []); const insert = (0, react.useCallback)((index, ...items) => setState((current) => [ ...current.slice(0, index), ...items, ...current.slice(index) ]), []); const apply = (0, react.useCallback)((fn) => setState((current) => current.map((item, index) => fn(item, index))), []); const remove = (0, react.useCallback)((...indices) => setState((current) => current.filter((_, index) => !indices.includes(index))), []); const pop = (0, react.useCallback)(() => setState((current) => { const cloned = [...current]; cloned.pop(); return cloned; }), []); const shift = (0, react.useCallback)(() => setState((current) => { const cloned = [...current]; cloned.shift(); return cloned; }), []); const reorder = (0, react.useCallback)(({ from, to }) => setState((current) => { const cloned = [...current]; const item = current[from]; cloned.splice(from, 1); cloned.splice(to, 0, item); return cloned; }), []); const swap = (0, react.useCallback)(({ from, to }) => setState((current) => { const cloned = [...current]; const fromItem = cloned[from]; const toItem = cloned[to]; cloned.splice(to, 1, fromItem); cloned.splice(from, 1, toItem); return cloned; }), []); const setItem = (0, react.useCallback)((index, item) => setState((current) => { const cloned = [...current]; cloned[index] = item; return cloned; }), []); const setItemProp = (0, react.useCallback)((index, prop, value) => setState((current) => { const cloned = [...current]; cloned[index] = { ...cloned[index], [prop]: value }; return cloned; }), []); const applyWhere = (0, react.useCallback)((condition, fn) => setState((current) => current.map((item, index) => condition(item, index) ? fn(item, index) : item)), []); const filter = (0, react.useCallback)((fn) => { setState((current) => current.filter(fn)); }, []); return [state, (0, react.useMemo)(() => ({ setState, append, prepend, insert, pop, shift, apply, applyWhere, remove, reorder, swap, setItem, setItemProp, filter }), [])]; } //#endregion exports.useListState = useListState; //# sourceMappingURL=use-list-state.cjs.map