@renderlesskit/react/dist/esm/number-input/NumberInputState.js

Collection of headless components/hooks that are accessible, composable, customizable from low level to build your own UI & Design System powered by Reakit

var _excluded = ["update", "cast", "clamp", "increment", "decrement"];

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }

function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }

/**
 * All credit goes to [Segun Adebayo](https://github.com/segunadebayo) for
 * creating an Awesome Library [Chakra UI](https://github.com/chakra-ui/chakra-ui/)
 * We improved the hook [useNumberInput](https://github.com/chakra-ui/chakra-ui/blob/develop/packages/number-input/src/use-number-input.ts)
 * to work with Reakit System
 */
import * as React from "react";
import { useCounter } from "@chakra-ui/counter";
import { useSafeLayoutEffect } from "@chakra-ui/hooks";
import { focus, maxSafeInteger, minSafeInteger } from "@chakra-ui/utils";
import { sanitize, useSpinner } from "./helpers";
export function useNumberInputState() {
  var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
  var {
    min = minSafeInteger,
    max = maxSafeInteger,
    step: stepProp = 1,
    keepWithinRange = true,
    focusInputOnChange = true,
    isReadOnly,
    isDisabled,
    isInvalid,
    isRequired
  } = props;
  /**
   * Leverage the `useCounter` hook since it provides
   * the functionality to `increment`, `decrement` and `update`
   * counter values
   */

  var counter = useCounter(props);

  var {
    update: updateValue,
    cast: setCastedValue,
    clamp: clampToPrecision,
    increment: incrementFn,
    decrement: decrementFn
  } = counter,
      counterProps = _objectWithoutProperties(counter, _excluded);

  var isInteractive = !(isReadOnly || isDisabled);
  var increment = React.useCallback(function () {
    var step = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : stepProp;

    if (isInteractive) {
      incrementFn(step);
    }
  }, [incrementFn, isInteractive, stepProp]);
  var decrement = React.useCallback(function () {
    var step = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : stepProp;

    if (isInteractive) {
      decrementFn(step);
    }
  }, [decrementFn, isInteractive, stepProp]);
  /**
   * Leverage the `useSpinner` hook to spin the input's value
   * when long press on the up and down buttons.
   *
   * This leverages `setInterval` internally
   */

  var spinner = useSpinner(increment, decrement);
  var inputRef = React.useRef(null);
  /**
   * Sync state with uncontrolled form libraries like `react-hook-form`.
   */

  useSafeLayoutEffect(() => {
    if (!inputRef.current) return;
    var notInSync = inputRef.current.value !== counter.value;

    if (notInSync) {
      counter.setValue(sanitize(inputRef.current.value));
    }
  }, [counter.value]);
  var focusInput = React.useCallback(() => {
    if (focusInputOnChange && inputRef.current) {
      focus(inputRef.current, {
        nextTick: true
      });
    }
  }, [focusInputOnChange]);
  return _objectSpread(_objectSpread({
    min,
    max,
    step: stepProp,
    keepWithinRange,
    updateValue,
    setCastedValue,
    clampToPrecision,
    increment,
    decrement
  }, counterProps), {}, {
    inputRef,
    focusInput,
    spinUp: spinner.up,
    spinDown: spinner.down,
    spinStop: spinner.stop,
    isReadOnly,
    isDisabled,
    isInvalid,
    isRequired
  });
}
//# sourceMappingURL=NumberInputState.js.map