127 lines
5.3 KiB
Markdown
127 lines
5.3 KiB
Markdown
# 현재 상태
|
|
|
|
> **마지막 업데이트**: 2026-02-06
|
|
> **담당**: POP 화면 디자이너
|
|
|
|
---
|
|
|
|
## 진행 상태
|
|
|
|
| 단계 | 상태 | 설명 |
|
|
|------|------|------|
|
|
| v5 타입 정의 | 완료 | `pop-layout.ts` |
|
|
| v5 렌더러 | 완료 | `PopRenderer.tsx` |
|
|
| v5 캔버스 | 완료 | `PopCanvas.tsx` |
|
|
| v5 편집 패널 | 완료 | `ComponentEditorPanel.tsx` |
|
|
| v5 유틸리티 | 완료 | `gridUtils.ts` |
|
|
| 레거시 삭제 | 완료 | v1~v4 코드, 데이터 |
|
|
| 문서 정리 | 완료 | popdocs v5 기준 재정비 |
|
|
| 컴포넌트 팔레트 | 완료 | `ComponentPalette.tsx` |
|
|
| 드래그앤드롭 | 완료 | 스케일 보정, DND 상수 통합 |
|
|
| 그리드 가이드 재설계 | 완료 | CSS Grid 기반 통합 |
|
|
| 모드별 오버라이드 | 완료 | 위치/크기 모드별 저장 |
|
|
| 화면 밖 컴포넌트 | 완료 | 오른쪽 패널 배치, 드래그로 복원 |
|
|
| 숨김 기능 | 완료 | 모드별 숨김/숨김해제 |
|
|
| 리사이즈 겹침 검사 | 완료 | 실시간 겹침 방지 |
|
|
| Gap 프리셋 | 완료 | 좁게/보통/넓게 간격 조정 |
|
|
| **자동 줄바꿈** | **완료** | col > maxCol → 맨 아래 배치 |
|
|
| **검토 필요 시스템** | **완료** | 오버라이드 없으면 검토 알림 |
|
|
| **브레이크포인트 재설계** | **완료** | 기기 기반 (479/767/1023px) |
|
|
| **세로 자동 확장** | **완료** | 캔버스 높이 동적 계산 |
|
|
| **그리드 셀 크기 강제 고정** | **완료** | gridTemplateRows로 행 높이 고정, overflow-hidden |
|
|
|
|
---
|
|
|
|
## 다음 작업 (우선순위)
|
|
|
|
1. **실제 컴포넌트 구현** (Phase 4)
|
|
- pop-label, pop-button 등 실제 렌더링
|
|
- 데이터 바인딩 연결
|
|
|
|
2. **워크플로우 연동**
|
|
- 버튼 액션 연결
|
|
- 화면 전환 로직
|
|
|
|
---
|
|
|
|
## 최근 주요 변경 (2026-02-06)
|
|
|
|
### 브레이크포인트 재설계
|
|
| 모드 | 변경 전 | 변경 후 | 근거 |
|
|
|------|--------|--------|------|
|
|
| mobile_portrait | ~599px | ~479px | 스마트폰 세로 |
|
|
| mobile_landscape | 600~839px | 480~767px | 스마트폰 가로 |
|
|
| tablet_portrait | 840~1023px | 768~1023px | iPad Mini 포함 |
|
|
| tablet_landscape | 1024px+ | 동일 | - |
|
|
|
|
### 세로 자동 확장
|
|
| 기능 | 설명 |
|
|
|------|------|
|
|
| 동적 캔버스 높이 | 컴포넌트 배치에 따라 자동 계산 |
|
|
| 최소 높이 | 600px 보장 |
|
|
| 여유 행 | 항상 3행 추가 |
|
|
| 뷰어 스크롤 | 터치 스크롤로 아래 컴포넌트 접근 |
|
|
|
|
### v5.1 자동 줄바꿈 시스템
|
|
| 기능 | 설명 |
|
|
|------|------|
|
|
| 자동 줄바꿈 | col > maxCol인 컴포넌트를 맨 아래에 자동 배치 |
|
|
| 정보 손실 방지 | 모든 컴포넌트가 항상 그리드 안에 표시됨 |
|
|
| 검토 필요 알림 | 오버라이드 없으면 "검토 필요" 패널 표시 |
|
|
| 검토 완료 | 편집하면 오버라이드 저장, 검토 필요에서 제거 |
|
|
|
|
### 기존 기능 유지 (2026-02-05 심야)
|
|
| 기능 | 설명 |
|
|
|------|------|
|
|
| 모드별 재배치 | 4/6/8/12칸 모드별로 컴포넌트 위치/크기 개별 저장 |
|
|
| 자동 레이아웃 고정 | 드래그/리사이즈 시 자동으로 오버라이드 저장 |
|
|
| 원본으로 되돌리기 | 오버라이드 삭제하여 자동 재배치로 복원 |
|
|
| 숨김 기능 | 특정 모드에서 컴포넌트 의도적 숨김 (검토와 별개) |
|
|
|
|
---
|
|
|
|
## 알려진 문제
|
|
|
|
| 문제 | 상태 | 비고 |
|
|
|------|------|------|
|
|
| 타입 이름 불일치 | 해결됨 | V5 접미사 제거 |
|
|
| SVG 격자 좌표 불일치 | 해결됨 | GridGuide 삭제, CSS Grid 통합 |
|
|
| 드래그 좌표 계산 오류 | 해결됨 | 스케일 보정 적용 |
|
|
| DND 타입 상수 불일치 | 해결됨 | constants/dnd.ts로 통합 |
|
|
| 숨김 컴포넌트 드래그 안됨 | 해결됨 | 상태 업데이트 순서 수정 |
|
|
| 그리드 범위 초과 에러 | 해결됨 | 드롭 위치 자동 조정 |
|
|
| Expected drag drop context | 해결됨 | 뷰어 모드에서 일반 div 렌더링 |
|
|
| Gap 프리셋 UI 안 보임 | 해결됨 | 그리드 라벨에 adjustedGap 적용 |
|
|
| 화면 밖 컴포넌트 정보 손실 | 해결됨 | 자동 줄바꿈으로 항상 그리드 안에 배치 |
|
|
| 뷰어 반응형 모드 불일치 | 해결됨 | detectGridMode() 사용으로 일관성 확보 |
|
|
| hiddenComponentIds 중복 정의 | 해결됨 | 중복 useMemo 제거 |
|
|
| 그리드 가이드 셀 크기 불균일 | 해결됨 | gridTemplateRows로 행 높이 강제 고정 |
|
|
| Canvas/Renderer 행 수 불일치 | 해결됨 | 숨김 필터 통일, 여유행 +3 |
|
|
| 디버깅 console.log 잔존 | 해결됨 | reviewComponents 내 삭제 |
|
|
|
|
---
|
|
|
|
## 최근 세션
|
|
|
|
| 날짜 | 요약 | 상세 |
|
|
|------|------|------|
|
|
| 2026-02-06 | 브레이크포인트 재설계, 세로 자동 확장, v5.1 자동 줄바꿈 | [sessions/2026-02-06.md](./sessions/2026-02-06.md) |
|
|
| 2026-02-05 심야 | 반응형 레이아웃, 숨김 기능, 겹침 검사 | [sessions/2026-02-05.md](./sessions/2026-02-05.md) |
|
|
| 2026-02-05 저녁 | v5 통합, 그리드 가이드 재설계 | [sessions/2026-02-05.md](./sessions/2026-02-05.md) |
|
|
|
|
---
|
|
|
|
## 관련 결정
|
|
|
|
| ADR | 제목 | 날짜 |
|
|
|-----|------|------|
|
|
| 006 | v5.1 자동 줄바꿈 + 검토 필요 시스템 | 2026-02-06 |
|
|
| 005 | 브레이크포인트 재설계 (기기 기반) + 세로 자동 확장 | 2026-02-06 |
|
|
| 004 | 그리드 가이드 CSS Grid 통합 | 2026-02-05 |
|
|
| 003 | v5 CSS Grid 채택 | 2026-02-05 |
|
|
| 001 | v4 제약조건 기반 | 2026-02-03 |
|
|
|
|
---
|
|
|
|
*전체 히스토리: [CHANGELOG.md](./CHANGELOG.md)*
|