docs(ai): split SW usage into general / viewer mode in packaged AI guides

- Usage types are now Web / SW (general mode, viewer mode) / OrgChart / mixed.
  Shared AI_GUIDE step 1 asks for the SW mode only when the request or the
  project setting (HMDesign 사용 유형: SW 일반 | SW 뷰어) leaves it open;
  examples B0/B1/B2 cover "HMDesign SW로 화면을 만들어 주세요", general and viewer.
- Missing-component handling in three steps (reuse in the chosen type/mode ->
  build with that mode's tokens -> HMDesign-consistent style, reported as
  "AI 구성 값 — 디자인 확인 필요"), plus SW general/viewer separation rules.
- sw/ai: AI_USAGE §0 mode selection, catalog §8 lists all 33 SWViewer* exports,
  DESIGN_RULES §11 viewer tokens, PATTERNS 7 viewer composition; examples B/F
  marked as general mode. ui/ai and org-chart/ai aligned with the new types.
- AGENTS_SNIPPET, AGENTS.md and MAINTAINING updated; copies synced.
- scripts/ai-docs.mjs: shared-copy check ignores CRLF/LF (core.autocrlf=true
  checks out packages/sw as LF and the rest as CRLF).
- Verification record updated (code samples typechecked, built and rendered).
This commit is contained in:
shkim4 committed 2026-10-19 17:34:15 +09:00
1 parent be7a04a847
commit 7621934f69
25 files changed
+779 -235

No files matched your search

+15 -2
View File
@@ -1,6 +1,6 @@
# @hm-design/org-chart — AI 코딩 도구 사용 안내 (OrgChart)
먼저 [AI_GUIDE.md](./AI_GUIDE.md)(공통 1~7단계)를 읽고 사용 유형이 **OrgChart** 또는 OrgChart가 포함된 혼합일 때 이 폴더를 씁니다. 이 폴더(`node_modules/@hm-design/org-chart/ai/`)는 Core `@hm-design/org-chart` 0.1.0과 React 어댑터 `@hm-design/org-chart-react` 0.1.0의 공개 Export·타입에서 확인한 내용만 적습니다.
먼저 [AI_GUIDE.md](./AI_GUIDE.md)(공통 1~7단계)를 읽고 사용 유형이 **3 OrgChart** 또는 OrgChart가 포함된 **4 혼합**일 때 이 폴더를 씁니다. 이 폴더(`node_modules/@hm-design/org-chart/ai/`)는 Core `@hm-design/org-chart` 0.1.0과 React 어댑터 `@hm-design/org-chart-react` 0.1.0의 공개 Export·타입에서 확인한 내용만 적습니다.
| 문서 | 내용 |
|---|---|
@@ -8,9 +8,22 @@
| [DESIGN_RULES.md](./DESIGN_RULES.md) | 승인된 기본 디자인, 회사 컬러, 공개 CSS 입력 `--hm-orgchart-*`, 변경 가능/불가 경계 |
| [COMPOSITION_PATTERNS.md](./COMPOSITION_PATTERNS.md) | Chart Only(React·Vanilla), Full Page(Web + OrgChart), 데이터 생성·변환, 팝업 선택 |
## 0. 사용 유형 (공통 체계)
사용 유형은 **1 Web / 2 SW(SW 일반 모드 · SW 뷰어 모드) / 3 OrgChart / 4 혼합**이고, 소비 프로젝트 설정 값은 `HMDesign 사용 유형: Web | SW 일반 | SW 뷰어 | OrgChart | 혼합(영역별)`입니다. 확인 순서·질문 문구·설정 방법은 [AI_GUIDE.md](./AI_GUIDE.md)가 정의하며 여기서 반복하지 않습니다. 유형·모드 사이를 임의로 섞지 않고, 이 패키지의 컴포넌트·CSS 원본은 수정하지 않습니다.
- **OrgChart 선택 시** 아래 §1의 Chart Only / Full Page 질문은 유형 질문과 **같은 메시지에서 한 번만** 묻습니다. 유형·생성 방식이 이미 정해졌으면 묻지 않습니다.
- **혼합:** 영역별로 패키지를 나눕니다. Full Page의 바깥(Page·Navigation·제목·필터)은 Web(또는 요청한 패키지), 조직도 영역은 OrgChart입니다. SW 화면 안의 조직도는 SW 영역과 OrgChart 영역을 분리하고, SW 모드 규칙은 `node_modules/@hm-design/sw/ai/` 문서를 따릅니다. 두 패키지는 서로 의존하지 않으며 **SW 화면 + 조직도 조합은 패키지에서 검증된 적이 없어 NOT VERIFIED**입니다(결과 보고에 적습니다).
### 없는 UI의 처리 (OrgChart 기준 3단계)
1. **기존 Core/React 우선:** [COMPONENT_CATALOG.md](./COMPONENT_CATALOG.md)의 컴포넌트·옵션·Props로 먼저 해결합니다(예: `presentationMode`, `autoLayout`, `employeePopup`, `companyTopNodes`).
2. **없으면 소비 프로젝트에 신규 구현:** 조직도 바깥 UI는 소비 프로젝트에 만들고, 조직도에 맞춘 색·글꼴은 공개 입력 `--hm-orgchart-*`와 [DESIGN_RULES.md](./DESIGN_RULES.md)를 참고합니다. 카드·연결선·배치(승인 디자인)는 바꾸지 않고 패키지 원본·Shadow DOM 내부도 수정하지 않습니다.
3. **참고할 값이 없으면:** HMDesign 공통 규칙(Font Weight 400/500/700, Light/Dark 없음, 전역 CSS 금지)과 조화되게 구성합니다. 토큰·승인 기록에 없는 값은 결과 보고에 **"AI 구성 값 — 디자인 확인 필요"**로 적습니다.
## 1. 생성 방식 사전 선택 (필수)
새 조직도 컴포넌트나 조직도 페이지를 만들 때 **생성 방식이 요청에 없으면 코드 작성 전에** 대화에서 묻습니다(웹페이지에 선택 UI를 만들지 않음). 이미 말했으면 다시 묻지 않습니다.
새 조직도 컴포넌트나 조직도 페이지를 만들 때 **생성 방식이 요청에 없으면 코드 작성 전에** 대화에서 묻습니다(웹페이지에 선택 UI를 만들지 않음). 사용 유형도 정해지지 않았다면 유형 질문과 같은 메시지에서 한 번에 묻고, 이미 말했으면 다시 묻지 않습니다.
> 조직도만 기존 페이지에 삽입할까요, 아니면 레이아웃까지 구성한 새 페이지 전체를 생성할까요?
>