39 lines
1.1 KiB
JavaScript
39 lines
1.1 KiB
JavaScript
"use strict";
|
|
|
|
exports.__esModule = true;
|
|
exports.default = useMergeState;
|
|
var _react = require("react");
|
|
/**
|
|
* Updates state, partial updates are merged into existing state values
|
|
*/
|
|
|
|
/**
|
|
* Mimics a React class component's state model, of having a single unified
|
|
* `state` object and an updater that merges updates into the existing state, as
|
|
* opposed to replacing it.
|
|
*
|
|
* ```js
|
|
* const [state, setState] = useMergeState({ name: 'Betsy', age: 24 })
|
|
*
|
|
* setState({ name: 'Johan' }) // { name: 'Johan', age: 24 }
|
|
*
|
|
* setState(state => ({ age: state.age + 10 })) // { name: 'Johan', age: 34 }
|
|
* ```
|
|
*
|
|
* @param initialState The initial state object
|
|
*/
|
|
function useMergeState(initialState) {
|
|
const [state, setState] = (0, _react.useState)(initialState);
|
|
const updater = (0, _react.useCallback)(update => {
|
|
if (update === null) return;
|
|
if (typeof update === 'function') {
|
|
setState(state => {
|
|
const nextState = update(state);
|
|
return nextState == null ? state : Object.assign({}, state, nextState);
|
|
});
|
|
} else {
|
|
setState(state => Object.assign({}, state, update));
|
|
}
|
|
}, [setState]);
|
|
return [state, updater];
|
|
} |