Deploy Storybook / deploy (push) Successful in 1m12s
- SWHeader (760-1799px): pictures hide one at a time by measured room (치수 아이콘, 선 그림,
글꼴명, 색상 칩, 레이어 상태 아이콘), then the file name narrows 310 -> 96px, then values
ellipsize; re-fit after web fonts load. 가중치/스케일 columns grow for longer values.
- Gauge style B / property window range: Figma controll_bar_new 633:77827 colors, ring and
shadow on the previous size (6px track, 14px thumb).
- Property window: editable text values (e.g. 하이퍼링크) get the editing face like numbers.
- SW Header › Logo: same cases, order and layout as SW Viewer › Logo (ID kept).
- Storybook inner: 80vw from 1920px. Responsive More 1920px rows use the page's usable width
(container sw-story-page) and span 1920px when there is room.
- SW/Popup sidebar: Property Panel only; Custom Content / Multiple Popups tagged verification.
- SW Viewer Settings Popup: 축척 지정 demo popup removed, frame 620px.
- Tests: inventory / simplification sidebar expectations, Popup-only unit select check.
Verified: check:ai-docs PASS, changed test syntax, headless Chrome checks of header compaction,
Responsive 1920 rows (1920 hidden / 2560, 3840 shown), Popup sidebar, Settings Popup.
Not verified: integrated-visual baselines (not updated), full regression, changed tests not run.
Deploy Storybook / deploy (push) Successful in 1m11s
- SWPopup Custom Content and the SW Viewer options panel use SWSlider style B
(appearance="property") only; the A/B comparison, the style select and the
green panel gauge are gone (SWViewerSlider itself is unchanged).
- SW Header / Viewer / Footer Responsive More: the 1920px row shows only when the
content Inner is 1920px or wider (container query); Footer rows fit the page
width without scrollers so ▲ More handles narrow widths.
- Logo pages fit without scrollers; SW Header Logo Slot is "Logo" in the sidebar
with the title "SW Header — 로고" (ID sw-header--logo-slot kept).
- Property Panel (was "Property Panel · 4개 비교"): no Inner scroller, the page
scrolls, 2 × 2 grid with one column below 720px.
- SW Footer drops the "실제 Footer 조합 (동작)" heading; SW Viewer Header page is
titled "SW Viewer Header" with 기본형 and 최소화 · 닫기 버튼 only.
- Browser tests, inventory and README follow these changes; visual baselines are
not updated.
Drop the category kicker from the 83 sidebar Stories (kicker is now optional;
hidden verification Stories keep it) and shorten or remove repeated, obvious
or internal page/section descriptions. Required specs, limits, virtual-data
and undecided-value notices stay. Story IDs, exports, fixtures, shared state
notes and package code are unchanged. Record: docs/reports/storybook-ui-simplification-2026-10-22.md
User-approved design review (2026-10-21):
- SW Header: from 760px up nothing moves into More; the five menus stay with their
titles (titles and values ellipsize), file name shrinks to 96px. Open next to the
logo no longer blocks field shrinking above 760px (760/768 overflow fixed, also for
configured `controls` headers). Dropdown yellow ring inside the button, black seam.
- Property Bar values as read-only red text; property popup "=" labels, read-only
black values, per-entry hover with pointer.
- Home Menu recent files (3 rows, path + name caption, empty preview), Footer + slot
guide off by default, Viewer file list without icons, Storybook widths 1920-760.
- Tests: old More expectations (integrated-improvement, keyboard-dismiss,
footer-popup-viewer-refinement, storybook-cleanup-stage1) moved to the new rule;
functional checks kept.
SW Viewer Header (approved optional props, public export names unchanged at 170):
- SWViewerHeader: logoMenu, documents, activeDocumentId, onDocumentSelect,
onDocumentOpen, documentOpenLabel; measured responsive toggles (full ->
icons -> More) with the SWHeader More / file-list styling.
- SW AI guides, ExampleH, viewer/text-weight/theme-inheritance tests and the
logo-document-menu tests with their QA record.
SW Storybook cleanup (Story IDs and test fixtures kept):
- Sidebar: Overview -> "SW Header" (first), 전체 Footer -> "SW Footer",
Footer/Viewer responsive pages -> "Responsive More", Viewer content-variants
-> "Settings Popup" (merges the settings popup page).
- Hidden by the verification tag (direct URL kept): Header Dropdown,
Document Open, Interactive States, Document Dropdown, Hidden Sub Controls,
Home Menu standalone; Footer tool groups / custom content / parts;
SW/Theme; Viewer menu groups / item states / variable size / settings
panel / Header + Dropdown.
- Removed demo UI: Overview size and callback output (demo data and
selection only with &verification), Home Menu Figma node table and width
demo, Header Responsive More reduced to 1440 / 768 / 390, Popup reopen
button, property-panel comparison captions, Viewer context-menu demo
(&verification only).
- Tests: storybook-inventory records the hidden and renamed Stories;
overview / range-cross-browser / viewer open the demo controls with
&verification; integrated-popup reloads the Story instead of the reopen
button; dropdown-consolidation asserts Dropdown is hidden from the sidebar
and still opens by its direct URL.
Components (new public exports, existing APIs unchanged)
- SWPopupPropertyRow: the property window row (layer / color / line style
pickers, Figma 26:12250 / 26:12170) for SWPopup content. The SWHeader field
dropdowns stay header-only; Popup B and 도면 설정 now use the popup pickers.
- SWSelect: native panel select (28px, 1px #948871, radius 4, #F1ECE1, 12px),
used by Popup 도면 설정 단위 and Viewer 축척 지정 단위 (replaces the HM UI
Select there and the story-only .sw-viewer-story-select CSS).
- SWSlider: appearance "panel" (default, the gauge the popup used) or
"property" (the property window gauge), same value / events. Shares the
property gauge CSS; SWViewerSlider renders SWSlider panel with viewer tokens.
Footer
- --hm-sw-footer-gra-border-orange (Figma gra-border-orange; the aux selected
border token now references it): Model selected / hover, Layout hover and
Layout + hover surfaces; 보조기능 / 명령어 전체보기 hover lights both lines
and an orange ring; category + hover in #FF5C00 (menu-add-hover.svg).
- Model / Layout text stays the Default text (#161410, 12px, 400, no outline)
on hover and on the orange surface: only the surface changes.
- bg_vacant covers the slot row only: the open pocket of a category tab no
longer splits where it crosses the last command (e.g. 수정 with one command).
Viewer
- Panel title art keeps 308px (max-width: none against host img resets), so
panels under 312px (250 x auto, 300px) paint the title from the left edge.
Storybook
- SW/Footer: 기본 Footer (sw-footer--default) and States (sw-footer--states)
removed; full-footer keeps the live composition only, responsive keeps the
widths (reference / Figma image sections removed, image files kept); the aux
Figma comparison moved to the verification Story figma-variants.
- SW/Popup: unit SWSelect, SWSlider A / B section, popup pickers, Popup B state.
SW package 0.2.0 integrated improvement (Task A, steps 1-8). All new props are
optional; existing SW Stories are pixel-identical to the previous build (28/28).
- Build reproducibility: dist text normalized to LF, dist/build-info.json
(commit, dirty, tool versions, no timestamp), packages/sw/.gitattributes
(eol=lf). LF checkouts give identical dist and tarball.
- SWHeader: documentOpenPlacement ("menu" default | "header": Open right of
the logo in the existing document-button look, reusing onDocumentOpen and
documentOpenLabel, no duplicate Open in the dropdown), leading slot,
hiddenControls sub-items documentNew / documentOpen / layerFreeze /
layerLock. Open moves into More on measured overflow (with hysteresis).
- showNew / showOpen (SWHeaderDocumentTitle), showFreeze / showLock (layer
menu, field, property window list).
- SWToolButton (text / pill / document) and SWToolGroup (radio selection),
reusing the existing toggle, pill and file-name looks.
- SWPopup / SWPopupSection / SWPopupRow on the shared property window frame;
SWHeaderPropertyPanel gains children, title, autoFocus and optional
selection / properties / groups. Escape stack for several popups.
- Field dropdowns inside a popup use the shared fixed overlay
(useSWFixedDropdownPosition), so the scrolling body no longer clips them.
- AI guide, examples E/F, README, Storybook (SW/Header/Options, SW/Tool,
SW/Popup) and verification record docs/sw/sw-integrated-improvement-2026-10-19.md.
- Regression scripts rescoped for the intended changes (unused-removal 81/81,
overview 52/54 with the two pre-existing historical assertions).
Known limitation (unresolved): tools / leading content (incl. SWToolGroup)
does not move into More. With a wide tool bar the configured fields shrink
instead; in Example F the document name and layer field reach 0px at 390px.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
shkim4
