@usefy/use-throttle 0.0.2 → 0.0.3

package/dist/index.d.mts

@@ -16,6 +16,7 @@ interface UseThrottleOptions {
 /**
  * Throttles a value by limiting updates to at most once per specified interval.
  * This is implemented using useDebounce with maxWait set to the interval.
+ * Useful for scroll events and resize handlers.
  *
  * @template T - The type of the value to throttle
  * @param value - The value to throttle

package/dist/index.d.ts

@@ -16,6 +16,7 @@ interface UseThrottleOptions {
 /**
  * Throttles a value by limiting updates to at most once per specified interval.
  * This is implemented using useDebounce with maxWait set to the interval.
+ * Useful for scroll events and resize handlers.
  *
  * @template T - The type of the value to throttle
  * @param value - The value to throttle

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts","../src/useThrottle.ts"],"sourcesContent":["export { useThrottle, type UseThrottleOptions } from \"./useThrottle\";\r\n","import { useDebounce, type UseDebounceOptions } from \"@usefy/use-debounce\";\r\n\r\n/**\r\n * Options for useThrottle hook\r\n */\r\nexport interface UseThrottleOptions {\r\n  /**\r\n   * Whether to update the throttled value on the leading edge\r\n   * @default true\r\n   */\r\n  leading?: boolean;\r\n  /**\r\n   * Whether to update the throttled value on the trailing edge\r\n   * @default true\r\n   */\r\n  trailing?: boolean;\r\n}\r\n\r\n/**\r\n * Throttles a value by limiting updates to at most once per specified interval.\r\n * This is implemented using useDebounce with maxWait set to the interval.\r\n *\r\n * @template T - The type of the value to throttle\r\n * @param value - The value to throttle\r\n * @param delay - The interval in milliseconds (default: 500ms)\r\n * @param options - Additional options for controlling throttle behavior\r\n * @returns The throttled value\r\n *\r\n * @example\r\n * ```tsx\r\n * function ScrollComponent() {\r\n *   const [scrollY, setScrollY] = useState(0);\r\n *   const throttledScrollY = useThrottle(scrollY, 100);\r\n *\r\n *   useEffect(() => {\r\n *     const handleScroll = () => setScrollY(window.scrollY);\r\n *     window.addEventListener(\"scroll\", handleScroll);\r\n *     return () => window.removeEventListener(\"scroll\", handleScroll);\r\n *   }, []);\r\n *\r\n *   return <div>Scroll Y: {throttledScrollY}</div>;\r\n * }\r\n * ```\r\n *\r\n * @example\r\n * ```tsx\r\n * // With leading edge only\r\n * const throttledValue = useThrottle(value, 300, { leading: true, trailing: false });\r\n * ```\r\n *\r\n * @example\r\n * ```tsx\r\n * // With trailing edge only\r\n * const throttledValue = useThrottle(value, 300, { leading: false, trailing: true });\r\n * ```\r\n */\r\nexport function useThrottle<T>(\r\n  value: T,\r\n  delay: number = 500,\r\n  options: UseThrottleOptions = {}\r\n): T {\r\n  const { leading = true, trailing = true } = options;\r\n\r\n  // Throttle is implemented using debounce with maxWait set to delay\r\n  return useDebounce(value, delay, {\r\n    leading,\r\n    maxWait: delay,\r\n    trailing,\r\n  });\r\n}\r\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,0BAAqD;AAwD9C,SAAS,YACd,OACA,QAAgB,KAChB,UAA8B,CAAC,GAC5B;AACH,QAAM,EAAE,UAAU,MAAM,WAAW,KAAK,IAAI;AAG5C,aAAO,iCAAY,OAAO,OAAO;AAAA,IAC/B;AAAA,IACA,SAAS;AAAA,IACT;AAAA,EACF,CAAC;AACH;","names":[]}
+{"version":3,"sources":["../src/index.ts","../src/useThrottle.ts"],"sourcesContent":["export { useThrottle, type UseThrottleOptions } from \"./useThrottle\";\r\n","import { useDebounce, type UseDebounceOptions } from \"@usefy/use-debounce\";\r\n\r\n/**\r\n * Options for useThrottle hook\r\n */\r\nexport interface UseThrottleOptions {\r\n  /**\r\n   * Whether to update the throttled value on the leading edge\r\n   * @default true\r\n   */\r\n  leading?: boolean;\r\n  /**\r\n   * Whether to update the throttled value on the trailing edge\r\n   * @default true\r\n   */\r\n  trailing?: boolean;\r\n}\r\n\r\n/**\r\n * Throttles a value by limiting updates to at most once per specified interval.\r\n * This is implemented using useDebounce with maxWait set to the interval.\r\n * Useful for scroll events and resize handlers.\r\n *\r\n * @template T - The type of the value to throttle\r\n * @param value - The value to throttle\r\n * @param delay - The interval in milliseconds (default: 500ms)\r\n * @param options - Additional options for controlling throttle behavior\r\n * @returns The throttled value\r\n *\r\n * @example\r\n * ```tsx\r\n * function ScrollComponent() {\r\n *   const [scrollY, setScrollY] = useState(0);\r\n *   const throttledScrollY = useThrottle(scrollY, 100);\r\n *\r\n *   useEffect(() => {\r\n *     const handleScroll = () => setScrollY(window.scrollY);\r\n *     window.addEventListener(\"scroll\", handleScroll);\r\n *     return () => window.removeEventListener(\"scroll\", handleScroll);\r\n *   }, []);\r\n *\r\n *   return <div>Scroll Y: {throttledScrollY}</div>;\r\n * }\r\n * ```\r\n *\r\n * @example\r\n * ```tsx\r\n * // With leading edge only\r\n * const throttledValue = useThrottle(value, 300, { leading: true, trailing: false });\r\n * ```\r\n *\r\n * @example\r\n * ```tsx\r\n * // With trailing edge only\r\n * const throttledValue = useThrottle(value, 300, { leading: false, trailing: true });\r\n * ```\r\n */\r\nexport function useThrottle<T>(\r\n  value: T,\r\n  delay: number = 500,\r\n  options: UseThrottleOptions = {}\r\n): T {\r\n  const { leading = true, trailing = true } = options;\r\n\r\n  // Throttle is implemented using debounce with maxWait set to delay\r\n  return useDebounce(value, delay, {\r\n    leading,\r\n    maxWait: delay,\r\n    trailing,\r\n  });\r\n}\r\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,0BAAqD;AAyD9C,SAAS,YACd,OACA,QAAgB,KAChB,UAA8B,CAAC,GAC5B;AACH,QAAM,EAAE,UAAU,MAAM,WAAW,KAAK,IAAI;AAG5C,aAAO,iCAAY,OAAO,OAAO;AAAA,IAC/B;AAAA,IACA,SAAS;AAAA,IACT;AAAA,EACF,CAAC;AACH;","names":[]}

package/dist/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/useThrottle.ts"],"sourcesContent":["import { useDebounce, type UseDebounceOptions } from \"@usefy/use-debounce\";\r\n\r\n/**\r\n * Options for useThrottle hook\r\n */\r\nexport interface UseThrottleOptions {\r\n  /**\r\n   * Whether to update the throttled value on the leading edge\r\n   * @default true\r\n   */\r\n  leading?: boolean;\r\n  /**\r\n   * Whether to update the throttled value on the trailing edge\r\n   * @default true\r\n   */\r\n  trailing?: boolean;\r\n}\r\n\r\n/**\r\n * Throttles a value by limiting updates to at most once per specified interval.\r\n * This is implemented using useDebounce with maxWait set to the interval.\r\n *\r\n * @template T - The type of the value to throttle\r\n * @param value - The value to throttle\r\n * @param delay - The interval in milliseconds (default: 500ms)\r\n * @param options - Additional options for controlling throttle behavior\r\n * @returns The throttled value\r\n *\r\n * @example\r\n * ```tsx\r\n * function ScrollComponent() {\r\n *   const [scrollY, setScrollY] = useState(0);\r\n *   const throttledScrollY = useThrottle(scrollY, 100);\r\n *\r\n *   useEffect(() => {\r\n *     const handleScroll = () => setScrollY(window.scrollY);\r\n *     window.addEventListener(\"scroll\", handleScroll);\r\n *     return () => window.removeEventListener(\"scroll\", handleScroll);\r\n *   }, []);\r\n *\r\n *   return <div>Scroll Y: {throttledScrollY}</div>;\r\n * }\r\n * ```\r\n *\r\n * @example\r\n * ```tsx\r\n * // With leading edge only\r\n * const throttledValue = useThrottle(value, 300, { leading: true, trailing: false });\r\n * ```\r\n *\r\n * @example\r\n * ```tsx\r\n * // With trailing edge only\r\n * const throttledValue = useThrottle(value, 300, { leading: false, trailing: true });\r\n * ```\r\n */\r\nexport function useThrottle<T>(\r\n  value: T,\r\n  delay: number = 500,\r\n  options: UseThrottleOptions = {}\r\n): T {\r\n  const { leading = true, trailing = true } = options;\r\n\r\n  // Throttle is implemented using debounce with maxWait set to delay\r\n  return useDebounce(value, delay, {\r\n    leading,\r\n    maxWait: delay,\r\n    trailing,\r\n  });\r\n}\r\n"],"mappings":";AAAA,SAAS,mBAA4C;AAwD9C,SAAS,YACd,OACA,QAAgB,KAChB,UAA8B,CAAC,GAC5B;AACH,QAAM,EAAE,UAAU,MAAM,WAAW,KAAK,IAAI;AAG5C,SAAO,YAAY,OAAO,OAAO;AAAA,IAC/B;AAAA,IACA,SAAS;AAAA,IACT;AAAA,EACF,CAAC;AACH;","names":[]}
+{"version":3,"sources":["../src/useThrottle.ts"],"sourcesContent":["import { useDebounce, type UseDebounceOptions } from \"@usefy/use-debounce\";\r\n\r\n/**\r\n * Options for useThrottle hook\r\n */\r\nexport interface UseThrottleOptions {\r\n  /**\r\n   * Whether to update the throttled value on the leading edge\r\n   * @default true\r\n   */\r\n  leading?: boolean;\r\n  /**\r\n   * Whether to update the throttled value on the trailing edge\r\n   * @default true\r\n   */\r\n  trailing?: boolean;\r\n}\r\n\r\n/**\r\n * Throttles a value by limiting updates to at most once per specified interval.\r\n * This is implemented using useDebounce with maxWait set to the interval.\r\n * Useful for scroll events and resize handlers.\r\n *\r\n * @template T - The type of the value to throttle\r\n * @param value - The value to throttle\r\n * @param delay - The interval in milliseconds (default: 500ms)\r\n * @param options - Additional options for controlling throttle behavior\r\n * @returns The throttled value\r\n *\r\n * @example\r\n * ```tsx\r\n * function ScrollComponent() {\r\n *   const [scrollY, setScrollY] = useState(0);\r\n *   const throttledScrollY = useThrottle(scrollY, 100);\r\n *\r\n *   useEffect(() => {\r\n *     const handleScroll = () => setScrollY(window.scrollY);\r\n *     window.addEventListener(\"scroll\", handleScroll);\r\n *     return () => window.removeEventListener(\"scroll\", handleScroll);\r\n *   }, []);\r\n *\r\n *   return <div>Scroll Y: {throttledScrollY}</div>;\r\n * }\r\n * ```\r\n *\r\n * @example\r\n * ```tsx\r\n * // With leading edge only\r\n * const throttledValue = useThrottle(value, 300, { leading: true, trailing: false });\r\n * ```\r\n *\r\n * @example\r\n * ```tsx\r\n * // With trailing edge only\r\n * const throttledValue = useThrottle(value, 300, { leading: false, trailing: true });\r\n * ```\r\n */\r\nexport function useThrottle<T>(\r\n  value: T,\r\n  delay: number = 500,\r\n  options: UseThrottleOptions = {}\r\n): T {\r\n  const { leading = true, trailing = true } = options;\r\n\r\n  // Throttle is implemented using debounce with maxWait set to delay\r\n  return useDebounce(value, delay, {\r\n    leading,\r\n    maxWait: delay,\r\n    trailing,\r\n  });\r\n}\r\n"],"mappings":";AAAA,SAAS,mBAA4C;AAyD9C,SAAS,YACd,OACA,QAAgB,KAChB,UAA8B,CAAC,GAC5B;AACH,QAAM,EAAE,UAAU,MAAM,WAAW,KAAK,IAAI;AAG5C,SAAO,YAAY,OAAO,OAAO;AAAA,IAC/B;AAAA,IACA,SAAS;AAAA,IACT;AAAA,EACF,CAAC;AACH;","names":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@usefy/use-throttle",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "description": "A React hook for throttling values",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
@@ -17,7 +17,7 @@
   ],
   "sideEffects": false,
   "dependencies": {
-    "@usefy/use-debounce": "0.0.2"
+    "@usefy/use-debounce": "0.0.3"
   },
   "peerDependencies": {
     "react": "^18.0.0 || ^19.0.0"