diff --git a/PROJECT_STRUCTURE.md b/PROJECT_STRUCTURE.md
index 52e5d0d..6dda8c8 100644
--- a/PROJECT_STRUCTURE.md
+++ b/PROJECT_STRUCTURE.md
@@ -1,10 +1,14 @@
# 라온누리 - 프로젝트 구조
-> 최종 업데이트: 2025-11-10 (5단계 보안 레벨 시스템, User 타입 최소화)
+> 최종 업데이트: 2025-11-10 (다중 글조각 관리, 테마 레시피 추가)
초등학생을 위한 창작 글쓰기 교육 플랫폼
**주요 업데이트** (2025-11-10):
+- 📝 다중 글조각 관리 시스템 (DraftManager, SavedDraftsDialog)
+- 💾 강화된 자동 저장 (2초 debounce, 저장 상태 표시)
+- 🎨 테마 슬롯 레시피 추가 (Dialog, Select 자동 배경색)
+- 📋 TopicSelector 그룹핑 (자유/팀/개인 주제 구분, 팀 이름 표시)
- 🔐 5단계 보안 레벨 시스템 (팀별 보안 정책 선택)
- 📦 User 타입 분리 (FirestoreUser / User)
- 🏷️ 닉네임 저장 위치 변경 (team.members[uid].nickname)
@@ -20,7 +24,7 @@
|-------|------|------|---------|
| **랜딩 페이지** | `/` | 서비스 소개 및 홍보 (비로그인 전용) | Hero, Features, How It Works, CTA, Footer
로그인 시 `/home`으로 자동 리다이렉트 |
| **유저 홈** | `/home` | 인증된 사용자 대시보드 | 환영 메시지, 빠른 시작 대시보드, 최근 활동
비로그인 시 `/`로 자동 리다이렉트
정식 계정은 "내 팀" 카드 추가 표시 |
-| **글쓰기** | `/write` | Tiptap 기반 순수 텍스트 에디터 + 주제 선택 | 주제 선택 (자유 주제/개인 주제)
제목 입력 (Editable), 순수 텍스트 에디터 (포맷팅 없음)
실시간 글자수/단어수, 자동 저장 (LocalStorage 3초마다)
템플릿 미리채우기 (제목/내용), Firestore 저장
비로그인도 접근 가능 (저장 시 로그인 유도) |
+| **글쓰기** | `/write` | Tiptap 기반 순수 텍스트 에디터 + 주제 선택 | 주제 선택 (자유 주제/개인 주제/팀 주제)
제목 입력 (Editable), 순수 텍스트 에디터 (포맷팅 없음)
🆕 **다중 글조각 관리** (최대 10개), "새 글쓰기" / "저장된 글조각" 버튼
🆕 **강화된 자동 저장** (2초 debounce, 저장 상태 표시: 저장 중/저장됨)
템플릿 미리채우기 (제목/내용), Firestore 저장
비로그인도 접근 가능 (저장 시 로그인 유도) |
| **테스트** | `/test` | 팀 코드 시스템 테스트 페이지 | 팀 코드 생성/검증 테스트
팀/학생 생성 테스트
학생 로그인 테스트
authStore 상태 확인 |
| **팀 목록** | `/team` | 내가 만든 팀 목록 (정식 계정 전용) | 팀 카드 그리드, 팀 정보 (코드, 멤버 수, 보안 설정)
"새 팀 만들기" 버튼 |
| **팀 생성** | `/team/create` | 새 팀 만들기 (정식 계정 전용) | 팀 이름 입력, 팀 코드 자동 생성
🆕 **5단계 보안 레벨 선택** (RadioCard, 애니메이션)
🆕 **명단 관리 (Level 2/4)**: TagsInput으로 Enter/쉼표 입력
생성 후 `/team/[teamId]`로 이동 |
@@ -122,18 +126,24 @@
| 컴포넌트 | 파일명 | 설명 | 상태 |
|---------|--------|------|------|
| **WritingEditor** | `WritingEditor.tsx` | Tiptap 기반 순수 텍스트 에디터 | ✅ 완료 |
-| **TopicSelector** | `TopicSelector.tsx` | 주제 선택 드롭다운, 팀/개인 주제 배지 표시 | ✅ 완료 |
+| **TopicSelector** | `TopicSelector.tsx` | 🆕 주제 선택 드롭다운 (그룹핑, 팀 이름 표시) | ✅ 완료 |
| **CreateTopicDialog** | `CreateTopicDialog.tsx` | 개인 주제 생성 다이얼로그 (태그 입력 UI) | ✅ 완료 |
| **CreateTeamTopicDialog** | `CreateTeamTopicDialog.tsx` | 팀 주제 생성 다이얼로그 (템플릿 지원) | ✅ 완료 |
+| **SavedDraftsDialog** | `SavedDraftsDialog.tsx` | 🆕 저장된 글조각 목록 다이얼로그 (불러오기/삭제) | ✅ 완료 |
**주요 기능**:
- ✅ 순수 텍스트 입력 (포맷팅 없음)
- ✅ 초등학생 친화적 단순 인터페이스
- ✅ 실시간 글자 수/단어 수 카운터
-- ✅ 자동 저장 (LocalStorage)
+- ✅ 🆕 **다중 글조각 관리** (최대 10개, FIFO 방식)
+- ✅ 🆕 **강화된 자동 저장** (2초 debounce, localStorage)
+- ✅ 🆕 **저장 상태 표시** (저장 중 → 저장됨 → 시간 표시)
+- ✅ 🆕 "새 글쓰기" 버튼 (현재 글 초기화)
+- ✅ 🆕 "저장된 글조각" Dialog (목록, 미리보기, 불러오기/삭제)
+- ✅ 🆕 **주제 선택 그룹핑** (자유/팀/개인 주제 구분, ItemGroup 사용)
+- ✅ 🆕 **팀 주제에 팀 이름 표시** (어느 팀의 주제인지 명확히 표시)
- ✅ 주제 선택 (자유 주제/팀 주제/개인 주제)
- ✅ 주제 정보 표시 (설명, 키워드, 예시 질문)
-- ✅ 팀/개인 주제 배지 표시 (teal/pink)
- ✅ 템플릿 미리채우기 (제목/내용)
- ✅ 개인 주제 생성 (카테고리, 난이도, 키워드, 템플릿 설정)
- ✅ 팀 주제 생성 (팀 소유자 전용, 팀 관리 페이지)
@@ -182,6 +192,7 @@
| **ManagerBase** | `ManagerBase.ts` | 공통 기능 (authenticatedFetch, API 호출, 캐싱) | ✅ 완료 |
| **TeamManager** | `TeamManager.ts` | 팀 관련 API 호출 (생성, 조회, 수정, 삭제, 멤버 관리) | ✅ 완료 |
| **UserManager** | `UserManager.ts` | 사용자 관련 API 호출 (생성, 조회, 수정, 닉네임 관리) **[NEW]** | ✅ 완료 |
+| **DraftManager** | `DraftManager.ts` | 🆕 글조각 관리 (localStorage 기반, 최대 10개, CRUD) | ✅ 완료 |
| ~~**StudentManager**~~ | ~~`StudentManager.ts`~~ | ~~학생 관련 API 호출~~ | ⚠️ Deprecated (UserManager로 대체) |
| **WritingManager** | `WritingManager.ts` | 글쓰기 관련 비즈니스 로직 (CRUD, 통계) | ✅ 완료 |
| **TopicManager** | `TopicManager.ts` | 주제 관련 비즈니스 로직 (CRUD, 템플릿 처리) | ✅ 완료 |
@@ -222,6 +233,7 @@
|------|--------|------|------|
| **Team 타입** | `team.ts` | 🆕 팀 데이터 모델 (members Map), **TeamSecurityLevel Enum (1-5)** | ✅ 완료 |
| **FirestoreUser 타입** | `firestoreUser.ts` | 🆕 **FirestoreUser** (DB 저장용), **User** (UI용) 분리 | ✅ 완료 |
+| **Draft 타입** | `draft.ts` | 🆕 글조각 데이터 모델 (Draft, DraftListItem) | ✅ 완료 |
| ~~**User 타입**~~ | ~~`user.ts`~~ | ~~사용자 데이터 모델~~ | ⚠️ Deprecated (firestoreUser.ts로 변경) |
| ~~**Student 타입**~~ | ~~`student.ts`~~ | ~~학생 데이터 모델~~ | ⚠️ Deprecated (user.ts로 대체) |
| **Topic 타입** | `topic.ts` | 주제 데이터 모델, TopicCategory/Difficulty/OwnerType Enum, 팀 주제 유틸 함수 | ✅ 완료 |
diff --git a/ROADMAP.md b/ROADMAP.md
index f0cc323..f8aa974 100644
--- a/ROADMAP.md
+++ b/ROADMAP.md
@@ -63,6 +63,10 @@
| **API Routes 구현** | **보안 레벨 변경, 명단 관리 API (RESTful 원칙), POST/DELETE 메서드 구분** | **2025-11-10** |
| **lib/server/team 확장** | **updateTeamSecurityLevel, add/removeAllowedName/Email, 자동 명단 생성** | **2025-11-10** |
| **react-icons 전환** | **이모티콘 → react-icons/lu로 전환 (LuGlobe, LuClipboardList 등)** | **2025-11-10** |
+| **다중 글조각 관리** | **DraftManager (localStorage, 최대 10개), SavedDraftsDialog, 2초 debounce 자동 저장, 저장 상태 표시** | **2025-11-10** |
+| **테마 슬롯 레시피** | **Dialog, Select slot recipe 추가 (자동 배경색, border, shadow)** | **2025-11-10** |
+| **TopicSelector 그룹핑** | **ItemGroup으로 자유/팀/개인 주제 구분, 팀 주제에 팀 이름 표시, Separator 추가** | **2025-11-10** |
+| **TopicOption 확장** | **teamName 필드 추가, TopicManager에서 팀 정보 조회 (동적 import)** | **2025-11-10** |
### 🚧 진행 중
diff --git a/TECH_STACK.md b/TECH_STACK.md
index 70e21ce..ed39d30 100644
--- a/TECH_STACK.md
+++ b/TECH_STACK.md
@@ -243,6 +243,15 @@ const firebaseConfig = {
- **브랜드 컬러**: 핑크(#FF6B9D), 오렌지(#FFA07A), 청록(#4ECDC4)
- **다크모드**: 시맨틱 토큰으로 자동 전환
- **반응형 타이포그래피**: hero, heading, body 등 텍스트 스타일 정의
+- **🆕 슬롯 레시피** (2025-11-10):
+ - `menu`: 커스텀 메뉴 스타일 (애니메이션, hover 효과)
+ - `dialog`: Dialog 자동 배경색, border, shadow
+ - `select`: Select 드롭다운 자동 배경색, hover 효과
+- **시맨틱 토큰**:
+ - `bg`, `fg`, `border`: 전역 배경/전경/테두리 색상
+ - `brand.*`: 브랜드 컬러 시맨틱 토큰
+ - `navbar.*`, `menu.*`: 컴포넌트별 시맨틱 토큰
+ - `landing.*`: 랜딩 페이지 전용 토큰
---