useSessionStorageState

Same API and guarantees as useLocalStorageState, but backed by sessionStorage — state lives until the tab closes. Ideal for wizard steps, scroll positions, or any throwaway-per-session state

Step 1 / 3: Account

The step survives a reload, but resets when you close the tab. A new tab starts fresh.


import { useSessionStorageState } from 'react-stateful-hooks';
 
const [step, setStep] = useSessionStorageState('wizard:step', 0);

Signature


const [value, setValue, removeValue] = useSessionStorageState<T>(
  key: string,
  defaultValue: T,
  options?: {
    serializer?: { parse(raw: string): T; stringify(value: T): string };
    syncTabs?: boolean; // default: true
  },
);

The serializer, resilience, and same-tab sync behaviour are identical to useLocalStorageState. Note that sessionStorage is per-tab, so cross-tab sync via the storage event does not apply between separate tabs