tona-hooks 1.0.19 → 1.0.21

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import { Dispatch, EffectCallback, useEffect } from "preact/hooks";
-import { SetStateAction } from "preact/compat";
+import { Dispatch as Dispatch$1, SetStateAction } from "preact/compat";
 import { RefObject } from "preact";
 
 //#region src/use-ajax-complete.d.ts
@@ -27,6 +27,16 @@ declare function useEventCallback<Args extends unknown[], R>(fn: ((...args: Args
 //#region src/use-isomorphic-layout-effect.d.ts
 declare const useIsomorphicLayoutEffect: typeof useEffect;
 //#endregion
+//#region src/use-local-storage.d.ts
+type parserOptions<T> = {
+  raw: true;
+} | {
+  raw: false;
+  serializer: (value: T) => string;
+  deserializer: (value: string) => T;
+};
+declare const useLocalStorage: <T>(key: string, initialValue?: T, options?: parserOptions<T>) => [T | undefined, Dispatch$1<SetStateAction<T | undefined>>, () => void];
+//#endregion
 //#region src/use-query-dom.d.ts
 interface UseQueryDomOptions<T> {
   selector: string;
@@ -68,4 +78,4 @@ interface State {
 }
 declare const useWindowScroll: () => State;
 //#endregion
-export { useAjaxComplete, useEffectOnce, useEventCallback, useIsomorphicLayoutEffect, useQueryDOM, useRafState, useScroll, useUnmount, useWindowScroll };
+export { useAjaxComplete, useEffectOnce, useEventCallback, useIsomorphicLayoutEffect, useLocalStorage, useQueryDOM, useRafState, useScroll, useUnmount, useWindowScroll };

package/dist/index.js

@@ -1,5 +1,5 @@
 import { useCallback, useEffect, useLayoutEffect, useRef, useState } from "preact/hooks";
-import { useCallback as useCallback$1, useRef as useRef$1 } from "preact/compat";
+import { useCallback as useCallback$1, useLayoutEffect as useLayoutEffect$1, useRef as useRef$1, useState as useState$1 } from "preact/compat";
 
 //#region src/use-ajax-complete.ts
 /**
@@ -50,6 +50,67 @@ function useEventCallback(fn) {
 	return useCallback$1((...args) => ref.current?.(...args), [ref]);
 }
 
+//#endregion
+//#region src/misc/util.ts
+const noop = () => {};
+function on(obj, ...args) {
+	if (obj?.addEventListener) obj.addEventListener(...args);
+}
+function off(obj, ...args) {
+	if (obj?.removeEventListener) obj.removeEventListener(...args);
+}
+const isBrowser = typeof window !== "undefined";
+
+//#endregion
+//#region src/use-local-storage.ts
+const useLocalStorage = (key, initialValue, options) => {
+	if (!isBrowser) return [
+		initialValue,
+		noop,
+		noop
+	];
+	if (!key) throw new Error("useLocalStorage key may not be falsy");
+	const deserializer = options ? options.raw ? (value) => value : options.deserializer : JSON.parse;
+	const initializer = useRef$1((key$1) => {
+		try {
+			const serializer = options ? options.raw ? String : options.serializer : JSON.stringify;
+			const localStorageValue = localStorage.getItem(key$1);
+			if (localStorageValue !== null) return deserializer(localStorageValue);
+			else {
+				initialValue && localStorage.setItem(key$1, serializer(initialValue));
+				return initialValue;
+			}
+		} catch {
+			return initialValue;
+		}
+	});
+	const [state, setState] = useState$1(() => initializer.current(key));
+	useLayoutEffect$1(() => setState(initializer.current(key)), [key]);
+	return [
+		state,
+		useCallback$1((valOrFunc) => {
+			try {
+				const newState = typeof valOrFunc === "function" ? valOrFunc(state) : valOrFunc;
+				if (typeof newState === "undefined") return;
+				let value;
+				if (options) if (options.raw) if (typeof newState === "string") value = newState;
+				else value = JSON.stringify(newState);
+				else if (options.serializer) value = options.serializer(newState);
+				else value = JSON.stringify(newState);
+				else value = JSON.stringify(newState);
+				localStorage.setItem(key, value);
+				setState(deserializer(value));
+			} catch {}
+		}, [key, setState]),
+		useCallback$1(() => {
+			try {
+				localStorage.removeItem(key);
+				setState(void 0);
+			} catch {}
+		}, [key, setState])
+	];
+};
+
 //#endregion
 //#region src/use-query-dom.ts
 function useQueryDOM({ selector, observe = false, queryFn, ajaxUrl }) {
@@ -176,16 +237,6 @@ const useRafState = (initialState) => {
 	return [state, setRafState];
 };
 
-//#endregion
-//#region src/misc/util.ts
-function on(obj, ...args) {
-	if (obj?.addEventListener) obj.addEventListener(...args);
-}
-function off(obj, ...args) {
-	if (obj?.removeEventListener) obj.removeEventListener(...args);
-}
-const isBrowser = typeof window !== "undefined";
-
 //#endregion
 //#region src/use-scroll.ts
 const useScroll = (ref) => {
@@ -242,4 +293,4 @@ const useWindowScroll = () => {
 };
 
 //#endregion
-export { useAjaxComplete, useEffectOnce, useEventCallback, useIsomorphicLayoutEffect, useQueryDOM, useRafState, useScroll, useUnmount, useWindowScroll };
+export { useAjaxComplete, useEffectOnce, useEventCallback, useIsomorphicLayoutEffect, useLocalStorage, useQueryDOM, useRafState, useScroll, useUnmount, useWindowScroll };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tona-hooks",
-  "version": "1.0.19",
+  "version": "1.0.21",
   "description": "",
   "author": {
     "name": "guangzan",