wana/dist/shared/4c241fe8.js

Easy observable state for React

'use strict';

var React = require('react');
var reactLayoutEffect = require('react-layout-effect');
var useMemoOne = require('use-memo-one');
var symbols = require('./c9633b27.js');
var no = require('./ffee02eb.js');

function _interopNamespace(e) {
  if (e && e.__esModule) return e;
  var n = Object.create(null);
  if (e) {
    Object.keys(e).forEach(function (k) {
      if (k !== 'default') {
        var d = Object.getOwnPropertyDescriptor(e, k);
        Object.defineProperty(n, k, d.get ? d : {
          enumerable: true,
          get: function () {
            return e[k];
          }
        });
      }
    });
  }
  n['default'] = e;
  return Object.freeze(n);
}

var React__namespace = /*#__PURE__*/_interopNamespace(React);

const depth = React__namespace.createContext(0);
const AutoDepth = depth.Provider;
const useAutoDepth = () => React__namespace.useContext(depth);

function useChanges(target, onChange, deps) {
  const observable = target[symbols.$O];
  if (!observable) {
    throw Error("Expected an observable object");
  }
  const observer = useMemoOne.useMemoOne(() => ({onChange}), symbols.emptyArray);
  reactLayoutEffect.useLayoutEffect(() => {
    observer.onChange = no.no(onChange);
  }, deps);
  reactLayoutEffect.useLayoutEffect(() => {
    const observers = observable.get(symbols.$O);
    observers.add(observer);
    return () => {
      observers.delete(observer);
    };
  }, [observable]);
}

exports.AutoDepth = AutoDepth;
exports.useAutoDepth = useAutoDepth;
exports.useChanges = useChanges;
//# sourceMappingURL=4c241fe8.js.map