informed/dist/esm/hooks/useStateWithGetter.js

A lightweight framework and utility for building powerful forms in React applications

import { slicedToArray as _slicedToArray } from '../_virtual/_rollupPluginBabelHelpers.js';
import { useRef, useState } from 'react';
import { useEffectOnce } from './useEffectOnce.js';

// TODO figure out if this is bad?
// https://github.com/facebook/react/issues/14543
function useStateWithGetter(initial) {
  var ref = useRef();
  var mounted = useRef(true);
  var _useState = useState(initial),
    _useState2 = _slicedToArray(_useState, 2),
    state = _useState2[0],
    setState = _useState2[1];
  ref.current = state;
  var set = function set(value) {
    ref.current = value;
    if (mounted.current) setState(value);
  };
  var get = function get() {
    return ref.current;
  };
  useEffectOnce(function () {
    return function () {
      mounted.current = false;
    };
  });
  return [state, set, get];
}

export { useStateWithGetter };