feat(sw): integrated improvement 0.2.0 (popup content, header open, tool buttons)

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>
This commit is contained in:
shkim4andClaude Opus 5.5 committed 2026-10-19 14:49:19 +09:00
1 parent 5faa1f1ffe
commit 55179b4577
138 files changed
+17194 -162

No files matched your search

Binary file not shown.

After

Width:  |  Height:  |  Size: 83 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 83 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 76 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 84 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 237 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 88 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 117 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 105 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 74 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 85 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 70 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 98 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 71 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 88 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 78 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 87 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 83 KiB

File diff suppressed because it is too large. Load diff
@@ -0,0 +1,639 @@
{
"before": [
{
"type": "story",
"subtype": "story",
"id": "sw-header--detail-buttons",
"name": "Detail Buttons (Shared States)",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest",
"verification"
],
"exportName": "DetailButtons"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--overview",
"name": "Overview",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "Overview"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--interactive-states",
"name": "Interactive States",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "InteractiveStates"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--window-move-motion",
"name": "Window Move Motion",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "WindowMoveMotion"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--composed-controls",
"name": "Composed Controls",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "ComposedControls"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--logo-slot",
"name": "Logo Slot",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "LogoSlot"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--document-dropdown",
"name": "Document Dropdown",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "DocumentDropdown"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--layer-dropdown",
"name": "Layer Dropdown",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "LayerDropdown"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--color-dropdown",
"name": "Color Dropdown",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "ColorDropdown"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--line-style-dropdown",
"name": "Line Style Dropdown",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "LineStyleDropdown"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--text-dimension-style-dropdown",
"name": "Text · Dimension Style Dropdown",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "TextDimensionStyleDropdown"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--responsive-more",
"name": "Responsive More",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "ResponsiveMore"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--layer-detail-input",
"name": "Layer Detail · Input",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "LayerDetailInput"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-panel",
"name": "Property Panel",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyPanel"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-panel-variants",
"name": "Property Panel Variants",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyPanelVariants"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--k-guide",
"name": "K Guide",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "KGuide"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--additional-hover",
"name": "Additional Hover",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "AdditionalHover"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-bar",
"name": "Property Bar",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyBar"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--dynamic-controls",
"name": "Dynamic Controls",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "DynamicControls"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--colorize",
"name": "Colorize",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "Colorize"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--composition",
"name": "Composition (Visibility · Order)",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "Composition"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-panel-none",
"name": "Property Panel · 선택 없음",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyPanelNone"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-panel-all",
"name": "Property Panel · 전체 선택",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyPanelAll"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-panel-circle",
"name": "Property Panel · 원 1개",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyPanelCircle"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-panel-expanded",
"name": "Property Panel · 모두 펼침",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyPanelExpanded"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-panel-compare",
"name": "Property Panel · 4개 비교",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyPanelCompare"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-shape-slot",
"name": "Property Panel · 형상 Slot",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyShapeSlot"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-fields",
"name": "Property Panel · 필드 13개",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyFields"
}
],
"after": [
{
"type": "story",
"subtype": "story",
"id": "sw-header--composed-controls",
"name": "Dropdown",
"title": "SW/Header",
"importPath": "./src/sw/sw-header-dropdown.stories.tsx",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "ComposedControls"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--detail-buttons",
"name": "Detail Buttons (Shared States)",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest",
"verification"
],
"exportName": "DetailButtons"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--overview",
"name": "Overview",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "Overview"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--interactive-states",
"name": "Interactive States",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "InteractiveStates"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--window-move-motion",
"name": "Window Move Motion",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "WindowMoveMotion"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--logo-slot",
"name": "Logo Slot",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "LogoSlot"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--document-dropdown",
"name": "Document Dropdown",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "DocumentDropdown"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--responsive-more",
"name": "Responsive More",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "ResponsiveMore"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--k-guide",
"name": "K Guide",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "KGuide"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-panel-compare",
"name": "Property Panel · 4개 비교",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyPanelCompare"
}
],
"removed": [
{
"type": "story",
"subtype": "story",
"id": "sw-header--layer-dropdown",
"name": "Layer Dropdown",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "LayerDropdown"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--color-dropdown",
"name": "Color Dropdown",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "ColorDropdown"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--line-style-dropdown",
"name": "Line Style Dropdown",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "LineStyleDropdown"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--text-dimension-style-dropdown",
"name": "Text · Dimension Style Dropdown",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "TextDimensionStyleDropdown"
}
]
}
@@ -0,0 +1,152 @@
[
{
"type": "story",
"subtype": "story",
"id": "sw-header--composed-controls",
"name": "Dropdown",
"title": "SW/Header",
"importPath": "./src/sw/sw-header-dropdown.stories.tsx",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "ComposedControls"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--detail-buttons",
"name": "Detail Buttons (Shared States)",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest",
"verification"
],
"exportName": "DetailButtons"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--overview",
"name": "Overview",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "Overview"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--interactive-states",
"name": "Interactive States",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "InteractiveStates"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--window-move-motion",
"name": "Window Move Motion",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "WindowMoveMotion"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--logo-slot",
"name": "Logo Slot",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "LogoSlot"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--document-dropdown",
"name": "Document Dropdown",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "DocumentDropdown"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--responsive-more",
"name": "Responsive More",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "ResponsiveMore"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--k-guide",
"name": "K Guide",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "KGuide"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-panel-compare",
"name": "Property Panel · 4개 비교",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyPanelCompare"
}
]
@@ -0,0 +1,423 @@
[
{
"type": "story",
"subtype": "story",
"id": "sw-header--detail-buttons",
"name": "Detail Buttons (Shared States)",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest",
"verification"
],
"exportName": "DetailButtons"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--overview",
"name": "Overview",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "Overview"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--interactive-states",
"name": "Interactive States",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "InteractiveStates"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--window-move-motion",
"name": "Window Move Motion",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "WindowMoveMotion"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--composed-controls",
"name": "Composed Controls",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "ComposedControls"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--logo-slot",
"name": "Logo Slot",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "LogoSlot"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--document-dropdown",
"name": "Document Dropdown",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "DocumentDropdown"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--layer-dropdown",
"name": "Layer Dropdown",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "LayerDropdown"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--color-dropdown",
"name": "Color Dropdown",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "ColorDropdown"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--line-style-dropdown",
"name": "Line Style Dropdown",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "LineStyleDropdown"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--text-dimension-style-dropdown",
"name": "Text · Dimension Style Dropdown",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "TextDimensionStyleDropdown"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--responsive-more",
"name": "Responsive More",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "ResponsiveMore"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--layer-detail-input",
"name": "Layer Detail · Input",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "LayerDetailInput"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-panel",
"name": "Property Panel",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyPanel"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-panel-variants",
"name": "Property Panel Variants",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyPanelVariants"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--k-guide",
"name": "K Guide",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "KGuide"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--additional-hover",
"name": "Additional Hover",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "AdditionalHover"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-bar",
"name": "Property Bar",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyBar"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--dynamic-controls",
"name": "Dynamic Controls",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "DynamicControls"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--colorize",
"name": "Colorize",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "Colorize"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--composition",
"name": "Composition (Visibility · Order)",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "Composition"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-panel-none",
"name": "Property Panel · 선택 없음",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyPanelNone"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-panel-all",
"name": "Property Panel · 전체 선택",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyPanelAll"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-panel-circle",
"name": "Property Panel · 원 1개",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyPanelCircle"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-panel-expanded",
"name": "Property Panel · 모두 펼침",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyPanelExpanded"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-panel-compare",
"name": "Property Panel · 4개 비교",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyPanelCompare"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-shape-slot",
"name": "Property Panel · 형상 Slot",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyShapeSlot"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-fields",
"name": "Property Panel · 필드 13개",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyFields"
}
]
@@ -0,0 +1,656 @@
{
"baseCommit": "50bf5bda8e956a4973b923d64131f2f2285bd38c",
"checks": [
{
"name": "24 retained Story IDs, names and tags; only approved Dropdown retirements",
"status": "FAIL"
},
{
"name": "retained non-Overview declarations byte-identical; relocated composition separately verified",
"status": "FAIL"
},
{
"name": "retired Dropdown IDs absent",
"status": "PASS"
},
{
"name": "package production source untouched",
"status": "PASS"
},
{
"name": "16:9 fitted to both Inner dimensions at 1920x1080",
"status": "PASS",
"data": {
"stage": {
"x": 360,
"y": 264.25,
"w": 1200,
"h": 675,
"right": 1560,
"bottom": 939.25
},
"slot": {
"x": 360,
"y": 169.5,
"w": 1200,
"h": 864.5,
"right": 1560,
"bottom": 1034
},
"header": {
"x": 360,
"y": 264.25,
"w": 1200,
"h": 49,
"right": 1560,
"bottom": 313.25
},
"viewport": {
"w": 1920,
"h": 1080
},
"overflow": 0
}
},
{
"name": "16:9 fitted to both Inner dimensions at 1440x900",
"status": "PASS",
"data": {
"stage": {
"x": 120,
"y": 174.25,
"w": 1200,
"h": 675,
"right": 1320,
"bottom": 849.25
},
"slot": {
"x": 120,
"y": 169.5,
"w": 1200,
"h": 684.5,
"right": 1320,
"bottom": 854
},
"header": {
"x": 120,
"y": 174.25,
"w": 1200,
"h": 49,
"right": 1320,
"bottom": 223.25
},
"viewport": {
"w": 1440,
"h": 900
},
"overflow": 0
}
},
{
"name": "16:9 fitted to both Inner dimensions at 1280x720",
"status": "PASS",
"data": {
"stage": {
"x": 191.5625,
"y": 169.5,
"w": 896.875,
"h": 504.5,
"right": 1088.4375,
"bottom": 674
},
"slot": {
"x": 38.40625,
"y": 169.5,
"w": 1203.1875,
"h": 504.5,
"right": 1241.59375,
"bottom": 674
},
"header": {
"x": 191.5625,
"y": 169.5,
"w": 896.875,
"h": 49,
"right": 1088.4375,
"bottom": 218.5
},
"viewport": {
"w": 1280,
"h": 720
},
"overflow": 0
}
},
{
"name": "16:9 fitted to both Inner dimensions at 768x600",
"status": "PASS",
"data": {
"stage": {
"x": 42.21875,
"y": 169.5,
"w": 683.546875,
"h": 384.5,
"right": 725.765625,
"bottom": 554
},
"slot": {
"x": 23.046875,
"y": 169.5,
"w": 721.90625,
"h": 384.5,
"right": 744.953125,
"bottom": 554
},
"header": {
"x": 42.21875,
"y": 169.5,
"w": 683.546875,
"h": 49,
"right": 725.765625,
"bottom": 218.5
},
"viewport": {
"w": 768,
"h": 600
},
"overflow": 0
}
},
{
"name": "16:9 fitted to both Inner dimensions at 390x844",
"status": "PASS",
"data": {
"stage": {
"x": 16,
"y": 383.0625,
"w": 358,
"h": 201.375,
"right": 374,
"bottom": 584.4375
},
"slot": {
"x": 16,
"y": 169.5,
"w": 358,
"h": 628.5,
"right": 374,
"bottom": 798
},
"header": {
"x": 16,
"y": 383.0625,
"w": 390,
"h": 49,
"right": 406,
"bottom": 432.0625
},
"viewport": {
"w": 390,
"h": 844
},
"overflow": 0
}
},
{
"name": "16:9 fitted to both Inner dimensions at 1000x500",
"status": "PASS",
"data": {
"stage": {
"x": 247.109375,
"y": 169.5,
"w": 505.765625,
"h": 284.5,
"right": 752.875,
"bottom": 454
},
"slot": {
"x": 30,
"y": 169.5,
"w": 940,
"h": 284.5,
"right": 970,
"bottom": 454
},
"header": {
"x": 247.109375,
"y": 169.5,
"w": 505.765625,
"h": 49,
"right": 752.875,
"bottom": 218.5
},
"viewport": {
"w": 1000,
"h": 500
},
"overflow": 0
}
},
{
"name": "one Header and no duplicate fixed Figma specimen",
"status": "PASS"
},
{
"name": "document selection updates Header and Callback",
"status": "PASS",
"data": "onDocumentClick → documentOpen(true) → onDocumentSelect(doc-2) → documentOpen(false)"
},
{
"name": "layer selection updates shared data",
"status": "PASS",
"data": "onDocumentClick → documentOpen(true) → onDocumentSelect(doc-2) → documentOpen(false) → onLayerOpen → onLayerSelect(layer, CC-D GNL)"
},
{
"name": "existing layer Detail callback closes list",
"status": "PASS"
},
{
"name": "color selection invokes host callback",
"status": "PASS",
"data": "onLayerOpen → onLayerSelect(layer, CC-D GNL) → onLayerOpen → onLayerDetail → onColorOpen → onColorSelect(color, 255,255,255)"
},
{
"name": "line selection updates Header",
"status": "PASS",
"data": "onLayerOpen → onLayerDetail → onColorOpen → onColorSelect(color, 255,255,255) → onLineStyleOpen → onLineTypeSelect(line, CENTER)"
},
{
"name": "ByLayer weight mode does not turn numeric property into a mode string",
"status": "PASS"
},
{
"name": "text style selection updates Header",
"status": "PASS",
"data": "onColorSelect(color, 255,255,255) → onLineStyleOpen → onLineTypeSelect(line, CENTER) → onLineWeightSelect(w-bylayer) → onTextStyleOpen → onTextStyleSelect(dotum)"
},
{
"name": "dimension style selection updates Header",
"status": "PASS",
"data": "onLineTypeSelect(line, CENTER) → onLineWeightSelect(w-bylayer) → onTextStyleOpen → onTextStyleSelect(dotum) → onDimensionStyleOpen → onDimensionStyleSelect(iso-25)"
},
{
"name": "opening another dropdown closes the previous one",
"status": "PASS"
},
{
"name": "Escape closes Header dropdown",
"status": "PASS"
},
{
"name": "outside click closes Header dropdown",
"status": "PASS"
},
{
"name": "Bar Enter commits state",
"status": "PASS"
},
{
"name": "Bar validates min=0",
"status": "PASS"
},
{
"name": "Bar Escape cancels edit",
"status": "PASS"
},
{
"name": "Header opens panel with same Bar value",
"status": "PASS"
},
{
"name": "numeric weight property remains numeric after ByLayer mode",
"status": "PASS"
},
{
"name": "Header layer value shared with panel",
"status": "PASS"
},
{
"name": "panel edit updates the Bar",
"status": "PASS"
},
{
"name": "panel number validation rejects negative radius",
"status": "PASS"
},
{
"name": "panel Layer dropdown updates Header shared value",
"status": "PASS"
},
{
"name": "panel line dropdown updates Header shared value",
"status": "PASS"
},
{
"name": "panel color dropdown updates Header shared value",
"status": "PASS"
},
{
"name": "panel RGB validation rejects out-of-range value",
"status": "PASS"
},
{
"name": "gauge keyboard editing commits host state",
"status": "PASS"
},
{
"name": "first Escape cancels draft and retains panel",
"status": "PASS"
},
{
"name": "next Escape closes panel and restores Header focus",
"status": "PASS"
},
{
"name": "panel Close button restores focus",
"status": "PASS"
},
{
"name": "external Props update Bar",
"status": "PASS"
},
{
"name": "Bar ReadOnly",
"status": "PASS"
},
{
"name": "Bar Disabled",
"status": "PASS"
},
{
"name": "dynamic Bar field added",
"status": "PASS"
},
{
"name": "dynamic field shared with panel",
"status": "PASS"
},
{
"name": "dynamic field removed from both",
"status": "PASS"
},
{
"name": "shape Slot can be empty without changing panel structure",
"status": "PASS"
},
{
"name": "original panel size none:314x256",
"status": "PASS",
"data": {
"x": 1000,
"y": 301.25,
"width": 314,
"height": 256
}
},
{
"name": "original panel size all:314x361",
"status": "PASS",
"data": {
"x": 1000,
"y": 301.25,
"width": 314,
"height": 361
}
},
{
"name": "original panel size circle:314x658",
"status": "PASS",
"data": {
"x": 1000,
"y": 301.25,
"width": 314,
"height": 658
}
},
{
"name": "original panel size expanded:314x754",
"status": "PASS",
"data": {
"x": 1000,
"y": 301.25,
"width": 314,
"height": 754
}
},
{
"name": "expanded popup bottom accessible through internal scroll",
"status": "PASS"
},
{
"name": "small Inner reaches full popup bottom with native Header and popup dimensions",
"status": "PASS",
"data": {
"top": 630,
"left": 16,
"height": 201,
"scrollHeight": 831,
"width": 358,
"scrollWidth": 390
}
},
{
"name": "narrow popup Escape restores More focus",
"status": "PASS"
},
{
"name": "actual Storybook manager iframe fits its own Inner",
"status": "PASS",
"data": {
"width": 1071.59375,
"height": 602.765625,
"slotWidth": 1071.59375,
"slotHeight": 744.5,
"viewportWidth": 1140,
"viewportHeight": 960
}
},
{
"name": "no browser errors",
"status": "PASS",
"data": []
}
],
"errors": [],
"sizes": [
{
"stage": {
"x": 360,
"y": 264.25,
"w": 1200,
"h": 675,
"right": 1560,
"bottom": 939.25
},
"slot": {
"x": 360,
"y": 169.5,
"w": 1200,
"h": 864.5,
"right": 1560,
"bottom": 1034
},
"header": {
"x": 360,
"y": 264.25,
"w": 1200,
"h": 49,
"right": 1560,
"bottom": 313.25
},
"viewport": {
"w": 1920,
"h": 1080
},
"overflow": 0
},
{
"stage": {
"x": 120,
"y": 174.25,
"w": 1200,
"h": 675,
"right": 1320,
"bottom": 849.25
},
"slot": {
"x": 120,
"y": 169.5,
"w": 1200,
"h": 684.5,
"right": 1320,
"bottom": 854
},
"header": {
"x": 120,
"y": 174.25,
"w": 1200,
"h": 49,
"right": 1320,
"bottom": 223.25
},
"viewport": {
"w": 1440,
"h": 900
},
"overflow": 0
},
{
"stage": {
"x": 191.5625,
"y": 169.5,
"w": 896.875,
"h": 504.5,
"right": 1088.4375,
"bottom": 674
},
"slot": {
"x": 38.40625,
"y": 169.5,
"w": 1203.1875,
"h": 504.5,
"right": 1241.59375,
"bottom": 674
},
"header": {
"x": 191.5625,
"y": 169.5,
"w": 896.875,
"h": 49,
"right": 1088.4375,
"bottom": 218.5
},
"viewport": {
"w": 1280,
"h": 720
},
"overflow": 0
},
{
"stage": {
"x": 42.21875,
"y": 169.5,
"w": 683.546875,
"h": 384.5,
"right": 725.765625,
"bottom": 554
},
"slot": {
"x": 23.046875,
"y": 169.5,
"w": 721.90625,
"h": 384.5,
"right": 744.953125,
"bottom": 554
},
"header": {
"x": 42.21875,
"y": 169.5,
"w": 683.546875,
"h": 49,
"right": 725.765625,
"bottom": 218.5
},
"viewport": {
"w": 768,
"h": 600
},
"overflow": 0
},
{
"stage": {
"x": 16,
"y": 383.0625,
"w": 358,
"h": 201.375,
"right": 374,
"bottom": 584.4375
},
"slot": {
"x": 16,
"y": 169.5,
"w": 358,
"h": 628.5,
"right": 374,
"bottom": 798
},
"header": {
"x": 16,
"y": 383.0625,
"w": 390,
"h": 49,
"right": 406,
"bottom": 432.0625
},
"viewport": {
"w": 390,
"h": 844
},
"overflow": 0
},
{
"stage": {
"x": 247.109375,
"y": 169.5,
"w": 505.765625,
"h": 284.5,
"right": 752.875,
"bottom": 454
},
"slot": {
"x": 30,
"y": 169.5,
"w": 940,
"h": 284.5,
"right": 970,
"bottom": 454
},
"header": {
"x": 247.109375,
"y": 169.5,
"w": 505.765625,
"h": 49,
"right": 752.875,
"bottom": 218.5
},
"viewport": {
"w": 1000,
"h": 500
},
"overflow": 0
}
],
"browser": "155.0.8059.80",
"managerOrder": [
"sw-header--composed-controls",
"sw-header--overview",
"sw-header--interactive-states",
"sw-header--window-move-motion",
"sw-header--logo-slot",
"sw-header--document-dropdown",
"sw-header--responsive-more",
"sw-header--k-guide",
"sw-header--property-panel-compare"
],
"status": "FAIL"
}
@@ -0,0 +1,11 @@
[
"sw-header--composed-controls",
"sw-header--overview",
"sw-header--interactive-states",
"sw-header--window-move-motion",
"sw-header--logo-slot",
"sw-header--document-dropdown",
"sw-header--responsive-more",
"sw-header--k-guide",
"sw-header--property-panel-compare"
]
Binary file not shown.

After

Width:  |  Height:  |  Size: 106 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 72 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 58 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 218 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 30 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 94 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 95 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 63 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 93 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 80 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 81 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 79 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 81 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 202 KiB

@@ -0,0 +1,38 @@
[
[
"sw-header--composed-controls",
"Dropdown"
],
[
"sw-header--overview",
"Overview"
],
[
"sw-header--interactive-states",
"Interactive States"
],
[
"sw-header--window-move-motion",
"Window Move Motion"
],
[
"sw-header--logo-slot",
"Logo Slot"
],
[
"sw-header--document-dropdown",
"Document Dropdown"
],
[
"sw-header--responsive-more",
"Responsive More"
],
[
"sw-header--k-guide",
"K Guide"
],
[
"sw-header--property-panel-compare",
"Property Panel · 4개 비교"
]
]
Binary file not shown.

After

Width:  |  Height:  |  Size: 56 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 56 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 29 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 43 KiB

File diff suppressed because it is too large. Load diff
@@ -0,0 +1,106 @@
{
"total": 329,
"sw": [
{
"id": "sw-header--composed-controls",
"name": "Dropdown",
"title": "SW/Header",
"tags": [
"dev",
"test",
"manifest"
]
},
{
"id": "sw-header--detail-buttons",
"name": "Detail Buttons (Shared States)",
"title": "SW/Header",
"tags": [
"dev",
"test",
"manifest",
"verification"
]
},
{
"id": "sw-header--overview",
"name": "Overview",
"title": "SW/Header",
"tags": [
"dev",
"test",
"manifest"
]
},
{
"id": "sw-header--interactive-states",
"name": "Interactive States",
"title": "SW/Header",
"tags": [
"dev",
"test",
"manifest"
]
},
{
"id": "sw-header--window-move-motion",
"name": "Window Move Motion",
"title": "SW/Header",
"tags": [
"dev",
"test",
"manifest"
]
},
{
"id": "sw-header--logo-slot",
"name": "Logo Slot",
"title": "SW/Header",
"tags": [
"dev",
"test",
"manifest"
]
},
{
"id": "sw-header--document-dropdown",
"name": "Document Dropdown",
"title": "SW/Header",
"tags": [
"dev",
"test",
"manifest"
]
},
{
"id": "sw-header--responsive-more",
"name": "Responsive More",
"title": "SW/Header",
"tags": [
"dev",
"test",
"manifest"
]
},
{
"id": "sw-header--k-guide",
"name": "K Guide",
"title": "SW/Header",
"tags": [
"dev",
"test",
"manifest"
]
},
{
"id": "sw-header--property-panel-compare",
"name": "Property Panel · 4개 비교",
"title": "SW/Header",
"tags": [
"dev",
"test",
"manifest"
]
}
]
}
@@ -0,0 +1,114 @@
{
"status": "PASS",
"commit": "5faa1f1ffe89eb7aeb4aaec81ac5bb2d0f4fced9",
"notLf": [],
"buildCommit": "5faa1f1ffe89eb7aeb4aaec81ac5bb2d0f4fced9+reproducibility-check",
"runs": [
{
"checkout": "LF",
"path": "C:\\Users\\user\\AppData\\Local\\Temp\\claude\\D---------HMDesign-SW\\9f00c085-5295-455b-8864-1b75de666f9d\\scratchpad\\repro-final\\lf",
"attempt": 1,
"tarball": "hm-design-sw-0.2.0.tgz",
"tarballSha256": "e98cc5eda023d135cac4d3d30b545461016e3f63a90bf9558b999fddf3982506",
"fileCount": 29
},
{
"checkout": "LF",
"path": "C:\\Users\\user\\AppData\\Local\\Temp\\claude\\D---------HMDesign-SW\\9f00c085-5295-455b-8864-1b75de666f9d\\scratchpad\\repro-final\\lf",
"attempt": 2,
"tarball": "hm-design-sw-0.2.0.tgz",
"tarballSha256": "e98cc5eda023d135cac4d3d30b545461016e3f63a90bf9558b999fddf3982506",
"fileCount": 29
},
{
"checkout": "LF",
"path": "C:\\Users\\user\\AppData\\Local\\Temp\\claude\\D---------HMDesign-SW\\9f00c085-5295-455b-8864-1b75de666f9d\\scratchpad\\repro-final\\deeper\\path\\lf",
"attempt": 1,
"tarball": "hm-design-sw-0.2.0.tgz",
"tarballSha256": "e98cc5eda023d135cac4d3d30b545461016e3f63a90bf9558b999fddf3982506",
"fileCount": 29
},
{
"checkout": "LF",
"path": "C:\\Users\\user\\AppData\\Local\\Temp\\claude\\D---------HMDesign-SW\\9f00c085-5295-455b-8864-1b75de666f9d\\scratchpad\\repro-final\\deeper\\path\\lf",
"attempt": 2,
"tarball": "hm-design-sw-0.2.0.tgz",
"tarballSha256": "e98cc5eda023d135cac4d3d30b545461016e3f63a90bf9558b999fddf3982506",
"fileCount": 29
},
{
"checkout": "CRLF",
"path": "C:\\Users\\user\\AppData\\Local\\Temp\\claude\\D---------HMDesign-SW\\9f00c085-5295-455b-8864-1b75de666f9d\\scratchpad\\repro-final\\crlf-copy",
"attempt": 1,
"tarball": "hm-design-sw-0.2.0.tgz",
"tarballSha256": "2e1b8ee4048a7ce579dc2fdc3d420309315bae7f4d8cef85db30bf2adbabaec1",
"fileCount": 29
},
{
"checkout": "CRLF",
"path": "C:\\Users\\user\\AppData\\Local\\Temp\\claude\\D---------HMDesign-SW\\9f00c085-5295-455b-8864-1b75de666f9d\\scratchpad\\repro-final\\crlf-copy",
"attempt": 2,
"tarball": "hm-design-sw-0.2.0.tgz",
"tarballSha256": "2e1b8ee4048a7ce579dc2fdc3d420309315bae7f4d8cef85db30bf2adbabaec1",
"fileCount": 29
}
],
"referenceFiles": {
"dist/build-info.json": "efd00e884702f6a30b322ad03f7cf18ab146ad1e74f68640ee5e7e3ae1dbd34a",
"dist/components/sw-header/components/SWHeaderActions.d.ts": "c572d028522a56ac4bf1a5d7eb3d6e260b718fa3cac197d87757ec49f508af34",
"dist/components/sw-header/components/SWHeaderColorMenu.d.ts": "ff361ed274150c32a8a6931b31348b85de0463db642bd8c6af3c1bbb79fa5fda",
"dist/components/sw-header/components/SWHeaderDocumentTitle.d.ts": "ca96a9b886740d5b68b852d7494c35fe139c22df74f4fd13d342638a1b6ea439",
"dist/components/sw-header/components/SWHeaderDropdown.d.ts": "06ce5aa914826b6dc85df923a24baded80d16f43aebce39845f5b18d9d996504",
"dist/components/sw-header/components/SWHeaderField.d.ts": "741fdd1b0e7da4cf8f7adeaec021eb4eb103d7312f34e80135d00c3510159901",
"dist/components/sw-header/components/SWHeaderFields.d.ts": "43950332583b4c74231a793e18651b45494165626cc45e3dfcf50169ec189edc",
"dist/components/sw-header/components/SWHeaderHome.d.ts": "8696aa8f79f6e248ab5eacff363c180d382e58d2c37400cdf26a2446d43a6d3f",
"dist/components/sw-header/components/SWHeaderInput.d.ts": "6b379ee70b9bcbf6e9a0808ca891b86838a9bfa355bfa12f036088b26241dd9c",
"dist/components/sw-header/components/SWHeaderKGuide.d.ts": "093b413bf398f0172596469d6fb5b40f254fb2dbc9b141bd143d7ef9e2127f42",
"dist/components/sw-header/components/SWHeaderLayerIcons.d.ts": "84cf3ca7f8c89d679bcaa407790ce450d978a93be93e5de03caa029333d27fb0",
"dist/components/sw-header/components/SWHeaderLayerMenu.d.ts": "0fb65b14f52cd2abf54e74ea09ed4b783fe1665416dfd910bd6cd7d3e1995711",
"dist/components/sw-header/components/SWHeaderLineStyleMenu.d.ts": "d8ca8fc2543a1313793ceaa0e9e852f04dd6107027b2c51efcc080db60c34d29",
"dist/components/sw-header/components/SWHeaderMore.d.ts": "eba0b89eade44dd384db6d3da016c5b0c8b0544bed269918fbeb091dbdb93430",
"dist/components/sw-header/components/SWHeaderProperties.d.ts": "20ae22aac2d49c546d23c726ce5f210bd0f89024d60f24b2d75d9eba9524704f",
"dist/components/sw-header/components/SWHeaderPropertyBar.d.ts": "38fcf8305edfa6ff15917520cdbb446ac69d5200b17f5524304d106b8aeb7b91",
"dist/components/sw-header/components/SWHeaderPropertyFields.d.ts": "1277b0f3df27eac1f21c4ffb5554b95ed122d280b171f691259c50d7bbb7a037",
"dist/components/sw-header/components/SWHeaderPropertyPanel.d.ts": "dddffda48785d8fffc6d9c90f759f3287e939375cfc86887b1a9f75458d04309",
"dist/components/sw-header/components/SWHeaderStyleListMenus.d.ts": "6bbcf310fda8deed5c607fc85e8fb730b84c743a5a85be68d2549afa0341891d",
"dist/components/sw-header/components/SWHeaderWindowControls.d.ts": "db8bfbd14340e03c28e407f58fc08cef55b9eef49f406ba53fc50e994f5f0834",
"dist/components/sw-header/index.d.ts": "7f9a5677f64ae26ae97906b32425ba8fa22cd64d5d8e239a67cc44ef7ce85688",
"dist/components/sw-header/SWHeader.d.ts": "3adac1db372451d9f86a6f6df1df0e9696cd40c3ed7945531ee378da122136d8",
"dist/components/sw-header/types.d.ts": "5cafbb6ba475e988fe9aa0eca0eefd620c68e2c79e134e949d342df8ee3e9448",
"dist/components/sw-popup/SWPopup.d.ts": "c19e8372931cb81187c306c22c25a2e47bcfe3f3f25f849d458f972d87d361e8",
"dist/components/sw-theme/SWTheme.d.ts": "cdcc2e7c4b80241afa4d0b7c3da671b7086c16f9b9c231c1927c931757e4244c",
"dist/components/sw-tool/SWTool.d.ts": "23b1eb156578cd3f1dee325afbd81988d88c4a3f421f7350a0e8c47c652e804c",
"dist/index.d.ts": "d185a69b7bf04400a6c114d2694bf853b367d20e168f5a78cfbb78ce04aa21a6",
"dist/index.js": "363c9b3e0cff61306ac183a91d11241ef9acbed850efbda0948c2ac5a9d93a1d",
"dist/styles.css": "4c419e9776c51f9cce0f33fa7b9064f839f4a87311a3d3f8d2712eba3ed1c7d7"
},
"differences": [
{
"run": "LF #2",
"tarballSame": true,
"differentFiles": []
},
{
"run": "LF #1",
"tarballSame": true,
"differentFiles": []
},
{
"run": "LF #2",
"tarballSame": true,
"differentFiles": []
},
{
"run": "CRLF #1",
"tarballSame": false,
"differentFiles": []
},
{
"run": "CRLF #2",
"tarballSame": false,
"differentFiles": []
}
]
}
@@ -0,0 +1,683 @@
{
"browser": "155.0.8059.80",
"checks": [
{
"name": "sw-first: every SVG/PNG asset decodes",
"status": "PASS",
"data": 54
},
{
"name": "sw-first F: Open next to the logo with documentOpenLabel",
"status": "PASS"
},
{
"name": "sw-first F: Open calls onDocumentOpen",
"status": "PASS",
"data": "document:open"
},
{
"name": "sw-first F: document dropdown without + New and Open (both hidden or placed)",
"status": "PASS"
},
{
"name": "sw-first F: layer rows have no freeze / lock buttons",
"status": "PASS"
},
{
"name": "sw-first F: Model / Layout radio group by keyboard",
"status": "PASS",
"data": "view:layout"
},
{
"name": "sw-first F: 2.5D toggle",
"status": "PASS"
},
{
"name": "sw-first F: Fit pill",
"status": "PASS"
},
{
"name": "sw-first F 640px: Open moved into More (measured), works there, no overflow",
"status": "PASS",
"data": {
"narrow": {
"open": 0,
"overflow": 0,
"height": 49
},
"inMore": true
}
},
{
"name": "sw-first F 1920px again: Open returns next to the logo",
"status": "PASS"
},
{
"name": "sw-first E: SW popup frame (314, #E4DBC9, #A67D03)",
"status": "PASS",
"data": {
"w": 314,
"bg": "rgb(228, 219, 201)",
"border": "rgb(166, 125, 3)"
}
},
{
"name": "sw-first E: row input commits",
"status": "PASS",
"data": "name:평면도-02"
},
{
"name": "sw-first E: layer dropdown inside the popup is a fixed overlay",
"status": "PASS"
},
{
"name": "sw-first E: layer selection callback",
"status": "PASS",
"data": "layer:dim"
},
{
"name": "sw-first UI in popup: Switch",
"status": "PASS",
"data": "ui:snap:false"
},
{
"name": "sw-first UI in popup: Select (portal)",
"status": "PASS",
"data": "ui:unit:cm"
},
{
"name": "sw-first UI in popup: Slider",
"status": "PASS",
"data": "ui:opacity:70"
},
{
"name": "sw-first UI in popup: Button",
"status": "PASS",
"data": "ui:apply"
},
{
"name": "sw-first Escape outside closes only the last used popup",
"status": "PASS",
"data": "ui:close"
},
{
"name": "sw-first Escape inside a popup closes that popup",
"status": "PASS",
"data": "popup:close"
},
{
"name": "ui-first: every SVG/PNG asset decodes",
"status": "PASS",
"data": 54
},
{
"name": "ui-first F: Open next to the logo with documentOpenLabel",
"status": "PASS"
},
{
"name": "ui-first F: Open calls onDocumentOpen",
"status": "PASS",
"data": "document:open"
},
{
"name": "ui-first F: document dropdown without + New and Open (both hidden or placed)",
"status": "PASS"
},
{
"name": "ui-first F: layer rows have no freeze / lock buttons",
"status": "PASS"
},
{
"name": "ui-first F: Model / Layout radio group by keyboard",
"status": "PASS",
"data": "view:layout"
},
{
"name": "ui-first F: 2.5D toggle",
"status": "PASS"
},
{
"name": "ui-first F: Fit pill",
"status": "PASS"
},
{
"name": "ui-first F 640px: Open moved into More (measured), works there, no overflow",
"status": "PASS",
"data": {
"narrow": {
"open": 0,
"overflow": 0,
"height": 49
},
"inMore": true
}
},
{
"name": "ui-first F 1920px again: Open returns next to the logo",
"status": "PASS"
},
{
"name": "ui-first E: SW popup frame (314, #E4DBC9, #A67D03)",
"status": "PASS",
"data": {
"w": 314,
"bg": "rgb(228, 219, 201)",
"border": "rgb(166, 125, 3)"
}
},
{
"name": "ui-first E: row input commits",
"status": "PASS",
"data": "name:평면도-02"
},
{
"name": "ui-first E: layer dropdown inside the popup is a fixed overlay",
"status": "PASS"
},
{
"name": "ui-first E: layer selection callback",
"status": "PASS",
"data": "layer:dim"
},
{
"name": "ui-first UI in popup: Switch",
"status": "PASS",
"data": "ui:snap:false"
},
{
"name": "ui-first UI in popup: Select (portal)",
"status": "PASS",
"data": "ui:unit:cm"
},
{
"name": "ui-first UI in popup: Slider",
"status": "PASS",
"data": "ui:opacity:70"
},
{
"name": "ui-first UI in popup: Button",
"status": "PASS",
"data": "ui:apply"
},
{
"name": "ui-first Escape outside closes only the last used popup",
"status": "PASS",
"data": "ui:close"
},
{
"name": "ui-first Escape inside a popup closes that popup",
"status": "PASS",
"data": "popup:close"
},
{
"name": "stylesheet order (SW first / UI first) changes no computed SW or UI style",
"status": "PASS",
"data": {
"differences": [],
"missing": []
}
},
{
"name": "no page/console errors",
"status": "PASS",
"data": []
}
],
"errors": [],
"styles": {
"sw-first": {
"header": {
"w": 1920,
"h": 49,
"background-color": "rgb(6, 6, 6)",
"background-image": "none",
"border-top": "0px solid rgb(154, 146, 132)",
"border-radius": "0px",
"box-shadow": "none",
"color": "rgb(246, 244, 242)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "14px",
"font-weight": "400",
"padding": "0px",
"margin": "0px"
},
"field": {
"w": 234,
"h": 38,
"background-color": "rgba(0, 0, 0, 0)",
"background-image": "linear-gradient(0deg, rgba(0, 0, 0, 0.45) 0%, rgba(0, 0, 0, 0.45) 26.41%, rgba(0, 0, 0, 0.4) 70%, rgba(0, 0, 0, 0.45) 100%)",
"border-top": "1px solid rgb(8, 37, 28)",
"border-radius": "3px",
"box-shadow": "rgba(9, 39, 30, 0.7) 0px 1px 4px 0px",
"color": "rgb(246, 244, 242)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "14px",
"font-weight": "400",
"padding": "0px 10px 0px 12px",
"margin": "0px"
},
"documentButton": {
"w": 310,
"h": 48,
"background-color": "rgba(0, 0, 0, 0)",
"background-image": "linear-gradient(rgb(8, 24, 19) 0%, rgb(9, 39, 30) 8.69%, rgb(11, 50, 39) 25.43%, rgb(14, 61, 47) 51.25%, rgb(11, 50, 39) 80.03%, rgb(10, 43, 33) 89.76%, rgb(8, 24, 19) 100%)",
"border-top": "1px solid rgb(14, 76, 58)",
"border-radius": "0px",
"box-shadow": "none",
"color": "rgb(240, 247, 245)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "14px",
"font-weight": "700",
"padding": "0px 12px 0px 5px",
"margin": "0px"
},
"toggle": {
"w": 78,
"h": 19,
"background-color": "rgba(0, 0, 0, 0)",
"background-image": "none",
"border-top": "0px none rgb(246, 244, 242)",
"border-radius": "2px",
"box-shadow": "none",
"color": "rgb(246, 244, 242)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "14px",
"font-weight": "700",
"padding": "0px",
"margin": "0px"
},
"open": {
"w": 77.6,
"h": 48,
"background-color": "rgba(0, 0, 0, 0)",
"background-image": "linear-gradient(rgb(8, 24, 19) 0%, rgb(9, 39, 30) 8.69%, rgb(11, 50, 39) 25.43%, rgb(14, 61, 47) 51.25%, rgb(11, 50, 39) 80.03%, rgb(10, 43, 33) 89.76%, rgb(8, 24, 19) 100%)",
"border-top": "1px solid rgb(14, 76, 58)",
"border-radius": "0px",
"box-shadow": "none",
"color": "rgb(240, 247, 245)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "14px",
"font-weight": "700",
"padding": "0px 12px 0px 5px",
"margin": "0px"
},
"toolText": {
"w": 61.1,
"h": 19,
"background-color": "rgba(0, 0, 0, 0)",
"background-image": "none",
"border-top": "0px none rgb(255, 198, 0)",
"border-radius": "2px",
"box-shadow": "none",
"color": "rgb(255, 198, 0)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "14px",
"font-weight": "700",
"padding": "0px 8px",
"margin": "0px"
},
"toolPill": {
"w": 40,
"h": 38,
"background-color": "rgba(0, 0, 0, 0)",
"background-image": "linear-gradient(rgb(8, 24, 19) 0%, rgb(9, 39, 30) 8.69%, rgb(11, 50, 39) 25.43%, rgb(14, 61, 47) 51.25%, rgb(11, 50, 39) 80.03%, rgb(10, 43, 33) 89.76%, rgb(8, 24, 19) 100%)",
"border-top": "1px solid rgb(8, 37, 28)",
"border-radius": "2px",
"box-shadow": "none",
"color": "rgb(246, 244, 242)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "14px",
"font-weight": "400",
"padding": "0px",
"margin": "0px"
},
"popup": {
"w": 314,
"h": 306,
"background-color": "rgb(228, 219, 201)",
"background-image": "none",
"border-top": "1px solid rgb(166, 125, 3)",
"border-radius": "4px",
"box-shadow": "rgb(0, 0, 0) 0px 0px 0px 1px inset",
"color": "rgb(0, 0, 0)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "14px",
"font-weight": "400",
"padding": "0px",
"margin": "0px"
},
"popupTitle": {
"w": 261,
"h": 16,
"background-color": "rgba(0, 0, 0, 0)",
"background-image": "none",
"border-top": "0px solid rgb(154, 146, 132)",
"border-radius": "0px",
"box-shadow": "none",
"color": "rgb(255, 198, 0)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "14px",
"font-weight": "700",
"padding": "0px 4px 0px 0px",
"margin": "0px 0px 0px 7px"
},
"popupRow": {
"w": 292,
"h": 32,
"background-color": "rgba(0, 0, 0, 0)",
"background-image": "none",
"border-top": "0px solid rgb(154, 146, 132)",
"border-radius": "0px",
"box-shadow": "none",
"color": "rgb(0, 0, 0)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "14px",
"font-weight": "400",
"padding": "0px 6px",
"margin": "0px"
},
"popupInput": {
"w": 184,
"h": 26,
"background-color": "rgba(0, 0, 0, 0)",
"background-image": "none",
"border-top": "0px none rgb(230, 4, 3)",
"border-radius": "0px",
"box-shadow": "none",
"color": "rgb(230, 4, 3)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "14px",
"font-weight": "500",
"padding": "0px",
"margin": "0px"
},
"searchInput": {
"w": 66.8,
"h": 20,
"background-color": "rgba(0, 0, 0, 0)",
"background-image": "none",
"border-top": "0px none rgb(230, 4, 3)",
"border-radius": "2px",
"box-shadow": "none",
"color": "rgb(230, 4, 3)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "14px",
"font-weight": "700",
"padding": "2px 4px 2px 6px",
"margin": "0px"
},
"uiButton": {
"w": 298,
"h": 28,
"background-color": "rgba(0, 0, 0, 0)",
"background-image": "linear-gradient(rgb(31, 130, 101) 0%, rgb(22, 92, 71) 30%, rgb(17, 72, 56) 65%, rgb(8, 36, 28) 100%), linear-gradient(rgb(10, 34, 29) 0%, rgb(52, 218, 170) 50%, rgb(8, 36, 28) 100%)",
"border-top": "1px solid rgba(0, 0, 0, 0)",
"border-radius": "4px",
"box-shadow": "rgba(0, 0, 0, 0) 0px 0px 0px 0px, color(srgb 1 1 1 / 0.1) 0px 1px 1px 0px inset, color(srgb 0 0 0 / 0.25) 0px -1px 2px 0px inset, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px",
"color": "rgb(255, 255, 255)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", sans-serif",
"font-size": "12px",
"font-weight": "700",
"padding": "3.5px 10px",
"margin": "0px"
},
"uiSwitch": {
"w": 36,
"h": 20,
"background-color": "rgb(38, 102, 81)",
"background-image": "none",
"border-top": "0px none rgb(0, 0, 0)",
"border-radius": "9999px",
"box-shadow": "none",
"color": "rgb(0, 0, 0)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "14px",
"font-weight": "400",
"padding": "0px",
"margin": "0px"
},
"uiSelect": {
"w": 86.2,
"h": 44,
"background-color": "rgb(255, 255, 255)",
"background-image": "none",
"border-top": "1px solid rgb(222, 219, 210)",
"border-radius": "4px",
"box-shadow": "none",
"color": "rgb(10, 34, 29)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "16px",
"font-weight": "400",
"padding": "0px 12px",
"margin": "0px"
}
},
"ui-first": {
"header": {
"w": 1920,
"h": 49,
"background-color": "rgb(6, 6, 6)",
"background-image": "none",
"border-top": "0px solid rgb(154, 146, 132)",
"border-radius": "0px",
"box-shadow": "none",
"color": "rgb(246, 244, 242)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "14px",
"font-weight": "400",
"padding": "0px",
"margin": "0px"
},
"field": {
"w": 234,
"h": 38,
"background-color": "rgba(0, 0, 0, 0)",
"background-image": "linear-gradient(0deg, rgba(0, 0, 0, 0.45) 0%, rgba(0, 0, 0, 0.45) 26.41%, rgba(0, 0, 0, 0.4) 70%, rgba(0, 0, 0, 0.45) 100%)",
"border-top": "1px solid rgb(8, 37, 28)",
"border-radius": "3px",
"box-shadow": "rgba(9, 39, 30, 0.7) 0px 1px 4px 0px",
"color": "rgb(246, 244, 242)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "14px",
"font-weight": "400",
"padding": "0px 10px 0px 12px",
"margin": "0px"
},
"documentButton": {
"w": 310,
"h": 48,
"background-color": "rgba(0, 0, 0, 0)",
"background-image": "linear-gradient(rgb(8, 24, 19) 0%, rgb(9, 39, 30) 8.69%, rgb(11, 50, 39) 25.43%, rgb(14, 61, 47) 51.25%, rgb(11, 50, 39) 80.03%, rgb(10, 43, 33) 89.76%, rgb(8, 24, 19) 100%)",
"border-top": "1px solid rgb(14, 76, 58)",
"border-radius": "0px",
"box-shadow": "none",
"color": "rgb(240, 247, 245)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "14px",
"font-weight": "700",
"padding": "0px 12px 0px 5px",
"margin": "0px"
},
"toggle": {
"w": 78,
"h": 19,
"background-color": "rgba(0, 0, 0, 0)",
"background-image": "none",
"border-top": "0px none rgb(246, 244, 242)",
"border-radius": "2px",
"box-shadow": "none",
"color": "rgb(246, 244, 242)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "14px",
"font-weight": "700",
"padding": "0px",
"margin": "0px"
},
"open": {
"w": 77.6,
"h": 48,
"background-color": "rgba(0, 0, 0, 0)",
"background-image": "linear-gradient(rgb(8, 24, 19) 0%, rgb(9, 39, 30) 8.69%, rgb(11, 50, 39) 25.43%, rgb(14, 61, 47) 51.25%, rgb(11, 50, 39) 80.03%, rgb(10, 43, 33) 89.76%, rgb(8, 24, 19) 100%)",
"border-top": "1px solid rgb(14, 76, 58)",
"border-radius": "0px",
"box-shadow": "none",
"color": "rgb(240, 247, 245)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "14px",
"font-weight": "700",
"padding": "0px 12px 0px 5px",
"margin": "0px"
},
"toolText": {
"w": 61.1,
"h": 19,
"background-color": "rgba(0, 0, 0, 0)",
"background-image": "none",
"border-top": "0px none rgb(255, 198, 0)",
"border-radius": "2px",
"box-shadow": "none",
"color": "rgb(255, 198, 0)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "14px",
"font-weight": "700",
"padding": "0px 8px",
"margin": "0px"
},
"toolPill": {
"w": 40,
"h": 38,
"background-color": "rgba(0, 0, 0, 0)",
"background-image": "linear-gradient(rgb(8, 24, 19) 0%, rgb(9, 39, 30) 8.69%, rgb(11, 50, 39) 25.43%, rgb(14, 61, 47) 51.25%, rgb(11, 50, 39) 80.03%, rgb(10, 43, 33) 89.76%, rgb(8, 24, 19) 100%)",
"border-top": "1px solid rgb(8, 37, 28)",
"border-radius": "2px",
"box-shadow": "none",
"color": "rgb(246, 244, 242)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "14px",
"font-weight": "400",
"padding": "0px",
"margin": "0px"
},
"popup": {
"w": 314,
"h": 306,
"background-color": "rgb(228, 219, 201)",
"background-image": "none",
"border-top": "1px solid rgb(166, 125, 3)",
"border-radius": "4px",
"box-shadow": "rgb(0, 0, 0) 0px 0px 0px 1px inset",
"color": "rgb(0, 0, 0)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "14px",
"font-weight": "400",
"padding": "0px",
"margin": "0px"
},
"popupTitle": {
"w": 261,
"h": 16,
"background-color": "rgba(0, 0, 0, 0)",
"background-image": "none",
"border-top": "0px solid rgb(154, 146, 132)",
"border-radius": "0px",
"box-shadow": "none",
"color": "rgb(255, 198, 0)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "14px",
"font-weight": "700",
"padding": "0px 4px 0px 0px",
"margin": "0px 0px 0px 7px"
},
"popupRow": {
"w": 292,
"h": 32,
"background-color": "rgba(0, 0, 0, 0)",
"background-image": "none",
"border-top": "0px solid rgb(154, 146, 132)",
"border-radius": "0px",
"box-shadow": "none",
"color": "rgb(0, 0, 0)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "14px",
"font-weight": "400",
"padding": "0px 6px",
"margin": "0px"
},
"popupInput": {
"w": 184,
"h": 26,
"background-color": "rgba(0, 0, 0, 0)",
"background-image": "none",
"border-top": "0px none rgb(230, 4, 3)",
"border-radius": "0px",
"box-shadow": "none",
"color": "rgb(230, 4, 3)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "14px",
"font-weight": "500",
"padding": "0px",
"margin": "0px"
},
"searchInput": {
"w": 66.8,
"h": 20,
"background-color": "rgba(0, 0, 0, 0)",
"background-image": "none",
"border-top": "0px none rgb(230, 4, 3)",
"border-radius": "2px",
"box-shadow": "none",
"color": "rgb(230, 4, 3)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "14px",
"font-weight": "700",
"padding": "2px 4px 2px 6px",
"margin": "0px"
},
"uiButton": {
"w": 298,
"h": 28,
"background-color": "rgba(0, 0, 0, 0)",
"background-image": "linear-gradient(rgb(31, 130, 101) 0%, rgb(22, 92, 71) 30%, rgb(17, 72, 56) 65%, rgb(8, 36, 28) 100%), linear-gradient(rgb(10, 34, 29) 0%, rgb(52, 218, 170) 50%, rgb(8, 36, 28) 100%)",
"border-top": "1px solid rgba(0, 0, 0, 0)",
"border-radius": "4px",
"box-shadow": "rgba(0, 0, 0, 0) 0px 0px 0px 0px, color(srgb 1 1 1 / 0.1) 0px 1px 1px 0px inset, color(srgb 0 0 0 / 0.25) 0px -1px 2px 0px inset, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px",
"color": "rgb(255, 255, 255)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", sans-serif",
"font-size": "12px",
"font-weight": "700",
"padding": "3.5px 10px",
"margin": "0px"
},
"uiSwitch": {
"w": 36,
"h": 20,
"background-color": "rgb(38, 102, 81)",
"background-image": "none",
"border-top": "0px none rgb(0, 0, 0)",
"border-radius": "9999px",
"box-shadow": "none",
"color": "rgb(0, 0, 0)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "14px",
"font-weight": "400",
"padding": "0px",
"margin": "0px"
},
"uiSelect": {
"w": 86.2,
"h": 44,
"background-color": "rgb(255, 255, 255)",
"background-image": "none",
"border-top": "1px solid rgb(222, 219, 210)",
"border-radius": "4px",
"box-shadow": "none",
"color": "rgb(10, 34, 29)",
"font-family": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif",
"font-size": "16px",
"font-weight": "400",
"padding": "0px 12px",
"margin": "0px"
}
}
}
}
Binary file not shown.

After

Width:  |  Height:  |  Size: 187 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 187 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 40 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 31 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 32 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 25 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

@@ -0,0 +1,276 @@
{
"checks": [
{
"name": "1 all SVG/PNG assets decode (data URI, no external path)",
"status": "PASS",
"data": {
"count": 33,
"broken": []
}
},
{
"name": "1 styles.css loaded; SWTheme provides tokens",
"status": "PASS",
"data": {
"height": "49px",
"font": "\"Noto Sans KR\", \"Malgun Gothic\", \"Apple SD Gothic Neo\", sans-serif"
}
},
{
"name": "2 A default header 1920 geometry = Figma (49 / 0·80 / 65·310 / 377·1301 / 1680·240)",
"status": "PASS",
"data": {
"header": {
"x": 0,
"y": 0,
"w": 1920,
"h": 49
},
"home": {
"x": 0,
"y": 0,
"w": 80,
"h": 48
},
"document": {
"x": 65,
"y": 0,
"w": 310,
"h": 48
},
"object": {
"x": 377,
"y": 0,
"w": 1301,
"h": 48
},
"window": {
"x": 1680,
"y": 0,
"w": 240,
"h": 48
}
}
},
{
"name": "2 A layer dropdown select callback",
"status": "PASS",
"data": "layer:center"
},
{
"name": "2 A close callback",
"status": "PASS",
"data": "close"
},
{
"name": "3 B order Logo → File → Layer → Color → K (DOM)",
"status": "PASS",
"data": [
"뷰어 홈",
"hm-sw-header__document",
"레이어",
"색상",
"팝업 가이드"
]
},
{
"name": "3 B sizes keep SW rules (bar 49, home 80 overlapping file 15px, fields 234/192 x 38)",
"status": "PASS",
"data": {
"bar": {
"x": 0,
"y": 409,
"w": 1920,
"h": 49
},
"home": {
"x": 0,
"y": 409,
"w": 80,
"h": 48
},
"document": {
"x": 65,
"y": 409,
"w": 310,
"h": 48
},
"layer": {
"x": 382,
"y": 414,
"w": 234,
"h": 38
},
"color": {
"x": 620,
"y": 414,
"w": 192,
"h": 38
}
}
},
{
"name": "3 B document dropdown New callback",
"status": "PASS",
"data": "document:new"
},
{
"name": "3 B layer dropdown opens under the field",
"status": "PASS",
"data": "true"
},
{
"name": "3 B Escape closes and returns focus to the field",
"status": "PASS",
"data": null
},
{
"name": "3 B color chip callback (dropdown stays open)",
"status": "PASS",
"data": "color:red"
},
{
"name": "3 B K guide preview on hover (animation frame advances)",
"status": "PASS",
"data": {
"guide": true
}
},
{
"name": "3 B K click callback",
"status": "PASS",
"data": "popupGuide"
},
{
"name": "4 C order File → 선 → 문자 → 치수 → 인쇄",
"status": "PASS",
"data": [
"file",
"선스타일",
"문자스타일",
"치수스타일",
"인쇄"
]
},
{
"name": "4 C first file well has a left edge (consumer wrapper)",
"status": "PASS",
"data": "1px"
},
{
"name": "4 C line type callback + field value",
"status": "PASS",
"data": "lineType:center"
},
{
"name": "4 C text style callback + field value",
"status": "PASS",
"data": "textStyle:dotum"
},
{
"name": "4 C dimension style callback",
"status": "PASS",
"data": "dimensionStyle:iso"
},
{
"name": "4 C print callback",
"status": "PASS",
"data": "print"
},
{
"name": "5 D new search field matches the SW field surface (height/top/border/radius/background/shadow/label)",
"status": "PASS",
"data": {
"layer": {
"h": 38,
"top": 1232,
"border": "1px rgb(8, 37, 28)",
"radius": "3px",
"bg": "linear-gradient(0deg, rgba(0, 0, 0, 0.45",
"shadow": "rgba(9, 39, 30, 0.7) 0px 1px 4px 0px"
},
"search": {
"h": 38,
"top": 1232,
"border": "1px rgb(8, 37, 28)",
"radius": "3px",
"bg": "linear-gradient(0deg, rgba(0, 0, 0, 0.45",
"shadow": "rgba(9, 39, 30, 0.7) 0px 1px 4px 0px"
},
"label": "12px",
"fieldLabel": "12px"
}
},
{
"name": "5 D hover ring like existing fields (edge turns yellow, inside unchanged)",
"status": "PASS",
"data": {
"ring": "1",
"before": {
"inside": [
18,
50,
39
],
"edge": [
8,
37,
28
]
},
"after": {
"inside": [
18,
50,
39
],
"edge": [
172,
131,
3
]
}
}
},
{
"name": "5 D Enter commits through SWHeaderInput → search callback",
"status": "PASS",
"data": "search:WALL-01"
},
{
"name": "5 D search button callback uses committed value",
"status": "PASS",
"data": "search:WALL-01"
},
{
"name": "5 D Escape restores the committed value",
"status": "PASS",
"data": "WALL-01"
},
{
"name": "5 D existing color dropdown in the same bar",
"status": "PASS",
"data": "color:blue"
},
{
"name": "6 B Tab order = display order",
"status": "PASS",
"data": [
"문서: C0020101-006-평면및종단면도(06)",
"레이어",
"색상",
"팝업 가이드"
]
},
{
"name": "7 no page/console errors",
"status": "PASS",
"data": []
}
],
"errors": [],
"warnings": [
"Canvas2D: Multiple readback operations using getImageData are faster with the willReadFrequently attribute set to true. See: https://html.spec.whatwg.org/multipage/canvas.html#concept-canvas-will-read-frequently",
"Canvas2D: Multiple readback operations using getImageData are faster with the willReadFrequently attribute set to true. See: https://html.spec.whatwg.org/multipage/canvas.html#concept-canvas-will-read-frequently"
]
}
@@ -0,0 +1,152 @@
[
{
"type": "story",
"subtype": "story",
"id": "sw-header--composed-controls",
"name": "Dropdown",
"title": "SW/Header",
"importPath": "./src/sw/sw-header-dropdown.stories.tsx",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "ComposedControls"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--detail-buttons",
"name": "Detail Buttons (Shared States)",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest",
"verification"
],
"exportName": "DetailButtons"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--overview",
"name": "Overview",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "Overview"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--interactive-states",
"name": "Interactive States",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "InteractiveStates"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--window-move-motion",
"name": "Window Move Motion",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "WindowMoveMotion"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--logo-slot",
"name": "Logo Slot",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "LogoSlot"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--document-dropdown",
"name": "Document Dropdown",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "DocumentDropdown"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--responsive-more",
"name": "Responsive More",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "ResponsiveMore"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--k-guide",
"name": "K Guide",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "KGuide"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-panel-compare",
"name": "Property Panel · 4개 비교",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyPanelCompare"
}
]
@@ -0,0 +1,423 @@
[
{
"type": "story",
"subtype": "story",
"id": "sw-header--detail-buttons",
"name": "Detail Buttons (Shared States)",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest",
"verification"
],
"exportName": "DetailButtons"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--overview",
"name": "Overview",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "Overview"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--interactive-states",
"name": "Interactive States",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "InteractiveStates"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--window-move-motion",
"name": "Window Move Motion",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "WindowMoveMotion"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--composed-controls",
"name": "Composed Controls",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "ComposedControls"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--logo-slot",
"name": "Logo Slot",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "LogoSlot"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--document-dropdown",
"name": "Document Dropdown",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "DocumentDropdown"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--layer-dropdown",
"name": "Layer Dropdown",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "LayerDropdown"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--color-dropdown",
"name": "Color Dropdown",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "ColorDropdown"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--line-style-dropdown",
"name": "Line Style Dropdown",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "LineStyleDropdown"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--text-dimension-style-dropdown",
"name": "Text · Dimension Style Dropdown",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "TextDimensionStyleDropdown"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--responsive-more",
"name": "Responsive More",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "ResponsiveMore"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--layer-detail-input",
"name": "Layer Detail · Input",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "LayerDetailInput"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-panel",
"name": "Property Panel",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyPanel"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-panel-variants",
"name": "Property Panel Variants",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyPanelVariants"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--k-guide",
"name": "K Guide",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "KGuide"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--additional-hover",
"name": "Additional Hover",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "AdditionalHover"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-bar",
"name": "Property Bar",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyBar"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--dynamic-controls",
"name": "Dynamic Controls",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "DynamicControls"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--colorize",
"name": "Colorize",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "Colorize"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--composition",
"name": "Composition (Visibility · Order)",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "Composition"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-panel-none",
"name": "Property Panel · 선택 없음",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyPanelNone"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-panel-all",
"name": "Property Panel · 전체 선택",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyPanelAll"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-panel-circle",
"name": "Property Panel · 원 1개",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyPanelCircle"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-panel-expanded",
"name": "Property Panel · 모두 펼침",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyPanelExpanded"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-panel-compare",
"name": "Property Panel · 4개 비교",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyPanelCompare"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-shape-slot",
"name": "Property Panel · 형상 Slot",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyShapeSlot"
},
{
"type": "story",
"subtype": "story",
"id": "sw-header--property-fields",
"name": "Property Panel · 필드 13개",
"title": "SW/Header",
"importPath": "./src/sw/sw-header.stories.tsx",
"componentPath": "./packages/sw/dist/index.js",
"tags": [
"dev",
"test",
"manifest"
],
"exportName": "PropertyFields"
}
]
@@ -0,0 +1,657 @@
{
"baseCommit": "50bf5bda8e956a4973b923d64131f2f2285bd38c",
"checks": [
{
"name": "24 retained Story IDs, names and tags; only approved Dropdown retirements",
"status": "FAIL"
},
{
"name": "retained non-Overview declarations byte-identical; relocated composition separately verified",
"status": "FAIL"
},
{
"name": "retired Dropdown IDs absent",
"status": "PASS"
},
{
"name": "package production source untouched except the integrated-improvement files",
"status": "PASS",
"data": []
},
{
"name": "16:9 fitted to both Inner dimensions at 1920x1080",
"status": "PASS",
"data": {
"stage": {
"x": 360,
"y": 264.25,
"w": 1200,
"h": 675,
"right": 1560,
"bottom": 939.25
},
"slot": {
"x": 360,
"y": 169.5,
"w": 1200,
"h": 864.5,
"right": 1560,
"bottom": 1034
},
"header": {
"x": 360,
"y": 264.25,
"w": 1200,
"h": 49,
"right": 1560,
"bottom": 313.25
},
"viewport": {
"w": 1920,
"h": 1080
},
"overflow": 0
}
},
{
"name": "16:9 fitted to both Inner dimensions at 1440x900",
"status": "PASS",
"data": {
"stage": {
"x": 120,
"y": 174.25,
"w": 1200,
"h": 675,
"right": 1320,
"bottom": 849.25
},
"slot": {
"x": 120,
"y": 169.5,
"w": 1200,
"h": 684.5,
"right": 1320,
"bottom": 854
},
"header": {
"x": 120,
"y": 174.25,
"w": 1200,
"h": 49,
"right": 1320,
"bottom": 223.25
},
"viewport": {
"w": 1440,
"h": 900
},
"overflow": 0
}
},
{
"name": "16:9 fitted to both Inner dimensions at 1280x720",
"status": "PASS",
"data": {
"stage": {
"x": 191.5625,
"y": 169.5,
"w": 896.875,
"h": 504.5,
"right": 1088.4375,
"bottom": 674
},
"slot": {
"x": 38.40625,
"y": 169.5,
"w": 1203.1875,
"h": 504.5,
"right": 1241.59375,
"bottom": 674
},
"header": {
"x": 191.5625,
"y": 169.5,
"w": 896.875,
"h": 49,
"right": 1088.4375,
"bottom": 218.5
},
"viewport": {
"w": 1280,
"h": 720
},
"overflow": 0
}
},
{
"name": "16:9 fitted to both Inner dimensions at 768x600",
"status": "PASS",
"data": {
"stage": {
"x": 42.21875,
"y": 169.5,
"w": 683.546875,
"h": 384.5,
"right": 725.765625,
"bottom": 554
},
"slot": {
"x": 23.046875,
"y": 169.5,
"w": 721.90625,
"h": 384.5,
"right": 744.953125,
"bottom": 554
},
"header": {
"x": 42.21875,
"y": 169.5,
"w": 683.546875,
"h": 49,
"right": 725.765625,
"bottom": 218.5
},
"viewport": {
"w": 768,
"h": 600
},
"overflow": 0
}
},
{
"name": "16:9 fitted to both Inner dimensions at 390x844",
"status": "PASS",
"data": {
"stage": {
"x": 16,
"y": 383.0625,
"w": 358,
"h": 201.375,
"right": 374,
"bottom": 584.4375
},
"slot": {
"x": 16,
"y": 169.5,
"w": 358,
"h": 628.5,
"right": 374,
"bottom": 798
},
"header": {
"x": 16,
"y": 383.0625,
"w": 390,
"h": 49,
"right": 406,
"bottom": 432.0625
},
"viewport": {
"w": 390,
"h": 844
},
"overflow": 0
}
},
{
"name": "16:9 fitted to both Inner dimensions at 1000x500",
"status": "PASS",
"data": {
"stage": {
"x": 247.109375,
"y": 169.5,
"w": 505.765625,
"h": 284.5,
"right": 752.875,
"bottom": 454
},
"slot": {
"x": 30,
"y": 169.5,
"w": 940,
"h": 284.5,
"right": 970,
"bottom": 454
},
"header": {
"x": 247.109375,
"y": 169.5,
"w": 505.765625,
"h": 49,
"right": 752.875,
"bottom": 218.5
},
"viewport": {
"w": 1000,
"h": 500
},
"overflow": 0
}
},
{
"name": "one Header and no duplicate fixed Figma specimen",
"status": "PASS"
},
{
"name": "document selection updates Header and Callback",
"status": "PASS",
"data": "onDocumentClick → documentOpen(true) → onDocumentSelect(doc-2) → documentOpen(false)"
},
{
"name": "layer selection updates shared data",
"status": "PASS",
"data": "onDocumentClick → documentOpen(true) → onDocumentSelect(doc-2) → documentOpen(false) → onLayerOpen → onLayerSelect(layer, CC-D GNL)"
},
{
"name": "existing layer Detail callback closes list",
"status": "PASS"
},
{
"name": "color selection invokes host callback",
"status": "PASS",
"data": "onLayerOpen → onLayerSelect(layer, CC-D GNL) → onLayerOpen → onLayerDetail → onColorOpen → onColorSelect(color, 255,255,255)"
},
{
"name": "line selection updates Header",
"status": "PASS",
"data": "onLayerOpen → onLayerDetail → onColorOpen → onColorSelect(color, 255,255,255) → onLineStyleOpen → onLineTypeSelect(line, CENTER)"
},
{
"name": "ByLayer weight mode does not turn numeric property into a mode string",
"status": "PASS"
},
{
"name": "text style selection updates Header",
"status": "PASS",
"data": "onColorSelect(color, 255,255,255) → onLineStyleOpen → onLineTypeSelect(line, CENTER) → onLineWeightSelect(w-bylayer) → onTextStyleOpen → onTextStyleSelect(dotum)"
},
{
"name": "dimension style selection updates Header",
"status": "PASS",
"data": "onLineTypeSelect(line, CENTER) → onLineWeightSelect(w-bylayer) → onTextStyleOpen → onTextStyleSelect(dotum) → onDimensionStyleOpen → onDimensionStyleSelect(iso-25)"
},
{
"name": "opening another dropdown closes the previous one",
"status": "PASS"
},
{
"name": "Escape closes Header dropdown",
"status": "PASS"
},
{
"name": "outside click closes Header dropdown",
"status": "PASS"
},
{
"name": "Bar Enter commits state",
"status": "PASS"
},
{
"name": "Bar validates min=0",
"status": "PASS"
},
{
"name": "Bar Escape cancels edit",
"status": "PASS"
},
{
"name": "Header opens panel with same Bar value",
"status": "PASS"
},
{
"name": "numeric weight property remains numeric after ByLayer mode",
"status": "PASS"
},
{
"name": "Header layer value shared with panel",
"status": "PASS"
},
{
"name": "panel edit updates the Bar",
"status": "PASS"
},
{
"name": "panel number validation rejects negative radius",
"status": "PASS"
},
{
"name": "panel Layer dropdown updates Header shared value",
"status": "PASS"
},
{
"name": "panel line dropdown updates Header shared value",
"status": "PASS"
},
{
"name": "panel color dropdown updates Header shared value",
"status": "PASS"
},
{
"name": "panel RGB validation rejects out-of-range value",
"status": "PASS"
},
{
"name": "gauge keyboard editing commits host state",
"status": "PASS"
},
{
"name": "first Escape cancels draft and retains panel",
"status": "PASS"
},
{
"name": "next Escape closes panel and restores Header focus",
"status": "PASS"
},
{
"name": "panel Close button restores focus",
"status": "PASS"
},
{
"name": "external Props update Bar",
"status": "PASS"
},
{
"name": "Bar ReadOnly",
"status": "PASS"
},
{
"name": "Bar Disabled",
"status": "PASS"
},
{
"name": "dynamic Bar field added",
"status": "PASS"
},
{
"name": "dynamic field shared with panel",
"status": "PASS"
},
{
"name": "dynamic field removed from both",
"status": "PASS"
},
{
"name": "shape Slot can be empty without changing panel structure",
"status": "PASS"
},
{
"name": "original panel size none:314x256",
"status": "PASS",
"data": {
"x": 1000,
"y": 301.25,
"width": 314,
"height": 256
}
},
{
"name": "original panel size all:314x361",
"status": "PASS",
"data": {
"x": 1000,
"y": 301.25,
"width": 314,
"height": 361
}
},
{
"name": "original panel size circle:314x658",
"status": "PASS",
"data": {
"x": 1000,
"y": 301.25,
"width": 314,
"height": 658
}
},
{
"name": "original panel size expanded:314x754",
"status": "PASS",
"data": {
"x": 1000,
"y": 301.25,
"width": 314,
"height": 754
}
},
{
"name": "expanded popup bottom accessible through internal scroll",
"status": "PASS"
},
{
"name": "small Inner reaches full popup bottom with native Header and popup dimensions",
"status": "PASS",
"data": {
"top": 630,
"left": 16,
"height": 201,
"scrollHeight": 831,
"width": 358,
"scrollWidth": 390
}
},
{
"name": "narrow popup Escape restores More focus",
"status": "PASS"
},
{
"name": "actual Storybook manager iframe fits its own Inner",
"status": "PASS",
"data": {
"width": 1071.59375,
"height": 602.765625,
"slotWidth": 1071.59375,
"slotHeight": 744.5,
"viewportWidth": 1140,
"viewportHeight": 960
}
},
{
"name": "no browser errors",
"status": "PASS",
"data": []
}
],
"errors": [],
"sizes": [
{
"stage": {
"x": 360,
"y": 264.25,
"w": 1200,
"h": 675,
"right": 1560,
"bottom": 939.25
},
"slot": {
"x": 360,
"y": 169.5,
"w": 1200,
"h": 864.5,
"right": 1560,
"bottom": 1034
},
"header": {
"x": 360,
"y": 264.25,
"w": 1200,
"h": 49,
"right": 1560,
"bottom": 313.25
},
"viewport": {
"w": 1920,
"h": 1080
},
"overflow": 0
},
{
"stage": {
"x": 120,
"y": 174.25,
"w": 1200,
"h": 675,
"right": 1320,
"bottom": 849.25
},
"slot": {
"x": 120,
"y": 169.5,
"w": 1200,
"h": 684.5,
"right": 1320,
"bottom": 854
},
"header": {
"x": 120,
"y": 174.25,
"w": 1200,
"h": 49,
"right": 1320,
"bottom": 223.25
},
"viewport": {
"w": 1440,
"h": 900
},
"overflow": 0
},
{
"stage": {
"x": 191.5625,
"y": 169.5,
"w": 896.875,
"h": 504.5,
"right": 1088.4375,
"bottom": 674
},
"slot": {
"x": 38.40625,
"y": 169.5,
"w": 1203.1875,
"h": 504.5,
"right": 1241.59375,
"bottom": 674
},
"header": {
"x": 191.5625,
"y": 169.5,
"w": 896.875,
"h": 49,
"right": 1088.4375,
"bottom": 218.5
},
"viewport": {
"w": 1280,
"h": 720
},
"overflow": 0
},
{
"stage": {
"x": 42.21875,
"y": 169.5,
"w": 683.546875,
"h": 384.5,
"right": 725.765625,
"bottom": 554
},
"slot": {
"x": 23.046875,
"y": 169.5,
"w": 721.90625,
"h": 384.5,
"right": 744.953125,
"bottom": 554
},
"header": {
"x": 42.21875,
"y": 169.5,
"w": 683.546875,
"h": 49,
"right": 725.765625,
"bottom": 218.5
},
"viewport": {
"w": 768,
"h": 600
},
"overflow": 0
},
{
"stage": {
"x": 16,
"y": 383.0625,
"w": 358,
"h": 201.375,
"right": 374,
"bottom": 584.4375
},
"slot": {
"x": 16,
"y": 169.5,
"w": 358,
"h": 628.5,
"right": 374,
"bottom": 798
},
"header": {
"x": 16,
"y": 383.0625,
"w": 390,
"h": 49,
"right": 406,
"bottom": 432.0625
},
"viewport": {
"w": 390,
"h": 844
},
"overflow": 0
},
{
"stage": {
"x": 247.109375,
"y": 169.5,
"w": 505.765625,
"h": 284.5,
"right": 752.875,
"bottom": 454
},
"slot": {
"x": 30,
"y": 169.5,
"w": 940,
"h": 284.5,
"right": 970,
"bottom": 454
},
"header": {
"x": 247.109375,
"y": 169.5,
"w": 505.765625,
"h": 49,
"right": 752.875,
"bottom": 218.5
},
"viewport": {
"w": 1000,
"h": 500
},
"overflow": 0
}
],
"browser": "155.0.8059.80",
"managerOrder": [
"sw-header--composed-controls",
"sw-header--overview",
"sw-header--interactive-states",
"sw-header--window-move-motion",
"sw-header--logo-slot",
"sw-header--document-dropdown",
"sw-header--responsive-more",
"sw-header--k-guide",
"sw-header--property-panel-compare"
],
"status": "FAIL"
}
@@ -0,0 +1,11 @@
[
"sw-header--composed-controls",
"sw-header--overview",
"sw-header--interactive-states",
"sw-header--window-move-motion",
"sw-header--logo-slot",
"sw-header--document-dropdown",
"sw-header--responsive-more",
"sw-header--k-guide",
"sw-header--property-panel-compare"
]
Binary file not shown.

After

Width:  |  Height:  |  Size: 106 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 72 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 58 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 218 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 30 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 94 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 95 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 63 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 93 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 80 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 81 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 79 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 81 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 223 KiB

@@ -0,0 +1,38 @@
[
[
"sw-header--composed-controls",
"Dropdown"
],
[
"sw-header--overview",
"Overview"
],
[
"sw-header--interactive-states",
"Interactive States"
],
[
"sw-header--window-move-motion",
"Window Move Motion"
],
[
"sw-header--logo-slot",
"Logo Slot"
],
[
"sw-header--document-dropdown",
"Document Dropdown"
],
[
"sw-header--responsive-more",
"Responsive More"
],
[
"sw-header--k-guide",
"K Guide"
],
[
"sw-header--property-panel-compare",
"Property Panel · 4개 비교"
]
]
Binary file not shown.

After

Width:  |  Height:  |  Size: 56 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 56 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 29 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 43 KiB

File diff suppressed because it is too large. Load diff
@@ -0,0 +1,106 @@
{
"total": 336,
"sw": [
{
"id": "sw-header--composed-controls",
"name": "Dropdown",
"title": "SW/Header",
"tags": [
"dev",
"test",
"manifest"
]
},
{
"id": "sw-header--detail-buttons",
"name": "Detail Buttons (Shared States)",
"title": "SW/Header",
"tags": [
"dev",
"test",
"manifest",
"verification"
]
},
{
"id": "sw-header--overview",
"name": "Overview",
"title": "SW/Header",
"tags": [
"dev",
"test",
"manifest"
]
},
{
"id": "sw-header--interactive-states",
"name": "Interactive States",
"title": "SW/Header",
"tags": [
"dev",
"test",
"manifest"
]
},
{
"id": "sw-header--window-move-motion",
"name": "Window Move Motion",
"title": "SW/Header",
"tags": [
"dev",
"test",
"manifest"
]
},
{
"id": "sw-header--logo-slot",
"name": "Logo Slot",
"title": "SW/Header",
"tags": [
"dev",
"test",
"manifest"
]
},
{
"id": "sw-header--document-dropdown",
"name": "Document Dropdown",
"title": "SW/Header",
"tags": [
"dev",
"test",
"manifest"
]
},
{
"id": "sw-header--responsive-more",
"name": "Responsive More",
"title": "SW/Header",
"tags": [
"dev",
"test",
"manifest"
]
},
{
"id": "sw-header--k-guide",
"name": "K Guide",
"title": "SW/Header",
"tags": [
"dev",
"test",
"manifest"
]
},
{
"id": "sw-header--property-panel-compare",
"name": "Property Panel · 4개 비교",
"title": "SW/Header",
"tags": [
"dev",
"test",
"manifest"
]
}
]
}
Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 224 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 41 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 36 KiB

File diff suppressed because it is too large. Load diff
Binary file not shown.

After

Width:  |  Height:  |  Size: 30 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 240 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 50 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 58 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 39 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 35 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 25 KiB

@@ -0,0 +1,146 @@
{
"total": 28,
"same": 28,
"results": [
{
"file": "composed-controls-1920.png",
"status": "SAME",
"changed": 0
},
{
"file": "detail-buttons-1920.png",
"status": "SAME",
"changed": 0
},
{
"file": "document-dropdown-1920.png",
"status": "SAME",
"changed": 0
},
{
"file": "interactive-states-1920.png",
"status": "SAME",
"changed": 0
},
{
"file": "k-guide-1920.png",
"status": "SAME",
"changed": 0
},
{
"file": "logo-slot-1920.png",
"status": "SAME",
"changed": 0
},
{
"file": "overview-1080.png",
"status": "SAME",
"changed": 0
},
{
"file": "overview-1180.png",
"status": "SAME",
"changed": 0
},
{
"file": "overview-1440.png",
"status": "SAME",
"changed": 0
},
{
"file": "overview-1800.png",
"status": "SAME",
"changed": 0
},
{
"file": "overview-1920.png",
"status": "SAME",
"changed": 0
},
{
"file": "overview-390.png",
"status": "SAME",
"changed": 0
},
{
"file": "overview-520.png",
"status": "SAME",
"changed": 0
},
{
"file": "overview-640.png",
"status": "SAME",
"changed": 0
},
{
"file": "overview-768.png",
"status": "SAME",
"changed": 0
},
{
"file": "overview-900.png",
"status": "SAME",
"changed": 0
},
{
"file": "property-panel-compare-1920.png",
"status": "SAME",
"changed": 0
},
{
"file": "responsive-more-1080.png",
"status": "SAME",
"changed": 0
},
{
"file": "responsive-more-1180.png",
"status": "SAME",
"changed": 0
},
{
"file": "responsive-more-1440.png",
"status": "SAME",
"changed": 0
},
{
"file": "responsive-more-1800.png",
"status": "SAME",
"changed": 0
},
{
"file": "responsive-more-1920.png",
"status": "SAME",
"changed": 0
},
{
"file": "responsive-more-390.png",
"status": "SAME",
"changed": 0
},
{
"file": "responsive-more-520.png",
"status": "SAME",
"changed": 0
},
{
"file": "responsive-more-640.png",
"status": "SAME",
"changed": 0
},
{
"file": "responsive-more-768.png",
"status": "SAME",
"changed": 0
},
{
"file": "responsive-more-900.png",
"status": "SAME",
"changed": 0
},
{
"file": "window-move-motion-1920.png",
"status": "SAME",
"changed": 0
}
]
}
+2
View File
@@ -1,5 +1,7 @@
# SW Header 사용 가이드
> **0.2.0 통합 개선(2026-10-19):** 로고 오른쪽 파일 열기(`documentOpenPlacement="header"`, `documentOpenLabel` 재사용, 실측 기반 More 이동), `leading` 슬롯, 하위 항목 숨김(`hiddenControls`의 `documentNew`·`documentOpen`·`layerFreeze`·`layerLock`), 도구 막대 `SWToolButton` / `SWToolGroup`, 속성창 프레임 `SWPopup`(자유 `children`)과 `SWHeaderPropertyPanel`의 `children`·`title`을 추가했습니다. API·예제는 패키지 [AI 카탈로그](../../packages/sw/ai/COMPONENT_CATALOG.md)와 [조합 패턴](../../packages/sw/ai/COMPOSITION_PATTERNS.md), Story는 `SW / Header / Options`·`SW / Tool`·`SW / Popup`, 검증은 [통합 개선 기록](./sw-integrated-improvement-2026-10-19.md)을 따릅니다.
> **현재 기준 색인(2026-10-19 1차 정리):** 아래 날짜별 안내 중 최신 항목이 같은 주제의 이전 설명보다 우선합니다. 속성 필드 13개·필드 Dropdown(`picker`·`menus`·`decimals`)은 [속성창·K 가이드 추가 연결](#속성창k-가이드-추가-연결-2026-10-16)의 2026-10-19 항목, 표시·숨김(`hiddenControls`)·메뉴 순서(`menuOrder`)·속성창 4상태·형상 Slot은 [3차 절](#구성요소-표시메뉴-순서속성창-4상태형상-slot-2026-10-16-3차), 속성Bar·`controls`·Colorize는 [후속 절](#후속-5개-요구사항-연결-2026-10-16)을 봅니다. 현재 Storybook 33개 목록은 [§12](#12-storybook)와 [1차 정리 보고](./sw-first-pass-cleanup-review-2026-10-19.md)에 있습니다.
> **상세 버튼 최신 기준(2026-10-16):** 레이어·색상·선·문자·치수 상세는 문자스타일 디자인의 `SWHeaderMenuDetail`을 공통 사용합니다. `on*Detail` 미전달 시 Hover 유지·클릭 무동작이며, Callback 전달 시 기존 1회 호출·닫힘·Focus 복귀를 유지합니다. 내부 공통 컴포넌트는 `label`, `icon`, `onClick`, `disabled`, `className`, `aria-label` 등 native 버튼 Props를 지원합니다. 새 공개 export는 추가하지 않았습니다. 비교 Story는 `SW/Header → Detail Buttons (Shared States)`(verification 태그, 직접 ID `sw-header--detail-buttons`)입니다. 과거의 Callback 미전달=Disabled 및 치수만 밝은 Hover 설명보다 이 기준이 우선합니다. [이번 검증 기록](./sw-header-detail-buttons-verification-2026-10-16.md).
@@ -0,0 +1,78 @@
# SW 패키지 통합 개선 구현·검증 기록 (2026-10-19)
- 대상: `@hm-design/sw` 0.1.0 → **0.2.0**, 브랜치 `feature/sw-package`, 기준 Commit `5faa1f1`(작업 시작 시 로컬 = 원격).
- 범위: 승인된 통합 계획 1~8단계(빌드 재현성, 숨김 API, 도구 버튼, 로고 옆 파일 열기·실측 반응형, `SWPopup` 자유 콘텐츠·Escape 스택, Popup 안 Dropdown, 조합형 반응형, 문서·Storybook·소비 검증).
- Commit·Push·Publish 없음. 증거: [integrated-improvement-qa/](./integrated-improvement-qa/).
## 1. 단계별 결과
| 단계 | 내용 | 판정 |
|---|---|---|
| 1 빌드 재현성 | 원인: 체크아웃 줄바꿈. 작업 폴더의 `ai/`·README 등 16개 파일이 CRLF였고(`core.autocrlf=true`), CSS에 base64로 들어가는 SVG도 CRLF 체크아웃이면 바이트가 달라짐. `//#region` 경로는 경로가 달라도 동일(원인 아님). 조치: `build.mjs`가 dist 텍스트를 LF로 정규화하고 `dist/build-info.json`(commit, dirty, vite·rolldown·typescript 버전, 시각 없음) 기록, `packages/sw/.gitattributes`(`eol=lf`), 작업 폴더 16개 파일 LF 변환(내용 diff 없음), 0.2.0 | PASS |
| 2 숨김 API | `hiddenControls`에 `documentNew`·`documentOpen`·`layerFreeze`·`layerLock`(`SWHeaderSubControlId`). 하위 Props `showNew`/`showOpen`, `showFreeze`/`showLock`, 속성창 `menus.showLayerFreeze`/`showLayerLock`. 동결·잠금은 20px 자리 유지 + 그리지 않음(가짜 버튼 없음). 하위 항목 숨김은 레이아웃 모드·Breakpoint를 바꾸지 않음 | PASS |
| 3 도구 버튼 | `SWToolButton`(`text` = 속성Bar/속성창 토글, `pill` = 인쇄·K, `document` = 파일명 면), `SWToolGroup`(`text` 상세보기 묶음 / `pill`, `selection="single"` radiogroup). 새 디자인 값 없음 | PASS |
| 4 파일 열기 | `documentOpenPlacement="header"`: Home 바로 뒤에 `hm-sw-header__document-button` 면으로 Open, Dropdown Open 숨김, `onDocumentOpen`·`documentOpenLabel` 재사용. `leading` 슬롯. 측정 폭을 `--hm-sw-header-leading-width`로 파일명 clamp에서 빼고, Open이 보이는 동안 다른 필드는 줄지 않게 해 실제 넘침이 생기면 Open을 More로 이동(되돌릴 때 Open 폭 히스테리시스). D-1 12px 여백 | PASS |
| 5 SWPopup | 속성창 프레임을 `SWPopupFrame`(내부)으로 분리해 `SWPopup`과 `SWHeaderPropertyPanel`이 같은 DOM 사용. `children`·`title`·`autoFocus`, `selection`/`properties`/`groups` 선택형. Escape 스택(안 = 그 Popup, 밖 = 최근 사용 Popup 하나, `defaultPrevented` 존중), autoFocus 시 안에서 닫히면 Focus 복귀 | PASS |
| 6 Popup 안 Dropdown | 실측: 짧은 Popup에서 레이어 목록이 본문 경계에서 잘림 확인 → 속성창 Picker의 고정 위치 계산을 `useSWFixedDropdownPosition`으로 추출해 Picker와 공개 Dropdown 5종이 공유(중복 구현 없음). `SWPopupSection` / `SWPopupRow` 추가 | PASS |
| 7 조합형 반응형 | 새 More 로직 없음. `SWHeader`의 `controls`·`documentOpenPlacement`·`leading`·`tools`로 조합형 구성이 기존 More·실측 판단을 그대로 사용. `SWTheme` 직접 배치에는 More 없음(문서화) | PARTIAL(도구 막대 자체는 More로 이동하지 않음, §6) |
| 8 문서·Storybook·소비 검증 | AI 가이드 4종·예제 E/F·README·사용 가이드, Story 3개 파일(7 Story), 독립 소비 프로젝트(SW + HM UI) | PASS |
## 2. 추가·변경 공개 API (모두 선택, 기본 동작 동일)
| 대상 | 추가 |
|---|---|
| `SWHeader` | `documentOpenPlacement?: "menu" \| "header"`, `leading?: ReactNode`, `hiddenControls`의 `SWHeaderSubControlId` 4개 |
| `SWHeaderDocumentTitle` | `showNew`, `showOpen`(둘 다 false → 하단 없음, 문서도 없으면 Dropdown 없음) |
| `SWHeaderLayerMenu` · `SWHeaderLayerControl` | `showFreeze`, `showLock` |
| `SWHeaderPropertyPanel` | `children`, `title`, `autoFocus`, `selection`·`properties`·`groups` 선택형, `menus.showLayerFreeze`/`showLayerLock` |
| 신규 | `SWPopup`, `SWPopupSection`, `SWPopupRow`, `SWToolButton`, `SWToolGroup` 및 `*Props`, `SWToolButtonAppearance`, `SWHeaderSubControlId` |
| 내부(비공개) | `SWPopupFrame`, `useSWFixedDropdownPosition`, `SWHeaderMore.forceVisible` |
호환성: 기존 Props·Export 제거·이름 변경 없음. 동작 변경은 Escape 하나(여러 Popup이 동시에 열린 경우 바깥 Escape가 모두가 아니라 최근 사용 Popup 하나만 닫음, Popup 안에서 이미 처리된 Escape 무시). Header 단일 속성창의 Escape 닫기·Focus 복귀는 기존 overview 회귀로 확인.
## 3. 기존 디자인 유지
- 기존 SW Story 10개 × 1920 + Overview·Responsive More × 9개 폭 = 28장, 변경 전 기준선과 **픽셀 단위 28/28 동일**(threshold 0, 기준선 자체 2회 캡처 28/28 동일). [compare-result](./integrated-improvement-qa/visual-diff/compare-result.json)
- 소비 프로젝트에서 SW·HM UI CSS 순서를 바꿔도(SW 먼저 / UI 먼저) 대표 SW·UI 요소 15종 computed style 동일. Tailwind 4 preflight는 `@layer base`, SW CSS는 layer 밖이라 충돌 없음.
## 4. 반응형 (Chrome, 실측)
| 폭 | 1920 | 1800 | 1440 | 1180 | 1080 | 900 | 768 | 640 | 520 | 390 |
|---|---|---|---|---|---|---|---|---|---|---|
| 기본 Header + Open: Open | 표시 | 표시 | 표시 | 표시 | 표시 | 표시 | 표시 | 표시 | More | More |
| 파일명 폭(px) | 250 | 190 | 310 | 120 | 120 | 120 | 179 | 96 | 103 | 96 |
| 레이어 필드(px) | 234 | 234 | 234 | 234 | 234 | 234 | 234 | 234 | 234 | 113 |
| 조합형(controls) Open | 표시 | 표시 | 표시 | 표시 | 표시 | 표시 | More | More | More | More |
- 모든 폭: Header 49px, 막대·객체 영역 넘침 ≤ 1px, 부품 겹침 없음, 오른쪽 끝 밖으로 나가는 부품 없음, More의 Open 실행 확인.
- 히스테리시스: 520 → 1080 확대 시 600px에서 한 번만 복귀(깜빡임 없음). D-2는 고정 640px 대신 실측으로 결정(기본 520 미만·조합형 768 이하에서 이동).
- 사선 접점: Open은 기존 파일명과 같은 위치(로고 오른쪽 − 15px, 48px)에서 시작, 파일명은 Open 뒤에서 12px 여백. 조합형(`SWHeaderHome` → `SWToolButton document` → `SWHeaderDocumentTitle`)도 같은 값.
## 5. Popup 자유 콘텐츠·Dropdown
- `SWPopup` 3종 프레임 = 속성창 프레임(314, `#E4DBC9`, `#A67D03`, 4px, 제목 `#FFC600`, 제목줄 30, dialog / aria-modal=false) 동일.
- children: SW `SWHeaderInput` 행(확정·잘못된 값 복원), compact 41px 필드, 읽기 전용 행, SW 레이어·색상 Dropdown, HM UI Switch·Select(Portal)·Slider·Button 모두 동작. 기존 `SWHeaderPropertyPanel`에 children 추가 시 그룹 뒤 같은 본문에 배치.
- Dropdown: Popup 안에서 `position: fixed`로 필드 바로 아래 열림, Popup 밖으로 나가도 끝까지 보임(elementFromPoint), Escape는 Dropdown만 닫음.
- 여러 Popup: 편집 중 Input Escape = 편집 취소만, Popup 안 Escape = 그 Popup만, 바깥 Escape = 최근 사용(Focus·클릭) Popup 하나. 긴 콘텐츠는 본문 스크롤로 마지막 행 도달.
## 6. 남은 문제·미검증
- **[미해결] 좁은 화면에서 문서명·레이어 필드가 사라짐:** `tools`·`leading`의 소비 콘텐츠(`SWToolGroup` 포함)는 More로 이동하지 않고 폭을 유지합니다. 그래서 넓은 도구 막대가 있으면 `controls` 필드가 대신 줄어듭니다. 예제 F(도구 237px) 실측: 1080px에서 Open은 More로 이동, 640px 문서명 64 · 레이어 93px, 520px 33 · 48px, **390px 문서명·레이어 필드 폭 0(사실상 사라짐)**. 막대 넘침은 없지만 필드를 쓸 수 없습니다. 도구 막대 항목을 More로 옮기는 기능이 필요하며 이번 범위에서는 해결하지 않았습니다(해결 계획: 커밋 보고 §남은 문제 1).
- **Popup 안 Header Dropdown 외형:** 동작은 정상이지만 어두운 Header 필드가 밝은 Popup 면 위에 그대로 그려집니다(디자인 미정). 행 모양 선택이 필요하면 속성창 `picker`.
- **디자인 미확정 보류:** `SWToolStatus`, Popup 하단 버튼(적용·취소) 전용 스타일.
- `index.ts`의 `SWHeaderSubControlId` export 한 줄은 다른 세션(Figma 병렬 작업)이 같은 폴더에 같은 내용으로 추가한 것으로 보이며, 이 계획과 같아 유지했습니다.
- NOT VERIFIED: Firefox·Safari, 실제 모바일 기기, 스크린 리더 음성, 실제 Registry publish, Popup `anchorRef` 경로의 새 Story(기존 Header 속성창 경로는 overview 회귀로 확인).
## 7. 실행한 검증
| 검증 | 결과 |
|---|---|
| `tsc -b`(루트) / `npm run typecheck -w @hm-design/sw` | exit 0 / exit 0 |
| [integrated-improvement.browser.mjs](../../packages/sw/tests/integrated-improvement.browser.mjs) (옵션·조합형·도구·Popup) | 97/97 PASS, 콘솔 오류 0 |
| [integrated-consumer.mjs](../../packages/sw/tests/integrated-consumer.mjs) + browser (React 19.3 · TS 7.0 · Vite 8.3 · Tailwind 4.3, SW + UI Tarball, CSS 2순서) | tsc·build 성공, 42/42 PASS |
| 기존 A~D 소비([ai-template-consumer](../../packages/sw/tests/ai-template-consumer.mjs)) | 27/27 PASS |
| [ai-docs.check.mjs](../../packages/sw/tests/ai-docs.check.mjs) | 21/21 PASS(예제 E·F 포함) |
| [integrated-visual.browser.mjs](../../packages/sw/tests/integrated-visual.browser.mjs) | 28/28 픽셀 동일 |
| [build-reproducibility.mjs](../../packages/sw/tests/build-reproducibility.mjs) | PASS: LF 2경로 × 2회 dist·Tarball 동일(`e98cc5ed…`), CRLF 복사본 dist 동일, 비-LF 파일 0 |
| storybook-unused-removal / overview(기존 회귀) | 처음 실행 78/81 · 51/54: 6건 중 4건은 이 작업이 의도적으로 바꾼 범위 단언(Story 수 329 → 336, SW 소스·AI 문서), 2건은 변경 전 기준선에서도 실패하던 overview 과거 단언. 4건은 검사 의미를 유지해 범위를 갱신(SW/Header 10개·다른 항목 동일, 추가는 승인된 7개 Story만, 다른 패키지·설정·자산 무변경, SW 변경은 통합 개선 파일 목록 안에서만) → **81/81 · 52/54**. 남은 2건은 기준선과 동일 |
| font-weight 정책 테스트 | 3/3 PASS |
+1 -1
View File
@@ -10725,7 +10725,7 @@
},
"packages/sw": {
"name": "@hm-design/sw",
"version": "0.1.0",
"version": "0.2.0",
"peerDependencies": {
"react": "^19.0.0",
"react-dom": "^19.0.0"
Loaded 100 of 138 files, more files were not shown because too many files have changed in this diff. Show more