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

* While the state can be a number/string (due to precision logic)
   * We'll create a state to store only the number value
   */
  const [valueAsNumber, setValueAsNumber] = React.useState(+value);

  /**
   * Get the fallback precision from the value or step
   *
   * @example If no precision prop was passed and
   * value = 4, step = 0.01
   *
   * Then precision (or decimal points) is 2
   */
  const fallbackPrecision = Math.max(
    calculatePrecision(stepProp || 1),
    calculatePrecision(+value || 0),
  );
  const precision = precisionProp || fallbackPrecision;

  // If we've reached the max and `keepWithinRange` is true
  // We don't want to fired unnecessary updates, let's store the prev value here
  const prevNextValue = React.useRef(null);

  // Function to update value in state and invoke the `onChange` callback
  const updateValue = React.useCallback(
    (nextValue: number | string) => {
      if (prevNextValue.current == nextValue) return;

      if (!isControlled) {
        setValue(nextValue);
        // Update number state if it's not the same
        // "3.", "3.0" and "3" are considered the same

/**
   * While the state can be a number/string (due to precision logic)
   * We'll create a state to store only the number value
   */
  const [valueAsNumber, setValueAsNumber] = React.useState(+value);

  /**
   * Get the fallback precision from the value or step
   *
   * @example If no precision prop was passed and
   * value = 4, step = 0.01
   *
   * Then precision (or decimal points) is 2
   */
  const fallbackPrecision = Math.max(
    calculatePrecision(stepProp || 1),
    calculatePrecision(+value || 0),
  );
  const precision = precisionProp || fallbackPrecision;

  // If we've reached the max and `keepWithinRange` is true
  // We don't want to fired unnecessary updates, let's store the prev value here
  const prevNextValue = React.useRef(null);

  // Function to update value in state and invoke the `onChange` callback
  const updateValue = React.useCallback(
    (nextValue: number | string) => {
      if (prevNextValue.current == nextValue) return;

      if (!isControlled) {
        setValue(nextValue);
        // Update number state if it's not the same