usePersistentState.ts 480 Bytes
import { watch, type Ref } from 'vue'

export function loadStoredValue<T>(key: string, fallback: T): T {
  try {
    const raw = window.localStorage.getItem(key)
    if (!raw) {
      return fallback
    }
    return JSON.parse(raw) as T
  } catch {
    return fallback
  }
}

export function bindPersistentState<T>(key: string, source: Ref<T>) {
  watch(
    source,
    (value) => {
      window.localStorage.setItem(key, JSON.stringify(value))
    },
    { deep: true },
  )
}