import { InputSubtext, Label, textInputStyle } from "../styles/fields.js";
import styled from "@emotion/styled";
import { Fragment } from "react";
import { jsx, jsxs } from "@emotion/react/jsx-runtime";
//#region src/components/TextArea.tsx
const defaultProps = { disabled: false };
function TextArea({ value, onChange, label, error, placeholder, id, hint, disabled = defaultProps.disabled, minHeight, readOnly = false, resize = "none" }) {
	return /* @__PURE__ */ jsxs(Fragment, { children: [
		label && /* @__PURE__ */ jsx(Label, { children: label }),
		/* @__PURE__ */ jsx(StyledTextArea, {
			id,
			value,
			minHeight,
			resize,
			onChange: (event) => {
				onChange(event.target.value, event);
			},
			disabled,
			hasError: Boolean(error),
			placeholder,
			readOnly
		}),
		/* @__PURE__ */ jsx(InputSubtext, { text: error || hint })
	] });
}
const StyledTextArea = styled.textarea`
  ${textInputStyle}
  resize: ${({ resize }) => resize || "none"};
  min-height: ${({ minHeight }) => typeof minHeight === "number" ? `${minHeight}px` : "initial"};
`;
//#endregion
export { TextArea };
