adwaita-web/dist/components/TextArea.js

A GTK inspired toolkit designed to build awesome web apps

import cx from "clsx";
import React, { useRef } from "react";
import { useForceUpdate } from "../utils/useForceUpdates";
const TextArea = React.forwardRef(({
  className,
  size = "medium",
  placeholder,
  flat,
  disabled: disabledValue,
  error,
  warning,
  progress,
  onChange,
  ...rest
}, ref) => {
  const disabled = disabledValue;
  const forceUpdate = useForceUpdate();
  const inputRef = useRef(null);
  const isControlled = typeof rest.value === "string";
  const value = isControlled ? rest.value : inputRef.current?.value || rest.defaultValue || "";
  const inputClassName = cx("Input TextArea", size, {
    flat,
    disabled,
    error,
    warning,
    progress: progress !== void 0
  }) + " " + cx(className);
  const onTextAreaChange = (ev) => {
    if (!isControlled)
      forceUpdate();
    onChange && onChange(ev.target.value, ev);
  };
  const onClickContainer = (ev) => {
    if (ev.target !== inputRef.current && inputRef.current)
      inputRef.current.focus();
  };
  return /* @__PURE__ */ React.createElement("div", {
    className: inputClassName,
    ref,
    onClick: onClickContainer
  }, /* @__PURE__ */ React.createElement("textarea", {
    placeholder,
    disabled,
    className: cx("Input__area", { empty: !value }),
    ref: inputRef,
    onChange: onTextAreaChange,
    ...rest
  }));
});
export {
  TextArea
};