Skip to content
D
Documentation

zustand/middleware

reference
2 min readUpdated

Part of the zustand package: install zustand and import these from zustand/middleware.

Functions

combine

ts
function combine<
  T extends object,
  U extends object,
  Mps extends [StoreMutatorIdentifier, unknown][] = [],
  Mcs extends [StoreMutatorIdentifier, unknown][] = [],
>(
  initialState: T,
  create: StateCreator<T, Mps, Mcs, U>,
): StateCreator<Write<T, U>, Mps, Mcs>

createJSONStorage

ts
function createJSONStorage<S, R = unknown>(
  getStorage: () => StateStorage<R>,
  options?: JsonStorageOptions,
): PersistStorage<S, unknown> | undefined

unstable_ssrSafe

ts
function ssrSafe<
  T extends object,
  U extends object,
  Mps extends [StoreMutatorIdentifier, unknown][] = [],
  Mcs extends [StoreMutatorIdentifier, unknown][] = [],
>(
  config: StateCreator<T, Mps, Mcs, U>,
  isSSR: boolean = typeof window === 'undefined',
): StateCreator<T, Mps, Mcs, U>

Constants

devtools

ts
const devtools: Devtools

persist

ts
const persist: Persist

redux

ts
const redux: Redux

subscribeWithSelector

ts
const subscribeWithSelector: SubscribeWithSelector

Interfaces

DevtoolsOptions

ts
interface DevtoolsOptions extends Config

Properties

NameTypeDefaultDescription
name?string
enabled?boolean
anonymousActionType?string
store?string

PersistOptions

ts
interface PersistOptions<
  S,
  PersistedState = S,
  PersistReturn = unknown,
>

Properties

NameTypeDefaultDescription
namestringName of the storage (must be unique)
storage?PersistStorage<PersistedState, PersistReturn> | undefinedcreateJSONStorage(() => window.localStorage)Use a custom persist storage.
partialize?(state: S) => PersistedStateFilter the persisted value.
onRehydrateStorage?( state: S, ) => ((state?: S, error?: unknown) => void) | voidA function returning another (optional) function. The main function will be called before the state rehydration. The returned function will be called after the state rehydration or when an error occurred.
version?numberIf the stored state's version mismatch the one specified here, the storage will not be used. This is useful when adding a breaking change to your store.
migrate?( persistedState: unknown, version: number, ) => PersistedState | Promise<PersistedState>A function to perform persisted state migration. This function will be called when persisted state versions mismatch with the one specified here.
merge?(persistedState: unknown, currentState: S) => SA function to perform custom hydration merges when combining the stored state with the current one. By default, this function does a shallow merge.
skipHydration?booleanfalseAn optional boolean that will prevent the persist middleware from triggering hydration on initialization, This allows you to call rehydrate() at a specific point in your apps rendering life-cycle.

PersistStorage

ts
interface PersistStorage<S, R = unknown>

Properties

NameTypeDefaultDescription
getItem( name: string, ) => StorageValue<S> | null | Promise<StorageValue<S> | null>
setItem(name: string, value: StorageValue<S>) => R
removeItem(name: string) => R

StateStorage

ts
interface StateStorage<R = unknown>

Properties

NameTypeDefaultDescription
getItem(name: string) => string | null | Promise<string | null>
setItem(name: string, value: string) => R
removeItem(name: string) => R

Types

NamedSet

ts
type NamedSet<T> = WithDevtools<StoreApi<T>>['setState']

StorageValue

ts
type StorageValue<S> = { … }

Properties

NameTypeDefaultDescription
stateS
version?number

Was this page helpful?

zustand/middleware — zustand · GPT-5.6 Luna