726f6ac395
모드별(4/6/8/12칸) 컴포넌트 위치/크기 오버라이드 저장 화면 밖 컴포넌트 오른쪽 패널 표시 및 드래그 재배치 컴포넌트 숨김 기능 (드래그/H키/클릭, 드래그로 해제) 리사이즈 겹침 검사 추가 드롭 위치 그리드 범위 초과 시 자동 조정 숨김 컴포넌트 드래그 안됨 버그 수정 (상태 업데이트 통합) |
||
|---|---|---|
| .. | ||
| archive | ||
| decisions | ||
| sessions | ||
| ARCHITECTURE.md | ||
| CHANGELOG.md | ||
| FILES.md | ||
| GRID_CODING_PLAN.md | ||
| GRID_SYSTEM_DESIGN.md | ||
| GRID_SYSTEM_PLAN.md | ||
| INDEX.md | ||
| PLAN.md | ||
| PROBLEMS.md | ||
| README.md | ||
| SAVE_RULES.md | ||
| SPEC.md | ||
| STATUS.md | ||
| components-spec.md | ||
README.md
POP 화면 시스템
AI 에이전트 시작점: 이 파일 → STATUS.md 순서로 읽으세요. 저장 요청 시: SAVE_RULES.md 참조
현재 상태
| 항목 | 값 |
|---|---|
| 버전 | v5 (CSS Grid 기반) |
| 상태 | 반응형 레이아웃 + 숨김 기능 완료 |
| 다음 | Phase 4 (실제 컴포넌트 구현) |
마지막 업데이트: 2026-02-05 심야
마지막 대화 요약
반응형 레이아웃 시스템 완성:
- 모드별 컴포넌트 재배치 (오버라이드) 시스템 구현
- 화면 밖 컴포넌트 오른쪽 패널 배치 기능
- 컴포넌트 숨김/숨김해제 기능 (모드별)
- 리사이즈 겹침 검사 추가
- H키 단축키로 숨김 처리
다음: Phase 4 (실제 컴포넌트 구현)
빠른 경로
| 알고 싶은 것 | 문서 |
|---|---|
| 지금 뭐 해야 해? | STATUS.md |
| 저장/조회 규칙 | SAVE_RULES.md |
| 왜 v5로 바꿨어? | decisions/003-v5-grid-system.md |
| 그리드 가이드 설계 | decisions/004-grid-guide-integration.md |
| 이전 문제 해결 | PROBLEMS.md |
| 코드 어디 있어? | FILES.md |
| 기능별 색인 | INDEX.md |
| 변경 히스토리 | CHANGELOG.md |
핵심 파일
| 파일 | 역할 | 경로 |
|---|---|---|
| 타입 정의 | v5 레이아웃 타입 | frontend/components/pop/designer/types/pop-layout.ts |
| 캔버스 | 그리드 캔버스 + DnD + 라벨 | frontend/components/pop/designer/PopCanvas.tsx |
| 렌더러 | CSS Grid 렌더링 + 격자 셀 | frontend/components/pop/designer/renderers/PopRenderer.tsx |
| 디자이너 | 메인 컴포넌트 | frontend/components/pop/designer/PopDesigner.tsx |
| 팔레트 | 컴포넌트 목록 | frontend/components/pop/designer/panels/ComponentPalette.tsx |
문서 구조
[Layer 1: 먼저 읽기]
README.md (지금 여기) → STATUS.md
[Layer 2: 필요시 읽기]
CHANGELOG, PROBLEMS, INDEX, FILES, ARCHITECTURE, SPEC, PLAN
[Layer 3: 심화]
decisions/, sessions/, archive/
컨텍스트 효율화: 모든 문서를 읽지 마세요. 필요한 것만 단계적으로.
POP이란?
Point of Production - 현장 작업자용 모바일/태블릿 화면 시스템
| 용도 | 경로 |
|---|---|
| 뷰어 | /pop/screens/{screenId} |
| 관리 | /admin/screenMng/popScreenMngList |
| API | /api/screen-management/layout-pop/:screenId |
v5 그리드 시스템 (현재)
| 모드 | 화면 너비 | 칸 수 |
|---|---|---|
| mobile_portrait | ~599px | 4칸 |
| mobile_landscape | 600~839px | 6칸 |
| tablet_portrait | 840~1023px | 8칸 |
| tablet_landscape | 1024px~ | 12칸 |
핵심: 컴포넌트를 칸 단위로 배치 (col, row, colSpan, rowSpan)
그리드 가이드: CSS Grid 기반 격자 셀 + 행/열 라벨 (ON/OFF 토글)
상세: SPEC.md | 히스토리: CHANGELOG.md