persist

persist reads the initial value from browser storage, writes changed state back as JSON, and optionally runs migrations for supported storage types.

Signature

persist<T, P extends Array<MigrationFn>>(
  initialState: T | Store<T>,
  options: PersistConfig<T, P>,
): Store<T>
persist(options): <T>(initialState: T | Store<T>) => Store<T>

Local storage example

import { persist } from '@ilokesto/state/middleware';

const store = persist({ theme: 'light' as 'light' | 'dark' }, { local: 'theme' });

const sessionStore = persist({ token: null as string | null }, { session: 'session' });
const cookieStore = persist({ accepted: false }, { cookie: 'cookie-consent' });

Migration example

const settings = persist(
  { theme: 'light', count: 0 },
  {
    local: 'settings',
    migrate: [
      (old) => ({ theme: String(old), count: 0 }),
      (old) => ({ ...old, count: Number(old.count ?? 0) }),
    ],
  },
);

Storage format and caveats

Values are stored as { state, version } JSON.
version is based on migration array length.
Migrations run for local and cookie, not session.
Storage read/write failures are caught and logged in the browser.
Cookie writing uses a simple document.cookie = key=value assignment; configure advanced cookie attributes outside this helper if needed.

persist

Signature

Local storage example

Session and cookie storage

Migration example

Storage format and caveats

On this page