import { useSyncExternalStore } from 'react';
 
const store = {
  value: 0,
  listeners: new Set<() => void>(),
  subscribe(callback: () => void) {
    this.listeners.add(callback);
    return () => this.listeners.delete(callback);
  },
  getSnapshot() {
    return this.value;
  },
  increment() {
    this.value++;
    this.listeners.forEach(l => l());
  }
};
 
function ExternalCounter() {
  const value = useSyncExternalStore(store.subscribe, store.getSnapshot);
  return <button onClick={() => store.increment()}>{value}</button>;
}