@ozen-ui/kit/__inner__/cjs/hooks/useControlled/useControlled.js

React component library

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.useControlled = void 0;
var tslib_1 = require("tslib");
/* eslint-disable react-hooks/rules-of-hooks, react-hooks/exhaustive-deps */
var react_1 = require("react");
var logger_1 = require("@ozen-ui/logger");
var lodash_isequal_1 = tslib_1.__importDefault(require("lodash.isequal"));
/** Управляет значением компонента при контролируемом и неконтролируемом поведении */
var useControlled = function (_a) {
    var valueProp = _a.value, defaultProp = _a.defaultValue, name = _a.name, _b = _a.state, state = _b === void 0 ? 'value' : _b;
    /** Определение контролируемого поведения при первом рендере (неизменяемое значение) */
    var isControlled = (0, react_1.useRef)(valueProp !== undefined).current;
    var _c = tslib_1.__read((0, react_1.useState)(defaultProp), 2), valueState = _c[0], setValue = _c[1];
    var value = isControlled ? valueProp : valueState;
    if (process.env.NODE_ENV !== 'production') {
        (0, react_1.useEffect)(function () {
            if (isControlled !== (valueProp !== undefined)) {
                logger_1.logger.error([
                    "\u041F\u043E\u0432\u0435\u0434\u0435\u043D\u0438\u0435 \u0441\u0432\u043E\u0439\u0441\u0442\u0432\u0430 \u00AB".concat(state, "\u00BB \u0443 \u043A\u043E\u043C\u043F\u043E\u043D\u0435\u043D\u0442\u0430 ").concat(name, " \u043F\u043E\u043C\u0435\u043D\u044F\u043B\u043E\u0441\u044C \u0441 ").concat(isControlled ? '' : 'не', "\u043A\u043E\u043D\u0442\u0440\u043E\u043B\u0438\u0440\u0443\u0435\u043C\u043E\u0433\u043E \u043D\u0430 ").concat(isControlled ? 'не' : '', "\u043A\u043E\u043D\u0442\u0440\u043E\u043B\u0438\u0440\u0443\u0435\u043C\u043E\u0435."),
                    "\n",
                    'Компоненты не должны переключаться с неконтролируемого поведения в контролируемое, или наоборот. Поведение определяется после первого рендера и является контролируемым, если значение не «undefined».',
                ].join('\n'));
            }
        }, [state, name, valueProp]);
        var defaultValue_1 = (0, react_1.useRef)(defaultProp).current;
        (0, react_1.useEffect)(function () {
            if (!isControlled && !(0, lodash_isequal_1.default)(defaultValue_1, defaultProp)) {
                logger_1.logger.error([
                    "\u041D\u0435\u043A\u043E\u043D\u0442\u0440\u043E\u043B\u0438\u0440\u0443\u0435\u043C\u044B\u0439 \u043A\u043E\u043C\u043F\u043E\u043D\u0435\u043D\u0442 ".concat(name, " \u0441\u043C\u0435\u043D\u0438\u043B \u0437\u043D\u0430\u0447\u0435\u043D\u0438\u0435 \u043F\u043E \u0443\u043C\u043E\u043B\u0447\u0430\u043D\u0438\u044E \u0434\u043B\u044F \u00AB").concat(state, "\u00BB \u043F\u043E\u0441\u043B\u0435 \u043F\u0435\u0440\u0432\u043E\u0439 \u0438\u043D\u0438\u0446\u0438\u0430\u043B\u0438\u0437\u0430\u0446\u0438\u0438."),
                    "\n",
                    "\u0415\u0441\u043B\u0438 \u043D\u0435\u043E\u0431\u0445\u043E\u0434\u0438\u043C\u043E \u043C\u0435\u043D\u044F\u0442\u044C \u0437\u043D\u0430\u0447\u0435\u043D\u0438\u0435 \u0434\u043B\u044F \u043A\u043E\u043C\u043F\u043E\u043D\u0435\u043D\u0442\u0430 \u0432\u043E\u0441\u043F\u043E\u043B\u044C\u0437\u0443\u0439\u0442\u0435\u0441\u044C \u043A\u043E\u043D\u0442\u0440\u043E\u043B\u0438\u0440\u0443\u0435\u043C\u044B\u043C \u043F\u043E\u0432\u0435\u0434\u0435\u043D\u0438\u0435\u043C.",
                ].join('\n'));
            }
        }, [JSON.stringify(defaultProp)]);
    }
    var setValueIfUncontrolled = (0, react_1.useCallback)(function (newValue) {
        if (!isControlled) {
            setValue(newValue);
        }
    }, []);
    return [value, setValueIfUncontrolled, isControlled];
};
exports.useControlled = useControlled;