파일 첨부

실험composite

파일을 첨부하는 컴포넌트입니다. 끌어다 놓거나 버튼으로 고르고, 올린 파일 목록과 허용 형식·용량을 함께 보여줍니다.

@tissue-ui/layout-react

설치

bash
npm install @tissue-ui/layout-react
tsx
import { FileAttachment } from "@tissue-ui/layout-react";

언제 쓰나

  • 문서·이미지 등 파일을 첨부받을 때.

예제

다중 첨부

파일을 여기에 드래그하거나

허용 형식: .pdf,.docx · 최대 크기: 10MB

  • 설계서.pdf(242.2KB)
단일 첨부 · 오류
multiple 을 빼면 파일 하나만 받습니다. error 로 안내 문구를 띄웁니다.

파일을 여기에 드래그하거나

허용 형식: .png,.jpg · 최대 크기: 2MB

속성

속성타입설명
acceptstring허용할 확장자입니다 (예: .pdf, .hwp).
maxSizestring파일 하나의 최대 크기를 표시합니다 (예: 10MB).
multipleboolean여러 파일을 고를 수 있게 합니다 (기본 꺼짐).
valuenode올린 파일 목록입니다.
onChangenode파일 목록이 바뀔 때 실행됩니다.
disabledboolean첨부를 막습니다.
errorstring오류 메시지입니다.

위 옵션 말고도 className·onClick 같은 일반 HTML 속성을 그대로 넘길 수 있습니다.

상태
defaulterrordisabled
data 속성
data-errordata-disabled
이 페이지의 옵션·상태는 실제 코드 정의에서 그대로 가져온 것입니다. 에이전트는 같은 내용을 llms.txt 로 읽습니다.