zustand-utils/es/context.js

some utils for zustand

import { createElement, createContext as reactCreateContext, useContext, useRef } from 'react';
import { shallow } from 'zustand/shallow';
import { useStoreWithEqualityFn } from 'zustand/traditional';
/**
 * create context for individual App
 * mostly use for component
 */
export var createContext = function createContext() {
  var params = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
  var defaultEqualityFn = params.equalityFn || shallow;
  var ZustandContext = /*#__PURE__*/reactCreateContext(undefined);
  var Provider = function Provider(_ref) {
    var createStore = _ref.createStore,
      children = _ref.children;
    var storeRef = useRef();
    if (!storeRef.current) {
      storeRef.current = createStore();
    }
    return /*#__PURE__*/createElement(ZustandContext.Provider, {
      value: storeRef.current
    }, children);
  };
  var useStoreApi = function useStoreApi() {
    var store = useContext(ZustandContext);
    if (!store) {
      throw new Error('Seems like you have not used zustand provider as an ancestor.');
    }
    return store;
  };
  var useContextStore = function useContextStore(selector) {
    var equalityFn = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : defaultEqualityFn;
    var store = useStoreApi();
    return useStoreWithEqualityFn(store, selector, equalityFn);
  };
  return {
    Provider: Provider,
    useStore: useContextStore,
    useStoreApi: useStoreApi
  };
};