{"_rev":"7-669a76ccf16da25b4d0813cb3f537197","time":{"created":"2025-09-19T10:13:02.846Z","modified":"2025-09-19T10:13:04.008Z","1.0.0":"2025-09-19T09:43:02.154Z","1.0.1":"2025-09-19T09:56:36.164Z","1.1.1":"2025-09-19T10:13:03.353Z"},"_id":"@bytealam/use-local-storage","name":"@bytealam/use-local-storage","dist-tags":{"latest":"1.1.1"},"versions":{"1.1.1":{"name":"@bytealam/use-local-storage","version":"1.1.1","description":"A React hook for managing state synchronized with localStorage, with advanced features like TTL, namespacing, and cross-tab sync.","main":"dist/cjs/index.js","module":"dist/esm/index.js","types":"dist/index.d.ts","scripts":{"clean":"rimraf dist","build":"npm run clean && rollup -c","prepare":"npm run build"},"keywords":["react","hook","localstorage","useLocalStorage","state","persistence"],"author":{"name":"Alam Inamdar"},"license":"MIT","peerDependencies":{"react":">=16.8","react-dom":">=16.8"},"devDependencies":{"@rollup/plugin-commonjs":"^26.0.0","@rollup/plugin-node-resolve":"^15.2.3","@rollup/plugin-typescript":"^11.1.6","@rollup/plugin-terser":"^0.4.4","@types/react":"^18.3.5","@types/react-dom":"^18.3.0","rimraf":"^5.0.5","rollup":"^4.21.0","rollup-plugin-peer-deps-external":"^2.2.4","rollup-plugin-typescript2":"^0.36.0","typescript":"^5.6.3"},"_id":"@bytealam/use-local-storage@1.1.1","gitHead":"eab3e476e89267a9ee223066d87558dfdbe9aa4c","_nodeVersion":"18.20.8","_npmVersion":"10.8.2","dist":{"integrity":"sha512-q+b/d9D9dxnPx49+wqdMjpaS/XfVW1SIHu5ibQp/DxUGOj4XUnrpLHOpWeVpKvwtlNADhd5tTFArDwyt6dTPFg==","shasum":"5587782934ba45c53d023bb499d1ca49d36d6deb","tarball":"https://registry.npmjs.org/@bytealam/use-local-storage/-/use-local-storage-1.1.1.tgz","fileCount":7,"unpackedSize":8070,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIHCeCibMYE2dYinXx9YcsPy3kFMNoU9J53Qd2eys7AJRAiB3DF1RQ4gCDAuOAvxC8RNh9JSfP0jxt5k/1qTrBfPE9w=="}]},"_npmUser":{"name":"bytealam","email":"alaminamdar0@gmail.com"},"directories":{},"maintainers":[{"name":"bytealam","email":"alaminamdar0@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/use-local-storage_1.1.1_1758276782981_0.23906308614816352"},"_hasShrinkwrap":false}},"maintainers":[{"name":"bytealam","email":"alaminamdar0@gmail.com"}],"description":"A React hook for managing state synchronized with localStorage, with advanced features like TTL, namespacing, and cross-tab sync.","keywords":["react","hook","localstorage","useLocalStorage","state","persistence"],"author":{"name":"Alam Inamdar"},"license":"MIT","readme":"````markdown\n# @bytealam/use-local-storage\n\nA powerful React hook to manage **localStorage** with extra features like TTL, cross-tab sync, namespaces, custom serialization, and fallback support.  \nWorks just like `useState`, but with persistence and advanced capabilities.\n\n---\n\n## **Installation**\n\n```bash\nnpm install @bytealam/use-local-storage\n````\n\nor with yarn:\n\n```bash\nyarn add @bytealam/use-local-storage\n```\n\n---\n\n## **Basic Usage**\n\n```tsx\nimport React from 'react';\nimport useLocalStorage from '@bytealam/use-local-storage';\n\nfunction App() {\n  const [name, setName] = useLocalStorage('name', 'John Doe');\n\n  return (\n    <div>\n      <input value={name} onChange={e => setName(e.target.value)} />\n      <p>Hello, {name}!</p>\n    </div>\n  );\n}\n\nexport default App;\n```\n\n---\n\n## **Advanced Features**\n\n### 1. TTL (Time-to-Live) Expiry\n\nAutomatically expire stored items after a specific time:\n\n```tsx\nconst [session, setSession] = useLocalStorage('session', {}, {\n  ttl: 1000 * 60 * 30 // 30 minutes\n});\n```\n\n* Item is removed automatically after TTL expires.\n\n---\n\n### 2. Sync Across Browser Tabs\n\nKeeps localStorage in sync across multiple tabs/windows:\n\n```tsx\nconst [cart, setCart] = useLocalStorage('cart', [], { syncTabs: true });\n```\n\n* Updates in one tab propagate to others immediately.\n\n---\n\n### 3. Custom Serializer / Deserializer\n\nStore complex objects or use custom formats:\n\n```tsx\nconst [data, setData] = useLocalStorage('data', {}, {\n  serialize: JSON.stringify,\n  deserialize: JSON.parse\n});\n```\n\n* Useful for objects, arrays, or custom transformations.\n\n---\n\n### 4. Namespace Support\n\nAvoid key collisions by scoping items:\n\n```tsx\nconst [userSettings, setUserSettings] = useLocalStorage('settings', {}, {\n  namespace: 'myApp'\n});\n```\n\n* Stored as `myApp:settings` in localStorage.\n\n---\n\n### 5. Fallback When localStorage is Unavailable\n\nWorks in environments where `localStorage` is disabled:\n\n```tsx\nconst [value, setValue] = useLocalStorage('key', 'default', {\n  fallback: true\n});\n```\n\n* Falls back to in-memory storage.\n\n---\n\n## **API**\n\n```ts\nuseLocalStorage<T>(\n  key: string,\n  initialValue: T,\n  options?: {\n    ttl?: number;\n    syncTabs?: boolean;\n    serialize?: (value: T) => string;\n    deserialize?: (value: string) => T;\n    namespace?: string;\n    fallback?: boolean;\n  }\n): [T, (val: T | ((prev: T) => T)) => void];\n```\n\n**Returns**: `[value, setValue]` — similar to `useState`.\n\n---\n\n## **Example With All Options**\n\n```tsx\nconst [user, setUser] = useLocalStorage('user', { name: '', age: 0 }, {\n  ttl: 3600000,        // 1 hour\n  syncTabs: true,\n  namespace: 'myApp',\n  serialize: JSON.stringify,\n  deserialize: JSON.parse,\n  fallback: true\n});\n\nsetUser(prev => ({ ...prev, age: prev.age + 1 }));\n```\n\n---\n\n## **License**\n\nMIT © Alam Inamdar","readmeFilename":"README.md"}