Add nine component tokens declared on the outermost SW scope. Each
defaults to the token or literal it replaces, so the default look and
header theme inheritance are unchanged; setting one changes its
component alone.
- Viewer Header menus (logo menu, header dropdowns, More):
--hm-sw-viewer-header-menu-background / -border-color / -shadow /
-item-hover-background (default: --hm-sw-header-more-*)
- SWHeader K guide: --hm-sw-header-k-guide-border-color
(default var(--hm-sw-property-border)) / -background (#0e3c2e)
- Popup value color: --hm-sw-popup-value-color
(default var(--hm-sw-header-input-color)); the property bar keeps
the header token
- Footer command history scrollbar:
--hm-sw-footer-command-scrollbar-thumb (#574b30) / -track (transparent)
Footer focus ring, side shadow, shared text color and dividers stay
shared. Docs (DESIGN_RULES, AI_USAGE, VIEWER, header design spec) and
theme-inheritance section 1d updated.
- SWProcessHeader appearance="multi": the process base and both end
covers meet the file name and the window area with right angles
(border-radius 0, multi block only). default keeps the Strana top
corners 6 / covers 5; step tabs, arrows, colors and sizes unchanged
- DESIGN_RULES §14 and Step Header spec §9.2 record the multi-only rule
- process-header-states.check.mjs: default 6 / 5 kept, multi 0 (17/17);
build:sw and check:ai-docs pass, Storybook zoom shows square multi ends
- AI_GUIDE stage 5 "Header 전용 스타일의 적용 범위": header-only styles stay
in the header (SW SWHeader / SWProcessHeader / SWViewerHeader, Web GNB /
LNBMobileHeader / DashboardHeader); no header CSS or tokens on body UI,
no global overrides, layout-only joins, package-shared tokens unchanged,
whole-screen use only on explicit request. Synced to the 4 package
copies; referenced from stage 6, SW and Web AI_USAGE §3
- SWProcessHeader: with documentTitle "" the file name keeps #AEDBCC on
hover and a default cursor (root data-document-untitled). The button,
focus and onDocumentClick are kept; a real file name keeps the yellow
hover and pointer. Visual vs. click difference recorded as a UX item
- Step enablement documented as implemented: only an explicit disabled
(step, group, process, header) turns steps off; project / file state
never does; selection is activeStepId + onStepSelect (also for host
previous / next); no activeStepId and empty groups described
- Regression check tests/process-header-states.check.mjs (15/15);
typecheck:sw, build:sw, check:ai-docs pass; public-api keeps its 3
existing failures, none new
- Story page Inner side margin: 16px up to a 480px viewport, linear to 60px at 768px, 60px beyond (no width jump)
- Follow the 60px margins: Responsive 1920 row from a 2040px page (was 2000px); property compare 3 columns from 1125px, 2 columns from 787px (was 1080 / 720)
- SW browser tests: drop the removed --sb-page-max-width override, compare thresholds 787 / 1125
Deploy Storybook / deploy (push) Successful in 1m12s
The Overview selection controls are shown only with &verification since
the 2026-10-21 simplification; overview.browser.mjs already used it, so
the Firefox suite stopped before its popup checks. Now 9/9 PASS.
Deploy Storybook / deploy (push) Successful in 1m16s
- File name: clamp(80px, min(45cqw - 256px, 100cqw - 780px), 360px),
56px below 560px; 1280px and wider unchanged
- Model / Layout tabs narrow (name, then count ellipsized) down to the new
--hm-sw-viewer-tabs-min-width (48px) before anything moves into More;
the measurement counts them at that minimum once every icon step applies
- Switch items get an optional shortLabel shown below 560px (어두운 배경 ->
배경); counts hidden there
- More appears only below about 520px; viewer test and AI guides updated
- Property Panel compare page: from 1080px, none/all stacked in column 1,
circle and expanded side by side (2x2 and 1 column below)
- Overview Stage: the property panel is clamped to the Stage height so the
Stage gets no scrollbar; the panel body scrolls
- Viewer header file name: clamp(140px, calc(45cqw - 256px), 360px) so a
950px header shows no More; 1280px and wider unchanged
Deploy Storybook / deploy (push) Successful in 1m10s
- SW Header: the five field previews hide and return together in one
measured step; from 760 to 1920px the groups from 레이어 to 치수스타일
share the room left before 속성보기, above 1920px they keep the 1920
widths (controls bars and < 760px unchanged)
- SW Viewer Header Model / Layout: long names ellipsize in equal buttons
(minmax(0, 1fr), name counted at --hm-sw-viewer-tab-name-basis) so they
never change the box or the measured steps; green outer outline and its
tokens removed; 378px / 42px, text-shadow and state unchanged
- SWViewerStatus: the label keeps the width of its widest real state text
(idle keeps its icon slot), so a state change never moves the header;
with too little room it ellipsizes after the file name gives way
- Popups: body inset shadow removed, title SVG drop shadow removed, viewer
panel title icons use --hm-sw-viewer-panel-icon-color (#c7bda9)
- Storybook: SW/Viewer › Model / Layout story removed
- AI guide (docs/ai + package copies): design-only changes for every
component, content limits for Submodule consumers (Header excluded),
Submodule usage rules; VIEWER / DESIGN_RULES synced
- viewer.browser.mjs: explicit 1920 / 1440 labels and approved 1280
icon-only expectations
Deploy Storybook / deploy (push) Successful in 1m13s
- Model / Layout tabs follow Figma 7652:40344: gradient faces, gold / green
gradient borders, blurred outline, inner shadow and top gloss, with every
color in its own --hm-sw-viewer-tab(s)-* token (consumer-overridable)
- Box height matches the adjacent field group (42px, from the control height
token); padding 1px 1px 1.5px, button side padding 5px, 1px right margin
for a tabs-only first group; 378px max width, equal buttons and the
measured More steps are unchanged; existing text-shadow kept
- Storybook: SW/Viewer > Model / Layout story (states and token override);
Logo story listed before Responsive More
- AI docs (VIEWER.md, DESIGN_RULES.md) and viewer / text-weight test
expectations updated
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
- SW Viewer layer popup: search + 전체 레이어 fixed, only the list scrolls; the all-layers
control is the SWLayerVisibilityIcon bulb (role="switch"), one light #d2c8b4 line under it.
- Example H and the layer popup AI docs follow the bulb layout (VIEWER, DESIGN_RULES,
COMPONENT_CATALOG, COMPOSITION_PATTERNS, AI_GUIDE sync).
- Popup toggle switch (Figma toggle_btn_new 633:75188 / 633:75902): one sw.css face for the
HM UI Switch in SWPopup and SWViewerSwitch in SWViewerPanel; SW Header switches unchanged.
- SW Footer stories: no inner scrollers, fluid screens; workspace fits the viewport.
- SW Footer category tabs keep their positions when selected (divider slots kept, pocket
edges drawn over the neighbours' padding).
- Storybook .sb-page-inner: 1440px max from 1920px (was 80vw).
- SW Header equal-split change was cancelled; header CSS unchanged.
Verified: check:ai-docs PASS, viewer test 49 PASS (1 FAIL hover face + timeout pre-existing),
footer-design-review 21 PASS, browser checks of switch/footer/inner.
Not verified: footer-popup-viewer-refinement (needs full Storybook build), text-weight/hover
tests, Switch 37x16 AI docs (deferred).
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.
Deploy Storybook / deploy (push) Successful in 1m13s
Home Menu: the recent-files sub panel loses its title / Figma node caption and its
frame fits the open panel (+16px) instead of a fixed 860px; the Integration
(property window / SWPopup / Escape) section leaves the page and stays in the
hidden home-menu-integration Story.
SW Viewer: SWHeader vs Viewer Header is tagged verification (ID and URL kept for
the browser tests); inventory and README updated.
Deploy Storybook / deploy (push) Successful in 4m4s
Test-only approval commit after the user-approved 449398e and fc65b2e
commits on main (sw-test-regression-baseline section 9); no protected path
changes, no Story change.
- approvedMainCommit 8cb98b3 -> fc65b2e.
- public-api.approved.json kept: the public .d.ts files are byte-identical.
- docs/sw/sw-header-switch-footer-tabs-2026-10-22.md: change and verification.
User-approved 2026-10-22 SW changes (CSS only, public API unchanged).
- Footer Model / Layout tab labels 700 in every state, letter-spacing -5%;
the name-edit input keeps 400.
- Slanted Layout tab and Model tab draw their SVG assets as 9-slice
border-images: 97px / 73px stay the minimum, the slant and corners keep
their size and only the flat middle grows with a longer label (max 12em,
then ellipsis, like the rounded tabs). Hover surfaces use a union mask of
the same asset (no mask-border), so Chromium and Firefox match. The
default width renders pixel-identical to the previous drawing; the 8px
slant / Model joint is unchanged.
- Viewer panel body: the 7px bottom padding (inside the scrollport) becomes
a 2px transparent bottom border, so scrolled rows stop 2px above the
frame border instead of running into it. SWPopup keeps its 7px.
- AI docs: DESIGN_RULES, AI_USAGE, FOOTER, VIEWER updated.
- Tests: text-weight and footer-design-review expect the 700 labels and read
the Model surface from the 9-slice ::before.
Test-only approval commit after the user-approved 8cb98b3 change on main
(sw-test-regression-baseline section 9); no protected path changes.
- public-api.approved.json re-snapshotted from the clean 8cb98b3 build:
+ SWLayerVisibilityIcon, SWLayerVisibilityIconProps (170 -> 172 exports).
- approvedMainCommit bcec066 -> 8cb98b3. No Story ID or tag change.
- docs/sw/sw-viewer-layer-bulb-switch-2026-10-22.md: change and verification.
User-approved 2026-10-22 change to the SW Viewer layer popup.
- New public export SWLayerVisibilityIcon({ on }) + SWLayerVisibilityIconProps:
the SW Header layer bulb art reused as is (header design and behavior unchanged).
- Layer rows: eye (Eye / EyeOff) icon replaced by the bulb, 24 x 24 button kept.
- All layers: the 전체 켜기 / 전체 끄기 buttons replaced by one SWViewerField +
SWViewerSwitch on top. ON only when every layer is shown; a partial state reads
OFF and a click shows all. Derived from the hidden-layer state, so it stays synced.
- AI docs (VIEWER.md 4.1, catalog, design rules, composition, AI_GUIDE sync) and
example H follow the new rule, replacing the 2026-10-21 eye-icon rule.
- viewer.browser.mjs: layer popup checks moved to the bulb / switch behavior.
Deploy Storybook / deploy (push) Successful in 2m13s
Test-only approval commit after the bcec066 main merge (sw-test-regression-
baseline section 9); no protected path changes, no Story change.
- approvedMainCommit fc856f5 -> bcec066.
- public-api.approved.json kept: the public .d.ts files are byte-identical.
- docs/sw/legacy-launcher-cleanup-merge-2026-10-22.md: change and verification.
Deploy Storybook / deploy (push) Successful in 1m13s
Test-only approval commit after the fc856f5 main merge (sw-test-regression-
baseline section 9); no protected path changes, no Story change.
- approvedMainCommit 5a40796 -> fc856f5.
- public-api.approved.json kept: the public .d.ts files are byte-identical.
- docs/sw/ai-usage-examples-merge-2026-10-22.md: change and verification.
Deploy Storybook / deploy (push) Successful in 1m19s
Test-only approval commit after the 5a40796 main merge (sw-test-regression-
baseline section 9); no protected path changes, no Story change.
- approvedMainCommit 955581c -> 5a40796.
- public-api.approved.json kept: the public .d.ts files are byte-identical.
- docs/sw/ai-docs-alignment-merge-2026-10-22.md: change and verification.
Test-only approval commit after the 955581c main merge (sw-test-regression-
baseline section 9); no protected path changes, no Story change.
- approvedMainCommit f340a26 -> 955581c.
- public-api.approved.json kept: the public .d.ts files are byte-identical.
- docs/sw/sw-viewer-button-height-2026-10-21.md: change and verification.
Test-only approval commit after the f340a26 main merge (sw-test-regression-
baseline section 9); no protected path changes, no Story change.
- approvedMainCommit 6b6f17c -> f340a26.
- public-api.approved.json kept: the public .d.ts files are byte-identical.
- docs/sw/sw-viewer-open-icon-2026-10-21.md: changes and verification.
Test-only approval commit after the 6b6f17c main merge (sw-test-regression-
baseline section 9); no protected path changes, no Story change.
- approvedMainCommit f26ec7c -> 6b6f17c.
- public-api.approved.json kept: the public .d.ts files are byte-identical.
- docs/sw/sw-viewer-round-background-2026-10-21.md: changes and verification.
Test-only approval commit after the f26ec7c main merge (sw-test-regression-
baseline section 9); no protected path changes, no Story change.
- approvedMainCommit 21fe7a2 -> f26ec7c.
- public-api.approved.json kept: the public .d.ts files are byte-identical.
- docs/sw/sw-viewer-header-strip-2026-10-21.md: changes and verification.
Test-only approval commit after the 21fe7a2 main merge (sw-test-regression-
baseline section 9); no protected path changes, no Story change.
- approvedMainCommit c73f043 -> 21fe7a2.
- public-api.approved.json kept: the public .d.ts files are byte-identical.
- docs/sw/sw-property-counts-hover-2026-10-21.md: change and verification.
Test-only approval commit after the c73f043 main merge (sw-test-regression-
baseline section 9); no protected path changes, no Story change.
- approvedMainCommit c1a69a4 -> c73f043.
- public-api.approved.json from the clean c73f043 build: 170 exports, 42
declaration files and the manifest kept; only comment changes in
SWRecentFiles / home-menu types / viewer types .d.ts.
- docs/sw/sw-doc-alignment-merge-2026-10-21.md: changes and verification.
Test-only approval commit after the c1a69a4 main merge (sw-test-regression-
baseline section 9); no protected path changes.
- approvedMainCommit b320a8f -> c1a69a4.
- public-api.approved.json from the clean c1a69a4 build: 170 exports and the
manifest kept; only comment changes in SWFooter / SWFooterParts /
SWRecentFiles / home-menu types .d.ts (approved defaults documented).
Test-only: approvedHeaderDeclarations and approvedHeaderSourceChanges name the
user-approved 2026-10-21 design review changes of sw-header.stories.tsx
(Overview, ComposedDemo, MORE_WIDTHS, PROPERTY_FIXTURE, BAR_TITLE, BAR_FIXTURE).
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.
Test-only approval commit after the 34f02bf main merge (sw-test-regression-
baseline section 9); no protected path changes.
- public-api.approved.json from the clean 34f02bf build: 170 exports kept,
only SWViewerHeader.d.ts changes (7 optional SWViewerHeaderProps).
- approvedMainCommit b4e0771 -> b320a8f; approvedHeaderDeclarations for the
23d522c Story declarations; withApprovedOrder for the approved SW Header
first position; storybook-simplification expects SW/Theme hidden.
- Verification report: docs/sw/sw-viewer-storybook-merge-verification-2026-10-21.md
Records the user-approved Storybook cleanup declarations of 23d522c in
approvedHeaderSourceChanges (Overview, InteractiveStates, DocumentDropdown,
MORE_WIDTHS, ResponsiveMore, PROPERTY_STATES, PropertyCompare,
PropertyPanelComparePage, import:@hm-design/sw; StyleDemo and
MeasuredMoreDemo removed). approvedMainCommit is unchanged here; it moves in
the test-only commit after the main merge (sw-test-regression-baseline §9).
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.
The merge of fix/test-home-menu-integration carries only approved SW changes (shared roving focus / outside pointer
helpers, Firefox line-values grid); no Story change, public API unchanged (public-api.approved.json kept). Guards:
overview 54/54, overlays 20/20, unused 93/93, dropdown 228/228, stage1 41/41, home menu 23/23, public API 7/7.
keyboard-dismiss.browser.mjs + fixtures/tool-group.tsx: end-point wrap, Home / End, disabled items and a pointerdown
outside that does not move focus, for the callers of the shared helpers (22 checks; same result before the refactor).
- hover-stability-firefox: instant scroll and state waits instead of a fixed 60ms delay (smooth scroll in preview).
- integrated-visual, viewer-regression, theme-inheritance: deterministic Chromium raster flags, animations held at
time 0, layout settle wait, integer instant scroll of inner panels; tolerance stays 0.
- text-weight: wait for the Viewer More panel instead of a fixed 200ms and fix the failure report.
- dropdown-consolidation, storybook-cleanup-stage1, detail-buttons, property-panel-comparison: assert their recorded
state and accept today only the approved later Story changes (storybook-inventory.mjs helpers).
- header-composition.browser.mjs + fixtures/header-composition.tsx: the removed Composition Story presets, hidden
controls, invalid menuOrder / hiddenControls and live changes, on a test-only page using the public API only.
- storybook-unused-removal: header comment lists which older scripts run on current Stories again.
- source-changes.mjs: source guards list untracked, staged, deleted and renamed files, not only git diff --name-only.
- overview / storybook-unused-removal: production source guards use the helper (assertions, paths, approved list unchanged).
- public-api.check.mjs + public-api.approved.json: the built @hm-design/sw entry must export exactly the approved
names and kinds, keep the package.json export settings and keep every declaration reachable from dist/index.d.ts
byte-identical. The approved surface was written from a build of 553e4df (approvedMainCommit).
shkim4