@supunlakmal/hooks/dist/hooks/state-management/useSetState.js

A collection of reusable React hooks

import { useState, useCallback } from 'react';
/**
 * @name useSetState
 * @description - Hook that manages an object state, merging updates like `this.setState` in class components.
 *
 * @template T The type of the state object.
 * @param {T | (() => T)} initialState The initial state object or a function that returns it.
 * @returns {[T, (patch: Partial<T> | ((prevState: T) => Partial<T>)) => void]} A tuple containing the current state object and a function to merge updates into it.
 *
 * @example
 * const [state, setState] = useSetState({ count: 0, name: 'Default' });
 * // Update only count
 * setState({ count: 1 });
 * // Update name using a function
 * setState(prevState => ({ name: prevState.name.toUpperCase() }));
 */
export const useSetState = (initialState) => {
    const [state, setState] = useState(initialState);
    const mergeState = useCallback((patch) => {
        setState((prevState) => {
            const newStatePatch = typeof patch === 'function' ? patch(prevState) : patch;
            // Ensure we don't mutate the previous state, especially if initialState was a function
            // that might return the same object reference on multiple calls.
            return Object.assign(Object.assign({}, prevState), newStatePatch);
        });
    }, []);
    return [state, mergeState];
};
//# sourceMappingURL=useSetState.js.map