### Install Project Dependencies

Source: https://github.com/tanstack/persist/blob/main/CONTRIBUTING.md

Ensure you have pnpm installed. Then, install project dependencies and linkages by running this command from the project root.

```bash
pnpm install
```

--------------------------------

### Commit Example Changes

Source: https://github.com/tanstack/persist/blob/main/CONTRIBUTING.md

When committing changes related to adding a new example, use a commit message following this pattern.

```bash
docs: Add example-name
```

--------------------------------

### Install React Persist

Source: https://github.com/tanstack/persist/blob/main/docs/installation.md

Install the React-specific package for use with React projects. Requires React v16.8+.

```sh
npm install @tanstack/react-persist
```

--------------------------------

### Install Vanilla JS Persist

Source: https://github.com/tanstack/persist/blob/main/docs/installation.md

Install the core package for use with vanilla JavaScript or any framework. This package is also re-exported by framework-specific packages.

```sh
npm install @tanstack/persist
```

--------------------------------

### Install TanStack React Persist and Vanilla JS Persist

Source: https://github.com/tanstack/persist/blob/main/README.md

Install the appropriate package based on your framework choice. `@tanstack/react-persist` is for React applications, while `@tanstack/persist` is for vanilla JavaScript.

```bash
# Npm
npm install @tanstack/react-persist
npm install @tanstack/persist # no framework, just vanilla js
```

--------------------------------

### Import Core Persister Utilities

Source: https://github.com/tanstack/persist/blob/main/docs/framework/react/adapter.md

Import core Persister classes or functions like `debounce` and `Debouncer` directly from the React Adapter package. This avoids the need to install the core package separately.

```tsx
import { debounce, Debouncer } from '@tanstack/react-persist' // no need to install the core package separately
```

--------------------------------

### Build Project

Source: https://github.com/tanstack/persist/blob/main/CONTRIBUTING.md

Build the project or watch for changes during development using this command.

```bash
pnpm build
```

--------------------------------

### Create a Changeset

Source: https://github.com/tanstack/persist/blob/main/CONTRIBUTING.md

Create a changelog entry for your changes by running this command.

```bash
pnpm changeset
```

--------------------------------

### Constructor

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/AsyncPersister.md

Initializes a new instance of the AsyncPersister class.

```APIDOC
## Constructor

### Description
Initializes a new instance of the AsyncPersister class.

### Signature
```ts
new AsyncPersister<TState, TSelected>(key: string): AsyncPersister<TState, TSelected>
```

### Parameters
#### key
- **key** (string) - The unique key to identify the persisted state.
```

--------------------------------

### Auto-build and Auto-test Files

Source: https://github.com/tanstack/persist/blob/main/CONTRIBUTING.md

To auto-build and auto-test files as you edit them, run this command from the project root.

```bash
pnpm dev
```

--------------------------------

### StoragePersisterOptions Interface

Source: https://github.com/tanstack/persist/blob/main/docs/reference/interfaces/StoragePersisterOptions.md

Configuration options for creating a browser-based state persister.

```APIDOC
## Interface: StoragePersisterOptions<TState, TSelected>

Defined in: [storage-persister.ts:19](https://github.com/TanStack/persist/blob/main/packages/persist/src/storage-persister.ts#L19)

Configuration options for creating a browser-based state persister. The persister can use either localStorage (persists across browser sessions) or sessionStorage (cleared when browser tab/window closes) to store serialized state.

### Type Parameters

#### TState

`TState`

#### TSelected

`TSelected` *extends* `Partial`&lt;`TState`&gt; = `TState`

### Properties

#### buster?

```ts
optional buster: string;
```

Defined in: [storage-persister.ts:27](https://github.com/TanStack/persist/blob/main/packages/persist/src/storage-persister.ts#L27)

A version string used to invalidate cached state. When changed, any existing stored state will be considered invalid and cleared.

***

#### defaultState?

```ts
optional defaultState: TState;
```

Defined in: [storage-persister.ts:31](https://github.com/TanStack/persist/blob/main/packages/persist/src/storage-persister.ts#L31)

The default state to use if no state is found in storage.

***

#### deserializer?()

```ts
optional deserializer: (state) => PersistedStorage<TSelected>;
```

Defined in: [storage-persister.ts:38](https://github.com/TanStack/persist/blob/main/packages/persist/src/storage-persister.ts#L38)

Optional function to customize how state is deserialized after loading from storage. By default, JSON.parse is used. Optionally, consider using SuperJSON for better deserialization of complex objects. See https://github.com/flightcontrolhq/superjson

##### Parameters

*   **state** (`string`)

##### Returns

[`PersistedStorage`](../PersistedStorage.md)&lt;`TSelected`&gt;

***

#### key

```ts
key: string;
```

Defined in: [storage-persister.ts:42](https://github.com/TanStack/persist/blob/main/packages/persist/src/storage-persister.ts#L42)

Unique identifier used as the storage key for persisting state.

***

#### maxAge?

```ts
optional maxAge: number;
```

Defined in: [storage-persister.ts:47](https://github.com/TanStack/persist/blob/main/packages/persist/src/storage-persister.ts#L47)

Maximum age in milliseconds before stored state is considered expired. When exceeded, the state will be cleared and treated as if it doesn't exist.

***

#### onLoadState?()

```ts
optional onLoadState: (state, storagePersister) => void;
```

Defined in: [storage-persister.ts:51](https://github.com/TanStack/persist/blob/main/packages/persist/src/storage-persister.ts#L51)

Optional callback that runs after state is successfully loaded.

##### Parameters

*   **state** (`TSelected` | `undefined`)
*   **storagePersister** ([`StoragePersister`](../../classes/StoragePersister.md)&lt;`TState`, `TSelected`&gt;)

##### Returns

`void`

***

#### onLoadStateError?()

```ts
optional onLoadStateError: (error, storagePersister) => void;
```

Defined in: [storage-persister.ts:58](https://github.com/TanStack/persist/blob/main/packages/persist/src/storage-persister.ts#L58)

Optional callback that runs after state is unable to be loaded.

##### Parameters

*   **error** (`Error`)
*   **storagePersister** ([`StoragePersister`](../../classes/StoragePersister.md)&lt;`TState`, `TSelected`&gt;)

##### Returns

`void`

***

#### onSaveState?()

```ts
optional onSaveState: (state, storagePersister) => void;
```

Defined in: [storage-persister.ts:65](https://github.com/TanStack/persist/blob/main/packages/persist/src/storage-persister.ts#L65)

Optional callback that runs after state is successfully saved.

##### Parameters

*   **state** (`TSelected`)
*   **storagePersister** ([`StoragePersister`](../../classes/StoragePersister.md)&lt;`TState`, `TSelected`&gt;)

##### Returns

`void`

***

#### onSaveStateError?()

```ts
optional onSaveStateError: (error, storagePersister) => void;
```

Defined in: [storage-persister.ts:73](https://github.com/TanStack/persist/blob/main/packages/persist/src/storage-persister.ts#L73)

Optional callback that runs after state is unable to be saved. For example, if the storage is full (localStorage >= 5MB)

##### Parameters

*   **error** (`Error`)
*   **storagePersister** ([`StoragePersister`](../../classes/StoragePersister.md)&lt;`TState`, `TSelected`&gt;)

##### Returns

`void`

***

#### select?()

```ts
optional select: (state) => TSelected;
```

Defined in: [storage-persister.ts:91](https://github.com/TanStack/persist/blob/main/packages/persist/src/storage-persister.ts#L91)

Optional function to filter which parts of the state are persisted and loaded. When provided, only the filtered state will be saved to storage and returned when loading. This is useful for excluding sensitive or temporary data from persistence. Note: Don't use this to replace the serialization. Use the `serializer` option instead for that.

##### Parameters

*   **state** (`TState`)

##### Returns

`TSelected`

***
```

--------------------------------

### Run All Tests

Source: https://github.com/tanstack/persist/blob/main/CONTRIBUTING.md

Ensure all tests pass before committing your changes by running this command.

```bash
pnpm test
```

--------------------------------

### StoragePersister Constructor

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/StoragePersister.md

Initializes a new instance of the StoragePersister class. It requires an options object that includes a unique key for storage and can optionally include storage type, cache busting, max age, state transformation, and callbacks for save/load operations.

```APIDOC
## Constructor

### Description
Initializes a new instance of the StoragePersister class.

### Signature
```typescript
new StoragePersister<TState, TSelected>(initialOptions: StoragePersisterOptions<TState, TSelected>): StoragePersister<TState, TSelected>
```

### Parameters
#### initialOptions
- **initialOptions** (StoragePersisterOptions<TState, TSelected>) - Required - An object containing configuration options for the persister.
```

--------------------------------

### Persister Constructor

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/Persister.md

Initializes a new Persister instance with a unique key for state identification.

```APIDOC
## Constructor

### Description
Initializes a new Persister instance.

### Signature
```typescript
new Persister<TState, TSelected>(key: string): Persister<TState, TSelected>
```

### Parameters
#### key
- **key** (string) - The unique key used to identify and store the state.
```

--------------------------------

### loadState()

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/Persister.md

Abstract method to load the state from the storage medium. Implementations must provide the logic for retrieving the state.

```APIDOC
## loadState()

### Description
Abstract method to load the state from the storage medium.

### Signature
```typescript
abstract loadState(): TSelected | undefined
```

### Returns
- `TSelected | undefined` - The loaded state, or undefined if no state is found.
```

--------------------------------

### Instantiate StoragePersister

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/StoragePersister.md

Instantiate a StoragePersister with various configuration options including key, storage type, cache busting, max age, state transformation, and callbacks for save/load operations and errors.

```typescript
const persister = new StoragePersister({
  key: 'my-rate-limiter', // required
  storage: window.localStorage,
  buster: 'v2',
  maxAge: 1000 * 60 * 60, // 1 hour
  stateTransform: (state) => ({
    // Only persist specific parts of the state
    count: state.count,
    lastReset: state.lastReset,
    // Exclude sensitive or temporary data
  }),
  onSaveState: (key, state) => console.log('State saved:', key, state),
  onLoadState: (key, state) => console.log('State loaded:', key, state),
  onLoadStateError: (key, error) => console.error('Error loading state:', key, error),
  onSaveStateError: (key, error) => console.error('Error saving state:', key, error)
})
```

--------------------------------

### storage

Source: https://github.com/tanstack/persist/blob/main/docs/reference/interfaces/StoragePersisterOptions.md

The browser storage implementation to use for persisting state. Defaults to window.localStorage.

```APIDOC
## storage

### Description
The browser storage implementation to use for persisting state. Typically window.localStorage or window.sessionStorage.

### Parameters
- **storage** (`Storage | null`) - The storage object to use. Defaults to `window.localStorage`.
```

--------------------------------

### setOptions

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/StoragePersister.md

Updates the persister's options after initialization. This allows for dynamic changes to configuration like storage type or callbacks.

```APIDOC
## setOptions()

### Description
Updates the persister options.

### Signature
```typescript
setOptions(newOptions: Partial<StoragePersisterOptions<TState, TSelected>>): void
```

### Parameters
#### newOptions
- **newOptions** (Partial<StoragePersisterOptions<TState, TSelected>>) - An object containing the options to update.
```

--------------------------------

### AsyncPersister Constructor

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/AsyncPersister.md

Initializes an AsyncPersister instance with a unique key for state management.

```typescript
new AsyncPersister<TState, TSelected>(key): AsyncPersister<TState, TSelected>
```

--------------------------------

### Basic Usage of useLocalStorageState

Source: https://github.com/tanstack/persist/blob/main/docs/framework/react/reference/functions/useLocalStorageState.md

Demonstrates how to use the useLocalStorageState hook to manage a state value that is persisted in localStorage. It returns the current state and a function to update it.

```tsx
const [value, setValue] = useLocalStorageState('my-key', 'initial value')
```

--------------------------------

### Basic Usage of useSessionStorageState

Source: https://github.com/tanstack/persist/blob/main/docs/framework/react/reference/functions/useSessionStorageState.md

Demonstrates how to use the useSessionStorageState hook to manage a string value. It initializes the state with 'initial value' and provides a setter function.

```tsx
const [value, setValue] = useSessionStorageState('my-key', 'initial value')
```

--------------------------------

### Implement a Custom Persister

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/Persister.md

Extend the Persister class to create a custom state persistence solution. Implement the abstract methods for loading, saving, and clearing state according to your storage needs.

```typescript
class MyPersister extends Persister<MyState> {
  constructor() {
    super(key)
  }

  loadState(): MyState | undefined {
    // Load state from storage
    return state
  }

  saveState(, state: MyState): void {
    // Save state to storage
  }

  clearState(useDefaultState?: boolean): void {
    // Clear state from storage or set the default state if provided and specified to be used
  }
}
```

--------------------------------

### saveState()

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/Persister.md

Abstract method to save the provided state to the storage medium. Implementations must define how the state is persisted.

```APIDOC
## saveState()

### Description
Abstract method to save the provided state to the storage medium.

### Signature
```typescript
abstract saveState(state: TState): void
```

### Parameters
#### state
- **state** (TState) - The state to be saved.
```

--------------------------------

### StoragePersister loadState Method

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/StoragePersister.md

Loads the state from the configured browser storage.

```typescript
loadState(): TSelected | undefined
```

--------------------------------

### AsyncPersister loadState Method

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/AsyncPersister.md

Abstract method to asynchronously load the persisted state. Returns the selected state or undefined if no state is found.

```typescript
abstract loadState: () => TSelected | undefined
```

--------------------------------

### loadState

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/StoragePersister.md

Loads the state from the configured browser storage. The state is automatically deserialized from JSON.

```APIDOC
## loadState()

### Description
Loads the state from storage.

### Signature
```typescript
loadState(): TSelected | undefined
```

### Returns
- `TSelected | undefined` - The loaded state, or undefined if no state is found or an error occurs.
```

--------------------------------

### loadState()

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/AsyncPersister.md

Loads the persisted state asynchronously.

```APIDOC
## loadState()

### Description
Loads the persisted state asynchronously. This method should be implemented by subclasses.

### Signature
```ts
abstract loadState(): TSelected | undefined
```

### Returns
- `TSelected | undefined` - The loaded state or undefined if no state is found.
```

--------------------------------

### serializer

Source: https://github.com/tanstack/persist/blob/main/docs/reference/interfaces/StoragePersisterOptions.md

An optional function to customize how state is serialized before saving to storage. Defaults to JSON.stringify.

```APIDOC
## serializer()

### Description
Optional function to customize how state is serialized before saving to storage. By default, JSON.stringify is used.

### Parameters
#### state
- **state** (`PersistedStorage<TSelected>`) - Description of the state parameter.

### Returns
- `string` - The serialized state.
```

--------------------------------

### clearState()

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/Persister.md

Abstract method to clear the state from the storage medium. Optionally, it can be used to set a default state.

```APIDOC
## clearState()

### Description
Abstract method to clear the state from the storage medium. If `useDefaultState` is true, it may set the default state.

### Signature
```typescript
abstract clearState(useDefaultState?: boolean): void
```

### Parameters
#### useDefaultState
- **useDefaultState** (boolean) - Optional. If true, may set the default state.
```

--------------------------------

### StoragePersister subscribeToStorage Method

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/StoragePersister.md

Subscribes to storage events to listen for changes.

```typescript
subscribeToStorage(): void
```

--------------------------------

### useLocalStorageState

Source: https://github.com/tanstack/persist/blob/main/docs/framework/react/reference/index.md

A hook for managing state that is persisted in local storage.

```APIDOC
## useLocalStorageState

### Description
Manages state that is persisted in local storage. This hook provides a convenient way to synchronize component state with local storage, ensuring that state is preserved across page reloads.

### Signature
useLocalStorageState(key: string, options?: UseLocalStorageStateOptions)

### Parameters
#### Path Parameters
None

#### Query Parameters
None

#### Request Body
None

### Parameters
- **key** (string) - Required - The unique key under which the state will be stored in local storage.
- **options** (object) - Optional - Configuration options for the hook.
  - **serializer** (object) - Optional - An object with `serialize` and `deserialize` functions for custom data handling.
  - **initializer** (function) - Optional - A function that returns the initial state if no value is found in local storage.
  - **delayMs** (number) - Optional - The delay in milliseconds before persisting the state to local storage.

### Request Example
```javascript
import { useLocalStorageState } from '@tanstack/react-persist'

function MyComponent() {
  const [count, setCount] = useLocalStorageState('my-count', {
    initializer: () => 0,
    delayMs: 500
  })

  return (
    <div>
      <p>Count: {count}</p>
      <button onClick={() => setCount(count + 1)}>Increment</button>
    </div>
  )
}
```

### Response
#### Success Response (200)
This hook does not have a direct success response in the traditional API sense. It returns the current state value and a function to update it.

- **state** (any) - The current state value.
- **setState** (function) - A function to update the state value.

#### Response Example
None
```

--------------------------------

### useStoragePersister

Source: https://github.com/tanstack/persist/blob/main/docs/framework/react/reference/index.md

A hook for creating a persister that uses browser storage (local or session).

```APIDOC
## useStoragePersister

### Description
Creates a persister instance that utilizes browser storage (local or session) to persist data. This hook is useful for integrating with state management libraries that support custom persisters.

### Signature
useStoragePersister(storage: Storage, options?: UseStoragePersisterOptions)

### Parameters
#### Path Parameters
None

#### Query Parameters
None

#### Request Body
None

### Parameters
- **storage** (Storage) - Required - The browser storage object to use (e.g., `localStorage`, `sessionStorage`).
- **options** (object) - Optional - Configuration options for the persister.
  - **key** (string) - Required - The key under which data will be stored.
  - **serializer** (object) - Optional - An object with `serialize` and `deserialize` functions for custom data handling.
  - **retryMs** (number) - Optional - The time in milliseconds to wait before retrying a failed operation.

### Request Example
```javascript
import { useStoragePersister } from '@tanstack/react-persist'
import { createSyncStoragePersister } from 'axios-cache-interceptor'

function App() {
  const localStoragePersister = useStoragePersister(localStorage, {
    key: 'my-app-cache',
    serializer: {
      serialize: JSON.stringify,
      deserialize: JSON.parse
    }
  })

  // You can then use this persister with a state management library
  // For example, with axios-cache-interceptor:
  // const persister = createSyncStoragePersister({
  //   storage: localStorage,
  //   key: 'my-app-cache'
  // })

  return (
    <div>
      Persister created.
    </div>
  )
}
```

### Response
#### Success Response (200)
This hook returns a persister instance that can be used with compatible libraries.

- **persister** (object) - An object conforming to the persister interface, with methods like `persist`, `load`, `remove`, etc.

#### Response Example
None
```

--------------------------------

### StoragePersister Constructor

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/StoragePersister.md

The constructor for the StoragePersister class, accepting initial options to configure its behavior.

```typescript
new StoragePersister<TState, TSelected>(initialOptions): StoragePersister<TState, TSelected>
```

--------------------------------

### AsyncPersister saveState Method

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/AsyncPersister.md

Abstract method to asynchronously save the current state. Accepts the state to be persisted.

```typescript
abstract saveState: (state) => void
```

--------------------------------

### subscribeToStorage

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/StoragePersister.md

Subscribes to storage events, allowing the persister to react to external changes in the browser's storage.

```APIDOC
## subscribeToStorage()

### Description
Subscribes to storage events.

### Signature
```typescript
subscribeToStorage(): void
```
```

--------------------------------

### OptionalKeys<T, TKey>

Source: https://github.com/tanstack/persist/blob/main/docs/reference/type-aliases/OptionalKeys.md

This type alias takes two type parameters: `T` (the base type) and `TKey` (a union of keys from `T` that should be made optional). It works by omitting the `TKey` properties from `T` and then intersecting that with a `Partial` version of `T` that only includes the `TKey` properties. This effectively makes the specified keys optional while keeping the rest of the properties as they were.

```APIDOC
## Type Alias: OptionalKeys<T, TKey>

### Description
Creates a new type by making specified keys optional. It omits the keys specified by `TKey` from the base type `T` and then intersects this with a partial version of `T` containing only the `TKey` properties.

### Type Parameters

*   **T**
    The base type from which to derive the new type.

*   **TKey**
    A union of keys from `T` that should be made optional. This type parameter must extend `keyof T`.

### Definition
```ts
type OptionalKeys<T, TKey> = Omit<T, TKey> & Partial<Pick<T, TKey>>;
```

### Source
Defined in: [types.ts:12](https://github.com/TanStack/persist/blob/main/packages/persist/src/types.ts#L12)
```

--------------------------------

### StoragePersister setOptions Method

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/StoragePersister.md

Updates the persister's options after instantiation.

```typescript
setOptions(newOptions): void
```

--------------------------------

### saveState()

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/AsyncPersister.md

Saves the current state asynchronously.

```APIDOC
## saveState()

### Description
Saves the current state asynchronously. This method should be implemented by subclasses.

### Signature
```ts
abstract saveState(state: TState): void
```

### Parameters
#### state
- **state** (TState) - The state to save.
```

--------------------------------

### useLocalStorageState Hook

Source: https://github.com/tanstack/persist/blob/main/docs/framework/react/reference/functions/useLocalStorageState.md

This hook persists state to localStorage and syncs it across tabs. It takes a key, an initial value, and optional options, returning the current state and a function to update it.

```APIDOC
## Function: useLocalStorageState()

A hook that persists state to localStorage and syncs it across tabs.

### Signature

```ts
function useLocalStorageState<TValue, TSelected>(
   key: string,
   initialValue: TValue,
   options?: Omit<StoragePersisterOptions<TValue, TSelected>, "storage" | "key">
): readonly [TValue | TSelected, Dispatch<SetStateAction<TValue | TSelected>>];
```

### Type Parameters

*   **TValue**
    The type of the value being stored.
*   **TSelected**
    `TSelected` extends `Partial<TValue>` = `TValue`
    The type of the selected value, defaults to `TValue`.

### Parameters

*   **key** (`string`) - Required
    The unique key to use for storing the value in localStorage.
*   **initialValue** (`TValue`) - Required
    The initial value to use if no value is found in localStorage.
*   **options?** (`Omit<StoragePersisterOptions<TValue, TSelected>, "storage" | "key">`) - Optional
    Configuration options for the storage persister, excluding 'storage' and 'key'.

### Returns

*   `readonly [TValue | TSelected, Dispatch<SetStateAction<TValue | TSelected>>]`
    A tuple containing the current state value and a function to update it.

### Example

```tsx
import { useLocalStorageState } from '@tanstack/react-persist';

const [value, setValue] = useLocalStorageState('my-key', 'initial value');

// To use with options:
// const [value, setValue] = useLocalStorageState('my-key', 'initial value', {
//   serializer: JSON.stringify,
//   deserializer: JSON.parse,
// });
```
```

--------------------------------

### PersistedStorage Interface

Source: https://github.com/tanstack/persist/blob/main/docs/reference/interfaces/PersistedStorage.md

This interface represents a storage mechanism that can persist state. It includes properties for an optional version buster, the state itself, and a timestamp.

```APIDOC
## Interface: PersistedStorage<TState, TSelected>

### Type Parameters

- **TState**: Represents the type of the state being stored.
- **TSelected**: Represents the type of the selected portion of the state, defaulting to the full `TState`.

### Properties

- **buster?** (string) - Optional. A string used for cache busting or versioning.
- **state** (TSelected | undefined) - The persisted state or undefined if not yet set.
- **timestamp** (number) - A number representing the timestamp of the last update or retrieval.
```

--------------------------------

### Persister Constructor Signature

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/Persister.md

The constructor for the Persister class requires a unique key to identify the state being persisted.

```typescript
new Persister<TState, TSelected>(key): Persister<TState, TSelected>;
```

--------------------------------

### clearState

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/StoragePersister.md

Clears the state from storage. Optionally, it can set the default state if provided and specified to be used.

```APIDOC
## clearState()

### Description
Clears the state from storage or sets the default state if provided and specified to be used.

### Signature
```typescript
clearState(useDefaultState: boolean = false): void
```

### Parameters
#### useDefaultState
- **useDefaultState** (boolean) - Optional - If true, the default state will be set. Defaults to `false`.
```

--------------------------------

### RequiredKeys<T, K>

Source: https://github.com/tanstack/persist/blob/main/docs/reference/type-aliases/RequiredKeys.md

This type alias takes two type parameters: `T` (the object type) and `K` (a union of keys from `T`). It returns a new type where the keys specified in `K` are made required, and all other keys from `T` are preserved with their original optionality.

```APIDOC
## Type Alias: RequiredKeys<T, K>

### Type Parameters

#### T

`T` *extends* `object`

#### K

`K` *extends* `keyof T`

### Definition

```ts
type RequiredKeys<T, K> = Required<Pick<T, K>> & Omit<T, K>;
```
```

--------------------------------

### StoragePersister saveState Method

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/StoragePersister.md

Saves the provided state to the configured browser storage.

```typescript
saveState(state): void
```

--------------------------------

### saveState

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/StoragePersister.md

Saves the current state to the configured browser storage (localStorage or sessionStorage). The state is automatically serialized to JSON.

```APIDOC
## saveState()

### Description
Saves the state to storage.

### Signature
```typescript
saveState(state: TState | TSelected): void
```

### Parameters
#### state
- **state** (TState | TSelected) - The state to be saved.
```

--------------------------------

### Persister loadState Method Signature

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/Persister.md

The loadState method is an abstract method that subclasses must implement to retrieve and return the persisted state. It returns the state or undefined if no state is found.

```typescript
abstract loadState: () => TSelected | undefined;
```

--------------------------------

### useSessionStorageState

Source: https://github.com/tanstack/persist/blob/main/docs/framework/react/reference/index.md

A hook for managing state that is persisted in session storage.

```APIDOC
## useSessionStorageState

### Description
Manages state that is persisted in session storage. This hook synchronizes component state with session storage, meaning the state is available for the duration of the browser tab session.

### Signature
useSessionStorageState(key: string, options?: UseSessionStorageStateOptions)

### Parameters
#### Path Parameters
None

#### Query Parameters
None

#### Request Body
None

### Parameters
- **key** (string) - Required - The unique key under which the state will be stored in session storage.
- **options** (object) - Optional - Configuration options for the hook.
  - **serializer** (object) - Optional - An object with `serialize` and `deserialize` functions for custom data handling.
  - **initializer** (function) - Optional - A function that returns the initial state if no value is found in session storage.
  - **delayMs** (number) - Optional - The delay in milliseconds before persisting the state to session storage.

### Request Example
```javascript
import { useSessionStorageState } from '@tanstack/react-persist'

function MyComponent() {
  const [user, setUser] = useSessionStorageState('user-data', {
    initializer: () => ({ name: 'Guest' })
  })

  return (
    <div>
      <p>Welcome, {user.name}!</p>
      <button onClick={() => setUser({ name: 'Admin' })}>Login as Admin</button>
    </div>
  )
}
```

### Response
#### Success Response (200)
This hook does not have a direct success response in the traditional API sense. It returns the current state value and a function to update it.

- **state** (any) - The current state value.
- **setState** (function) - A function to update the state value.

#### Response Example
None
```

--------------------------------

### key Property

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/Persister.md

The unique key associated with this persister instance, used for identifying the stored state.

```APIDOC
## key Property

### Description
The unique key used to identify the stored state.

### Type
`string` (readonly)
```

--------------------------------

### Define AnyFunction Type Alias

Source: https://github.com/tanstack/persist/blob/main/docs/reference/type-aliases/AnyFunction.md

Use this type alias to define functions that can take any arguments and return any value. This is a broad type definition for flexible function signatures.

```typescript
type AnyFunction = (...args) => any;
```

--------------------------------

### useStoragePersister

Source: https://github.com/tanstack/persist/blob/main/docs/framework/react/reference/functions/useStoragePersister.md

The `useStoragePersister` hook is a React hook that allows you to persist your application's state to browser storage (like localStorage or sessionStorage) and retrieve it. It takes an options object and returns a StoragePersister instance.

```APIDOC
## Function: useStoragePersister()

```ts
function useStoragePersister<TState, TSelected>(options): StoragePersister<TState, TSelected>;
```

### Type Parameters

- **TState**: The type of the state being persisted.
- **TSelected**: The type of the selected state, which extends `Partial<TState>` and defaults to `TState`.

### Parameters

- **options** (`StoragePersisterOptions<TState, TSelected>`): An object containing configuration options for the persister.

### Returns

- `StoragePersister<TState, TSelected>`: An instance of `StoragePersister` that handles state persistence.
```

--------------------------------

### AnyFunction Type Alias

Source: https://github.com/tanstack/persist/blob/main/docs/reference/type-aliases/AnyFunction.md

This type alias defines a function signature that is highly flexible, accepting any arguments and returning any value. It's useful for scenarios where function signatures are dynamic or not strictly defined.

```APIDOC
## Type Alias: AnyFunction

### Description
Represents a function that can be called with any arguments and returns any value.

### Signature
```ts
type AnyFunction = (...args) => any;
```

### Parameters
*   **args**: `...any[]` - Any arguments can be passed to the function.

### Returns
*   `any` - The function can return any type of value.
```

--------------------------------

### isPlainObject

Source: https://github.com/tanstack/persist/blob/main/docs/reference/functions/isPlainObject.md

Checks if a value is a plain object. A plain object is an object created by the Object constructor or one with a null prototype.

```APIDOC
## Function: isPlainObject()

### Signature

```ts
function isPlainObject(o): o is Object;
```

### Parameters

#### o

- **o** (`any`) - The value to check.

### Returns

- `o is Object` - Returns `true` if the value is a plain object, `false` otherwise.
```

--------------------------------

### unsubscribeFromStorage

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/StoragePersister.md

Unsubscribes from storage events, stopping the persister from reacting to external changes in the browser's storage.

```APIDOC
## unsubscribeFromStorage()

### Description
Unsubscribes from storage events.

### Signature
```typescript
unsubscribeFromStorage(): void
```
```

--------------------------------

### AsyncPersister clearState Method

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/AsyncPersister.md

Abstract method to clear the persisted state. Optionally uses the default state if provided.

```typescript
abstract clearState: (useDefaultState?) => void
```

--------------------------------

### useSessionStorageState

Source: https://github.com/tanstack/persist/blob/main/docs/framework/react/reference/functions/useSessionStorageState.md

A hook that persists state to sessionStorage and syncs it across tabs. It returns the current state and a function to update it.

```APIDOC
## Function: useSessionStorageState()

### Signature
```ts
function useSessionStorageState<TValue, TSelected>(key: string, initialValue: TValue, options?: Omit<StoragePersisterOptions<TValue, TSelected>, "storage" | "key">): readonly [TValue | TSelected, Dispatch<SetStateAction<TValue | TSelected>>]
```

### Type Parameters

*   **TValue**
*   **TSelected** *extends* `Partial`6`TValue`

### Parameters

*   **key** (`string`) - The key to use for storing the state in sessionStorage.
*   **initialValue** (`TValue`) - The initial value of the state if it's not found in sessionStorage.
*   **options?** (`Omit`6`StoragePersisterOptions`6`TValue`, `TSelected`6, `
```

--------------------------------

### Persister saveState Method Signature

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/Persister.md

The saveState method is an abstract method that subclasses must implement to persist the given state. It takes the state as an argument and returns void.

```typescript
abstract saveState: (state) => void;
```

--------------------------------

### StoragePersister unsubscribeFromStorage Method

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/StoragePersister.md

Unsubscribes from storage events.

```typescript
unsubscribeFromStorage(): void
```

--------------------------------

### StoragePersister clearState Method

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/StoragePersister.md

Clears the state from storage. Optionally, it can set the default state if provided and specified to be used.

```typescript
clearState(useDefaultState): void
```

--------------------------------

### AnyAsyncFunction Type Alias

Source: https://github.com/tanstack/persist/blob/main/docs/reference/type-aliases/AnyAsyncFunction.md

Defines an asynchronous function signature that can take any number of arguments and resolves to a Promise of any type.

```APIDOC
## Type Alias: AnyAsyncFunction

### Description
Represents an asynchronous function that can be called with any arguments and returns a promise.

### Type Definition
```ts
type AnyAsyncFunction = (...args) => Promise<any>;
```

### Parameters
#### args
- `...any[]`: Any number of arguments can be passed to the function.

### Returns
- `Promise<any>`: A Promise that resolves to any value.
```

--------------------------------

### AsyncPersister key Property

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/AsyncPersister.md

Readonly property storing the unique key associated with the persister instance.

```typescript
readonly key: string
```

--------------------------------

### PersistedStorage Interface Definition

Source: https://github.com/tanstack/persist/blob/main/docs/reference/interfaces/PersistedStorage.md

Defines the structure for persisted state, including an optional buster for cache busting, the state itself, and a timestamp.

```typescript
interface PersistedStorage<TState, TSelected extends Partial<TState> = TState> {
  buster?: string;
  state: TSelected | undefined;
  timestamp: number;
}
```

--------------------------------

### Persister clearState Method Signature

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/Persister.md

The clearState method is an abstract method that must be implemented by subclasses to handle state clearing. It optionally accepts a boolean to indicate whether to use a default state.

```typescript
abstract clearState: (useDefaultState?) => void;
```

--------------------------------

### replaceEqualDeep Function Signature

Source: https://github.com/tanstack/persist/blob/main/docs/reference/functions/replaceEqualDeep.md

The replaceEqualDeep function takes two arguments, `a` and `b`, and returns a value of type `T`. It's used for deep comparison and structural sharing.

```APIDOC
## Function: replaceEqualDeep()

### Signature
```ts
function replaceEqualDeep<T>(a, b): T;
```

### Description
This function returns `a` if `b` is deeply equal. If not, it will replace any deeply equal children of `b` with those of `a`. This can be used for structural sharing between JSON values for example.

### Type Parameters

#### T

`T`

### Parameters

#### a

- **a** (unknown) - The first value to compare.

#### b

- **b** (T) - The second value to compare.

### Returns

- **T** - Returns `a` if `b` is deeply equal, otherwise returns `b` with potentially replaced children.
```

--------------------------------

### shallowEqualObjects

Source: https://github.com/tanstack/persist/blob/main/docs/reference/functions/shallowEqualObjects.md

Performs a shallow comparison of two objects to determine if they are equal. This function is generic and accepts objects of any type that extends Record<string, any>.

```APIDOC
## Function: shallowEqualObjects()

### Description
Shallow compare objects.

### Signature
```ts
function shallowEqualObjects<T>(a: T, b: T | undefined): boolean;
```

### Type Parameters
#### T
`T` *extends* `Record<string, any>`

### Parameters
#### a
`T` - The first object to compare.

#### b
`T | undefined` - The second object to compare. Can be undefined.

### Returns
`boolean` - Returns `true` if the objects are shallowly equal, `false` otherwise.
```

--------------------------------

### clearState()

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/AsyncPersister.md

Clears the persisted state asynchronously.

```APIDOC
## clearState()

### Description
Clears the persisted state asynchronously. This method should be implemented by subclasses.

### Signature
```ts
abstract clearState(useDefaultState?: boolean): void
```

### Parameters
#### useDefaultState
- **useDefaultState** (boolean) - Optional. If true, clears the state to its default value.
```

--------------------------------

### replaceEqualDeep Function Signature

Source: https://github.com/tanstack/persist/blob/main/docs/reference/functions/replaceEqualDeep.md

This is the type signature for the replaceEqualDeep function. It takes two arguments, 'a' and 'b', and returns a value of type 'T'.

```typescript
function replaceEqualDeep<T>(a, b): T;
```

--------------------------------

### Define OptionalKeys Type Alias

Source: https://github.com/tanstack/persist/blob/main/docs/reference/type-aliases/OptionalKeys.md

This type alias creates a new type by omitting specified keys from a base type and then making those same keys optional. Use this when you need to create a variation of a type where certain properties can be absent.

```typescript
type OptionalKeys<T, TKey> = Omit<T, TKey> & Partial<Pick<T, TKey>>;
```

--------------------------------

### Define RequiredKeys Type Alias

Source: https://github.com/tanstack/persist/blob/main/docs/reference/type-aliases/RequiredKeys.md

This type alias is used to create a new type where specified keys are required. It's defined in the types.ts file.

```typescript
type RequiredKeys<T, K> = Required<Pick<T, K>> & Omit<T, K>;
```

--------------------------------

### Persister key Property

Source: https://github.com/tanstack/persist/blob/main/docs/reference/classes/Persister.md

The key property stores the unique identifier for the state being persisted, as provided during the Persister's construction.

```typescript
readonly key: string;
```

--------------------------------

### Basic Usage of useDebouncedValue Hook

Source: https://github.com/tanstack/persist/blob/main/docs/framework/react/adapter.md

Import and use the `useDebouncedValue` hook from the React Adapter for debouncing values in your React components. This hook returns the debounced value and a debouncer function.

```tsx
import { useDebouncedValue } from '@tanstack/react-persist'

const [instantValue, instantValueRef] = useState(0)
const [debouncedValue, debouncer] = useDebouncedValue(instantValue, {
  wait: 1000,
})
```

--------------------------------

### isPlainArray

Source: https://github.com/tanstack/persist/blob/main/docs/reference/functions/isPlainArray.md

Checks if a value is a plain array. This is useful for determining if a variable holds an array that was created using the standard array literal syntax or the Array constructor.

```APIDOC
## Function: isPlainArray()

```ts
function isPlainArray(value): boolean;
```

### Parameters

#### value

- **value** (`unknown`) - The value to check.

### Returns

- `boolean` - Returns `true` if the value is a plain array, `false` otherwise.
```

--------------------------------

### isPlainArray Function Signature

Source: https://github.com/tanstack/persist/blob/main/docs/reference/functions/isPlainArray.md

This is the function signature for isPlainArray. It takes an unknown value and returns a boolean indicating if it's a plain array.

```typescript
function isPlainArray(value): boolean;
```

--------------------------------

### isPlainObject() Function Signature

Source: https://github.com/tanstack/persist/blob/main/docs/reference/functions/isPlainObject.md

This is the TypeScript signature for the isPlainObject function. It takes any value 'o' and returns a type predicate 'o is Object'.

```typescript
function isPlainObject(o): o is Object;
```

--------------------------------

### parseFunctionOrValue

Source: https://github.com/tanstack/persist/blob/main/docs/reference/functions/parseFunctionOrValue.md

Parses a value or a function that returns a value. It accepts a value of type T or a function that takes TArgs and returns T. Any additional arguments passed will be forwarded to the function if it's invoked.

```APIDOC
## Function: parseFunctionOrValue()

### Signature
```ts
function parseFunctionOrValue<T, TArgs>(value: T | ((...args: TArgs) => T), ...args: TArgs): T;
```

### Type Parameters

*   **T**: The type of the value to be parsed or returned.
*   **TArgs**: The type of the arguments that can be passed to the function.

### Parameters

*   **value** (`T` | `(...args: TArgs) => T`) - The value or function to parse.
*   **args** (`...TArgs`) - Additional arguments to pass to the function if `value` is a function.

### Returns

*   `T` - The parsed value.
```

--------------------------------

### isFunction

Source: https://github.com/tanstack/persist/blob/main/docs/reference/functions/isFunction.md

Checks if a value is a function. This function is a type guard, meaning it helps TypeScript infer the type of the value within conditional blocks.

```APIDOC
## Function: isFunction()

### Description
Checks if a given value is a function. This is a type guard function that helps in narrowing down the type of a variable within conditional statements.

### Signature
```ts
function isFunction<T>(value: any): value is T;
```

### Parameters
#### value
- **value** (any) - The value to check.

### Returns
- **value is T** (boolean) - Returns `true` if the value is a function, `false` otherwise. The return type `value is T` indicates that if the function returns `true`, the `value` is guaranteed to be of type `T` (where `T` is expected to be a function type).

### Type Parameters
#### T
- **T** (`AnyFunction`) - The expected function type. The `isFunction` utility will check if the provided `value` conforms to this type.
```

--------------------------------

### shallowEqualObjects Function Signature

Source: https://github.com/tanstack/persist/blob/main/docs/reference/functions/shallowEqualObjects.md

This is the TypeScript signature for the shallowEqualObjects function. It takes two objects of the same generic type T and returns a boolean indicating if they are shallowly equal.

```typescript
function shallowEqualObjects<T>(a, b): boolean;
```

--------------------------------

### Define AnyAsyncFunction Type Alias

Source: https://github.com/tanstack/persist/blob/main/docs/reference/type-aliases/AnyAsyncFunction.md

This type alias represents an asynchronous function that accepts any arguments and returns a Promise of any type. It is useful for defining flexible function signatures in TypeScript.

```typescript
type AnyAsyncFunction = (...args) => Promise<any>;
```

--------------------------------

### Check if a value is a function

Source: https://github.com/tanstack/persist/blob/main/docs/reference/functions/isFunction.md

Use this function to perform a type guard check at runtime. It returns `true` if the value is a function, and `false` otherwise. The generic type `T` allows for more specific type inference.

```typescript
function isFunction<T>(value): value is T;
```

--------------------------------

### parseFunctionOrValue Function Signature

Source: https://github.com/tanstack/persist/blob/main/docs/reference/functions/parseFunctionOrValue.md

This is the type signature for the parseFunctionOrValue function. It accepts a value which can be of type T or a function returning T, and optionally accepts arguments to pass to the function.

```typescript
function parseFunctionOrValue<T, TArgs>(value, ...args): T;
```