@@ -15,45 +15,43 @@ Phase 2 이후 모듈/커뮤니티 요청에 따라 점진 확장하기 위한
1515## 상태 기준
1616
1717- ` 미착수 ` - 구현 시작 전
18- - ` 규격 확정 ` - 인터페이스/계약 정의 완료, ` packages/ui ` 실제 구현 미착수
18+ - ` 규격 확정 ` - 인터페이스/계약 정의 완료, ` packages/controls ` 실제 구현 미착수
1919- ` 진행중 ` - 작업 중
20- - ` 완료 ` - ` packages/ui ` 에 실제 컴포넌트 반영 + ` ready: true ` 확인 완료
20+ - ` 완료 ` - ` packages/controls ` 에 실제 컴포넌트 반영 + ` ready: true ` 확인 완료
2121
22- > ** 현재 상태 (2026-04-12 기준):**
23- > P0/P0.5 전 항목은 ` 규격 확정 ` 상태입니다. ` packages/controls/src/components/index.ts ` 에 계약 타입만 선언되어 있으며
24- > 실제 React 컴포넌트는 미구현입니다 (` ready: false ` ).
25- >
26- > ` apps/web ` 각 View에서 인라인으로 사용 중인 스타일/구조가 사실상의 레퍼런스이며,
27- > 2026-04-12 UI/UX 전면 개편으로 확정된 ** 다크 모드 디자인 토큰 시스템** 을 기반으로
28- > ` packages/controls ` 구현을 진행하면 됩니다.
22+ > ** 현재 상태 (2026-04-13 기준):**
23+ > P0/P0.5 전 항목 구현 완료 (` ready: true ` ). ` packages/controls/src/components/ ` 에 React 컴포넌트 반영.
24+ > ` packages/controls/src/styles/controls.css ` 에 라이트/다크 모드 공통 스타일 정의.
25+ > ` global.css ` 토큰도 라이트 모드 기본값 + 다크 모드 오버라이드(` [data-theme="dark"] ` / ` prefers-color-scheme ` ) 구조로 재설계 완료.
26+ > ` apps/web ` Settings에서 테마 선택 시 ` document.documentElement ` 에 ` data-theme ` 적용 및 localStorage 저장 동작.
2927
3028## P0 (Core 필수)
3129
3230| Control | 우선순위 | 1.5 구현상태 | 비고 |
3331| --- | --- | --- | --- |
34- | Button | P0 | 규격 확정 | Primary/Secondary/Danger/Ghost |
35- | Input | P0 | 규격 확정 | text/email/number/password |
36- | Select / ComboBox | P0 | 규격 확정 | single/multi + search |
37- | Checkbox | P0 | 규격 확정 | 단일/그룹 + indeterminate |
38- | Radio | P0 | 규격 확정 | 단일 선택 그룹 |
39- | Switch / Toggle | P0 | 규격 확정 | on/off + keyboard |
40- | Modal / Dialog | P0 | 규격 확정 | confirm/alert/prompt 패턴 |
41- | Form Field Wrapper | P0 | 규격 확정 | label/help/error/required |
42- | Alert / Inline Message | P0 | 규격 확정 | success/warning/error/info |
43- | Progress | P0 | 규격 확정 | linear + step progress |
32+ | Button | P0 | 완료 | Primary/Secondary/Danger/Ghost, size, loading |
33+ | Input | P0 | 완료 | text/email/number/password, error, helpText |
34+ | Select / ComboBox | P0 | 완료 | single select + placeholder, error |
35+ | Checkbox | P0 | 완료 | 단일/그룹 + indeterminate |
36+ | Radio | P0 | 완료 | RadioGroup |
37+ | Switch / Toggle | P0 | 완료 | on/off + keyboard |
38+ | Modal / Dialog | P0 | 완료 | size(sm/md/lg), ESC 닫기, backdrop 클릭 닫기 |
39+ | Form Field Wrapper | P0 | 완료 | label/help/error/required |
40+ | Alert / Inline Message | P0 | 완료 | success/warning/error/info, onClose |
41+ | Progress | P0 | 완료 | linear + StepProgress |
4442
4543## P0.5 (핵심 흐름 반복 사용)
4644
4745| Control | 우선순위 | 1.5 구현상태 | 비고 |
4846| --- | --- | --- | --- |
49- | Textarea | P0.5 | 규격 확정 | multi-line input |
50- | Password Input | P0.5 | 규격 확정 | show/hide + strength hint |
51- | OTP / PIN Input | P0.5 | 규격 확정 | 4~ 6자리 step-up 인증 |
52- | Search Input | P0.5 | 규격 확정 | debounce/ clear |
53- | Spinner / Loader | P0.5 | 규격 확정 | blocking/non-blocking 로딩 |
54- | Toast / Notification | P0.5 | 규격 확정 | 전역 피드백 메시지 |
55- | Empty State Block | P0.5 | 규격 확정 | CTA 포함 빈 상태 |
56- | Skeleton Loader | P0.5 | 규격 확정 | list/card/form skeleton |
47+ | Textarea | P0.5 | 완료 | multi-line, error, helpText |
48+ | Password Input | P0.5 | 완료 | show/hide + strength hint |
49+ | OTP / PIN Input | P0.5 | 완료 | 4~ 6자리, paste 지원, keyboard 이동 |
50+ | Search Input | P0.5 | 완료 | debounce, clear 버튼 |
51+ | Spinner / Loader | P0.5 | 완료 | blocking overlay / inline |
52+ | Toast / Notification | P0.5 | 완료 | ToastProvider + useToast hook |
53+ | Empty State Block | P0.5 | 완료 | icon, title, description, CTA action |
54+ | Skeleton Loader | P0.5 | 완료 | text(lines) / circular / rect |
5755
5856## P1 (자주 쓰이지만 일부 우선 구현)
5957
0 commit comments