@zayne-labs/toolkit-react 0.11.19 → 0.11.21

package/dist/esm/hooks/useControllable.d.ts

@@ -0,0 +1,55 @@
+import { StateSetter } from "../utils/types/common.js";
+
+//#region src/hooks/useControllable.d.ts
+type UseControllablePropOptions<TProp> = {
+  prop: TProp | undefined;
+  state: TProp;
+};
+/**
+ * @description Given a prop value and state value, the useControllableProp hook is used to determine whether a component is controlled or uncontrolled, and also returns the computed value.
+ */
+declare const useControllableProp: <TProp>(options: UseControllablePropOptions<TProp>) => [isControlled: boolean, value: TProp];
+type UseControllableStateOptions<TValue> = {
+  defaultValue?: TValue | (() => TValue);
+  equalityFn?: (prevState: TValue, nextValue: TValue) => boolean;
+  onChange?: (value: TValue) => void;
+  value?: TValue;
+};
+/**
+ * @description React hook to manage state that can be either controlled or uncontrolled.
+ * - When `options.value` is provided, the hook operates in controlled mode.
+ *   In this mode, `value` always equals `options.value` and `setValue` will
+ *   invoke `options.onChange(next)` without mutating internal state.
+ * - When `options.value` is not provided, the hook operates in uncontrolled
+ *   mode, initializing internal state from `options.defaultValue` and updating
+ *   it via `setValue`.
+ * - All updates are gated by `options.equalityFn(prev, next)` which defaults
+ *   to `Object.is`.
+ *
+ * @param options - Configuration options for the hook.
+ * @param options.value - Controlled value. If defined, the state is controlled.
+ * @param options.defaultValue - Initial value for the uncontrolled state. Can be a
+ * function for lazy initialization or a direct value.
+ * @param options.onChange - Callback fired when a new value is requested. In
+ * controlled mode, this is invoked instead of updating internal state. In
+ * uncontrolled mode, it is called after the internal state updates.
+ * @param options.equalityFn - Predicate that decides whether to commit an
+ * update given `prevState` and `nextValue`. If the values are equal, the update
+ * is skipped. Defaults to `Object.is`.
+ * @returns A tuple `[value, setValue]`  just like React.useState.
+ *
+ * @example
+ * // Uncontrolled usage
+ * const [value, setValue] = useControllableState({ defaultValue: 0 });
+ *
+ * @example
+ * // Controlled usage
+ * const [value, setValue] = useControllableState({
+ *   value: props.value,
+ *   onChange: props.onChange,
+ * });
+ */
+declare const useControllableState: <TValue>(options: UseControllableStateOptions<TValue>) => [value: TValue, setValue: StateSetter<TValue>];
+//#endregion
+export { useControllableProp, useControllableState };
+//# sourceMappingURL=useControllable.d.ts.map

package/dist/esm/hooks/useControllable.js

@@ -0,0 +1,79 @@
+"use client";
+
+
+import { useCallbackRef } from "./useCallbackRef.js";
+import { useCallback, useMemo, useState } from "react";
+import { isFunction } from "@zayne-labs/toolkit-type-helpers";
+
+//#region src/hooks/useControllable.ts
+/**
+* @description Given a prop value and state value, the useControllableProp hook is used to determine whether a component is controlled or uncontrolled, and also returns the computed value.
+*/
+const useControllableProp = (options) => {
+	const { prop, state } = options;
+	const isControlled = prop !== void 0;
+	const value = isControlled ? prop : state;
+	return useMemo(() => [isControlled, value], [isControlled, value]);
+};
+/**
+* @description React hook to manage state that can be either controlled or uncontrolled.
+* - When `options.value` is provided, the hook operates in controlled mode.
+*   In this mode, `value` always equals `options.value` and `setValue` will
+*   invoke `options.onChange(next)` without mutating internal state.
+* - When `options.value` is not provided, the hook operates in uncontrolled
+*   mode, initializing internal state from `options.defaultValue` and updating
+*   it via `setValue`.
+* - All updates are gated by `options.equalityFn(prev, next)` which defaults
+*   to `Object.is`.
+*
+* @param options - Configuration options for the hook.
+* @param options.value - Controlled value. If defined, the state is controlled.
+* @param options.defaultValue - Initial value for the uncontrolled state. Can be a
+* function for lazy initialization or a direct value.
+* @param options.onChange - Callback fired when a new value is requested. In
+* controlled mode, this is invoked instead of updating internal state. In
+* uncontrolled mode, it is called after the internal state updates.
+* @param options.equalityFn - Predicate that decides whether to commit an
+* update given `prevState` and `nextValue`. If the values are equal, the update
+* is skipped. Defaults to `Object.is`.
+* @returns A tuple `[value, setValue]`  just like React.useState.
+*
+* @example
+* // Uncontrolled usage
+* const [value, setValue] = useControllableState({ defaultValue: 0 });
+*
+* @example
+* // Controlled usage
+* const [value, setValue] = useControllableState({
+*   value: props.value,
+*   onChange: props.onChange,
+* });
+*/
+const useControllableState = (options) => {
+	const { defaultValue, equalityFn = Object.is, onChange: onChangeProp, value: valueProp } = options;
+	const savedOnchangeProp = useCallbackRef(onChangeProp);
+	const savedEqualityFn = useCallbackRef(equalityFn);
+	const [unControlledState, setUncontrolledState] = useState(defaultValue);
+	const isControlled = valueProp !== void 0;
+	const currentValue = isControlled ? valueProp : unControlledState;
+	const setValue = useCallback((newValue) => {
+		const nextValue = isFunction(newValue) ? newValue(currentValue) : newValue;
+		if (savedEqualityFn(currentValue, nextValue)) return;
+		if (isControlled) {
+			savedOnchangeProp(nextValue);
+			return;
+		}
+		setUncontrolledState(nextValue);
+		savedOnchangeProp(nextValue);
+	}, [
+		isControlled,
+		savedOnchangeProp,
+		savedEqualityFn,
+		currentValue
+	]);
+	return [currentValue, setValue];
+};
+
+//#endregion
+export { useControllableProp, useControllableState };
+//# sourceMappingURL=useControllable.js.map

package/dist/esm/hooks/useControllable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useControllable.js","names":["setValue: StateSetter<TValue>"],"sources":["../../../src/hooks/useControllable.ts"],"sourcesContent":["\"use client\";\n\nimport { isFunction } from \"@zayne-labs/toolkit-type-helpers\";\nimport { useCallback, useMemo, useState } from \"react\";\nimport type { StateSetter } from \"@/utils\";\nimport { useCallbackRef } from \"./useCallbackRef\";\n\ntype UseControllablePropOptions<TProp> = {\n\tprop: TProp | undefined;\n\tstate: TProp;\n};\n\n/**\n * @description Given a prop value and state value, the useControllableProp hook is used to determine whether a component is controlled or uncontrolled, and also returns the computed value.\n */\nexport const useControllableProp = <TProp>(options: UseControllablePropOptions<TProp>) => {\n\tconst { prop, state } = options;\n\n\tconst isControlled = prop !== undefined;\n\n\tconst value = isControlled ? prop : state;\n\n\tconst result = useMemo<[isControlled: typeof isControlled, value: typeof value]>(\n\t\t() => [isControlled, value],\n\t\t[isControlled, value]\n\t);\n\n\treturn result;\n};\n\ntype UseControllableStateOptions<TValue> = {\n\tdefaultValue?: TValue | (() => TValue);\n\tequalityFn?: (prevState: TValue, nextValue: TValue) => boolean;\n\tonChange?: (value: TValue) => void;\n\tvalue?: TValue;\n};\n\n/**\n * @description React hook to manage state that can be either controlled or uncontrolled.\n * - When `options.value` is provided, the hook operates in controlled mode.\n *   In this mode, `value` always equals `options.value` and `setValue` will\n *   invoke `options.onChange(next)` without mutating internal state.\n * - When `options.value` is not provided, the hook operates in uncontrolled\n *   mode, initializing internal state from `options.defaultValue` and updating\n *   it via `setValue`.\n * - All updates are gated by `options.equalityFn(prev, next)` which defaults\n *   to `Object.is`.\n *\n * @param options - Configuration options for the hook.\n * @param options.value - Controlled value. If defined, the state is controlled.\n * @param options.defaultValue - Initial value for the uncontrolled state. Can be a\n * function for lazy initialization or a direct value.\n * @param options.onChange - Callback fired when a new value is requested. In\n * controlled mode, this is invoked instead of updating internal state. In\n * uncontrolled mode, it is called after the internal state updates.\n * @param options.equalityFn - Predicate that decides whether to commit an\n * update given `prevState` and `nextValue`. If the values are equal, the update\n * is skipped. Defaults to `Object.is`.\n * @returns A tuple `[value, setValue]`  just like React.useState.\n *\n * @example\n * // Uncontrolled usage\n * const [value, setValue] = useControllableState({ defaultValue: 0 });\n *\n * @example\n * // Controlled usage\n * const [value, setValue] = useControllableState({\n *   value: props.value,\n *   onChange: props.onChange,\n * });\n */\nexport const useControllableState = <TValue>(options: UseControllableStateOptions<TValue>) => {\n\tconst { defaultValue, equalityFn = Object.is, onChange: onChangeProp, value: valueProp } = options;\n\n\tconst savedOnchangeProp = useCallbackRef(onChangeProp);\n\tconst savedEqualityFn = useCallbackRef(equalityFn);\n\n\tconst [unControlledState, setUncontrolledState] = useState(defaultValue as TValue);\n\n\tconst isControlled = valueProp !== undefined;\n\n\tconst currentValue = isControlled ? valueProp : unControlledState;\n\n\tconst setValue: StateSetter<TValue> = useCallback(\n\t\t(newValue) => {\n\t\t\tconst nextValue = isFunction(newValue) ? newValue(currentValue) : newValue;\n\n\t\t\tif (savedEqualityFn(currentValue, nextValue)) return;\n\n\t\t\tif (isControlled) {\n\t\t\t\tsavedOnchangeProp(nextValue);\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tsetUncontrolledState(nextValue);\n\t\t\t// == Always call onChangeProp even if the value is uncontrolled, just in case the onChangeProp is used to perform side effects without necessarily updating the controlled valueProp\n\t\t\tsavedOnchangeProp(nextValue);\n\t\t},\n\t\t[isControlled, savedOnchangeProp, savedEqualityFn, currentValue]\n\t);\n\n\treturn [currentValue, setValue] as [value: typeof currentValue, setValue: typeof setValue];\n};\n"],"mappings":";;;;;;;;;;;AAeA,MAAa,uBAA8B,YAA+C;CACzF,MAAM,EAAE,MAAM,UAAU;CAExB,MAAM,eAAe,SAAS;CAE9B,MAAM,QAAQ,eAAe,OAAO;AAOpC,QALe,cACR,CAAC,cAAc,MAAM,EAC3B,CAAC,cAAc,MAAM,CACrB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8CF,MAAa,wBAAgC,YAAiD;CAC7F,MAAM,EAAE,cAAc,aAAa,OAAO,IAAI,UAAU,cAAc,OAAO,cAAc;CAE3F,MAAM,oBAAoB,eAAe,aAAa;CACtD,MAAM,kBAAkB,eAAe,WAAW;CAElD,MAAM,CAAC,mBAAmB,wBAAwB,SAAS,aAAuB;CAElF,MAAM,eAAe,cAAc;CAEnC,MAAM,eAAe,eAAe,YAAY;CAEhD,MAAMA,WAAgC,aACpC,aAAa;EACb,MAAM,YAAY,WAAW,SAAS,GAAG,SAAS,aAAa,GAAG;AAElE,MAAI,gBAAgB,cAAc,UAAU,CAAE;AAE9C,MAAI,cAAc;AACjB,qBAAkB,UAAU;AAC5B;;AAGD,uBAAqB,UAAU;AAE/B,oBAAkB,UAAU;IAE7B;EAAC;EAAc;EAAmB;EAAiB;EAAa,CAChE;AAED,QAAO,CAAC,cAAc,SAAS"}

package/dist/esm/hooks/useCopyToClipboard.d.ts

@@ -0,0 +1,15 @@
+import * as react2 from "react";
+import { AllowedClipboardItems, CopyToClipboardOptions } from "@zayne-labs/toolkit-core";
+
+//#region src/hooks/useCopyToClipboard.d.ts
+declare const useCopyToClipboard: (options?: CopyToClipboardOptions & {
+  timeout?: number;
+}) => {
+  handleCopy: (valueToCopy: AllowedClipboardItems) => void;
+  hasCopied: boolean;
+  setValue: react2.Dispatch<react2.SetStateAction<AllowedClipboardItems>>;
+  value: AllowedClipboardItems;
+};
+//#endregion
+export { useCopyToClipboard };
+//# sourceMappingURL=useCopyToClipboard.d.ts.map

package/dist/esm/hooks/useCopyToClipboard.js

@@ -0,0 +1,49 @@
+import { useCallbackRef } from "./useCallbackRef.js";
+import { useToggle } from "./useToggle.js";
+import { useCallback, useRef, useState } from "react";
+import { copyToClipboard } from "@zayne-labs/toolkit-core";
+
+//#region src/hooks/useCopyToClipboard.ts
+const useCopyToClipboard = (options = {}) => {
+	const { mimeType, onCopied, onError, onSuccess, timeout = 1500 } = options;
+	const [value, setValue] = useState("");
+	const [hasCopied, toggleHasCopied] = useToggle(false);
+	const timeoutRef = useRef(null);
+	const savedOnError = useCallbackRef(onError);
+	const savedOnSuccess = useCallbackRef(onSuccess);
+	const savedOnCopied = useCallbackRef(onCopied);
+	const handleHasCopied = useCallback(() => {
+		toggleHasCopied(true);
+		timeoutRef.current && clearTimeout(timeoutRef.current);
+		timeoutRef.current = setTimeout(() => {
+			toggleHasCopied(false);
+		}, timeout);
+	}, [toggleHasCopied, timeout]);
+	return {
+		handleCopy: useCallback((valueToCopy) => {
+			setValue(valueToCopy);
+			copyToClipboard(valueToCopy, {
+				mimeType,
+				onCopied: () => {
+					savedOnCopied();
+					handleHasCopied();
+				},
+				onError: savedOnError,
+				onSuccess: savedOnSuccess
+			});
+		}, [
+			handleHasCopied,
+			mimeType,
+			savedOnCopied,
+			savedOnError,
+			savedOnSuccess
+		]),
+		hasCopied,
+		setValue,
+		value
+	};
+};
+
+//#endregion
+export { useCopyToClipboard };
+//# sourceMappingURL=useCopyToClipboard.js.map

package/dist/esm/hooks/useCopyToClipboard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCopyToClipboard.js","names":[],"sources":["../../../src/hooks/useCopyToClipboard.ts"],"sourcesContent":["import {\n\ttype AllowedClipboardItems,\n\ttype CopyToClipboardOptions,\n\tcopyToClipboard,\n} from \"@zayne-labs/toolkit-core\";\nimport { useCallback, useRef, useState } from \"react\";\nimport { useCallbackRef } from \"./useCallbackRef\";\nimport { useToggle } from \"./useToggle\";\n\nconst useCopyToClipboard = (options: CopyToClipboardOptions & { timeout?: number } = {}) => {\n\tconst { mimeType, onCopied, onError, onSuccess, timeout = 1500 } = options;\n\n\tconst [value, setValue] = useState<AllowedClipboardItems>(\"\");\n\n\tconst [hasCopied, toggleHasCopied] = useToggle(false);\n\tconst timeoutRef = useRef<number | null>(null);\n\n\tconst savedOnError = useCallbackRef(onError);\n\tconst savedOnSuccess = useCallbackRef(onSuccess);\n\tconst savedOnCopied = useCallbackRef(onCopied);\n\n\tconst handleHasCopied = useCallback(() => {\n\t\ttoggleHasCopied(true);\n\n\t\ttimeoutRef.current && clearTimeout(timeoutRef.current);\n\n\t\ttimeoutRef.current = setTimeout(() => {\n\t\t\ttoggleHasCopied(false);\n\t\t}, timeout) as never;\n\t}, [toggleHasCopied, timeout]);\n\n\tconst handleCopy = useCallback(\n\t\t(valueToCopy: AllowedClipboardItems) => {\n\t\t\tsetValue(valueToCopy);\n\n\t\t\tvoid copyToClipboard(valueToCopy, {\n\t\t\t\tmimeType,\n\t\t\t\tonCopied: () => {\n\t\t\t\t\tsavedOnCopied();\n\t\t\t\t\thandleHasCopied();\n\t\t\t\t},\n\t\t\t\tonError: savedOnError,\n\t\t\t\tonSuccess: savedOnSuccess,\n\t\t\t});\n\t\t},\n\t\t[handleHasCopied, mimeType, savedOnCopied, savedOnError, savedOnSuccess]\n\t);\n\n\treturn { handleCopy, hasCopied, setValue, value };\n};\n\nexport { useCopyToClipboard };\n"],"mappings":";;;;;;AASA,MAAM,sBAAsB,UAAyD,EAAE,KAAK;CAC3F,MAAM,EAAE,UAAU,UAAU,SAAS,WAAW,UAAU,SAAS;CAEnE,MAAM,CAAC,OAAO,YAAY,SAAgC,GAAG;CAE7D,MAAM,CAAC,WAAW,mBAAmB,UAAU,MAAM;CACrD,MAAM,aAAa,OAAsB,KAAK;CAE9C,MAAM,eAAe,eAAe,QAAQ;CAC5C,MAAM,iBAAiB,eAAe,UAAU;CAChD,MAAM,gBAAgB,eAAe,SAAS;CAE9C,MAAM,kBAAkB,kBAAkB;AACzC,kBAAgB,KAAK;AAErB,aAAW,WAAW,aAAa,WAAW,QAAQ;AAEtD,aAAW,UAAU,iBAAiB;AACrC,mBAAgB,MAAM;KACpB,QAAQ;IACT,CAAC,iBAAiB,QAAQ,CAAC;AAmB9B,QAAO;EAAE,YAjBU,aACjB,gBAAuC;AACvC,YAAS,YAAY;AAErB,GAAK,gBAAgB,aAAa;IACjC;IACA,gBAAgB;AACf,oBAAe;AACf,sBAAiB;;IAElB,SAAS;IACT,WAAW;IACX,CAAC;KAEH;GAAC;GAAiB;GAAU;GAAe;GAAc;GAAe,CACxE;EAEoB;EAAW;EAAU;EAAO"}

package/dist/esm/hooks/useDebounce.d.ts

@@ -0,0 +1,23 @@
+import * as react4 from "react";
+import { CallbackFn } from "@zayne-labs/toolkit-type-helpers";
+
+//#region src/hooks/useDebounce.d.ts
+declare const useDebouncedFn: <TParams>(callBackFn: CallbackFn<TParams>, delay: number | undefined) => {
+  (...params: TParams[]): void;
+  (params: TParams | TParams[], overrideOptions: {
+    $delay: number;
+  }): void;
+  cancel: () => void;
+  cancelMaxWait(): void;
+};
+declare const useDebouncedState: <TValue>(defaultValue: TValue, delay: number | undefined) => readonly [TValue, {
+  (...params: react4.SetStateAction<TValue>[]): void;
+  (params: react4.SetStateAction<TValue> | react4.SetStateAction<TValue>[], overrideOptions: {
+    $delay: number;
+  }): void;
+  cancel: () => void;
+  cancelMaxWait(): void;
+}, react4.Dispatch<react4.SetStateAction<TValue>>];
+//#endregion
+export { useDebouncedFn, useDebouncedState };
+//# sourceMappingURL=useDebounce.d.ts.map

package/dist/esm/hooks/useDebounce.js

@@ -0,0 +1,32 @@
+import { useCallbackRef } from "./useCallbackRef.js";
+import { useUnmountEffect } from "./effects/useUnMountEffect.js";
+import { useMemo, useState } from "react";
+import { debounce } from "@zayne-labs/toolkit-core";
+
+//#region src/hooks/useDebounce.ts
+const useDebouncedFn = (callBackFn, delay) => {
+	const latestCallback = useCallbackRef(callBackFn);
+	const debouncedFn = useMemo(() => debounce(latestCallback, delay), [delay, latestCallback]);
+	useUnmountEffect(() => {
+		debouncedFn.cancel();
+		debouncedFn.cancelMaxWait();
+	});
+	return debouncedFn;
+};
+const useDebouncedState = (defaultValue, delay) => {
+	const [value, setValue] = useState(defaultValue);
+	const setDebouncedValue = useMemo(() => debounce(setValue, delay), [delay]);
+	useUnmountEffect(() => {
+		setDebouncedValue.cancel();
+		setDebouncedValue.cancelMaxWait();
+	});
+	return [
+		value,
+		setDebouncedValue,
+		setValue
+	];
+};
+
+//#endregion
+export { useDebouncedFn, useDebouncedState };
+//# sourceMappingURL=useDebounce.js.map

package/dist/esm/hooks/useDebounce.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDebounce.js","names":[],"sources":["../../../src/hooks/useDebounce.ts"],"sourcesContent":["import { debounce } from \"@zayne-labs/toolkit-core\";\nimport type { CallbackFn } from \"@zayne-labs/toolkit-type-helpers\";\nimport { useMemo, useState } from \"react\";\nimport { useUnmountEffect } from \"./effects/useUnMountEffect\";\nimport { useCallbackRef } from \"./useCallbackRef\";\n\nexport const useDebouncedFn = <TParams>(callBackFn: CallbackFn<TParams>, delay: number | undefined) => {\n\tconst latestCallback = useCallbackRef(callBackFn);\n\n\tconst debouncedFn = useMemo(() => debounce(latestCallback, delay), [delay, latestCallback]);\n\n\tuseUnmountEffect(() => {\n\t\tdebouncedFn.cancel();\n\t\tdebouncedFn.cancelMaxWait();\n\t});\n\n\treturn debouncedFn;\n};\n\nexport const useDebouncedState = <TValue>(defaultValue: TValue, delay: number | undefined) => {\n\tconst [value, setValue] = useState(defaultValue);\n\n\tconst setDebouncedValue = useMemo(() => debounce(setValue, delay), [delay]);\n\n\tuseUnmountEffect(() => {\n\t\tsetDebouncedValue.cancel();\n\t\tsetDebouncedValue.cancelMaxWait();\n\t});\n\n\treturn [value, setDebouncedValue, setValue] as const;\n};\n"],"mappings":";;;;;;AAMA,MAAa,kBAA2B,YAAiC,UAA8B;CACtG,MAAM,iBAAiB,eAAe,WAAW;CAEjD,MAAM,cAAc,cAAc,SAAS,gBAAgB,MAAM,EAAE,CAAC,OAAO,eAAe,CAAC;AAE3F,wBAAuB;AACtB,cAAY,QAAQ;AACpB,cAAY,eAAe;GAC1B;AAEF,QAAO;;AAGR,MAAa,qBAA6B,cAAsB,UAA8B;CAC7F,MAAM,CAAC,OAAO,YAAY,SAAS,aAAa;CAEhD,MAAM,oBAAoB,cAAc,SAAS,UAAU,MAAM,EAAE,CAAC,MAAM,CAAC;AAE3E,wBAAuB;AACtB,oBAAkB,QAAQ;AAC1B,oBAAkB,eAAe;GAChC;AAEF,QAAO;EAAC;EAAO;EAAmB;EAAS"}

package/dist/esm/hooks/useDisclosure.d.ts

@@ -0,0 +1,14 @@
+//#region src/hooks/useDisclosure.d.ts
+type DisclosureOptions = {
+  hasScrollControl?: boolean;
+  initialState?: boolean | (() => boolean);
+};
+declare const useDisclosure: (options?: DisclosureOptions) => {
+  isOpen: boolean;
+  onClose: () => void;
+  onOpen: () => void;
+  onToggle: <TValue>(value?: TValue) => void;
+};
+//#endregion
+export { useDisclosure };
+//# sourceMappingURL=useDisclosure.d.ts.map

package/dist/esm/hooks/useDisclosure.js

@@ -0,0 +1,42 @@
+import { useCallbackRef } from "./useCallbackRef.js";
+import { useToggle } from "./useToggle.js";
+import { useMemo } from "react";
+import { lockScroll } from "@zayne-labs/toolkit-core";
+import { isBoolean } from "@zayne-labs/toolkit-type-helpers";
+
+//#region src/hooks/useDisclosure.ts
+const useDisclosure = (options = {}) => {
+	const { hasScrollControl = false, initialState = false } = options;
+	const [isOpen, toggleIsOpen] = useToggle(initialState);
+	const onOpen = useCallbackRef(() => {
+		toggleIsOpen(true);
+		hasScrollControl && lockScroll({ lock: true });
+	});
+	const onClose = useCallbackRef(() => {
+		toggleIsOpen(false);
+		hasScrollControl && lockScroll({ lock: false });
+	});
+	const onToggle = useCallbackRef((value) => {
+		if (isBoolean(value)) {
+			toggleIsOpen(value);
+			hasScrollControl && lockScroll({ lock: value });
+			return;
+		}
+		isOpen ? onClose() : onOpen();
+	});
+	return useMemo(() => ({
+		isOpen,
+		onClose,
+		onOpen,
+		onToggle
+	}), [
+		isOpen,
+		onClose,
+		onOpen,
+		onToggle
+	]);
+};
+
+//#endregion
+export { useDisclosure };
+//# sourceMappingURL=useDisclosure.js.map

package/dist/esm/hooks/useDisclosure.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDisclosure.js","names":[],"sources":["../../../src/hooks/useDisclosure.ts"],"sourcesContent":["import { lockScroll } from \"@zayne-labs/toolkit-core\";\nimport { isBoolean } from \"@zayne-labs/toolkit-type-helpers\";\nimport { useMemo } from \"react\";\nimport { useCallbackRef } from \"./useCallbackRef\";\nimport { useToggle } from \"./useToggle\";\n\ntype DisclosureOptions = {\n\thasScrollControl?: boolean;\n\tinitialState?: boolean | (() => boolean);\n};\n\nconst useDisclosure = (options: DisclosureOptions = {}) => {\n\tconst { hasScrollControl = false, initialState = false } = options;\n\tconst [isOpen, toggleIsOpen] = useToggle(initialState);\n\n\tconst onOpen = useCallbackRef(() => {\n\t\ttoggleIsOpen(true);\n\t\thasScrollControl && lockScroll({ lock: true });\n\t});\n\n\tconst onClose = useCallbackRef(() => {\n\t\ttoggleIsOpen(false);\n\t\thasScrollControl && lockScroll({ lock: false });\n\t});\n\n\tconst onToggle = useCallbackRef(<TValue>(value?: TValue) => {\n\t\tif (isBoolean(value)) {\n\t\t\ttoggleIsOpen(value);\n\t\t\thasScrollControl && lockScroll({ lock: value });\n\t\t\treturn;\n\t\t}\n\n\t\tisOpen ? onClose() : onOpen();\n\t});\n\n\tconst api = useMemo(() => ({ isOpen, onClose, onOpen, onToggle }), [isOpen, onClose, onOpen, onToggle]);\n\n\treturn api;\n};\nexport { useDisclosure };\n"],"mappings":";;;;;;;AAWA,MAAM,iBAAiB,UAA6B,EAAE,KAAK;CAC1D,MAAM,EAAE,mBAAmB,OAAO,eAAe,UAAU;CAC3D,MAAM,CAAC,QAAQ,gBAAgB,UAAU,aAAa;CAEtD,MAAM,SAAS,qBAAqB;AACnC,eAAa,KAAK;AAClB,sBAAoB,WAAW,EAAE,MAAM,MAAM,CAAC;GAC7C;CAEF,MAAM,UAAU,qBAAqB;AACpC,eAAa,MAAM;AACnB,sBAAoB,WAAW,EAAE,MAAM,OAAO,CAAC;GAC9C;CAEF,MAAM,WAAW,gBAAwB,UAAmB;AAC3D,MAAI,UAAU,MAAM,EAAE;AACrB,gBAAa,MAAM;AACnB,uBAAoB,WAAW,EAAE,MAAM,OAAO,CAAC;AAC/C;;AAGD,WAAS,SAAS,GAAG,QAAQ;GAC5B;AAIF,QAFY,eAAe;EAAE;EAAQ;EAAS;EAAQ;EAAU,GAAG;EAAC;EAAQ;EAAS;EAAQ;EAAS,CAAC"}

package/dist/esm/hooks/useIsHydrated.d.ts

@@ -0,0 +1,28 @@
+//#region src/hooks/useIsHydrated.d.ts
+/**
+ * @description Return a boolean indicating if the JS has been hydrated already.
+ * When doing Server-Side Rendering, the result will always be false.
+ * When doing Client-Side Rendering, the result will always be false on the
+ * first render and true from then on. Even if a new component renders it will
+ * always start with true.
+ *
+ * @see https://github.com/sergiodxa/remix-utils/blob/main/src/react/use-hydrated.ts
+ *
+ * @see https://github.com/sergiodxa/remix-utils/blob/main/src/react/use-hydrated.ts
+ *
+ * @example
+ * **Example: Disable a button that needs JS to work.**
+ * ```tsx
+ * const isHydrated = useIsHydrated();
+ *
+ * return (
+ *   <button type="button" disabled={!isHydrated} onClick={doSomethingCustom}>
+ *     Click me
+ *   </button>
+ * );
+ * ```
+ */
+declare const useIsHydrated: () => boolean;
+//#endregion
+export { useIsHydrated };
+//# sourceMappingURL=useIsHydrated.d.ts.map

package/dist/esm/hooks/useIsHydrated.js

@@ -0,0 +1,39 @@
+import { useSyncExternalStore } from "react";
+
+//#region src/hooks/useIsHydrated.ts
+const noop = () => {};
+const noopStore = {
+	getServerSnapshot: () => true,
+	getSnapshot: () => false,
+	subscribe: () => noop
+};
+/**
+* @description Return a boolean indicating if the JS has been hydrated already.
+* When doing Server-Side Rendering, the result will always be false.
+* When doing Client-Side Rendering, the result will always be false on the
+* first render and true from then on. Even if a new component renders it will
+* always start with true.
+*
+* @see https://github.com/sergiodxa/remix-utils/blob/main/src/react/use-hydrated.ts
+*
+* @see https://github.com/sergiodxa/remix-utils/blob/main/src/react/use-hydrated.ts
+*
+* @example
+* **Example: Disable a button that needs JS to work.**
+* ```tsx
+* const isHydrated = useIsHydrated();
+*
+* return (
+*   <button type="button" disabled={!isHydrated} onClick={doSomethingCustom}>
+*     Click me
+*   </button>
+* );
+* ```
+*/
+const useIsHydrated = () => {
+	return useSyncExternalStore(noopStore.subscribe, noopStore.getSnapshot, noopStore.getServerSnapshot);
+};
+
+//#endregion
+export { useIsHydrated };
+//# sourceMappingURL=useIsHydrated.js.map

package/dist/esm/hooks/useIsHydrated.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useIsHydrated.js","names":[],"sources":["../../../src/hooks/useIsHydrated.ts"],"sourcesContent":["import { useSyncExternalStore } from \"react\";\n\nconst noop = () => {};\n\nconst noopStore = {\n\tgetServerSnapshot: () => true,\n\tgetSnapshot: () => false,\n\tsubscribe: () => noop,\n};\n\n/**\n * @description Return a boolean indicating if the JS has been hydrated already.\n * When doing Server-Side Rendering, the result will always be false.\n * When doing Client-Side Rendering, the result will always be false on the\n * first render and true from then on. Even if a new component renders it will\n * always start with true.\n *\n * @see https://github.com/sergiodxa/remix-utils/blob/main/src/react/use-hydrated.ts\n *\n * @see https://github.com/sergiodxa/remix-utils/blob/main/src/react/use-hydrated.ts\n *\n * @example\n * **Example: Disable a button that needs JS to work.**\n * ```tsx\n * const isHydrated = useIsHydrated();\n *\n * return (\n *   <button type=\"button\" disabled={!isHydrated} onClick={doSomethingCustom}>\n *     Click me\n *   </button>\n * );\n * ```\n */\nconst useIsHydrated = () => {\n\tconst isHydrated = useSyncExternalStore(\n\t\tnoopStore.subscribe,\n\t\tnoopStore.getSnapshot,\n\t\tnoopStore.getServerSnapshot\n\t);\n\n\treturn isHydrated;\n};\n\nexport { useIsHydrated };\n"],"mappings":";;;AAEA,MAAM,aAAa;AAEnB,MAAM,YAAY;CACjB,yBAAyB;CACzB,mBAAmB;CACnB,iBAAiB;CACjB;;;;;;;;;;;;;;;;;;;;;;;;AAyBD,MAAM,sBAAsB;AAO3B,QANmB,qBAClB,UAAU,WACV,UAAU,aACV,UAAU,kBACV"}

package/dist/esm/hooks/useLocationState.d.ts

@@ -0,0 +1,17 @@
+import * as _zayne_labs_toolkit_core0 from "@zayne-labs/toolkit-core";
+import { LocationInfo, LocationStoreApi, LocationStoreOptions } from "@zayne-labs/toolkit-core";
+import { SelectorFn } from "@zayne-labs/toolkit-type-helpers";
+
+//#region src/hooks/useLocationState.d.ts
+type UseLocationResult<TSlice> = [state: TSlice, actions: LocationStoreApi];
+declare const createUseLocationState: (options?: LocationStoreOptions) => Omit<_zayne_labs_toolkit_core0.StoreApi<_zayne_labs_toolkit_core0.URLInfoObject>, "resetState" | "setState"> & {
+  push: (url: string | _zayne_labs_toolkit_core0.PartialURLInfo, options?: {
+    state?: _zayne_labs_toolkit_core0.PartialURLInfo["state"];
+  }) => void;
+  replace: LocationStoreApi["push"];
+  triggerPopstateEvent: (nextLocationState?: LocationInfo["state"]) => void;
+} & (<TSlice = _zayne_labs_toolkit_core0.URLInfoObject>(selector?: SelectorFn<LocationInfo, TSlice>) => UseLocationResult<TSlice>);
+declare const useLocationState: <TSlice = LocationInfo>(selector?: SelectorFn<LocationInfo, TSlice>, options?: LocationStoreOptions) => UseLocationResult<TSlice>;
+//#endregion
+export { createUseLocationState, useLocationState };
+//# sourceMappingURL=useLocationState.d.ts.map

package/dist/esm/hooks/useLocationState.js

@@ -0,0 +1,24 @@
+import { useCallbackRef } from "./useCallbackRef.js";
+import { useStore } from "./useStore.js";
+import { useMemo } from "react";
+import { createLocationStore } from "@zayne-labs/toolkit-core";
+
+//#region src/hooks/useLocationState.ts
+const createUseLocationState = (options) => {
+	const locationStore = createLocationStore(options);
+	const useLocationState$1 = (selector) => {
+		return [useStore(locationStore, selector), locationStore];
+	};
+	Object.assign(useLocationState$1, locationStore);
+	return useLocationState$1;
+};
+const useLocationState = (selector, options = {}) => {
+	const { equalityFn } = options;
+	const savedEqualityFn = useCallbackRef(equalityFn);
+	const locationStore = useMemo(() => createLocationStore({ equalityFn: savedEqualityFn }), [savedEqualityFn]);
+	return [useStore(locationStore, selector), locationStore];
+};
+
+//#endregion
+export { createUseLocationState, useLocationState };
+//# sourceMappingURL=useLocationState.js.map

package/dist/esm/hooks/useLocationState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useLocationState.js","names":["useLocationState"],"sources":["../../../src/hooks/useLocationState.ts"],"sourcesContent":["import {\n\tcreateLocationStore,\n\ttype LocationInfo,\n\ttype LocationStoreApi,\n\ttype LocationStoreOptions,\n} from \"@zayne-labs/toolkit-core\";\nimport type { SelectorFn } from \"@zayne-labs/toolkit-type-helpers\";\nimport { useMemo } from \"react\";\nimport { useCallbackRef } from \"./useCallbackRef\";\nimport { useStore } from \"./useStore\";\n\ntype UseLocationResult<TSlice> = [state: TSlice, actions: LocationStoreApi];\n\nexport const createUseLocationState = (options?: LocationStoreOptions) => {\n\tconst locationStore = createLocationStore(options);\n\n\ttype UseBoundLocationState = LocationStoreApi\n\t\t& (<TSlice = LocationInfo>(\n\t\t\tselector?: SelectorFn<LocationInfo, TSlice>\n\t\t) => UseLocationResult<TSlice>);\n\n\tconst useLocationState = <TSlice = LocationInfo>(\n\t\tselector?: SelectorFn<LocationInfo, TSlice>\n\t): UseLocationResult<TSlice> => {\n\t\tconst stateSlice = useStore(locationStore as never, selector);\n\n\t\treturn [stateSlice, locationStore];\n\t};\n\n\tObject.assign(useLocationState, locationStore);\n\n\treturn useLocationState as UseBoundLocationState;\n};\n\nexport const useLocationState = <TSlice = LocationInfo>(\n\tselector?: SelectorFn<LocationInfo, TSlice>,\n\toptions: LocationStoreOptions = {}\n): UseLocationResult<TSlice> => {\n\tconst { equalityFn } = options;\n\n\tconst savedEqualityFn = useCallbackRef(equalityFn);\n\n\tconst locationStore = useMemo(\n\t\t() => createLocationStore({ equalityFn: savedEqualityFn }),\n\t\t[savedEqualityFn]\n\t);\n\n\tconst stateSlice = useStore(locationStore as never, selector);\n\n\treturn [stateSlice, locationStore];\n};\n"],"mappings":";;;;;;AAaA,MAAa,0BAA0B,YAAmC;CACzE,MAAM,gBAAgB,oBAAoB,QAAQ;CAOlD,MAAMA,sBACL,aAC+B;AAG/B,SAAO,CAFY,SAAS,eAAwB,SAAS,EAEzC,cAAc;;AAGnC,QAAO,OAAOA,oBAAkB,cAAc;AAE9C,QAAOA;;AAGR,MAAa,oBACZ,UACA,UAAgC,EAAE,KACH;CAC/B,MAAM,EAAE,eAAe;CAEvB,MAAM,kBAAkB,eAAe,WAAW;CAElD,MAAM,gBAAgB,cACf,oBAAoB,EAAE,YAAY,iBAAiB,CAAC,EAC1D,CAAC,gBAAgB,CACjB;AAID,QAAO,CAFY,SAAS,eAAwB,SAAS,EAEzC,cAAc"}

package/dist/esm/hooks/useScrollObserver.d.ts

@@ -0,0 +1,11 @@
+import { RefCallback } from "react";
+import { ScrollObserverOptions } from "@zayne-labs/toolkit-core";
+
+//#region src/hooks/useScrollObserver.d.ts
+declare const useScrollObserver: <TElement extends HTMLElement>(options?: ScrollObserverOptions) => {
+  isScrolled: boolean;
+  observedElementRef: RefCallback<TElement>;
+};
+//#endregion
+export { useScrollObserver };
+//# sourceMappingURL=useScrollObserver.d.ts.map

package/dist/esm/hooks/useScrollObserver.js

@@ -0,0 +1,44 @@
+import { useCallbackRef } from "./useCallbackRef.js";
+import { useMemo, useState } from "react";
+import { createScrollObserver } from "@zayne-labs/toolkit-core";
+
+//#region src/hooks/useScrollObserver.ts
+const useScrollObserver = (options = {}) => {
+	const { onIntersection, root, rootMargin = "10px 0px 0px 0px", threshold } = options;
+	const [isScrolled, setIsScrolled] = useState(false);
+	const savedOnIntersection = useCallbackRef(onIntersection);
+	const { handleObservation } = useMemo(() => {
+		return createScrollObserver({
+			onIntersection: (entry, observer) => {
+				const newIsScrolledState = !entry.isIntersecting;
+				setIsScrolled(newIsScrolledState);
+				entry.target.dataset.scrolled = String(newIsScrolledState);
+				savedOnIntersection(entry, observer);
+			},
+			root,
+			rootMargin,
+			threshold
+		});
+	}, [
+		root,
+		rootMargin,
+		savedOnIntersection,
+		threshold
+	]);
+	const observedElementRef = useCallbackRef((element) => {
+		const cleanupFn = handleObservation(element);
+		if (!element) {
+			cleanupFn?.();
+			return;
+		}
+		return cleanupFn;
+	});
+	return {
+		isScrolled,
+		observedElementRef
+	};
+};
+
+//#endregion
+export { useScrollObserver };
+//# sourceMappingURL=useScrollObserver.js.map

package/dist/esm/hooks/useScrollObserver.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useScrollObserver.js","names":["observedElementRef: RefCallback<TElement>"],"sources":["../../../src/hooks/useScrollObserver.ts"],"sourcesContent":["import { createScrollObserver, type ScrollObserverOptions } from \"@zayne-labs/toolkit-core\";\nimport { type RefCallback, useMemo, useState } from \"react\";\nimport { useCallbackRef } from \"./useCallbackRef\";\n\nconst useScrollObserver = <TElement extends HTMLElement>(options: ScrollObserverOptions = {}) => {\n\tconst { onIntersection, root, rootMargin = \"10px 0px 0px 0px\", threshold } = options;\n\n\tconst [isScrolled, setIsScrolled] = useState(false);\n\n\tconst savedOnIntersection = useCallbackRef(onIntersection);\n\n\tconst { handleObservation } = useMemo(() => {\n\t\treturn createScrollObserver({\n\t\t\tonIntersection: (entry, observer) => {\n\t\t\t\tconst newIsScrolledState = !entry.isIntersecting;\n\n\t\t\t\tsetIsScrolled(newIsScrolledState);\n\n\t\t\t\t// eslint-disable-next-line no-param-reassign -- Mutation is fine here\n\t\t\t\t(entry.target as HTMLElement).dataset.scrolled = String(newIsScrolledState);\n\n\t\t\t\tsavedOnIntersection(entry, observer);\n\t\t\t},\n\t\t\troot,\n\t\t\trootMargin,\n\t\t\tthreshold,\n\t\t});\n\t}, [root, rootMargin, savedOnIntersection, threshold]);\n\n\tconst observedElementRef: RefCallback<TElement> = useCallbackRef((element) => {\n\t\tconst cleanupFn = handleObservation(element);\n\n\t\t// == React 18 may not call the cleanup function so we need to call it manually on element unmount\n\t\tif (!element) {\n\t\t\tcleanupFn?.();\n\t\t\treturn;\n\t\t}\n\n\t\treturn cleanupFn;\n\t});\n\n\treturn { isScrolled, observedElementRef };\n};\n\nexport { useScrollObserver };\n"],"mappings":";;;;;AAIA,MAAM,qBAAmD,UAAiC,EAAE,KAAK;CAChG,MAAM,EAAE,gBAAgB,MAAM,aAAa,oBAAoB,cAAc;CAE7E,MAAM,CAAC,YAAY,iBAAiB,SAAS,MAAM;CAEnD,MAAM,sBAAsB,eAAe,eAAe;CAE1D,MAAM,EAAE,sBAAsB,cAAc;AAC3C,SAAO,qBAAqB;GAC3B,iBAAiB,OAAO,aAAa;IACpC,MAAM,qBAAqB,CAAC,MAAM;AAElC,kBAAc,mBAAmB;AAGjC,IAAC,MAAM,OAAuB,QAAQ,WAAW,OAAO,mBAAmB;AAE3E,wBAAoB,OAAO,SAAS;;GAErC;GACA;GACA;GACA,CAAC;IACA;EAAC;EAAM;EAAY;EAAqB;EAAU,CAAC;CAEtD,MAAMA,qBAA4C,gBAAgB,YAAY;EAC7E,MAAM,YAAY,kBAAkB,QAAQ;AAG5C,MAAI,CAAC,SAAS;AACb,gBAAa;AACb;;AAGD,SAAO;GACN;AAEF,QAAO;EAAE;EAAY;EAAoB"}

package/dist/esm/hooks/useSearch.d.ts

@@ -0,0 +1,12 @@
+import * as react9 from "react";
+
+//#region src/hooks/useSearch.d.ts
+declare const useSearch: <TData>(initialData: TData[], delay?: number) => {
+  data: TData[];
+  isLoading: boolean;
+  query: string;
+  setQuery: react9.Dispatch<react9.SetStateAction<string>>;
+};
+//#endregion
+export { useSearch };
+//# sourceMappingURL=useSearch.d.ts.map

package/dist/esm/hooks/useSearch.js

@@ -0,0 +1,40 @@
+import { useAfterMountEffect } from "./effects/useAfterMountEffect.js";
+import { useDebouncedFn } from "./useDebounce.js";
+import { useState } from "react";
+import { isPlainObject } from "@zayne-labs/toolkit-type-helpers";
+
+//#region src/hooks/useSearch.ts
+const isSerializable = (item) => typeof item === "string" || typeof item === "number" || typeof item === "boolean";
+const checkObjectPropsForQuery = (item, query) => {
+	for (const value of Object.values(item)) if (isSerializable(value) && value.toString().toLowerCase().includes(query)) return true;
+	return false;
+};
+const useSearch = (initialData, delay) => {
+	const [searchQuery, setSearchQuery] = useState("");
+	const [filteredData, setFilteredData] = useState(initialData);
+	const [isLoading, setIsLoading] = useState(false);
+	const handleDebouncedSearch = useDebouncedFn(() => {
+		const query = searchQuery.toLowerCase();
+		const filteredResults = initialData.filter((item) => {
+			if (isSerializable(item)) return item.toString().toLowerCase().includes(query);
+			if (isPlainObject(item)) return checkObjectPropsForQuery(item, query);
+			return false;
+		});
+		setFilteredData(filteredResults);
+		setIsLoading(false);
+	}, delay);
+	useAfterMountEffect(() => {
+		setIsLoading(true);
+		handleDebouncedSearch();
+	}, [searchQuery]);
+	return {
+		data: filteredData,
+		isLoading,
+		query: searchQuery,
+		setQuery: setSearchQuery
+	};
+};
+
+//#endregion
+export { useSearch };
+//# sourceMappingURL=useSearch.js.map

package/dist/esm/hooks/useSearch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSearch.js","names":[],"sources":["../../../src/hooks/useSearch.ts"],"sourcesContent":["import { isPlainObject } from \"@zayne-labs/toolkit-type-helpers\";\nimport { useState } from \"react\";\nimport { useAfterMountEffect } from \"./effects/useAfterMountEffect\";\nimport { useDebouncedFn } from \"./useDebounce\";\n\nconst isSerializable = (item: unknown): item is boolean | number | string =>\n\ttypeof item === \"string\" || typeof item === \"number\" || typeof item === \"boolean\";\n\nconst checkObjectPropsForQuery = (item: Record<string, unknown>, query: string): boolean => {\n\tfor (const value of Object.values(item)) {\n\t\tif (isSerializable(value) && value.toString().toLowerCase().includes(query)) {\n\t\t\treturn true;\n\t\t}\n\t}\n\treturn false;\n};\n\nconst useSearch = <TData>(initialData: TData[], delay?: number) => {\n\tconst [searchQuery, setSearchQuery] = useState(\"\");\n\tconst [filteredData, setFilteredData] = useState(initialData);\n\tconst [isLoading, setIsLoading] = useState(false);\n\n\tconst handleDebouncedSearch = useDebouncedFn(() => {\n\t\tconst query = searchQuery.toLowerCase();\n\n\t\tconst filteredResults = initialData.filter((item) => {\n\t\t\tif (isSerializable(item)) {\n\t\t\t\treturn item.toString().toLowerCase().includes(query);\n\t\t\t}\n\n\t\t\tif (isPlainObject(item)) {\n\t\t\t\treturn checkObjectPropsForQuery(item, query);\n\t\t\t}\n\n\t\t\treturn false;\n\t\t});\n\n\t\tsetFilteredData(filteredResults);\n\t\tsetIsLoading(false);\n\t}, delay);\n\n\tuseAfterMountEffect(() => {\n\t\tsetIsLoading(true);\n\t\thandleDebouncedSearch();\n\t}, [searchQuery]);\n\n\treturn { data: filteredData, isLoading, query: searchQuery, setQuery: setSearchQuery };\n};\n\nexport { useSearch };\n"],"mappings":";;;;;;AAKA,MAAM,kBAAkB,SACvB,OAAO,SAAS,YAAY,OAAO,SAAS,YAAY,OAAO,SAAS;AAEzE,MAAM,4BAA4B,MAA+B,UAA2B;AAC3F,MAAK,MAAM,SAAS,OAAO,OAAO,KAAK,CACtC,KAAI,eAAe,MAAM,IAAI,MAAM,UAAU,CAAC,aAAa,CAAC,SAAS,MAAM,CAC1E,QAAO;AAGT,QAAO;;AAGR,MAAM,aAAoB,aAAsB,UAAmB;CAClE,MAAM,CAAC,aAAa,kBAAkB,SAAS,GAAG;CAClD,MAAM,CAAC,cAAc,mBAAmB,SAAS,YAAY;CAC7D,MAAM,CAAC,WAAW,gBAAgB,SAAS,MAAM;CAEjD,MAAM,wBAAwB,qBAAqB;EAClD,MAAM,QAAQ,YAAY,aAAa;EAEvC,MAAM,kBAAkB,YAAY,QAAQ,SAAS;AACpD,OAAI,eAAe,KAAK,CACvB,QAAO,KAAK,UAAU,CAAC,aAAa,CAAC,SAAS,MAAM;AAGrD,OAAI,cAAc,KAAK,CACtB,QAAO,yBAAyB,MAAM,MAAM;AAG7C,UAAO;IACN;AAEF,kBAAgB,gBAAgB;AAChC,eAAa,MAAM;IACjB,MAAM;AAET,2BAA0B;AACzB,eAAa,KAAK;AAClB,yBAAuB;IACrB,CAAC,YAAY,CAAC;AAEjB,QAAO;EAAE,MAAM;EAAc;EAAW,OAAO;EAAa,UAAU;EAAgB"}

package/dist/esm/hooks/useSearchParams.d.ts

@@ -0,0 +1,12 @@
+import * as _zayne_labs_toolkit_core5 from "@zayne-labs/toolkit-core";
+import { LocationStoreOptions, URLSearchParamsInit } from "@zayne-labs/toolkit-core";
+
+//#region src/hooks/useSearchParams.d.ts
+type UseSearchParamsOptions = LocationStoreOptions & {
+  action?: "push" | "replace";
+};
+declare const useSearchParams: <TSearchParams extends URLSearchParamsInit>(options?: UseSearchParamsOptions) => [searchParams: URLSearchParams, setSearchParams: (newQueryParams: TSearchParams | ((prev: URLSearchParams) => TSearchParams)) => void, triggerPopstateEvent: (nextLocationState?: _zayne_labs_toolkit_core5.LocationInfo["state"]) => void];
+declare const useSearchParamsObject: <TSearchParams extends Record<string, string>>(options?: UseSearchParamsOptions) => [searchParamsObject: TSearchParams, setSearchParamsObject: (newQueryParams: TSearchParams | ((prev: TSearchParams) => TSearchParams)) => void, triggerPopstateEvent: (nextLocationState?: _zayne_labs_toolkit_core5.LocationInfo["state"]) => void];
+//#endregion
+export { useSearchParams, useSearchParamsObject };
+//# sourceMappingURL=useSearchParams.d.ts.map