docs: finalize HMDesign v2 guidelines and remove stale references
This commit is contained in:
1 parent
3ebc84e32c
commit
e9144348e5
10 files changed
+46
-29
No files matched your search
@@ -1,12 +1,14 @@
|
||||
# HMDesignSystem Storybook LAN Preview
|
||||
|
||||
> HISTORICAL_RECORD — observations from the 2026-10-07 Track B QA session, including ports, processes and validation status. These are not current server availability or general execution instructions. The current Storybook default is **6024**; follow the [official execution guide](../../docs/guidelines/publisher-distribution-guide.md). Optional LAN QA is described in [LAN-PREVIEW.md](LAN-PREVIEW.md). The private address and old worktree path are neutral placeholders; historical results remain unchanged.
|
||||
|
||||
Result: **PARTIAL** — same-host LAN Preview is READY. A second physical PC was unavailable, so cross-PC access and cross-PC HMR remain NOT_VERIFIED.
|
||||
|
||||
TEMP_STORYBOOK_URL: http://10.13.37.164:6008/
|
||||
TEMP_STORYBOOK_URL: http://<QA_HOST_IPV4>:6008/
|
||||
|
||||
## 1. Worktree
|
||||
|
||||
- Path: `D:\디자인시스템\HMDesignSystem-storybook`
|
||||
- Path: `<TRACK_B_WORKTREE>`
|
||||
- Branch: `chore/storybook-cleanup`
|
||||
- HEAD: `6b4a39e4e9fef7cd706630ffc72b5e97e8696823`
|
||||
- Remote: `https://gitea.hmac.kr/b25027/HMDesign.git`
|
||||
@@ -20,8 +22,8 @@ TEMP_STORYBOOK_URL: http://10.13.37.164:6008/
|
||||
- LAN listener PID at verification: **23804**
|
||||
- Command: `node node_modules/storybook/dist/bin/dispatcher.js dev -p 6008 --host 0.0.0.0 --no-open --disable-telemetry --exact-port`
|
||||
- Local: http://localhost:6008/
|
||||
- LAN: http://10.13.37.164:6008/
|
||||
- Verified current IPv4: **10.13.37.164** (Ethernet 3); this is a temporary LAN address, not a permanent URL.
|
||||
- LAN: http://<QA_HOST_IPV4>:6008/
|
||||
- Verified current IPv4: **<QA_HOST_IPV4>** (Ethernet 3); this is a temporary LAN address, not a permanent URL.
|
||||
- The old LAN process was started on 6007 and had fallen back to 6008. Only that confirmed Track B LAN process was replaced with explicit 6008/exact-port operation. The existing localhost-only Track B process (PID 33604) was preserved; both addresses use the same worktree and matched 289 Story IDs.
|
||||
- package.json's official **6007** script was unchanged. Track A and other ports/processes were not stopped.
|
||||
- Server stdout/stderr are in ignored `.storybook/qa/lan-preview.*.log` files. PIDs are session observations, not durable shutdown instructions.
|
||||
@@ -149,7 +151,7 @@ Pre-existing or concurrent changes were preserved: `.storybook/main.ts`, `.story
|
||||
2. Execution on main: **NO**.
|
||||
3. 6008 bound to 0.0.0.0: **YES**.
|
||||
4. localhost:6008 opens: **YES**.
|
||||
5. 10.13.37.164:6008 opens on the same PC: **YES**.
|
||||
5. <QA_HOST_IPV4>:6008 opens on the same PC: **YES**.
|
||||
6. Opens from another physical PC: **NOT_VERIFIED**.
|
||||
7. Missing cross-PC verification explicitly marked: **YES**.
|
||||
8. Top Bar #266651 maintained: **YES**.
|
||||
|
||||
@@ -1,20 +1,21 @@
|
||||
# Track B temporary Storybook LAN preview
|
||||
|
||||
> Historical scope: the Track B session below was verified on 2026-10-07. Ordinary users should follow the [official source installation guide](../../docs/guidelines/publisher-distribution-guide.md) and use `npm run storybook` or `start-storybook.bat` at the repository root; the current default port is **6024**. LAN Preview is optional internal QA. The old 6007 package port and the temporary 6008 session are historical observations. No server binding, network profile or firewall configuration is changed by this documentation update.
|
||||
|
||||
Purpose: **TEMPORARY INTERNAL LAN PREVIEW / LAN TEMP PREVIEW** for Storybook cleanup. This is a development server with HMR, not official static hosting or a permanent URL.
|
||||
|
||||
- Worktree: `D:\디자인시스템\HMDesignSystem-storybook`
|
||||
- Worktree: `<TRACK_B_WORKTREE>`
|
||||
- Branch: `chore/storybook-cleanup`
|
||||
- Port: `6008`; bind: `0.0.0.0`
|
||||
- TEMP_STORYBOOK_URL: http://10.13.37.164:6008/
|
||||
- TEMP_STORYBOOK_URL: http://<QA_HOST_IPV4>:6008/
|
||||
- Local: http://localhost:6008/
|
||||
- IPv4 `10.13.37.164` was verified on 2026-10-07. Recheck it before later sharing; do not assume a fixed address.
|
||||
- IPv4 `<QA_HOST_IPV4>` was verified on 2026-10-07. Recheck it before later sharing; do not assume a fixed address.
|
||||
|
||||
## Start and inspect
|
||||
|
||||
Run from Track B in PowerShell:
|
||||
For optional QA, first install/build dependencies using the official guide. Run from the current repository root in PowerShell; `6008` below is an example QA port, not the current default. Confirm it is available and the existing network policy permits LAN QA before starting. Replace `<QA_HOST_IPV4>` with the address observed for that session. The old worktree placeholder records provenance and is not a command path:
|
||||
|
||||
```powershell
|
||||
Set-Location -LiteralPath 'D:\디자인시스템\HMDesignSystem-storybook'
|
||||
git status -sb
|
||||
git branch --show-current
|
||||
git rev-parse HEAD
|
||||
@@ -23,7 +24,7 @@ git rev-parse HEAD
|
||||
.\node_modules\.bin\storybook.cmd dev -p 6008 --host 0.0.0.0 --no-open --disable-telemetry --exact-port
|
||||
```
|
||||
|
||||
The installed Storybook binary is version 10.6.1. `--exact-port` prevents silent fallback to another port. The official package.json script stays on 6007. Do not use that script without overriding the port for Track B. If 6008 is occupied, identify its process before stopping or replacing it.
|
||||
The installed Storybook binary is version 10.6.1. `--exact-port` prevents silent fallback to another port. The package.json script used 6007 during that session; the current official script uses 6024. The direct command above selects a separate QA port explicitly. If 6008 is occupied, identify its process before stopping or replacing it.
|
||||
|
||||
```powershell
|
||||
Get-NetIPAddress -AddressFamily IPv4
|
||||
@@ -55,7 +56,7 @@ The Codex in-app browser showed a fractional-width boundary anomaly at 1023: `in
|
||||
|
||||
The sidebar order remains Foundation → Components → Patterns → Center Graphic → Theme. Existing `verification` filtering hides QA/tool stories by default while preserving direct URLs and tag-filter access.
|
||||
|
||||
Refresh the full inventory from Track B:
|
||||
When Storybook cleanup requires an inventory, refresh it from the repository root:
|
||||
|
||||
```powershell
|
||||
node .storybook/qa/generate-inventory.mjs
|
||||
@@ -75,4 +76,4 @@ For each completed cleanup batch, run typecheck, build-storybook, and git diff -
|
||||
|
||||
Same-host LAN IP success does not prove access from another physical PC. On a second physical PC, check manager/sidebar/preview, fonts/themes/assets, navigation and HMR. Until then record **SECOND_PHYSICAL_PC: NOT_VERIFIED**.
|
||||
|
||||
The current network profile was Public, with firewall profiles enabled and pre-existing inbound Node allow rules. No firewall rule or network profile was changed. If a second PC cannot connect, diagnose routing, client isolation and existing firewall policy; do not automatically add rules or change profiles.
|
||||
The 2026-10-07 network profile was Public, with firewall profiles enabled and pre-existing inbound Node allow rules. No firewall rule or network profile was changed. If a second PC cannot connect, diagnose routing, client isolation and existing firewall policy; do not automatically add rules or change profiles.
|
||||
@@ -16,15 +16,17 @@ Storybook은 기존 HM Component·Pattern·Theme·Variant·State·Interaction을
|
||||
|
||||
## Git Clone 설치·실행 (현재 테스트 공유 기준)
|
||||
|
||||
v2 추가 5개 요청의 구현·실제 Storybook 검증과 Orange Dark 1/2 보류는 [2026-10-11 선택 검증 보고](docs/reports/v2-publisher-review-2026-10-11.md)를 확인합니다.
|
||||
현재 한맥그린·브라운·오렌지는 각 8단계가 완료됐습니다. Orange는 Light 4 `#FEBA88` → Light 3 `#EC8F53` → Light 2 `#F87725` → Light 1 `#EB5F00` → Default `#CC5200` → Dark 1 `#BC4C00` → Dark 2 `#883700` → Dark 3 `#4F2000`입니다. [최신 확정 Palette](docs/guidelines/brand-color-steps.md), [Orange 확정 기록](docs/reports/orange-final-confirmation-2026-10-11.md), [Runtime 계약](docs/guidelines/runtime-theme-contract.md)을 따릅니다. [v2 선택 검증 보고](docs/reports/v2-publisher-review-2026-10-11.md)의 Dark 1/2 보류는 당시 기록입니다.
|
||||
|
||||
공식 소스 저장소는 [Gitea HMDesign](https://gitea.hmac.kr/b25027/HMDesign)입니다. 이전 원본은 [GitHub HMDesignSystemTest](https://github.com/shkim25027/HMDesignSystemTest)의 `90583ab6046ab5dc1ac35d94d38f3301c9a4dfe1`이며, GitHub 이력을 병합하지 않고 공식 Gitea의 기존 이력 위에 소스만 반영합니다. 먼저 [AGENTS.md](AGENTS.md)를 읽고 기존 Component → Variant/Prop → Composition 순서로 재사용합니다.
|
||||
공식 소스 저장소는 [Gitea HMDesign](https://gitea.hmac.kr/b25027/HMDesign)입니다. 이전 원본은 [GitHub HMDesignSystemTest](https://github.com/shkim25027/HMDesignSystemTest)의 `90583ab6046ab5dc1ac35d94d38f3301c9a4dfe1`이며, GitHub 이력을 병합하지 않고 공식 Gitea의 기존 이력 위에 소스 반영을 완료했습니다. 먼저 [AGENTS.md](AGENTS.md)를 읽고 기존 Component → Variant/Prop → Composition 순서로 재사용합니다.
|
||||
|
||||
현재 검증 범위와 남은 제한은 [2026-10-10 잔여 이슈 회귀 보고](docs/guidelines/publisher-validation-2026-10-10.md)를 확인합니다.
|
||||
|
||||
후속 Select 비교 화면 넘침 수정, Guard 46개 회귀 테스트, 개발 의존성 분석과 접근성 제한은 [2026-10-10 최종 안정화 보고](docs/guidelines/publisher-stabilization-2026-10-10.md)를 확인합니다. 이전 보고서는 당시 기록으로 보존합니다.
|
||||
|
||||
이후 Guard CSS Intent·동적 Token 확장(75개 + 증거 연결 20개 + 요구사항 연결 5개)은 [Guard 보고](docs/reports/guard-css-intent-dynamic-token-2026-10-10.md), Combobox·GNB/LNB 접근성 보완은 [접근성 보고](docs/reports/accessibility-residual-2026-10-10.md)를 따릅니다. 현재 [Gitea 이전 전 최종 정합성 확인](docs/reports/pre-gitea-finalization-2026-10-11.md)과 [2026-10-12 이전 준비](docs/guidelines/gitea-source-transfer-preparation-2026-10-11.md)에는 재사용 근거와 잔여 미검증을 구분합니다. 공식 이전의 Commit·Push는 최종 검토와 별도 승인 후 수행합니다. 인용한 과거 보고서는 당시 기록으로 보존합니다.
|
||||
이후 Guard CSS Intent·동적 Token 확장(75개 + 증거 연결 20개 + 요구사항 연결 5개)은 [Guard 보고](docs/reports/guard-css-intent-dynamic-token-2026-10-10.md), Combobox·GNB/LNB 접근성 보완은 [접근성 보고](docs/reports/accessibility-residual-2026-10-10.md)를 따릅니다. 과거 [Gitea 이전 전 최종 정합성 확인](docs/reports/pre-gitea-finalization-2026-10-11.md)과 [2026-10-12 이전 준비](docs/guidelines/gitea-source-transfer-preparation-2026-10-11.md)에는 재사용 근거와 잔여 미검증을 구분합니다. 공식 Gitea 이전은 완료됐으며 현재 설치·실행은 위 공식 저장소를 기준으로 합니다. 인용한 과거 보고서는 당시 기록으로 보존합니다.
|
||||
|
||||
최신 [Generic Status Error](docs/reports/generic-status-error-token-2026-10-11.md)는 `#B3261E` / Provisional이며 기존 Destructive `#D32F2F`를 유지합니다. [Disabled Input Label](docs/reports/disabled-input-label-2026-10-11.md)은 승인된 Input Story 소비 범위 60%, 공통 Label은 50%입니다. [Background Gradient 기록](docs/reports/brown-orange-background-gradients-2026-10-11.md)과 [현재 계약](docs/guidelines/runtime-theme-contract.md)은 Green·Brown·Orange 공통 배경을 구분하며, Foundation Color의 Button 전용 미리보기는 제거하고 실제 Button·Dashboard Gradient는 유지합니다. Focus `#266651`은 시험 적용 상태입니다.
|
||||
|
||||
Node.js는 lockfile의 `^20.19.0 || >=22.12.0` 조건을 충족해야 합니다(Node 21 제외). 이번 재현 환경은 **Node 20.20.1 / npm 10.8.2**입니다. Node 설치 시 제공되는 npm과 PATH를 확인하고, 재현 시에는 검증한 버전을 사용합니다. 최초 설치에는 공식 Gitea와 npm 레지스트리 접근이 필요합니다.
|
||||
|
||||
|
||||
@@ -18,7 +18,9 @@ JSON schemaVersion 2는 기존 `status`, exit code, 원본 `issues`를 유지하
|
||||
|
||||
`tokenEvidence`는 entry별 연결 정의 수와 검사한 참조를 제공한다. 공개 Token의 정답은 실제 연결 CSS 및 [Runtime 계약표](runtime-theme-contract.md)다. Component mapping은 runtime JSON key와 같은 집계가 아니다. 별도 토큰·색상은 추가하지 않는다.
|
||||
|
||||
`node scripts/public-theme-tokens.mjs`로 연결된 공개 CSS의 선언 목록을 JSON으로 출력한다. 현재 1,170개 선언명이며 Runtime JSON 입력 key 수와 다르다. Native role widget은 `REUSE-006`으로 근거 검토를 요구하고 일반 콘텐츠 HTML은 허용한다.
|
||||
`node scripts/public-theme-tokens.mjs`로 연결된 공개 CSS의 선언 목록을 JSON으로 출력한다. 기준 Commit `3ebc84e32cf91298a2a4d8046753244c499fd719`에서 **1,203개 고유 `--hm-*` 선언명**이며 Runtime JSON 입력 Key 94개와 다르다. 집계 범위는 `@hm-design/ui/theme.css` + `@hm-design/ui/dashboard-status.css`의 연결 CSS이고 `definitionCount` / `incomplete: false`를 확인한다. selector마다 반복된 선언의 총 행 수나 Guard 규칙 수가 아니며 CSS가 바뀌면 위 명령으로 재집계한다.
|
||||
|
||||
보존된 검증은 기존 전체 범위 **FAIL 0 / NOT VERIFIED 16건**과 최신 변경 범위 **FAIL 0 / NOT VERIFIED 12건**으로 서로 다른 scope·source fingerprint의 기록이다. 둘을 합치거나 전체 PASS로 표현하지 않는다. 원본 CSS styleEvidence는 STATIC PASS / RUNTIME NOT VERIFIED / DESIGN_INTENT PASS / FINAL NOT VERIFIED이며 결합 styleVerification의 NOT VERIFIED도 유지한다. Native role widget은 `REUSE-006`으로 근거 검토를 요구하고 일반 콘텐츠 HTML은 허용한다.
|
||||
|
||||
## Runtime 증거 연결
|
||||
|
||||
|
||||
@@ -4,7 +4,7 @@ RESULT: PARTIAL. 기준 HEAD는 `48ca1d22de0a4eca5af2084676fd6739e7223912`, 시
|
||||
|
||||
## 자료 확인 및 비교 가능성
|
||||
|
||||
사용자가 확인한 원본은 `C:\Users\ㅅㅎ\.codex\visualizations\2026\10\10\01a12479-1eac-7691-8044-de2330b7bfef\HMDesign-AI-Generation-Test`다. REPORT, experiment/rubric/results/findings, 10개 requirements·React 소스·initial·generation log·Guard·스크린샷을 확인했다. 원본 증거·소스 570개 SHA256 변화는 0개다(node_modules와 baseline 저장소 스냅샷은 인벤토리에서 제외).
|
||||
사용자가 확인한 원본은 `<USER_HOME>\.codex\visualizations\2026\10\10\01a12479-1eac-7691-8044-de2330b7bfef\HMDesign-AI-Generation-Test`다. REPORT, experiment/rubric/results/findings, 10개 requirements·React 소스·initial·generation log·Guard·스크린샷을 확인했다. 원본 증거·소스 570개 SHA256 변화는 0개다(node_modules와 baseline 저장소 스냅샷은 인벤토리에서 제외).
|
||||
|
||||
새 자료는 `D:\디자인시스템\HMDesign-AI-Generation-Test\retest-20261010`에 보존한다. requirements 10개와 rubric은 원본과 byte 일치, Seed는 실제 기록 `20261010`, 선택 알고리즘은 LCG(1664525,1013904223)+Fisher-Yates다. Viewport는 390/768/1280/1440 × 900이다. 동일 로컬 Windows/Node 20.20.1, React 19.3.0/Vite 8.3.0, 기존 의존성 복사와 같은 Chrome 실행 경로/Playwright 측정 함수를 사용했다. 원본의 정확한 브라우저 build ID는 NOT VERIFIED이며 서버 포트·새 파일 위치는 다르다.
|
||||
|
||||
|
||||
@@ -13,7 +13,9 @@
|
||||
| Dark 2 | #071E18 | #2F281C | #883700 |
|
||||
| Dark 3 | #020A07 | #1D1810 | #4F2000 |
|
||||
|
||||
모든 칸의 Key는 `color.palette.{green|brown|orange}-{light-4|light-3|light-2|light-1|default|dark-1|dark-2|dark-3}`로 선언되어 있다. CSS는 동일 suffix의 `--hm-sem-palette-*` → `--hm-*` Primitive를 사용한다. 이전 확정 누락분 8개 추가 이후의 81개 입력을 보존하고 Orange Dark 1·2만 추가했다. 전체 공개 입력은 83개(색상 81개, 기존 radius 2개)다. Dark 3와 Light 4~Default 값은 변경하지 않았다.
|
||||
모든 칸의 Key는 `color.palette.{green|brown|orange}-{light-4|light-3|light-2|light-1|default|dark-1|dark-2|dark-3}`로 선언되어 있다. CSS는 동일 suffix의 `--hm-sem-palette-*` → `--hm-*` Primitive를 사용한다. Orange Dark 1·2 확정 당시에는 83개(색상 81개 + radius 2개)였으며 이후 Generic Status Error 1개와 Brown/Orange Background Stop 10개가 추가됐다. 현재 공개 입력은 94개(색상 92개 + radius 2개)다. Dark 3와 Light 4~Default 값은 유지한다.
|
||||
|
||||
집계 기준 Commit은 `3ebc84e32cf91298a2a4d8046753244c499fd719`다. `scripts/theme-contract.mjs`가 `contract.ts`의 공개 Key·Property·type 항목을 추출한 `definitions.length`는 **94개(색상 92개 + radius 2개)**다. `Object.keys(themes/default.json의 tokens).length`는 색상 직접 설정값 **92개**이며 radius는 JSON에 없고 CSS Template에서 기본값을 제공한다. `scripts/theme-defaults.mjs --check`는 JSON + `scripts/theme-templates/{primitives,default}.css` → `packages/ui/src/theme/{primitives,default}.css` 및 `default-values.generated.ts`의 **94개 계약 기본값** 연결을 확인한다. 공개 CSS의 계산·Component 매핑 변수 선언 수는 이 Runtime 입력 수와 별도 집계다.
|
||||
|
||||
## Legacy Key 보존과 확정 이력
|
||||
|
||||
|
||||
@@ -1,14 +1,14 @@
|
||||
# 퍼블리셔 Git 테스트 공유·실행 안내
|
||||
|
||||
현재 공유 기준은 [GitHub HMDesignSystemTest](https://github.com/shkim25027/HMDesignSystemTest)의 Git Clone입니다. 먼저 [AGENTS.md](../../AGENTS.md)를 확인합니다. 과거 ZIP 제작·압축 해제 검증은 [추가 수정 보고서](publisher-additional-review-2026-10-10.md)의 당시 기록이며 현재 설치 방법을 대체하지 않습니다. 이번 공유에는 신규 ZIP·포터블 패키지를 만들지 않습니다.
|
||||
현재 공유 기준은 [공식 Gitea HMDesign](https://gitea.hmac.kr/b25027/HMDesign)의 Git Clone입니다. 먼저 [AGENTS.md](../../AGENTS.md)를 확인합니다. 과거 ZIP 제작·압축 해제 검증은 [추가 수정 보고서](publisher-additional-review-2026-10-10.md)의 당시 기록이며 현재 설치 방법을 대체하지 않습니다. 이번 공유에는 신규 ZIP·포터블 패키지를 만들지 않습니다.
|
||||
|
||||
## 설치 조건과 Storybook 열람
|
||||
|
||||
lockfile의 Node 조건은 `^20.19.0 || >=22.12.0`이며 Node 21은 제외합니다. 검증 환경은 Windows, Node 20.20.1 / npm 10.8.2입니다. Git, Node/npm의 PATH와 버전을 확인합니다. 최초 설치에는 GitHub·npm 레지스트리 접속이 필요합니다. HM Registry 설치·publish는 필요하지 않습니다.
|
||||
lockfile의 Node 조건은 `^20.19.0 || >=22.12.0`이며 Node 21은 제외합니다. 검증 환경은 Windows, Node 20.20.1 / npm 10.8.2입니다. Git, Node/npm의 PATH와 버전을 확인합니다. 최초 설치에는 공식 Gitea·npm 레지스트리 접속이 필요합니다. HM Registry 설치·publish는 필요하지 않습니다.
|
||||
|
||||
```powershell
|
||||
git clone https://github.com/shkim25027/HMDesignSystemTest.git
|
||||
cd HMDesignSystemTest
|
||||
git clone https://gitea.hmac.kr/b25027/HMDesign.git
|
||||
cd HMDesign
|
||||
node --version
|
||||
npm --version
|
||||
npm ci
|
||||
@@ -18,7 +18,9 @@ npm run storybook
|
||||
|
||||
브라우저에서 **http://localhost:6024/** 를 엽니다. Components에서 기존 UI, Patterns에서 업무/Layout 조합, Foundation에서 Color/Typography를 확인합니다. 내부 Theme 비교는 `?path=/story/theme-runtime-contract--comparison`, JSON Loader 검증은 `?path=/story/theme-runtime-contract-loader--cdn-verification`입니다. Runtime Focus는 `?path=/story/theme-runtime-contract--verification`의 Run verification 버튼에 Tab으로 이동한 뒤 Enter/Space로 검사합니다. 자동·포인터 실행의 Focus는 `NOT VERIFIED`입니다.
|
||||
|
||||
기존 `start-storybook.bat`도 사용할 수 있습니다. 의존성·패키지 산출물이 없으면 기존 설치·빌드 명령을 실행하고 HM Story index/preview 준비 후 6024 주소를 엽니다. 포트 충돌 시 오류를 표시합니다. 종료는 실행 터미널의 Ctrl+C입니다. Git Clone에는 `node_modules`, 사전 빌드 Storybook, ZIP 실행기, 로컬 증거가 포함되지 않습니다.
|
||||
Windows에서는 Clone한 `HMDesign` 루트에서 `.\start-storybook.bat`를 실행하거나 파일을 더블 클릭할 수 있습니다. 이 소스 실행기는 PATH의 Node.js/npm을 사용하므로 별도 Node 설치가 필요합니다. 의존성·패키지 산출물이 없으면 기존 설치·빌드 명령을 실행하고 HM Story index/preview 준비 후 6024 주소를 엽니다. 포트 충돌 시 오류를 표시합니다. 종료는 실행 터미널의 Ctrl+C입니다. Git Clone에는 `node_modules`, 사전 빌드 Storybook, 포터블 Node, 로컬 증거가 포함되지 않습니다.
|
||||
|
||||
과거 포터블 ZIP은 당시 포함된 Node·정적 Storybook·ZIP 전용 실행기를 사용한 별도 배포물입니다. 일반 Git Clone이나 소스 ZIP에는 그 런타임이 포함되지 않으므로 Node.js/npm 설치 조건을 생략할 수 없습니다. 과거 ZIP의 6007은 현재 개발 Storybook 기본 포트 6024와 다릅니다.
|
||||
|
||||
## 새 React 화면 제작과 실행
|
||||
|
||||
@@ -28,7 +30,7 @@ npm run storybook
|
||||
npm run dev:publisher-example
|
||||
```
|
||||
|
||||
출력된 Vite 주소(기본 5173)를 엽니다. [실제 예제](../../examples/publisher-list/main.tsx)는 공개 `@hm-design/ui`의 GNB/GNBMobileMenu, PageHeader, Card, FilterBar, Select, Button, DataTable을 렌더링합니다. GNB_ONLY이며 Sidebar를 추가하지 않습니다. 예제 폴더를 새 경로에 복사한 뒤 제목·data·columns와 필요한 조합을 수정합니다. 임시 검증 화면은 공식 Story로 등록하지 않습니다.
|
||||
출력된 Vite 주소(기본 5173)를 엽니다. [실제 예제](../../examples/publisher-list/main.tsx)는 공개 `@hm-design/ui`의 GNB/GNBMobileMenu, PageHeader, Card, FilterBar, Select, Button, DataTable을 렌더링합니다. GNB_ONLY이며 Sidebar를 추가하지 않습니다. 예제 폴더를 새 경로에 복사한 뒤 제목·data·columns와 필요한 조합을 수정합니다. 기존 Pattern을 먼저 검토한 뒤 Component → Variant/Prop → Composition 순으로 재사용하고 현재 Theme/Semantic Token과 공개 CSS 연결을 유지합니다. 임시 검증 화면은 공식 Story로 등록하지 않습니다.
|
||||
|
||||
검색 조건 → 검색어 → 조회 → 초기화 순서, 8px 간격, 기본 구성 중앙 정렬을 사용합니다. 기간·담당자 등 추가 조건을 제공하는 구성은 `hm-list-search-extended`를 사용합니다. 입력값으로 정렬을 바꾸지 않습니다. 모바일은 줄바꿈·버튼 우측 정렬·표 내부 가로 스크롤을 유지합니다.
|
||||
|
||||
|
||||
@@ -32,11 +32,13 @@ AI 신규·수정 UI 작업은 사용자의 별도 요청 없이 기존 Componen
|
||||
| `.storybook/`, `src/components/*.stories.tsx` | 현재 시제품 → 계속 사용 | 실제 컴포넌트 검수. 패키지 산출물에는 Story를 넣지 않음 |
|
||||
| `packages/ui/src/patterns/`, `packages/ui/src/theme.css` | 현재 구현 | 업무/Layout composition과 기본 Theme CSS. Library 산출물은 `npm run build:packages`로 생성 |
|
||||
| `packages/center-graphic/` | 현재 구현 | `@hm-design/center-graphic` 독립 package 배포 경계. UI package와 필수 의존 없음 |
|
||||
| `packages/ui/src/theme/contract.ts`, `runtime.ts` | 현재 구현 | 공개 83개 입력, 형식/범위 검증, atomic fallback·cleanup, Global/Scoped 적용. `@hm-design/ui/theme` export |
|
||||
| `packages/ui/src/theme/contract.ts`, `runtime.ts` | 현재 구현 | 공개 94개 입력(색상 92개 + radius 2개), 형식/범위 검증, atomic fallback·cleanup, Global/Scoped 적용. `@hm-design/ui/theme` export |
|
||||
| `themes/drafts/` | Runtime MVP 제안 | 디자인팀의 Theme 값 초안·검수 이력. Git 커밋만으로 운영 Theme이 바뀌지 않으며 패키지에도 넣지 않음 |
|
||||
| `themes/*.json` | 현재 구현 | `themes/default.json`은 공식 Default Color Source of Truth. 검증된 top-level JSON은 Theme CDN 배포 단위이며 Git push와 CDN publish는 별도 단계 |
|
||||
| 서비스 앱의 bootstrap | 개발팀 앱 | 패키지 버전 설치, themeId/mode 결정, API/CDN fetch·캐시·실패 처리, 검증된 값 적용 |
|
||||
|
||||
집계 기준 Commit은 `3ebc84e32cf91298a2a4d8046753244c499fd719`다. `scripts/theme-contract.mjs`가 `contract.ts`의 공개 Key·Property·type 항목을 추출한 `definitions.length`는 **94개(색상 92개 + radius 2개)**다. `Object.keys(themes/default.json의 tokens).length`는 색상 직접 설정값 **92개**이며 radius는 JSON에 없고 CSS Template에서 기본값을 제공한다. `scripts/theme-defaults.mjs --check`는 JSON + `scripts/theme-templates/{primitives,default}.css` → `packages/ui/src/theme/{primitives,default}.css` 및 `default-values.generated.ts`의 **94개 계약 기본값** 연결을 확인한다. 공개 CSS의 계산·Component 매핑 변수 선언 수는 이 Runtime 입력 수와 별도 집계다.
|
||||
|
||||
패키지 공개 파일은 `package.json`의 export·포함 목록과 빌드 결과로 확인한다. 기본 CSS와 컴포넌트 CSS 규칙은 패키지 버전에 묶인다. 외부 발행 대상은 계약에 등록된 **기존 Semantic Token 값**이며, 변경된 JSON/CSS 초안을 자동으로 운영 앱에 노출하지 않는다. 필요해지면 `packages/ui`와 `apps/storybook`으로 재배치해도 Git 저장소는 하나로 유지한다.
|
||||
|
||||
검증 계약은 Storybook·서비스 앱·Theme Publish가 공유해야 한다. 현재 검증·적용 도우미는 `@hm-design/ui/theme`에서 공개한다. 네트워크 URL, tenant 식별, 인증, 갱신 시점은 개발팀이 서비스 앱에서 관리한다.
|
||||
|
||||
@@ -43,7 +43,9 @@ Primitive (설계·빌드 시 관리) → Semantic (컴포넌트 참조) → Com
|
||||
|
||||
컴포넌트는 `blue-600` 같은 Primitive나 `#2563eb`, `8px` 같은 실제 값을 직접 참조하지 않는다. Tailwind를 쓰는 경우에도 `bg-primary`의 `--color-primary` → `--primary` → `--hm-sem-action-primary` adapter 연결을 확인한다. **Runtime override는 공개 allowlist의 Semantic/Theme palette 값만** 허용한다. Primitive, 컴포넌트 전용 내부 변수, 임의 CSS selector/rule/JavaScript는 Publish 대상이 아니다.
|
||||
|
||||
현재 allowlist는 `packages/ui/src/theme/contract.ts`의 83개 입력이다(색상 Semantic/Theme palette와 input/container radius). 정확한 이름·타입·기본값·허용 범위는 이 계약과 `runtime-theme-contract.md`를 따른다. Shadow geometry는 현재 공개 입력이 아니다. Typography와 spacing은 실제 사용처와 레이아웃 영향 검토 후 개별 등록한다. 문서에 예시가 있다는 이유로 곧바로 Runtime 허용 Token이 되지 않는다.
|
||||
현재 allowlist는 `packages/ui/src/theme/contract.ts`의 94개 입력이다(색상 92개: Semantic/Theme palette/Gradient stop, input/container radius 2개). 정확한 이름·타입·기본값·허용 범위는 이 계약과 `runtime-theme-contract.md`를 따른다. Shadow geometry는 현재 공개 입력이 아니다. Typography와 spacing은 실제 사용처와 레이아웃 영향 검토 후 개별 등록한다. 문서에 예시가 있다는 이유로 곧바로 Runtime 허용 Token이 되지 않는다.
|
||||
|
||||
집계 기준 Commit은 `3ebc84e32cf91298a2a4d8046753244c499fd719`다. `scripts/theme-contract.mjs`가 `contract.ts`의 공개 Key·Property·type 항목을 추출한 `definitions.length`는 **94개(색상 92개 + radius 2개)**다. `Object.keys(themes/default.json의 tokens).length`는 색상 직접 설정값 **92개**이며 radius는 JSON에 없고 CSS Template에서 기본값을 제공한다. `scripts/theme-defaults.mjs --check`는 JSON + `scripts/theme-templates/{primitives,default}.css` → `packages/ui/src/theme/{primitives,default}.css` 및 `default-values.generated.ts`의 **94개 계약 기본값** 연결을 확인한다. 공개 CSS의 계산·Component 매핑 변수 선언 수는 이 Runtime 입력 수와 별도 집계다.
|
||||
|
||||
기본 Theme은 `@company/ui`가 배포하는 CSS에 포함하고 앱이 초기 렌더 전에 로드한다. Runtime 값이 없거나 가져오기·검증에 실패해도 기본값으로 UI가 렌더링되어야 한다. 현재 Light/Dark 구분은 없으며 단일 HM Theme 값을 기준으로 한다([테마 토큰 가이드](테마-토큰-가이드.md) 참조).
|
||||
|
||||
|
||||
@@ -2,6 +2,8 @@
|
||||
|
||||
RESULT: PARTIAL. 승인된 두 Gradient의 구현·빌드·브라우저 검증은 PASS다. Guard의 패키지 범위 및 동적 스타일 NOT VERIFIED는 보존한다. Git Commit/Push 결과와 최종 SHA는 작업 최종 응답에서 기록한다.
|
||||
|
||||
> 이 문서는 Gradient 추가 당시의 검증 기록이다. 현재 Foundation Color에서는 공통 Background 3개만 미리보기하고 Button 전용 미리보기는 제거했다. 실제 Button·Dashboard Gradient와 당시 검증 결과는 보존한다. [현재 표시 계약](../guidelines/runtime-theme-contract.md)을 따른다. 현재 문서의 개인 식별 정보 정리는 과거 Git 객체나 Commit Author/Committer를 삭제하지 않는다.
|
||||
|
||||
## 기준과 범위
|
||||
|
||||
- 공식 경로 `D:\디자인시스템\HMDesign-Gitea-Transfer`, `main`, origin `https://gitea.hmac.kr/b25027/HMDesign.git`.
|
||||
@@ -64,9 +66,9 @@ SCOPE-001은 package 계약·생성값·Template이 증명된 소비 Storybook g
|
||||
## Git Identity와 인증
|
||||
|
||||
- 기존 전역 `user.name`과 이전 Commit의 Author/Committer는 Windows PC 이름을 포함했다. 기존 이메일은 PC 호스트명으로 구성된 주소는 아니지만 공식 Gitea 기본 이메일과 달랐다. 기존 이력과 전역 설정을 보존했다.
|
||||
- 기존 Credential Manager의 HTTPS credential로 공식 Gitea `/api/v1/user` 및 `/api/v1/user/emails`를 조회했다. 인증 계정 `b25027`, 실제 프로필 이름 `김수현`, 기본 이메일 `shkim4@samaneng.com`의 primary/verified 상태를 확인했다. 인증된 Push 사용자와 Commit 작성자는 별도로 확인한다.
|
||||
- 기존 Credential Manager의 HTTPS credential로 공식 Gitea `/api/v1/user` 및 `/api/v1/user/emails`를 읽기 전용 조회했다. 공식 계정의 프로필과 기본 이메일 primary/verified 상태 일치를 확인했다. 인증된 Push 사용자와 Commit 작성자는 별도로 확인하며 개인 이름·이메일은 문서에 중복 기재하지 않는다.
|
||||
- `/api/v1/user/settings`의 `hide_email=false` 확인. 이메일 숨김 옵션은 존재하지만 현재 활성화되지 않았다. 서버의 정확한 noreply 주소는 확인하지 않았으며 임의 생성하지 않았다. 현재 확인된 공개 기본 이메일을 사용한다. Git Commit의 Author/Committer 이메일은 저장소 이력에 기록된다.
|
||||
- 현재 저장소 `.git/config`에만 `user.name=김수현`, `user.email=shkim4@samaneng.com` 적용. `git var GIT_AUTHOR_IDENT`와 `GIT_COMMITTER_IDENT`도 이 값으로 해석됨을 확인했다.
|
||||
- 현재 저장소 Local Git 작성자 설정만 공식 계정에 맞춰 적용했고 `git var GIT_AUTHOR_IDENT`와 `GIT_COMMITTER_IDENT`도 해당 설정으로 해석됨을 확인했다. 실제 이름·이메일은 Git 설정과 Gitea 계정에서 관리한다.
|
||||
- 작업 프로세스의 Author/Committer 및 Git config 환경 Override는 없었다. 별도 core.hooksPath/사용자 정의 Git hook도 없었다. 현재 생성하는 Commit의 실제 메타데이터를 Commit 후 다시 확인한다.
|
||||
- 원격 URL·기존 Credential Manager·인증 방식·전역 config를 변경하지 않았고 재로그인·Token 재발급·GitHub Push·이력 재작성도 하지 않았다. 인증 비밀값은 출력·파일 저장하지 않았다.
|
||||
- 관련 12개 파일만 Stage, Staged Diff 검토 후 요청된 `feat(theme): add brown and orange background gradients`로 일반 Commit/Push한다. Commit/Push 직전 원격 main이 시작 SHA에서 변경되면 중단한다. 신규 Commit의 Gitea 계정 attribution 및 Local/Remote SHA·Working Tree는 최종 응답에서 기록한다.
|
||||
Reference in new issue
Block a user