@thibault.sh/hooks/dist/useLocalStorageState.d.ts

A comprehensive collection of React hooks for browser storage, UI interactions, and more

/**
 * Hook that manages state synchronized with localStorage.
 *
 * Provides a useState-like interface that automatically persists state changes
 * to localStorage and initializes from stored values on mount. Handles SSR
 * compatibility and JSON serialization/deserialization automatically.
 *
 * @template T - The type of the value being stored
 * @param key - The localStorage key to use for persistence
 * @param initialValue - The default value to use if no stored value exists
 *
 * @returns A tuple containing:
 *   - Current stored value (T)
 *   - Setter function that updates both state and localStorage
 *
 * @example
 * ```tsx
 * function UserPreferences() {
 *   const [theme, setTheme] = useLocalStorageState('theme', 'light');
 *   const [settings, setSettings] = useLocalStorageState('settings', {
 *     notifications: true,
 *     language: 'en'
 *   });
 *
 *   return (
 *     <div>
 *       <button onClick={() => setTheme(theme === 'light' ? 'dark' : 'light')}>
 *         Current theme: {theme}
 *       </button>
 *
 *       <button onClick={() => setSettings(prev => ({
 *         ...prev,
 *         notifications: !prev.notifications
 *       }))}>
 *         Notifications: {settings.notifications ? 'On' : 'Off'}
 *       </button>
 *     </div>
 *   );
 * }
 * ```
 *
 * @see https://thibault.sh/hooks/use-local-storage-state
 */
declare function useLocalStorageState<T>(key: string, initialValue: T): [T, (value: T | ((val: T) => T)) => void];

export { useLocalStorageState };