92 lines
2.1 KiB
Markdown
92 lines
2.1 KiB
Markdown
|
|
# POP 개발 계획
|
||
|
|
|
||
|
|
---
|
||
|
|
|
||
|
|
## 오늘 목표 (2026-02-04)
|
||
|
|
|
||
|
|
**POP 화면을 만들 수 있는 환경 완성**
|
||
|
|
|
||
|
|
### 필요한 것
|
||
|
|
|
||
|
|
1. **v4 타입 정의** - 완료
|
||
|
|
2. **v4 렌더러** - Flexbox로 화면에 표시
|
||
|
|
3. **기본 컴포넌트** - 실제 배치할 요소들
|
||
|
|
4. **디자이너 UI 연결** - v4 모드로 설계 가능
|
||
|
|
|
||
|
|
### 작업 순서
|
||
|
|
|
||
|
|
```
|
||
|
|
[v4 타입] → [렌더러] → [컴포넌트] → [디자이너 연결]
|
||
|
|
완료 진행 대기 대기
|
||
|
|
```
|
||
|
|
|
||
|
|
---
|
||
|
|
|
||
|
|
## 현재 진행
|
||
|
|
|
||
|
|
### v4 타입 정의 (완료)
|
||
|
|
|
||
|
|
- [x] `PopLayoutDataV4` - 단일 소스 레이아웃
|
||
|
|
- [x] `PopContainerV4` - 스택 컨테이너
|
||
|
|
- [x] `PopSizeConstraintV4` - 크기 규칙 (fixed/fill/hug)
|
||
|
|
- [x] `PopResponsiveRuleV4` - 반응형 규칙
|
||
|
|
- [x] `createEmptyPopLayoutV4()` - 생성 함수
|
||
|
|
- [x] `isV4Layout()` - 타입 가드
|
||
|
|
|
||
|
|
### v4 렌더러 (진행)
|
||
|
|
|
||
|
|
- [ ] `PopFlexRenderer` - Flexbox 기반 렌더링
|
||
|
|
- [ ] 컨테이너 재귀 렌더링
|
||
|
|
- [ ] 반응형 규칙 적용 (breakpoint)
|
||
|
|
- [ ] 컴포넌트 숨김 처리 (hideBelow)
|
||
|
|
|
||
|
|
### 기본 컴포넌트 (대기)
|
||
|
|
|
||
|
|
- [ ] `PopButton` - 터치 버튼
|
||
|
|
- [ ] `PopInput` - 텍스트 입력
|
||
|
|
- [ ] `PopLabel` - 텍스트 표시
|
||
|
|
|
||
|
|
---
|
||
|
|
|
||
|
|
## v3 vs v4 비교
|
||
|
|
|
||
|
|
| | v3 (기존) | v4 (새로운) |
|
||
|
|
|---|---|---|
|
||
|
|
| 설계 | 4모드 각각 | 1번만 |
|
||
|
|
| 데이터 | col, row 위치 | 규칙 (fill/fixed/hug) |
|
||
|
|
| 렌더링 | CSS Grid | Flexbox |
|
||
|
|
| 반응형 | 수동 | 자동 + 규칙 |
|
||
|
|
|
||
|
|
---
|
||
|
|
|
||
|
|
## 컴포넌트 로드맵
|
||
|
|
|
||
|
|
### Tier 1: Primitive (기본)
|
||
|
|
|
||
|
|
| 컴포넌트 | 용도 | 상태 |
|
||
|
|
|----------|------|------|
|
||
|
|
| PopButton | 터치 버튼 | 대기 |
|
||
|
|
| PopInput | 텍스트 입력 | 대기 |
|
||
|
|
| PopLabel | 텍스트 표시 | 대기 |
|
||
|
|
| PopBadge | 상태 배지 | 계획 |
|
||
|
|
|
||
|
|
### Tier 2: Compound (조합)
|
||
|
|
|
||
|
|
| 컴포넌트 | 용도 | 상태 |
|
||
|
|
|----------|------|------|
|
||
|
|
| PopFormField | 라벨 + 입력 | 계획 |
|
||
|
|
| PopCard | 카드 컨테이너 | 계획 |
|
||
|
|
| PopListItem | 목록 항목 | 계획 |
|
||
|
|
|
||
|
|
### Tier 3: Complex (복합)
|
||
|
|
|
||
|
|
| 컴포넌트 | 용도 | 상태 |
|
||
|
|
|----------|------|------|
|
||
|
|
| PopScanner | 바코드/QR 스캔 | 계획 |
|
||
|
|
| PopNumpad | 숫자 키패드 | 계획 |
|
||
|
|
| PopDataList | 페이징 목록 | 계획 |
|
||
|
|
|
||
|
|
---
|
||
|
|
|
||
|
|
*최종 업데이트: 2026-02-04*
|