How to use the @chakra-ui/utils.throttle function in @chakra-ui/utils

To help you get started, weโ€™ve selected a few @chakra-ui/utils examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github chakra-ui / chakra-ui / packages / hooks / src / useCounter / useCounter.tsx View on Github external
// after a delay, keep decrementing at interval ("spinning down")
    timeoutRef.current = setTimeout(() => {
      setRunOnce(false);
      setIsSpinning(true);
      setAction("decrement");
    }, TIMEOUT_DURATION);
  }, [decrement, runOnce]);

  // increment using throttle (useful for keydown handlers)
  const incrementWithThrottle = throttle(INTERVAL_DURATION, () =>
    increment(),
  ) as VoidFunction;

  // decrement using throttle (useful for keydown handlers)
  const decrementWithThrottle = throttle(INTERVAL_DURATION, () =>
    decrement(),
  ) as VoidFunction;

  // Function to stop spinng (useful for mouseup, keyup handlers)
  const stopSpinning = React.useCallback(() => {
    setRunOnce(true);
    setIsSpinning(false);
    removeTimeout();
  }, []);

  /**
   * If the component unmounts while spinning,
   * let's clear the timeout as well
   */
  React.useEffect(() => {
    return () => {