react-tately/src/createStore.ts

Minimal, powerful global state manager for React

import { useSyncExternalStore } from 'react';

type Listener = () => void;

export function createStore<T>(initialValue: T) {
  let state = initialValue;
  const listeners = new Set<Listener>();

  const setState = (updater: (prev: T) => T) => {
    state = updater(state);
    listeners.forEach(listener => listener());
  };

  const subscribe = (listener: Listener) => {
    listeners.add(listener);
    return () => listeners.delete(listener);
  };

  const useStore = (): [T, typeof setState] => {
    const snapshot = useSyncExternalStore(subscribe, () => state);
    return [snapshot, setState];
  };

  return useStore;
}