[Feature] 이미지 삽입 기능

[herokwon]

⭐ 기능 / 아이디어

Lexical 프레임워크 기반 텍스트 편집기에 이미지 삽입 기능을 추가합니다.

• 삽입 버튼 : 물리 버튼을 통한 이미지 삽입 지원
• 드래그 앤 드롭 : 드래그 앤 드롭 기능을 통한 이미지 삽입 지원

💡 세부 사항

요소 타입 :

• 기본 UI 요소 (Button, Input 등)
• 레이아웃 요소 (Grid, Container 등)
• 복합 요소 (Modal, Dropdown 등)
• 유틸리티/훅
• 디자인 토큰/테마 향상
• 문서 개선
• CI/CD

요구 사항 :

• 접근성 준수 (WCAG)
• 모바일 반응형
• 다크모드 지원
• TypeScript 정의
• Storybook 스토리

사용 예시 :

1. 툴바에서 "이미지 삽입" 버튼 클릭 또는 이미지 파일을 드래그 앤 드롭
2. 현재 블록 아래에 이미지 삽입

🎨 디자인 참조

이미지 삽입 예시:
┌─────────────────────────────────────────────┐
│ Insert Image ▼  [From URL] [From Device]    │ ← 파서 툴바 버튼들
├─────────────────────────────────────────────┤
│ URL: https://example.com/image.jpg         │ ← URL 입력 필드
├─────────────────────────────────────────────┤
│ Preview:                                   │
│ ┌────────────────────────────────────────┐ │
│ │                                      │ │ │ ← 미리보기 썸네일 영역
│ │           400 × 300 px               │ │ │
│ └────────────────────────────────────────┘ │
├─────────────────────────────────────────────┤
│ Alt: [Describe this image...]            │ ← Alt 설명 입력
│ Caption: [Add a caption...]             │
├─────────────────────────────────────────────┤
│ [Cancel]                                 [Insert] │ ← 하단 액션 버튼
└─────────────────────────────────────────────┘

💬 참고 사항 (스크린샷, URL 등)

• Lexical Playground