style(storybook): unify form element story layouts
- Button: Sizes | Variants side by side, States as Brand / Standard Solid / Standard Outline matrices (3 / 2 / 1 columns), 8px button gap; the Interact row stays only in the verification "Brand States" Story - Input / Textarea / Select: state name in the field Label slot, repeated field Label and group titles removed, aria-label keeps field meaning with the visible state name; Select uses the Input field grid - Combobox / Date Picker: Sizes / States use the same state-name Label and Input grid; Usage unchanged - Toggle: top Variants / States in 2 columns, 8px toggle gap, 단독 toggle keeps its own width - Component code, props, tokens and verification Stories unchanged; component docs updated to match
This commit is contained in:
1 parent
e8c16f5292
commit
a7b56ff23e
14 files changed
+351
-187
No files matched your search
@@ -103,6 +103,7 @@ Popover: Portal, collision, Escape, 바깥 클릭 닫힘, trigger focus 복귀.
|
||||
## 10. Storybook
|
||||
|
||||
- 대표 Story `All`("Combobox"): Overview(Placeholder + search, Remix는 disabled option), Sizes(Medium, 같은 size의 Select / Combobox 비교), States(Selected(controlled), Disabled), Usage(Long option). Label은 Story 조합이다. 대표 화면은 선택값 표시(`value = …`)를 숨기며 숨김 `Controlled`는 유지한다.
|
||||
- 2026-11-12 폼 요소 전시 통일(Input·Select 기준): Sizes(`Default`, `Medium`)·States(`Selected`, `Disabled`)는 상태명을 콤보박스 Label 자리에 한 번만 표시하고 반복되던 H3 상태명·필드 Label(`프레임워크`, `선택됨 (controlled)`, `비활성`)을 없앴다. 접근성 이름은 Trigger의 `aria-label="프레임워크 (상태명)"`(보이는 상태명 포함, 팝업·목록 이름에도 쓰임). 두 섹션은 Input과 같은 그리드(최대 1120px, 최대 3열·열 최소 240px, 좁으면 2→1열, 공통 들여쓰기)를 쓴다. Usage(Long option, Select / Combobox 비교)와 verification Story, Combobox·토큰·API는 변경 없다.
|
||||
- verification: `Empty`, `Controlled`, `Long Option`.
|
||||
|
||||
## 11. 사용자 확정 결정 / 보류
|
||||
|
||||
Reference in new issue
Block a user