react-simplikit 0.1.0 → 0.2.0

package/CHANGELOG.md

@@ -1,5 +1,25 @@
 # react-simplikit
 
+## 0.2.0
+
+### Minor Changes
+
+- [#446](https://github.com/toss/react-simplikit/pull/446) [`0b66d40`](https://github.com/toss/react-simplikit/commit/0b66d40e56b4a183fd1fc5dce8a685e2a0da2839) Thanks [@hyesungoh](https://github.com/hyesungoh)! - `useDebouncedCallback` and `useThrottledCallback` now accept any value type: `onChange` is typed `(newValue: T) => void` instead of `(newValue: boolean) => void`, so a debounced search query or a throttled scroll position no longer needs a cast. Existing boolean callers are unaffected.
+
+  `useDebouncedCallback` no longer drops a first call of `false`. It compared incoming values against a seed of `false`, so the very first `false` looked redundant and was never forwarded; the comparison now starts from a sentinel, as `useThrottledCallback` already did. A `false` that arrives while an initial `true` is still pending now replaces it instead of being ignored.
+
+  `useImpressionRef` no longer emits `onImpressionEnd` for an element that was never impressed.
+
+### Patch Changes
+
+- [#450](https://github.com/toss/react-simplikit/pull/450) [`a4251a3`](https://github.com/toss/react-simplikit/commit/a4251a30aafbfabc61e6cc9a80de1af86936bb2a) Thanks [@hyesungoh](https://github.com/hyesungoh)! - `useDebouncedCallback` and `useThrottledCallback` no longer forward a stale value when the caller returns to the last forwarded one. Calling with `'seo'` and then `'seoul'` right after `'seoul'` had already been forwarded used to skip the second call as a duplicate without cancelling the pending `'seo'`, so `onChange('seo')` fired anyway. The pending call is now cancelled first. For `useThrottledCallback` this only showed with `edges: ['trailing']`; the default leading edge forwards the intermediate value immediately and masked it.
+
+- [#452](https://github.com/toss/react-simplikit/pull/452) [`fd312f5`](https://github.com/toss/react-simplikit/commit/fd312f589430154d38b7d5d5998f1f20ceb0be54) Thanks [@hyesungoh](https://github.com/hyesungoh)! - JSDoc corrections that show up in editor hover. `useIntersectionObserver`'s `options.root` is typed `Element | Document | null` instead of `boolean`. `useList` and `useSet` now declare their generic parameter, their optional initial state and every member they return. `mergeProps` and `mergeRefs` mark their rest parameter as one, so the documented signature matches the implementation.
+
+- [#456](https://github.com/toss/react-simplikit/pull/456) [`65ce435`](https://github.com/toss/react-simplikit/commit/65ce435abfca276f2a22c01b6ff50dc5530831fc) Thanks [@mnxmnz](https://github.com/mnxmnz)! - Re-export the `SafeAreaInset` type from the package root. `@react-simplikit/mobile` exported it, but it was dropped when that package was absorbed into the root entry, leaving `import type { SafeAreaInset }` with no replacement.
+
+- [#435](https://github.com/toss/react-simplikit/pull/435) [`9e05182`](https://github.com/toss/react-simplikit/commit/9e051826418a852996ae851a7f8c8e53c1408852) Thanks [@hyesungoh](https://github.com/hyesungoh)! - `useDoubleClick`, `useGeolocation`, `useImpressionRef`, `useIntersectionObserver`, `useLongPress`, `useOutsideClickEffect`, `useStorageState` and `useVisibilityEvent` are no longer marked `@deprecated`. They are maintained hooks again: editors stop rendering them struck-through, and no removal is planned.
+
 ## 0.1.0
 
 ### Minor Changes

package/README.md

@@ -4,7 +4,7 @@
 [![MIT License](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/toss/react-simplikit/blob/main/LICENSE)
 [![codecov](https://codecov.io/gh/toss/react-simplikit/graph/badge.svg?token=RHVOZ3J3TU)](https://codecov.io/gh/toss/react-simplikit)
 
-English | [한국어](./README-ko_kr.md) | [日本語](./README-ja_jp.md)
+English | [한국어](./README-ko_kr.md) | [日本語](./README-ja_jp.md) | [简体中文](./README-zh_hans.md) | [Español](./README-es.md)
 
 A lightweight, zero-dependency React utilities library providing hooks, components, and utilities.
 
@@ -16,46 +16,6 @@ A lightweight, zero-dependency React utilities library providing hooks, componen
 - **SSR-safe** - Works with Next.js and other SSR frameworks
 - **Tree-shakeable** - Only bundle what you use
 
-## Library Direction
-
-**react-simplikit is now maintained as a Universal Hook Library providing only pure state/logic hooks.**
-
-We are repositioning react-simplikit to focus exclusively on **platform-independent hooks** that work seamlessly across web and mobile (React Native, etc.).
-
-### What's Maintained: Pure State/Logic Hooks
-
-Hooks that don't depend on specific platform APIs will continue to be actively maintained:
-
-- State management hooks like `useToggle`, `useBooleanState`, `useCounter`
-- Lifecycle hooks like `usePrevious`
-- Utility hooks like `useDebounce`, `useThrottle`
-- **Backward compatibility (BC) is preserved** for these existing pure logic hooks
-
-### What's Deprecated: Browser/Platform-Dependent Hooks
-
-The following hooks that strongly depend on browser-specific APIs are now deprecated:
-
-- `useGeolocation` - depends on `navigator.geolocation`
-- `useStorageState` - depends on `localStorage`/`sessionStorage`
-- `useIntersectionObserver` - depends on `IntersectionObserver` API
-- `useImpressionRef` - depends on `IntersectionObserver` + Visibility API
-- `useDoubleClick`, `useLongPress` - depend on DOM events + `window.setTimeout`
-- `useOutsideClickEffect` - depends on DOM events + `document`
-- `useVisibilityEvent` - depends on `document.visibilityState`
-
-These hooks:
-
-- Will not receive new features or major enhancements
-- Are marked as `@deprecated` in documentation
-- May be removed in future major versions
-
-### Package Status
-
-- react-simplikit will **not be archived**
-- Pure state/logic hooks will continue to be maintained
-- Critical bug fixes and minimal maintenance will continue
-- No new browser/platform-dependent hooks will be added
-
 ## Installation
 
 ```bash

package/dist/hooks/useDebouncedCallback/useDebouncedCallback.cjs

@@ -4,31 +4,49 @@ const require_usePreservedCallback = require("../usePreservedCallback/usePreserv
 let react = require("react");
 //#region src/hooks/useDebouncedCallback/useDebouncedCallback.ts
 /**
+* Marks that no value has been forwarded to `onChange` yet.
+*
+* The hook skips redundant invocations by comparing against the last forwarded value, but it
+* receives no initial value from the caller. Seeding that comparison with a real value would treat
+* the first call of that value as redundant and swallow it, so an unreachable sentinel is used instead.
+*/
+const NOT_INVOKED = Symbol("NOT_INVOKED");
+/**
 * @description
 * `useDebouncedCallback` is a React hook that returns a debounced version of the provided callback function.
 * It helps optimize event handling by delaying function execution and grouping multiple calls into one.
 *
 * Note that if both 'leading' and 'trailing' are set, the function will be called at both the start and end of the delay period. However, it must be called at least twice within debounceMs interval for this to happen, since one debounced function call cannot trigger the function twice.
 *
+* @template T - The type of the value passed to `onChange`.
 * @param {Object} options - The options object.
-* @param {Function} options.onChange - The callback function to debounce.
+* @param {(newValue: T) => void} options.onChange - The callback to debounce. A call with the same value as the last forwarded one is skipped.
 * @param {number} options.timeThreshold - The number of milliseconds to delay the function execution.
 * @param {boolean} [options.leading=false] - If `true`, the function is called at the start of the sequence.
 * @param {boolean} [options.trailing=true] - If `true`, the function is called at the end of the sequence.
 *
-* @returns {Function} A debounced function that delays invoking the callback.
+* @returns {(nextValue: T) => void} A debounced function that forwards the value to `onChange`.
 *
 * @example
+* import { useDebouncedCallback } from 'react-simplikit';
+* import { useState } from 'react';
+*
 * function SearchInput() {
 *   const [query, setQuery] = useState('');
-*   const debouncedSetQuery = useDebouncedCallback({ onChange: setQuery, timeThreshold: 100 });
-*   return <input type="text" onChange={(e) => debouncedSetQuery(e.target.value)} />;
+*   const setQueryDebounced = useDebouncedCallback({ onChange: setQuery, timeThreshold: 300 });
+*
+*   return (
+*     <>
+*       <input onChange={e => setQueryDebounced(e.target.value)} />
+*       <p>Searching for: {query}</p>
+*     </>
+*   );
 * }
 */
 function useDebouncedCallback({ onChange, timeThreshold, leading = false, trailing = true }) {
 	const handleChange = require_usePreservedCallback.usePreservedCallback(onChange);
 	const ref = (0, react.useRef)({
-		value: false,
+		value: NOT_INVOKED,
 		clearPreviousDebounce: () => {}
 	});
 	(0, react.useEffect)(function clearDebouncedOnUnmount() {
@@ -44,12 +62,12 @@ function useDebouncedCallback({ onChange, timeThreshold, leading = false, traili
 		return _edges;
 	}, [leading, trailing]);
 	return (0, react.useCallback)((nextValue) => {
+		ref.current.clearPreviousDebounce();
 		if (nextValue === ref.current.value) return;
 		const debounced = require_debounce.debounce(() => {
 			handleChange(nextValue);
 			ref.current.value = nextValue;
 		}, timeThreshold, { edges });
-		ref.current.clearPreviousDebounce();
 		debounced();
 		ref.current.clearPreviousDebounce = debounced.cancel;
 	}, [

package/dist/hooks/useDebouncedCallback/useDebouncedCallback.d.cts

@@ -11,24 +11,34 @@ type DebounceOptions = {
  *
  * Note that if both 'leading' and 'trailing' are set, the function will be called at both the start and end of the delay period. However, it must be called at least twice within debounceMs interval for this to happen, since one debounced function call cannot trigger the function twice.
  *
+ * @template T - The type of the value passed to `onChange`.
  * @param {Object} options - The options object.
- * @param {Function} options.onChange - The callback function to debounce.
+ * @param {(newValue: T) => void} options.onChange - The callback to debounce. A call with the same value as the last forwarded one is skipped.
  * @param {number} options.timeThreshold - The number of milliseconds to delay the function execution.
  * @param {boolean} [options.leading=false] - If `true`, the function is called at the start of the sequence.
  * @param {boolean} [options.trailing=true] - If `true`, the function is called at the end of the sequence.
  *
- * @returns {Function} A debounced function that delays invoking the callback.
+ * @returns {(nextValue: T) => void} A debounced function that forwards the value to `onChange`.
  *
  * @example
+ * import { useDebouncedCallback } from 'react-simplikit';
+ * import { useState } from 'react';
+ *
  * function SearchInput() {
  *   const [query, setQuery] = useState('');
- *   const debouncedSetQuery = useDebouncedCallback({ onChange: setQuery, timeThreshold: 100 });
- *   return <input type="text" onChange={(e) => debouncedSetQuery(e.target.value)} />;
+ *   const setQueryDebounced = useDebouncedCallback({ onChange: setQuery, timeThreshold: 300 });
+ *
+ *   return (
+ *     <>
+ *       <input onChange={e => setQueryDebounced(e.target.value)} />
+ *       <p>Searching for: {query}</p>
+ *     </>
+ *   );
  * }
  */
-declare function useDebouncedCallback({ onChange, timeThreshold, leading, trailing }: DebounceOptions & {
-  onChange: (newValue: boolean) => void;
+declare function useDebouncedCallback<T>({ onChange, timeThreshold, leading, trailing }: DebounceOptions & {
+  onChange: (newValue: T) => void;
   timeThreshold: number;
-}): (nextValue: boolean) => void;
+}): (nextValue: T) => void;
 //#endregion
 export { useDebouncedCallback };

package/dist/hooks/useDebouncedCallback/useDebouncedCallback.d.mts

@@ -11,24 +11,34 @@ type DebounceOptions = {
  *
  * Note that if both 'leading' and 'trailing' are set, the function will be called at both the start and end of the delay period. However, it must be called at least twice within debounceMs interval for this to happen, since one debounced function call cannot trigger the function twice.
  *
+ * @template T - The type of the value passed to `onChange`.
  * @param {Object} options - The options object.
- * @param {Function} options.onChange - The callback function to debounce.
+ * @param {(newValue: T) => void} options.onChange - The callback to debounce. A call with the same value as the last forwarded one is skipped.
  * @param {number} options.timeThreshold - The number of milliseconds to delay the function execution.
  * @param {boolean} [options.leading=false] - If `true`, the function is called at the start of the sequence.
  * @param {boolean} [options.trailing=true] - If `true`, the function is called at the end of the sequence.
  *
- * @returns {Function} A debounced function that delays invoking the callback.
+ * @returns {(nextValue: T) => void} A debounced function that forwards the value to `onChange`.
  *
  * @example
+ * import { useDebouncedCallback } from 'react-simplikit';
+ * import { useState } from 'react';
+ *
  * function SearchInput() {
  *   const [query, setQuery] = useState('');
- *   const debouncedSetQuery = useDebouncedCallback({ onChange: setQuery, timeThreshold: 100 });
- *   return <input type="text" onChange={(e) => debouncedSetQuery(e.target.value)} />;
+ *   const setQueryDebounced = useDebouncedCallback({ onChange: setQuery, timeThreshold: 300 });
+ *
+ *   return (
+ *     <>
+ *       <input onChange={e => setQueryDebounced(e.target.value)} />
+ *       <p>Searching for: {query}</p>
+ *     </>
+ *   );
  * }
  */
-declare function useDebouncedCallback({ onChange, timeThreshold, leading, trailing }: DebounceOptions & {
-  onChange: (newValue: boolean) => void;
+declare function useDebouncedCallback<T>({ onChange, timeThreshold, leading, trailing }: DebounceOptions & {
+  onChange: (newValue: T) => void;
   timeThreshold: number;
-}): (nextValue: boolean) => void;
+}): (nextValue: T) => void;
 //#endregion
 export { useDebouncedCallback };

package/dist/hooks/useDebouncedCallback/useDebouncedCallback.mjs

@@ -4,31 +4,49 @@ import { usePreservedCallback } from "../usePreservedCallback/usePreservedCallba
 import { useCallback, useEffect, useMemo, useRef } from "react";
 //#region src/hooks/useDebouncedCallback/useDebouncedCallback.ts
 /**
+* Marks that no value has been forwarded to `onChange` yet.
+*
+* The hook skips redundant invocations by comparing against the last forwarded value, but it
+* receives no initial value from the caller. Seeding that comparison with a real value would treat
+* the first call of that value as redundant and swallow it, so an unreachable sentinel is used instead.
+*/
+const NOT_INVOKED = Symbol("NOT_INVOKED");
+/**
 * @description
 * `useDebouncedCallback` is a React hook that returns a debounced version of the provided callback function.
 * It helps optimize event handling by delaying function execution and grouping multiple calls into one.
 *
 * Note that if both 'leading' and 'trailing' are set, the function will be called at both the start and end of the delay period. However, it must be called at least twice within debounceMs interval for this to happen, since one debounced function call cannot trigger the function twice.
 *
+* @template T - The type of the value passed to `onChange`.
 * @param {Object} options - The options object.
-* @param {Function} options.onChange - The callback function to debounce.
+* @param {(newValue: T) => void} options.onChange - The callback to debounce. A call with the same value as the last forwarded one is skipped.
 * @param {number} options.timeThreshold - The number of milliseconds to delay the function execution.
 * @param {boolean} [options.leading=false] - If `true`, the function is called at the start of the sequence.
 * @param {boolean} [options.trailing=true] - If `true`, the function is called at the end of the sequence.
 *
-* @returns {Function} A debounced function that delays invoking the callback.
+* @returns {(nextValue: T) => void} A debounced function that forwards the value to `onChange`.
 *
 * @example
+* import { useDebouncedCallback } from 'react-simplikit';
+* import { useState } from 'react';
+*
 * function SearchInput() {
 *   const [query, setQuery] = useState('');
-*   const debouncedSetQuery = useDebouncedCallback({ onChange: setQuery, timeThreshold: 100 });
-*   return <input type="text" onChange={(e) => debouncedSetQuery(e.target.value)} />;
+*   const setQueryDebounced = useDebouncedCallback({ onChange: setQuery, timeThreshold: 300 });
+*
+*   return (
+*     <>
+*       <input onChange={e => setQueryDebounced(e.target.value)} />
+*       <p>Searching for: {query}</p>
+*     </>
+*   );
 * }
 */
 function useDebouncedCallback({ onChange, timeThreshold, leading = false, trailing = true }) {
 	const handleChange = usePreservedCallback(onChange);
 	const ref = useRef({
-		value: false,
+		value: NOT_INVOKED,
 		clearPreviousDebounce: () => {}
 	});
 	useEffect(function clearDebouncedOnUnmount() {
@@ -44,12 +62,12 @@ function useDebouncedCallback({ onChange, timeThreshold, leading = false, traili
 		return _edges;
 	}, [leading, trailing]);
 	return useCallback((nextValue) => {
+		ref.current.clearPreviousDebounce();
 		if (nextValue === ref.current.value) return;
 		const debounced = debounce(() => {
 			handleChange(nextValue);
 			ref.current.value = nextValue;
 		}, timeThreshold, { edges });
-		ref.current.clearPreviousDebounce();
 		debounced();
 		ref.current.clearPreviousDebounce = debounced.cancel;
 	}, [

package/dist/hooks/useDoubleClick/useDoubleClick.cjs

@@ -3,10 +3,6 @@ const require_usePreservedCallback = require("../usePreservedCallback/usePreserv
 let react = require("react");
 //#region src/hooks/useDoubleClick/useDoubleClick.ts
 /**
-* @deprecated This hook is deprecated as it depends on browser-specific APIs (DOM events, window.setTimeout).
-* react-simplikit is now focused on platform-independent, pure state/logic hooks.
-* This hook will be removed in a future major version.
-*
 * @description
 * `useDoubleClick` is a React hook that differentiates between single and double click events.
 * It delays the single click callback execution for a specified time, and cancels it if a second click (i.e. a double click) occurs within that time.

package/dist/hooks/useDoubleClick/useDoubleClick.d.cts

@@ -7,10 +7,6 @@ type UseDoubleClickProps<E extends HTMLElement> = {
   doubleClick: (event: MouseEvent<E>) => void;
 };
 /**
- * @deprecated This hook is deprecated as it depends on browser-specific APIs (DOM events, window.setTimeout).
- * react-simplikit is now focused on platform-independent, pure state/logic hooks.
- * This hook will be removed in a future major version.
- *
  * @description
  * `useDoubleClick` is a React hook that differentiates between single and double click events.
  * It delays the single click callback execution for a specified time, and cancels it if a second click (i.e. a double click) occurs within that time.

package/dist/hooks/useDoubleClick/useDoubleClick.d.mts

@@ -7,10 +7,6 @@ type UseDoubleClickProps<E extends HTMLElement> = {
   doubleClick: (event: MouseEvent<E>) => void;
 };
 /**
- * @deprecated This hook is deprecated as it depends on browser-specific APIs (DOM events, window.setTimeout).
- * react-simplikit is now focused on platform-independent, pure state/logic hooks.
- * This hook will be removed in a future major version.
- *
  * @description
  * `useDoubleClick` is a React hook that differentiates between single and double click events.
  * It delays the single click callback execution for a specified time, and cancels it if a second click (i.e. a double click) occurs within that time.

package/dist/hooks/useDoubleClick/useDoubleClick.mjs

@@ -3,10 +3,6 @@ import { usePreservedCallback } from "../usePreservedCallback/usePreservedCallba
 import { useCallback, useEffect, useRef } from "react";
 //#region src/hooks/useDoubleClick/useDoubleClick.ts
 /**
-* @deprecated This hook is deprecated as it depends on browser-specific APIs (DOM events, window.setTimeout).
-* react-simplikit is now focused on platform-independent, pure state/logic hooks.
-* This hook will be removed in a future major version.
-*
 * @description
 * `useDoubleClick` is a React hook that differentiates between single and double click events.
 * It delays the single click callback execution for a specified time, and cancels it if a second click (i.e. a double click) occurs within that time.

package/dist/hooks/useGeolocation/useGeolocation.cjs

@@ -14,10 +14,6 @@ const GeolocationMountBehavior = {
 	WATCH: "watch"
 };
 /**
-* @deprecated This hook is deprecated as it depends on browser-specific APIs (navigator.geolocation).
-* react-simplikit is now focused on platform-independent, pure state/logic hooks.
-* This hook will be removed in a future major version.
-*
 * @description
 * `useGeolocation` is a React hook that retrieves and tracks the user's geographical location.
 * It uses the browser's `Geolocation API` to support both one-time position retrieval and continuous location tracking.

package/dist/hooks/useGeolocation/useGeolocation.d.cts

@@ -26,10 +26,6 @@ type GeolocationOptions = {
   mountBehavior?: GeolocationMountBehaviorType;
 } & PositionOptions;
 /**
- * @deprecated This hook is deprecated as it depends on browser-specific APIs (navigator.geolocation).
- * react-simplikit is now focused on platform-independent, pure state/logic hooks.
- * This hook will be removed in a future major version.
- *
  * @description
  * `useGeolocation` is a React hook that retrieves and tracks the user's geographical location.
  * It uses the browser's `Geolocation API` to support both one-time position retrieval and continuous location tracking.

package/dist/hooks/useGeolocation/useGeolocation.d.mts

@@ -26,10 +26,6 @@ type GeolocationOptions = {
   mountBehavior?: GeolocationMountBehaviorType;
 } & PositionOptions;
 /**
- * @deprecated This hook is deprecated as it depends on browser-specific APIs (navigator.geolocation).
- * react-simplikit is now focused on platform-independent, pure state/logic hooks.
- * This hook will be removed in a future major version.
- *
  * @description
  * `useGeolocation` is a React hook that retrieves and tracks the user's geographical location.
  * It uses the browser's `Geolocation API` to support both one-time position retrieval and continuous location tracking.

package/dist/hooks/useGeolocation/useGeolocation.mjs

@@ -14,10 +14,6 @@ const GeolocationMountBehavior = {
 	WATCH: "watch"
 };
 /**
-* @deprecated This hook is deprecated as it depends on browser-specific APIs (navigator.geolocation).
-* react-simplikit is now focused on platform-independent, pure state/logic hooks.
-* This hook will be removed in a future major version.
-*
 * @description
 * `useGeolocation` is a React hook that retrieves and tracks the user's geographical location.
 * It uses the browser's `Geolocation API` to support both one-time position retrieval and continuous location tracking.

package/dist/hooks/useImpressionRef/useImpressionRef.cjs

@@ -6,10 +6,6 @@ const require_useVisibilityEvent = require("../useVisibilityEvent/useVisibilityE
 let react = require("react");
 //#region src/hooks/useImpressionRef/useImpressionRef.ts
 /**
-* @deprecated This hook is deprecated as it depends on browser-specific APIs (IntersectionObserver, Visibility API).
-* react-simplikit is now focused on platform-independent, pure state/logic hooks.
-* This hook will be removed in a future major version.
-*
 * @description
 * `useImpressionRef` is a React hook that measures the time a specific DOM element is visible on the screen and executes callbacks when the element enters or exits the viewport.
 * It uses `IntersectionObserver` and the `Visibility API` to track the element's visibility.
@@ -41,10 +37,16 @@ function useImpressionRef({ onImpressionStart = () => {}, onImpressionEnd = () =
 	const impressionStartHandler = require_usePreservedCallback.usePreservedCallback(onImpressionStart);
 	const impressionEndHandler = require_usePreservedCallback.usePreservedCallback(onImpressionEnd);
 	const isIntersectingRef = (0, react.useRef)(false);
+	const hasImpressionStartedRef = (0, react.useRef)(false);
 	const impressionEventHandler = require_useDebouncedCallback.useDebouncedCallback({
 		timeThreshold,
 		onChange: (impressed) => {
-			(impressed ? impressionStartHandler : impressionEndHandler)();
+			if (impressed) {
+				hasImpressionStartedRef.current = true;
+				impressionStartHandler();
+				return;
+			}
+			if (hasImpressionStartedRef.current) impressionEndHandler();
 		},
 		leading: true
 	});

package/dist/hooks/useImpressionRef/useImpressionRef.d.cts

@@ -8,10 +8,6 @@ type UseImpressionRefOptions = Partial<{
   timeThreshold: number;
 }>;
 /**
- * @deprecated This hook is deprecated as it depends on browser-specific APIs (IntersectionObserver, Visibility API).
- * react-simplikit is now focused on platform-independent, pure state/logic hooks.
- * This hook will be removed in a future major version.
- *
  * @description
  * `useImpressionRef` is a React hook that measures the time a specific DOM element is visible on the screen and executes callbacks when the element enters or exits the viewport.
  * It uses `IntersectionObserver` and the `Visibility API` to track the element's visibility.

package/dist/hooks/useImpressionRef/useImpressionRef.d.mts

@@ -8,10 +8,6 @@ type UseImpressionRefOptions = Partial<{
   timeThreshold: number;
 }>;
 /**
- * @deprecated This hook is deprecated as it depends on browser-specific APIs (IntersectionObserver, Visibility API).
- * react-simplikit is now focused on platform-independent, pure state/logic hooks.
- * This hook will be removed in a future major version.
- *
  * @description
  * `useImpressionRef` is a React hook that measures the time a specific DOM element is visible on the screen and executes callbacks when the element enters or exits the viewport.
  * It uses `IntersectionObserver` and the `Visibility API` to track the element's visibility.

package/dist/hooks/useImpressionRef/useImpressionRef.mjs

@@ -6,10 +6,6 @@ import { useVisibilityEvent } from "../useVisibilityEvent/useVisibilityEvent.mjs
 import { useRef } from "react";
 //#region src/hooks/useImpressionRef/useImpressionRef.ts
 /**
-* @deprecated This hook is deprecated as it depends on browser-specific APIs (IntersectionObserver, Visibility API).
-* react-simplikit is now focused on platform-independent, pure state/logic hooks.
-* This hook will be removed in a future major version.
-*
 * @description
 * `useImpressionRef` is a React hook that measures the time a specific DOM element is visible on the screen and executes callbacks when the element enters or exits the viewport.
 * It uses `IntersectionObserver` and the `Visibility API` to track the element's visibility.
@@ -41,10 +37,16 @@ function useImpressionRef({ onImpressionStart = () => {}, onImpressionEnd = () =
 	const impressionStartHandler = usePreservedCallback(onImpressionStart);
 	const impressionEndHandler = usePreservedCallback(onImpressionEnd);
 	const isIntersectingRef = useRef(false);
+	const hasImpressionStartedRef = useRef(false);
 	const impressionEventHandler = useDebouncedCallback({
 		timeThreshold,
 		onChange: (impressed) => {
-			(impressed ? impressionStartHandler : impressionEndHandler)();
+			if (impressed) {
+				hasImpressionStartedRef.current = true;
+				impressionStartHandler();
+				return;
+			}
+			if (hasImpressionStartedRef.current) impressionEndHandler();
 		},
 		leading: true
 	});

package/dist/hooks/useIntersectionObserver/useIntersectionObserver.cjs

@@ -4,10 +4,6 @@ const require_useRefEffect = require("../useRefEffect/useRefEffect.cjs");
 let react = require("react");
 //#region src/hooks/useIntersectionObserver/useIntersectionObserver.ts
 /**
-* @deprecated This hook is deprecated as it depends on browser-specific APIs (IntersectionObserver).
-* react-simplikit is now focused on platform-independent, pure state/logic hooks.
-* This hook will be removed in a future major version.
-*
 * @description
 * `useIntersectionObserver` is a React hook that detects whether a specific DOM element is visible on the screen.
 * It uses the `IntersectionObserver` API to execute a callback when the element enters or exits the viewport.
@@ -15,7 +11,7 @@ let react = require("react");
 * @param {(entry: IntersectionObserverEntry) => void} callback - A callback function that is executed when the visibility of the element changes.
 *   You can check `entry.isIntersecting` to determine if the element is in view.
 * @param {IntersectionObserverInit} options - Options for the `IntersectionObserver`.
-* @param {boolean} [options.root] - The element that is used as the viewport for checking visibility of the target.
+* @param {Element | Document | null} [options.root] - The element that is used as the viewport for checking visibility of the target.
 * @param {string} [options.rootMargin] - Margin around the root.
 * @param {number | number[]} [options.threshold] - Either a single number or an array of numbers which indicate at what percentage of the target's visibility the observer's callback should be executed.
 *

package/dist/hooks/useIntersectionObserver/useIntersectionObserver.d.cts

@@ -1,10 +1,6 @@
 
 //#region src/hooks/useIntersectionObserver/useIntersectionObserver.d.ts
 /**
- * @deprecated This hook is deprecated as it depends on browser-specific APIs (IntersectionObserver).
- * react-simplikit is now focused on platform-independent, pure state/logic hooks.
- * This hook will be removed in a future major version.
- *
  * @description
  * `useIntersectionObserver` is a React hook that detects whether a specific DOM element is visible on the screen.
  * It uses the `IntersectionObserver` API to execute a callback when the element enters or exits the viewport.
@@ -12,7 +8,7 @@
  * @param {(entry: IntersectionObserverEntry) => void} callback - A callback function that is executed when the visibility of the element changes.
  *   You can check `entry.isIntersecting` to determine if the element is in view.
  * @param {IntersectionObserverInit} options - Options for the `IntersectionObserver`.
- * @param {boolean} [options.root] - The element that is used as the viewport for checking visibility of the target.
+ * @param {Element | Document | null} [options.root] - The element that is used as the viewport for checking visibility of the target.
  * @param {string} [options.rootMargin] - Margin around the root.
  * @param {number | number[]} [options.threshold] - Either a single number or an array of numbers which indicate at what percentage of the target's visibility the observer's callback should be executed.
  *

package/dist/hooks/useIntersectionObserver/useIntersectionObserver.d.mts

@@ -1,10 +1,6 @@
 
 //#region src/hooks/useIntersectionObserver/useIntersectionObserver.d.ts
 /**
- * @deprecated This hook is deprecated as it depends on browser-specific APIs (IntersectionObserver).
- * react-simplikit is now focused on platform-independent, pure state/logic hooks.
- * This hook will be removed in a future major version.
- *
  * @description
  * `useIntersectionObserver` is a React hook that detects whether a specific DOM element is visible on the screen.
  * It uses the `IntersectionObserver` API to execute a callback when the element enters or exits the viewport.
@@ -12,7 +8,7 @@
  * @param {(entry: IntersectionObserverEntry) => void} callback - A callback function that is executed when the visibility of the element changes.
  *   You can check `entry.isIntersecting` to determine if the element is in view.
  * @param {IntersectionObserverInit} options - Options for the `IntersectionObserver`.
- * @param {boolean} [options.root] - The element that is used as the viewport for checking visibility of the target.
+ * @param {Element | Document | null} [options.root] - The element that is used as the viewport for checking visibility of the target.
  * @param {string} [options.rootMargin] - Margin around the root.
  * @param {number | number[]} [options.threshold] - Either a single number or an array of numbers which indicate at what percentage of the target's visibility the observer's callback should be executed.
  *

package/dist/hooks/useIntersectionObserver/useIntersectionObserver.mjs

@@ -4,10 +4,6 @@ import { useRefEffect } from "../useRefEffect/useRefEffect.mjs";
 import { useMemo } from "react";
 //#region src/hooks/useIntersectionObserver/useIntersectionObserver.ts
 /**
-* @deprecated This hook is deprecated as it depends on browser-specific APIs (IntersectionObserver).
-* react-simplikit is now focused on platform-independent, pure state/logic hooks.
-* This hook will be removed in a future major version.
-*
 * @description
 * `useIntersectionObserver` is a React hook that detects whether a specific DOM element is visible on the screen.
 * It uses the `IntersectionObserver` API to execute a callback when the element enters or exits the viewport.
@@ -15,7 +11,7 @@ import { useMemo } from "react";
 * @param {(entry: IntersectionObserverEntry) => void} callback - A callback function that is executed when the visibility of the element changes.
 *   You can check `entry.isIntersecting` to determine if the element is in view.
 * @param {IntersectionObserverInit} options - Options for the `IntersectionObserver`.
-* @param {boolean} [options.root] - The element that is used as the viewport for checking visibility of the target.
+* @param {Element | Document | null} [options.root] - The element that is used as the viewport for checking visibility of the target.
 * @param {string} [options.rootMargin] - Margin around the root.
 * @param {number | number[]} [options.threshold] - Either a single number or an array of numbers which indicate at what percentage of the target's visibility the observer's callback should be executed.
 *

package/dist/hooks/useList/useList.cjs

@@ -8,15 +8,18 @@ let react = require("react");
 * A React hook that manages an array as state.
 * Provides efficient state management and stable action functions.
 *
-* @param {T[]} initialState - Initial array state
+* @template T - The type of the values held in the list.
 *
-* @returns {UseListReturn<T>} A tuple containing the array state and actions to manipulate it
-* - `push` - Appends a value to the end of the list
-* - `insertAt` - Inserts a value at the specified index
-* - `updateAt` - Updates the value at the specified index
-* - `removeAt` - Removes the value at the specified index
-* - `setAll` - Replaces the entire list with a new array
-* - `reset` - Resets the list to its initial state
+* @param {T[]} [initialState=[]] - Initial array state.
+*
+* @returns {UseListReturn<T>} A tuple containing the array state and actions to manipulate it.
+* - list `ReadonlyArray<T>` - The current array state;
+* - actions.push `(value: T) => void` - Appends a value to the end of the list;
+* - actions.insertAt `(index: number, value: T) => void` - Inserts a value at the specified index;
+* - actions.updateAt `(index: number, value: T) => void` - Updates the value at the specified index;
+* - actions.removeAt `(index: number) => void` - Removes the value at the specified index;
+* - actions.setAll `(values: T[]) => void` - Replaces the entire list with a new array;
+* - actions.reset `() => void` - Resets the list to its initial state;
 *
 * @example
 * ```tsx

package/dist/hooks/useList/useList.d.cts

@@ -14,15 +14,18 @@ type UseListReturn<T> = [ReadonlyArray<T>, ListActions<T>];
  * A React hook that manages an array as state.
  * Provides efficient state management and stable action functions.
  *
- * @param {T[]} initialState - Initial array state
- *
- * @returns {UseListReturn<T>} A tuple containing the array state and actions to manipulate it
- * - `push` - Appends a value to the end of the list
- * - `insertAt` - Inserts a value at the specified index
- * - `updateAt` - Updates the value at the specified index
- * - `removeAt` - Removes the value at the specified index
- * - `setAll` - Replaces the entire list with a new array
- * - `reset` - Resets the list to its initial state
+ * @template T - The type of the values held in the list.
+ *
+ * @param {T[]} [initialState=[]] - Initial array state.
+ *
+ * @returns {UseListReturn<T>} A tuple containing the array state and actions to manipulate it.
+ * - list `ReadonlyArray<T>` - The current array state;
+ * - actions.push `(value: T) => void` - Appends a value to the end of the list;
+ * - actions.insertAt `(index: number, value: T) => void` - Inserts a value at the specified index;
+ * - actions.updateAt `(index: number, value: T) => void` - Updates the value at the specified index;
+ * - actions.removeAt `(index: number) => void` - Removes the value at the specified index;
+ * - actions.setAll `(values: T[]) => void` - Replaces the entire list with a new array;
+ * - actions.reset `() => void` - Resets the list to its initial state;
  *
  * @example
  * ```tsx