import { Dispatch, ReactNode, SetStateAction } from "react";
import { BaseInput } from "./utils/baseComponents.tsx";

type TextInputProps = {
  isRequired?: boolean;
  label?: string;
  endContent?: ReactNode; // such as units (as text element e.g. <span>)
  isClearable?: boolean;
  value: string;
  onValueChange?: Dispatch<SetStateAction<string>>;
  isInvalid?: boolean;
  errorMessage?: string;
  isDisabled?: boolean;
};

const TextInput = ({
  isRequired = false,
  label = "",
  endContent,
  isClearable = false,
  value,
  onValueChange,
  isInvalid = false,
  errorMessage = "",
  isDisabled = false,
}: TextInputProps) => {
  return (
    <BaseInput
      isRequired={isRequired}
      label={label}
      endContent={endContent}
      placeholder=" "
      isClearable={isClearable}
      value={value}
      onValueChange={onValueChange}
      isInvalid={isInvalid}
      errorMessage={errorMessage}
      isDisabled={isDisabled}
    />
  );
};

export default TextInput;