@e-group/hooks/useControlled.js

eGroup team react-hooks that share across projects.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = useControlled;

var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));

var _react = require("react");

function useControlled({
  controlled,
  default: defaultProp
}) {
  const _useRef = (0, _react.useRef)(controlled !== undefined),
        isControlled = _useRef.current;

  const _useState = (0, _react.useState)(defaultProp),
        _useState2 = (0, _slicedToArray2.default)(_useState, 2),
        valueState = _useState2[0],
        setValue = _useState2[1];

  const value = isControlled ? controlled : valueState;
  const setValueIfUncontrolled = (0, _react.useCallback)(newValue => {
    if (!isControlled) {
      setValue(newValue);
    } // eslint-disable-next-line react-hooks/exhaustive-deps

  }, []);
  return [value, setValueIfUncontrolled];
}