UNPKG

1.18 kBJavaScriptView Raw
1"use strict";
2
3exports.__esModule = true;
4exports.default = useMergeState;
5var _react = require("react");
6/**
7 * Updates state, partial updates are merged into existing state values
8 */
9
10/**
11 * Mimics a React class component's state model, of having a single unified
12 * `state` object and an updater that merges updates into the existing state, as
13 * opposed to replacing it.
14 *
15 * ```js
16 * const [state, setState] = useMergeState({ name: 'Betsy', age: 24 })
17 *
18 * setState({ name: 'Johan' }) // { name: 'Johan', age: 24 }
19 *
20 * setState(state => ({ age: state.age + 10 })) // { name: 'Johan', age: 34 }
21 * ```
22 *
23 * @param initialState The initial state object
24 */
25function useMergeState(initialState) {
26 const [state, setState] = (0, _react.useState)(initialState);
27 const updater = (0, _react.useCallback)(update => {
28 if (update === null) return;
29 if (typeof update === 'function') {
30 setState(state => {
31 const nextState = update(state);
32 return nextState == null ? state : Object.assign({}, state, nextState);
33 });
34 } else {
35 setState(state => Object.assign({}, state, update));
36 }
37 }, [setState]);
38 return [state, updater];
39}
\No newline at end of file