SW AI usage / design rules / composition / viewer docs, example J and the
shared AI_GUIDE (synced to every package with sync:ai-docs) state the
Noto Sans KR default and the 2026-10-20 weight scope.
Font expectations move back to Noto Sans KR (Dotum becomes the theme
inheritance verification value), viewer labels expect 700, and the new
text-weight.browser.mjs checks the requested Bold scope and outlines.
User request 2026-10-20: Composed Controls field values, footer side
titles and category tabs, viewer header file name / button labels /
Model-Layout tabs, recent-file path and preview title use 700. SWHeader
field values stay 400. The preview title gets the existing 14px outline
token; sizes, colors and widths are unchanged.
Withdraw the 2026-10-20 Dotum default (user decision). The SW font token
falls back to Malgun Gothic / Apple SD Gothic Neo; the Dotum-only 4px
padding of the drawing-mode cell is restored to 8px.
Chromium and Firefox browser tests (hover position, field text, ellipsis and
tooltip), AI docs and guide, report with the open Firefox Continuous 0.6px
issue and the Figma difference of the home menu hover.
Report docs/sw/sw-dotum-font-2026-10-20.md and evidence docs/sw/sw-dotum-font-qa/: Noto -> Dotum layout diff of 40 SW
Stories x 4 widths, Header hysteresis trace, Footer design items (4 PASS), SW regression runs with baseline failure
classification, and the isolated HMDesignSwTest-viewer run (Chrome 34/34, Firefox 15/15; original project untouched).
Open items: synthesized-bold overflow in fixed Header cells and Footer POLYGON / WIPEOUT labels (design review),
viewer-regression not run, macOS / Linux fallback not verified.
- Common AI_GUIDE (synced copies in ui / sw / org-chart / org-chart-react ai/): mixed-use rule 1 adds the font split
(SW = Dotum, Web = Noto Sans KR, OrgChart keeps its own) and forbids copying one package's font into another area.
- SW AI_USAGE / DESIGN_RULES / VIEWER / COMPOSITION_PATTERNS / Example J: Dotum is the default (no "approval pending"),
SW screens use SWTheme and SW tokens, no Web font copy, synthesized-bold width note; example override = Malgun Gothic.
- README: SW default Dotum, Web default Noto Sans KR.
- theme-inheritance: default = Dotum stack, inheritance verification value = Noto Sans KR (same 23 checks).
- SW/Theme Story: verification font and labels follow the new default.
- ai-template-consumer: SWTheme token font now starts with Dotum.
- footer-design-review (new): Footer design items (전체보기 / + hover, Model selected / unselected, category pockets,
Model / Layout text) measured in Storybook with state screenshots.
- --hm-sw-header-font-family: Dotum, "돋움", "Malgun Gothic", "Apple SD Gothic Neo", sans-serif
(one token on the outermost SW scope; no font file, no per-component font-family). Web UI keeps Noto Sans KR.
- Header drawing-mode cell keeps its Figma 90px width; padding 8px -> 4px because Dotum has no bold face and the
synthesized 700 made "그리기모드" (77.8px) overflow the 74px content box.
AI documents (packages/sw/ai)
- SWPopupPropertyRow, SWSelect, SWSlider in the catalog, usage table,
composition patterns and design rules; SWViewerSlider noted as SWSlider panel.
- Rule: the SWHeader layer / color dropdowns are header-only; popup layer /
color / line style use SWPopupPropertyRow (property window pickers).
- Footer rules: gra-border-orange surfaces, Model / Layout text unchanged on
hover, side button hover, vacant surface limited to the slot row.
- Header rules: measured More growing behavior (hysteresis fix A).
- Example E (custom popup) uses SWPopupPropertyRow, SWSelect and SWSlider
instead of SWHeaderLayerMenu in the popup.
Tests (packages/sw/tests)
- New footer-popup-viewer-refinement.browser.mjs (47 checks: footer stories,
hover / gradient / tab text / pocket, popup pickers vs property window rows,
SWSlider, unit SWSelect parity, Popup B, header trace, viewer title art).
- integrated-popup / integrated-consumer: popup pickers and SWSelect instead of
the header dropdown and the HM UI Select (same overlay / callback / Escape
requirements).
- integrated-improvement: default sections skip the retired SW/Tool story
('tool' still runs by name); storybook-inventory / simplification record the
retired footer IDs; theme-inheritance widths use sw-footer--full-footer.
Docs (docs/sw)
- sw-footer-popup-viewer-refinement-2026-10-20.md: causes, decisions (the
first-pass "header dropdown in popup" change is marked withdrawn),
verification and baseline failures; evidence footer-popup-viewer-refinement-qa
(47/47). Footer mapping document updated for the removed sections.
Baseline failures (unchanged by this work): home-menu-integration 1,
storybook-unused-removal 5 (10-19 snapshot comparisons), range-cross-browser and
property-panel-comparison open stories retired on 2026-10-19.
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.
Hysteresis fix A for the Open placement regression introduced by 170a5c2.
- Growing: a part its breakpoint brings back (print / K, color, the property
block, line / text / dimension style, drawing mode) returns only when the
measured room is there; otherwise it stays in More. Default-layout print / K
are held through data-actions-held (window area keeps its 640px-tier state).
- Open that came back while growing is not pushed into More again by another
part; shrinking still moves Open first, and its return width follows the
narrowest width while it is collapsed.
- Open no longer waits for the parts still in More; the last part leaving More
takes the More button relief into account (measured, never painted).
- A part released at a width is not held again at that width, so the layout
passes always settle (fixes the maximum update depth error found on
sw-header--responsive-more during verification).
Trace 520 -> 1080 (data-width 520 frame): before
[[520,0],[560,0],[600,1],[640,0],[680,0],[720,1],[760,1],[820,1],[900,0],[1080,0]],
after [[520,0],[560,0],[600,1],[640,1],[680,1],[720,1],[760,1],[820,1],[900,1],[1080,1]].
The measured More adds a hidden measure row and a More section, so the geometry check counted 11 sections / 31 tiles / 45 icons instead of 5 / 15 / 30.
- Merge SW / Home Menu Stories into SW / Header (sidebar: Home Menu; others verification-tagged)
- Home On: logo hover ring and header top/bottom #5F4B0F lines while the menu is open
- Measured More in SWHeader; home menu narrow widths use a More (...) section with a grouped
text menu instead of horizontal scroll, placed right after the last visible section
- Action tiles no longer stay on after a click; 최근파일 stays Active only while its list is open
- More dropdown and recent files list never open together; list top joins the accent line
- Recent files preview falls back left / over the list at narrow widths (390px)
- Update Storybook, browser tests, docs, AI guides and QA evidence
Port the uncommitted HMDesign-SW-Viewer change: SWPopup, SWViewerPanel and
the property window share .hm-sw-property__body, so the body and any
scrolling area inside it now use a thin #9A9284 / #E0DACE scrollbar
(--hm-sw-popup-scrollbar-thumb / -track). Document it in DESIGN_RULES.
Integrate the SW home (logo) menu into SWHeader for SW general mode only.
SW viewer mode code and stories are unchanged.
- Resolve conflicts: keep both sw-home-menu and sw-viewer exports;
renumber AI docs (catalog viewer 8->9, patterns home menu 7->8,
design rules home menu 11->12)
- SWHeader: start the home menu after the file name when it sits
inside controls, so the file name stays visible
- AI guides: mark home menu as general-mode only; forbid it in viewer
mode (AI_USAGE, catalog, design rules, patterns, VIEWER.md, AI_GUIDE)
- Tests: ignore wildcard identifiers in ai-docs check; update expected
Storybook SW titles (SW/Tool removed, SW/Viewer added)
- Add merge QA report docs/sw/sw-home-menu-merge-2026-10-19.md
With anchorRef the frame renders visibility:hidden until useSWHeaderOverlay
places it, and the focus effect ran in that same commit, so focus() on the
hidden element was ignored. Focus now runs once the frame is placed; the
previous element is still captured first, so Escape / close return focus.
Align the SWPopup autoFocus default doc (true with anchorRef) and catalog.
(cherry picked from commit 65bc0dbd5df059ead06f10a3f95f2bd2734fbf2f)
- Five checked items from the independent session's report: document sync,
33 viewer exports, SW general/viewer mode selection, component search,
three-step rule for new UI
- Live ResizeObserver re-layout and the real ask/answer flow stay NOT VERIFIED
- Usage types are now Web / SW (general mode, viewer mode) / OrgChart / mixed.
Shared AI_GUIDE step 1 asks for the SW mode only when the request or the
project setting (HMDesign 사용 유형: SW 일반 | SW 뷰어) leaves it open;
examples B0/B1/B2 cover "HMDesign SW로 화면을 만들어 주세요", general and viewer.
- Missing-component handling in three steps (reuse in the chosen type/mode ->
build with that mode's tokens -> HMDesign-consistent style, reported as
"AI 구성 값 — 디자인 확인 필요"), plus SW general/viewer separation rules.
- sw/ai: AI_USAGE §0 mode selection, catalog §8 lists all 33 SWViewer* exports,
DESIGN_RULES §11 viewer tokens, PATTERNS 7 viewer composition; examples B/F
marked as general mode. ui/ai and org-chart/ai aligned with the new types.
- AGENTS_SNIPPET, AGENTS.md and MAINTAINING updated; copies synced.
- scripts/ai-docs.mjs: shared-copy check ignores CRLF/LF (core.autocrlf=true
checks out packages/sw as LF and the rest as CRLF).
- Verification record updated (code samples typechecked, built and rendered).
Brings SW viewer mode (SWViewerHeader, SWViewerMenu, SWViewerPanel and panel controls,
ai/VIEWER.md, example H) onto the packaged AI guides. ai/AI_USAGE.md keeps both the
shared-guide link and the viewer row.
- Shared entry point docs/ai/AI_GUIDE.md (type selection Web / SW / OrgChart / mixed,
steps 1-7, package style separation, report format, examples A-D) and
AGENTS_SNIPPET.md, copied into every package ai/ folder
- New ai/ docs for @hm-design/ui and @hm-design/org-chart (+ org-chart-react pointer):
AI_USAGE, COMPONENT_CATALOG, DESIGN_RULES, COMPOSITION_PATTERNS
- SW ai/ linked to the shared guide; catalog lists every Props type explicitly
- "ai" added to package files of ui, org-chart, org-chart-react
- scripts/ai-docs.mjs: sync:ai-docs / check:ai-docs (copies, files, catalog <-> exports, links)
- Maintenance guide and verification record under docs/ai
- A: SWViewerIcon draws the SWHeader black outline as SVG stroke on a copy behind the icon (no CSS filter)
- B: SWViewerPanel renders the common SWPopup frame (same DOM / CSS) and adds drag, corner resize,
collapse, bounds and modal; SWPopup gains optional titleActions / footer; title art spans any width
- C: shared Story canvas grid (--sw-story-canvas) behind the SW Header work area and dropdown room
- D: SWViewerButton tone="green" for 전체 켜기 / 전체 끄기: default kept, hover = primary (확인) hover
token, pressed = primary face
- AI guide, verification scripts (76 checks, element regression) and evidence updated
- SWViewerHeader: data-driven viewer menu (button / toggle / menu / tabs / switch / custom), More by
collapseBelow, trailing slot, onCommand; SWHeader logo props with no default logo
- SWViewerMenu: dropdown, check / radio, multi-level submenu, context menu at a point
- SWViewerPanel: viewer popup frame with free children / footer, drag, corner resize, collapse, modal
- Panel controls: SWViewerSection / Field / Hint / Switch / Slider / Input / Button / Badge / Status
- SWHeader black text outline tokens on viewer text, matching icon outline (drop-shadow)
- Storybook SW/Viewer stories; remove SW/Tool story (SW/Popup kept)
- AI guide ai/VIEWER.md, example H, verification scripts and evidence
Combine Task A (e8409ef, SW 0.2.0 integrated improvement) with Task B
(396539d, Figma-based SWHomeMenu / SWHomeMenuSection / SWHomeMenuItem /
SWRecentFiles). Task B's 84 new files are taken unchanged except for the
public-import Storybook update and joining the popup Escape stack.
- Export the home menu from @hm-design/sw
- SWHeader homeMenu / homeMenuOpen / defaultHomeMenuOpen /
onHomeMenuOpenChange: hidden by default, the logo toggles it (onHomeClick
is not called while homeMenu is set), placed from the measured header,
closes with / closes the document and field dropdowns
- Logo aria-expanded / aria-controls; menu layer CSS (z-index 20)
- AI catalog / patterns / design rules, example G, README, usage guide
- Storybook SW/Home Menu uses @hm-design/sw; integration story
Verified: SW typecheck, tsc -b, SW build, Storybook build, AI docs 22/22,
28/28 existing SW shots pixel-identical, regression 96 PASS / 0 FAIL,
home menu checks 22/22. Not run: tarball consumer install.
Remove the separate SW/Header/Options sidebar item. Its examples move to two
Stories directly under SW/Header (src/sw/sw-header-open.stories.tsx):
- Document Open: Open placement, label, 10-width responsive, composed bar,
composed (controls) responsive
- Hidden Sub Controls: document New / Open and layer freeze / lock removal
No public API or component change. Tests and inventory follow the new IDs
(integrated 97/97, existing Stories pixel-identical 28/28, unused-removal
83/83). The two remaining overview failures are pre-existing historical
assertions (also failing on 5faa1f1), not new defects.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
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>
Remove nine SW/Header demo pages (property-fields, property-shape-slot,
composition, colorize, dynamic-controls, property-bar, additional-hover,
property-panel, layer-detail-input) and the demo code and Storybook-only
CSS used only by them. SW Stories 19 -> 10, total 338 -> 329.
The package runtime, public API, AI template and the retained Stories
(Overview, Dropdown, Property Panel 4-state comparison, Window Move
Motion and others) are unchanged. Add a current regression script and
mark the older scripts that open the retired IDs as historical evidence.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Keep sw-header--property-panel-compare as the single property panel state
page: the four existing SWHeaderPropertyPanel states in 2 columns x 2 rows
at their original size, inside a scrolling Inner. Remove the duplicate
Property Panel Variants and the four single-state Stories (SW 24 -> 19).
Storybook-only change; SW runtime and public API untouched.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Merge feature/sw-ai-template (e27385e) into feature/sw-package (bf16578).
No conflicts; no runtime source, Storybook source or public API change.
Adds the integration record docs/sw/sw-ai-template-integration-2026-10-19.md
and its evidence (Overview 53/53, overlays 19/19, AI consumer 27/27).
The unverified wip/sw-header-composition-unverified branch is not included.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
- Ship an AI guide in the package (ai/: usage rules, component catalog,
design rules, composition patterns) via package.json files.
- Add examples A-D that import only public exports: default header,
viewer header, feature header, and a consumer-side search extension
that reuses SWHeaderInput and the public SW tokens.
- Add SW-only checks: docs/API consistency, tarball consumer project
(React 19 + TS + Vite typecheck/build) and a browser check (27/27).
- No runtime source or public API change; README gains a pointer section.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
First-pass cleanup only; no design, behavior, public API or Story ID change.
- Stories: correct stale Text Stroke / Colorize / "latest" texts, reuse
parseSWHeaderColor, derive the field fixture from PROPERTY_FIXTURE
- Comments: date the "Latest request" notes in sw.css and the color menu
- Docs: fix removed text-stroke tokens in spec/usage/README, add spec §18
(property fields), current-state index banners, Storybook 33 pointer
- Add docs/sw/sw-first-pass-cleanup-review-2026-10-19.md (Story table,
structure, SAFE / REVIEW list for the second pass)
Checks: SW + app typecheck, SW build, Storybook build, 33 Story IDs
unchanged, property fields 77/77, detail-buttons verify 257 checks, 111 doc
links 0 broken.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
- Property panel rows follow Figma 26:12388 ~ 26:12649: 28px fields with
Default / Hover border / numeric editing On (#0F0D0A) / dropdown On (#211D13)
- Layer, line style and color fields open the shared header dropdown contents
(SWHeaderLayerRows, SWHeaderLineStyleColumns, SWHeaderColorPanelBody)
- Additive API: property.picker, property.decimals, panel menus
- Property Fields story and browser test (77 checks)
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
- Property bar ends after its last field (content width, scrolls when longer)
- Remove Figma canvas layers from property tool and close SVGs
- Suppress header field hover while the field's own dropdown is open
- Gauge: Figma red fill pill, beige track, Figma thumb SVG; shared
paint for WebKit and Gecko (::-moz-range-*) so Firefox matches Chrome
- Story buttons for gauge external value / disabled / read-only
- Browser checks: follow-up fixes, Chrome vs Firefox range, close button
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
shkim4
