You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
67 lines
1.9 KiB
67 lines
1.9 KiB
"use strict";
|
|
|
|
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
|
|
|
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
exports.default = useControlledState;
|
|
|
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
|
|
var React = _interopRequireWildcard(require("react"));
|
|
|
|
function useControlledState(defaultStateValue, option) {
|
|
var _ref = option || {},
|
|
defaultValue = _ref.defaultValue,
|
|
value = _ref.value,
|
|
onChange = _ref.onChange,
|
|
postState = _ref.postState;
|
|
|
|
var _React$useState = React.useState(function () {
|
|
if (value !== undefined) {
|
|
return value;
|
|
}
|
|
|
|
if (defaultValue !== undefined) {
|
|
return typeof defaultValue === 'function' ? defaultValue() : defaultValue;
|
|
}
|
|
|
|
return typeof defaultStateValue === 'function' ? defaultStateValue() : defaultStateValue;
|
|
}),
|
|
_React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
|
|
innerValue = _React$useState2[0],
|
|
setInnerValue = _React$useState2[1];
|
|
|
|
var mergedValue = value !== undefined ? value : innerValue;
|
|
|
|
if (postState) {
|
|
mergedValue = postState(mergedValue);
|
|
} // setState
|
|
|
|
|
|
var onChangeRef = React.useRef(onChange);
|
|
onChangeRef.current = onChange;
|
|
var triggerChange = React.useCallback(function (newValue) {
|
|
setInnerValue(newValue);
|
|
|
|
if (mergedValue !== newValue && onChangeRef.current) {
|
|
onChangeRef.current(newValue, mergedValue);
|
|
}
|
|
}, [mergedValue, onChangeRef]); // Effect of reset value to `undefined`
|
|
|
|
var firstRenderRef = React.useRef(true);
|
|
React.useEffect(function () {
|
|
if (firstRenderRef.current) {
|
|
firstRenderRef.current = false;
|
|
return;
|
|
}
|
|
|
|
if (value === undefined) {
|
|
setInnerValue(value);
|
|
}
|
|
}, [value]);
|
|
return [mergedValue, triggerChange];
|
|
} |