design-system-inventory-figma

design-system-inventory-figma — 统一提取 Token、组件和样式

一次 use_figma 调用即可遍历整个文件并返回结构化套件： Token（每个本地变量，按集合和模式分组）、组件（独立组件 + 组件集，包含属性定义以及每个变体的精简 visualSpec）和 样式（包含已解析值的填充、文本和效果样式）。这是用于代码生成和库审计的“一次读取全部内容”入口。

技能边界

• use_figma 规则 — 首先加载官方 figma-use 技能；它是完整的 Figma Plugin API 参考。这些脚本依赖的要点：使用纯 JS，并在顶层使用 await + return（不使用 IIFE，也不使用 figma.closePlugin()；console.log 不会作为返回值）；在每个脚本顶部将输入内联为 const；颜色范围为 0–1；执行任何文本操作前先加载字体；使用 await figma.getNodeByIdAsync(...)；以及原子错误（脚本失败时不会应用任何内容——读取错误、修复后重试）。
• 每个 visualSpec 的确切结构 → references/visual-spec.md。
• 单个组件的无限深度（完整树、交互响应、实例引用）→ 使用 deep-component-figma。将单个变体集作为 CSS 状态机 → 使用 analyze-component-set-figma。磁盘上的 Token 文件 → 使用 export-tokens-figma。
• 这是原生 MCP 不具备的全局设计系统能力：get_design_context 仅适用于单个选区，get_metadata 返回扁平结构，两者在任何套餐下都无法提供统一的 Token + 组件 + 样式套件。

工作流

1. 选择范围和详细程度，以控制大型文件的响应大小。编辑 scripts/inventory.js 中的常量：
   • INCLUDE — 可选值为 "tokens"、"components"、"styles"（默认：全部）。
   • VERBOSITY — "full"（包含每个变体的视觉规格）、"summary"（组件元数据 + 属性，不含每个变体的规格），或 "inventory"（仅包含名称/ID/数量，适用于超大型文件）。
   • COMPONENT_NAME_FILTER — 用于筛选组件的子字符串（例如 "Button"）。
2. 运行 use_figma（skillNames: "design-system-inventory-figma"）。通过 Plugin API 读取变量，因此适用于所有 Figma 套餐（不需要 Enterprise REST）。
3. 使用结果。 使用 tokens 获取颜色/间距/排版值，使用 components[].properties 获取组件 API，使用 components[].variants[].visualSpec 获取各状态的外观，并使用 styles 获取任何基于样式（非变量）的值。
4. 如果结果仍然很大，请降低 VERBOSITY 或缩小 INCLUDE / COMPONENT_NAME_FILTER 的范围，然后重新运行——不要尝试对大型 full 转储进行分页。

说明

• 颜色以十六进制形式输出（Figma 内部以 0–1 RGBA 格式存储）；间距/尺寸值的单位为 px。
• 变量会尽可能将别名解析为 Token 名称（例如 {Color.Brand.Primary}）。
• 每个变体的视觉规格来自各变体组件节点——字段详情（填充、描边、效果、cornerRadius、不透明度、布局/内边距/间距、排版）请参阅 references/visual-spec.md。
• 该脚本是内置 figma_get_design_system_kit 工具的手动编码版本，涵盖根节点和第一层；它采用原生 use_figma 写法，因此无需 Desktop Bridge 即可运行。它会捕获每个组件/变体的根视觉规格以及其直接子节点（childSpecs）；不会递归更深层级。