feat(kit): shared state utils

Author: antfu

alias.ts

@@ -11,6 +11,8 @@ export const alias = {
   '@vitejs/devtools-rpc/presets/ws/client': r('rpc/src/presets/ws/client.ts'),
   '@vitejs/devtools-kit/client': r('kit/src/client/index.ts'),
   '@vitejs/devtools-kit/utils/events': r('kit/src/utils/events.ts'),
+  '@vitejs/devtools-kit/utils/nanoid': r('kit/src/utils/nanoid.ts'),
+  '@vitejs/devtools-kit/utils/shared-state': r('kit/src/utils/shared-state.ts'),
   '@vitejs/devtools-kit': r('kit/src/index.ts'),
   '@vitejs/devtools-vite': r('vite/src/index.ts'),
   '@vitejs/devtools/client/inject': r('core/src/client/inject/index.ts'),

packages/core/package.json

@@ -60,6 +60,7 @@
     "birpc-x": "catalog:deps",
     "cac": "catalog:deps",
     "debug": "catalog:deps",
+    "immer": "catalog:deps",
     "launch-editor": "catalog:deps",
     "mlly": "catalog:deps",
     "open": "catalog:deps",

packages/kit/package.json

@@ -23,6 +23,7 @@
     "./client": "./dist/client.mjs",
     "./utils/events": "./dist/utils/events.mjs",
     "./utils/nanoid": "./dist/utils/nanoid.mjs",
+    "./utils/shared-state": "./dist/utils/shared-state.mjs",
     "./package.json": "./package.json"
   },
   "main": "./dist/index.mjs",
@@ -42,7 +43,8 @@
   "dependencies": {
     "@vitejs/devtools-rpc": "workspace:*",
     "birpc": "catalog:deps",
-    "birpc-x": "catalog:deps"
+    "birpc-x": "catalog:deps",
+    "immer": "catalog:deps"
   },
   "devDependencies": {
     "my-ua-parser": "catalog:frontend",

packages/kit/src/utils/shared-state.ts

@@ -0,0 +1,89 @@
+import type { Objectish, Patch } from 'immer'
+import type { EventEmitter } from '../types/events'
+import { applyPatches, produce, produceWithPatches } from 'immer'
+import { createEventEmitter } from './events'
+
+// eslint-disable-next-line ts/no-unsafe-function-type
+type ImmutablePrimitive = undefined | null | boolean | string | number | Function
+
+export type Immutable<T>
+  = T extends ImmutablePrimitive ? T
+    : T extends Array<infer U> ? ImmutableArray<U>
+      : T extends Map<infer K, infer V> ? ImmutableMap<K, V>
+        : T extends Set<infer M> ? ImmutableSet<M> : ImmutableObject<T>
+
+export type ImmutableArray<T> = ReadonlyArray<Immutable<T>>
+export type ImmutableMap<K, V> = ReadonlyMap<Immutable<K>, Immutable<V>>
+export type ImmutableSet<T> = ReadonlySet<Immutable<T>>
+export type ImmutableObject<T> = { readonly [K in keyof T]: Immutable<T[K]> }
+
+/**
+ * State host that is immutable by default with explicit mutate.
+ */
+export interface SharedState<T> {
+  /**
+   * Get the current state. Immutable.
+   */
+  get: () => Immutable<T>
+  /**
+   * Subscribe to state changes.
+   */
+  on: EventEmitter<SharedStateEvents<T>>['on']
+  /**
+   * Mutate the state.
+   */
+  mutate: (fn: (state: T) => void) => void
+  /**
+   * Apply patches to the state.
+   */
+  patch: (patches: Patch[]) => void
+}
+
+export interface SharedStateEvents<T> {
+  updated: (state: T) => void
+  patches: (patches: Patch[]) => void
+}
+
+export interface SharedStateOptions<T> {
+  /**
+   * Initial state.
+   */
+  initialState: T
+  /**
+   * Enable patches.
+   *
+   * @default false
+   */
+  enablePatches?: boolean
+}
+
+export function createSharedState<T extends Objectish>(
+  options: SharedStateOptions<T>,
+): SharedState<T> {
+  const {
+    enablePatches = false,
+  } = options
+
+  const events = createEventEmitter<SharedStateEvents<T>>()
+  let state = options.initialState
+
+  return {
+    on: events.on,
+    get: () => state as Immutable<T>,
+    patch: (patches: Patch[]) => {
+      state = applyPatches<T>(state, patches)
+      events.emit('updated', state)
+    },
+    mutate: (fn) => {
+      if (enablePatches) {
+        const [newState, patches] = produceWithPatches(state, fn)
+        state = newState
+        events.emit('patches', patches)
+      }
+      else {
+        state = produce(state, fn)
+      }
+      events.emit('updated', state)
+    },
+  }
+}

packages/kit/src/utils/state.ts

@@ -0,0 +1,89 @@
+import type { Objectish, Patch } from 'immer'
+import type { EventEmitter } from '../types/events'
+import { applyPatches, produce, produceWithPatches } from 'immer'
+import { createEventEmitter } from './events'
+
+// eslint-disable-next-line ts/no-unsafe-function-type
+type ImmutablePrimitive = undefined | null | boolean | string | number | Function
+
+export type Immutable<T>
+  = T extends ImmutablePrimitive ? T
+    : T extends Array<infer U> ? ImmutableArray<U>
+      : T extends Map<infer K, infer V> ? ImmutableMap<K, V>
+        : T extends Set<infer M> ? ImmutableSet<M> : ImmutableObject<T>
+
+export type ImmutableArray<T> = ReadonlyArray<Immutable<T>>
+export type ImmutableMap<K, V> = ReadonlyMap<Immutable<K>, Immutable<V>>
+export type ImmutableSet<T> = ReadonlySet<Immutable<T>>
+export type ImmutableObject<T> = { readonly [K in keyof T]: Immutable<T[K]> }
+
+/**
+ * State host that is immutable by default with explicit mutate.
+ */
+export interface SharedState<T> {
+  /**
+   * Get the current state. Immutable.
+   */
+  get: () => Immutable<T>
+  /**
+   * Subscribe to state changes.
+   */
+  on: EventEmitter<SharedStateEvents<T>>['on']
+  /**
+   * Mutate the state.
+   */
+  mutate: (fn: (state: T) => void) => void
+  /**
+   * Apply patches to the state.
+   */
+  patch: (patches: Patch[]) => void
+}
+
+export interface SharedStateEvents<T> {
+  updated: (state: T) => void
+  patches: (patches: Patch[]) => void
+}
+
+export interface SharedStateOptions<T> {
+  /**
+   * Initial state.
+   */
+  initialState: T
+  /**
+   * Enable patches.
+   *
+   * @default false
+   */
+  enablePatches?: boolean
+}
+
+export function createSharedState<T extends Objectish>(
+  options: SharedStateOptions<T>,
+): SharedState<T> {
+  const {
+    enablePatches = false,
+  } = options
+
+  const events = createEventEmitter<SharedStateEvents<T>>()
+  let state = options.initialState
+
+  return {
+    on: events.on,
+    get: () => state as Immutable<T>,
+    patch: (patches: Patch[]) => {
+      state = applyPatches<T>(state, patches)
+      events.emit('updated', state)
+    },
+    mutate: (fn) => {
+      if (enablePatches) {
+        const [newState, patches] = produceWithPatches(state, fn)
+        state = newState
+        events.emit('patches', patches)
+      }
+      else {
+        state = produce(state, fn)
+      }
+      events.emit('updated', state)
+    },
+  }
+}

packages/kit/tsdown.config.ts

@@ -5,6 +5,7 @@ export default defineConfig({
     'index': 'src/index.ts',
     'utils/events': 'src/utils/events.ts',
     'utils/nanoid': 'src/utils/nanoid.ts',
+    'utils/shared-state': 'src/utils/shared-state.ts',
     'client': 'src/client/index.ts',
   },
   exports: true,