use-local-storage-state - npm Package Compare versions

Comparing version 17.0.1 to 17.1.0

es/src/useLocalStorageState.js

@@ -14,5 +14,5 @@ import storage from './storage';
     // eslint-disable-next-line react-hooks/rules-of-hooks
-    return useClientLocalStorageState(key, defaultValue, (options === null || options === void 0 ? void 0 : options.ssr) === true);
+    return useClientLocalStorageState(key, defaultValue, (options === null || options === void 0 ? void 0 : options.ssr) === true, (options === null || options === void 0 ? void 0 : options.crossSync) !== false);
 }
-function useClientLocalStorageState(key, defaultValue, ssr) {
+function useClientLocalStorageState(key, defaultValue, ssr, crossSync) {
     const initialDefaultValue = useRef(defaultValue).current;
@@ -43,2 +43,5 @@ // `id` changes every time a change in the `localStorage` occurs
     useEffect(() => {
+        if (!crossSync) {
+            return undefined;
+        }
         const onStorage = (e) => {
@@ -51,3 +54,3 @@ if (e.storageArea === localStorage && e.key === key) {
         return () => window.removeEventListener('storage', onStorage);
-    }, [key]);
+    }, [key, crossSync]);
     // - adds this hook to the `activeHooks` array. see the `activeHooks` declaration above for a
@@ -54,0 +57,0 @@ //   more detailed explanation

package.json

 {
     "name": "use-local-storage-state",
-    "version": "17.0.1",
+    "version": "17.1.0",
     "description": "React hook that persist data in localStorage",
@@ -32,3 +32,3 @@ "license": "MIT",
         "lint": "eslint --cache --format=pretty --ext=.ts ./",
-        "test": "yarn run build && yarn run lint && if [[ -z $CI ]]; then jest --coverage --coverageReporters=text; else jest --coverage; fi",
+        "test": "rm -rf ./node_modules/@types/react-test-renderer/node_modules/@types && yarn run build && yarn run lint && if [[ -z $CI ]]; then jest --coverage --coverageReporters=text; else jest --coverage; fi",
         "release": "yarn run build && np",
@@ -48,4 +48,4 @@ "prettier": "prettier --write --config .prettierrc.yaml {*.ts,*.json}"
     "peerDependencies": {
-        "react": ">=16.8.0",
-        "react-dom": ">=16.8.0"
+        "react": ">=16.8.0 < 18",
+        "react-dom": ">=16.8.0 < 18"
     },
@@ -52,0 +52,0 @@ "devDependencies": {

readme.md

@@ -8,3 +8,3 @@ # `use-local-storage-state`
 [![Test Coverage](https://img.shields.io/codeclimate/coverage/astoilkov/use-local-storage-state)](https://codeclimate.com/github/astoilkov/use-local-storage-state/test_coverage)
-[![Build Status](https://www.travis-ci.com/astoilkov/use-local-storage-state.svg?branch=master)](https://travis-ci.org/astoilkov/use-local-storage-state)
+[![Build Status](https://www.travis-ci.com/astoilkov/use-local-storage-state.svg?branch=main)](https://travis-ci.org/astoilkov/use-local-storage-state)
 
@@ -14,3 +14,3 @@ ## Install
 ```shell
-npm install use-local-storage-state
+npm install use-local-storage-state@17
 ```
@@ -176,2 +176,10 @@
 
+### `options.crossSync`
+
+Type: `boolean`
+
+Default: `true`
+
+Setting to `false` doesn't subscribe to the [Window storage event](https://developer.mozilla.org/en-US/docs/Web/API/Window/storage_event). If you set to `false`, updates won't be synchronized across tabs, windows and iframes.
+
 ## Alternatives
@@ -178,0 +186,0 @@

src/storage.d.ts

@@ -1,7 +0,1 @@
-declare const _default: {
-    data: Map<string, unknown>;
-    get<T>(key: string, defaultValue: T): T | undefined;
-    set<T_1>(key: string, value: T_1): void;
-    remove(key: string): void;
-};
 /**
@@ -16,2 +10,8 @@ * Abstraction for localStorage that uses an in-memory fallback when localStorage throws an error.
  */
+declare const _default: {
+    data: Map<string, unknown>;
+    get<T>(key: string, defaultValue: T): T | undefined;
+    set<T_1>(key: string, value: T_1): void;
+    remove(key: string): void;
+};
 export default _default;

src/useLocalStorageState.d.ts

 import type { Dispatch, SetStateAction } from 'react';
+export declare type LocalStorageOptions<T> = {
+    ssr?: boolean;
+    defaultValue?: T;
+    crossSync?: boolean;
+};
 export declare type LocalStorageState<T> = [
@@ -10,11 +15,4 @@ T,
 ];
-export default function useLocalStorageState(key: string, options?: {
-    ssr: boolean;
-}): LocalStorageState<unknown>;
-export default function useLocalStorageState<T>(key: string, options?: {
-    ssr: boolean;
-}): LocalStorageState<T | undefined>;
-export default function useLocalStorageState<T>(key: string, options?: {
-    defaultValue?: T;
-    ssr?: boolean;
-}): LocalStorageState<T>;
+export default function useLocalStorageState(key: string, options?: Omit<LocalStorageOptions<unknown>, 'defaultValue'>): LocalStorageState<unknown>;
+export default function useLocalStorageState<T>(key: string, options?: Omit<LocalStorageOptions<T | undefined>, 'defaultValue'>): LocalStorageState<T | undefined>;
+export default function useLocalStorageState<T>(key: string, options?: LocalStorageOptions<T>): LocalStorageState<T>;

src/useLocalStorageState.js

@@ -19,6 +19,6 @@ "use strict";
     // eslint-disable-next-line react-hooks/rules-of-hooks
-    return useClientLocalStorageState(key, defaultValue, (options === null || options === void 0 ? void 0 : options.ssr) === true);
+    return useClientLocalStorageState(key, defaultValue, (options === null || options === void 0 ? void 0 : options.ssr) === true, (options === null || options === void 0 ? void 0 : options.crossSync) !== false);
 }
 exports.default = useLocalStorageState;
-function useClientLocalStorageState(key, defaultValue, ssr) {
+function useClientLocalStorageState(key, defaultValue, ssr, crossSync) {
     const initialDefaultValue = (0, react_1.useRef)(defaultValue).current;
@@ -49,2 +49,5 @@ // `id` changes every time a change in the `localStorage` occurs
     (0, react_1.useEffect)(() => {
+        if (!crossSync) {
+            return undefined;
+        }
         const onStorage = (e) => {
@@ -57,3 +60,3 @@ if (e.storageArea === localStorage && e.key === key) {
         return () => window.removeEventListener('storage', onStorage);
-    }, [key]);
+    }, [key, crossSync]);
     // - adds this hook to the `activeHooks` array. see the `activeHooks` declaration above for a
@@ -60,0 +63,0 @@ //   more detailed explanation

No alert changes

Improved metrics

Total package byte prevSize

28179

increased by8.79%

Number of package files

19

increased by58.33%

Lines of code

402

increased by14.2%

Number of lines in readme file

188

increased by4.44%

No dependency changes