shkim4/HMDesign
Private
Public Access
1
0 Fork 0
Code Activity

docs(org-chart): update usage guide and release readiness

Browse Source 
Update the usage guide with current Auto/Expanded Chart Only behavior, React and Vanilla public APIs, optional HMDesign Dialog, and Gitea commit pinning/update instructions.

Preserve unresolved Guard failures, security warnings, accessibility risks, and pending design, main merge, and deployment approvals.
This commit is contained in:
shkim4 committed 2026-10-13 21:02:33 +09:00
1 parent d56d587fd2
commit e525d557c4
2 files changed
+240 -23
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

docs/org-chart/org-chart-usage-guide.md
+60 -23
View File
@@ -1,14 +1,14 @@
# HMDesign OrgChart 공통 사용 가이드
개발자·Codex·Claude가 현재 공개 API로 조직 데이터를 연결하기 위한 가이드다. 구현 기준은 `feature/orgchart-package`의 **`5acaf8a29596317133e54e8ad437ee00beba1cf0`**(2026-10-13)과 P10.2에서 통합한 React Wrapper Entry 개선이다. P10.3의 Git 공유 대상은 이 Feature 브랜치이며 실제 받은 버전은 `git rev-parse HEAD`로 확인한다. 과거 P-AI1의 구버전 제한을 현재 지원 여부로 사용하지 않는다.
개발자·Codex·Claude가 공개 API로 조직 데이터를 연결하기 위한 가이드다. **2026-10-13 P10.7의 검증 기준 Commit은 `d56d587fd20316f19554105f33c200060394962b`**(`feature/orgchart-package`)이다. 이 SHA는 당시 검증한 버전이며 향후 최신 버전을 뜻하지 않는다. 실제 받은 버전은 `git rev-parse HEAD`로 확인한다. 기능 검증 근거는 [최종 Feature 통합 보고서](final-integration-2026-10-13.md), 승인 대기 항목은 [P10.7 정식 통합 승인 준비](release-readiness-p10-7.md)를 따른다. 과거 P-AI1/P10.2의 제한을 현재 지원 여부로 사용하지 않는다.
빠른 시작은 아래 데이터 파일과 React 또는 Vanilla 진입점을 함께 복사한다. 예제는 Vite의 TypeScript 환경을 전제로 한다. **이 가이드의 기본 예제는 현재 Auto 컴포넌트를 사용하는 예제이며, 외부 UI가 없는 Chart Only 구현 완료를 뜻하지 않는다.**
빠른 시작은 아래 데이터 파일과 React 또는 Vanilla 진입점을 함께 복사한다. 예제는 Vite의 TypeScript 환경을 전제로 한다. 기본 예제는 제목·요약·툴바가 있는 Auto 화면이다. **Auto/Expanded Chart Only는 구현 및 기존 브라우저 검증이 완료됐으며**, 외부 UI 없이 삽입할 때는 [Chart Only 공개 API](#chart-only-공개-api-auto)를 사용한다. **Fixed Full Composition은 지원하지만 Fixed Chart Only는 미지원**이다.
## 1. 설치·패키지·실행 환경
- `@hm-design/org-chart@0.1.0`: 데이터 타입·Validator·JSON DataSource·집계·이동 함수·DOM 렌더러. React 없이 사용한다. 내부 엔진 의존성은 `orgchart@6.0.0`이며 소비자가 엔진을 직접 조작하지 않는다.
- `@hm-design/org-chart-react@0.1.0`: 위 Core에 의존하는 React lifecycle adapter. 조직 배치·카드·데이터 검증을 다시 구현하지 않는다. React peer는 `^19.0.0`, HM Dialog 선택에 사용하는 `@hm-design/ui@0.1.0` peer는 optional이다.
- 저장소는 npm workspaces다. Git Clone 후 소스에서 설치·빌드한다. 외부 Registry에 두 패키지가 게시됐다는 증거는 이번 범위에 없다.
- 저장소는 npm workspaces다. 공유 방식은 공식 Gitea 소스 연결이며 Git Clone 후 의존성 설치·빌드를 별도로 수행한다. npm Registry Publish와 ZIP 배포는 현재 공유 방식에 포함하지 않는다.
- Core 렌더링은 DOM·Shadow DOM·ResizeObserver·native dialog를 사용하는 브라우저 작업이다. SSR 중에는 mount하지 않는다. React 호스트도 client 경계에서 렌더링한다.
### Feature 브랜치 Git Clone
@@ -20,6 +20,9 @@ git clone --branch feature/orgchart-package --single-branch https://gitea.hmac.k
cd HMDesign-OrgChart
git branch --show-current
git rev-parse HEAD
# 검증 기준 고정: 기존 변경이 없는 새 Clone에서 실행한다.
git checkout --detach d56d587fd20316f19554105f33c200060394962b
git rev-parse HEAD
node --version
npm.cmd --version
npm.cmd ci
@@ -31,6 +34,15 @@ npm.cmd run build --ignore-scripts
`--ignore-scripts`는 위에서 완료한 package build를 pretypecheck/prebuild에서 반복하지 않기 위한 옵션이다. 이 위치에서 Typecheck/Build 본문은 실제로 실행된다. 루트 설치는 Storybook/HM UI를 포함하는 개발 workspace 설치이며 Core 소비자의 최소 의존성을 의미하지 않는다.
Git으로 받은 소스만으로 의존성 설치나 빌드가 완료되는 것은 아니다. `npm.cmd ci`는 해당 Commit의 lockfile을 사용하며 `npm.cmd run build:packages`가 공식 workspace 패키지 빌드 명령이다. 위 타입·테스트·앱 빌드 명령은 소비 환경 검증용 안내이며 P10.7 문서 작업에서 실행한 결과가 아니다.
### 버전 고정과 업데이트
- 브랜치 Clone은 이동하는 브랜치의 HEAD를 받는다. 재현 가능한 소비 버전은 전체 Commit SHA로 고정하고 `git rev-parse HEAD` 결과를 소비 프로젝트 기록에 남긴다. 위 detached checkout은 브랜치 포인터를 변경하지 않는다.
- 업데이트 시 기존 로컬 변경을 먼저 확인·보존하고 `git fetch origin feature/orgchart-package`로 후보를 가져온다. 새 승인/검증 SHA를 확인한 뒤 `git checkout --detach <새로 확인한 전체 SHA>`로 바꾼다. 예시 자리표시자를 그대로 실행하지 않는다.
- Commit을 바꾼 뒤 `npm.cmd ci`와 `npm.cmd run build:packages`를 수행하고 호스트 타입·빌드·핵심 동작을 확인한다. 같은 `0.1.0` package version만으로 두 소스 버전이 동일하다고 판단하지 않는다.
- 기존 프로젝트에는 필요에 따라 Git Submodule 또는 Subtree로 소스를 연결할 수 있다. Submodule은 부모 저장소의 gitlink Commit, Subtree는 가져온 upstream Commit을 기록한다. 두 방식도 의존성 설치·빌드·호스트 연결은 별도다. 기존 UI Submodule 사용 사례를 **OrgChart Submodule/Subtree 통합 검증 완료**로 표현하지 않는다. OrgChart의 두 통합 방식은 **NOT VERIFIED**다.
Vanilla 예제는 아래 build 명령 후 `dev:org-chart-example`로 실행한다. React 예제는 package build 후 `build:org-chart-react-example`, `dev:org-chart-react-example`을 사용한다. HM Dialog Reference는 `npm.cmd run storybook`의 Expanded OrgChart에서 확인한다. 포트가 사용 중이면 기존 서버를 재사용한 결과를 독립 Clone 성공으로 보고하지 않는다.
저장소의 설치 절차를 완료한 환경에서 사용하는 명령이다. Windows에서는 `npm.cmd`를 사용한다.
@@ -57,7 +69,7 @@ npm.cmd pack -w @hm-design/org-chart-react --ignore-scripts --pack-destination t
npm.cmd pack -w @hm-design/ui --ignore-scripts --pack-destination test-results/local-pack
```
생성물은 Git ignored 로컬 검증 자료다. A/B/C는 별도 호스트 폴더에서 아래처럼 설치한다. Registry publish 여부는 확인되지 않았다.
생성물은 Git ignored 로컬 검증 자료이며 Git으로 받은 소스에서 소비자가 만드는 설치 artifact다. tarball/ZIP을 별도 배포하거나 Registry에 게시하는 절차가 아니다. A/B/C는 별도 호스트 폴더에서 아래처럼 설치한다.
```powershell
# A: Core + Vanilla. React/HMDesign UI 없이 설치한다.
@@ -428,7 +440,7 @@ nullable 필드는 생략하거나 빈 문자열로 대신하지 않는다. 필
- `initialVisibleDepth?: 1 | 2 | 3 | 'all'`: 기본 all. 해당 Depth부터 그룹을 접는 초기 정책이고 조직장은 남는다. 값을 변경하면 접힘 상태를 초기 정책으로 재설정한다. 다른 레이아웃 변경은 유효한 ID의 접힘 상태를 유지한다.
- `hybridOrganizationIds?: readonly string[]`: TB에서 지정 조직의 자손만 세로 배치. LR/global Hybrid와 동시 사용은 거절한다. 전환 전에 빈 배열로 해제한다.
- `interactions: { collapse?, zoom?, pan? }`: 각각 기본 true, 서로 독립이다. Compact 레이아웃, 임의 `layoutConfig`, 엔진 방향 옵션 전달, 공개 collapse setter는 없다.
- 초기 자동 배치는 배율 1을 기본으로 실제 Bounds의 가로 중앙을 맞추며 상단 여유를 둔다. 항상 가로·세로 중앙 Fit하는 동작과 다르다. 사용자가 Pan/Zoom한 뒤에는 viewport를 보존한다.
- `presentationMode: 'default'`에서 `initialView`를 생략하면 초기 배율 1·Bounds의 가로 중앙·상단 여유 배치다. `initialView: 'fit'` 또는 Chart Only 기본값은 전체 Bounds를 맞추고 가로·세로 중앙에 배치한다. 사용자가 Pan/Zoom한 뒤에는 viewport를 보존한다.
- 명시적 Fit은 표시된 Bounds를 맞추고 가로·세로 중앙에 둔다. 큰 입력은 읽기 어려울 만큼 축소될 수 있어 initial Depth 또는 확대를 함께 검증한다. Fit은 수동 zoom.min보다 작아질 수 있다.
- Auto unknown 회사 프리셋은 거절한다. 회사 선택 `undefined`=전체, `[]`=명시적 빈 표시. 회사 숨김/복귀는 원본 데이터나 완료된 이동을 삭제하지 않는다.
- `companyTopNodes`는 회사 ID별 `employeeId/title/name/profileImage/organizationName/display` 표시 옵션이다. 기본은 Root.leaderId이며 직원은 해당 회사 Root 소속이어야 한다. `employeeId: null`은 상단 카드 배정을 제거한다. `display`는 `card | titleOnly | hidden`. 표시 override는 원본 직원/팝업 identity를 바꾸지 않는다.
@@ -447,9 +459,9 @@ export async function configureLayout(chart: OrgChartHandle) {
}
```
setter는 mount 후 Auto에서 호출한다. Vanilla의 생성 옵션인 layoutMode/displayMode/companyTopNodes/employeeConnections/zoom/organizationLinks를 바꾸려면 destroy 후 새 handle을 만든다.
setter는 mount 후 Auto에서 호출한다. Vanilla의 생성 옵션인 layoutMode/displayMode/companyTopNodes/employeeConnections/zoom/organizationLinks/presentationMode/initialView/wheelZoom을 바꾸려면 destroy 후 새 handle을 만든다.
React에서는 대응 prop으로 변경한다. dataSource 변경은 reload, autoLayout/interactions/dragDropEnabled/selectedCompanyIds와 Auto 팝업 변경은 기존 handle을 갱신한다. aggregationPolicy·CSS URL·layoutMode·displayMode·companyId·companyTopNodes·employeeConnections·zoom·organizationLinks 변경은 handle을 재생성하므로 객체를 안정적으로 유지한다. `setAutoLayout`는 patch merge이며 React에서 새 autoLayout 객체에 넣지 않은 필드가 매번 Core 기본으로 초기화된다고 가정하지 않는다.
React에서는 대응 prop으로 변경한다. dataSource 변경은 reload, autoLayout/interactions/dragDropEnabled/selectedCompanyIds와 Auto 팝업 변경은 기존 handle을 갱신한다. aggregationPolicy·CSS URL·layoutMode·displayMode·companyId·companyTopNodes·employeeConnections·zoom·organizationLinks·presentationMode·initialView·wheelZoom 값 변경은 handle을 재생성한다. 객체 옵션은 값으로 비교하므로 같은 값의 inline 객체 자체가 재마운트를 일으키지는 않는다. `setAutoLayout`는 patch merge이며 React에서 새 autoLayout 객체에 넣지 않은 필드가 매번 Core 기본으로 초기화된다고 가정하지 않는다.
근거: [Core Handle/옵션](../../packages/org-chart/src/core/types.ts), [배치 정책](../../packages/org-chart/src/core/auto-layout-policy.ts), [회사 검증](../../packages/org-chart/src/core/expanded-company.ts), [Workdesk 좌표](../../packages/org-chart/src/core/workdesk-layout.ts), [Fixed 구성](../../packages/org-chart/src/core/org-chart-content.ts), [Viewport](../../packages/org-chart/src/core/expanded-viewport.ts).
@@ -493,7 +505,7 @@ Core는 Shadow DOM을 사용하므로 호스트의 일반 selector로 내부 카
### 탐색
- Auto toolbar의 확대/축소는 현재 배율×step 또는 ÷step, 기본 step=1.2, min=0.05, max=3이다. 공개 handle에는 zoomIn/zoomOut이 없으며 `zoomTo(scale)`를 사용한다.
- Ctrl/Command+휠 확대, viewport 초점에서 +/−, 빈 공간 드래그/방향키 Pan을 지원한다. `panBy(x,y)`, `getViewportState(): {scale,x,y} | undefined`를 제공한다.
- 기본 화면은 Ctrl/⌘ + 휠, Chart Only는 modifier 없이 직접 휠 Zoom을 사용한다(`wheelZoom`으로 선택 가능). 휠은 커서 중심 확대·축소이며 viewport 초점에서 +/−, 빈 공간 드래그/방향키 Pan을 지원한다. `panBy(x,y)`, `getViewportState(): {scale,x,y} | undefined`를 제공한다.
- toolbar의 100% 복원은 배율 1과 위치를 함께 복원한다. `zoomTo(1)`는 배율 변경이므로 동일한 동작이 아니다. 공개 resetViewport 메서드는 없다.
- `fitToView()`는 Auto에서 전체 표시 범위를 맞춘다. Fixed의 위 handle viewport 호출은 Auto 동작을 제공하지 않는다.
- 그룹 타이틀은 click/Enter/Space로 접기·펼치고 조직장은 남긴다. 부모 재확장 시 유효한 자손 접힘 상태를 유지한다. `interactions.collapse=false`는 토글만 끈다. 하위 내용 없는 제목은 aria-disabled로 접기 불가이나 이동/키보드 대상일 수 있다.
@@ -615,16 +627,49 @@ Auto(`layoutMode: 'auto'`)에서 `presentationMode: 'chart-only'`를 지정하
| `wheelZoom` | `'modifier' \| 'direct'` | chart-only `'direct'`, 그 외 `'modifier'` | direct는 캔버스 안에서 일반 휠로 포인터 기준 확대·축소한다. 캔버스 밖은 페이지 스크롤을 유지한다. modifier는 기존 Ctrl/⌘ + 휠이다. |
```tsx
// React — 기본 Entry, HMDesign UI 불필요. 컨테이너 높이는 호스트가 정한다.
<OrgChart dataSource={source} stylesheetUrls={{ engine: engineUrl, core: coreUrl }}
layoutMode="auto" presentationMode="chart-only" style={{ height: '100vh' }} />
// ChartOnly.tsx — 기본 Entry, HMDesign UI 불필요. 앞의 data.ts를 사용한다.
import { OrgChart } from '@hm-design/org-chart-react';
import { JsonOrgChartDataSource } from '@hm-design/org-chart';
import engineUrl from '@hm-design/org-chart/engine.css?url';
import coreUrl from '@hm-design/org-chart/style.css?url';
import { singleCompany } from './data';
const source = new JsonOrgChartDataSource(singleCompany);
export function ChartOnly() {
return <OrgChart dataSource={source}
stylesheetUrls={{ engine: engineUrl, core: coreUrl }}
layoutMode="auto" presentationMode="chart-only"
initialView="fit" wheelZoom="direct" dragDropEnabled={false}
style={{ height: '100vh' }} />;
}
```
```ts
// Vanilla — 같은 Core 옵션
createOrgChart({ container, dataSource, stylesheetUrls, layoutMode: 'auto', presentationMode: 'chart-only' }).mount();
// chart-only.ts — 앞의 data.ts와 호스트가 제공하는 HTMLElement를 사용한다.
import { createOrgChart, JsonOrgChartDataSource } from '@hm-design/org-chart';
import engineUrl from '@hm-design/org-chart/engine.css?url';
import coreUrl from '@hm-design/org-chart/style.css?url';
import { singleCompany } from './data';
export async function mountChartOnly(container: HTMLElement): Promise<() => void> {
const chart = createOrgChart({
container, dataSource: new JsonOrgChartDataSource(singleCompany),
stylesheetUrls: { engine: engineUrl, core: coreUrl },
layoutMode: 'auto', presentationMode: 'chart-only',
initialView: 'fit', wheelZoom: 'direct', dragDropEnabled: false,
});
try {
await chart.mount();
if (chart.getState().status !== 'ready') throw new Error('조직도를 표시할 수 없습니다.');
return () => chart.destroy();
} catch (error) {
chart.destroy();
throw error;
}
}
```
- 두 예제는 기본값과 같은 `initialView`/`wheelZoom`을 명시해 선택 가능한 값을 보여준다. Vanilla 호스트는 높이를 정하고 반환 cleanup을 lifecycle 종료 때 호출한다. `/hm-dialog` Entry의 Chart Only도 같은 Props를 쓰며 팝업은 `employeePopup="hm-dialog"`를 명시한다.
- 캔버스는 컨테이너 높이를 채운다(`height: 100%`). 컨테이너 높이가 정해지지 않으면 최소 320px이다.
- 자동 Fit 시점: 최초 렌더링, `update()`/`reload()`/React `dataSource` 교체, 회사 선택·Auto layout 변경. 휠 Zoom·Pan·직원 팝업·그룹 접기/펼치기·Drag & Drop ON/OFF·React 단순 리렌더링에서는 다시 Fit하지 않는다. 사용자가 조작하기 전 캔버스 크기가 바뀌면 다시 Fit하고, 조작한 뒤에는 사용자 뷰를 유지한다.
- Fit 배율이 `zoom.min`보다 작을 수 있다(대규모 조직). 이때 휠 축소는 Fit 배율에서 멈추고, 확대는 `zoom.max`까지 가능하다. 카드 크기·글자 크기는 바꾸지 않는다.
@@ -633,15 +678,7 @@ createOrgChart({ container, dataSource, stylesheetUrls, layoutMode: 'auto', pres
- **Fixed는 지원하지 않는다.** `presentationMode: 'chart-only'`와 Fixed(`layoutMode` 생략 포함)를 함께 쓰면 `TypeError`를 던진다. 승인된 Workdesk 구성(제목·요약·아트워크·비례 축소)을 임의로 걷어내지 않기 위해서다. Fixed에 Auto와 같은 휠 Zoom/Pan도 없다.
- 실행 예제와 브라우저 검증: [`examples/org-chart-chart-only`](../../examples/org-chart-chart-only/README.md).
아래 P10.2 문단은 이 API가 생기기 전의 검증 기록이다.
P10.2에서 ChartOnly Worktree의 정책 보완을 통합했다. 기본 목표는 **White Canvas + OrgChart Nodes + Connectors**이며 외부 제목·기준일·요약·Zoom/Fit 버튼 바·설명·회색 배경은 요청 없이 추가하지 않는다. 정책은 생성 지침이며 새 Core prop/기능이 아니다. 현재 Auto는 heading/기준일·회사/인원 요약·Zoom/Fit toolbar·배율/조작 안내·Drag & Drop feedback를 내부 생성한다. Fixed readOnly도 heading·기준일과 기존 구성 요소를 유지한다.
현재 공개 옵션에는 `chartOnly`, `showToolbar`, `showHeader` 또는 모든 내장 부가 UI를 끄는 기능이 없다. displayMode readOnly나 presentation 생략으로 해결된다고 주장하지 않는다. `createOrgChartTree`는 기존 Fixed 계열 독립 Tree이며 Auto 기능 전체의 대체 API가 아니다. 요구한 최소 화면을 공개 API로 구현할 수 없으면 제약과 별도 승인 필요성을 보고하고 Core 복제·Shadow DOM 임의 조작·강제 숨김·병렬 정책 수정으로 해결하지 않는다.
P10.2의 독립 실제 tarball 브라우저 검사에서는 한맥기술 2본부×2팀·전체 20명 데이터를 React/Vanilla로 렌더링했다. 390/768/1280/1440px에서 흰색 내부 캔버스·7개 조직·20개 고유 직원 카드·TB 계층 연결선·Zoom/Pan과 콘솔 오류 0을 확인했다. 그러나 위 내장 UI와 `rgb(244, 247, 251)` 바깥 영역이 남아 **Chart Only PARTIAL**이다. Fixed readOnly도 제목·기준일을 유지한다. DOM 숨김·삭제·Core 수정은 사용하지 않았다.
Auto 초기 배치는 전체 Bounds의 **가로 중앙·상단 16px 정렬**이며 초기 자동 Fit과 다르다. Vanilla의 공개 `fitToView()`는 실제 전체 Bounds로 가로·세로 중앙 배치/축소를 수행한다. React Wrapper에는 공개 handle/ref나 초기 Fit prop이 없으므로 버튼 바 없이 호스트가 이 동작을 직접 요청하는 경로는 없다. 후속 개선 후보는 기본 동작을 유지하는 선택형 부가 UI 표시 옵션과 초기 Fit 정책이다. 이들은 현재 API가 아니며 이번 작업에서 추가하지 않았다. 자세한 근거와 미검증은 [P10.2 통합 보고서](integration-report-p10-2.md)를 참조한다.
P10.2 당시에는 내장 UI와 바깥 회색 영역이 남아 Chart Only가 PARTIAL이었으며 React 초기 Fit 옵션도 없었다. 이 **과거 검증 원본은 [P10.2 통합 보고서](integration-report-p10-2.md)에 보존**한다. 이후 위 공개 옵션 3개가 구현됐고 [최종 통합 검증](final-integration-2026-10-13.md)은 Auto Chart Only React/Vanilla 51/51 PASS를 기록한다. 과거 PARTIAL을 현재 기능의 미완료 상태로 해석하지 않는다. `chartOnly`/`showToolbar`/`showHeader`라는 prop은 현재도 없으며 정확한 API는 `presentationMode`다. `displayMode: 'readOnly'`나 dataset의 `presentation` 생략은 Chart Only 선택을 대신하지 않는다. `createOrgChartTree`도 Auto Chart Only의 대체 API가 아니다.
React 없이 생성해 달라는 명시적 요청은 이 가이드의 Vanilla Core 경로로 처리하고 [Runtime portability](../guidelines/runtime-portability.md)의 명시적 adapter 계약을 확인한다. HM React 화면을 HTML로 모방해 결과라고 제출하지 않는다.
@@ -688,4 +725,4 @@ React 없이 생성해 달라는 명시적 요청은 이 가이드의 Vanilla Co
- [데이터 타입](../../packages/org-chart/src/data/types.ts), [검증](../../packages/org-chart/src/data/validate.ts), [이동](../../packages/org-chart/src/data/moves.ts): 실제 Contract와 정책.
- [P10 보고서](implementation-report-p10.md): 기존 PARTIAL/Guard FAIL·별도 미검증 기록. 현재 기능의 근거는 보고서보다 이 가이드 기준 소스다.
원본 UsageGuide Worktree의 문서 예제 검증 기록은 위에 보존했다. P10.2에서는 이 가이드의 Entry/설치/Adapter 설명과 Chart Only 정책 연결을 보완한다. 제품 코드·기존 디자인·Core 공개 API를 추가 변경하지 않는다.
원본 UsageGuide/P10.2의 문서 예제 검증 기록은 위에 보존했다. P10.7에서는 검증 기준 SHA·Gitea Commit 고정 절차·현재 Chart Only 지원 상태와 옵션 설명을 공개 소스와 대조했다. 새 전체 타입 검사·제품 테스트·빌드·브라우저 검사는 수행하지 않았다. 제품 코드·기존 디자인·Core 공개 API 변경 없음.
docs/org-chart/release-readiness-p10-7.md
+180
View File
@@ -0,0 +1,180 @@
# HMDesign OrgChart P10.7 — 정식 통합 승인 준비
문서 정리 대상: 2026-10-13. **main 병합 준비 상태: PENDING — READY 아님.** 개발 완료 근거와 승인 요청을 정리했으며 최종 디자인·Guard 예외·보안·접근성·배포 승인은 완료되지 않았다. 이 문서는 병합/배포 실행 승인이 아니다.
## 1. 범위와 Git 기준
| 항목 | 확인 결과 |
|---|---|
| 작업 경로 | `D:\디자인시스템\HMDesign-OrgChart-Recovered` |
| 브랜치 | `feature/orgchart-package` |
| 공식 origin | `https://gitea.hmac.kr/b25027/HMDesign.git` |
| 작업 전·후 Local HEAD | `d56d587fd20316f19554105f33c200060394962b` |
| 원격 Feature | `d56d587fd20316f19554105f33c200060394962b` |
| 원격 main | `c45d63a03b84eaac43f01bd400a16488a80e4229` |
| 원격 확인 방법 | P10.7에서 `git ls-remote origin refs/heads/feature/orgchart-package refs/heads/main` 읽기 전용 조회 성공 |
| 작성자 설정 | `b25027` / `shkim4@samaneng.com` |
| 시작 Working Tree | 깨끗함 |
| 완료 Working Tree | 사용 가이드 수정 1개 + 이 문서 신규 1개, unstaged |
이 작업의 명시적 경로·Commit/Push 보류 요청을 적용했다. 보존용 `HMDesign-OrgChart`는 증거를 읽기만 했으며 수정하지 않았다. 제품 코드·Storybook·Theme·Guard·package.json·lockfile·Docker 및 AGENTS.md/CLAUDE.md/AI 생성 정책을 변경하지 않는다. Stage·Commit·Push·main Checkout·Merge·PR·Workflow 실행·서버 접속·Registry Publish 미진행.
## 2. 개발 완료와 재사용 근거
현재 공개 API와 기준 SHA의 소스를 대조했다. [사용 가이드](org-chart-usage-guide.md), [최종 통합 보고서](final-integration-2026-10-13.md), [Chart Only 구현 보고서](implementation-report-chart-only.md), [최소 설치 보고서](minimal-install-report-2026-10-13.md)가 기능 근거다.
| 대상 | 기존 검증 상태 | P10.7 해석 |
|---|---|---|
| Fixed Full Composition / Expanded | 지원, 기존 기능 검사 PASS | Fixed Chart Only 지원을 뜻하지 않음 |
| Core / React / Vanilla 독립 사용 | 기존 설치·타입·빌드·실행 PASS | HM UI는 `/hm-dialog` 선택 시에만 연결 |
| Auto/Expanded Chart Only | 최종 통합 React/Vanilla 51/51 PASS, 콘솔 오류 0 | 초기 Fit·Bounds 가로/세로 중앙·직접 휠 Zoom·Pan·팝업·접기 유지 |
| 기존 Expanded 기본 표시 | 기존 제목·요약·툴바·modifier 휠 유지 확인 | Chart Only는 명시적 선택 옵션 |
| Core 단위 테스트 | 86/86 PASS | 기존 결과, 재실행 안 함 |
| Guard 회귀 테스트 | 94/94 PASS | 분석기 자체 검사이며 실제 Guard FAIL과 별개 |
| AI 생성 정책 | 생성 방식 사전 질문 정책 통합 | 기존 정책 문서 수정 없음 |
Chart Only 공개 값은 `presentationMode: 'default' | 'chart-only'`, `initialView: 'center' | 'fit'`, `wheelZoom: 'modifier' | 'direct'`다. Core 옵션을 React Props가 상속한다. Chart Only의 기본은 fit/direct이며 외부 제목·요약·툴바·설명을 생성하지 않는다. Fixed Full Composition에서 Chart Only를 함께 지정하면 TypeError로 거부한다. Fixed Chart Only는 **미지원**이지 승인 대기 구현이 아니다.
**P10.6 재사용:** [HMDesign OrgChart P10.6 점검](codex://threads/01a1350c-f2eb-7ca0-9230-abda73022abc) 채팅의 2026-10-13 최종 보고를 확인했다. 관련 파일 143개가 보존본과 줄바꿈을 제외하고 동일하다는 기존 확인, 정적 main 비교, 브랜치 정책 조회, 캡처 검토 결과를 재사용한다. P10.6은 파일 변경 0개였고 별도 tracked 보고서가 없다. 이번 원격 SHA가 같으므로 전체 비교·제품 테스트·빌드·Guard·npm audit·브라우저 검사를 반복하지 않았다.
복구 Clone에는 ignored 캡처/JSON이 없다. 아래 기존 증거는 **보존 폴더의 로컬 자료**이며 다른 PC/새 Clone에는 포함되지 않는다. 파일 존재와 기록은 확인했지만 P10.7에서 캡처를 새로 생성하거나 화면을 다시 승인하지 않았다. 과거 보고서와 원본 결과는 수정하지 않는다.
## 3. Guard 잔여 FAIL 5건의 한정 예외 요청
현재 기록: **TOKEN-001 FAIL 5 / NOT VERIFIED 9**. F3–F7 해결로 기존 FAIL 10→5, 새 FAIL 0이다. 기존 [P10 보고서](implementation-report-p10.md), [P10.3 GuardReview](guard-review-p10-3.md)의 FAIL 10건 기록을 보존한다.
원본 로컬 결과: `D:\디자인시스템\HMDesign-OrgChart\_local\final-integration\guard-final.json`. P10.7에서 읽은 원본은 `status/staticStatus = FAIL`, `runtimeStatus = NOT VERIFIED`이며 수정하지 않았다. `styleEvidence`는 **STATIC PASS / RUNTIME NOT VERIFIED / DESIGN_INTENT PASS / FINAL NOT VERIFIED**, 결합 `styleVerification`은 미생성이다. 디자인 의도 상태나 회귀 94/94로 원본 Guard를 PASS로 바꾸지 않는다.
공용 분석기는 Shadow DOM에 주입되는 공개 OrgChart CSS와 런타임 `style.setProperty` 정의를 충분히 추적하지 못한다. 현재 선언을 소스에서 다시 대조했다.
| 기존 ID / 검사 | 실제 토큰명 | 사용 위치 | 실제 선언·연결 근거 | 기술적 영향 / 예외 사유 | 책임자·승인자 / 승인일 / 결과 |
|---|---|---|---|---|---|
| F1 / TOKEN-001 | `--hm-orgchart-current-gradient` | `department-colors.ts:47` | 같은 preview row에 `applyOrganizationStyle(row,index)` 호출(`:28`), `style-presets.ts:71` setter → swatch 자손 상속 | Department Colors 미리보기 참조. 실제 선언은 있으나 Guard 정의 목록 밖 | PENDING / PENDING / PENDING |
| F2 / TOKEN-001 | `--hm-orgchart-current-card-background` | `department-colors.ts:47` | 위 row 경로, `style-presets.ts:63–64` setter | F1과 같은 상속 경로, 미선언 토큰을 새로 허용하는 요청 아님 | PENDING / PENDING / PENDING |
| F8 / TOKEN-001 | `--hm-orgchart-resolved-bg-surface` | `style-presets.ts:9` | `src/styles/design-tokens.css:8` 선언 → `build.mjs`의 CSS inline → 공개 `@hm-design/org-chart/style.css` → Core Shadow DOM link | 실제 CSS load가 필요한 경로. 연결이 없는 소비자까지 정상으로 간주하지 않음 | PENDING / PENDING / PENDING |
| F9 / TOKEN-001 | `--hm-orgchart-current-border` | `style-presets.ts:74` | 같은 함수·element의 `:69–70` setter 뒤 참조 | Fixed/공통 스타일의 alias. 분석기 setter 수집 한계 | PENDING / PENDING / PENDING |
| F10 / TOKEN-001 | `--hm-orgchart-current-gradient` | `style-presets.ts:75` | 같은 함수·element의 `:71–72` setter 뒤 참조 | F9와 동일. 선언과 사용 범위가 일치 | PENDING / PENDING / PENDING |
위 파일의 기준 경로는 `packages/org-chart/src/core/`이며 CSS는 `packages/org-chart/src/styles/`다. [style-presets 소스](../../packages/org-chart/src/core/style-presets.ts), [Department Colors 소스](../../packages/org-chart/src/core/department-colors.ts), [CSS 선언](../../packages/org-chart/src/styles/design-tokens.css), [공개 CSS 생성](../../packages/org-chart/build.mjs), [Shadow DOM 연결](../../packages/org-chart/src/core/index.ts)을 근거로 한다.
**권장 결정:** 위 SHA·5개 위치·실제 연결/선언이 확인된 경로에 한정해 위험 예외 수용을 요청하고 공용 분석기 개선을 별도 과제로 분리한다. 새 파일·새 토큰·외부 입력·다른 element·미연결 CSS에는 예외를 확대하지 않는다. 새 Commit에서 이 경로가 바뀌면 근거를 다시 검토한다. 예외를 문서화하거나 승인하더라도 원본 FAIL은 남는다.
조직 정책상 Guard PASS 필수 여부와 예외 수용 가능 여부는 **NOT VERIFIED**다. 정책이 필수라면 권한 있는 승인자의 예외 또는 후속 개선이 병합 전 필요하다. 제품 실행을 막는 결함이 확인되지 않았다는 기존 분석을 배포 허가로 해석하지 않는다.
후속 개선: OrgChart 공개 CSS/`?url` 연결과 제한적인 literal setter 추적. 무조건 전역 정의로 수집하면 다른 요소·조건부 setter·미연결 CSS의 실제 미선언 참조까지 통과시킬 수 있다. 분석기 변경 범위와 회귀 기준을 별도 승인하고 기존 차단 판정을 보존해야 한다. 이번 검사기 수정·재실행·결과 변조 없음.
## 4. npm 보안 위험 수용 요청
**과거 감사 snapshot:** [2026-10-10 퍼블리셔 안정화 보고서](../guidelines/publisher-stabilization-2026-10-10.md)의 전체 감사 High 7 / 고유 Advisory 1 / 운영(`--omit=dev`) 감사 0. `GHSA-vfj7-8cjw-p6xm`이며 분석 당시 수정 패치 미공개였다. 현재 전체 패키지의 신규 audit 결과가 아니다. P10.6에서 해당 경로의 버전 동일성을 확인했지만 이후 OrgChart 연동 때문에 lockfile 전체는 과거 감사본과 다르다. 따라서 운영 0을 현재 그래프의 보안 보증으로 사용하지 않는다.
공식 [Advisory](https://github.com/advisories/GHSA-vfj7-8cjw-p6xm)는 deeply nested brace pattern으로 Node stack을 소진하는 DoS를 설명한다. P10.7에서는 링크·권고 내용을 읽기만 했고 npm audit나 의존성 업데이트를 하지 않았다.
| 패키지 | 과거 설치 버전 | 개발 의존 경로 |
|---|---|---|
| shadcn | 4.21.1 | UI workspace 직접 devDependency |
| @shadcn/registry | 0.1.0 | shadcn → registry |
| ts-morph | 26.0.0 | shadcn 또는 registry → ts-morph |
| @ts-morph/common | 0.27.0 | ts-morph → common |
| fast-glob | 3.3.3 | shadcn/registry 또는 common → fast-glob |
| micromatch | 4.0.8 | fast-glob → micromatch |
| braces | 3.0.3 | micromatch → braces, 근본 취약 패키지 |
7건은 상위 경로 전파를 포함하며 독립 취약점 7개가 아니다. 개발 도구 전용 경로라는 기존 분석을 유지하되, 개발/CI 중 공격자가 입력을 제어할 가능성은 별도로 관리한다.
| 수용 조건·결정 항목 | 근거 / 처리 방침 | 책임자·승인자 / 승인일 / 결과 |
|---|---|---|
| 고정 Glob 사용 | 기존 Guard STORYBOOK discovery는 로컬 설정의 literal glob을 fast-glob에 전달. 신뢰하는 저장소 설정만 사용 | PENDING / PENDING / PENDING |
| 공격자 입력 경로 | 비신뢰 Storybook config·registry·중첩 pattern을 CLI/Guard에 전달하면 프로세스 종료 위험. 개발 도구 외부 노출 금지, 비신뢰 입력 경로 차단 | PENDING / PENDING / PENDING |
| 소비 앱 영향 | 기존 공개 UI pack은 CLI 개발 의존 그래프를 배포하지 않는다는 분석. 현재 모든 소비 경로의 무위험을 보장하지 않음 | PENDING / PENDING / PENDING |
| CI 필수 감사 | P10.6 main Workflow에 Guard/audit 차단 단계 없음. 조직 정책·현재 감사 요구 수준은 NOT VERIFIED. 보안 담당자가 신규 audit 필요 여부와 gate/예외 조건 결정 | PENDING / PENDING / PENDING |
| 패치 후 업데이트 | 패치 공개 시 영향 범위·호환성 확인 → 별도 package/lockfile 변경 → 관련 설치·타입·빌드·audit 검증 | PENDING / PENDING / PENDING |
| 잔여 위험 수용 | 개발 전용·고정 입력 조건, 예외 적용 환경·재검토 시점·해제 조건을 보안 담당자/사용자가 확정 | PENDING / PENDING / PENDING |
패치 없음은 위험 없음이 아니다. 신규 감사와 최신 전체 그래프 평가는 **NOT VERIFIED**. `npm audit fix --force`, override/major 역행, package.json/lockfile 변경 없음.
## 5. 화면별 최종 디자인 승인 체크리스트
기능 PASS와 사용자 디자인 승인을 분리한다. 아래 기능 검증은 기존 보고서와 P10.6 검토를 재사용하며 이번 브라우저 재검사는 없다. 모든 최종 디자인 승인은 **PENDING**, 승인자·승인일은 **PENDING**이다.
기존 통합 캡처 기준 폴더: `D:\디자인시스템\HMDesign-OrgChart\test-results\org-chart-chart-only\`. 아래 링크는 현재 PC의 보존 자료이며 Git 배포 문서의 필수 실행 파일이 아니다.
| 화면 | 사용자 검토·승인 항목 | 실제 기능 검증·근거 / 캡처 | 미해결 문제 | 디자인 승인 / 승인자 / 승인일 |
|---|---|---|---|---|
| A. Overview | 관계사 로고 7개, 중복 제목 제거, 인원 현황, 기존 페이지 스타일 | 기존 P9/P10·P10.6 확인 범위 PASS. [캡처](D:/디자인시스템/HMDesign-OrgChart/test-results/org-chart-chart-only/storybook/orgchart--logo-personnel-summary.png) | 전체 폭 수동 시각 검토는 NOT VERIFIED | PENDING / PENDING / PENDING |
| B. Department Colors | 대표자 카드, 기존 조직 Gradient **6종**, 파견·휴직 미리보기, `홍 길 동`, 카드 크기·Typography | 기존 P10·최종 통합·P10.6 확인 범위 PASS. [캡처](D:/디자인시스템/HMDesign-OrgChart/test-results/org-chart-chart-only/storybook/orgchart--department-colors.png) | Guard F1/F2 잔여. 6개 조직 Gradient와 Expanded의 7회사 primary 팔레트를 구분 | PENDING / PENDING / PENDING |
| C. Full Composition | 대표자 아래 화살촉, 협업 화살표 5개, 상단·중앙·하단 반응형 배치, 파견·휴직 간격, 관계사별 인원, Core 팝업 | [P9.5 Full](implementation-report-p9-5-full-composition.md)·[팝업 검증](verification-p9-5-popup-parity.md) 및 P10.6 재사용. [캡처](D:/디자인시스템/HMDesign-OrgChart/test-results/org-chart-chart-only/storybook/orgchart--full-composition.png) | Fixed 390px 내부 스크롤 기존 검사 실패 기록 보존. 축소 배율에 따라 하단 가시 간격이 줄어듦 | PENDING / PENDING / PENDING |
| D. Expanded OrgChart | 회사별 20/100/300명, 회사 컬러 7종, TB/LR/Hybrid, Drag & Drop ON/OFF, Pan/Zoom/Fit, 직원 Dialog, 그룹·연결선 | 기존 P9.4/P9.5·최종 통합·P10.6 확인 범위 PASS. [캡처](D:/디자인시스템/HMDesign-OrgChart/test-results/org-chart-chart-only/storybook/orgchart--expanded-org-chart.png) | 삼안·장헌산업 일반 제목 대비 미달. 모든 회사·폭 수동 검토 미완료 | PENDING / PENDING / PENDING |
| E. Chart Only | 흰 캔버스, 외부 UI 없음, 초기 Fit, 가로·세로 중앙, 직접 휠 Zoom, React/Vanilla 동일 동작 | 최종 통합 51/51 PASS(기존). [React](D:/디자인시스템/HMDesign-OrgChart/test-results/org-chart-chart-only/react-100-desktop.png) · [Vanilla](D:/디자인시스템/HMDesign-OrgChart/test-results/org-chart-chart-only/vanilla-100-desktop.png) | Auto 전용. Fixed Chart Only 미지원. 같은 회사 제목 대비 위험 적용 | PENDING / PENDING / PENDING |
Full의 대표자 화살촉 1개와 협업 화살표 5개는 별개다. Cell Border Only 실험 디자인은 사용자 요청으로 **정식 적용 제외**했으며 승인 대상 기능에 포함하지 않는다. 이를 재적용하지 않는다.
화면별 승인 시 체크할 접근성 항목: control ID/접근성 이름, 키보드 탐색과 focus 복귀, disabled/readOnly, 팝업 열기·닫기, 접기 후 정보 보존, 390/768/1280/1440px overflow·가독성. 기존 검사 범위 밖의 전체 조합은 **NOT VERIFIED**이며 특히 실제 스크린리더·물리 모바일·Safari/Firefox·모든 회사/폭의 수동 검토는 남아 있다. 모든 조합을 위 기능 PASS에 포함시키지 않는다.
## 6. 색상 대비와 접근성 예외 요청
[회사 primary 선언](../../packages/org-chart/src/company-color-presets.ts)과 흰색 그룹 제목 정책을 유지한다. 아래 값은 P10.6의 선언색 계산 결과이며 새 브라우저 픽셀 실측이 아니다. [W3C SC 1.4.3](https://www.w3.org/WAI/WCAG22/Understanding/contrast-minimum.html)의 일반 텍스트 AA 기준은 4.5:1이다.
| 회사 | 배경 / 제목 | 기존 대비 계산 | 접근성 상태 | 사용자 디자인 결정 | 조직 예외 수용 / 승인자 / 승인일 |
|---|---|---|---|---|---|
| 삼안 | `#F08300` / `#FFFFFF` | 약 2.64:1 | 일반 텍스트 AA 미달 | 회사 메인색·흰 제목 유지(기존 결정) | PENDING / PENDING / PENDING |
| 장헌산업 | `#4580A6` / `#FFFFFF` | 약 4.29:1 | 일반 텍스트 AA 미달 | 회사 메인색·흰 제목 유지(기존 결정) | PENDING / PENDING / PENDING |
대상은 해당 회사색을 쓰는 Expanded/Auto Chart Only 그룹 제목이다. 기존 디자인 유지 결정은 접근성 위험 수용이나 WCAG 준수 승인이 아니다. 예외를 수용해도 WCAG PASS로 표시하지 않는다. 조직 정책상 예외 허용 여부·책임자·적용 화면·재검토 기한을 확정해야 한다. 현재 정책은 **NOT VERIFIED**다.
후속 개선 후보는 제목 영역·글자/배경 조합을 별도 디자인 검토하는 것이다. 회사색·흰 제목 정책을 바꾸는 구현은 별도 사용자 결정 후 수행한다. 이번 색상·카드·Typography 변경 없음.
## 7. main 정적 비교와 자동 배포 승인
원격 SHA가 P10.6과 동일하므로 당시 분석을 재사용한다. 공통 조상 `d18e3c33801e165e17b6d971e2f6198eed483c3c`, main 전용 Commit **3**, Feature 전용 Commit **12**, main의 배포 관련 **6개 파일**과 Feature 변경 파일의 충돌 후보 **0**. 이 결과는 파일 집합의 정적 비교이며 실제 Merge나 통합 Linux/Docker 빌드 성공 증거가 아니다.
P10.6 Gitea API 조회 결과: main 브랜치 보호 없음, 필수 승인 0, 필수 상태 검사 비활성. 이번 서버 설정 재조회는 하지 않았다. 이 설정을 사용자 병합 승인으로 해석하지 않는다. main Workflow의 Guard/npm audit 차단 단계 부재와 조직의 필수 gate 정책을 구분한다.
[기준 main 배포 Workflow](https://gitea.hmac.kr/b25027/HMDesign/src/commit/c45d63a03b84eaac43f01bd400a16488a80e4229/.gitea/workflows/deploy-storybook.yml)는 **main Push 또는 수동 실행** 조건으로 해당 SHA 소스를 SSH로 보내 release directory에서 Docker 빌드 후 Storybook 서비스를 교체하는 경로를 갖는다(P10.6 및 [P10 분석](implementation-report-p10.md)). 따라서 main Merge/Push는 운영 서비스 변경으로 이어질 수 있다. 실제 Actions 활성·Runner/Secret 상태가 확인되지 않았으므로 배포 실행 여부를 단정하지 않는다. Workflow 실행·서버 접속·Docker 검토/구성/배포를 이번에 수행하지 않았다.
| 필수 확인·승인 | 확정할 내용 | 현재 확인 상태 | 담당자·승인자 / 승인일 / 승인 결과 |
|---|---|---|---|
| main 병합 승인자 | 병합 권한자, 승인할 Feature SHA 및 문서 변경 포함 여부 | NOT VERIFIED | PENDING / PENDING / PENDING |
| 배포 담당자 | 운영 서비스 책임자와 실행·연락 주체 | NOT VERIFIED | PENDING / PENDING / PENDING |
| Gitea Actions 활성 | 저장소/서버 활성 여부, 최근 실행 여부 | NOT VERIFIED(P10.6 API 인증 제한) | PENDING / PENDING / PENDING |
| Runner 상태 | 온라인 상태·label·실행 환경·작업 가능 여부 | NOT VERIFIED | PENDING / PENDING / PENDING |
| 서버 접근 권한 | SSH Secret/변수, 대상 서버·서비스 교체 권한 | NOT VERIFIED | PENDING / PENDING / PENDING |
| 사용자 영향 | 서비스 대상·접속 경로·점검 시간·중단 가능성 | NOT VERIFIED | PENDING / PENDING / PENDING |
| 배포 실패 복구 | 이전 정상 SHA/artifact·release 경로·복구 절차·담당자·성공 확인 방법 | NOT VERIFIED, 실제 복구 절차 미확정 | PENDING / PENDING / PENDING |
| 배포 실행 허용 | 승인된 SHA의 자동/수동 배포 허용 여부와 실행 시점 | NOT VERIFIED | PENDING / PENDING / PENDING |
**READY 전제:** Guard/보안/디자인/접근성 결정과 위 운영 항목 확정, 권한 있는 승인자의 명시적 main 병합·배포 허가가 필요하다. 후속 승인 작업에서 실행 직전 원격 SHA를 다시 확인하고 승인된 통합 상태의 필요한 빌드 검증을 수행한다. 현재 문서 변경은 미커밋이므로 현재 Feature SHA에 P10.7 문서가 들어 있다고 주장하지 않는다. main에 기존 Docker 설정이 있다는 이유로 새 Docker 구성 작업을 추가하지 않는다.
## 8. 후속 개선 목록과 사용자 승인 기록
| ID | 후속 결정/작업 | 선행 조건 | 상태 / 승인자 / 승인일 |
|---|---|---|---|
| G-01 | Guard F1/F2/F8/F9/F10 한정 예외 수용 | 위 5개 실제 선언·연결 근거, 조직 gate 정책 확인 | PENDING / PENDING / PENDING |
| G-02 | 공용 Guard CSS·setter 추적 개선 | 별도 변경 범위 승인, 다른 소비자 판정 보호·회귀 기준 | PENDING / PENDING / PENDING |
| S-01 | 개발 보안 위험 수용/추가 audit 필요 여부 | 보안 담당자·입력 통제·재검토 조건 결정 | PENDING / PENDING / PENDING |
| D-A~E | 화면 5개 최종 디자인 승인 | 화면별 체크리스트·기존 캡처 검토 | PENDING / PENDING / PENDING |
| A-01 | 삼안·장헌산업 대비 위험 수용/후속 디자인 | 조직 접근성 정책·책임자·적용 범위 확정 | PENDING / PENDING / PENDING |
| M-01 | main 병합 승인 | 위 결정과 운영 배포 항목 확정, 원격 SHA 재확인 | PENDING / PENDING / PENDING |
| R-01 | 자동 배포 실행 승인 | Actions/Runner/서버/영향/복구 담당자 확인 | PENDING / PENDING / PENDING |
실제 확인된 기존 사용자 결정: 회사 메인색·흰 제목 유지, Cell Border Only 정식 적용 제외, Gitea 소스 공유 유지, P10.7 문서만 수정하고 Commit/Push 보류. 이는 **최종 화면 승인·보안/Guard/접근성 위험 수용·main 병합·배포 승인 완료가 아니다**. 위 승인자·승인일·결과는 실제 응답이 있기 전까지 PENDING으로 유지한다.
## 9. 문서 검증과 미검증 경계
P10.7 검증은 문서 정합성 범위다. 기존 기능 PASS 수는 재실행 결과로 제출하지 않는다.
| 문서 확인 항목 | 결과·방법 |
|---|---|
| Markdown 파일·캡처 링크 | PASS — 두 문서의 로컬 대상 86개 존재, 내부 앵커 3개 존재 확인 |
| 외부·채팅 참조 | PASS — 공식 Advisory/W3C 읽기 성공, 기준 Gitea Workflow HTTP 200, P10.6 채팅 읽기 성공 |
| 공개 API·React/Vanilla 예제 | PASS(정적) — 타입 선언, Props 상속, Core/React 전달, package exports, 공개 CSS, HM Entry 및 빌드 명령을 소스와 대조 |
| 현재 Feature Commit | PASS — Local HEAD와 원격 Feature, 문서 SHA 일치 |
| Chart Only·Fixed 제한 | PASS(정적) — Auto 기본 fit/direct와 Fixed TypeError 경로 대조. 기존 브라우저 결과 재사용 |
| Guard 원본 | PASS(보존 확인) — 원본 FAIL 5 / NOT VERIFIED 9 및 status/styleEvidence 유지. Guard 자체 판정은 FAIL |
| 보안 Advisory | PASS(문서 정합성) — 과거 High 7/고유 1/운영 0과 출처·시점 구분. 신규 audit 미실행 |
| 승인 상태·배포 위험 | PASS(문서 정합성) — 최종 승인 PENDING, READY 아님, main Push 배포 경로·운영 미확인 항목 명시 |
| 변경 범위 | PASS — 허용 문서 2개만 변경, staged 0, 제품/정책/과거 결과 변경 없음 |
| 공백·diff 검사 | PASS — 최종 `git diff --check` 및 신규 문서 whitespace 확인. 최종 작업 보고에 결과 연결 |
위 API/기준/보존/범위 정적 확인 스크립트는 13/13 항목 PASS다. 이는 문서 검사 수이며 TypeScript 컴파일·제품 테스트 수가 아니다. 새 TS/TSX 예제의 전체 타입 검사·실제 브라우저 실행은 이번 작업에서 수행하지 않았다.
**NOT VERIFIED:** 신규 npm audit/현재 전체 의존 그래프, OrgChart Submodule/Subtree 통합, 실제 Merge/통합 Linux·Docker build, Gitea Actions 실제 활성/Runner/서버/복구, 현재 조직의 Guard/audit/접근성 필수 정책, 현재 인증 계정의 Merge/Push 권한, Safari/Firefox·실제 모바일·스크린리더, 2,100명 전체 회귀·전체 baseline 픽셀·모든 회사/폭의 수동 시각 승인. Fixed Chart Only는 미검증 후보가 아니라 미지원이다.