SW Viewer Header (approved optional props, public export names unchanged at 170): - SWViewerHeader: logoMenu, documents, activeDocumentId, onDocumentSelect, onDocumentOpen, documentOpenLabel; measured responsive toggles (full -> icons -> More) with the SWHeader More / file-list styling. - SW AI guides, ExampleH, viewer/text-weight/theme-inheritance tests and the logo-document-menu tests with their QA record. SW Storybook cleanup (Story IDs and test fixtures kept): - Sidebar: Overview -> "SW Header" (first), 전체 Footer -> "SW Footer", Footer/Viewer responsive pages -> "Responsive More", Viewer content-variants -> "Settings Popup" (merges the settings popup page). - Hidden by the verification tag (direct URL kept): Header Dropdown, Document Open, Interactive States, Document Dropdown, Hidden Sub Controls, Home Menu standalone; Footer tool groups / custom content / parts; SW/Theme; Viewer menu groups / item states / variable size / settings panel / Header + Dropdown. - Removed demo UI: Overview size and callback output (demo data and selection only with &verification), Home Menu Figma node table and width demo, Header Responsive More reduced to 1440 / 768 / 390, Popup reopen button, property-panel comparison captions, Viewer context-menu demo (&verification only). - Tests: storybook-inventory records the hidden and renamed Stories; overview / range-cross-browser / viewer open the demo controls with &verification; integrated-popup reloads the Story instead of the reopen button; dropdown-consolidation asserts Dropdown is hidden from the sidebar and still opens by its direct URL.
450 lines
17 KiB
JSON
450 lines
17 KiB
JSON
{
|
|
"base": "http://127.0.0.1:6040",
|
|
"checks": [
|
|
{
|
|
"n": "SWHeader ... menu opens (reference colors)",
|
|
"ok": true,
|
|
"d": {
|
|
"colors": {
|
|
"background": "rgb(14, 61, 47)",
|
|
"border": "rgb(19, 86, 67)",
|
|
"shadow": "rgba(0, 0, 0, 0.5) 0px 4px 12px 0px",
|
|
"item": "rgb(246, 244, 242)"
|
|
},
|
|
"metrics": {
|
|
"border": "1px solid",
|
|
"radius": "3px",
|
|
"padding": "4px 4px",
|
|
"minWidth": "200px",
|
|
"font": "14px/normal 400",
|
|
"itemHeight": 32,
|
|
"itemInset": 5,
|
|
"itemPadding": "10px 10px",
|
|
"itemGap": "12px",
|
|
"itemRadius": "2px",
|
|
"itemFont": "Noto Sans KR 14px/normal 400"
|
|
}
|
|
}
|
|
},
|
|
{
|
|
"n": "SWHeader ... menu Escape closes, focus back on ...",
|
|
"ok": true
|
|
},
|
|
{
|
|
"n": "SWViewerMenu reference opens (36px rows, 4px padding)",
|
|
"ok": true,
|
|
"d": {
|
|
"border": "1px solid",
|
|
"radius": "4px",
|
|
"padding": "4px 4px",
|
|
"minWidth": "160px",
|
|
"font": "14px/20px 400",
|
|
"itemHeight": 36,
|
|
"itemInset": 5,
|
|
"itemPadding": "12px 12px",
|
|
"itemGap": "8px",
|
|
"itemRadius": "2px",
|
|
"itemFont": "Noto Sans KR 14px/20px 400"
|
|
}
|
|
},
|
|
{
|
|
"n": "logo opens no dropdown",
|
|
"ok": true,
|
|
"d": {
|
|
"menu": false,
|
|
"list": false,
|
|
"nameExpanded": "false",
|
|
"name": "C0060202-001-평면및종단면도.dwg",
|
|
"focus": "Name\n Description\n Default\n Control \n \n \n \n \n propertyName*\n \n This is a short description\n \n summary\n \n \n \n defaultValue\n \n Set string\n \n \n propertyName*\n \n This is a short description\n \n summary\n \n \n \n defaultValue\n \n Set string\n \n \n propertyName*\n \n This is a short description\n \n summary\n \n \n \n defaultValue\n \n Set string\n \n \n \n\n\n\n \n No Preview\n Sorry, but you either have no stories or none are selected somehow.\n \n Please check the Storybook config.\n Try reloading the page.\n \n \n If the problem persists, check the browser console, or the terminal you've run Storybook from.\n \n \n\n\n\n \n \n \n The component failed to render properly, likely due to a configuration issue in Storybook.\n Here are some common causes and how you can address them:\n \n \n \n Missing Context/Providers: You can use decorators to supply specific\n contexts or providers, which are sometimes necessary for components to render correctly. For\n detailed instructions on using decorators, please visit the\n Decorators documentation.\n \n \n Misconfigured Webpack or Vite: Verify that Storybook picks up all necessary\n settings for loaders, plugins, and other relevant parameters. You can find step-by-step\n guides for configuring\n Webpack or\n Vite\n with Storybook.\n \n \n Missing Environment Variables: Your Storybook may require specific\n environment variables to function as intended. You can set up custom environment variables\n as outlined in the\n Environment Variables documentation.\n \n \n \n \n\n\n HM DESIGN SYSTEM / SWSW Viewer — SWViewerHeader참고 DWG/DXF 뷰어의 상단 메뉴를 패키지 컴포넌트로 옮긴 뷰어 모드 전용 Header입니다. 로고 면 → 파일명 면 → 객체 수정 면(메뉴 그룹) → 오른쪽 패널·상태·정보 영역이며, 메뉴는 groups 데이터로 구성합니다. 레이어·설정·속성 토글은 팝업을 열고, 정보 버튼은 모달 팝업을 엽니다.기본형 (1440px, 도면 열림)로고 오른쪽 파일 열기 버튼(공간이 부족하면 테두리 아이콘만)으로 파일을 열고, 파일명을 누르면 샘플 도면 목록이 열립니다. Model/Layout 탭, 2.5D·어두운 배경 스위치, 패널 토글을 직접 눌러 보세요. Command 줄에 onCommand 결과가 표시됩니다.Command: 없음파일 열기C0060202-001-평면및종단면도.dwgModel17,377Layout237전체 보기2.5D어두운 배경레이어설정속성도면 열림: C0060202-001-평면및종단면도.dwg 열림\n \n \n function __onViteAppLoadingError(event) {\n const hostname = globalThis.location.hostname;\n if (hostname !== 'localhost' && globalThis.CONFIG_TYPE === 'DEVELOPMENT') {\n const message = `Failed to load the Storybook preview file 'vite-app.js':\n\n It looks like you're visiting the Storybook development server on another hostname than localhost: '${hostname}', but you haven't configured the necessary security features to support this.\n Please re-run your Storybook development server with the '--host ${hostname}' flag, or manually configure your Vite allowedHosts configuration with viteFinal.\n\n See:`;\n const docs = [\n 'https://storybook.js.org/docs/api/cli-options#dev',\n 'https://storybook.js.org/docs/api/main-config/main-config-vite-final',\n 'https://vite.dev/config/server-options.html#server-allowedhosts',\n ];\n console.error(`${message}\\n${docs.map((doc) => `- ${doc}`).join('\\n')}`);\n\n document.getElementById('storybook-root').innerHTML =\n `<p style=\"color: red; max-width: 70ch\">${message.replaceAll(\n '\\n',\n '<br/>'\n )}<ul>${docs.map((doc) => `<li><a href='${doc}' target='_blank'>${doc}</a></li>`).join('')}</ul></p>`;\n return;\n }\n }\n \n \n\n\n #storybook-highlights-menu {\n position: absolute;\n z-index: 2147483647;\n width: 300px;\n padding: 0px;\n margin: 15px 0 0 0;\n transform: translateX(-50%);\n font-family: \"Nunito Sans\", -apple-system, \".SFNSText-Regular\", \"San Francisco\", BlinkMacSystemFont, \"Segoe UI\", \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n font-size: 12px;\n background: white;\n border: none;\n border-radius: 6px;\n box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.05), 0 5px 15px 0 rgba(0, 0, 0, 0.1);\n color: #2E3438;\n }\n #storybook-highlights-menu ul {\n list-style: none;\n margin: 0;\n padding: 0;\n }\n #storybook-highlights-menu > ul {\n max-height: 300px;\n overflow-y: auto;\n padding: 4px 0;\n }\n #storybook-highlights-menu li {\n padding: 0 4px;\n margin: 0;\n }\n #storybook-highlights-menu li > :not(ul) {\n display: flex;\n padding: 8px;\n margin: 0;\n align-items: center;\n gap: 8px;\n border-radius: 4px;\n }\n #storybook-highlights-menu button {\n width: 100%;\n border: 0;\n background: transparent;\n color: inherit;\n text-align: left;\n font-family: inherit;\n font-size: inherit;\n }\n #storybook-highlights-menu button:focus-visible {\n outline-color: #029CFD;\n }\n #storybook-highlights-menu button:hover {\n background: rgba(2, 156, 253, 0.07);\n color: #029CFD;\n cursor: pointer;\n }\n #storybook-highlights-menu li code {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n line-height: 16px;\n font-size: 11px;\n }\n #storybook-highlights-menu li svg {\n flex-shrink: 0;\n margin: 1px;\n color: #73828C;\n }\n #storybook-highlights-menu li > button:hover svg, #storybook-highlights-menu li > button:focus-visible svg {\n color: #029CFD;\n }\n #storybook-highlights-menu .element-list li svg {\n display: none;\n }\n #storybook-highlights-menu li.selectable svg, #storybook-highlights-menu li.selected svg {\n display: block;\n }\n #storybook-highlights-menu .menu-list {\n border-top: 1px solid rgba(38, 85, 115, 0.15);\n }\n #storybook-highlights-menu .menu-list > li:not(:last-child) {\n padding-bottom: 4px;\n margin-bottom: 4px;\n border-bottom: 1px solid rgba(38, 85, 115, 0.15);\n }\n #storybook-highlights-menu .menu-items, #storybook-highlights-menu .menu-items li {\n padding: 0;\n }\n #storybook-highlights-menu .menu-item {\n display: flex;\n }\n #storybook-highlights-menu .menu-item-content {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n }",
|
|
"log": "Command: 없음"
|
|
}
|
|
},
|
|
{
|
|
"n": "file open button after the logo: SWHeader document surface, icon + 파일 열기",
|
|
"ok": true,
|
|
"d": {
|
|
"surface": true,
|
|
"afterLogo": true,
|
|
"label": "파일 열기",
|
|
"icon": 1
|
|
}
|
|
},
|
|
{
|
|
"n": "file open icon: no border, transparent, no shadow",
|
|
"ok": true,
|
|
"d": "0px | none | rgb(240, 247, 245) | 0px | rgba(0, 0, 0, 0) | none"
|
|
},
|
|
{
|
|
"n": "file open button runs the existing file open",
|
|
"ok": true,
|
|
"d": {
|
|
"menu": false,
|
|
"list": false,
|
|
"nameExpanded": "false",
|
|
"name": "C0060202-001-평면및종단면도.dwg",
|
|
"focus": "파일 열기",
|
|
"log": "Command: 파일 선택창 (미연결) → document/open"
|
|
}
|
|
},
|
|
{
|
|
"n": "open list never covers the logo cap (pixels identical)",
|
|
"ok": true
|
|
},
|
|
{
|
|
"n": "file name click opens the 3 samples only (no Open / + New), SWHeader face",
|
|
"ok": true,
|
|
"d": {
|
|
"rows": [
|
|
"BasicSample.dwg",
|
|
"C0060202-001-평면및종단면도.dwg",
|
|
"simple.dxf"
|
|
],
|
|
"actions": 0,
|
|
"active": "C0060202-001-평면및종단면도.dwg",
|
|
"width": 361.5,
|
|
"button": 359.5,
|
|
"left": -2,
|
|
"right": 0,
|
|
"row": 32,
|
|
"gap": 0,
|
|
"background": "rgb(16, 49, 39)"
|
|
}
|
|
},
|
|
{
|
|
"n": "document list >= file-name button (outer) and >= 312px, covers it",
|
|
"ok": true,
|
|
"d": {
|
|
"rows": [
|
|
"BasicSample.dwg",
|
|
"C0060202-001-평면및종단면도.dwg",
|
|
"simple.dxf"
|
|
],
|
|
"actions": 0,
|
|
"active": "C0060202-001-평면및종단면도.dwg",
|
|
"width": 361.5,
|
|
"button": 359.5,
|
|
"left": -2,
|
|
"right": 0,
|
|
"row": 32,
|
|
"gap": 0,
|
|
"background": "rgb(16, 49, 39)"
|
|
}
|
|
},
|
|
{
|
|
"n": "list painted on top (not cut)",
|
|
"ok": true
|
|
},
|
|
{
|
|
"n": "sample select loads it, renames, closes, focus on the file name",
|
|
"ok": true,
|
|
"d": {
|
|
"menu": false,
|
|
"list": false,
|
|
"nameExpanded": "false",
|
|
"name": "simple.dxf",
|
|
"focus": "name",
|
|
"log": "Command: 파일 선택창 (미연결) → document/open → samples/sample-dxf"
|
|
}
|
|
},
|
|
{
|
|
"n": "ArrowDown opens the list on its first row",
|
|
"ok": true,
|
|
"d": {
|
|
"menu": false,
|
|
"list": true,
|
|
"nameExpanded": "true",
|
|
"name": "simple.dxf",
|
|
"focus": "BasicSample.dwg",
|
|
"log": "Command: 파일 선택창 (미연결) → document/open → samples/sample-dxf"
|
|
}
|
|
},
|
|
{
|
|
"n": "Escape closes the list and refocuses the file name",
|
|
"ok": true,
|
|
"d": {
|
|
"menu": false,
|
|
"list": false,
|
|
"nameExpanded": "false",
|
|
"name": "simple.dxf",
|
|
"focus": "name",
|
|
"log": "Command: 파일 선택창 (미연결) → document/open → samples/sample-dxf"
|
|
}
|
|
},
|
|
{
|
|
"n": "document list above an open SWViewerPanel",
|
|
"ok": true
|
|
},
|
|
{
|
|
"n": "no horizontal overflow at 1440 / 1100 / 860 / 520",
|
|
"ok": true,
|
|
"d": [
|
|
[
|
|
1440,
|
|
0,
|
|
0
|
|
],
|
|
[
|
|
1100,
|
|
0,
|
|
0
|
|
],
|
|
[
|
|
860,
|
|
0,
|
|
0
|
|
],
|
|
[
|
|
520,
|
|
0,
|
|
0
|
|
]
|
|
]
|
|
},
|
|
{
|
|
"n": "layer / settings / properties always in the header with tooltips",
|
|
"ok": true,
|
|
"d": [
|
|
[
|
|
1440,
|
|
[
|
|
[
|
|
"레이어",
|
|
true,
|
|
true
|
|
],
|
|
[
|
|
"설정",
|
|
true,
|
|
true
|
|
],
|
|
[
|
|
"속성",
|
|
true,
|
|
true
|
|
]
|
|
]
|
|
],
|
|
[
|
|
1100,
|
|
[
|
|
[
|
|
"레이어",
|
|
false,
|
|
true
|
|
],
|
|
[
|
|
"설정",
|
|
false,
|
|
true
|
|
],
|
|
[
|
|
"속성",
|
|
false,
|
|
true
|
|
]
|
|
]
|
|
],
|
|
[
|
|
860,
|
|
[
|
|
[
|
|
"레이어",
|
|
false,
|
|
true
|
|
],
|
|
[
|
|
"설정",
|
|
false,
|
|
true
|
|
],
|
|
[
|
|
"속성",
|
|
false,
|
|
true
|
|
]
|
|
]
|
|
],
|
|
[
|
|
520,
|
|
[
|
|
[
|
|
"레이어",
|
|
false,
|
|
true
|
|
],
|
|
[
|
|
"설정",
|
|
false,
|
|
true
|
|
],
|
|
[
|
|
"속성",
|
|
false,
|
|
true
|
|
]
|
|
]
|
|
]
|
|
]
|
|
},
|
|
{
|
|
"n": "1440 full (파일 열기 + 전체 보기 labels, no More); 1100 icons only, no More; 860 / 520 icons + More",
|
|
"ok": true,
|
|
"d": [
|
|
[
|
|
1440,
|
|
true,
|
|
false,
|
|
[
|
|
true,
|
|
"",
|
|
34
|
|
],
|
|
[
|
|
true,
|
|
true,
|
|
true
|
|
]
|
|
],
|
|
[
|
|
1100,
|
|
true,
|
|
false,
|
|
[
|
|
false,
|
|
"파일 열기",
|
|
34
|
|
],
|
|
[
|
|
false,
|
|
false,
|
|
false
|
|
]
|
|
],
|
|
[
|
|
860,
|
|
true,
|
|
true,
|
|
[
|
|
false,
|
|
"파일 열기",
|
|
34
|
|
],
|
|
[
|
|
false,
|
|
false,
|
|
false
|
|
]
|
|
],
|
|
[
|
|
520,
|
|
false,
|
|
true,
|
|
[
|
|
false,
|
|
"파일 열기",
|
|
34
|
|
],
|
|
[
|
|
false,
|
|
false,
|
|
false
|
|
]
|
|
]
|
|
]
|
|
},
|
|
{
|
|
"n": "logo, file open, file name and toolbar never overlap",
|
|
"ok": true,
|
|
"d": [
|
|
[
|
|
1440,
|
|
[
|
|
65,
|
|
65,
|
|
203.61666870117188,
|
|
205.61666870117188,
|
|
565.1166687011719,
|
|
567.11669921875
|
|
]
|
|
],
|
|
[
|
|
1100,
|
|
[
|
|
65,
|
|
65,
|
|
136,
|
|
138,
|
|
412.5,
|
|
414.5
|
|
]
|
|
],
|
|
[
|
|
860,
|
|
[
|
|
65,
|
|
65,
|
|
136,
|
|
138,
|
|
352.5,
|
|
354.5
|
|
]
|
|
],
|
|
[
|
|
520,
|
|
[
|
|
65,
|
|
65,
|
|
136,
|
|
138,
|
|
278,
|
|
280
|
|
]
|
|
]
|
|
]
|
|
},
|
|
{
|
|
"n": "520: document list shown inside the header width",
|
|
"ok": true
|
|
},
|
|
{
|
|
"n": "520: icon-only file open runs the file open",
|
|
"ok": true
|
|
},
|
|
{
|
|
"n": "narrow header (771px): icon toggles open / close panels, pressed #FFC600, tooltip",
|
|
"ok": true,
|
|
"d": [
|
|
{
|
|
"name": "레이어",
|
|
"pressed": "true",
|
|
"color": "rgb(255, 198, 0)",
|
|
"title": "레이어 패널 열기 / 닫기",
|
|
"open": true,
|
|
"closed": true
|
|
},
|
|
{
|
|
"name": "설정",
|
|
"pressed": "true",
|
|
"color": "rgb(255, 198, 0)",
|
|
"title": "옵션 패널 열기 / 닫기",
|
|
"open": true,
|
|
"closed": true
|
|
},
|
|
{
|
|
"name": "속성",
|
|
"pressed": "true",
|
|
"color": "rgb(255, 198, 0)",
|
|
"title": "속성 패널 열기 / 닫기",
|
|
"open": true,
|
|
"closed": true
|
|
}
|
|
]
|
|
},
|
|
{
|
|
"n": "no console errors",
|
|
"ok": true,
|
|
"d": []
|
|
}
|
|
],
|
|
"errors": []
|
|
} |