rooks/dist/esm/hooks/useSuspenseIndexedDBState.d.ts

Collection of awesome react hooks

/**
 * useSuspenseIndexedDBState
 * @description Suspense-enabled hook for IndexedDB state management with cross-tab synchronization
 * @see {@link https://rooks.vercel.app/docs/hooks/useSuspenseIndexedDBState}
 */
/**
 * Clear cached entry for a specific cache key - useful for testing
 * @internal
 * @param cacheKey - The cache key to clear
 */
export declare function clearCache(cacheKey?: string): void;
/**
 * Control methods interface for the hook
 */
interface UseSuspenseIndexedDBStateControls<T> {
    /**
     * Get the current value from the hook's state
     * @returns The current state value
     */
    getItem: () => T;
    /**
     * Set a new value in IndexedDB and update state
     * @param value - The new value to set
     */
    setItem: (value: T) => Promise<void>;
    /**
     * Delete the item from IndexedDB and reset to initial value
     */
    deleteItem: () => Promise<void>;
}
/**
 * Return type for the useSuspenseIndexedDBState hook
 */
type UseSuspenseIndexedDBStateReturnValue<T> = [
    T,
    UseSuspenseIndexedDBStateControls<T>
];
/**
 * Hook configuration interface
 */
interface IndexedDBConfig {
    /**
     * The IndexedDB database name
     * @default "rooks-db"
     */
    dbName?: string;
    /**
     * The object store name within the database
     * @default "state"
     */
    storeName?: string;
    /**
     * The database version
     * @default 1
     */
    version?: number;
}
/**
 * Suspense-enabled hook for IndexedDB state management with cross-tab synchronization
 *
 * This hook will suspend (throw a promise) during initialization to work with React Suspense.
 * It provides IndexedDB state management with proper TypeScript generics, structured data storage,
 * error handling, and cross-tab synchronization using BroadcastChannel API.
 *
 * @param key - The key to use within the IndexedDB object store
 * @param initializer - Function that takes the current IndexedDB value (unknown type) and returns the initial state of type T
 * @param config - Optional configuration for database name, store name, and version
 * @returns Tuple containing [currentValue, controls] where controls has getItem, setItem, and deleteItem methods
 *
 * @throws {Promise} When data is still loading (for Suspense)
 * @throws {Error} When initialization fails
 *
 * @example
 * ```tsx
 * function MyComponent() {
 *   const [user, { setItem, deleteItem }] = useSuspenseIndexedDBState(
 *     'user-profile',
 *     (currentValue) => currentValue || { id: 0, name: 'Guest', email: '' }
 *   );
 *
 *   return (
 *     <div>
 *       <p>User: {user.name}</p>
 *       <button onClick={() => setItem({ id: 1, name: 'John', email: 'john@example.com' })}>
 *         Update User
 *       </button>
 *       <button onClick={deleteItem}>Reset</button>
 *     </div>
 *   );
 * }
 *
 * function App() {
 *   return (
 *     <Suspense fallback={<div>Loading...</div>}>
 *       <MyComponent />
 *     </Suspense>
 *   );
 * }
 * ```
 */
declare function useSuspenseIndexedDBState<T>(key: string, initializer: (currentValue: unknown) => T, config?: IndexedDBConfig): UseSuspenseIndexedDBStateReturnValue<T>;
export { useSuspenseIndexedDBState };