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

Core React components for the NEXT Design System.

import { jsx } from "react/jsx-runtime";
import { forwardRef, useContext } from "react";
import MuiInputBase from "@mui/material/InputBase";
import { useForkRef } from "@mui/material/utils";
import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
import { useClasses } from "./BaseInput.styles.js";
import { staticClasses } from "./BaseInput.styles.js";
import { HvFormElementContext, HvFormElementDescriptorsContext } from "../FormElement/context.js";
import { buildFormElementPropsFromContext, buildAriaPropsFromContext } from "../FormElement/utils.js";
const HvBaseInput = forwardRef(function HvBaseInput2(props, ref) {
  const {
    classes: classesProp,
    className = "",
    id,
    name,
    value,
    defaultValue,
    required,
    readOnly,
    disabled,
    onChange,
    type = "text",
    placeholder,
    multiline,
    resizable,
    invalid: invalidProp,
    inputRef,
    inputProps = {},
    ...others
  } = useDefaultProps("HvBaseInput", props);
  const { classes, cx } = useClasses(classesProp);
  const formElementContext = useContext(HvFormElementContext);
  const formElementProps = buildFormElementPropsFromContext(
    name,
    disabled,
    readOnly,
    required,
    formElementContext
  );
  const forkedRef = useForkRef(ref, inputRef);
  const invalid = invalidProp || formElementProps.status === "invalid";
  const formElementDescriptorsContext = useContext(
    HvFormElementDescriptorsContext
  );
  const ariaProps = buildAriaPropsFromContext(
    inputProps,
    formElementDescriptorsContext,
    invalid,
    id
  );
  return /* @__PURE__ */ jsx(
    MuiInputBase,
    {
      id,
      name: formElementProps.name,
      value,
      defaultValue,
      placeholder,
      readOnly: !!formElementProps.readOnly,
      disabled: formElementProps.disabled,
      onChange: (event) => onChange?.(event, event.target.value),
      className: cx(classes.root, classes.inputRoot, className, {
        [classes.inputRootMultiline]: multiline,
        [classes.multiline]: multiline,
        [classes.inputRootInvalid]: invalid,
        [classes.invalid]: invalid,
        [classes.inputRootReadOnly]: formElementProps.readOnly,
        [classes.readOnly]: formElementProps.readOnly,
        [classes.inputRootDisabled]: formElementProps.disabled,
        [classes.disabled]: formElementProps.disabled
      }),
      classes: {
        focused: cx(classes.focused, classes.inputRootFocused),
        input: cx(classes.input, {
          [classes.inputResizable]: !formElementProps.disabled && resizable,
          [classes.inputDisabled]: formElementProps.disabled,
          [classes.inputReadOnly]: formElementProps.readOnly
        })
      },
      inputProps: {
        // Avoid the required attribute at the root node
        required: formElementProps.required,
        ...inputProps,
        ...ariaProps
      },
      inputRef: forkedRef,
      multiline,
      ...multiline ? { rows: 10 } : { type },
      ...others
    }
  );
});
export {
  HvBaseInput,
  staticClasses as baseInputClasses
};