@mantine/hooks 9.0.2 → 9.1.1

package/esm/use-scroller/use-scroller.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-scroller.mjs","names":[],"sources":["../../src/use-scroller/use-scroller.ts"],"sourcesContent":["import { RefCallback, useCallback, useEffect, useRef, useState } from 'react';\n\nexport interface UseScrollerOptions {\n  /** Amount of pixels to scroll when calling scroll functions, `200` by default */\n  scrollAmount?: number;\n\n  /** Determines whether content can be scrolled by dragging with mouse, `true` by default */\n  draggable?: boolean;\n\n  /** Called when scroll state changes (canScrollStart or canScrollEnd) */\n  onScrollStateChange?: (state: UseScrollerScrollState) => void;\n}\n\nexport interface UseScrollerScrollState {\n  /** Whether content can be scrolled towards the start (left in LTR, right in RTL) */\n  canScrollStart: boolean;\n\n  /** Whether content can be scrolled towards the end (right in LTR, left in RTL) */\n  canScrollEnd: boolean;\n}\n\nexport interface UseScrollerReturnValue<T extends HTMLElement = HTMLDivElement> {\n  /** Ref callback to attach to the scrollable container element */\n  ref: RefCallback<T | null>;\n\n  /** Whether content can be scrolled towards the start */\n  canScrollStart: boolean;\n\n  /** Whether content can be scrolled towards the end */\n  canScrollEnd: boolean;\n\n  /** Scrolls towards the start direction */\n  scrollStart: () => void;\n\n  /** Scrolls towards the end direction */\n  scrollEnd: () => void;\n\n  /** `true` if the user is currently dragging the content */\n  isDragging: boolean;\n\n  /** Props to spread on the scrollable container for drag functionality */\n  dragHandlers: {\n    onMouseDown: (e: React.MouseEvent) => void;\n    onMouseMove: (e: React.MouseEvent) => void;\n    onMouseUp: () => void;\n    onMouseLeave: () => void;\n  };\n}\n\nexport function useScroller<T extends HTMLElement = HTMLDivElement>(\n  options: UseScrollerOptions = {}\n): UseScrollerReturnValue<T> {\n  const { scrollAmount = 200, draggable = true, onScrollStateChange } = options;\n\n  const containerRef = useRef<T | null>(null);\n\n  const [canScrollStart, setCanScrollStart] = useState(false);\n  const [canScrollEnd, setCanScrollEnd] = useState(false);\n  const [isDragging, setIsDragging] = useState(false);\n\n  const isDraggingRef = useRef(false);\n  const hasDraggedRef = useRef(false);\n  const startX = useRef(0);\n  const scrollLeftStart = useRef(0);\n\n  const onScrollStateChangeRef = useRef(onScrollStateChange);\n  onScrollStateChangeRef.current = onScrollStateChange;\n\n  const updateScrollState = useCallback(() => {\n    const container = containerRef.current;\n    if (container) {\n      const { scrollLeft, scrollWidth, clientWidth } = container;\n      const isRtl = getComputedStyle(container).direction === 'rtl';\n\n      let newCanScrollStart: boolean;\n      let newCanScrollEnd: boolean;\n\n      if (isRtl) {\n        newCanScrollStart = scrollLeft < 0;\n        newCanScrollEnd = scrollLeft > -(scrollWidth - clientWidth);\n      } else {\n        newCanScrollStart = scrollLeft > 0;\n        newCanScrollEnd = scrollLeft < scrollWidth - clientWidth - 1;\n      }\n\n      setCanScrollStart(newCanScrollStart);\n      setCanScrollEnd(newCanScrollEnd);\n\n      onScrollStateChangeRef.current?.({\n        canScrollStart: newCanScrollStart,\n        canScrollEnd: newCanScrollEnd,\n      });\n    }\n  }, []);\n\n  useEffect(() => {\n    updateScrollState();\n    const container = containerRef.current;\n    if (container) {\n      container.addEventListener('scroll', updateScrollState);\n      const resizeObserver = new ResizeObserver(updateScrollState);\n      resizeObserver.observe(container);\n      return () => {\n        container.removeEventListener('scroll', updateScrollState);\n        resizeObserver.disconnect();\n      };\n    }\n    return undefined;\n  }, [updateScrollState]);\n\n  const scroll = useCallback(\n    (direction: 'start' | 'end') => {\n      const container = containerRef.current;\n      if (container) {\n        const isRtl = getComputedStyle(container).direction === 'rtl';\n        const amount = scrollAmount;\n        const scrollBy = direction === 'end' ? amount : -amount;\n        const adjustedScrollBy = isRtl ? -scrollBy : scrollBy;\n\n        container.scrollBy({\n          left: adjustedScrollBy,\n          behavior: 'smooth',\n        });\n      }\n    },\n    [scrollAmount]\n  );\n\n  const scrollStart = useCallback(() => scroll('start'), [scroll]);\n  const scrollEnd = useCallback(() => scroll('end'), [scroll]);\n\n  const handleMouseDown = useCallback(\n    (event: React.MouseEvent) => {\n      if (!draggable) {\n        return;\n      }\n      const container = containerRef.current;\n      if (container) {\n        isDraggingRef.current = true;\n        hasDraggedRef.current = false;\n        setIsDragging(true);\n        startX.current = event.pageX - container.offsetLeft;\n        scrollLeftStart.current = container.scrollLeft;\n        container.style.cursor = 'grabbing';\n        container.style.userSelect = 'none';\n      }\n    },\n    [draggable]\n  );\n\n  const handleMouseMove = useCallback((event: React.MouseEvent) => {\n    if (!isDraggingRef.current) {\n      return;\n    }\n    event.preventDefault();\n    const container = containerRef.current;\n    if (container) {\n      const x = event.pageX - container.offsetLeft;\n      const walk = x - startX.current;\n      if (Math.abs(walk) > 5) {\n        hasDraggedRef.current = true;\n      }\n      container.scrollLeft = scrollLeftStart.current - walk;\n    }\n  }, []);\n\n  const handleMouseUp = useCallback(() => {\n    const wasDragged = hasDraggedRef.current;\n    isDraggingRef.current = false;\n    hasDraggedRef.current = false;\n    setIsDragging(false);\n    const container = containerRef.current;\n    if (container) {\n      container.style.cursor = '';\n      container.style.userSelect = '';\n\n      if (wasDragged) {\n        const suppressClick = (event: MouseEvent) => {\n          event.stopPropagation();\n          event.preventDefault();\n          container.removeEventListener('click', suppressClick, true);\n        };\n        container.addEventListener('click', suppressClick, true);\n      }\n    }\n  }, []);\n\n  const handleMouseLeave = useCallback(() => {\n    if (isDraggingRef.current) {\n      handleMouseUp();\n    }\n  }, [handleMouseUp]);\n\n  const assignRef: RefCallback<T | null> = useCallback(\n    (node) => {\n      containerRef.current = node;\n      if (node) {\n        updateScrollState();\n      }\n    },\n    [updateScrollState]\n  );\n\n  return {\n    ref: assignRef,\n    canScrollStart,\n    canScrollEnd,\n    scrollStart,\n    scrollEnd,\n    isDragging,\n    dragHandlers: {\n      onMouseDown: handleMouseDown,\n      onMouseMove: handleMouseMove,\n      onMouseUp: handleMouseUp,\n      onMouseLeave: handleMouseLeave,\n    },\n  };\n}\n\nexport namespace useScroller {\n  export type Options = UseScrollerOptions;\n  export type ReturnValue<T extends HTMLElement = HTMLDivElement> = UseScrollerReturnValue<T>;\n  export type ScrollState = UseScrollerScrollState;\n}\n"],"mappings":"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"}
+{"version":3,"file":"use-scroller.mjs","names":[],"sources":["../../src/use-scroller/use-scroller.ts"],"sourcesContent":["import { RefCallback, useCallback, useEffect, useRef, useState } from 'react';\n\nexport interface UseScrollerOptions {\n  /** Amount of pixels to scroll when calling scroll functions, `200` by default */\n  scrollAmount?: number;\n\n  /** Determines whether content can be scrolled by dragging with mouse, `true` by default */\n  draggable?: boolean;\n\n  /** Called when scroll state changes (canScrollStart or canScrollEnd) */\n  onScrollStateChange?: (state: UseScrollerScrollState) => void;\n}\n\nexport interface UseScrollerScrollState {\n  /** Whether content can be scrolled towards the start (left in LTR, right in RTL) */\n  canScrollStart: boolean;\n\n  /** Whether content can be scrolled towards the end (right in LTR, left in RTL) */\n  canScrollEnd: boolean;\n}\n\nexport interface UseScrollerReturnValue<T extends HTMLElement = HTMLDivElement> {\n  /** Ref callback to attach to the scrollable container element */\n  ref: RefCallback<T | null>;\n\n  /** Whether content can be scrolled towards the start */\n  canScrollStart: boolean;\n\n  /** Whether content can be scrolled towards the end */\n  canScrollEnd: boolean;\n\n  /** Scrolls towards the start direction */\n  scrollStart: () => void;\n\n  /** Scrolls towards the end direction */\n  scrollEnd: () => void;\n\n  /** `true` if the user is currently dragging the content */\n  isDragging: boolean;\n\n  /** Props to spread on the scrollable container for drag functionality */\n  dragHandlers: {\n    onMouseDown: (e: React.MouseEvent) => void;\n    onMouseMove: (e: React.MouseEvent) => void;\n    onMouseUp: () => void;\n    onMouseLeave: () => void;\n  };\n}\n\nexport function useScroller<T extends HTMLElement = HTMLDivElement>(\n  options: UseScrollerOptions = {}\n): UseScrollerReturnValue<T> {\n  const { scrollAmount = 200, draggable = true, onScrollStateChange } = options;\n\n  const containerRef = useRef<T | null>(null);\n\n  const [canScrollStart, setCanScrollStart] = useState(false);\n  const [canScrollEnd, setCanScrollEnd] = useState(false);\n  const [isDragging, setIsDragging] = useState(false);\n\n  const isDraggingRef = useRef(false);\n  const hasDraggedRef = useRef(false);\n  const startX = useRef(0);\n  const scrollLeftStart = useRef(0);\n\n  const onScrollStateChangeRef = useRef(onScrollStateChange);\n  onScrollStateChangeRef.current = onScrollStateChange;\n\n  const updateScrollState = useCallback(() => {\n    const container = containerRef.current;\n    if (container) {\n      const { scrollLeft, scrollWidth, clientWidth } = container;\n      const isRtl = getComputedStyle(container).direction === 'rtl';\n\n      let newCanScrollStart: boolean;\n      let newCanScrollEnd: boolean;\n\n      if (isRtl) {\n        newCanScrollStart = scrollLeft < -1;\n        newCanScrollEnd = scrollLeft > -(scrollWidth - clientWidth) + 1;\n      } else {\n        newCanScrollStart = scrollLeft > 1;\n        newCanScrollEnd = scrollLeft < scrollWidth - clientWidth - 1;\n      }\n\n      setCanScrollStart(newCanScrollStart);\n      setCanScrollEnd(newCanScrollEnd);\n\n      onScrollStateChangeRef.current?.({\n        canScrollStart: newCanScrollStart,\n        canScrollEnd: newCanScrollEnd,\n      });\n    }\n  }, []);\n\n  useEffect(() => {\n    updateScrollState();\n    const container = containerRef.current;\n    if (container) {\n      container.addEventListener('scroll', updateScrollState);\n      const resizeObserver = new ResizeObserver(updateScrollState);\n      resizeObserver.observe(container);\n      return () => {\n        container.removeEventListener('scroll', updateScrollState);\n        resizeObserver.disconnect();\n      };\n    }\n    return undefined;\n  }, [updateScrollState]);\n\n  const scroll = useCallback(\n    (direction: 'start' | 'end') => {\n      const container = containerRef.current;\n      if (container) {\n        const isRtl = getComputedStyle(container).direction === 'rtl';\n        const amount = scrollAmount;\n        const scrollBy = direction === 'end' ? amount : -amount;\n        const adjustedScrollBy = isRtl ? -scrollBy : scrollBy;\n\n        container.scrollBy({\n          left: adjustedScrollBy,\n          behavior: 'smooth',\n        });\n      }\n    },\n    [scrollAmount]\n  );\n\n  const scrollStart = useCallback(() => scroll('start'), [scroll]);\n  const scrollEnd = useCallback(() => scroll('end'), [scroll]);\n\n  const handleMouseDown = useCallback(\n    (event: React.MouseEvent) => {\n      if (!draggable) {\n        return;\n      }\n      const container = containerRef.current;\n      if (container) {\n        isDraggingRef.current = true;\n        hasDraggedRef.current = false;\n        setIsDragging(true);\n        startX.current = event.pageX - container.offsetLeft;\n        scrollLeftStart.current = container.scrollLeft;\n        container.style.cursor = 'grabbing';\n        container.style.userSelect = 'none';\n      }\n    },\n    [draggable]\n  );\n\n  const handleMouseMove = useCallback((event: React.MouseEvent) => {\n    if (!isDraggingRef.current) {\n      return;\n    }\n    event.preventDefault();\n    const container = containerRef.current;\n    if (container) {\n      const x = event.pageX - container.offsetLeft;\n      const walk = x - startX.current;\n      if (Math.abs(walk) > 5) {\n        hasDraggedRef.current = true;\n      }\n      container.scrollLeft = scrollLeftStart.current - walk;\n    }\n  }, []);\n\n  const handleMouseUp = useCallback(() => {\n    const wasDragged = hasDraggedRef.current;\n    isDraggingRef.current = false;\n    hasDraggedRef.current = false;\n    setIsDragging(false);\n    const container = containerRef.current;\n    if (container) {\n      container.style.cursor = '';\n      container.style.userSelect = '';\n\n      if (wasDragged) {\n        const suppressClick = (event: MouseEvent) => {\n          event.stopPropagation();\n          event.preventDefault();\n          container.removeEventListener('click', suppressClick, true);\n        };\n        container.addEventListener('click', suppressClick, true);\n      }\n    }\n  }, []);\n\n  const handleMouseLeave = useCallback(() => {\n    if (isDraggingRef.current) {\n      handleMouseUp();\n    }\n  }, [handleMouseUp]);\n\n  const assignRef: RefCallback<T | null> = useCallback(\n    (node) => {\n      containerRef.current = node;\n      if (node) {\n        updateScrollState();\n      }\n    },\n    [updateScrollState]\n  );\n\n  return {\n    ref: assignRef,\n    canScrollStart,\n    canScrollEnd,\n    scrollStart,\n    scrollEnd,\n    isDragging,\n    dragHandlers: {\n      onMouseDown: handleMouseDown,\n      onMouseMove: handleMouseMove,\n      onMouseUp: handleMouseUp,\n      onMouseLeave: handleMouseLeave,\n    },\n  };\n}\n\nexport namespace useScroller {\n  export type Options = UseScrollerOptions;\n  export type ReturnValue<T extends HTMLElement = HTMLDivElement> = UseScrollerReturnValue<T>;\n  export type ScrollState = UseScrollerScrollState;\n}\n"],"mappings":"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"}

package/esm/use-set/use-set.mjs

@@ -5,7 +5,12 @@ import { useRef } from "react";
 function readonlySetLikeToSet(input) {
 	if (input instanceof Set) return input;
 	const result = /* @__PURE__ */ new Set();
-	for (const item of input) result.add(item);
+	const iterator = input.keys();
+	let next = iterator.next();
+	while (!next.done) {
+		result.add(next.value);
+		next = iterator.next();
+	}
 	return result;
 }
 function useSet(values) {

package/esm/use-set/use-set.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-set.mjs","names":[],"sources":["../../src/use-set/use-set.ts"],"sourcesContent":["import { useRef } from 'react';\nimport { useForceUpdate } from '../use-force-update/use-force-update';\n\nexport function readonlySetLikeToSet<T>(input: ReadonlySetLike<T>): Set<T> {\n  if (input instanceof Set) {\n    return input;\n  }\n  const result = new Set<T>();\n  for (const item of input as any) {\n    result.add(item);\n  }\n  return result;\n}\n\nexport function useSet<T>(values?: T[]): Set<T> {\n  const setRef = useRef(new Set(values));\n  const forceUpdate = useForceUpdate();\n\n  setRef.current.add = (...args) => {\n    const res = Set.prototype.add.apply(setRef.current, args);\n    forceUpdate();\n    return res;\n  };\n\n  setRef.current.clear = (...args) => {\n    Set.prototype.clear.apply(setRef.current, args);\n    forceUpdate();\n  };\n\n  setRef.current.delete = (...args) => {\n    const res = Set.prototype.delete.apply(setRef.current, args);\n    forceUpdate();\n    return res;\n  };\n\n  setRef.current.union = <U>(other: ReadonlySetLike<U>): Set<T | U> => {\n    const result = new Set<T | U>(setRef.current as Set<T>);\n    readonlySetLikeToSet(other).forEach((item) => result.add(item));\n    return result;\n  };\n\n  setRef.current.intersection = <U>(other: ReadonlySetLike<U>): Set<T & U> => {\n    const result = new Set<T & U>();\n    const otherSet = readonlySetLikeToSet(other);\n    setRef.current.forEach((item) => {\n      if (otherSet.has(item as any)) {\n        result.add(item as T & U);\n      }\n    });\n    return result;\n  };\n\n  setRef.current.difference = <U>(other: ReadonlySetLike<U>): Set<T> => {\n    const result = new Set<T>();\n    const otherSet = readonlySetLikeToSet(other);\n    setRef.current.forEach((item) => {\n      if (!otherSet.has(item as any)) {\n        result.add(item);\n      }\n    });\n    return result;\n  };\n\n  setRef.current.symmetricDifference = <U>(other: ReadonlySetLike<U>): Set<T | U> => {\n    const result = new Set<T | U>();\n    const otherSet = readonlySetLikeToSet(other);\n\n    setRef.current.forEach((item) => {\n      if (!otherSet.has(item as any)) {\n        result.add(item);\n      }\n    });\n\n    otherSet.forEach((item) => {\n      if (!setRef.current.has(item as any)) {\n        result.add(item);\n      }\n    });\n\n    return result;\n  };\n\n  return setRef.current;\n}\n"],"mappings":";;;;AAGA,SAAgB,qBAAwB,OAAmC;AACzE,KAAI,iBAAiB,IACnB,QAAO;CAET,MAAM,yBAAS,IAAI,KAAQ;AAC3B,MAAK,MAAM,QAAQ,MACjB,QAAO,IAAI,KAAK;AAElB,QAAO;;AAGT,SAAgB,OAAU,QAAsB;CAC9C,MAAM,SAAS,OAAO,IAAI,IAAI,OAAO,CAAC;CACtC,MAAM,cAAc,gBAAgB;AAEpC,QAAO,QAAQ,OAAO,GAAG,SAAS;EAChC,MAAM,MAAM,IAAI,UAAU,IAAI,MAAM,OAAO,SAAS,KAAK;AACzD,eAAa;AACb,SAAO;;AAGT,QAAO,QAAQ,SAAS,GAAG,SAAS;AAClC,MAAI,UAAU,MAAM,MAAM,OAAO,SAAS,KAAK;AAC/C,eAAa;;AAGf,QAAO,QAAQ,UAAU,GAAG,SAAS;EACnC,MAAM,MAAM,IAAI,UAAU,OAAO,MAAM,OAAO,SAAS,KAAK;AAC5D,eAAa;AACb,SAAO;;AAGT,QAAO,QAAQ,SAAY,UAA0C;EACnE,MAAM,SAAS,IAAI,IAAW,OAAO,QAAkB;AACvD,uBAAqB,MAAM,CAAC,SAAS,SAAS,OAAO,IAAI,KAAK,CAAC;AAC/D,SAAO;;AAGT,QAAO,QAAQ,gBAAmB,UAA0C;EAC1E,MAAM,yBAAS,IAAI,KAAY;EAC/B,MAAM,WAAW,qBAAqB,MAAM;AAC5C,SAAO,QAAQ,SAAS,SAAS;AAC/B,OAAI,SAAS,IAAI,KAAY,CAC3B,QAAO,IAAI,KAAc;IAE3B;AACF,SAAO;;AAGT,QAAO,QAAQ,cAAiB,UAAsC;EACpE,MAAM,yBAAS,IAAI,KAAQ;EAC3B,MAAM,WAAW,qBAAqB,MAAM;AAC5C,SAAO,QAAQ,SAAS,SAAS;AAC/B,OAAI,CAAC,SAAS,IAAI,KAAY,CAC5B,QAAO,IAAI,KAAK;IAElB;AACF,SAAO;;AAGT,QAAO,QAAQ,uBAA0B,UAA0C;EACjF,MAAM,yBAAS,IAAI,KAAY;EAC/B,MAAM,WAAW,qBAAqB,MAAM;AAE5C,SAAO,QAAQ,SAAS,SAAS;AAC/B,OAAI,CAAC,SAAS,IAAI,KAAY,CAC5B,QAAO,IAAI,KAAK;IAElB;AAEF,WAAS,SAAS,SAAS;AACzB,OAAI,CAAC,OAAO,QAAQ,IAAI,KAAY,CAClC,QAAO,IAAI,KAAK;IAElB;AAEF,SAAO;;AAGT,QAAO,OAAO"}
+{"version":3,"file":"use-set.mjs","names":[],"sources":["../../src/use-set/use-set.ts"],"sourcesContent":["import { useRef } from 'react';\nimport { useForceUpdate } from '../use-force-update/use-force-update';\n\nexport function readonlySetLikeToSet<T>(input: ReadonlySetLike<T>): Set<T> {\n  if (input instanceof Set) {\n    return input;\n  }\n  const result = new Set<T>();\n  const iterator = input.keys();\n  let next = iterator.next();\n  while (!next.done) {\n    result.add(next.value);\n    next = iterator.next();\n  }\n  return result;\n}\n\nexport function useSet<T>(values?: T[]): Set<T> {\n  const setRef = useRef(new Set(values));\n  const forceUpdate = useForceUpdate();\n\n  setRef.current.add = (...args) => {\n    const res = Set.prototype.add.apply(setRef.current, args);\n    forceUpdate();\n    return res;\n  };\n\n  setRef.current.clear = (...args) => {\n    Set.prototype.clear.apply(setRef.current, args);\n    forceUpdate();\n  };\n\n  setRef.current.delete = (...args) => {\n    const res = Set.prototype.delete.apply(setRef.current, args);\n    forceUpdate();\n    return res;\n  };\n\n  setRef.current.union = <U>(other: ReadonlySetLike<U>): Set<T | U> => {\n    const result = new Set<T | U>(setRef.current as Set<T>);\n    readonlySetLikeToSet(other).forEach((item) => result.add(item));\n    return result;\n  };\n\n  setRef.current.intersection = <U>(other: ReadonlySetLike<U>): Set<T & U> => {\n    const result = new Set<T & U>();\n    const otherSet = readonlySetLikeToSet(other);\n    setRef.current.forEach((item) => {\n      if (otherSet.has(item as any)) {\n        result.add(item as T & U);\n      }\n    });\n    return result;\n  };\n\n  setRef.current.difference = <U>(other: ReadonlySetLike<U>): Set<T> => {\n    const result = new Set<T>();\n    const otherSet = readonlySetLikeToSet(other);\n    setRef.current.forEach((item) => {\n      if (!otherSet.has(item as any)) {\n        result.add(item);\n      }\n    });\n    return result;\n  };\n\n  setRef.current.symmetricDifference = <U>(other: ReadonlySetLike<U>): Set<T | U> => {\n    const result = new Set<T | U>();\n    const otherSet = readonlySetLikeToSet(other);\n\n    setRef.current.forEach((item) => {\n      if (!otherSet.has(item as any)) {\n        result.add(item);\n      }\n    });\n\n    otherSet.forEach((item) => {\n      if (!setRef.current.has(item as any)) {\n        result.add(item);\n      }\n    });\n\n    return result;\n  };\n\n  return setRef.current;\n}\n"],"mappings":";;;;AAGA,SAAgB,qBAAwB,OAAmC;AACzE,KAAI,iBAAiB,IACnB,QAAO;CAET,MAAM,yBAAS,IAAI,KAAQ;CAC3B,MAAM,WAAW,MAAM,MAAM;CAC7B,IAAI,OAAO,SAAS,MAAM;AAC1B,QAAO,CAAC,KAAK,MAAM;AACjB,SAAO,IAAI,KAAK,MAAM;AACtB,SAAO,SAAS,MAAM;;AAExB,QAAO;;AAGT,SAAgB,OAAU,QAAsB;CAC9C,MAAM,SAAS,OAAO,IAAI,IAAI,OAAO,CAAC;CACtC,MAAM,cAAc,gBAAgB;AAEpC,QAAO,QAAQ,OAAO,GAAG,SAAS;EAChC,MAAM,MAAM,IAAI,UAAU,IAAI,MAAM,OAAO,SAAS,KAAK;AACzD,eAAa;AACb,SAAO;;AAGT,QAAO,QAAQ,SAAS,GAAG,SAAS;AAClC,MAAI,UAAU,MAAM,MAAM,OAAO,SAAS,KAAK;AAC/C,eAAa;;AAGf,QAAO,QAAQ,UAAU,GAAG,SAAS;EACnC,MAAM,MAAM,IAAI,UAAU,OAAO,MAAM,OAAO,SAAS,KAAK;AAC5D,eAAa;AACb,SAAO;;AAGT,QAAO,QAAQ,SAAY,UAA0C;EACnE,MAAM,SAAS,IAAI,IAAW,OAAO,QAAkB;AACvD,uBAAqB,MAAM,CAAC,SAAS,SAAS,OAAO,IAAI,KAAK,CAAC;AAC/D,SAAO;;AAGT,QAAO,QAAQ,gBAAmB,UAA0C;EAC1E,MAAM,yBAAS,IAAI,KAAY;EAC/B,MAAM,WAAW,qBAAqB,MAAM;AAC5C,SAAO,QAAQ,SAAS,SAAS;AAC/B,OAAI,SAAS,IAAI,KAAY,CAC3B,QAAO,IAAI,KAAc;IAE3B;AACF,SAAO;;AAGT,QAAO,QAAQ,cAAiB,UAAsC;EACpE,MAAM,yBAAS,IAAI,KAAQ;EAC3B,MAAM,WAAW,qBAAqB,MAAM;AAC5C,SAAO,QAAQ,SAAS,SAAS;AAC/B,OAAI,CAAC,SAAS,IAAI,KAAY,CAC5B,QAAO,IAAI,KAAK;IAElB;AACF,SAAO;;AAGT,QAAO,QAAQ,uBAA0B,UAA0C;EACjF,MAAM,yBAAS,IAAI,KAAY;EAC/B,MAAM,WAAW,qBAAqB,MAAM;AAE5C,SAAO,QAAQ,SAAS,SAAS;AAC/B,OAAI,CAAC,SAAS,IAAI,KAAY,CAC5B,QAAO,IAAI,KAAK;IAElB;AAEF,WAAS,SAAS,SAAS;AACzB,OAAI,CAAC,OAAO,QAAQ,IAAI,KAAY,CAClC,QAAO,IAAI,KAAK;IAElB;AAEF,SAAO;;AAGT,QAAO,OAAO"}

package/esm/use-throttled-callback/use-throttled-callback.mjs

@@ -34,7 +34,9 @@ function useThrottledCallbackWithClearTimeout(callback, wait) {
 	return [throttled, clearTimeout];
 }
 function useThrottledCallback(callback, wait) {
-	return useThrottledCallbackWithClearTimeout(callback, wait)[0];
+	const [throttled, clearTimeout] = useThrottledCallbackWithClearTimeout(callback, wait);
+	useEffect(() => clearTimeout, []);
+	return throttled;
 }
 //#endregion
 export { useThrottledCallback, useThrottledCallbackWithClearTimeout };

package/esm/use-throttled-callback/use-throttled-callback.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-throttled-callback.mjs","names":[],"sources":["../../src/use-throttled-callback/use-throttled-callback.ts"],"sourcesContent":["import { useCallback, useEffect, useRef } from 'react';\nimport { useCallbackRef } from '../utils';\n\nexport function useThrottledCallbackWithClearTimeout<T extends (...args: any[]) => any>(\n  callback: T,\n  wait: number\n) {\n  const handleCallback = useCallbackRef(callback);\n  const latestInArgsRef = useRef<Parameters<T>>(null);\n  const latestOutArgsRef = useRef<Parameters<T>>(null);\n  const active = useRef(true);\n  const waitRef = useRef(wait);\n  const timeoutRef = useRef<number>(-1);\n\n  const clearTimeout = () => window.clearTimeout(timeoutRef.current);\n\n  const callThrottledCallback = useCallback(\n    (...args: Parameters<T>) => {\n      handleCallback(...args);\n      latestInArgsRef.current = args;\n      latestOutArgsRef.current = args;\n      active.current = false;\n    },\n    [handleCallback]\n  );\n\n  const timerCallback = useCallback(() => {\n    if (latestInArgsRef.current && latestInArgsRef.current !== latestOutArgsRef.current) {\n      callThrottledCallback(...latestInArgsRef.current);\n\n      timeoutRef.current = window.setTimeout(timerCallback, waitRef.current);\n    } else {\n      active.current = true;\n    }\n  }, [callThrottledCallback]);\n\n  const throttled = useCallback(\n    (...args: Parameters<T>) => {\n      if (active.current) {\n        callThrottledCallback(...args);\n        timeoutRef.current = window.setTimeout(timerCallback, waitRef.current);\n      } else {\n        latestInArgsRef.current = args;\n      }\n    },\n    [callThrottledCallback, timerCallback]\n  );\n\n  useEffect(() => {\n    waitRef.current = wait;\n  }, [wait]);\n\n  return [throttled, clearTimeout] as const;\n}\n\nexport function useThrottledCallback<T extends (...args: any[]) => any>(callback: T, wait: number) {\n  return useThrottledCallbackWithClearTimeout(callback, wait)[0];\n}\n"],"mappings":";;;;AAGA,SAAgB,qCACd,UACA,MACA;CACA,MAAM,iBAAiB,eAAe,SAAS;CAC/C,MAAM,kBAAkB,OAAsB,KAAK;CACnD,MAAM,mBAAmB,OAAsB,KAAK;CACpD,MAAM,SAAS,OAAO,KAAK;CAC3B,MAAM,UAAU,OAAO,KAAK;CAC5B,MAAM,aAAa,OAAe,GAAG;CAErC,MAAM,qBAAqB,OAAO,aAAa,WAAW,QAAQ;CAElE,MAAM,wBAAwB,aAC3B,GAAG,SAAwB;AAC1B,iBAAe,GAAG,KAAK;AACvB,kBAAgB,UAAU;AAC1B,mBAAiB,UAAU;AAC3B,SAAO,UAAU;IAEnB,CAAC,eAAe,CACjB;CAED,MAAM,gBAAgB,kBAAkB;AACtC,MAAI,gBAAgB,WAAW,gBAAgB,YAAY,iBAAiB,SAAS;AACnF,yBAAsB,GAAG,gBAAgB,QAAQ;AAEjD,cAAW,UAAU,OAAO,WAAW,eAAe,QAAQ,QAAQ;QAEtE,QAAO,UAAU;IAElB,CAAC,sBAAsB,CAAC;CAE3B,MAAM,YAAY,aACf,GAAG,SAAwB;AAC1B,MAAI,OAAO,SAAS;AAClB,yBAAsB,GAAG,KAAK;AAC9B,cAAW,UAAU,OAAO,WAAW,eAAe,QAAQ,QAAQ;QAEtE,iBAAgB,UAAU;IAG9B,CAAC,uBAAuB,cAAc,CACvC;AAED,iBAAgB;AACd,UAAQ,UAAU;IACjB,CAAC,KAAK,CAAC;AAEV,QAAO,CAAC,WAAW,aAAa;;AAGlC,SAAgB,qBAAwD,UAAa,MAAc;AACjG,QAAO,qCAAqC,UAAU,KAAK,CAAC"}
+{"version":3,"file":"use-throttled-callback.mjs","names":[],"sources":["../../src/use-throttled-callback/use-throttled-callback.ts"],"sourcesContent":["import { useCallback, useEffect, useRef } from 'react';\nimport { useCallbackRef } from '../utils';\n\nexport function useThrottledCallbackWithClearTimeout<T extends (...args: any[]) => any>(\n  callback: T,\n  wait: number\n) {\n  const handleCallback = useCallbackRef(callback);\n  const latestInArgsRef = useRef<Parameters<T>>(null);\n  const latestOutArgsRef = useRef<Parameters<T>>(null);\n  const active = useRef(true);\n  const waitRef = useRef(wait);\n  const timeoutRef = useRef<number>(-1);\n\n  const clearTimeout = () => window.clearTimeout(timeoutRef.current);\n\n  const callThrottledCallback = useCallback(\n    (...args: Parameters<T>) => {\n      handleCallback(...args);\n      latestInArgsRef.current = args;\n      latestOutArgsRef.current = args;\n      active.current = false;\n    },\n    [handleCallback]\n  );\n\n  const timerCallback = useCallback(() => {\n    if (latestInArgsRef.current && latestInArgsRef.current !== latestOutArgsRef.current) {\n      callThrottledCallback(...latestInArgsRef.current);\n\n      timeoutRef.current = window.setTimeout(timerCallback, waitRef.current);\n    } else {\n      active.current = true;\n    }\n  }, [callThrottledCallback]);\n\n  const throttled = useCallback(\n    (...args: Parameters<T>) => {\n      if (active.current) {\n        callThrottledCallback(...args);\n        timeoutRef.current = window.setTimeout(timerCallback, waitRef.current);\n      } else {\n        latestInArgsRef.current = args;\n      }\n    },\n    [callThrottledCallback, timerCallback]\n  );\n\n  useEffect(() => {\n    waitRef.current = wait;\n  }, [wait]);\n\n  return [throttled, clearTimeout] as const;\n}\n\nexport function useThrottledCallback<T extends (...args: any[]) => any>(callback: T, wait: number) {\n  const [throttled, clearTimeout] = useThrottledCallbackWithClearTimeout(callback, wait);\n  useEffect(() => clearTimeout, []);\n  return throttled;\n}\n"],"mappings":";;;;AAGA,SAAgB,qCACd,UACA,MACA;CACA,MAAM,iBAAiB,eAAe,SAAS;CAC/C,MAAM,kBAAkB,OAAsB,KAAK;CACnD,MAAM,mBAAmB,OAAsB,KAAK;CACpD,MAAM,SAAS,OAAO,KAAK;CAC3B,MAAM,UAAU,OAAO,KAAK;CAC5B,MAAM,aAAa,OAAe,GAAG;CAErC,MAAM,qBAAqB,OAAO,aAAa,WAAW,QAAQ;CAElE,MAAM,wBAAwB,aAC3B,GAAG,SAAwB;AAC1B,iBAAe,GAAG,KAAK;AACvB,kBAAgB,UAAU;AAC1B,mBAAiB,UAAU;AAC3B,SAAO,UAAU;IAEnB,CAAC,eAAe,CACjB;CAED,MAAM,gBAAgB,kBAAkB;AACtC,MAAI,gBAAgB,WAAW,gBAAgB,YAAY,iBAAiB,SAAS;AACnF,yBAAsB,GAAG,gBAAgB,QAAQ;AAEjD,cAAW,UAAU,OAAO,WAAW,eAAe,QAAQ,QAAQ;QAEtE,QAAO,UAAU;IAElB,CAAC,sBAAsB,CAAC;CAE3B,MAAM,YAAY,aACf,GAAG,SAAwB;AAC1B,MAAI,OAAO,SAAS;AAClB,yBAAsB,GAAG,KAAK;AAC9B,cAAW,UAAU,OAAO,WAAW,eAAe,QAAQ,QAAQ;QAEtE,iBAAgB,UAAU;IAG9B,CAAC,uBAAuB,cAAc,CACvC;AAED,iBAAgB;AACd,UAAQ,UAAU;IACjB,CAAC,KAAK,CAAC;AAEV,QAAO,CAAC,WAAW,aAAa;;AAGlC,SAAgB,qBAAwD,UAAa,MAAc;CACjG,MAAM,CAAC,WAAW,gBAAgB,qCAAqC,UAAU,KAAK;AACtF,iBAAgB,cAAc,EAAE,CAAC;AACjC,QAAO"}

package/esm/use-timeout/use-timeout.mjs

@@ -1,11 +1,13 @@
 "use client";
+import { useCallbackRef } from "../utils/use-callback-ref/use-callback-ref.mjs";
 import { useCallback, useEffect, useRef } from "react";
 //#region packages/@mantine/hooks/src/use-timeout/use-timeout.ts
 function useTimeout(callback, delay, options = { autoInvoke: false }) {
 	const timeoutRef = useRef(null);
+	const handleCallback = useCallbackRef(callback);
 	const start = useCallback((...args) => {
 		if (!timeoutRef.current) timeoutRef.current = window.setTimeout(() => {
-			callback(args);
+			handleCallback(...args);
 			timeoutRef.current = null;
 		}, delay);
 	}, [delay]);

package/esm/use-timeout/use-timeout.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-timeout.mjs","names":[],"sources":["../../src/use-timeout/use-timeout.ts"],"sourcesContent":["import { useCallback, useEffect, useRef } from 'react';\n\nexport interface UseTimeoutOptions {\n  autoInvoke: boolean;\n}\n\nexport interface UseTimeoutReturnValue {\n  start: (...args: any[]) => void;\n  clear: () => void;\n}\n\nexport function useTimeout(\n  callback: (...args: any[]) => void,\n  delay: number,\n  options: UseTimeoutOptions = { autoInvoke: false }\n): UseTimeoutReturnValue {\n  const timeoutRef = useRef<number | null>(null);\n\n  const start = useCallback(\n    (...args: any[]) => {\n      if (!timeoutRef.current) {\n        timeoutRef.current = window.setTimeout(() => {\n          callback(args);\n          timeoutRef.current = null;\n        }, delay);\n      }\n    },\n    [delay]\n  );\n\n  const clear = useCallback(() => {\n    if (timeoutRef.current) {\n      window.clearTimeout(timeoutRef.current);\n      timeoutRef.current = null;\n    }\n  }, []);\n\n  useEffect(() => {\n    if (options.autoInvoke) {\n      start();\n    }\n\n    return clear;\n  }, [clear, start]);\n\n  return { start, clear };\n}\n\nexport namespace useTimeout {\n  export type Options = UseTimeoutOptions;\n  export type ReturnValue = UseTimeoutReturnValue;\n}\n"],"mappings":";;;AAWA,SAAgB,WACd,UACA,OACA,UAA6B,EAAE,YAAY,OAAO,EAC3B;CACvB,MAAM,aAAa,OAAsB,KAAK;CAE9C,MAAM,QAAQ,aACX,GAAG,SAAgB;AAClB,MAAI,CAAC,WAAW,QACd,YAAW,UAAU,OAAO,iBAAiB;AAC3C,YAAS,KAAK;AACd,cAAW,UAAU;KACpB,MAAM;IAGb,CAAC,MAAM,CACR;CAED,MAAM,QAAQ,kBAAkB;AAC9B,MAAI,WAAW,SAAS;AACtB,UAAO,aAAa,WAAW,QAAQ;AACvC,cAAW,UAAU;;IAEtB,EAAE,CAAC;AAEN,iBAAgB;AACd,MAAI,QAAQ,WACV,QAAO;AAGT,SAAO;IACN,CAAC,OAAO,MAAM,CAAC;AAElB,QAAO;EAAE;EAAO;EAAO"}
+{"version":3,"file":"use-timeout.mjs","names":[],"sources":["../../src/use-timeout/use-timeout.ts"],"sourcesContent":["import { useCallback, useEffect, useRef } from 'react';\nimport { useCallbackRef } from '../utils';\n\nexport interface UseTimeoutOptions {\n  autoInvoke: boolean;\n}\n\nexport interface UseTimeoutReturnValue {\n  start: (...args: any[]) => void;\n  clear: () => void;\n}\n\nexport function useTimeout(\n  callback: (...args: any[]) => void,\n  delay: number,\n  options: UseTimeoutOptions = { autoInvoke: false }\n): UseTimeoutReturnValue {\n  const timeoutRef = useRef<number | null>(null);\n  const handleCallback = useCallbackRef(callback);\n\n  const start = useCallback(\n    (...args: any[]) => {\n      if (!timeoutRef.current) {\n        timeoutRef.current = window.setTimeout(() => {\n          handleCallback(...args);\n          timeoutRef.current = null;\n        }, delay);\n      }\n    },\n    [delay]\n  );\n\n  const clear = useCallback(() => {\n    if (timeoutRef.current) {\n      window.clearTimeout(timeoutRef.current);\n      timeoutRef.current = null;\n    }\n  }, []);\n\n  useEffect(() => {\n    if (options.autoInvoke) {\n      start();\n    }\n\n    return clear;\n  }, [clear, start]);\n\n  return { start, clear };\n}\n\nexport namespace useTimeout {\n  export type Options = UseTimeoutOptions;\n  export type ReturnValue = UseTimeoutReturnValue;\n}\n"],"mappings":";;;;AAYA,SAAgB,WACd,UACA,OACA,UAA6B,EAAE,YAAY,OAAO,EAC3B;CACvB,MAAM,aAAa,OAAsB,KAAK;CAC9C,MAAM,iBAAiB,eAAe,SAAS;CAE/C,MAAM,QAAQ,aACX,GAAG,SAAgB;AAClB,MAAI,CAAC,WAAW,QACd,YAAW,UAAU,OAAO,iBAAiB;AAC3C,kBAAe,GAAG,KAAK;AACvB,cAAW,UAAU;KACpB,MAAM;IAGb,CAAC,MAAM,CACR;CAED,MAAM,QAAQ,kBAAkB;AAC9B,MAAI,WAAW,SAAS;AACtB,UAAO,aAAa,WAAW,QAAQ;AACvC,cAAW,UAAU;;IAEtB,EAAE,CAAC;AAEN,iBAAgB;AACd,MAAI,QAAQ,WACV,QAAO;AAGT,SAAO;IACN,CAAC,OAAO,MAAM,CAAC;AAElB,QAAO;EAAE;EAAO;EAAO"}

package/esm/use-viewport-size/use-viewport-size.mjs

@@ -2,7 +2,7 @@
 import { useWindowEvent } from "../use-window-event/use-window-event.mjs";
 import { useCallback, useEffect, useState } from "react";
 //#region packages/@mantine/hooks/src/use-viewport-size/use-viewport-size.ts
-const eventListerOptions = { passive: true };
+const eventListenerOptions = { passive: true };
 function useViewportSize() {
 	const [windowSize, setWindowSize] = useState({
 		width: 0,
@@ -14,8 +14,8 @@ function useViewportSize() {
 			height: window.innerHeight || 0
 		});
 	}, []);
-	useWindowEvent("resize", setSize, eventListerOptions);
-	useWindowEvent("orientationchange", setSize, eventListerOptions);
+	useWindowEvent("resize", setSize, eventListenerOptions);
+	useWindowEvent("orientationchange", setSize, eventListenerOptions);
 	useEffect(setSize, []);
 	return windowSize;
 }

package/esm/use-viewport-size/use-viewport-size.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-viewport-size.mjs","names":[],"sources":["../../src/use-viewport-size/use-viewport-size.ts"],"sourcesContent":["import { useCallback, useEffect, useState } from 'react';\nimport { useWindowEvent } from '../use-window-event/use-window-event';\n\nconst eventListerOptions = {\n  passive: true,\n};\n\nexport function useViewportSize() {\n  const [windowSize, setWindowSize] = useState({\n    width: 0,\n    height: 0,\n  });\n\n  const setSize = useCallback(() => {\n    setWindowSize({ width: window.innerWidth || 0, height: window.innerHeight || 0 });\n  }, []);\n\n  useWindowEvent('resize', setSize, eventListerOptions);\n  useWindowEvent('orientationchange', setSize, eventListerOptions);\n  useEffect(setSize, []);\n\n  return windowSize;\n}\n"],"mappings":";;;;AAGA,MAAM,qBAAqB,EACzB,SAAS,MACV;AAED,SAAgB,kBAAkB;CAChC,MAAM,CAAC,YAAY,iBAAiB,SAAS;EAC3C,OAAO;EACP,QAAQ;EACT,CAAC;CAEF,MAAM,UAAU,kBAAkB;AAChC,gBAAc;GAAE,OAAO,OAAO,cAAc;GAAG,QAAQ,OAAO,eAAe;GAAG,CAAC;IAChF,EAAE,CAAC;AAEN,gBAAe,UAAU,SAAS,mBAAmB;AACrD,gBAAe,qBAAqB,SAAS,mBAAmB;AAChE,WAAU,SAAS,EAAE,CAAC;AAEtB,QAAO"}
+{"version":3,"file":"use-viewport-size.mjs","names":[],"sources":["../../src/use-viewport-size/use-viewport-size.ts"],"sourcesContent":["import { useCallback, useEffect, useState } from 'react';\nimport { useWindowEvent } from '../use-window-event/use-window-event';\n\nconst eventListenerOptions = {\n  passive: true,\n};\n\nexport function useViewportSize() {\n  const [windowSize, setWindowSize] = useState({\n    width: 0,\n    height: 0,\n  });\n\n  const setSize = useCallback(() => {\n    setWindowSize({ width: window.innerWidth || 0, height: window.innerHeight || 0 });\n  }, []);\n\n  useWindowEvent('resize', setSize, eventListenerOptions);\n  useWindowEvent('orientationchange', setSize, eventListenerOptions);\n  useEffect(setSize, []);\n\n  return windowSize;\n}\n"],"mappings":";;;;AAGA,MAAM,uBAAuB,EAC3B,SAAS,MACV;AAED,SAAgB,kBAAkB;CAChC,MAAM,CAAC,YAAY,iBAAiB,SAAS;EAC3C,OAAO;EACP,QAAQ;EACT,CAAC;CAEF,MAAM,UAAU,kBAAkB;AAChC,gBAAc;GAAE,OAAO,OAAO,cAAc;GAAG,QAAQ,OAAO,eAAe;GAAG,CAAC;IAChF,EAAE,CAAC;AAEN,gBAAe,UAAU,SAAS,qBAAqB;AACvD,gBAAe,qBAAqB,SAAS,qBAAqB;AAClE,WAAU,SAAS,EAAE,CAAC;AAEtB,QAAO"}

package/esm/use-window-scroll/use-window-scroll.mjs

@@ -24,8 +24,8 @@ function useWindowScroll() {
 		x: 0,
 		y: 0
 	});
-	useWindowEvent("scroll", () => setPosition(getScrollPosition()));
-	useWindowEvent("resize", () => setPosition(getScrollPosition()));
+	useWindowEvent("scroll", () => setPosition(getScrollPosition()), { passive: true });
+	useWindowEvent("resize", () => setPosition(getScrollPosition()), { passive: true });
 	useEffect(() => {
 		setPosition(getScrollPosition());
 	}, []);

package/esm/use-window-scroll/use-window-scroll.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-window-scroll.mjs","names":[],"sources":["../../src/use-window-scroll/use-window-scroll.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport { useWindowEvent } from '../use-window-event/use-window-event';\n\nexport interface UseWindowScrollPosition {\n  x: number;\n  y: number;\n}\n\nexport type UseWindowScrollTo = (position: Partial<UseWindowScrollPosition>) => void;\nexport type UseWindowScrollReturnValue = [UseWindowScrollPosition, UseWindowScrollTo];\n\nfunction getScrollPosition(): UseWindowScrollPosition {\n  return typeof window !== 'undefined' ? { x: window.scrollX, y: window.scrollY } : { x: 0, y: 0 };\n}\n\nfunction scrollTo({ x, y }: Partial<UseWindowScrollPosition>) {\n  if (typeof window !== 'undefined') {\n    const scrollOptions: ScrollToOptions = { behavior: 'smooth' };\n\n    if (typeof x === 'number') {\n      scrollOptions.left = x;\n    }\n\n    if (typeof y === 'number') {\n      scrollOptions.top = y;\n    }\n\n    window.scrollTo(scrollOptions);\n  }\n}\n\nexport function useWindowScroll(): UseWindowScrollReturnValue {\n  const [position, setPosition] = useState<UseWindowScrollPosition>({ x: 0, y: 0 });\n\n  useWindowEvent('scroll', () => setPosition(getScrollPosition()));\n  useWindowEvent('resize', () => setPosition(getScrollPosition()));\n\n  useEffect(() => {\n    setPosition(getScrollPosition());\n  }, []);\n\n  return [position, scrollTo] as const;\n}\n\nexport namespace useWindowScroll {\n  export type Position = UseWindowScrollPosition;\n  export type ScrollTo = UseWindowScrollTo;\n  export type ReturnValue = UseWindowScrollReturnValue;\n}\n"],"mappings":";;;;AAWA,SAAS,oBAA6C;AACpD,QAAO,OAAO,WAAW,cAAc;EAAE,GAAG,OAAO;EAAS,GAAG,OAAO;EAAS,GAAG;EAAE,GAAG;EAAG,GAAG;EAAG;;AAGlG,SAAS,SAAS,EAAE,GAAG,KAAuC;AAC5D,KAAI,OAAO,WAAW,aAAa;EACjC,MAAM,gBAAiC,EAAE,UAAU,UAAU;AAE7D,MAAI,OAAO,MAAM,SACf,eAAc,OAAO;AAGvB,MAAI,OAAO,MAAM,SACf,eAAc,MAAM;AAGtB,SAAO,SAAS,cAAc;;;AAIlC,SAAgB,kBAA8C;CAC5D,MAAM,CAAC,UAAU,eAAe,SAAkC;EAAE,GAAG;EAAG,GAAG;EAAG,CAAC;AAEjF,gBAAe,gBAAgB,YAAY,mBAAmB,CAAC,CAAC;AAChE,gBAAe,gBAAgB,YAAY,mBAAmB,CAAC,CAAC;AAEhE,iBAAgB;AACd,cAAY,mBAAmB,CAAC;IAC/B,EAAE,CAAC;AAEN,QAAO,CAAC,UAAU,SAAS"}
+{"version":3,"file":"use-window-scroll.mjs","names":[],"sources":["../../src/use-window-scroll/use-window-scroll.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport { useWindowEvent } from '../use-window-event/use-window-event';\n\nexport interface UseWindowScrollPosition {\n  x: number;\n  y: number;\n}\n\nexport type UseWindowScrollTo = (position: Partial<UseWindowScrollPosition>) => void;\nexport type UseWindowScrollReturnValue = [UseWindowScrollPosition, UseWindowScrollTo];\n\nfunction getScrollPosition(): UseWindowScrollPosition {\n  return typeof window !== 'undefined' ? { x: window.scrollX, y: window.scrollY } : { x: 0, y: 0 };\n}\n\nfunction scrollTo({ x, y }: Partial<UseWindowScrollPosition>) {\n  if (typeof window !== 'undefined') {\n    const scrollOptions: ScrollToOptions = { behavior: 'smooth' };\n\n    if (typeof x === 'number') {\n      scrollOptions.left = x;\n    }\n\n    if (typeof y === 'number') {\n      scrollOptions.top = y;\n    }\n\n    window.scrollTo(scrollOptions);\n  }\n}\n\nexport function useWindowScroll(): UseWindowScrollReturnValue {\n  const [position, setPosition] = useState<UseWindowScrollPosition>({ x: 0, y: 0 });\n\n  useWindowEvent('scroll', () => setPosition(getScrollPosition()), { passive: true });\n  useWindowEvent('resize', () => setPosition(getScrollPosition()), { passive: true });\n\n  useEffect(() => {\n    setPosition(getScrollPosition());\n  }, []);\n\n  return [position, scrollTo] as const;\n}\n\nexport namespace useWindowScroll {\n  export type Position = UseWindowScrollPosition;\n  export type ScrollTo = UseWindowScrollTo;\n  export type ReturnValue = UseWindowScrollReturnValue;\n}\n"],"mappings":";;;;AAWA,SAAS,oBAA6C;AACpD,QAAO,OAAO,WAAW,cAAc;EAAE,GAAG,OAAO;EAAS,GAAG,OAAO;EAAS,GAAG;EAAE,GAAG;EAAG,GAAG;EAAG;;AAGlG,SAAS,SAAS,EAAE,GAAG,KAAuC;AAC5D,KAAI,OAAO,WAAW,aAAa;EACjC,MAAM,gBAAiC,EAAE,UAAU,UAAU;AAE7D,MAAI,OAAO,MAAM,SACf,eAAc,OAAO;AAGvB,MAAI,OAAO,MAAM,SACf,eAAc,MAAM;AAGtB,SAAO,SAAS,cAAc;;;AAIlC,SAAgB,kBAA8C;CAC5D,MAAM,CAAC,UAAU,eAAe,SAAkC;EAAE,GAAG;EAAG,GAAG;EAAG,CAAC;AAEjF,gBAAe,gBAAgB,YAAY,mBAAmB,CAAC,EAAE,EAAE,SAAS,MAAM,CAAC;AACnF,gBAAe,gBAAgB,YAAY,mBAAmB,CAAC,EAAE,EAAE,SAAS,MAAM,CAAC;AAEnF,iBAAgB;AACd,cAAY,mBAAmB,CAAC;IAC/B,EAAE,CAAC;AAEN,QAAO,CAAC,UAAU,SAAS"}

package/lib/index.d.mts

@@ -77,13 +77,15 @@ export { useSelection } from './use-selection/use-selection.js';
 export { useFloatingWindow } from './use-floating-window/use-floating-window.js';
 export { useCollapse } from './use-collapse/use-collapse.js';
 export { useHorizontalCollapse } from './use-collapse/use-horizontal-collapse.js';
+export { useMask, formatMask, unformatMask, isMaskComplete, generatePattern, } from './use-mask/use-mask.js';
+export { useRovingIndex } from './use-roving-index/use-roving-index.js';
 export type { UseMediaQueryOptions } from './use-media-query/use-media-query';
 export type { UseClipboardInput as UseClipboardOptions, UseClipboardReturnValue, } from './use-clipboard/use-clipboard';
 export type { UseColorSchemeValue } from './use-color-scheme/use-color-scheme';
 export type { UseCounterOptions, UseCounterHandlers, UseCounterReturnValue, } from './use-counter/use-counter';
 export type { UseDebouncedCallbackOptions, UseDebouncedCallbackReturnValue, } from './use-debounced-callback/use-debounced-callback';
 export type { UseDebouncedStateOptions, UseDebouncedStateReturnValue, } from './use-debounced-state/use-debounced-state';
-export type { UseDebouncedValueOptions, UseDebouncedValueReturnValue, } from './use-debounced-value/use-debounced-value';
+export type { UseDebouncedValueHandlers, UseDebouncedValueOptions, UseDebouncedValueReturnValue, } from './use-debounced-value/use-debounced-value';
 export type { UseDisclosureOptions, UseDisclosureHandlers, UseDisclosureReturnValue, } from './use-disclosure/use-disclosure';
 export type { EyeDropperOpenOptions, EyeDropperOpenReturnType, UseEyeDropperReturnValue, } from './use-eye-dropper/use-eye-dropper';
 export type { UseFetchOptions, UseFetchReturnValue } from './use-fetch/use-fetch';
@@ -126,3 +128,5 @@ export type { UseSelectionHandlers, UseSelectionInput, UseSelectionReturnValue,
 export type { UseElementSizeReturnValue, UseResizeObserverReturnValue, ObserverRect, } from './use-resize-observer/use-resize-observer';
 export type { UseCollapseInput, UseCollapseReturnValue, UseCollapseState, } from './use-collapse/use-collapse';
 export type { UseHorizontalCollapseInput, UseHorizontalCollapseReturnValue, UseHorizontalCollapseState, } from './use-collapse/use-horizontal-collapse';
+export type { UseMaskOptions, UseMaskReturnValue, MaskState } from './use-mask/use-mask';
+export type { UseRovingIndexInput, UseRovingIndexGetItemPropsInput, UseRovingIndexReturnValue, } from './use-roving-index/use-roving-index';

package/lib/index.d.ts

@@ -77,13 +77,15 @@ export { useSelection } from './use-selection/use-selection.js';
 export { useFloatingWindow } from './use-floating-window/use-floating-window.js';
 export { useCollapse } from './use-collapse/use-collapse.js';
 export { useHorizontalCollapse } from './use-collapse/use-horizontal-collapse.js';
+export { useMask, formatMask, unformatMask, isMaskComplete, generatePattern, } from './use-mask/use-mask.js';
+export { useRovingIndex } from './use-roving-index/use-roving-index.js';
 export type { UseMediaQueryOptions } from './use-media-query/use-media-query';
 export type { UseClipboardInput as UseClipboardOptions, UseClipboardReturnValue, } from './use-clipboard/use-clipboard';
 export type { UseColorSchemeValue } from './use-color-scheme/use-color-scheme';
 export type { UseCounterOptions, UseCounterHandlers, UseCounterReturnValue, } from './use-counter/use-counter';
 export type { UseDebouncedCallbackOptions, UseDebouncedCallbackReturnValue, } from './use-debounced-callback/use-debounced-callback';
 export type { UseDebouncedStateOptions, UseDebouncedStateReturnValue, } from './use-debounced-state/use-debounced-state';
-export type { UseDebouncedValueOptions, UseDebouncedValueReturnValue, } from './use-debounced-value/use-debounced-value';
+export type { UseDebouncedValueHandlers, UseDebouncedValueOptions, UseDebouncedValueReturnValue, } from './use-debounced-value/use-debounced-value';
 export type { UseDisclosureOptions, UseDisclosureHandlers, UseDisclosureReturnValue, } from './use-disclosure/use-disclosure';
 export type { EyeDropperOpenOptions, EyeDropperOpenReturnType, UseEyeDropperReturnValue, } from './use-eye-dropper/use-eye-dropper';
 export type { UseFetchOptions, UseFetchReturnValue } from './use-fetch/use-fetch';
@@ -126,3 +128,5 @@ export type { UseSelectionHandlers, UseSelectionInput, UseSelectionReturnValue,
 export type { UseElementSizeReturnValue, UseResizeObserverReturnValue, ObserverRect, } from './use-resize-observer/use-resize-observer';
 export type { UseCollapseInput, UseCollapseReturnValue, UseCollapseState, } from './use-collapse/use-collapse';
 export type { UseHorizontalCollapseInput, UseHorizontalCollapseReturnValue, UseHorizontalCollapseState, } from './use-collapse/use-horizontal-collapse';
+export type { UseMaskOptions, UseMaskReturnValue, MaskState } from './use-mask/use-mask';
+export type { UseRovingIndexInput, UseRovingIndexGetItemPropsInput, UseRovingIndexReturnValue, } from './use-roving-index/use-roving-index';

package/lib/use-click-outside/use-click-outside.d.ts

@@ -1,3 +1,3 @@
 type EventType = MouseEvent | TouchEvent;
-export declare function useClickOutside<T extends HTMLElement = any>(callback: (event: EventType) => void, events?: string[] | null, nodes?: (HTMLElement | null)[]): import("react").RefObject<T | null>;
+export declare function useClickOutside<T extends HTMLElement = any>(callback: (event: EventType) => void, events?: string[] | null, nodes?: (HTMLElement | null)[], enabled?: boolean): import("react").RefObject<T | null>;
 export {};

package/lib/use-collapse/use-horizontal-collapse.d.ts

@@ -33,4 +33,9 @@ export interface UseHorizontalCollapseReturnValue {
     getCollapseProps: (input?: GetHorizontalCollapsePropsInput) => GetHorizontalCollapsePropsReturnValue;
 }
 export declare function useHorizontalCollapse({ transitionDuration, transitionTimingFunction, onTransitionEnd, onTransitionStart, expanded, keepMounted, }: UseHorizontalCollapseInput): UseHorizontalCollapseReturnValue;
+export declare namespace useHorizontalCollapse {
+    type Input = UseHorizontalCollapseInput;
+    type ReturnValue = UseHorizontalCollapseReturnValue;
+    type State = UseHorizontalCollapseState;
+}
 export {};

package/lib/use-counter/use-counter.d.ts

@@ -1,6 +1,7 @@
 export interface UseCounterOptions {
     min?: number;
     max?: number;
+    step?: number;
 }
 export interface UseCounterHandlers {
     increment: () => void;

package/lib/use-debounced-callback/use-debounced-callback.d.ts

@@ -2,15 +2,19 @@ export interface UseDebouncedCallbackOptions {
     delay: number;
     flushOnUnmount?: boolean;
     leading?: boolean;
+    maxWait?: number;
 }
 export type UseDebouncedCallbackReturnValue<T extends (...args: any[]) => any> = ((...args: Parameters<T>) => void) & {
     flush: () => void;
     cancel: () => void;
+    isPending: () => boolean;
 };
 export declare function useDebouncedCallback<T extends (...args: any[]) => any>(callback: T, options: number | UseDebouncedCallbackOptions): ((...args: Parameters<T>) => void) & {
     flush: () => void;
     cancel: () => void;
+    isPending: () => boolean;
     _isFirstCall: boolean;
+    _hasPendingCallback: boolean;
 };
 export declare namespace useDebouncedCallback {
     type Options = UseDebouncedCallbackOptions;

package/lib/use-debounced-value/use-debounced-value.d.ts

@@ -1,9 +1,14 @@
 export interface UseDebouncedValueOptions {
     leading?: boolean;
 }
-export type UseDebouncedValueReturnValue<T> = [T, () => void];
+export interface UseDebouncedValueHandlers {
+    cancel: () => void;
+    flush: () => void;
+}
+export type UseDebouncedValueReturnValue<T> = [T, () => void, UseDebouncedValueHandlers];
 export declare function useDebouncedValue<T = any>(value: T, wait: number, options?: UseDebouncedValueOptions): UseDebouncedValueReturnValue<T>;
 export declare namespace useDebouncedValue {
+    type Handlers = UseDebouncedValueHandlers;
     type Options = UseDebouncedValueOptions;
     type ReturnValue<T> = UseDebouncedValueReturnValue<T>;
 }

package/lib/use-event-listener/use-event-listener.d.ts

@@ -1 +1 @@
-export declare function useEventListener<K extends keyof HTMLElementEventMap, T extends HTMLElement = any>(type: K, listener: (this: HTMLDivElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): React.RefCallback<T | null>;
+export declare function useEventListener<K extends keyof HTMLElementEventMap, T extends HTMLElement = any>(type: K, listener: (this: T, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): React.RefCallback<T | null>;

package/lib/use-hotkeys/parse-hotkey.d.ts

@@ -1,14 +1,13 @@
-export type KeyboardModifiers = {
+export interface KeyboardModifiers {
     alt: boolean;
     ctrl: boolean;
     meta: boolean;
     mod: boolean;
     shift: boolean;
-    plus: boolean;
-};
-export type Hotkey = KeyboardModifiers & {
+}
+export interface Hotkey extends KeyboardModifiers {
     key?: string;
-};
+}
 type CheckHotkeyMatch = (event: KeyboardEvent) => boolean;
 export declare function parseHotkey(hotkey: string): Hotkey;
 export declare function getHotkeyMatcher(hotkey: string, usePhysicalKeys?: boolean): CheckHotkeyMatch;

package/lib/use-long-press/use-long-press.d.ts

@@ -15,6 +15,7 @@ export interface UseLongPressReturnValue {
     onMouseLeave: (event: React.MouseEvent) => void;
     onTouchStart: (event: React.TouchEvent) => void;
     onTouchEnd: (event: React.TouchEvent) => void;
+    onTouchCancel: (event: React.TouchEvent) => void;
 }
 export declare function useLongPress(onLongPress: (event: React.MouseEvent | React.TouchEvent) => void, options?: UseLongPressOptions): UseLongPressReturnValue;
 export declare namespace useLongPress {

package/lib/use-mask/use-mask.d.ts

@@ -0,0 +1,60 @@
+export interface UseMaskOptions {
+    /** Mask pattern string or array of string literals and RegExp objects */
+    mask: string | Array<string | RegExp>;
+    /** Override or extend the default token map */
+    tokens?: Record<string, RegExp>;
+    /** Called before masking on each keystroke, can return overrides for mask options */
+    modify?: (value: string) => Partial<Pick<UseMaskOptions, 'mask' | 'tokens' | 'slotChar' | 'separate'>> | undefined;
+    /** When true, raw and display values are decoupled */
+    separate?: boolean;
+    /** Character displayed in unfilled slots, `"_"` by default */
+    slotChar?: string | null;
+    /** Show mask pattern even when field is empty and unfocused */
+    alwaysShowMask?: boolean;
+    /** Show mask placeholder on focus, `true` by default */
+    showMaskOnFocus?: boolean;
+    /** Transform each character before validation and insertion */
+    transform?: (char: string) => string;
+    /** Clear value on blur when mask is incomplete, `false` by default */
+    autoClear?: boolean;
+    /** Sets aria-invalid on the input */
+    invalid?: boolean;
+    /** Called on every change with raw and masked values */
+    onChangeRaw?: (rawValue: string, maskedValue: string) => void;
+    /** Called when all required mask slots are filled */
+    onComplete?: (maskedValue: string, rawValue: string) => void;
+    /** Escape hatch for advanced cursor/value manipulation */
+    beforeMaskedStateChange?: (states: {
+        previousState: MaskState;
+        currentState: MaskState;
+        nextState: MaskState;
+    }) => MaskState;
+}
+export interface MaskState {
+    value: string;
+    selection: {
+        start: number;
+        end: number;
+    } | null;
+}
+export interface UseMaskReturnValue {
+    /** Ref to attach to the input element */
+    ref: React.RefCallback<HTMLInputElement>;
+    /** Current masked display value */
+    value: string;
+    /** Current raw unmasked value */
+    rawValue: string;
+    /** Whether all required mask slots are filled */
+    isComplete: boolean;
+    /** Clear the input value and reset state */
+    reset: () => void;
+}
+export declare function formatMask(raw: string, options: UseMaskOptions): string;
+export declare function unformatMask(masked: string, options: UseMaskOptions): string;
+export declare function isMaskComplete(masked: string, options: UseMaskOptions): boolean;
+export declare function generatePattern(mode: 'full' | 'full-inexact', options: UseMaskOptions): string;
+export declare function useMask(options: UseMaskOptions): UseMaskReturnValue;
+export declare namespace useMask {
+    type Options = UseMaskOptions;
+    type ReturnValue = UseMaskReturnValue;
+}

package/lib/use-roving-index/use-roving-index.d.ts

@@ -0,0 +1,49 @@
+export interface UseRovingIndexInput {
+    /** Total number of items in the group */
+    total: number;
+    /** Which arrow keys navigate, `'horizontal'` by default */
+    orientation?: 'horizontal' | 'vertical' | 'both';
+    /** Whether navigation wraps at boundaries, `true` by default */
+    loop?: boolean;
+    /** Text direction, `'ltr'` by default */
+    dir?: 'rtl' | 'ltr';
+    /** Whether to click element when it receives focus via keyboard, `false` by default */
+    activateOnFocus?: boolean;
+    /** Number of columns for grid (2D) navigation. When set, enables grid mode */
+    columns?: number;
+    /** Controlled focused index */
+    focusedIndex?: number;
+    /** Initial focused index for uncontrolled mode, first non-disabled item by default */
+    initialIndex?: number;
+    /** Called when focused index changes */
+    onFocusChange?: (index: number) => void;
+    /** Function to check if item at given index is disabled, `() => false` by default */
+    isItemDisabled?: (index: number) => boolean;
+}
+export interface UseRovingIndexGetItemPropsInput {
+    /** Index of the item in the group */
+    index: number;
+    /** Called when item is clicked */
+    onClick?: React.MouseEventHandler;
+    /** Called when keydown event fires on item */
+    onKeyDown?: React.KeyboardEventHandler;
+}
+export interface UseRovingIndexReturnValue {
+    /** Get props to spread on each navigable item */
+    getItemProps: (options: UseRovingIndexGetItemPropsInput) => {
+        tabIndex: 0 | -1;
+        onKeyDown: React.KeyboardEventHandler;
+        onClick: React.MouseEventHandler;
+        ref: React.RefCallback<HTMLElement>;
+    };
+    /** Currently focused index */
+    focusedIndex: number;
+    /** Programmatically set focused index */
+    setFocusedIndex: (index: number) => void;
+}
+export declare function useRovingIndex(input: UseRovingIndexInput): UseRovingIndexReturnValue;
+export declare namespace useRovingIndex {
+    type Input = UseRovingIndexInput;
+    type GetItemPropsInput = UseRovingIndexGetItemPropsInput;
+    type ReturnValue = UseRovingIndexReturnValue;
+}

package/lib/use-scroll-into-view/use-scroll-into-view.d.ts

@@ -5,6 +5,8 @@ interface UseScrollIntoViewAnimation {
 export interface UseScrollIntoViewOptions {
     /** Callback fired after scroll */
     onScrollFinish?: () => void;
+    /** Callback fired when scroll animation is canceled by user interaction */
+    onScrollCancel?: () => void;
     /** Duration of scroll in milliseconds */
     duration?: number;
     /** Axis of scroll */
@@ -23,8 +25,9 @@ export interface UseScrollIntoViewReturnValue<Target extends HTMLElement = any,
     targetRef: React.RefObject<Target | null>;
     scrollIntoView: (params?: UseScrollIntoViewAnimation) => void;
     cancel: () => void;
+    scrolling: boolean;
 }
-export declare function useScrollIntoView<Target extends HTMLElement = any, Parent extends HTMLElement | null = null>({ duration, axis, onScrollFinish, easing, offset, cancelable, isList, }?: UseScrollIntoViewOptions): UseScrollIntoViewReturnValue<Target, Parent>;
+export declare function useScrollIntoView<Target extends HTMLElement = any, Parent extends HTMLElement | null = null>({ duration, axis, onScrollFinish, onScrollCancel, easing, offset, cancelable, isList, }?: UseScrollIntoViewOptions): UseScrollIntoViewReturnValue<Target, Parent>;
 export declare namespace useScrollIntoView {
     type Options = UseScrollIntoViewOptions;
     type ReturnValue<Target extends HTMLElement, Parent extends HTMLElement | null> = UseScrollIntoViewReturnValue<Target, Parent>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mantine/hooks",
-  "version": "9.0.2",
+  "version": "9.1.1",
   "description": "A collection of 50+ hooks for state and UI management",
   "homepage": "https://mantine.dev",
   "license": "MIT",