Function useSpinButton

packages/react-aria/src/spinbutton/useSpinButton.ts:42–323

(props: SpinButtonProps)

}

export function useSpinButton(props: SpinButtonProps): SpinbuttonAria {
  const _async = useRef<number>(undefined);
  let {
    value,
    textValue,
    minValue,
    maxValue,
    isDisabled,
    isReadOnly,
    isRequired,
    onIncrement,
    onIncrementPage,
    onDecrement,
    onDecrementPage,
    onDecrementToMin,
    onIncrementToMax
  } = props;
  const stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-aria/spinbutton');

  let isSpinning = useRef(false);
  const clearAsync = useCallback(() => {
    clearTimeout(_async.current);
    isSpinning.current = false;
  }, []);
  const clearAsyncEvent = useEffectEvent(() => {
    clearAsync();
  });

  useEffect(() => {
    return () => clearAsyncEvent();
  }, []);

  let onKeyDown = e => {
    if (
      e.ctrlKey ||
      e.metaKey ||
      e.shiftKey ||
      e.altKey ||
      isReadOnly ||
      e.nativeEvent.isComposing
    ) {
      return;
    }

    switch (e.key) {
      case 'PageUp':
        if (onIncrementPage) {
          e.preventDefault();
          onIncrementPage?.();
          break;
        }
      // fallthrough!
      case 'ArrowUp':
      case 'Up':
        if (onIncrement) {
          e.preventDefault();
          onIncrement?.();
        }