컴포넌트

Textarea

여러 줄의 텍스트를 입력합니다.

설치

pnpm dlx ply-ui add textarea

공통 설치 설정을 먼저 적용합니다.

사용법

여러 줄의 텍스트를 입력합니다. label로 이름을 연결하고 rows로 표시할 줄 수를 지정합니다. 별도의 size나 variant 속성은 제공하지 않습니다.

비활성

disabled로 입력을 막습니다. 읽기와 복사는 허용하려면 readOnly를 사용합니다.

구현 코드

components/ui/textarea.tsx
textarea.tsx
import type { ComponentProps } from "react";
import { cx } from "../../lib/cx";
import "./textarea.css";

export function Textarea({ className, ...props }: ComponentProps<"textarea">) {
  return (
    <textarea {...props} className={cx("rbx-input rbx-textarea", className)} />
  );
}
components/ui/textarea.css
textarea.css
/* textarea — semantic HTML composition. */
.rbx-textarea {
  min-height: 100px;
  resize: vertical;
}

목차