A helper to build custom Svelte stores

custom-store.ts

import type { Subscriber } from 'svelte/store';

export function store<T>(start: () => T, stop?: () => void) {
  const subscribers = new Set<Subscriber<T>>();

  let value: T;

  function notify() {
    for (const fn of subscribers) {
      fn(value);
    }
  }

  function set(newValue: T) {
    const oldValue = value;
    value = newValue;
    if (!Object.is(newValue, oldValue)) {
      notify();
    }
  }

  function subscribe(fn: Subscriber<T>) {
    if (subscribers.size === 0) {
      value = start();
    }
    fn(value);
    subscribers.add(fn);
    return () => {
      subscribers.delete(fn);
      if (subscribers.size === 0) {
        stop?.();
      }
    };
  }

  return {
    subscribe,
    notify,
    set,
  };
}