react-simplikit 0.0.50 → 0.0.52

package/dist/hooks/useAsyncEffect/index.d.cts

@@ -1,25 +1,3 @@
-import { DependencyList } from 'react';
 
-/**
- * @description
- * `useAsyncEffect` is a React hook for handling asynchronous side effects in React components.
- * It follows the same cleanup pattern as `useEffect` while ensuring async operations are handled safely.
- *
- * @param {() => Promise<void | (() => void)>} [effect] - An asynchronous function executed in the `useEffect` pattern.
- *   This function can optionally return a cleanup function.
- * @param {DependencyList} [deps] - A dependency array.
- *   The effect will re-run whenever any value in this array changes. If omitted, it runs only once when the component mounts.
- *
- * @example
- * useAsyncEffect(async () => {
- *   const data = await fetchData();
- *   setData(data);
- *
- *   return () => {
- *     console.log('Cleanup on unmount or dependencies change');
- *   };
- * }, [dependencies]);
- */
-declare function useAsyncEffect(effect: () => Promise<void | (() => void)>, deps?: DependencyList): void;
-
-export { useAsyncEffect };
+import { useAsyncEffect } from "./useAsyncEffect.cjs";
+export { useAsyncEffect };

package/dist/hooks/useAsyncEffect/index.d.mts

@@ -0,0 +1,3 @@
+
+import { useAsyncEffect } from "./useAsyncEffect.mjs";
+export { useAsyncEffect };

package/dist/hooks/useAsyncEffect/useAsyncEffect.cjs

@@ -0,0 +1,39 @@
+"use client";
+let react = require("react");
+//#region src/hooks/useAsyncEffect/useAsyncEffect.ts
+/**
+* @description
+* `useAsyncEffect` is a React hook for handling asynchronous side effects in React components.
+* It follows the same cleanup pattern as `useEffect` while ensuring async operations are handled safely.
+*
+* @param {() => Promise<void | (() => void)>} [effect] - An asynchronous function executed in the `useEffect` pattern.
+*   This function can optionally return a cleanup function.
+* @param {DependencyList} [deps] - A dependency array.
+*   The effect will re-run whenever any value in this array changes. If omitted, it runs only once when the component mounts.
+*
+* @example
+* useAsyncEffect(async () => {
+*   const data = await fetchData();
+*   setData(data);
+*
+*   return () => {
+*     console.log('Cleanup on unmount or dependencies change');
+*   };
+* }, [dependencies]);
+*/
+function useAsyncEffect(effect, deps) {
+	(0, react.useEffect)(() => {
+		let cleanup;
+		let isCleaned = false;
+		effect().then((result) => {
+			cleanup = result;
+			if (isCleaned) cleanup?.();
+		});
+		return () => {
+			isCleaned = true;
+			cleanup?.();
+		};
+	}, deps);
+}
+//#endregion
+exports.useAsyncEffect = useAsyncEffect;

package/{esm/hooks/useAsyncEffect/index.d.ts → dist/hooks/useAsyncEffect/useAsyncEffect.d.cts}

@@ -1,5 +1,6 @@
-import { DependencyList } from 'react';
 
+import { DependencyList } from "react";
+//#region src/hooks/useAsyncEffect/useAsyncEffect.d.ts
 /**
  * @description
  * `useAsyncEffect` is a React hook for handling asynchronous side effects in React components.
@@ -21,5 +22,5 @@ import { DependencyList } from 'react';
  * }, [dependencies]);
  */
 declare function useAsyncEffect(effect: () => Promise<void | (() => void)>, deps?: DependencyList): void;
-
-export { useAsyncEffect };
+//#endregion
+export { useAsyncEffect };

package/dist/hooks/useAsyncEffect/useAsyncEffect.d.mts

@@ -0,0 +1,26 @@
+
+import { DependencyList } from "react";
+//#region src/hooks/useAsyncEffect/useAsyncEffect.d.ts
+/**
+ * @description
+ * `useAsyncEffect` is a React hook for handling asynchronous side effects in React components.
+ * It follows the same cleanup pattern as `useEffect` while ensuring async operations are handled safely.
+ *
+ * @param {() => Promise<void | (() => void)>} [effect] - An asynchronous function executed in the `useEffect` pattern.
+ *   This function can optionally return a cleanup function.
+ * @param {DependencyList} [deps] - A dependency array.
+ *   The effect will re-run whenever any value in this array changes. If omitted, it runs only once when the component mounts.
+ *
+ * @example
+ * useAsyncEffect(async () => {
+ *   const data = await fetchData();
+ *   setData(data);
+ *
+ *   return () => {
+ *     console.log('Cleanup on unmount or dependencies change');
+ *   };
+ * }, [dependencies]);
+ */
+declare function useAsyncEffect(effect: () => Promise<void | (() => void)>, deps?: DependencyList): void;
+//#endregion
+export { useAsyncEffect };

package/dist/hooks/useAsyncEffect/useAsyncEffect.mjs

@@ -0,0 +1,39 @@
+"use client";
+import { useEffect } from "react";
+//#region src/hooks/useAsyncEffect/useAsyncEffect.ts
+/**
+* @description
+* `useAsyncEffect` is a React hook for handling asynchronous side effects in React components.
+* It follows the same cleanup pattern as `useEffect` while ensuring async operations are handled safely.
+*
+* @param {() => Promise<void | (() => void)>} [effect] - An asynchronous function executed in the `useEffect` pattern.
+*   This function can optionally return a cleanup function.
+* @param {DependencyList} [deps] - A dependency array.
+*   The effect will re-run whenever any value in this array changes. If omitted, it runs only once when the component mounts.
+*
+* @example
+* useAsyncEffect(async () => {
+*   const data = await fetchData();
+*   setData(data);
+*
+*   return () => {
+*     console.log('Cleanup on unmount or dependencies change');
+*   };
+* }, [dependencies]);
+*/
+function useAsyncEffect(effect, deps) {
+	useEffect(() => {
+		let cleanup;
+		let isCleaned = false;
+		effect().then((result) => {
+			cleanup = result;
+			if (isCleaned) cleanup?.();
+		});
+		return () => {
+			isCleaned = true;
+			cleanup?.();
+		};
+	}, deps);
+}
+//#endregion
+export { useAsyncEffect };

package/dist/hooks/useBooleanState/useBooleanState.cjs

@@ -0,0 +1,36 @@
+"use client";
+let react = require("react");
+//#region src/hooks/useBooleanState/useBooleanState.ts
+/**
+* @description
+* `useBooleanState` is a React hook that simplifies managing a boolean state.
+* It provides functions to set the state to `true`, set it to `false`, and toggle its value.
+*
+* @param {boolean} [defaultValue=false] - The initial value of the state. Defaults to `false`.
+*
+* @returns {readonly [state: boolean, setTrue: () => void, setFalse: () => void, toggle: () => void]} A tuple containing:
+* - state `boolean` - The current state value;
+* - setTrue `() => void` - A function to set the state to `true`;
+* - setFalse `() => void` - A function to set the state to `false`;
+* - toggle `() => void` - A function to toggle the state;
+*
+* @example
+* const [open, openBottomSheet, closeBottomSheet, toggleBottomSheet] = useBooleanState(false);
+*/
+function useBooleanState(defaultValue = false) {
+	const [bool, setBool] = (0, react.useState)(defaultValue);
+	return [
+		bool,
+		(0, react.useCallback)(() => {
+			setBool(true);
+		}, []),
+		(0, react.useCallback)(() => {
+			setBool(false);
+		}, []),
+		(0, react.useCallback)(() => {
+			setBool((prevBool) => !prevBool);
+		}, [])
+	];
+}
+//#endregion
+exports.useBooleanState = useBooleanState;

package/dist/hooks/useBooleanState/{index.d.cts → useBooleanState.d.cts}

@@ -1,3 +1,5 @@
+
+//#region src/hooks/useBooleanState/useBooleanState.d.ts
 /**
  * @description
  * `useBooleanState` is a React hook that simplifies managing a boolean state.
@@ -15,5 +17,5 @@
  * const [open, openBottomSheet, closeBottomSheet, toggleBottomSheet] = useBooleanState(false);
  */
 declare function useBooleanState(defaultValue?: boolean): readonly [boolean, () => void, () => void, () => void];
-
-export { useBooleanState };
+//#endregion
+export { useBooleanState };

package/{esm/hooks/useBooleanState/index.d.ts → dist/hooks/useBooleanState/useBooleanState.d.mts}

@@ -1,3 +1,5 @@
+
+//#region src/hooks/useBooleanState/useBooleanState.d.ts
 /**
  * @description
  * `useBooleanState` is a React hook that simplifies managing a boolean state.
@@ -15,5 +17,5 @@
  * const [open, openBottomSheet, closeBottomSheet, toggleBottomSheet] = useBooleanState(false);
  */
 declare function useBooleanState(defaultValue?: boolean): readonly [boolean, () => void, () => void, () => void];
-
-export { useBooleanState };
+//#endregion
+export { useBooleanState };

package/dist/hooks/useBooleanState/useBooleanState.mjs

@@ -0,0 +1,36 @@
+"use client";
+import { useCallback, useState } from "react";
+//#region src/hooks/useBooleanState/useBooleanState.ts
+/**
+* @description
+* `useBooleanState` is a React hook that simplifies managing a boolean state.
+* It provides functions to set the state to `true`, set it to `false`, and toggle its value.
+*
+* @param {boolean} [defaultValue=false] - The initial value of the state. Defaults to `false`.
+*
+* @returns {readonly [state: boolean, setTrue: () => void, setFalse: () => void, toggle: () => void]} A tuple containing:
+* - state `boolean` - The current state value;
+* - setTrue `() => void` - A function to set the state to `true`;
+* - setFalse `() => void` - A function to set the state to `false`;
+* - toggle `() => void` - A function to toggle the state;
+*
+* @example
+* const [open, openBottomSheet, closeBottomSheet, toggleBottomSheet] = useBooleanState(false);
+*/
+function useBooleanState(defaultValue = false) {
+	const [bool, setBool] = useState(defaultValue);
+	return [
+		bool,
+		useCallback(() => {
+			setBool(true);
+		}, []),
+		useCallback(() => {
+			setBool(false);
+		}, []),
+		useCallback(() => {
+			setBool((prevBool) => !prevBool);
+		}, [])
+	];
+}
+//#endregion
+export { useBooleanState };

package/dist/hooks/useCallbackOncePerRender/index.d.cts

@@ -1,40 +1,3 @@
-import { DependencyList } from 'react';
 
-/**
- * @description
- * `useCallbackOncePerRender` is a React hook that ensures a callback function is executed only once, regardless of how many times it's called.
- *  This is useful for one-time operations that should not be repeated, even if the component re-renders.
- *
- * @param {() => void} callback - The callback function to be executed once.
- * @param {DependencyList} deps - Dependencies array that will trigger a new one-time execution when changed.
- *
- * @returns {(...args: any[]) => void} A memoized function that will only execute once until dependencies change.
- *
- * @example
- * import { useCallbackOncePerRender } from 'react-simplikit';
- *
- * function Component() {
- *   const handleOneTimeEvent = useCallbackOncePerRender(() => {
- *     console.log('This will only run once');
- *   }, []);
- *
- *   return <button onClick={handleOneTimeEvent}>Click me</button>;
- * }
- *
- * @example
- * // With dependencies
- * function TrackingComponent({ userId }: { userId: string }) {
- *   const trackUserVisit = useCallbackOncePerRender(() => {
- *     analytics.trackVisit(userId);
- *   }, [userId]);
- *
- *   useEffect(() => {
- *     trackUserVisit();
- *   }, [trackUserVisit]);
- *
- *   return <div>User page</div>;
- * }
- */
-declare function useCallbackOncePerRender<F extends (...args: any[]) => void>(callback: F, deps: DependencyList): (...args: Parameters<F>) => void;
-
-export { useCallbackOncePerRender };
+import { useCallbackOncePerRender } from "./useCallbackOncePerRender.cjs";
+export { useCallbackOncePerRender };

package/dist/hooks/useCallbackOncePerRender/index.d.mts

@@ -0,0 +1,3 @@
+
+import { useCallbackOncePerRender } from "./useCallbackOncePerRender.mjs";
+export { useCallbackOncePerRender };

package/dist/hooks/useCallbackOncePerRender/useCallbackOncePerRender.cjs

@@ -0,0 +1,52 @@
+"use client";
+const require_usePreservedCallback = require("../usePreservedCallback/usePreservedCallback.cjs");
+let react = require("react");
+//#region src/hooks/useCallbackOncePerRender/useCallbackOncePerRender.ts
+/**
+* @description
+* `useCallbackOncePerRender` is a React hook that ensures a callback function is executed only once, regardless of how many times it's called.
+*  This is useful for one-time operations that should not be repeated, even if the component re-renders.
+*
+* @param {() => void} callback - The callback function to be executed once.
+* @param {DependencyList} deps - Dependencies array that will trigger a new one-time execution when changed.
+*
+* @returns {(...args: any[]) => void} A memoized function that will only execute once until dependencies change.
+*
+* @example
+* import { useCallbackOncePerRender } from 'react-simplikit';
+*
+* function Component() {
+*   const handleOneTimeEvent = useCallbackOncePerRender(() => {
+*     console.log('This will only run once');
+*   }, []);
+*
+*   return <button onClick={handleOneTimeEvent}>Click me</button>;
+* }
+*
+* @example
+* // With dependencies
+* function TrackingComponent({ userId }: { userId: string }) {
+*   const trackUserVisit = useCallbackOncePerRender(() => {
+*     analytics.trackVisit(userId);
+*   }, [userId]);
+*
+*   useEffect(() => {
+*     trackUserVisit();
+*   }, [trackUserVisit]);
+*
+*   return <div>User page</div>;
+* }
+*/
+function useCallbackOncePerRender(callback, deps) {
+	const hasFired = (0, react.useRef)(false);
+	(0, react.useEffect)(() => {
+		hasFired.current = false;
+	}, deps);
+	return require_usePreservedCallback.usePreservedCallback((...args) => {
+		if (hasFired.current) return;
+		callback(...args);
+		hasFired.current = true;
+	});
+}
+//#endregion
+exports.useCallbackOncePerRender = useCallbackOncePerRender;

package/{esm/hooks/useCallbackOncePerRender/index.d.ts → dist/hooks/useCallbackOncePerRender/useCallbackOncePerRender.d.cts}

@@ -1,5 +1,6 @@
-import { DependencyList } from 'react';
 
+import { DependencyList } from "react";
+//#region src/hooks/useCallbackOncePerRender/useCallbackOncePerRender.d.ts
 /**
  * @description
  * `useCallbackOncePerRender` is a React hook that ensures a callback function is executed only once, regardless of how many times it's called.
@@ -36,5 +37,5 @@ import { DependencyList } from 'react';
  * }
  */
 declare function useCallbackOncePerRender<F extends (...args: any[]) => void>(callback: F, deps: DependencyList): (...args: Parameters<F>) => void;
-
-export { useCallbackOncePerRender };
+//#endregion
+export { useCallbackOncePerRender };

package/dist/hooks/useCallbackOncePerRender/useCallbackOncePerRender.d.mts

@@ -0,0 +1,41 @@
+
+import { DependencyList } from "react";
+//#region src/hooks/useCallbackOncePerRender/useCallbackOncePerRender.d.ts
+/**
+ * @description
+ * `useCallbackOncePerRender` is a React hook that ensures a callback function is executed only once, regardless of how many times it's called.
+ *  This is useful for one-time operations that should not be repeated, even if the component re-renders.
+ *
+ * @param {() => void} callback - The callback function to be executed once.
+ * @param {DependencyList} deps - Dependencies array that will trigger a new one-time execution when changed.
+ *
+ * @returns {(...args: any[]) => void} A memoized function that will only execute once until dependencies change.
+ *
+ * @example
+ * import { useCallbackOncePerRender } from 'react-simplikit';
+ *
+ * function Component() {
+ *   const handleOneTimeEvent = useCallbackOncePerRender(() => {
+ *     console.log('This will only run once');
+ *   }, []);
+ *
+ *   return <button onClick={handleOneTimeEvent}>Click me</button>;
+ * }
+ *
+ * @example
+ * // With dependencies
+ * function TrackingComponent({ userId }: { userId: string }) {
+ *   const trackUserVisit = useCallbackOncePerRender(() => {
+ *     analytics.trackVisit(userId);
+ *   }, [userId]);
+ *
+ *   useEffect(() => {
+ *     trackUserVisit();
+ *   }, [trackUserVisit]);
+ *
+ *   return <div>User page</div>;
+ * }
+ */
+declare function useCallbackOncePerRender<F extends (...args: any[]) => void>(callback: F, deps: DependencyList): (...args: Parameters<F>) => void;
+//#endregion
+export { useCallbackOncePerRender };

package/dist/hooks/useCallbackOncePerRender/useCallbackOncePerRender.mjs

@@ -0,0 +1,52 @@
+"use client";
+import { usePreservedCallback } from "../usePreservedCallback/usePreservedCallback.mjs";
+import { useEffect, useRef } from "react";
+//#region src/hooks/useCallbackOncePerRender/useCallbackOncePerRender.ts
+/**
+* @description
+* `useCallbackOncePerRender` is a React hook that ensures a callback function is executed only once, regardless of how many times it's called.
+*  This is useful for one-time operations that should not be repeated, even if the component re-renders.
+*
+* @param {() => void} callback - The callback function to be executed once.
+* @param {DependencyList} deps - Dependencies array that will trigger a new one-time execution when changed.
+*
+* @returns {(...args: any[]) => void} A memoized function that will only execute once until dependencies change.
+*
+* @example
+* import { useCallbackOncePerRender } from 'react-simplikit';
+*
+* function Component() {
+*   const handleOneTimeEvent = useCallbackOncePerRender(() => {
+*     console.log('This will only run once');
+*   }, []);
+*
+*   return <button onClick={handleOneTimeEvent}>Click me</button>;
+* }
+*
+* @example
+* // With dependencies
+* function TrackingComponent({ userId }: { userId: string }) {
+*   const trackUserVisit = useCallbackOncePerRender(() => {
+*     analytics.trackVisit(userId);
+*   }, [userId]);
+*
+*   useEffect(() => {
+*     trackUserVisit();
+*   }, [trackUserVisit]);
+*
+*   return <div>User page</div>;
+* }
+*/
+function useCallbackOncePerRender(callback, deps) {
+	const hasFired = useRef(false);
+	useEffect(() => {
+		hasFired.current = false;
+	}, deps);
+	return usePreservedCallback((...args) => {
+		if (hasFired.current) return;
+		callback(...args);
+		hasFired.current = true;
+	});
+}
+//#endregion
+export { useCallbackOncePerRender };

package/dist/hooks/useConditionalEffect/index.d.cts

@@ -1,43 +1,3 @@
-import { DependencyList, EffectCallback } from 'react';
 
-/**
- * @description
- * `useConditionalEffect` is a React hook that conditionally executes effects based on a predicate function.
- * This provides more control over when effects run beyond just dependency changes.
- *
- * @param {EffectCallback} effect - The effect callback to run.
- * @param {DependencyList} deps - Dependencies array, similar to useEffect.
- * @param {(prevDeps: T | undefined, currentDeps: T) => boolean} condition - Function that determines if the effect should run based on previous and current deps.
- * - On the initial render, `prevDeps` will be `undefined`. Your `condition` function should handle this case.
- * - If you want your effect to run on the initial render, return `true` when `prevDeps` is `undefined`.
- * - If you don't want your effect to run on the initial render, return `false` when `prevDeps` is `undefined`.
- *
- * @example
- * import { useConditionalEffect } from 'react-simplikit';
- *
- * function Component() {
- *   const [count, setCount] = useState(0);
- *
- *   // Only run effect when count increases
- *   useConditionalEffect(
- *     () => {
- *       console.log(`Count increased to ${count}`);
- *     },
- *     [count],
- *     (prevDeps, currentDeps) => {
- *       // Only run when count is defined and has increased
- *       return prevDeps && currentDeps[0] > prevDeps[0];
- *     }
- *   );
- *
- *   return (
- *     <button onClick={() => setCount(prev => prev + 1)}>
- *       Increment: {count}
- *     </button>
- *   );
- * }
- *
- */
-declare function useConditionalEffect<T extends DependencyList>(effect: EffectCallback, deps: T, condition: (prevDeps: T | undefined, currentDeps: T) => boolean): void;
-
-export { useConditionalEffect };
+import { useConditionalEffect } from "./useConditionalEffect.cjs";
+export { useConditionalEffect };

package/dist/hooks/useConditionalEffect/index.d.mts

@@ -0,0 +1,3 @@
+
+import { useConditionalEffect } from "./useConditionalEffect.mjs";
+export { useConditionalEffect };

package/dist/hooks/useConditionalEffect/useConditionalEffect.cjs

@@ -0,0 +1,57 @@
+"use client";
+let react = require("react");
+//#region src/hooks/useConditionalEffect/useConditionalEffect.ts
+/**
+* @description
+* `useConditionalEffect` is a React hook that conditionally executes effects based on a predicate function.
+* This provides more control over when effects run beyond just dependency changes.
+*
+* @param {EffectCallback} effect - The effect callback to run.
+* @param {DependencyList} deps - Dependencies array, similar to useEffect.
+* @param {(prevDeps: T | undefined, currentDeps: T) => boolean} condition - Function that determines if the effect should run based on previous and current deps.
+* - On the initial render, `prevDeps` will be `undefined`. Your `condition` function should handle this case.
+* - If you want your effect to run on the initial render, return `true` when `prevDeps` is `undefined`.
+* - If you don't want your effect to run on the initial render, return `false` when `prevDeps` is `undefined`.
+*
+* @example
+* import { useConditionalEffect } from 'react-simplikit';
+*
+* function Component() {
+*   const [count, setCount] = useState(0);
+*
+*   // Only run effect when count increases
+*   useConditionalEffect(
+*     () => {
+*       console.log(`Count increased to ${count}`);
+*     },
+*     [count],
+*     (prevDeps, currentDeps) => {
+*       // Only run when count is defined and has increased
+*       return prevDeps && currentDeps[0] > prevDeps[0];
+*     }
+*   );
+*
+*   return (
+*     <button onClick={() => setCount(prev => prev + 1)}>
+*       Increment: {count}
+*     </button>
+*   );
+* }
+*
+*/
+function useConditionalEffect(effect, deps, condition) {
+	const prevDepsRef = (0, react.useRef)(void 0);
+	const memoizedCondition = (0, react.useCallback)(condition, deps);
+	if (deps.length === 0) console.warn("useConditionalEffect received an empty dependency array. This may indicate missing dependencies and could lead to unexpected behavior.");
+	const shouldRun = memoizedCondition(prevDepsRef.current, deps);
+	(0, react.useEffect)(() => {
+		if (shouldRun) {
+			const cleanup = effect();
+			prevDepsRef.current = deps;
+			return cleanup;
+		}
+		prevDepsRef.current = deps;
+	}, deps);
+}
+//#endregion
+exports.useConditionalEffect = useConditionalEffect;

package/{esm/hooks/useConditionalEffect/index.d.ts → dist/hooks/useConditionalEffect/useConditionalEffect.d.cts}

@@ -1,5 +1,6 @@
-import { DependencyList, EffectCallback } from 'react';
 
+import { DependencyList, EffectCallback } from "react";
+//#region src/hooks/useConditionalEffect/useConditionalEffect.d.ts
 /**
  * @description
  * `useConditionalEffect` is a React hook that conditionally executes effects based on a predicate function.
@@ -39,5 +40,5 @@ import { DependencyList, EffectCallback } from 'react';
  *
  */
 declare function useConditionalEffect<T extends DependencyList>(effect: EffectCallback, deps: T, condition: (prevDeps: T | undefined, currentDeps: T) => boolean): void;
-
-export { useConditionalEffect };
+//#endregion
+export { useConditionalEffect };

package/dist/hooks/useConditionalEffect/useConditionalEffect.d.mts

@@ -0,0 +1,44 @@
+
+import { DependencyList, EffectCallback } from "react";
+//#region src/hooks/useConditionalEffect/useConditionalEffect.d.ts
+/**
+ * @description
+ * `useConditionalEffect` is a React hook that conditionally executes effects based on a predicate function.
+ * This provides more control over when effects run beyond just dependency changes.
+ *
+ * @param {EffectCallback} effect - The effect callback to run.
+ * @param {DependencyList} deps - Dependencies array, similar to useEffect.
+ * @param {(prevDeps: T | undefined, currentDeps: T) => boolean} condition - Function that determines if the effect should run based on previous and current deps.
+ * - On the initial render, `prevDeps` will be `undefined`. Your `condition` function should handle this case.
+ * - If you want your effect to run on the initial render, return `true` when `prevDeps` is `undefined`.
+ * - If you don't want your effect to run on the initial render, return `false` when `prevDeps` is `undefined`.
+ *
+ * @example
+ * import { useConditionalEffect } from 'react-simplikit';
+ *
+ * function Component() {
+ *   const [count, setCount] = useState(0);
+ *
+ *   // Only run effect when count increases
+ *   useConditionalEffect(
+ *     () => {
+ *       console.log(`Count increased to ${count}`);
+ *     },
+ *     [count],
+ *     (prevDeps, currentDeps) => {
+ *       // Only run when count is defined and has increased
+ *       return prevDeps && currentDeps[0] > prevDeps[0];
+ *     }
+ *   );
+ *
+ *   return (
+ *     <button onClick={() => setCount(prev => prev + 1)}>
+ *       Increment: {count}
+ *     </button>
+ *   );
+ * }
+ *
+ */
+declare function useConditionalEffect<T extends DependencyList>(effect: EffectCallback, deps: T, condition: (prevDeps: T | undefined, currentDeps: T) => boolean): void;
+//#endregion
+export { useConditionalEffect };