@hitachivantara/uikit-react-core/dist/esm/NumberInput/NumberInput.js

Core React components for the NEXT Design System.

import { jsxs, Fragment, jsx } from "react/jsx-runtime";
import { forwardRef, useRef, useMemo } from "react";
import { useForkRef } from "@mui/material";
import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
import { HvIcon } from "../icons.js";
import { changeInputValue } from "../Input/utils.js";
import { useClasses } from "./NumberInput.styles.js";
import { HvAdornment } from "../FormElement/Adornment/Adornment.js";
import { HvInput } from "../Input/Input.js";
const HvNumberInput = forwardRef(function HvNumberInput2(props, ref) {
  const {
    classes: classesProp,
    className,
    readOnly,
    ...others
  } = useDefaultProps("HvNumberInput", props);
  const { classes, cx } = useClasses(classesProp);
  const inputRef = useRef(null);
  const forkedRef = useForkRef(ref, inputRef);
  const buttons = useMemo(() => {
    const handleIncrease = () => {
      if (inputRef.current) {
        inputRef.current.stepUp();
        changeInputValue(inputRef.current, inputRef.current.value);
      }
    };
    const handleDecrease = () => {
      if (inputRef.current) {
        inputRef.current.stepDown();
        changeInputValue(inputRef.current, inputRef.current.value);
      }
    };
    return /* @__PURE__ */ jsxs(Fragment, { children: [
      /* @__PURE__ */ jsx(HvAdornment, { icon: /* @__PURE__ */ jsx(HvIcon, { name: "Remove" }), onClick: handleDecrease }),
      /* @__PURE__ */ jsx(HvAdornment, { icon: /* @__PURE__ */ jsx(HvIcon, { name: "Add" }), onClick: handleIncrease })
    ] });
  }, []);
  return /* @__PURE__ */ jsx(
    HvInput,
    {
      ref: forkedRef,
      type: "number",
      className: cx(classes.root, className),
      endAdornment: !readOnly && buttons,
      classes,
      readOnly,
      disableClear: true,
      ...others
    }
  );
});
export {
  HvNumberInput
};