전체 기능 · ref API
모든 기능 활성 + ref API 시연 (getHTML / setHTML / insertHTML / focus).
API
EditorProps
| Property | Type | 기본값 | 설명 |
|---|---|---|---|
| value | string | - | 제어 컴포넌트용 HTML 문자열 |
| defaultValue | string | '' | 비제어 초기 HTML |
| onChange | (html: string) => void | - | 내용 변경 콜백 |
| placeholder | string | '내용을 입력하세요…' | 빈 상태 안내 문구 |
| readOnly | boolean | false | 읽기 전용 — 편집·툴바 비활성 |
| toolbar | ToolbarConfig | false | 전체 툴바 | 툴바 구성(1D/2D 배열) 또는 숨김 |
| onImageUpload | (file: File) => Promise<string> | base64 | 이미지 업로드 핸들러. 반환 URL을 src로 삽입 |
| minHeight | number | string | 240 | 본문 최소 높이 |
| maxHeight | number | string | - | 본문 최대 높이(초과 시 스크롤) |
| className | string | - | 루트 className |
| contentClassName | string | - | 본문(편집) 영역 className |
| ariaLabel | string | '리치 텍스트 편집기' | 본문 ARIA 라벨 |
EditorHandle
| 메서드 | 반환 | 설명 |
|---|---|---|
| getHTML() | string | 현재 HTML 반환 |
| getText() | string | 마크업 제거한 순수 텍스트 반환 |
| setHTML(html) | void | HTML 설정(새니타이즈 후) + onChange 발생 |
| insertHTML(html) | void | 커서 위치에 HTML 삽입 |
| focus() | void | 본문 영역 포커스 |
| getElement() | HTMLDivElement | null | 내부 contentEditable 노드 |