49 lines
2.6 KiB
Markdown
49 lines
2.6 KiB
Markdown
# Field / Form Field
|
||
|
||
**보류 — 컴포넌트를 만들지 않았다.** 현재 HM 구현의 기준 문서. 공통 원칙은 `docs/guidelines/프로젝트-지침.md`(§6.7), 이 문서는 보류 이유와 소비 조합 기준만 기록한다.
|
||
|
||
## 1. 상태
|
||
|
||
| 항목 | 내용 |
|
||
|---|---|
|
||
| 구현 상태 | **보류** (코드·Story 없음) |
|
||
| 기준일 | 2026-10-02 |
|
||
| 기반 | 해당 없음 |
|
||
| 대표 Story | 없음 |
|
||
|
||
## 2. 적용 근거 (보류 이유)
|
||
|
||
- 외부 ui_viz Reference (ZIP 미포함) `docs/components/field-semantics.md`: "COMMON SEMANTIC RELATIONSHIP / NON-GEOMETRY-OWNER … **새 Field Component/API를 정의하지 않는다.**" 높이·gap·inset·색·text role·state paint를 공통 Field에 넣지 않으며 DOM/ARIA 연결도 "공통 Field 구현을 요구하지 않는다".
|
||
- Field 관계(Label → Control → Message)는 컴포넌트별 owner가 소유한다: Input §5·§13·§15·§17.1, Textarea §1·§3·§4, Select.
|
||
- `프로젝트-지침.md` §6.7: Field/Label 컴포넌트 도입은 별도 결정이며 Input/Textarea/Select에 Field wrapper를 다시 넣지 않는다.
|
||
- Checkbox Group의 Label/Heading, error slot 계층, helper/error 우선순위는 ui_viz Pattern §4–5에서 `TBD`다.
|
||
- 근거 없이 Form 시스템을 설계하지 않는다.
|
||
|
||
## 3~10. 해당 없음
|
||
|
||
구현이 없으므로 기본/상태 규격, API, Token, 유지·변경 항목, Storybook, 사용자 결정은 없다.
|
||
|
||
## 11. 소비 조합 기준 (구현이 아니라 기록)
|
||
|
||
현재 Input/Textarea Story가 쓰는 조합이며 ui_viz 값이다.
|
||
|
||
| 항목 | 값 | 출처 |
|
||
|---|---|---|
|
||
| 순서 | Label → Control → Helper/Error | input.md §5, textarea.md §1 |
|
||
| Label | `<Label>` 컴포넌트(14/20/500, `fg.secondary`) | `docs/components/label.md` |
|
||
| Field gap | 8px (`input.field.gap`, `OWNER_CONFIRMED_REVISION`) — `space.*`로 승격하지 않음 | input.md §8 |
|
||
| Helper | 12 / 18 / 400, `fg.secondary` | input.md §9 |
|
||
| Error | 11 / 18 / 400, `#D32F2F` + `aria-invalid` + `aria-describedby`, 색 단독 전달 금지 | input.md §9, §15 |
|
||
| Required | 별표 `#D32F2F`, `aria-hidden`; 의미는 native `required` | input.md, TEXTAREA-07 |
|
||
| 라벨 위치 | 등록·수정 폼은 상단(gap 8), PC 조회·필터는 좌측 라벨(라벨↔입력 12, 묶음 사이 24) | input.md §17.1 |
|
||
|
||
보류 해제 조건: ui_viz가 Field를 Component/Pattern으로 확정하거나 사용자가 별도 결정으로 도입을 지시할 때. 이 경우에도 Input/Textarea/Select 내부에 구조를 넣지 않고 composition 컴포넌트로 추가한다.
|
||
|
||
## 12. 관련 파일
|
||
|
||
없음 (`docs/components/label.md`, `input.md`, `textarea.md` 참조).
|
||
|
||
## 13. 검증 상태
|
||
|
||
해당 없음.
|