@qijenchen/design-system 0.1.0-beta.13 → 0.1.0-beta.130

package/AGENTS.md

@@ -0,0 +1,8 @@
+# `@qijenchen/design-system` package scope
+
+Scoped augmentation only — never a second repository or product-governance SSOT.
+
+- In the monorepo, inherit the root `AGENTS.md`; never restate or override it here. Author governance only in the owners classified by `infra/governance/protected-root-classification.json`, then regenerate the declared build graph.
+- In an installed package, everything under `node_modules/@qijenchen/design-system` is immutable release material: never patch in place; fix upstream, publish an immutable exact version/BOM, upgrade the consumer by governed PR.
+- Consumer governance comes from the authenticated `ds-canonical/fork/manifest.json` snapshot materialized into the consumer repo. This file is navigation only and never substitutes for that snapshot, its lock, adapters, verifier, or protected CI.
+- Same owner/output boundary for rules, hooks, skills, commands, and provider views: `ds-canonical/` is the shipped canonical corpus; generated `.claude`, `.codex`, `.agents` views are rebuildable adapters, not edit targets.

package/CLAUDE.md

@@ -1,201 +1,5 @@
-# 每次任務前的 6 條 mindset(世界級設計系統的工作底色)
+@AGENTS.md
 
-這 6 條是本專案所有規則背後的**態度**。接到任務先複習一遍,再看具體規則。
+# Claude Code package-scope adapter
 
-1. **對標世界級 + 不取巧省工**——每個設計決策都要能回答「Polaris / Material / Atlassian / Ant / Carbon / Apple HIG 怎麼做?」沒對齊又說不出理由 = 設計 bug。視覺整齊度不輸原版 + 符合 DS 語言**同時成立**。**禁止以「選較簡單」「省 N edits」為由選 shortcut**——一律最世界級做法。說「快速修」「省工程」是 yellow flag,停下重想。
-2. **不憑直覺發明 / 優先消費既有**——新增任何值 / 名 / pattern / variant / layout primitive 前先 `grep` 既有。**強制 `# SSOT 消費 canonical` 清單**——寫視覺 code 前列消費的 components/patterns/tokens/spec。提建議也算定 pattern,給 option 必對照 DS canonical + ≥3 家世界級。**禁止憑印象列部分家**。
-3. **改一處必看三處**——code / spec / story 三方聯動。改 cva `defaultVariants` / variant / token 前先 grep 該元件所有檔案,一次改完。
-4. **範例必真實業務場景**——Jira / Stripe / Notion / Figma 可辨識情境;禁 `Option A/B/C`、「按鈕一」、極端不現實、ASCII art。
-5. **猶豫就問**——無前例的決策:grep 既有 → 讀近親 spec → 仍不確定停下問。**禁止憑直覺造新 pattern**。
-6. **大原則吸收瑣碎**——同類 bug 反覆糾正 = meta 層沒抓住。見 `.claude/rules/meta-patterns.md` 31 active M-rules(M1-M32,M27/M33/M34/M35 retired,折入 M20/M7/M23(c)(d))。**AI 不需 user 提醒才找 root invariant**——rule 震盪 → AI 自跑 M12 benchmark + invariant test。User 第 2 次問 → 必截圖 verify(M13)。對話結論 → AUTO 5-layer pipeline(M14)。Visual / behavior decision 前必先 WebFetch ≥ 3 source(M26)。Solo-work git ops 必先 grep canonical(M28)。**視覺/結構 propose 前必 grep DS spec.md 找 owner SSOT(M29)— 出 3-column 表;否則提案不被接受**。使用者 tell me once 不該要 tell me twice。
-
-完整 M-rules 詳 `.claude/rules/meta-patterns.md`(always loads)。
-
-# 治理 canonical(Claude Code 配置 home 分層 + anti-bloat)
-
-## 規則放哪 home(8-home 分層)
-
-| Level | Home | 收什麼 |
-|-------|------|--------|
-| 1 | `CLAUDE.md`(本檔) | 每 session signal 的 mindset + 6 條 + 任務導航 |
-| 1.5 | `.claude/rules/*.md` | path-scoped rules(只在相關檔案載入,2026 Anthropic 推薦) |
-| 2 | `{name}.spec.md` | 單元件「何時用 / 為什麼」 |
-| 3 | Pattern `spec.md` | runtime 跨元件 primitive |
-| 4 | Code(`.tsx` / `.css`) | cva / 型別等機械強制 |
-| 5 | Skill(`.claude/skills/`) | invoke 情境的多步驟 workflow + checkpoint |
-| 6 | Memory(`~/.claude/.../memory/` SSOT + repo `.claude/memory/` mirror)| 跨 session 狀態。本機編完跑 `npm run sync-memory` 推回 repo(讓 cloud sandbox 看得到) |
-| 7 | Hook(`.claude/hooks/`) | 機械化 pre/post tool 檢查 |
-| 8 | Slash Command(`.claude/commands/`) | 一次性單步 action |
-| 9 | Plan doc(`.claude/planning/`)| 完整 plan / RFC / spec 草稿 SSOT;memory file 是短 index pointer 指向 plan doc(對齊 ds-devmode / story-auto-compile pattern) |
-
-**Q1 設計規則 → Level 1-4 / Q2 invoke 情境 → Skill or Command / Q3 隨時間變化 → Memory(short index)+ Plan doc(完整 spec)/ Q4 機械化 → Hook**。完整 flowchart → `.claude/skills/design-system-audit/references/rule-placement.md`。
-
-## 行數預算(Anthropic 對齊)
-
-CLAUDE.md target ≤ 200(Anthropic best-practice)/ transition ≤ 400 / hard cap 800。SKILL ≤ 250 / spec ≤ 300(foundational SSOT 例外 ≤ 800-1200)/ memory **per-file ≤ 100 lines** + **MEMORY.md index ≤ 20 entries**(soft 18 / hard 20,session-start hook 攔)。Hooks **26 soft / 40 hard**(SSOT = `session_start_governance_check.sh:173`)。動態值見 `scripts/sync-governance-counters.mjs` 跑出為準(2026-05-23:**31 M-rules / 56 audit dims / 37 hooks** — 不寫死避 drift,per 2026-05-22 prune codify)。
-
-## Anti-bloat L1-L3
-
-- **L1 Pre-write**:`check_file_size_budget.sh`(+ governance hooks listed in `.claude/hooks/` — dynamic SSOT,不在 CLAUDE.md hardcode 個別 hook)
-- **L2 Per-commit**:`log_governance_fires.sh` → `.claude/logs/hook-fires.jsonl`
-- **L3 Periodic**(季度 / `--deep`):`/knowledge-prune` skill,retire ≥ 5%
-
-## 加規則前必過 3 題
-
-1. 既有 Meta-Pattern / 近親 spec / canonical chapter 命中 → append pointer 不新寫
-2. **Rule-of-3**:同概念 ≥ 3 處 → 選 SSOT 其他 pointer
-3. 7 天後還會 fire 嗎?不確定 → 不寫
-
-# 稽核 canonical
-
-3 層級 × 6 維度。**Stakeholder-visible artifact**(prototype / 元件 merge / 產品 demo)**必過 code + visual 雙層 audit**(搭配 M6+M10)。
-
-| Tier | 時機 | Scope | Skill |
-|------|------|-------|------|
-| 1 Stakeholder-gate(強制)| 新元件 merge / prototype / demo | artifact-scoped | `/component-quality-gate` / `/prototype` P3.5 / `/product-ui-audit` P5 |
-| 2 Daily dev | bug / refactor / 文字改 | git diff + direct consumer | `visual-audit --scope=changed`(default) |
-| 3 Periodic deep | release / token 大改 / 季度 | full DS | `/design-system-audit --deep` |
-
-| 維度 | 對應 skill |
-|------|-----------|
-| D1 設計語言 | `/design-system-audit` |
-| D2 程式語言 | tsc + lint + `/design-system-audit` |
-| D3 元件效能 | `/performance-audit` |
-| D4 UX 行為 | `/ux-audit` |
-| D5 視覺品質 | `/visual-audit`(Layer A mechanical + B AI) |
-| D6 原則自檢 | `design-system-audit/references/principle-audit-protocol.md` |
-
-**Consistency 類稽核必 Phase 0 全掃再判**(避免單元件看漏系統 drift)。
-
-**Audit-vs-execute 分權**:動 canonical substantive meaning → STOP 提議;對齊 / 表達統一 / 清 duplicate / 補 pointer → AUTO(對齊 knowledge-prune SKILL Phase 2 P0+P1 scope)。
-
-**Scope classifier — Surgical visual bug**(2026-05-12 codex 抓 anti-pattern「surgical bug 升 architecture audit」)。user 列 N 個 visual defects + 無新 canonical / 無新 API contract / 無 cross-component semantic 改動 → **Surgical scope**:**no codex collab / no new M-rule / no audit report,batch fix + final pixel-quantified verify only**。對齊 Anthropic Best Practice 小修 skip plan + M32(c) batch fix + 對立面是「unscoped investigation infinite exploration」反 pattern。Substantive 改動(API / SSOT / cross-component)走 audit-vs-execute STOP 提議流程。
-
-# SSOT 消費 canonical
-
-寫視覺 code 前必查對照 — 沒列 = 自創。**完整對照表 + 強制 checklist** → `.claude/references/ssot-consultation.md`(SSOT owner;含 9 項決策對應 SSOT + 新元件 tsx 開頭「── 消費的 SSOT ──」段強制要求)。Hook `check_ssot_consultation.sh` 2026-05-XX 已 retired → 改靠 mindset #2 + audit dim 1 + check_canonical_propagation hook 接手檢查。
-
-# 任務導航表
-
-| 任務 | 必讀 |
-|------|------|
-| **新增元件** | `.claude/rules/ui-development.md` 「建立 UI 前必讀 / shadcn 元件規範」 + `.claude/rules/spec-rules.md` → `/component-quality-gate` |
-| **修 variant / size / state** | 該元件 `spec.md` → `/story-writing` |
-| **新增 token** | `tokens/README.md` → `.claude/rules/ui-development.md`「Token 命名 4 條硬規則」→ `tokens/xxx.spec.md` |
-| **寫 story / 視覺 code** | `/story-writing` + `# SSOT 消費 canonical` |
-| **命名新檔 / 變數 / prop** | `# 命名與語言一致性` + `.claude/rules/ui-development.md`「元件 Props 命名」 |
-| **新元件 layout** | `# 4-Family Layout Model` |
-| **新 skill / hook / command** | `.claude/{home}/README.md` charter |
-| **無前例設計決策** | `# 遇不確定時的協議` |
-| **Tailwind 出怪事** | `.claude/rules/ui-development.md`「Tailwind 5 條核心」+ `# 失敗記憶索引` |
-| **Stakeholder 產出 / 稽核** | `# 稽核 canonical` |
-| **User 糾正後** | `# 治理 canonical`(home 判斷) |
-| **跟 codex 討論 / 多輪震盪 / 任何 codex 輸出** | `.claude/skills/codex-collab/SKILL.md`(M31 5-step canonical SSOT;含 transport / Step 0.05 user-verbatim relay / queue + interval / hook 機械強制)+ M31 anchor in meta-patterns.md |
-| **PR merge 後 / session start branch 健檢** | `# Git solo-work canonical` |
-
-**找不到** → 進 `# 遇不確定時的協議`,不自決定。
-
-# Git solo-work canonical(SSOT → `.claude/memory/feedback_solo_dev_workflow.md`)
-
-**1 chat = 1 working branch**;**Netlify preview 是 user gate**;**「push」/「OK」trigger 才 merge main**。**Session-start 必先 grep canonical + 開 working branch,禁直接在 main 上 edit production code**(M28 sub-rule,hook `check_main_branch_workbench.sh` mechanical 攔截)。
-
-| 步驟 | 動作 |
-|------|------|
-| 1 Edit | AI 改 code |
-| 2 Commit + push working branch | 自動觸發 Netlify per-branch preview |
-| 3 告訴 user 主要 change(or preview URL)| 讓 user 知道看什麼 |
-| 4 等 user trigger | **「push / OK / 好 / 合 main」** → step 5;**「改 X / 不對 / 等等」** → 繼續 step 1 |
-| 5 Squash merge to main | 不開 PR(可 GitHub API squash-merge OR fast-forward)|
-| 6 砍 remote branch | `git push origin --delete <branch>` ;sandbox HTTP 403 → 提醒 user GitHub UI 手動 |
-| 7 Local 對齊 | `git checkout main && git fetch && git reset --hard origin/main && git branch -d <branch>` |
-
-**禁止**:開 PR / AI 自決 push main / 同 chat 開多 branch / 留 stale 不刪 / 「下個 session 處理」deferred 措辭。完整禁忌 / Trigger phrase / 反 pattern 詳 SSOT memory file。
-
-# 命名與語言一致性
-
-**3 重 test**(governance):
-1. **既有 DS 詞彙**:對齊 `compact/rich / sm/md/lg / action/indicator / scanning/reading`?
-2. **世界級 idiom**:≥ 2 家 world-class DS 用此詞?
-3. **跨元件認知衝突**:同字串在其他元件已有不同語義?
-
-3 test 全過才採納。歷史:FileItem `text/picture` 撞 Button `variant="text"` → 改 `compact/rich`。
-
-詳細 → `.claude/references/naming-conventions.md`。
-
-**語言一致性**:spec.md 繁中(技術術語保留英) / code identifier 英 / 單一檔案不中英夾雜。
-
-# 4-Family Layout Model
-
-**每元件 spec 第一段必聲明 Layout Family**(1/2/3/4 或「self-contained」)。
-
-| Family | 用途 | SSOT |
-|--------|------|------|
-| 1 Menu item / 2 List item | scanning / reading | `patterns/element-anatomy/item-anatomy.spec.md` |
-| 3 Pill | 單行互動 pill | `components/Button/button.spec.md`「Pill Layout」|
-| 4 Field control | 可編輯資料輸入 | `components/Field/field-controls.spec.md` |
-
-# 自主執行 canonical(Autonomy Default,2026-05-14 user SSOT directive)
-
-**Default = autonomous + complete + verify-to-perfection;省工 = anti-pattern(違 mindset #1)**。
-
-| 動作類別 | 預設 |
-|---------|-----|
-| **SSOT-affecting UI/UX**(增刪改 component / token / spec 視覺結構 / 跨元件 design language) | **ASK** — 中文具體人話講選項 + tradeoff,user 拍板才動。**Enforcement scope split**:production code(`src/**/*.{tsx,ts,css}`)由 `check_substantive_edit_approval_preflight.sh` PreToolUse 攔截;`*.spec.md` 視覺結構 / canonical / SSOT 段落 edit 由 `stop_self_audit.sh` 補位 post-action 攔截(避免 spec typo false-positive BLOCKER)|
-| Bug fix / clean / refactor / 命名一致 / test / audit / verify | **AUTO** — 整批做完 + 完整驗證 + 撤回機制(M33 反 defer) |
-| Governance / hook / skill / spec **內部**(typo / pointer / 結構 — 不動 canonical meaning)| **AUTO** — audit-vs-execute 分權 |
-| Perf / a11y / 漸進遷移(不動 SSOT)| **AUTO** — 整批 + verify |
-
-**自主執行同時優化 7 軸**:言簡意賅 / 效率 + 效能(M20 ≥ 80)/ SSOT 鐵律(M17/M23/M29/M30)/ 易懂維護擴充(M9/M21/M23(c))/ 世界級 + 一致設計語言(mindset #1 + M8/M22/M26)/ 完整 self-verify(M20/M31/M32)/ 自動 self-improve(M14/M20)。
-
-**反 pattern**(禁):「省工」/「下次再做」/「下個 session」(M33)/「OK 嗎?」過度 ASK / shortcut 避 verify / 不對齊 mindset #1。
-
-**Trigger phrase auto-pipeline**(M19 升級):「依原則自主」/「不需問」/「馬不停蹄」/「全部做完」/「自動」→ 進 autonomous mode,僅 SSOT-affecting UI/UX 停下 ASK。
-
-**2026-05-23 永久 reinforcement(user verbatim,hook 機械強制)**:
-- **Triple-verify before propose**(M18 Q0 universal gate):propose / 列 option / 發現「問題」(含 codex / deep audit findings)前必 inline 跑 (1) grep DS-wide (2) Read spec.md / tsx (3) 對照 canonical exception。三題全過才 propose;任一 NO → 自動撤回不煩 user。Hook `check_propose_pre_grep_verify.sh`。Anchor:2026-05-18 Sheet/inline-action/SurfaceBody false positive、2026-05-23 Badge `text-[10px]` 誤判為 drift(spec L161-167 documented exception)
-- **SSOT auto-sync invariant**:M-rule count / hook count / dim count / npm scope / version / plugin name 等跨 file 數字禁 hardcode 多處;SSOT in `session_start_governance_check.sh:173` / `meta-patterns.md` / `design-system-audit/SKILL.md` / `package.json` / `.claude-plugin/plugin.json`;其他 file reference 或 `scripts/sync-governance-counters.mjs` 機械對齊,drift 偵測 auto fix
-
-# 遇不確定時的協議
-
-**無前例且影響 SSOT UI/UX 設計判斷**時 3 步,禁跳:**grep 既有**(30 秒)→ **讀近親 spec.md** → **仍不確定停下問** user。
-**非 SSOT-UI/UX**(refactor / test / perf / a11y / hook / skill / typo / 對齊既有 canonical)→ autonomous,無需問。
-禁:跳 grep 憑記憶 / 隨便挑 / 留 TODO。
-可跳:bug 修 / 機械勞動 / user 明確指示。
-
-# 失敗記憶索引(技術沉默陷阱 only)
-
-設計判斷類已被 M-rules 吸收(見 `.claude/rules/meta-patterns.md`);具體歷史詳 `.claude/skills/design-system-audit/references/historical-bugs.md`。
-
-| 技術陷阱 | 一行 anchor |
-|--------|-----------|
-| Tailwind v4 `[--foo]` 必 `var()` | silent 失效 |
-| tailwind-merge 自訂 utility 必註冊 group | 否則 strip |
-| 元件自包 Provider | 劫持全站 |
-| 清 unused imports 後 runtime | tsc 不充分,需 storybook |
-| shadcn compat alias 回流 | dark mode 不聯動 |
-| `asChild ? Slot : Native` 內部 JSX 仍渲染多 children | React.Children.only runtime fail — Slot 規範 children 必為單 element,內部 `{icon}{label}{badge}` 多 expression 變 array → throw。asChild 分支 render 只傳 consumer child;tsc/build 過,story 打開才炸 |
-
-新 bug → 歸 Meta-Pattern OR 本表 1 行;> 10 條 = 漏寫,**評估 meta-merge 既有 M-rule 而非無腦新增**(meta-patterns velocity ≤ 3/quarter,單 M-rule 必吸收 ≥ 3 prior bugs)。
-
-# 專案 Stack
-
-Vite + React + TypeScript + Tailwind v4 + shadcn/ui + Storybook + 自訂 Design Token。
-必要檔案:`index.html` / `src/main.tsx` / `src/globals.css` / `vite.config.ts` / `package.json` / `tsconfig.json`。
-完整路徑 + Token 系統 → `packages/design-system/src/tokens/README.md`(charter)— Phase 1 後 DS 內化在 npm workspace。
-
-# Path-scoped rules(2026 Anthropic 推薦)
-
-僅在相關檔案打開時載入,降低本檔 token 成本:
-
-- `.claude/rules/meta-patterns.md` — 31 active M-rules(M1-M32,M27/M33/M34/M35 retired,always loads,fundamental)
-- `.claude/rules/spec-rules.md` — paths: `**/*.spec.md` + `src/design-system/**` + `packages/design-system/**`(post Phase 1 migration)
-- `.claude/rules/ui-development.md` — paths: `**/*.tsx` + `**/*.ts`(含 Tailwind / Token / Props 命名 / shadcn)
-- `.claude/rules/story-rules.md` — paths: `**/*.stories.tsx`(三層定位 + Title + 範例最高準則)
-
-# 元件完成 checklist
-
-merge 前 invoke `/component-quality-gate`(45 項 + visual + clean-code 三層)。
-
-# Exploration & Prototype
-
-正式 `packages/design-system/src/`(Phase 1 後 npm workspace 內化)vs 比稿 `src/explorations/`(hook `block_prototype_imports.py` 強制隔離)。比稿 `*.v1.stories.tsx` + `notes.md`,定案升級 patterns/ 或 components/。Skills:`/prototype` / `/component-quality-gate` / `/delivery-handoff`。
+The import above loads only the concise package augmentation. In the author monorepo, repository-wide Claude instructions are already inherited from the root `CLAUDE.md`; in an installed package, consumer governance still comes from the authenticated `ds-canonical/fork` snapshot rather than this file.

package/README.md

@@ -76,7 +76,7 @@ import { Button, Avatar, Dialog } from '@qijenchen/design-system'
 <Dialog>...</Dialog>
 ```
 
-**只用 top barrel import**(對齊 Material UI canonical)。`./components/<Name>` subpath 目前未支援 — v1.0.0 stable 才會開啟(待 cross-component export name collision rename 完成)。
+**預設用 top barrel import**(對齊 Material UI canonical)。需要更窄的 import surface 時,也支援 `@qijenchen/design-system/components/<Name>` / `patterns/<Name>` / `hooks/<name>` subpath(見 package `exports`)。
 
 Tree-shake 透過 `sideEffects: ["**/*.css"]` 配置自動 work,unused JS 被 bundler 剝除。
 
@@ -106,7 +106,7 @@ Token `--font-sans` stack = `Roboto, -apple-system, BlinkMacSystemFont, "Segoe U
 
 ## Storybook(consumer 看 DS 元件用法)
 
-- Production:**https://ajenchen.github.io/design-system/**
+- Production:**https://ajenchen-design-system.netlify.app/**(GH Pages mirror: <https://ajenchen.github.io/design-system/>)
 - 看每個元件的「展示」/「設計規格」/「設計原則」3 層 stories
 
 ---
@@ -115,10 +115,11 @@ Token `--font-sans` stack = `Roboto, -apple-system, BlinkMacSystemFont, "Segoe U
 
 | 路徑 | 內容 |
 |---|---|
-| `@qijenchen/design-system` | Top barrel — components / patterns / hooks / lib utilities |
+| `@qijenchen/design-system` | Top barrel — components / patterns / hooks / lib utilities / token JS mirrors。**策展後 front-door**(2026-07-14 API 策展):named re-exports,`*Meta`(componentMeta 建置/稽核 metadata)與 internal 單元不在此 |
+| `@qijenchen/design-system/components/<Dir>`、`…/patterns/<dir>` | Per-component subpath — 完整 `export *`(含 `*Meta`;internal 單元「包裝後 + 自行確認」的唯一管道)|
 | `@qijenchen/design-system/styles/tokens` | CSS aggregator(全 token + Tailwind `@theme inline`)|
 | `@qijenchen/design-system/hooks/<name>` | 單一 hook subpath |
-| `@qijenchen/design-system/tokens/<category>` | Token JS 模組(eg `motion`, `icon-size`)— CSS 透過 `styles/tokens` aggregator |
+| `@qijenchen/design-system/tokens/<path>` | Token JS 模組(編譯品;eg `tokens/motion/motion`、`tokens/uiSize/icon-size`)— 原始 `.ts` / `.spec.md` 不經此路徑曝露;CSS 透過 `styles/tokens` aggregator |
 
 **禁** import:
 - `@qijenchen/design-system/src/...`(internal source path,未來 SSOT 結構改會壞)
@@ -134,6 +135,7 @@ Token `--font-sans` stack = `Roboto, -apple-system, BlinkMacSystemFont, "Segoe U
 | `react-dom` | `>= 18.0.0` | peer |
 | `tailwindcss` | `>= 4.0.0` | peer,Tailwind v4 only |
 | `lucide-react` | `>= 0.400.0` | peer(consumer 已裝,DS 不重複,避免 hoisting 雙裝)|
+| Document direction | **LTR only** | RTL 不在目前支援矩陣；元件可能使用 physical left/right、LTR scrollLeft 與未鏡像 directional icons。consumer 不得把 `dir="rtl"` 視為已支援。若未來要支援，必須以 DS-wide proposal 同步 tokens、layout、icons、keyboard/scroll behavior 與 visual/a11y matrix，不能逐元件局部宣稱。|
 
 ---
 

package/cli-init.mjs

@@ -14,13 +14,17 @@
 //
 // Idempotent: re-run safe(skip if symlink exists pointing same place).
 
-import { existsSync, mkdirSync, symlinkSync, readlinkSync, lstatSync, unlinkSync } from 'node:fs'
+import { existsSync, mkdirSync, symlinkSync, readlinkSync, lstatSync, unlinkSync, writeFileSync } from 'node:fs'
 import { join, relative, dirname } from 'node:path'
 import { fileURLToPath } from 'node:url'
 
 const CWD = process.cwd()
 const __dirname = dirname(fileURLToPath(import.meta.url))
-const PACKAGE_ROOT = join(__dirname, '..')  // = node_modules/@qijenchen/design-system/
+// 本檔 ship 在 package root(package.json bin: "./cli-init.mjs")→ __dirname 即
+// node_modules/@qijenchen/design-system/。2026-07-16 修(PNG §4 疑點證實為 bug):原
+// `join(__dirname, '..')` 指到 node_modules/@qijenchen/ → 所有 source「not found」→
+// init 全程靜默 skip(symlink 一個都沒建,假成功)。
+const PACKAGE_ROOT = __dirname
 
 function ensureSymlink(from, to, label) {
   const fromAbs = join(CWD, from)
@@ -73,6 +77,30 @@ if (existsSync(dsCLAUDEsrc)) {
   }
 }
 
+// 3. AGENTS.md 投影到 consumer root(PNG P2.4:Codex 等 AGENTS.md 標準 agent 原生 discovery)
+//    Consumer-owned:存在則 skip + 提示 merge,絕不覆蓋。內容 = pointer stub(指 npm 內
+//    DS AGENTS.md 本體 → npm update 自動最新,stub 零 drift;對齊 ADR-1 禁 symlink 作唯一機制)。
+const consumerAgents = join(CWD, 'AGENTS.md')
+if (existsSync(join(PACKAGE_ROOT, 'AGENTS.md'))) {
+  if (!existsSync(consumerAgents)) {
+    writeFileSync(consumerAgents, `# AI agent instructions(this repo consumes @qijenchen/design-system)
+
+<!-- generated once by qijenchen-ds-init;consumer-owned — 建立後歸你維護,可自由增寫。 -->
+
+本 repo 消費 \`@qijenchen/design-system\`。**寫 UI / 設計決策前先讀 DS 治理核心**(隨 npm update 自動最新):
+
+- \`node_modules/@qijenchen/design-system/AGENTS.md\` — DS 治理核心(mindset / SSOT 消費 / 命名 / 4-Family)
+- \`node_modules/@qijenchen/design-system/ds-canonical/\` — rules / references / skills 全文
+- \`node_modules/@qijenchen/design-system/src/components/<Name>/<name>.spec.md\` + \`.stories.tsx\` — 元件何時用 / 官方 composition
+
+(在下方加入你產品自己的 instructions。)
+`)
+    console.log('✓ created AGENTS.md(pointer stub → DS 治理核心;consumer-owned,可自由增寫)')
+  } else {
+    console.log('✓ AGENTS.md already exists(skip;如要吃 DS 治理,手動 merge 一行指路 node_modules/@qijenchen/design-system/AGENTS.md)')
+  }
+}
+
 console.log('')
 console.log('═══ Next steps ═══')
 console.log('1. Add to your entry CSS(globals.css):')

package/dist/components/Accordion/accordion.d.ts

@@ -19,14 +19,14 @@ import * as AccordionPrimitive from '@radix-ui/react-accordion';
  */
 declare const Accordion: React.ForwardRefExoticComponent<(AccordionPrimitive.AccordionSingleProps | AccordionPrimitive.AccordionMultipleProps) & React.RefAttributes<HTMLDivElement>>;
 declare const AccordionItem: React.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-declare const AccordionTrigger: React.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
-declare const AccordionContent: React.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const AccordionTrigger: React.ForwardRefExoticComponent<Omit<Omit<AccordionPrimitive.AccordionTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref">, "asChild"> & React.RefAttributes<HTMLButtonElement>>;
+declare const AccordionContent: React.ForwardRefExoticComponent<Omit<Omit<AccordionPrimitive.AccordionContentProps & React.RefAttributes<HTMLDivElement>, "ref">, "asChild"> & React.RefAttributes<HTMLDivElement>>;
 export declare const accordionMeta: {
     readonly component: "Accordion";
     readonly family: null;
     readonly variants: {};
     readonly sizes: {};
-    readonly states: readonly ["default", "hover", "active", "focus-visible", "disabled"];
+    readonly states: readonly ["default", "hover", "focus-visible", "disabled"];
     readonly tokens: {
         readonly bg: readonly [];
         readonly fg: readonly ["text-fg-disabled", "text-fg-muted", "text-fg-secondary", "text-foreground"];

package/dist/components/Accordion/accordion.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"accordion.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,kBAAkB,MAAM,2BAA2B,CAAA;AAI/D;;;;;;;;;;;;;;;;GAgBG;AAEH,QAAA,MAAM,SAAS,8JAA0B,CAAA;AAEzC,QAAA,MAAM,aAAa,iKASjB,CAAA;AAGF,QAAA,MAAM,gBAAgB,0KA2BpB,CAAA;AAGF,QAAA,MAAM,gBAAgB,oKAcpB,CAAA;AAKF,eAAO,MAAM,aAAa;;;;;;;;;;;CAehB,CAAA;AAEV,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,CAAA"}
+{"version":3,"file":"accordion.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,kBAAkB,MAAM,2BAA2B,CAAA;AAI/D;;;;;;;;;;;;;;;;GAgBG;AAEH,QAAA,MAAM,SAAS,8JAA0B,CAAA;AAEzC,QAAA,MAAM,aAAa,iKASjB,CAAA;AAGF,QAAA,MAAM,gBAAgB,2LAiCpB,CAAA;AAGF,QAAA,MAAM,gBAAgB,qLAgBpB,CAAA;AAKF,eAAO,MAAM,aAAa;;;;;;;;;;;CAehB,CAAA;AAEV,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,CAAA"}

package/dist/components/Accordion/accordion.js

@@ -24,6 +24,9 @@ const AccordionTrigger = React.forwardRef(({ className, children, ...props }, re
       "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
       // AccordionTrigger 單一 text-style 列 → semantic `text-fg-disabled`(非 opacity);Button canonical 對齊
       "disabled:text-fg-disabled disabled:pointer-events-none",
+      // 2026-05-31 M24:disabled 時 chevron(icon 載體)亦降 text-fg-disabled,不停留 text-fg-muted
+      //（muted=neutral-7 比 disabled=neutral-6 深 → 層級顛倒)。覆寫 chevron 自身 text-fg-muted。
+      "disabled:[&>svg]:text-fg-disabled",
       "[&[data-state=open]>svg]:rotate-180",
       className
     ),
@@ -34,7 +37,7 @@ const AccordionTrigger = React.forwardRef(({ className, children, ...props }, re
         ChevronDown,
         {
           size: 16,
-          className: "shrink-0 text-fg-muted transition-transform duration-200",
+          className: "shrink-0 text-fg-muted transition-transform duration-200 motion-reduce:duration-0",
           "aria-hidden": true
         }
       )
@@ -48,7 +51,7 @@ const AccordionContent = React.forwardRef(({ className, children, ...props }, re
     ref,
     className: cn(
       "overflow-hidden text-body text-fg-secondary",
-      "data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down"
+      "data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down motion-reduce:animate-none"
     ),
     ...props,
     children: /* @__PURE__ */ jsx("div", { className: cn("pb-4", className), children })
@@ -61,7 +64,7 @@ const accordionMeta = {
   // non-family composite / overlay / layout
   variants: {},
   sizes: {},
-  states: ["default", "hover", "active", "focus-visible", "disabled"],
+  states: ["default", "hover", "focus-visible", "disabled"],
   tokens: {
     bg: [],
     fg: ["text-fg-disabled", "text-fg-muted", "text-fg-secondary", "text-foreground"],

package/dist/components/Accordion/accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"accordion.js","sources":["../../../src/components/Accordion/accordion.tsx"],"sourcesContent":["import * as React from 'react'\nimport * as AccordionPrimitive from '@radix-ui/react-accordion'\nimport { ChevronDown } from 'lucide-react'\nimport { cn } from '@/lib/utils'\n\n/**\n * Accordion — Radix Accordion + 本 DS token\n *\n * 結構對齊 shadcn/ui accordion(Accordion / AccordionItem / AccordionTrigger /\n * AccordionContent),但視覺全改本 DS token。\n *\n * ── 視覺差異 vs shadcn 預設 ──\n * Shadcn 預設 hover 加底線(web 早期 link style),本 DS 改為文字色 tint\n * (`hover:text-fg-secondary`)——維持現代 SaaS 質感(Notion / Linear / Stripe 皆不用\n * 底線),但保留 hover 顏色變化作為可點擊提示(user 決策 2026-04-20)。\n * Chevron 用 Lucide + 本 DS icon size(16px),rotate 動畫 200ms。\n *\n * ── 使用情境 ──\n * FAQ / settings section 收合 / 多區塊表單分組 / 進階選項可隱藏。\n * 不用於「單純顯示 / 隱藏單一區塊」(那是 Collapsible,本 DS 尚未建立;用 details 或\n * 自組 toggle),Accordion 是「多個 item 可互斥或獨立收合」的 pattern。\n */\n\nconst Accordion = AccordionPrimitive.Root\n\nconst AccordionItem = React.forwardRef<\n  React.ElementRef<typeof AccordionPrimitive.Item>,\n  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item>\n>(({ className, ...props }, ref) => (\n  <AccordionPrimitive.Item\n    ref={ref}\n    className={cn('border-b border-divider', className)}\n    {...props}\n  />\n))\nAccordionItem.displayName = 'AccordionItem'\n\nconst AccordionTrigger = React.forwardRef<\n  React.ElementRef<typeof AccordionPrimitive.Trigger>,\n  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Trigger>\n>(({ className, children, ...props }, ref) => (\n  <AccordionPrimitive.Header className=\"flex\">\n    <AccordionPrimitive.Trigger\n      ref={ref}\n      className={cn(\n        'flex flex-1 items-center justify-between gap-2',\n        'py-4 text-body font-medium text-foreground text-left',\n        'transition-colors hover:text-fg-secondary',\n        'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',\n        // AccordionTrigger 單一 text-style 列 → semantic `text-fg-disabled`(非 opacity);Button canonical 對齊\n        'disabled:text-fg-disabled disabled:pointer-events-none',\n        \"[&[data-state=open]>svg]:rotate-180\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      <ChevronDown\n        size={16}\n        className=\"shrink-0 text-fg-muted transition-transform duration-200\"\n        aria-hidden\n      />\n    </AccordionPrimitive.Trigger>\n  </AccordionPrimitive.Header>\n))\nAccordionTrigger.displayName = 'AccordionTrigger'\n\nconst AccordionContent = React.forwardRef<\n  React.ElementRef<typeof AccordionPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content>\n>(({ className, children, ...props }, ref) => (\n  <AccordionPrimitive.Content\n    ref={ref}\n    className={cn(\n      'overflow-hidden text-body text-fg-secondary',\n      'data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down',\n    )}\n    {...props}\n  >\n    <div className={cn('pb-4', className)}>{children}</div>\n  </AccordionPrimitive.Content>\n))\nAccordionContent.displayName = 'AccordionContent'\n\n// Story auto-compile metadata — Phase 1 mechanical migration(2026-04-24)\n// Phase 2 fill needed: purpose descriptions + when rationale + world-class refs\nexport const accordionMeta = {\n  component: 'Accordion',\n  family: null, // non-family composite / overlay / layout\n  variants: {\n\n  },\n  sizes: {\n\n  },\n  states: ['default', 'hover', 'active', 'focus-visible', 'disabled'],\n  tokens: {\n    bg: [],\n    fg: ['text-fg-disabled', 'text-fg-muted', 'text-fg-secondary', 'text-foreground'],\n    ring: ['ring-ring'],\n  },\n} as const\n\nexport { Accordion, AccordionItem, AccordionTrigger, AccordionContent }\n"],"names":[],"mappings":";;;;;AAuBA,MAAM,YAAY,mBAAmB;AAErC,MAAM,gBAAgB,MAAM,WAG1B,CAAC,EAAE,WAAW,GAAG,MAAA,GAAS,QAC1B;AAAA,EAAC,mBAAmB;AAAA,EAAnB;AAAA,IACC;AAAA,IACA,WAAW,GAAG,2BAA2B,SAAS;AAAA,IACjD,GAAG;AAAA,EAAA;AACN,CACD;AACD,cAAc,cAAc;AAE5B,MAAM,mBAAmB,MAAM,WAG7B,CAAC,EAAE,WAAW,UAAU,GAAG,MAAA,GAAS,QACpC,oBAAC,mBAAmB,QAAnB,EAA0B,WAAU,QACnC,UAAA;AAAA,EAAC,mBAAmB;AAAA,EAAnB;AAAA,IACC;AAAA,IACA,WAAW;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,MAEA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,IAED,GAAG;AAAA,IAEH,UAAA;AAAA,MAAA;AAAA,MACD;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAM;AAAA,UACN,WAAU;AAAA,UACV,eAAW;AAAA,QAAA;AAAA,MAAA;AAAA,IACb;AAAA,EAAA;AACF,GACF,CACD;AACD,iBAAiB,cAAc;AAE/B,MAAM,mBAAmB,MAAM,WAG7B,CAAC,EAAE,WAAW,UAAU,GAAG,SAAS,QACpC;AAAA,EAAC,mBAAmB;AAAA,EAAnB;AAAA,IACC;AAAA,IACA,WAAW;AAAA,MACT;AAAA,MACA;AAAA,IAAA;AAAA,IAED,GAAG;AAAA,IAEJ,8BAAC,OAAA,EAAI,WAAW,GAAG,QAAQ,SAAS,GAAI,SAAA,CAAS;AAAA,EAAA;AACnD,CACD;AACD,iBAAiB,cAAc;AAIxB,MAAM,gBAAgB;AAAA,EAC3B,WAAW;AAAA,EACX,QAAQ;AAAA;AAAA,EACR,UAAU,CAAA;AAAA,EAGV,OAAO,CAAA;AAAA,EAGP,QAAQ,CAAC,WAAW,SAAS,UAAU,iBAAiB,UAAU;AAAA,EAClE,QAAQ;AAAA,IACN,IAAI,CAAA;AAAA,IACJ,IAAI,CAAC,oBAAoB,iBAAiB,qBAAqB,iBAAiB;AAAA,IAChF,MAAM,CAAC,WAAW;AAAA,EAAA;AAEtB;"}
+{"version":3,"file":"accordion.js","sources":["../../../src/components/Accordion/accordion.tsx"],"sourcesContent":["import * as React from 'react'\nimport * as AccordionPrimitive from '@radix-ui/react-accordion'\nimport { ChevronDown } from 'lucide-react'\nimport { cn } from '@/lib/utils'\n\n/**\n * Accordion — Radix Accordion + 本 DS token\n *\n * 結構對齊 shadcn/ui accordion(Accordion / AccordionItem / AccordionTrigger /\n * AccordionContent),但視覺全改本 DS token。\n *\n * ── 視覺差異 vs shadcn 預設 ──\n * Shadcn 預設 hover 加底線(web 早期 link style),本 DS 改為文字色 tint\n * (`hover:text-fg-secondary`)——維持現代 SaaS 質感(Notion / Linear / Stripe 皆不用\n * 底線),但保留 hover 顏色變化作為可點擊提示(user 決策 2026-04-20)。\n * Chevron 用 Lucide + 本 DS icon size(16px),rotate 動畫 200ms。\n *\n * ── 使用情境 ──\n * FAQ / settings section 收合 / 多區塊表單分組 / 進階選項可隱藏。\n * 不用於「單純顯示 / 隱藏單一區塊」(那是 Collapsible,本 DS 尚未建立;用 details 或\n * 自組 toggle),Accordion 是「多個 item 可互斥或獨立收合」的 pattern。\n */\n\nconst Accordion = AccordionPrimitive.Root\n\nconst AccordionItem = React.forwardRef<\n  React.ElementRef<typeof AccordionPrimitive.Item>,\n  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item>\n>(({ className, ...props }, ref) => (\n  <AccordionPrimitive.Item\n    ref={ref}\n    className={cn('border-b border-divider', className)}\n    {...props}\n  />\n))\nAccordionItem.displayName = 'AccordionItem'\n\nconst AccordionTrigger = React.forwardRef<\n  React.ElementRef<typeof AccordionPrimitive.Trigger>,\n  // asChild 不對外開放:Trigger 固定渲染 children + ChevronDown 兩個子節點,傳 asChild\n  // 會讓 Radix Slot 觸發 React.Children.only runtime 錯(見 CLAUDE.md 失敗記憶索引\n  // 「asChild 分支內部仍渲染多 children」)。固定 anatomy 見 accordion.spec.md「邊界狀態」。\n  Omit<React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Trigger>, 'asChild'>\n>(({ className, children, ...props }, ref) => (\n  <AccordionPrimitive.Header className=\"flex\">\n    <AccordionPrimitive.Trigger\n      ref={ref}\n      className={cn(\n        'flex flex-1 items-center justify-between gap-2',\n        'py-4 text-body font-medium text-foreground text-left',\n        'transition-colors hover:text-fg-secondary',\n        'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',\n        // AccordionTrigger 單一 text-style 列 → semantic `text-fg-disabled`(非 opacity);Button canonical 對齊\n        'disabled:text-fg-disabled disabled:pointer-events-none',\n        // 2026-05-31 M24:disabled 時 chevron(icon 載體)亦降 text-fg-disabled,不停留 text-fg-muted\n        //（muted=neutral-7 比 disabled=neutral-6 深 → 層級顛倒)。覆寫 chevron 自身 text-fg-muted。\n        'disabled:[&>svg]:text-fg-disabled',\n        \"[&[data-state=open]>svg]:rotate-180\",\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      <ChevronDown\n        size={16}\n        className=\"shrink-0 text-fg-muted transition-transform duration-200 motion-reduce:duration-0\"\n        aria-hidden\n      />\n    </AccordionPrimitive.Trigger>\n  </AccordionPrimitive.Header>\n))\nAccordionTrigger.displayName = 'AccordionTrigger'\n\nconst AccordionContent = React.forwardRef<\n  React.ElementRef<typeof AccordionPrimitive.Content>,\n  // asChild 不對外開放:Content 固定以內層 <div className=\"pb-4\"> 包住 children,傳 asChild\n  // 只會讓 Slot clone 該內層 div,consumer 元素無法成為 Content host(等同無效 API)。\n  Omit<React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content>, 'asChild'>\n>(({ className, children, ...props }, ref) => (\n  <AccordionPrimitive.Content\n    ref={ref}\n    className={cn(\n      'overflow-hidden text-body text-fg-secondary',\n      'data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down motion-reduce:animate-none',\n    )}\n    {...props}\n  >\n    <div className={cn('pb-4', className)}>{children}</div>\n  </AccordionPrimitive.Content>\n))\nAccordionContent.displayName = 'AccordionContent'\n\n// Story auto-compile metadata — Phase 1 mechanical migration(2026-04-24)\n// Phase 2 fill needed: purpose descriptions + when rationale + world-class refs\nexport const accordionMeta = {\n  component: 'Accordion',\n  family: null, // non-family composite / overlay / layout\n  variants: {\n\n  },\n  sizes: {\n\n  },\n  states: ['default', 'hover', 'focus-visible', 'disabled'],\n  tokens: {\n    bg: [],\n    fg: ['text-fg-disabled', 'text-fg-muted', 'text-fg-secondary', 'text-foreground'],\n    ring: ['ring-ring'],\n  },\n} as const\n\nexport { Accordion, AccordionItem, AccordionTrigger, AccordionContent }\n"],"names":[],"mappings":";;;;;AAuBA,MAAM,YAAY,mBAAmB;AAErC,MAAM,gBAAgB,MAAM,WAG1B,CAAC,EAAE,WAAW,GAAG,MAAA,GAAS,QAC1B;AAAA,EAAC,mBAAmB;AAAA,EAAnB;AAAA,IACC;AAAA,IACA,WAAW,GAAG,2BAA2B,SAAS;AAAA,IACjD,GAAG;AAAA,EAAA;AACN,CACD;AACD,cAAc,cAAc;AAE5B,MAAM,mBAAmB,MAAM,WAM7B,CAAC,EAAE,WAAW,UAAU,GAAG,MAAA,GAAS,QACpC,oBAAC,mBAAmB,QAAnB,EAA0B,WAAU,QACnC,UAAA;AAAA,EAAC,mBAAmB;AAAA,EAAnB;AAAA,IACC;AAAA,IACA,WAAW;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,MAEA;AAAA;AAAA;AAAA,MAGA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,IAED,GAAG;AAAA,IAEH,UAAA;AAAA,MAAA;AAAA,MACD;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAM;AAAA,UACN,WAAU;AAAA,UACV,eAAW;AAAA,QAAA;AAAA,MAAA;AAAA,IACb;AAAA,EAAA;AACF,GACF,CACD;AACD,iBAAiB,cAAc;AAE/B,MAAM,mBAAmB,MAAM,WAK7B,CAAC,EAAE,WAAW,UAAU,GAAG,SAAS,QACpC;AAAA,EAAC,mBAAmB;AAAA,EAAnB;AAAA,IACC;AAAA,IACA,WAAW;AAAA,MACT;AAAA,MACA;AAAA,IAAA;AAAA,IAED,GAAG;AAAA,IAEJ,8BAAC,OAAA,EAAI,WAAW,GAAG,QAAQ,SAAS,GAAI,SAAA,CAAS;AAAA,EAAA;AACnD,CACD;AACD,iBAAiB,cAAc;AAIxB,MAAM,gBAAgB;AAAA,EAC3B,WAAW;AAAA,EACX,QAAQ;AAAA;AAAA,EACR,UAAU,CAAA;AAAA,EAGV,OAAO,CAAA;AAAA,EAGP,QAAQ,CAAC,WAAW,SAAS,iBAAiB,UAAU;AAAA,EACxD,QAAQ;AAAA,IACN,IAAI,CAAA;AAAA,IACJ,IAAI,CAAC,oBAAoB,iBAAiB,qBAAqB,iBAAiB;AAAA,IAChF,MAAM,CAAC,WAAW;AAAA,EAAA;AAEtB;"}

package/dist/components/Accordion/index.d.ts

@@ -0,0 +1,2 @@
+export * from './accordion';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Accordion/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/index.ts"],"names":[],"mappings":"AAIA,cAAc,aAAa,CAAA"}

package/dist/components/Accordion/index.js

@@ -0,0 +1,9 @@
+import { Accordion, AccordionContent, AccordionItem, AccordionTrigger, accordionMeta } from "./accordion.js";
+export {
+  Accordion,
+  AccordionContent,
+  AccordionItem,
+  AccordionTrigger,
+  accordionMeta
+};
+//# sourceMappingURL=index.js.map

package/dist/components/Accordion/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/AccountMenu/account-menu.d.ts

@@ -0,0 +1,93 @@
+/**
+ * AccountMenu — 全域 chrome「自己的帳號入口」(24px avatar 觸發 + 帳號選單)
+ *
+ * ── 定位 ──
+ * Primary-header 派 globalHeader 右側(desktop)/ mobile Sheet SidebarHeader 右側的
+ * 帳號入口成品元件:點 avatar 開「個人資料 / 設定 / 登出」navigation 選單。
+ * 是「自己」的入口,不是看「別人」的 ProfileCard(後者預設動作 Chat/通話,語義是聯絡某人)。
+ * **Placement-agnostic**:哪個 mode 放哪裡是 consumer 職責,放置 canonical owner =
+ * `../AppShell/app-shell.spec.md`「帳號入口(Account entry)放置 SSOT」(本元件不收 mode prop,
+ * 不複製該 SSOT;consumer 讀 `useAppShell().layout` + `useSidebar().isMobile` 決定放置)。
+ *
+ * ── 實作基礎 ──
+ * 消費:Avatar(raw size=24 trigger)+ DropdownMenu(Trigger asChild / Content / Group / Label / Item)
+ * 對應 pattern:patterns/header-canonical(4.5 chrome header avatar SSOT)
+ *
+ * ── 消費的 SSOT ──
+ * - components: [Avatar, DropdownMenu(DropdownMenuTrigger/Content/Group/Label/Item)]
+ * - patterns: [header-canonical 4.5(chrome header avatar = raw `<Avatar size={24}>`,非 ItemAvatar)]
+ * - tokens: [--chrome-header-avatar-size(JS 端 24 literal sync), --ring(focus-visible ring canonical)]
+ * - spec refs: app-shell.spec.md「帳號入口(Account entry)放置 SSOT」/ header-canonical.spec.md 4.5
+ *   / dropdown-menu.spec.md / profile-card.spec.md(近親分界:看別人 vs 自己)
+ *
+ * 升級歷程:2026-06-17 `AppShell/_demo-helpers.tsx` demo helper 誕生(user directive)→
+ * 2026-07-30 F9 升 public:app-shell.spec.md + sidebar.spec.md 兩處 canonical 都 mandate
+ * 消費本元件,「文件教得到、import 拿不到」= DT-EXPORT 斷鏈同款缺口(gen-component-indexes.mjs
+ * 檔頭 anchor),npm consumer 被迫整包重造。世界級對照:Atlassian `@atlaskit/atlassian-navigation`
+ * 出貨專門 `Profile` 元件作 top bar 帳號 trigger(ProfileProps = IconButtonProps,選單內容
+ * composition;https://unpkg.com/@atlaskit/atlassian-navigation/dist/types/index.d.ts +
+ * dist/types/components/Profile/types.d.ts);shadcn / Primer 走 DropdownMenu / ActionMenu
+ * composition recipe(https://ui.shadcn.com/docs/components/dropdown-menu「An account switcher
+ * dropdown triggered by an avatar」/ https://primer.style/components/action-menu)。本元件 =
+ * Atlassian 專門元件 + shadcn canonical 內容組(Label(user)+ Groups)的收斂。
+ */
+import * as React from 'react';
+import { type AvatarData } from '../../components/Avatar/avatar';
+export interface AccountMenuUser {
+    /** 顯示名(選單 Label 區;alt 未傳時同時作 avatar alt fallback) */
+    name: string;
+    /**
+     * Avatar 資料(消費既有 `AvatarData` type)。`hoverCard` 刻意排除:帳號入口是「自己」,
+     * 不掛 ProfileCard(per app-shell.spec.md 帳號入口 SSOT「不用 ProfileCard」);
+     * `alt` 可省,fallback `name`。
+     */
+    avatar?: Omit<AvatarData, 'hoverCard' | 'alt'> & {
+        alt?: string;
+    };
+}
+export interface AccountMenuProps {
+    /** 當前登入使用者 */
+    user: AccountMenuUser;
+    /** 「個人資料」item handler(default 選單消費;命名對齊 `PersonData.onViewProfile` 既有 canonical) */
+    onViewProfile?: () => void;
+    /** 「設定」item handler(default 選單消費) */
+    onOpenSettings?: () => void;
+    /** 「登出」item handler(default 選單消費) */
+    onSignOut?: () => void;
+    /**
+     * 取代 default 選單內容(自組 `DropdownMenuGroup` / `DropdownMenuItem`;i18n / 產品自訂項走這)。
+     * Identity Label(user.name)恆由本元件渲染於選單頂(對齊 shadcn account 例 Label(user)慣例);
+     * 傳入 children 時三個 default callback 不再消費。
+     */
+    children?: React.ReactNode;
+    /** 選單對齊(轉傳 DropdownMenuContent `align`)。預設 `'end'`:右上入口靠右展開(demo baseline) */
+    align?: 'start' | 'center' | 'end';
+    /** Trigger aria-label(i18n override,對齊 Avatar `badgeAriaLabel` pattern)。預設「帳號與設定」 */
+    triggerAriaLabel?: string;
+    /** 受控展開狀態(Radix passthrough) */
+    open?: boolean;
+    /** 預設展開(uncontrolled,Radix passthrough)。Storybook OpenSnapshot(M15 visual-audit coverable)用 */
+    defaultOpen?: boolean;
+    /** 展開狀態變更 callback(Radix passthrough) */
+    onOpenChange?: (open: boolean) => void;
+    /**
+     * Trigger button 的非視覺 DOM attributes / event handlers。
+     * `children`、`type`、`aria-label`、`className`、`disabled` 由 AccountMenu canonical contract
+     * 擁有；分析與測試所需的 `data-*`、`aria-*`、事件可由此傳入。
+     */
+    triggerProps?: Omit<React.ComponentPropsWithoutRef<'button'>, 'children' | 'type' | 'aria-label' | 'className' | 'disabled'>;
+}
+export declare const AccountMenu: React.ForwardRefExoticComponent<AccountMenuProps & React.RefAttributes<HTMLButtonElement>>;
+export declare const accountMenuMeta: {
+    readonly component: "AccountMenu";
+    readonly family: null;
+    readonly variants: {};
+    readonly sizes: {};
+    readonly states: readonly ["default", "focus-visible"];
+    readonly tokens: {
+        readonly bg: readonly [];
+        readonly fg: readonly [];
+        readonly ring: readonly ["--ring"];
+    };
+};
+//# sourceMappingURL=account-menu.d.ts.map

package/dist/components/AccountMenu/account-menu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"account-menu.d.ts","sourceRoot":"","sources":["../../../src/components/AccountMenu/account-menu.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAU,KAAK,UAAU,EAAE,MAAM,0CAA0C,CAAA;AAYlF,MAAM,WAAW,eAAe;IAC9B,qDAAqD;IACrD,IAAI,EAAE,MAAM,CAAA;IACZ;;;;OAIG;IACH,MAAM,CAAC,EAAE,IAAI,CAAC,UAAU,EAAE,WAAW,GAAG,KAAK,CAAC,GAAG;QAAE,GAAG,CAAC,EAAE,MAAM,CAAA;KAAE,CAAA;CAClE;AAED,MAAM,WAAW,gBAAgB;IAC/B,cAAc;IACd,IAAI,EAAE,eAAe,CAAA;IACrB,oFAAoF;IACpF,aAAa,CAAC,EAAE,MAAM,IAAI,CAAA;IAC1B,qCAAqC;IACrC,cAAc,CAAC,EAAE,MAAM,IAAI,CAAA;IAC3B,qCAAqC;IACrC,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;IACtB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,8EAA8E;IAC9E,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAA;IAClC,qFAAqF;IACrF,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,gCAAgC;IAChC,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,+FAA+F;IAC/F,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,yCAAyC;IACzC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACtC;;;;OAIG;IACH,YAAY,CAAC,EAAE,IAAI,CACjB,KAAK,CAAC,wBAAwB,CAAC,QAAQ,CAAC,EACxC,UAAU,GAAG,MAAM,GAAG,YAAY,GAAG,WAAW,GAAG,UAAU,CAC9D,CAAA;CACF;AAID,eAAO,MAAM,WAAW,4FAiFvB,CAAA;AAKD,eAAO,MAAM,eAAe;;;;;;;;;;;CAWlB,CAAA"}

package/dist/components/AccountMenu/account-menu.js

@@ -0,0 +1,73 @@
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
+import * as React from "react";
+import { User, Settings, LogOut } from "lucide-react";
+import { Avatar } from "../Avatar/avatar.js";
+import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuItem } from "../DropdownMenu/dropdown-menu.js";
+const AccountMenu = React.forwardRef(
+  ({
+    user,
+    onViewProfile,
+    onOpenSettings,
+    onSignOut,
+    children,
+    align = "end",
+    triggerAriaLabel = "帳號與設定",
+    // i18n-allow: spec 預設 aria-label(account-menu.spec.md),consumer 以同名 prop 覆蓋
+    open,
+    defaultOpen,
+    onOpenChange,
+    triggerProps
+  }, ref) => {
+    if (process.env.NODE_ENV !== "production" && !children && !onViewProfile && !onOpenSettings && !onSignOut) {
+      console.warn(
+        "[DS AccountMenu] default 選單項未接 onViewProfile/onOpenSettings/onSignOut——item 點擊無反應。請傳入 callback 或自組 children。"
+      );
+    }
+    const avatar = user.avatar ?? {};
+    return /* @__PURE__ */ jsxs(DropdownMenu, { open, defaultOpen, onOpenChange, children: [
+      /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
+        "button",
+        {
+          ...triggerProps,
+          ref,
+          type: "button",
+          "aria-label": triggerAriaLabel,
+          className: "flex size-6 shrink-0 items-center justify-center self-center rounded-full focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1",
+          children: /* @__PURE__ */ jsx(Avatar, { size: 24, ...avatar, alt: avatar.alt ?? user.name })
+        }
+      ) }),
+      /* @__PURE__ */ jsx(DropdownMenuContent, { align, children: children ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(DropdownMenuGroup, { children: /* @__PURE__ */ jsx(DropdownMenuLabel, { children: user.name }) }),
+        children
+      ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsxs(DropdownMenuGroup, { children: [
+          /* @__PURE__ */ jsx(DropdownMenuLabel, { children: user.name }),
+          /* @__PURE__ */ jsx(DropdownMenuItem, { startIcon: User, onSelect: onViewProfile, children: "個人資料" }),
+          /* @__PURE__ */ jsx(DropdownMenuItem, { startIcon: Settings, onSelect: onOpenSettings, children: "設定" })
+        ] }),
+        /* @__PURE__ */ jsx(DropdownMenuGroup, { children: /* @__PURE__ */ jsx(DropdownMenuItem, { startIcon: LogOut, onSelect: onSignOut, children: "登出" }) })
+      ] }) })
+    ] });
+  }
+);
+AccountMenu.displayName = "AccountMenu";
+const accountMenuMeta = {
+  component: "AccountMenu",
+  family: null,
+  // composite(trigger = chrome header 24px avatar;浮層 = DropdownMenu Family 1 消費者)
+  variants: {},
+  sizes: {},
+  // trigger avatar 24px density-fixed(header-canonical.spec.md 4.5),無 size 軸 → 兩欄留空為 intentional
+  states: ["default", "focus-visible"],
+  tokens: {
+    bg: [],
+    fg: [],
+    ring: ["--ring"]
+    // trigger focus-visible ring canonical
+  }
+};
+export {
+  AccountMenu,
+  accountMenuMeta
+};
+//# sourceMappingURL=account-menu.js.map