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

package/dist/story-governance/category-matrix.d.ts

@@ -0,0 +1,35 @@
+export type Category = 'token' | 'component' | 'pattern' | 'internal' | 'template';
+export interface CategoryRule {
+    goal: string;
+    titlePrefix: string;
+    titleParts: number | string;
+    visibility: 'public' | 'filtered' | 'consumer';
+    sidebarOrder: number;
+    requiredStories: string;
+    renderDemo: string;
+    autodocs: boolean;
+    anatomyDiagram: string;
+    propsApiTable: boolean;
+    stateComboMatrix: string;
+    a11yTabTest: string;
+    visualRegression: string;
+    usageDoDont: string;
+    codeSnippet: string;
+    responsiveRtlDensity: string;
+    contentUxWriting: string;
+    openSnapshotCoverable: string;
+    traitShape: boolean | string;
+    classification: string;
+    rootBarrel: string;
+    universalGuard: boolean;
+}
+export declare const CATEGORY_MATRIX: Record<Category, CategoryRule>;
+export declare function resolveCategory(opts: {
+    path: string;
+    isInternal?: boolean;
+}): Category;
+export declare function ruleFor(opts: {
+    path: string;
+    isInternal?: boolean;
+}): CategoryRule;
+//# sourceMappingURL=category-matrix.d.ts.map

package/dist/story-governance/category-matrix.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"category-matrix.d.ts","sourceRoot":"","sources":["../../src/story-governance/category-matrix.ts"],"names":[],"mappings":"AAUA,MAAM,MAAM,QAAQ,GAAG,OAAO,GAAG,WAAW,GAAG,SAAS,GAAG,UAAU,GAAG,UAAU,CAAA;AAElF,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,MAAM,CAAA;IACZ,WAAW,EAAE,MAAM,CAAA;IACnB,UAAU,EAAE,MAAM,GAAG,MAAM,CAAA;IAC3B,UAAU,EAAE,QAAQ,GAAG,UAAU,GAAG,UAAU,CAAA;IAC9C,YAAY,EAAE,MAAM,CAAA;IACpB,eAAe,EAAE,MAAM,CAAA;IACvB,UAAU,EAAE,MAAM,CAAA;IAClB,QAAQ,EAAE,OAAO,CAAA;IACjB,cAAc,EAAE,MAAM,CAAA;IACtB,aAAa,EAAE,OAAO,CAAA;IACtB,gBAAgB,EAAE,MAAM,CAAA;IACxB,WAAW,EAAE,MAAM,CAAA;IACnB,gBAAgB,EAAE,MAAM,CAAA;IACxB,WAAW,EAAE,MAAM,CAAA;IACnB,WAAW,EAAE,MAAM,CAAA;IACnB,oBAAoB,EAAE,MAAM,CAAA;IAC5B,gBAAgB,EAAE,MAAM,CAAA;IACxB,qBAAqB,EAAE,MAAM,CAAA;IAC7B,UAAU,EAAE,OAAO,GAAG,MAAM,CAAA;IAC5B,cAAc,EAAE,MAAM,CAAA;IACtB,UAAU,EAAE,MAAM,CAAA;IAClB,cAAc,EAAE,OAAO,CAAA;CACxB;AAED,eAAO,MAAM,eAAe,EAA4B,MAAM,CAAC,QAAQ,EAAE,YAAY,CAAC,CAAA;AAItF,wBAAgB,eAAe,CAAC,IAAI,EAAE;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,UAAU,CAAC,EAAE,OAAO,CAAA;CAAE,GAAG,QAAQ,CAStF;AAED,wBAAgB,OAAO,CAAC,IAAI,EAAE;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,UAAU,CAAC,EAAE,OAAO,CAAA;CAAE,GAAG,YAAY,CAElF"}

package/dist/tokens/categorical-color.d.ts

@@ -0,0 +1,60 @@
+/**
+ * categorical-color.ts — Categorical 色相 SSOT(2026-06-04 codify)
+ *
+ * Tag / Avatar / Calendar 等「以色相做分類標籤」的元件,色彩 variant **一律消費此 SSOT**。
+ * 目的:**variant 名 == primitive 色相名,1:1,零 offset** —— 根治「red variant 接到 deep-orange」
+ * 這類 categorical-vs-semantic 混淆(2026-06-04 user 抓:red = 品牌紅 hue-25〔--brand #DF3232 同族〕
+ * ≠ deep-orange hue-38 ≠ semantic --error〔= deep-orange〕。三者完全無關)。
+ *
+ * 世界級對照:
+ * - Ant Design Tag preset colors —— 用原始色相名(red/orange/green/blue…)做 categorical labeling
+ *   (https://ant.design/components/tag/)。本 DS Tag/Avatar 採此模型。
+ * - Atlassian Color 原則 —— **categorical(裝飾)色 vs semantic(狀態)色必須分離**
+ *   (https://atlassian.design/foundations/color):categorical `red` 用 `--color-red-*`,跟 semantic
+ *   `--error`(= deep-orange)無關;把 error 色拿來當 categorical 標籤 = 反 pattern。
+ *
+ * ⚠️ Tailwind v4 掃描限制:class 字串**必須以字面形式出現在被掃描的 source**(本檔在 src/,會被掃),
+ * 不可用 runtime function 拼字串(否則 `bg-[var(--color-orange-1)]` 不被生成 → silent 失效)。
+ * 故本 SSOT 以**字面 const map** 提供;consumer `import` 後索引(cva 列 key 取值,保 VariantProps 型別)。
+ *
+ * 互動 state(solid dismiss hover/active)用 semantic `--{hue}-hover` / `--{hue}-active`
+ * (dark-mode 方向 pre-computed,**不可**用 primitive step-5,否則 dark mode 反向)。12 色相皆已定義。
+ *
+ * **加色相**:加進 `CATEGORICAL_HUES` + 下列 5 個 map 各補一行字面值(key X 用 `--color-X-*`,1:1)。
+ * **機械防線**:`scripts/categorical-color-invariants.mjs` I1(current required CI / deterministic audit chain)強制 map 的 key X 的值含 `--color-X-`(名實一致,禁 offset;原引 hook 名不存在,2026-07-04 修)。
+ */
+/** 12 個 categorical 色相。⚠️ 順序 = **categorical 指派序**(圖表系列鄰色最大區辨:blue→green→deep-orange→yellow→red…),**非** primitives.css 檔內宣告序 — 兩者本就不同,map 以名為 key 故功能無涉;**禁**為「對齊」重排(重排 = 圖表系列換色 = 視覺 breaking)。 */
+export declare const CATEGORICAL_HUES: readonly ["blue", "green", "deep-orange", "yellow", "red", "orange", "amber", "lime", "turquoise", "indigo", "purple", "magenta"];
+export type CategoricalHue = (typeof CATEGORICAL_HUES)[number];
+/** neutral 不是色相(無 hue),用 secondary/foreground + neutral-9 solid,各 consumer 自處理(不在下列 map)。 */
+export type CategoricalColor = CategoricalHue | 'neutral';
+/** subtle 模式 class:step-1 底 + step-7 字。key X 一律對 `--color-X-*`(1:1)。 */
+export declare const CAT_SUBTLE: Record<CategoricalHue, string>;
+/**
+ * solid 模式 class:step-6 底 + on-emphasis 配對文字。
+ * 文字色依「step-6 底亮度」分桶(WCAG ≥3:1 大粗字門檻,2026-06-04 user「以最低為原則」):
+ *   - 夠深的色底 → `text-on-emphasis`(白):blue / deep-orange / red / indigo / purple / magenta
+ *   - 太亮的色底 → `text-on-emphasis-dark`(深):yellow / amber / orange / lime / turquoise(白字連 3:1 都不過;turquoise 2026-07-16 dark 色相修正後 L=0.68 白字 2.77 → 切深字,兩 mode 5.65/6.47 全過)
+ *   - ★ green 例外:白字 2.47 連 3:1 都不過,但 user 拍板維持白字(綠底白字慣見觀感)= documented exception。
+ * 對比為 oklch→相對亮度實測(scripts/categorical-color-invariants.mjs 機械驗,green 列 exempt)。
+ */
+export declare const CAT_SOLID: Record<CategoricalHue, string>;
+/** solid 互動(dismiss hover/active)— semantic dark-mode-aware token。 */
+export declare const CAT_INTERACT: Record<CategoricalHue, {
+    hover: string;
+    active: string;
+}>;
+/** Avatar style 物件用:subtle / solid 的 raw token { bg, text }(非 class)。 */
+export declare const CAT_SUBTLE_TOKENS: Record<CategoricalHue, {
+    bg: string;
+    text: string;
+}>;
+export declare const CAT_SOLID_TOKENS: Record<CategoricalHue, {
+    bg: string;
+    text: string;
+}>;
+/** Calendar event tile:subtle 底 + hover step-2(1:1)。 */
+export declare const CAT_EVENT: Record<CategoricalHue, string>;
+/** Calendar all-day accent:左側 step-6 實心條。 */
+export declare const CAT_ACCENT: Record<CategoricalHue, string>;
+//# sourceMappingURL=categorical-color.d.ts.map

package/dist/tokens/categorical-color.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"categorical-color.d.ts","sourceRoot":"","sources":["../../src/tokens/categorical-color.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AAEH,oMAAoM;AACpM,eAAO,MAAM,gBAAgB,mIAanB,CAAA;AAEV,MAAM,MAAM,cAAc,GAAG,CAAC,OAAO,gBAAgB,CAAC,CAAC,MAAM,CAAC,CAAA;AAE9D,6FAA6F;AAC7F,MAAM,MAAM,gBAAgB,GAAG,cAAc,GAAG,SAAS,CAAA;AAEzD,wEAAwE;AACxE,eAAO,MAAM,UAAU,EAAE,MAAM,CAAC,cAAc,EAAE,MAAM,CAarD,CAAA;AAED;;;;;;;GAOG;AACH,eAAO,MAAM,SAAS,EAAE,MAAM,CAAC,cAAc,EAAE,MAAM,CAapD,CAAA;AAED,sEAAsE;AACtE,eAAO,MAAM,YAAY,EAAE,MAAM,CAAC,cAAc,EAAE;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,CAalF,CAAA;AAED,yEAAyE;AACzE,eAAO,MAAM,iBAAiB,EAAE,MAAM,CAAC,cAAc,EAAE;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,CAalF,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,MAAM,CAAC,cAAc,EAAE;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,CAajF,CAAA;AAED,wDAAwD;AACxD,eAAO,MAAM,SAAS,EAAE,MAAM,CAAC,cAAc,EAAE,MAAM,CAapD,CAAA;AAED,6CAA6C;AAC7C,eAAO,MAAM,UAAU,EAAE,MAAM,CAAC,cAAc,EAAE,MAAM,CAarD,CAAA"}

package/dist/tokens/categorical-color.js

@@ -0,0 +1,125 @@
+const CATEGORICAL_HUES = [
+  "blue",
+  "green",
+  "deep-orange",
+  "yellow",
+  "red",
+  "orange",
+  "amber",
+  "lime",
+  "turquoise",
+  "indigo",
+  "purple",
+  "magenta"
+];
+const CAT_SUBTLE = {
+  blue: "bg-[var(--color-blue-1)] text-[var(--color-blue-7)]",
+  green: "bg-[var(--color-green-1)] text-[var(--color-green-7)]",
+  "deep-orange": "bg-[var(--color-deep-orange-1)] text-[var(--color-deep-orange-7)]",
+  yellow: "bg-[var(--color-yellow-1)] text-[var(--color-yellow-7)]",
+  red: "bg-[var(--color-red-1)] text-[var(--color-red-7)]",
+  orange: "bg-[var(--color-orange-1)] text-[var(--color-orange-7)]",
+  amber: "bg-[var(--color-amber-1)] text-[var(--color-amber-7)]",
+  lime: "bg-[var(--color-lime-1)] text-[var(--color-lime-7)]",
+  turquoise: "bg-[var(--color-turquoise-1)] text-[var(--color-turquoise-7)]",
+  indigo: "bg-[var(--color-indigo-1)] text-[var(--color-indigo-7)]",
+  purple: "bg-[var(--color-purple-1)] text-[var(--color-purple-7)]",
+  magenta: "bg-[var(--color-magenta-1)] text-[var(--color-magenta-7)]"
+};
+const CAT_SOLID = {
+  blue: "bg-[var(--color-blue-6)] text-on-emphasis",
+  green: "bg-[var(--color-green-6)] text-on-emphasis",
+  // ★白字 documented exception(實測 2.47 < 3:1)
+  "deep-orange": "bg-[var(--color-deep-orange-6)] text-on-emphasis",
+  yellow: "bg-[var(--color-yellow-6)] text-on-emphasis-dark",
+  red: "bg-[var(--color-red-6)] text-on-emphasis",
+  orange: "bg-[var(--color-orange-6)] text-on-emphasis-dark",
+  amber: "bg-[var(--color-amber-6)] text-on-emphasis-dark",
+  lime: "bg-[var(--color-lime-6)] text-on-emphasis-dark",
+  turquoise: "bg-[var(--color-turquoise-6)] text-on-emphasis-dark",
+  indigo: "bg-[var(--color-indigo-6)] text-on-emphasis",
+  purple: "bg-[var(--color-purple-6)] text-on-emphasis",
+  magenta: "bg-[var(--color-magenta-6)] text-on-emphasis"
+};
+const CAT_INTERACT = {
+  blue: { hover: "var(--blue-hover)", active: "var(--blue-active)" },
+  green: { hover: "var(--green-hover)", active: "var(--green-active)" },
+  "deep-orange": { hover: "var(--deep-orange-hover)", active: "var(--deep-orange-active)" },
+  yellow: { hover: "var(--yellow-hover)", active: "var(--yellow-active)" },
+  red: { hover: "var(--red-hover)", active: "var(--red-active)" },
+  orange: { hover: "var(--orange-hover)", active: "var(--orange-active)" },
+  amber: { hover: "var(--amber-hover)", active: "var(--amber-active)" },
+  lime: { hover: "var(--lime-hover)", active: "var(--lime-active)" },
+  turquoise: { hover: "var(--turquoise-hover)", active: "var(--turquoise-active)" },
+  indigo: { hover: "var(--indigo-hover)", active: "var(--indigo-active)" },
+  purple: { hover: "var(--purple-hover)", active: "var(--purple-active)" },
+  magenta: { hover: "var(--magenta-hover)", active: "var(--magenta-active)" }
+};
+const CAT_SUBTLE_TOKENS = {
+  blue: { bg: "var(--color-blue-1)", text: "var(--color-blue-7)" },
+  green: { bg: "var(--color-green-1)", text: "var(--color-green-7)" },
+  "deep-orange": { bg: "var(--color-deep-orange-1)", text: "var(--color-deep-orange-7)" },
+  yellow: { bg: "var(--color-yellow-1)", text: "var(--color-yellow-7)" },
+  red: { bg: "var(--color-red-1)", text: "var(--color-red-7)" },
+  orange: { bg: "var(--color-orange-1)", text: "var(--color-orange-7)" },
+  amber: { bg: "var(--color-amber-1)", text: "var(--color-amber-7)" },
+  lime: { bg: "var(--color-lime-1)", text: "var(--color-lime-7)" },
+  turquoise: { bg: "var(--color-turquoise-1)", text: "var(--color-turquoise-7)" },
+  indigo: { bg: "var(--color-indigo-1)", text: "var(--color-indigo-7)" },
+  purple: { bg: "var(--color-purple-1)", text: "var(--color-purple-7)" },
+  magenta: { bg: "var(--color-magenta-1)", text: "var(--color-magenta-7)" }
+};
+const CAT_SOLID_TOKENS = {
+  blue: { bg: "var(--color-blue-6)", text: "var(--on-emphasis)" },
+  green: { bg: "var(--color-green-6)", text: "var(--on-emphasis)" },
+  // ★白字 documented exception
+  "deep-orange": { bg: "var(--color-deep-orange-6)", text: "var(--on-emphasis)" },
+  yellow: { bg: "var(--color-yellow-6)", text: "var(--on-emphasis-dark)" },
+  red: { bg: "var(--color-red-6)", text: "var(--on-emphasis)" },
+  orange: { bg: "var(--color-orange-6)", text: "var(--on-emphasis-dark)" },
+  amber: { bg: "var(--color-amber-6)", text: "var(--on-emphasis-dark)" },
+  lime: { bg: "var(--color-lime-6)", text: "var(--on-emphasis-dark)" },
+  turquoise: { bg: "var(--color-turquoise-6)", text: "var(--on-emphasis-dark)" },
+  indigo: { bg: "var(--color-indigo-6)", text: "var(--on-emphasis)" },
+  purple: { bg: "var(--color-purple-6)", text: "var(--on-emphasis)" },
+  magenta: { bg: "var(--color-magenta-6)", text: "var(--on-emphasis)" }
+};
+const CAT_EVENT = {
+  blue: "bg-[var(--color-blue-1)] text-[var(--color-blue-7)] hover:bg-[var(--color-blue-2)]",
+  green: "bg-[var(--color-green-1)] text-[var(--color-green-7)] hover:bg-[var(--color-green-2)]",
+  "deep-orange": "bg-[var(--color-deep-orange-1)] text-[var(--color-deep-orange-7)] hover:bg-[var(--color-deep-orange-2)]",
+  yellow: "bg-[var(--color-yellow-1)] text-[var(--color-yellow-7)] hover:bg-[var(--color-yellow-2)]",
+  red: "bg-[var(--color-red-1)] text-[var(--color-red-7)] hover:bg-[var(--color-red-2)]",
+  orange: "bg-[var(--color-orange-1)] text-[var(--color-orange-7)] hover:bg-[var(--color-orange-2)]",
+  amber: "bg-[var(--color-amber-1)] text-[var(--color-amber-7)] hover:bg-[var(--color-amber-2)]",
+  lime: "bg-[var(--color-lime-1)] text-[var(--color-lime-7)] hover:bg-[var(--color-lime-2)]",
+  turquoise: "bg-[var(--color-turquoise-1)] text-[var(--color-turquoise-7)] hover:bg-[var(--color-turquoise-2)]",
+  indigo: "bg-[var(--color-indigo-1)] text-[var(--color-indigo-7)] hover:bg-[var(--color-indigo-2)]",
+  purple: "bg-[var(--color-purple-1)] text-[var(--color-purple-7)] hover:bg-[var(--color-purple-2)]",
+  magenta: "bg-[var(--color-magenta-1)] text-[var(--color-magenta-7)] hover:bg-[var(--color-magenta-2)]"
+};
+const CAT_ACCENT = {
+  blue: "border-l-[3px] border-[var(--color-blue-6)]",
+  green: "border-l-[3px] border-[var(--color-green-6)]",
+  "deep-orange": "border-l-[3px] border-[var(--color-deep-orange-6)]",
+  yellow: "border-l-[3px] border-[var(--color-yellow-6)]",
+  red: "border-l-[3px] border-[var(--color-red-6)]",
+  orange: "border-l-[3px] border-[var(--color-orange-6)]",
+  amber: "border-l-[3px] border-[var(--color-amber-6)]",
+  lime: "border-l-[3px] border-[var(--color-lime-6)]",
+  turquoise: "border-l-[3px] border-[var(--color-turquoise-6)]",
+  indigo: "border-l-[3px] border-[var(--color-indigo-6)]",
+  purple: "border-l-[3px] border-[var(--color-purple-6)]",
+  magenta: "border-l-[3px] border-[var(--color-magenta-6)]"
+};
+export {
+  CATEGORICAL_HUES,
+  CAT_ACCENT,
+  CAT_EVENT,
+  CAT_INTERACT,
+  CAT_SOLID,
+  CAT_SOLID_TOKENS,
+  CAT_SUBTLE,
+  CAT_SUBTLE_TOKENS
+};
+//# sourceMappingURL=categorical-color.js.map

package/dist/tokens/categorical-color.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"categorical-color.js","sources":["../../src/tokens/categorical-color.ts"],"sourcesContent":["/**\n * categorical-color.ts — Categorical 色相 SSOT(2026-06-04 codify)\n *\n * Tag / Avatar / Calendar 等「以色相做分類標籤」的元件,色彩 variant **一律消費此 SSOT**。\n * 目的:**variant 名 == primitive 色相名,1:1,零 offset** —— 根治「red variant 接到 deep-orange」\n * 這類 categorical-vs-semantic 混淆(2026-06-04 user 抓:red = 品牌紅 hue-25〔--brand #DF3232 同族〕\n * ≠ deep-orange hue-38 ≠ semantic --error〔= deep-orange〕。三者完全無關)。\n *\n * 世界級對照:\n * - Ant Design Tag preset colors —— 用原始色相名(red/orange/green/blue…)做 categorical labeling\n *   (https://ant.design/components/tag/)。本 DS Tag/Avatar 採此模型。\n * - Atlassian Color 原則 —— **categorical(裝飾)色 vs semantic(狀態)色必須分離**\n *   (https://atlassian.design/foundations/color):categorical `red` 用 `--color-red-*`,跟 semantic\n *   `--error`(= deep-orange)無關;把 error 色拿來當 categorical 標籤 = 反 pattern。\n *\n * ⚠️ Tailwind v4 掃描限制:class 字串**必須以字面形式出現在被掃描的 source**(本檔在 src/,會被掃),\n * 不可用 runtime function 拼字串(否則 `bg-[var(--color-orange-1)]` 不被生成 → silent 失效)。\n * 故本 SSOT 以**字面 const map** 提供;consumer `import` 後索引(cva 列 key 取值,保 VariantProps 型別)。\n *\n * 互動 state(solid dismiss hover/active)用 semantic `--{hue}-hover` / `--{hue}-active`\n * (dark-mode 方向 pre-computed,**不可**用 primitive step-5,否則 dark mode 反向)。12 色相皆已定義。\n *\n * **加色相**:加進 `CATEGORICAL_HUES` + 下列 5 個 map 各補一行字面值(key X 用 `--color-X-*`,1:1)。\n * **機械防線**:`scripts/categorical-color-invariants.mjs` I1(current required CI / deterministic audit chain)強制 map 的 key X 的值含 `--color-X-`(名實一致,禁 offset;原引 hook 名不存在,2026-07-04 修)。\n */\n\n/** 12 個 categorical 色相。⚠️ 順序 = **categorical 指派序**(圖表系列鄰色最大區辨:blue→green→deep-orange→yellow→red…),**非** primitives.css 檔內宣告序 — 兩者本就不同,map 以名為 key 故功能無涉;**禁**為「對齊」重排(重排 = 圖表系列換色 = 視覺 breaking)。 */\nexport const CATEGORICAL_HUES = [\n  'blue',\n  'green',\n  'deep-orange',\n  'yellow',\n  'red',\n  'orange',\n  'amber',\n  'lime',\n  'turquoise',\n  'indigo',\n  'purple',\n  'magenta',\n] as const\n\nexport type CategoricalHue = (typeof CATEGORICAL_HUES)[number]\n\n/** neutral 不是色相(無 hue),用 secondary/foreground + neutral-9 solid,各 consumer 自處理(不在下列 map)。 */\nexport type CategoricalColor = CategoricalHue | 'neutral'\n\n/** subtle 模式 class:step-1 底 + step-7 字。key X 一律對 `--color-X-*`(1:1)。 */\nexport const CAT_SUBTLE: Record<CategoricalHue, string> = {\n  blue: 'bg-[var(--color-blue-1)] text-[var(--color-blue-7)]',\n  green: 'bg-[var(--color-green-1)] text-[var(--color-green-7)]',\n  'deep-orange': 'bg-[var(--color-deep-orange-1)] text-[var(--color-deep-orange-7)]',\n  yellow: 'bg-[var(--color-yellow-1)] text-[var(--color-yellow-7)]',\n  red: 'bg-[var(--color-red-1)] text-[var(--color-red-7)]',\n  orange: 'bg-[var(--color-orange-1)] text-[var(--color-orange-7)]',\n  amber: 'bg-[var(--color-amber-1)] text-[var(--color-amber-7)]',\n  lime: 'bg-[var(--color-lime-1)] text-[var(--color-lime-7)]',\n  turquoise: 'bg-[var(--color-turquoise-1)] text-[var(--color-turquoise-7)]',\n  indigo: 'bg-[var(--color-indigo-1)] text-[var(--color-indigo-7)]',\n  purple: 'bg-[var(--color-purple-1)] text-[var(--color-purple-7)]',\n  magenta: 'bg-[var(--color-magenta-1)] text-[var(--color-magenta-7)]',\n}\n\n/**\n * solid 模式 class:step-6 底 + on-emphasis 配對文字。\n * 文字色依「step-6 底亮度」分桶(WCAG ≥3:1 大粗字門檻,2026-06-04 user「以最低為原則」):\n *   - 夠深的色底 → `text-on-emphasis`(白):blue / deep-orange / red / indigo / purple / magenta\n *   - 太亮的色底 → `text-on-emphasis-dark`(深):yellow / amber / orange / lime / turquoise(白字連 3:1 都不過;turquoise 2026-07-16 dark 色相修正後 L=0.68 白字 2.77 → 切深字,兩 mode 5.65/6.47 全過)\n *   - ★ green 例外:白字 2.47 連 3:1 都不過,但 user 拍板維持白字(綠底白字慣見觀感)= documented exception。\n * 對比為 oklch→相對亮度實測(scripts/categorical-color-invariants.mjs 機械驗,green 列 exempt)。\n */\nexport const CAT_SOLID: Record<CategoricalHue, string> = {\n  blue: 'bg-[var(--color-blue-6)] text-on-emphasis',\n  green: 'bg-[var(--color-green-6)] text-on-emphasis', // ★白字 documented exception(實測 2.47 < 3:1)\n  'deep-orange': 'bg-[var(--color-deep-orange-6)] text-on-emphasis',\n  yellow: 'bg-[var(--color-yellow-6)] text-on-emphasis-dark',\n  red: 'bg-[var(--color-red-6)] text-on-emphasis',\n  orange: 'bg-[var(--color-orange-6)] text-on-emphasis-dark',\n  amber: 'bg-[var(--color-amber-6)] text-on-emphasis-dark',\n  lime: 'bg-[var(--color-lime-6)] text-on-emphasis-dark',\n  turquoise: 'bg-[var(--color-turquoise-6)] text-on-emphasis-dark',\n  indigo: 'bg-[var(--color-indigo-6)] text-on-emphasis',\n  purple: 'bg-[var(--color-purple-6)] text-on-emphasis',\n  magenta: 'bg-[var(--color-magenta-6)] text-on-emphasis',\n}\n\n/** solid 互動(dismiss hover/active)— semantic dark-mode-aware token。 */\nexport const CAT_INTERACT: Record<CategoricalHue, { hover: string; active: string }> = {\n  blue: { hover: 'var(--blue-hover)', active: 'var(--blue-active)' },\n  green: { hover: 'var(--green-hover)', active: 'var(--green-active)' },\n  'deep-orange': { hover: 'var(--deep-orange-hover)', active: 'var(--deep-orange-active)' },\n  yellow: { hover: 'var(--yellow-hover)', active: 'var(--yellow-active)' },\n  red: { hover: 'var(--red-hover)', active: 'var(--red-active)' },\n  orange: { hover: 'var(--orange-hover)', active: 'var(--orange-active)' },\n  amber: { hover: 'var(--amber-hover)', active: 'var(--amber-active)' },\n  lime: { hover: 'var(--lime-hover)', active: 'var(--lime-active)' },\n  turquoise: { hover: 'var(--turquoise-hover)', active: 'var(--turquoise-active)' },\n  indigo: { hover: 'var(--indigo-hover)', active: 'var(--indigo-active)' },\n  purple: { hover: 'var(--purple-hover)', active: 'var(--purple-active)' },\n  magenta: { hover: 'var(--magenta-hover)', active: 'var(--magenta-active)' },\n}\n\n/** Avatar style 物件用:subtle / solid 的 raw token { bg, text }(非 class)。 */\nexport const CAT_SUBTLE_TOKENS: Record<CategoricalHue, { bg: string; text: string }> = {\n  blue: { bg: 'var(--color-blue-1)', text: 'var(--color-blue-7)' },\n  green: { bg: 'var(--color-green-1)', text: 'var(--color-green-7)' },\n  'deep-orange': { bg: 'var(--color-deep-orange-1)', text: 'var(--color-deep-orange-7)' },\n  yellow: { bg: 'var(--color-yellow-1)', text: 'var(--color-yellow-7)' },\n  red: { bg: 'var(--color-red-1)', text: 'var(--color-red-7)' },\n  orange: { bg: 'var(--color-orange-1)', text: 'var(--color-orange-7)' },\n  amber: { bg: 'var(--color-amber-1)', text: 'var(--color-amber-7)' },\n  lime: { bg: 'var(--color-lime-1)', text: 'var(--color-lime-7)' },\n  turquoise: { bg: 'var(--color-turquoise-1)', text: 'var(--color-turquoise-7)' },\n  indigo: { bg: 'var(--color-indigo-1)', text: 'var(--color-indigo-7)' },\n  purple: { bg: 'var(--color-purple-1)', text: 'var(--color-purple-7)' },\n  magenta: { bg: 'var(--color-magenta-1)', text: 'var(--color-magenta-7)' },\n}\n// 同 CAT_SOLID 的文字分桶(白 / 深),raw token 版供 Avatar style 物件用。green = ★白字 exception。\nexport const CAT_SOLID_TOKENS: Record<CategoricalHue, { bg: string; text: string }> = {\n  blue: { bg: 'var(--color-blue-6)', text: 'var(--on-emphasis)' },\n  green: { bg: 'var(--color-green-6)', text: 'var(--on-emphasis)' }, // ★白字 documented exception\n  'deep-orange': { bg: 'var(--color-deep-orange-6)', text: 'var(--on-emphasis)' },\n  yellow: { bg: 'var(--color-yellow-6)', text: 'var(--on-emphasis-dark)' },\n  red: { bg: 'var(--color-red-6)', text: 'var(--on-emphasis)' },\n  orange: { bg: 'var(--color-orange-6)', text: 'var(--on-emphasis-dark)' },\n  amber: { bg: 'var(--color-amber-6)', text: 'var(--on-emphasis-dark)' },\n  lime: { bg: 'var(--color-lime-6)', text: 'var(--on-emphasis-dark)' },\n  turquoise: { bg: 'var(--color-turquoise-6)', text: 'var(--on-emphasis-dark)' },\n  indigo: { bg: 'var(--color-indigo-6)', text: 'var(--on-emphasis)' },\n  purple: { bg: 'var(--color-purple-6)', text: 'var(--on-emphasis)' },\n  magenta: { bg: 'var(--color-magenta-6)', text: 'var(--on-emphasis)' },\n}\n\n/** Calendar event tile:subtle 底 + hover step-2(1:1)。 */\nexport const CAT_EVENT: Record<CategoricalHue, string> = {\n  blue: 'bg-[var(--color-blue-1)] text-[var(--color-blue-7)] hover:bg-[var(--color-blue-2)]',\n  green: 'bg-[var(--color-green-1)] text-[var(--color-green-7)] hover:bg-[var(--color-green-2)]',\n  'deep-orange': 'bg-[var(--color-deep-orange-1)] text-[var(--color-deep-orange-7)] hover:bg-[var(--color-deep-orange-2)]',\n  yellow: 'bg-[var(--color-yellow-1)] text-[var(--color-yellow-7)] hover:bg-[var(--color-yellow-2)]',\n  red: 'bg-[var(--color-red-1)] text-[var(--color-red-7)] hover:bg-[var(--color-red-2)]',\n  orange: 'bg-[var(--color-orange-1)] text-[var(--color-orange-7)] hover:bg-[var(--color-orange-2)]',\n  amber: 'bg-[var(--color-amber-1)] text-[var(--color-amber-7)] hover:bg-[var(--color-amber-2)]',\n  lime: 'bg-[var(--color-lime-1)] text-[var(--color-lime-7)] hover:bg-[var(--color-lime-2)]',\n  turquoise: 'bg-[var(--color-turquoise-1)] text-[var(--color-turquoise-7)] hover:bg-[var(--color-turquoise-2)]',\n  indigo: 'bg-[var(--color-indigo-1)] text-[var(--color-indigo-7)] hover:bg-[var(--color-indigo-2)]',\n  purple: 'bg-[var(--color-purple-1)] text-[var(--color-purple-7)] hover:bg-[var(--color-purple-2)]',\n  magenta: 'bg-[var(--color-magenta-1)] text-[var(--color-magenta-7)] hover:bg-[var(--color-magenta-2)]',\n}\n\n/** Calendar all-day accent:左側 step-6 實心條。 */\nexport const CAT_ACCENT: Record<CategoricalHue, string> = {\n  blue: 'border-l-[3px] border-[var(--color-blue-6)]',\n  green: 'border-l-[3px] border-[var(--color-green-6)]',\n  'deep-orange': 'border-l-[3px] border-[var(--color-deep-orange-6)]',\n  yellow: 'border-l-[3px] border-[var(--color-yellow-6)]',\n  red: 'border-l-[3px] border-[var(--color-red-6)]',\n  orange: 'border-l-[3px] border-[var(--color-orange-6)]',\n  amber: 'border-l-[3px] border-[var(--color-amber-6)]',\n  lime: 'border-l-[3px] border-[var(--color-lime-6)]',\n  turquoise: 'border-l-[3px] border-[var(--color-turquoise-6)]',\n  indigo: 'border-l-[3px] border-[var(--color-indigo-6)]',\n  purple: 'border-l-[3px] border-[var(--color-purple-6)]',\n  magenta: 'border-l-[3px] border-[var(--color-magenta-6)]',\n}\n"],"names":[],"mappings":"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"}

package/dist/tokens/motion/motion.d.ts

@@ -1,15 +1,16 @@
 /**
- * Motion tokens — JS mirror of `motion.css` for Radix/JS API consumers.
+ * Motion tokens — JS mirror of `motion.css` delay tokens for Radix/JS API consumers.
  *
  * Radix primitive props(`delayDuration` / `openDelay` / `closeDelay`)期望 number ms,
- * 不認 CSS var。本 file 是 motion.css 對應 number value 鏡像;改值必同步兩處(或加 lint)。
+ * 不認 CSS var。本 file 是 motion.css `--motion-delay-*` 對應 number value 鏡像;改值必同步兩處。
+ * (進出場動畫 token 為純 CSS 驅動,由 tw-animate-css 消費,不需 JS 鏡像。)
  *
- * SSOT: `motion.css` + `motion.spec.md`。
+ * SSOT: `motion.css` + `motion.spec.md`。命名 2026-07-11 統一 `--motion-delay-*`(原 `--hover-delay-*`)。
  */
 /** 純文字提示(Tooltip)— passive hint。2026-05-20 200→500ms 對齊 Material 3 / Apple HIG / shadcn-Radix 主流 */
-export declare const HOVER_DELAY_PLAIN_MS = 500;
-/** 內容預覽(HoverCard / NameCard)— rich preview。2026-05-20 300→700ms 避免列表掃視誤觸發 fetch */
-export declare const HOVER_DELAY_RICH_MS = 700;
+export declare const MOTION_DELAY_PLAIN_MS = 500;
+/** 內容預覽(HoverCard / ProfileCard)— rich preview。2026-05-20 300→700ms 避免列表掃視誤觸發 fetch */
+export declare const MOTION_DELAY_RICH_MS = 700;
 /** 通用關閉延遲(所有 hover overlay)— accidental-hover 容錯 */
-export declare const HOVER_DELAY_CLOSE_MS = 200;
+export declare const MOTION_DELAY_CLOSE_MS = 200;
 //# sourceMappingURL=motion.d.ts.map

package/dist/tokens/motion/motion.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"motion.d.ts","sourceRoot":"","sources":["../../../src/tokens/motion/motion.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,oGAAoG;AACpG,eAAO,MAAM,oBAAoB,MAAM,CAAA;AAEvC,oFAAoF;AACpF,eAAO,MAAM,mBAAmB,MAAM,CAAA;AAEtC,oDAAoD;AACpD,eAAO,MAAM,oBAAoB,MAAM,CAAA"}
+{"version":3,"file":"motion.d.ts","sourceRoot":"","sources":["../../../src/tokens/motion/motion.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,oGAAoG;AACpG,eAAO,MAAM,qBAAqB,MAAM,CAAA;AAExC,uFAAuF;AACvF,eAAO,MAAM,oBAAoB,MAAM,CAAA;AAEvC,oDAAoD;AACpD,eAAO,MAAM,qBAAqB,MAAM,CAAA"}

package/dist/tokens/motion/motion.js

@@ -1,9 +1,9 @@
-const HOVER_DELAY_PLAIN_MS = 500;
-const HOVER_DELAY_RICH_MS = 700;
-const HOVER_DELAY_CLOSE_MS = 200;
+const MOTION_DELAY_PLAIN_MS = 500;
+const MOTION_DELAY_RICH_MS = 700;
+const MOTION_DELAY_CLOSE_MS = 200;
 export {
-  HOVER_DELAY_CLOSE_MS,
-  HOVER_DELAY_PLAIN_MS,
-  HOVER_DELAY_RICH_MS
+  MOTION_DELAY_CLOSE_MS,
+  MOTION_DELAY_PLAIN_MS,
+  MOTION_DELAY_RICH_MS
 };
 //# sourceMappingURL=motion.js.map

package/dist/tokens/motion/motion.js.map

@@ -1 +1 @@
-{"version":3,"file":"motion.js","sources":["../../../src/tokens/motion/motion.ts"],"sourcesContent":["/**\n * Motion tokens — JS mirror of `motion.css` for Radix/JS API consumers.\n *\n * Radix primitive props(`delayDuration` / `openDelay` / `closeDelay`)期望 number ms,\n * 不認 CSS var。本 file 是 motion.css 對應 number value 鏡像;改值必同步兩處(或加 lint)。\n *\n * SSOT: `motion.css` + `motion.spec.md`。\n */\n\n/** 純文字提示(Tooltip)— passive hint。2026-05-20 200→500ms 對齊 Material 3 / Apple HIG / shadcn-Radix 主流 */\nexport const HOVER_DELAY_PLAIN_MS = 500\n\n/** 內容預覽(HoverCard / NameCard)— rich preview。2026-05-20 300→700ms 避免列表掃視誤觸發 fetch */\nexport const HOVER_DELAY_RICH_MS = 700\n\n/** 通用關閉延遲(所有 hover overlay)— accidental-hover 容錯 */\nexport const HOVER_DELAY_CLOSE_MS = 200\n"],"names":[],"mappings":"AAUO,MAAM,uBAAuB;AAG7B,MAAM,sBAAsB;AAG5B,MAAM,uBAAuB;"}
+{"version":3,"file":"motion.js","sources":["../../../src/tokens/motion/motion.ts"],"sourcesContent":["/**\n * Motion tokens — JS mirror of `motion.css` delay tokens for Radix/JS API consumers.\n *\n * Radix primitive props(`delayDuration` / `openDelay` / `closeDelay`)期望 number ms,\n * 不認 CSS var。本 file 是 motion.css `--motion-delay-*` 對應 number value 鏡像;改值必同步兩處。\n * (進出場動畫 token 為純 CSS 驅動,由 tw-animate-css 消費,不需 JS 鏡像。)\n *\n * SSOT: `motion.css` + `motion.spec.md`。命名 2026-07-11 統一 `--motion-delay-*`(原 `--hover-delay-*`)。\n */\n\n/** 純文字提示(Tooltip)— passive hint。2026-05-20 200→500ms 對齊 Material 3 / Apple HIG / shadcn-Radix 主流 */\nexport const MOTION_DELAY_PLAIN_MS = 500\n\n/** 內容預覽(HoverCard / ProfileCard)— rich preview。2026-05-20 300→700ms 避免列表掃視誤觸發 fetch */\nexport const MOTION_DELAY_RICH_MS = 700\n\n/** 通用關閉延遲(所有 hover overlay)— accidental-hover 容錯 */\nexport const MOTION_DELAY_CLOSE_MS = 200\n"],"names":[],"mappings":"AAWO,MAAM,wBAAwB;AAG9B,MAAM,uBAAuB;AAG7B,MAAM,wBAAwB;"}

package/dist/tokens/motion/overlay-motion.d.ts

@@ -0,0 +1,19 @@
+/**
+ * Overlay 進出場動畫 — 共用 duration / easing / reduced-motion SSOT(2026-07-11)。
+ *
+ * 消費 `motion.css` 的 `--motion-*` 動畫 token,經 tw-animate-css 的 `--tw-duration` / `--tw-ease`
+ * 變數綁定 → 7 浮層時長/曲線/無障礙守衛單一 SSOT,改 token 一處傳播全部(M17)。
+ *
+ * 幾何(fade / zoom / slide 距離方向)per-prototype 各自帶:
+ *   - 輕量浮層(Tooltip/Popover/HoverCard/DropdownMenu):fade + zoom-95 + slide-side-2(8px)
+ *   - 模態面板置中(Dialog/FileViewer):fade + zoom-95 + slide-center
+ *   - 邊緣抽屜(Sheet):slide-edge(100%),正當地無 zoom
+ * 本 module 只統一「時長 + 曲線 + reduced-motion」,不管幾何原型(對齊世界級 tier 分層)。
+ *
+ * Easing:進場減速(--motion-easing-enter)/ 出場加速(--motion-easing-exit),由 data-state gate。
+ */
+/** 輕量浮層(Tooltip / Popover / HoverCard / DropdownMenu)— 150ms */
+export declare const overlayMotion = "[--tw-duration:var(--motion-duration-overlay)] data-[state=open]:[--tw-ease:var(--motion-easing-enter)] data-[state=closed]:[--tw-ease:var(--motion-easing-exit)] motion-reduce:animate-none";
+/** 模態面板(Dialog / Sheet / FileViewer)— 250ms(面積大位移遠,慢一階) */
+export declare const surfaceMotion = "[--tw-duration:var(--motion-duration-surface)] data-[state=open]:[--tw-ease:var(--motion-easing-enter)] data-[state=closed]:[--tw-ease:var(--motion-easing-exit)] motion-reduce:animate-none";
+//# sourceMappingURL=overlay-motion.d.ts.map

package/dist/tokens/motion/overlay-motion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"overlay-motion.d.ts","sourceRoot":"","sources":["../../../src/tokens/motion/overlay-motion.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG;AAQH,gEAAgE;AAChE,eAAO,MAAM,aAAa,iMAAuE,CAAA;AAEjG,2DAA2D;AAC3D,eAAO,MAAM,aAAa,iMAAuE,CAAA"}

package/dist/tokens/motion/overlay-motion.js

@@ -0,0 +1,9 @@
+const EASING = "data-[state=open]:[--tw-ease:var(--motion-easing-enter)] data-[state=closed]:[--tw-ease:var(--motion-easing-exit)]";
+const REDUCE = "motion-reduce:animate-none";
+const overlayMotion = `[--tw-duration:var(--motion-duration-overlay)] ${EASING} ${REDUCE}`;
+const surfaceMotion = `[--tw-duration:var(--motion-duration-surface)] ${EASING} ${REDUCE}`;
+export {
+  overlayMotion,
+  surfaceMotion
+};
+//# sourceMappingURL=overlay-motion.js.map

package/dist/tokens/motion/overlay-motion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"overlay-motion.js","sources":["../../../src/tokens/motion/overlay-motion.ts"],"sourcesContent":["/**\n * Overlay 進出場動畫 — 共用 duration / easing / reduced-motion SSOT(2026-07-11)。\n *\n * 消費 `motion.css` 的 `--motion-*` 動畫 token,經 tw-animate-css 的 `--tw-duration` / `--tw-ease`\n * 變數綁定 → 7 浮層時長/曲線/無障礙守衛單一 SSOT,改 token 一處傳播全部(M17)。\n *\n * 幾何(fade / zoom / slide 距離方向)per-prototype 各自帶:\n *   - 輕量浮層(Tooltip/Popover/HoverCard/DropdownMenu):fade + zoom-95 + slide-side-2(8px)\n *   - 模態面板置中(Dialog/FileViewer):fade + zoom-95 + slide-center\n *   - 邊緣抽屜(Sheet):slide-edge(100%),正當地無 zoom\n * 本 module 只統一「時長 + 曲線 + reduced-motion」,不管幾何原型(對齊世界級 tier 分層)。\n *\n * Easing:進場減速(--motion-easing-enter)/ 出場加速(--motion-easing-exit),由 data-state gate。\n */\n\n// enter=decelerate / exit=accelerate(對齊 Material standard-decelerate/accelerate 曲線)\nconst EASING =\n  'data-[state=open]:[--tw-ease:var(--motion-easing-enter)] data-[state=closed]:[--tw-ease:var(--motion-easing-exit)]'\n// prefers-reduced-motion:關進出場動畫(無障礙,7 浮層統一 → 補齊 FileViewer 原缺口)\nconst REDUCE = 'motion-reduce:animate-none'\n\n/** 輕量浮層(Tooltip / Popover / HoverCard / DropdownMenu)— 150ms */\nexport const overlayMotion = `[--tw-duration:var(--motion-duration-overlay)] ${EASING} ${REDUCE}`\n\n/** 模態面板(Dialog / Sheet / FileViewer)— 250ms(面積大位移遠,慢一階) */\nexport const surfaceMotion = `[--tw-duration:var(--motion-duration-surface)] ${EASING} ${REDUCE}`\n"],"names":[],"mappings":"AAgBA,MAAM,SACJ;AAEF,MAAM,SAAS;AAGR,MAAM,gBAAgB,kDAAkD,MAAM,IAAI,MAAM;AAGxF,MAAM,gBAAgB,kDAAkD,MAAM,IAAI,MAAM;"}

package/dist/tokens/uiSize/icon-size.d.ts

@@ -17,7 +17,7 @@
  * `field-height-xs / sm / md` → icon **16px**
  * `field-height-lg`           → icon **20px**
  *
- * 詳 spec L132+ Icon Size Tier 段(stroke 下限 12px / Tag-Field 配對 / etc.)
+ * 詳 uiSize.spec.md「Icon 尺寸 Tier」段(段名指法免行號漂移;stroke 下限 12px / Tag-Field 配對 / etc.)
  *
  * ── Consumer 用法 ──
  * ```tsx
@@ -26,15 +26,14 @@
  * // sm/md → 16, lg → 20
  * <LucideIcon size={ICON_SIZE[size]} />
  *
- * // form control xs(field-height-xs 24)用 ICON_SIZE.sm(同 16,per spec L132 Tier)
+ * // form control xs(field-height-xs 24)用 ICON_SIZE.sm(同 16,per uiSize.spec.md「Icon 尺寸 Tier」段)
  * <LucideIcon size={size === 'xs' ? ICON_SIZE.sm : ICON_SIZE[size]} />
  * ```
  *
  * ── 防漂移 ──
  * 1. uiSize.spec.md「Icon Size Tier」段 codify 16/16/16/20 tier(text-based canonical)
  * 2. 本 const 程式化 SSOT(type-safe Record<RowSize, number>)
- * 3. Hook `check_icon_size_literal.sh`(write-time regex 攔非標準 literal)
- * 4. Audit Dim「Icon size literal compliance」DS-wide audit-time scan
+ * 3. Audit Dim「Icon size literal compliance」DS-wide audit-time scan(write-time hook 尚未實作 — 改靠 audit-time + mindset)
  *
  * ── Carve-out(不適用本 SSOT)──
  * - `rating.spec.md` Rating star 20/24/24(identity scale,cite Ant/Material/Airbnb)

package/dist/tokens/uiSize/icon-size.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"icon-size.d.ts","sourceRoot":"","sources":["../../../src/tokens/uiSize/icon-size.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiDG;AACH,OAAO,EAAE,SAAS,EAAE,MAAM,uDAAuD,CAAA;AACjF,YAAY,EAAE,OAAO,EAAE,MAAM,uDAAuD,CAAA"}
+{"version":3,"file":"icon-size.d.ts","sourceRoot":"","sources":["../../../src/tokens/uiSize/icon-size.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgDG;AACH,OAAO,EAAE,SAAS,EAAE,MAAM,uDAAuD,CAAA;AACjF,YAAY,EAAE,OAAO,EAAE,MAAM,uDAAuD,CAAA"}

package/dist/tokens/uiSize/icon-size.js

@@ -0,0 +1,5 @@
+import { ICON_SIZE } from "../../patterns/element-anatomy/item-anatomy.js";
+export {
+  ICON_SIZE
+};
+//# sourceMappingURL=icon-size.js.map

package/dist/tokens/uiSize/icon-size.js.map

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

package/ds-canonical/adapters/claude/agents/README.md

@@ -0,0 +1,58 @@
+# .claude/agents/ Charter
+
+## 這裡只收:**特化 subagent**(scoped tools + isolated context)
+
+每個 agent 一檔 `.md`,格式:
+```markdown
+---
+name: agent-name-kebab-case
+description: 何時 invoke(main AI 透過 Task tool `subagent_type: 'agent-name-kebab-case'` 調用)
+tools: [Read, Grep, Bash, Glob]  # scoped — 該 agent 需要的最小集
+---
+
+System prompt body — agent 收到 prompt + 本檔內容 作為 context。
+```
+
+**vs Skill**:skill 是 main AI 驅動的 workflow；只有真正產品／UI／UX SSOT 取捨才含
+user-decision checkpoint。agent 是 main AI 呼叫的特化 worker(isolated context,返回 summary)。
+
+**vs 一般 general-purpose Agent**:registered agent 有 scoped tools(不能亂改檔)+ 特化 system prompt(專業知識內建)+ 更易 audit。
+
+## 當前居民(1,2026-07-20 verified against Claude Code 2.1.215)
+
+| Agent | 用途 | Workflow SSOT |
+|---|---|---|
+| `canonical-reviewer` | 在隔離 context 做唯讀治理審查 | `packages/design-system/ds-canonical/skills/canonical-reviewer/SKILL.md` |
+
+Claude Code 專案級 subagent 現在會讀取 `.claude/agents/*.md`。共用 workflow 由 provider registry 生成的 skill `context: fork` + `agent` frontmatter 注入；這條路徑也避開 2.1.215 將 agent 當主 session 以 `--agent` 啟動時未套用 `skills` preload 的實測差異。Agent 檔只放 provider-specific 的隔離、工具權限與輸出契約；判準不在這裡複製。此目錄是 deterministic output；新增或修改 agent 應改 `packages/design-system/ds-canonical/adapters/claude/agents/` 後重生 provider view，並重開 Claude Code session 才會重載。
+
+## 這裡**不收**(反例)
+
+| 疑似要放這但其實不是 | 正確去處 | 為什麼 |
+|---------------------|---------|--------|
+| 可能含產品／UI／UX SSOT 決策的 workflow | `packages/design-system/ds-canonical/skills/`(runtime 使用 generated provider view) | agent 返回一次 summary；真正 P2H checkpoint 需在 main AI 端處理 |
+| 一次性 script | `.claude/commands/` | agent 是 AI worker,不是 script |
+| 每 session signal rule | `CLAUDE.md` | agent 只在 invoke 時載入 |
+| 機械 tool-level 檢查 | `packages/design-system/ds-canonical/hooks/` | hook 是 pre/post tool event,不是 AI agent(`.claude/hooks/` 只是 generated view)|
+
+## 新 agent 的 criteria
+
+1. **Scope isolated**(main AI 不需知道 agent 內部思考,只讀 agent return summary)
+2. **Scoped tools** 明確寫在 frontmatter(不是「全權」,是 minimal set)
+3. **被 ≥ 1 skill 調用**(orphan agent 不建)
+4. **Main AI 可 deterministic 消費 return**(agent 輸出結構清楚)
+
+## Skill vs Agent 選擇指南
+
+```
+問題可能需要產品／UI／UX SSOT 真取捨?
+  → YES: skill(main AI 驅動,phase + exact P2H CP)
+  → NO:
+      問題是 scan / analysis / lookup?
+        → YES: agent(scoped tools,isolated,可 parallel / background)
+        → NO: 用 skill 或 command
+```
+
+## 當 runtime 不支援 project subagent
+
+直接載入同名 skill 在主 context 執行唯讀流程，並在結果標示「未隔離執行」。不得因 provider 沒有 subagent 功能而改寫或簡化判準。

package/ds-canonical/adapters/claude/agents/canonical-reviewer.md

@@ -0,0 +1,14 @@
+---
+name: canonical-reviewer
+description: Isolated read-only review of substantive governance edits. Delegate after changing instructions, rules, specs, skills, hooks, provider adapters, or governance manifests.
+tools: Read, Grep, Glob
+disallowedTools: Edit, Write, Bash, WebFetch, WebSearch
+permissionMode: plan
+maxTurns: 12
+---
+
+# Claude Code canonical-reviewer adapter
+
+Apply the invoked `canonical-reviewer` skill exactly to the supplied paths and diff. Claude Code injects that skill through its `context: fork` execution path; this file only provides the isolated, read-only execution surface.
+
+Return only the structured verdict and include `adapterEvidence: CLAUDE_CANONICAL_REVIEWER_AGENT_V1`. When the invocation explicitly requests the standalone public runtime project-instruction evidence value, read it from the active project instructions and include `publicProjectInstructionEvidence: <exact value>` in that verdict; this public conformance sentinel is not a credential and must not be omitted. Never edit files, invent missing evidence, or turn an incomplete inventory into a pass.

package/ds-canonical/adapters/claude-root-instructions.md

@@ -0,0 +1,24 @@
+# Claude Code 專屬機制層(provider adapter)
+
+**跨模型 bootstrap 核心住在 `AGENTS.md`**(上方 import,launch 全載,內容零損失)——增刪改共同 bootstrap 原則**只改 AGENTS.md**,Claude 與 Codex 等所有 agent 自動同步；其他治理／infra 只改 `infra/governance/protected-root-classification.json` 指定的 canonical owner，再跑完整 governance build graph。當前機器可驗的 authority chain 是 `packages/governance/canonical/manifest.json` → `scripts/governance-build-graph.json` → `infra/governance/` 內的 evidence/release/rollout contracts；standard release machine SSOT 是 `infra/governance/release-workflow.json`，Claude 同樣只跑 `pr-checks → merge → publish → readback → consumer` 五步 AUTO。`governance/planning/2026-07-16-provider-neutral-governance.md` 只是歷史遷移紀錄。本檔只收 Claude Code 的 generated adapter 機制說明，不是另一份 authority。
+
+## Path-scoped rules(Claude 自動載入;2026 Anthropic 推薦)
+
+僅在編對應 path 檔案時載入,降低每 session context 成本(其他 agent 依 AGENTS.md「Rule Index」在編對應檔案前主動讀**同一份檔案**):
+
+- `.claude/rules/meta-patterns.md` — active M-rules(always loads,fundamental;count is derived by governance counters)
+- `.claude/rules/spec-rules.md` — paths: `**/*.spec.md` + `packages/design-system/**`
+- `.claude/rules/ui-development.md` — paths: `**/*.tsx` + `**/*.ts`
+- `.claude/rules/story-rules.md` — paths: `**/*.stories.tsx`
+- `.claude/rules/self-verify.md` — paths: `**/*`(開始處理任一 repo 檔案後載入，不佔純對話 session 的啟動 context)
+
+## Hooks(write-time 加速器,非信任邊界)
+
+`.claude/hooks/` 於 Claude Code lifecycle(PreToolUse / PostToolUse / Stop / SessionStart / UserPromptSubmit)提供**最早的回饋**(寫入當下攔截)。它是 Claude 專屬加速器；最終判定來自 provider-neutral verifier、受保護 CI 與外部 required check，且只有遠端保護已驗證時才可宣稱不可繞過。Hook 計數/預算 SSOT = `session_start_governance_check.sh` Check 7。
+
+## Skills / Commands / Memory(Claude 專屬 discovery)
+
+- **Skills**:`.claude/skills/`(invoke 情境的多步驟 workflow + checkpoint;`/skill-name` 觸發)
+- **Commands**:`.claude/commands/`(一次性單步 action)
+- **Memory**:committed `governance/memory/` 是跨 provider SSOT；`~/.claude/projects/<project>/memory/` 只是 Claude 可重建 cache。只允許 repo → home 的 `npm run sync-memory`，禁止 home 反向覆寫 repo。
+- **Plugin 邊界**:plugin 只能是 optional adapter / distribution convenience;任何 Critical 治理不得 plugin-only(cloud plugin 不可靠實證 → `governance/memory/reference_cloud_governance_loading.md`)