@design-ai/cli 4.55.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (529) hide show
  1. package/.claude-plugin/plugin.json +164 -0
  2. package/AGENTS.ko.md +126 -0
  3. package/AGENTS.md +182 -0
  4. package/CHANGELOG.md +6883 -0
  5. package/CLAUDE.md +39 -0
  6. package/LICENSE +21 -0
  7. package/README.ko.md +245 -0
  8. package/README.md +277 -0
  9. package/agents/README.md +14 -0
  10. package/agents/a11y-reviewer.md +121 -0
  11. package/agents/component-architect.md +57 -0
  12. package/agents/design-critic.md +46 -0
  13. package/agents/token-extractor.md +63 -0
  14. package/cli/bin/design-ai-mcp.mjs +6 -0
  15. package/cli/bin/design-ai.mjs +40 -0
  16. package/cli/commands/audit.mjs +111 -0
  17. package/cli/commands/check.mjs +226 -0
  18. package/cli/commands/doctor.mjs +141 -0
  19. package/cli/commands/examples.mjs +58 -0
  20. package/cli/commands/help.mjs +271 -0
  21. package/cli/commands/install.mjs +161 -0
  22. package/cli/commands/learn.mjs +1871 -0
  23. package/cli/commands/list.mjs +143 -0
  24. package/cli/commands/mcp.mjs +27 -0
  25. package/cli/commands/pack.mjs +211 -0
  26. package/cli/commands/prompt.mjs +199 -0
  27. package/cli/commands/route.mjs +247 -0
  28. package/cli/commands/search.mjs +60 -0
  29. package/cli/commands/show.mjs +52 -0
  30. package/cli/commands/site.mjs +558 -0
  31. package/cli/commands/status.mjs +161 -0
  32. package/cli/commands/uninstall.mjs +119 -0
  33. package/cli/commands/update.mjs +184 -0
  34. package/cli/commands/version.mjs +94 -0
  35. package/cli/commands/workspace.mjs +176 -0
  36. package/cli/lib/brief.mjs +52 -0
  37. package/cli/lib/check.mjs +642 -0
  38. package/cli/lib/dispatch.mjs +109 -0
  39. package/cli/lib/doctor.mjs +505 -0
  40. package/cli/lib/examples.mjs +258 -0
  41. package/cli/lib/exec.mjs +63 -0
  42. package/cli/lib/help-flags.mjs +5 -0
  43. package/cli/lib/learn.mjs +3694 -0
  44. package/cli/lib/log.mjs +47 -0
  45. package/cli/lib/mcp-server.mjs +426 -0
  46. package/cli/lib/output.mjs +101 -0
  47. package/cli/lib/pack.mjs +599 -0
  48. package/cli/lib/paths.mjs +63 -0
  49. package/cli/lib/prompt.mjs +603 -0
  50. package/cli/lib/route.mjs +740 -0
  51. package/cli/lib/search.mjs +158 -0
  52. package/cli/lib/show.mjs +161 -0
  53. package/cli/lib/signals.mjs +2337 -0
  54. package/cli/lib/site.mjs +6617 -0
  55. package/cli/lib/skill-proposals.mjs +2046 -0
  56. package/cli/lib/suggest.mjs +66 -0
  57. package/cli/lib/workspace.mjs +1056 -0
  58. package/commands/README.md +25 -0
  59. package/commands/component-spec.md +34 -0
  60. package/commands/conversational.md +44 -0
  61. package/commands/design-from-brief.md +141 -0
  62. package/commands/design-review.md +62 -0
  63. package/commands/document-from-brief.md +47 -0
  64. package/commands/extract-tokens.md +38 -0
  65. package/commands/game-ui.md +40 -0
  66. package/commands/illustration.md +37 -0
  67. package/commands/iterate.md +167 -0
  68. package/commands/motion-design.md +54 -0
  69. package/commands/palette-from-brand.md +50 -0
  70. package/commands/print.md +49 -0
  71. package/commands/slide-deck.md +46 -0
  72. package/commands/spatial.md +47 -0
  73. package/commands/stability-review.md +74 -0
  74. package/commands/video.md +42 -0
  75. package/commands/website-improvement.md +77 -0
  76. package/docs/AGENT-DEVELOPMENT.md +658 -0
  77. package/docs/AI-LEARNING.md +429 -0
  78. package/docs/AIDER-INTEGRATION.md +224 -0
  79. package/docs/ARCHITECTURE.ko.md +183 -0
  80. package/docs/ARCHITECTURE.md +105 -0
  81. package/docs/CODEX-INTEGRATION.md +311 -0
  82. package/docs/COMPANY-WEBSITE-DOGFOOD.ko.md +144 -0
  83. package/docs/COMPANY-WEBSITE-DOGFOOD.md +150 -0
  84. package/docs/COMPANY-WEBSITE-INTAKE-TEMPLATE.ko.md +153 -0
  85. package/docs/COMPANY-WEBSITE-INTAKE-TEMPLATE.md +154 -0
  86. package/docs/CONTRIBUTING.ko.md +203 -0
  87. package/docs/CONTRIBUTING.md +242 -0
  88. package/docs/CURSOR-INTEGRATION.md +220 -0
  89. package/docs/DISTRIBUTION.ko.md +248 -0
  90. package/docs/DISTRIBUTION.md +253 -0
  91. package/docs/DOGFOOD-FINDINGS.md +180 -0
  92. package/docs/DOGFOOD-V4-FINDINGS.md +139 -0
  93. package/docs/DOGFOOD-V4-MKDOCS-FINDINGS.md +233 -0
  94. package/docs/DOGFOOD-V4-NPM-FINDINGS.md +157 -0
  95. package/docs/DOGFOOD-V4-VSCODE-FINDINGS.md +135 -0
  96. package/docs/FIGMA-INTEGRATION.md +222 -0
  97. package/docs/MCP-INTEGRATION.md +243 -0
  98. package/docs/MIGRATION-v4.md +121 -0
  99. package/docs/PLUGIN-PACKAGING.md +240 -0
  100. package/docs/PRODUCT-READINESS.md +66 -0
  101. package/docs/QUICKSTART.ko.md +178 -0
  102. package/docs/QUICKSTART.md +179 -0
  103. package/docs/RELEASE-CHECKLIST.md +292 -0
  104. package/docs/ROADMAP.md +19495 -0
  105. package/docs/SESSION-LOG.md +940 -0
  106. package/docs/TOKEN-SYNC.md +237 -0
  107. package/docs/USING.ko.md +206 -0
  108. package/docs/USING.md +218 -0
  109. package/docs/WEBSITE-IMPROVEMENT.ko.md +75 -0
  110. package/docs/WEBSITE-IMPROVEMENT.md +89 -0
  111. package/docs/announcements/README.md +56 -0
  112. package/docs/announcements/dev-to-korea.md +206 -0
  113. package/docs/announcements/hashnode-post.ko.md +232 -0
  114. package/docs/announcements/okky-post.ko.md +158 -0
  115. package/docs/announcements/press-kit.md +101 -0
  116. package/docs/announcements/reddit-r-korea.md +196 -0
  117. package/docs/announcements/show-hn.md +114 -0
  118. package/docs/announcements/twitter-thread.md +255 -0
  119. package/docs/external-status.md +34 -0
  120. package/docs/integrations/aider-walkthrough.ko.md +275 -0
  121. package/docs/integrations/aider-walkthrough.md +274 -0
  122. package/docs/integrations/codex-walkthrough.ko.md +297 -0
  123. package/docs/integrations/codex-walkthrough.md +297 -0
  124. package/docs/integrations/cursor-walkthrough.ko.md +281 -0
  125. package/docs/integrations/cursor-walkthrough.md +284 -0
  126. package/docs/integrations/design-ai-mcp-server.md +169 -0
  127. package/docs/integrations/figma-mcp.md +149 -0
  128. package/docs/integrations/github-mcp.md +178 -0
  129. package/docs/integrations/linear-mcp.md +215 -0
  130. package/docs/integrations/notion-mcp.md +174 -0
  131. package/docs/integrations/sdk-walkthrough.ko.md +375 -0
  132. package/docs/integrations/sdk-walkthrough.md +375 -0
  133. package/docs/integrations/slack-mcp.md +208 -0
  134. package/docs/integrations/vscode-walkthrough.ko.md +202 -0
  135. package/docs/integrations/vscode-walkthrough.md +205 -0
  136. package/docs/requirements.txt +16 -0
  137. package/docs/site-overrides/extra.css +83 -0
  138. package/docs/site-overrides/favicon.svg +4 -0
  139. package/docs/site-overrides/logo.svg +10 -0
  140. package/docs/site-overrides/main.html +18 -0
  141. package/docs/website-console/app.js +2540 -0
  142. package/docs/website-console/index.html +24 -0
  143. package/docs/website-console/styles.css +975 -0
  144. package/examples/README.md +252 -0
  145. package/examples/cases/dogfood-v4-korean-hr-onboarding.md +356 -0
  146. package/examples/component-accordion-actions.md +153 -0
  147. package/examples/component-accordion-details.md +147 -0
  148. package/examples/component-accordion-summary.md +180 -0
  149. package/examples/component-accordion.md +229 -0
  150. package/examples/component-account-card.md +284 -0
  151. package/examples/component-address-input.md +260 -0
  152. package/examples/component-affix.md +190 -0
  153. package/examples/component-alert-dialog.md +210 -0
  154. package/examples/component-alert-title.md +77 -0
  155. package/examples/component-alert.md +192 -0
  156. package/examples/component-amount-input.md +278 -0
  157. package/examples/component-anchor.md +198 -0
  158. package/examples/component-app-bar.md +249 -0
  159. package/examples/component-aspect-ratio.md +156 -0
  160. package/examples/component-auto-complete.md +199 -0
  161. package/examples/component-avatar-group.md +170 -0
  162. package/examples/component-avatar.md +191 -0
  163. package/examples/component-back-top.md +123 -0
  164. package/examples/component-backdrop.md +148 -0
  165. package/examples/component-badge.md +181 -0
  166. package/examples/component-banner.md +237 -0
  167. package/examples/component-biometric-gate.md +281 -0
  168. package/examples/component-blockquote.md +153 -0
  169. package/examples/component-border-beam.md +207 -0
  170. package/examples/component-bottom-navigation.md +226 -0
  171. package/examples/component-box.md +112 -0
  172. package/examples/component-breadcrumb.md +222 -0
  173. package/examples/component-button-base.md +190 -0
  174. package/examples/component-button-group.md +117 -0
  175. package/examples/component-button.md +213 -0
  176. package/examples/component-calendar.md +280 -0
  177. package/examples/component-callout.md +131 -0
  178. package/examples/component-card-actions.md +101 -0
  179. package/examples/component-card-content.md +90 -0
  180. package/examples/component-card-header.md +122 -0
  181. package/examples/component-card-media.md +79 -0
  182. package/examples/component-card.md +233 -0
  183. package/examples/component-carousel.md +266 -0
  184. package/examples/component-cascader.md +135 -0
  185. package/examples/component-category-picker.md +271 -0
  186. package/examples/component-chart.md +237 -0
  187. package/examples/component-chat-interface.md +399 -0
  188. package/examples/component-checkbox.md +149 -0
  189. package/examples/component-click-away-listener.md +87 -0
  190. package/examples/component-code.md +213 -0
  191. package/examples/component-collapsible.md +219 -0
  192. package/examples/component-color-picker.md +110 -0
  193. package/examples/component-combobox.md +267 -0
  194. package/examples/component-command.md +299 -0
  195. package/examples/component-config-provider.md +190 -0
  196. package/examples/component-context-menu.md +179 -0
  197. package/examples/component-css-baseline.md +148 -0
  198. package/examples/component-date-picker.md +249 -0
  199. package/examples/component-descriptions.md +242 -0
  200. package/examples/component-dialog-actions.md +111 -0
  201. package/examples/component-dialog-content-text.md +76 -0
  202. package/examples/component-dialog-content.md +105 -0
  203. package/examples/component-dialog-title.md +104 -0
  204. package/examples/component-dialog.md +176 -0
  205. package/examples/component-divider.md +182 -0
  206. package/examples/component-doc-page.md +217 -0
  207. package/examples/component-drawer.md +257 -0
  208. package/examples/component-dropdown.md +220 -0
  209. package/examples/component-email-layout.md +253 -0
  210. package/examples/component-empty-state.md +269 -0
  211. package/examples/component-empty.md +172 -0
  212. package/examples/component-fade.md +87 -0
  213. package/examples/component-feature-grid.md +201 -0
  214. package/examples/component-field.md +266 -0
  215. package/examples/component-filled-input.md +114 -0
  216. package/examples/component-flex.md +117 -0
  217. package/examples/component-float-button.md +214 -0
  218. package/examples/component-form-control-label.md +134 -0
  219. package/examples/component-form-control.md +113 -0
  220. package/examples/component-form-controls.md +251 -0
  221. package/examples/component-form-group.md +86 -0
  222. package/examples/component-form-helper-text.md +95 -0
  223. package/examples/component-form-label.md +98 -0
  224. package/examples/component-form.md +291 -0
  225. package/examples/component-game-hud.md +362 -0
  226. package/examples/component-game-menu.md +327 -0
  227. package/examples/component-grid.md +140 -0
  228. package/examples/component-grow.md +79 -0
  229. package/examples/component-hero-block.md +252 -0
  230. package/examples/component-hover-card.md +211 -0
  231. package/examples/component-icon-button.md +142 -0
  232. package/examples/component-icon.md +102 -0
  233. package/examples/component-illustration.md +280 -0
  234. package/examples/component-image-list.md +107 -0
  235. package/examples/component-image.md +282 -0
  236. package/examples/component-input-adornment.md +101 -0
  237. package/examples/component-input-base.md +134 -0
  238. package/examples/component-input-number.md +141 -0
  239. package/examples/component-input-otp.md +271 -0
  240. package/examples/component-input.md +213 -0
  241. package/examples/component-item.md +243 -0
  242. package/examples/component-kbd.md +197 -0
  243. package/examples/component-krw-amount.md +219 -0
  244. package/examples/component-label.md +118 -0
  245. package/examples/component-layout.md +217 -0
  246. package/examples/component-link.md +223 -0
  247. package/examples/component-list-item-avatar.md +72 -0
  248. package/examples/component-list-item-button.md +139 -0
  249. package/examples/component-list-item-icon.md +82 -0
  250. package/examples/component-list-item-text.md +98 -0
  251. package/examples/component-list-item.md +116 -0
  252. package/examples/component-list-subheader.md +70 -0
  253. package/examples/component-list.md +198 -0
  254. package/examples/component-loading-button.md +125 -0
  255. package/examples/component-loading-sequence.md +254 -0
  256. package/examples/component-lottie-player.md +279 -0
  257. package/examples/component-masonry.md +191 -0
  258. package/examples/component-mentions.md +189 -0
  259. package/examples/component-menu-item.md +102 -0
  260. package/examples/component-menu-list.md +98 -0
  261. package/examples/component-menu.md +139 -0
  262. package/examples/component-menubar.md +259 -0
  263. package/examples/component-message.md +162 -0
  264. package/examples/component-mobile-stepper.md +155 -0
  265. package/examples/component-modal.md +220 -0
  266. package/examples/component-navigation-menu.md +295 -0
  267. package/examples/component-notification.md +166 -0
  268. package/examples/component-otp-countdown.md +245 -0
  269. package/examples/component-outlined-input.md +145 -0
  270. package/examples/component-page-transition.md +281 -0
  271. package/examples/component-pagination.md +226 -0
  272. package/examples/component-paper.md +199 -0
  273. package/examples/component-pass-auth.md +265 -0
  274. package/examples/component-payment-brand-button.md +253 -0
  275. package/examples/component-payment-method-selector.md +272 -0
  276. package/examples/component-payment-receipt.md +277 -0
  277. package/examples/component-popconfirm.md +144 -0
  278. package/examples/component-popover.md +239 -0
  279. package/examples/component-popper.md +129 -0
  280. package/examples/component-pricing-cards.md +247 -0
  281. package/examples/component-progress.md +195 -0
  282. package/examples/component-qr-code.md +201 -0
  283. package/examples/component-radio.md +167 -0
  284. package/examples/component-rate.md +202 -0
  285. package/examples/component-resizable.md +163 -0
  286. package/examples/component-result.md +270 -0
  287. package/examples/component-scroll-area.md +199 -0
  288. package/examples/component-scroll-reveal.md +320 -0
  289. package/examples/component-segmented.md +178 -0
  290. package/examples/component-select.md +258 -0
  291. package/examples/component-separator.md +177 -0
  292. package/examples/component-sheet.md +277 -0
  293. package/examples/component-sidebar.md +257 -0
  294. package/examples/component-skeleton.md +178 -0
  295. package/examples/component-slide.md +89 -0
  296. package/examples/component-slider.md +208 -0
  297. package/examples/component-snackbar-content.md +92 -0
  298. package/examples/component-snackbar.md +121 -0
  299. package/examples/component-sonner.md +165 -0
  300. package/examples/component-space.md +125 -0
  301. package/examples/component-spatial-locomotion.md +373 -0
  302. package/examples/component-spatial-panel.md +330 -0
  303. package/examples/component-speed-dial-action.md +78 -0
  304. package/examples/component-speed-dial.md +177 -0
  305. package/examples/component-spin.md +173 -0
  306. package/examples/component-spinner.md +204 -0
  307. package/examples/component-splitter.md +210 -0
  308. package/examples/component-stack.md +130 -0
  309. package/examples/component-statistic.md +282 -0
  310. package/examples/component-step-button.md +157 -0
  311. package/examples/component-step-connector.md +157 -0
  312. package/examples/component-step-content.md +121 -0
  313. package/examples/component-step-icon.md +115 -0
  314. package/examples/component-step-label.md +101 -0
  315. package/examples/component-step.md +84 -0
  316. package/examples/component-steps.md +264 -0
  317. package/examples/component-stock-chart.md +251 -0
  318. package/examples/component-swipeable-drawer.md +149 -0
  319. package/examples/component-switch.md +99 -0
  320. package/examples/component-tab-scroll-button.md +180 -0
  321. package/examples/component-tab.md +120 -0
  322. package/examples/component-table-body.md +82 -0
  323. package/examples/component-table-cell.md +118 -0
  324. package/examples/component-table-container.md +75 -0
  325. package/examples/component-table-footer.md +72 -0
  326. package/examples/component-table-head.md +78 -0
  327. package/examples/component-table-pagination.md +137 -0
  328. package/examples/component-table-row.md +113 -0
  329. package/examples/component-table-sort-label.md +109 -0
  330. package/examples/component-table.md +202 -0
  331. package/examples/component-tabs.md +184 -0
  332. package/examples/component-tag-badge.md +309 -0
  333. package/examples/component-tag.md +102 -0
  334. package/examples/component-testimonial-carousel.md +218 -0
  335. package/examples/component-textarea-autosize.md +114 -0
  336. package/examples/component-textarea.md +173 -0
  337. package/examples/component-time-picker.md +205 -0
  338. package/examples/component-timeline.md +170 -0
  339. package/examples/component-toast.md +224 -0
  340. package/examples/component-toggle-button.md +129 -0
  341. package/examples/component-toggle.md +220 -0
  342. package/examples/component-toolbar.md +104 -0
  343. package/examples/component-tooltip.md +178 -0
  344. package/examples/component-tour.md +176 -0
  345. package/examples/component-transaction-list-item.md +243 -0
  346. package/examples/component-transfer.md +156 -0
  347. package/examples/component-tree-select.md +202 -0
  348. package/examples/component-tree.md +297 -0
  349. package/examples/component-typography.md +215 -0
  350. package/examples/component-upload.md +295 -0
  351. package/examples/component-video-hero.md +409 -0
  352. package/examples/component-video-player.md +340 -0
  353. package/examples/component-voice-input.md +408 -0
  354. package/examples/component-watermark.md +217 -0
  355. package/examples/component-zoom.md +92 -0
  356. package/examples/doc-explanation-example.md +196 -0
  357. package/examples/doc-how-to-example.md +205 -0
  358. package/examples/doc-tutorial-example.md +162 -0
  359. package/examples/dogfood-korean-fintech-system.md +433 -0
  360. package/examples/email-transactional-example.md +259 -0
  361. package/examples/palette-saas-violet.md +235 -0
  362. package/examples/print-business-card-spec.md +205 -0
  363. package/examples/print-packaging-spec.md +285 -0
  364. package/examples/report-example.md +228 -0
  365. package/examples/slide-deck-example.md +237 -0
  366. package/examples/website-improvement-report.md +128 -0
  367. package/examples/website-improvement-workspace.json +126 -0
  368. package/install.sh +189 -0
  369. package/knowledge/COVERAGE.md +740 -0
  370. package/knowledge/PRINCIPLES.md +108 -0
  371. package/knowledge/a11y/contrast.md +70 -0
  372. package/knowledge/a11y/keyboard-and-focus.md +108 -0
  373. package/knowledge/colors/color-theory.md +90 -0
  374. package/knowledge/colors/mui-palette-structure.md +105 -0
  375. package/knowledge/colors/palettes-by-product-type.md +876 -0
  376. package/knowledge/components/INDEX.md +231 -0
  377. package/knowledge/components/index.json +1470 -0
  378. package/knowledge/components/shadcn-registry.md +159 -0
  379. package/knowledge/conversational/ai-chat-interfaces.md +323 -0
  380. package/knowledge/conversational/chatbot-design.md +312 -0
  381. package/knowledge/conversational/conversational-ui-fundamentals.md +299 -0
  382. package/knowledge/conversational/korean-voice-conventions.md +281 -0
  383. package/knowledge/conversational/voice-ui-patterns.md +297 -0
  384. package/knowledge/design-tokens/ant-design.md +124 -0
  385. package/knowledge/design-tokens/material-3.md +235 -0
  386. package/knowledge/design-tokens/polaris-and-carbon.md +231 -0
  387. package/knowledge/design-tokens/tailwind-v4.md +284 -0
  388. package/knowledge/game-ui/game-accessibility.md +317 -0
  389. package/knowledge/game-ui/game-ui-fundamentals.md +281 -0
  390. package/knowledge/game-ui/hud-design.md +324 -0
  391. package/knowledge/game-ui/korean-gaming-conventions.md +312 -0
  392. package/knowledge/game-ui/menu-systems.md +388 -0
  393. package/knowledge/i18n/korean-app-store-visual.md +223 -0
  394. package/knowledge/i18n/korean-document-style.md +301 -0
  395. package/knowledge/i18n/korean-payments.md +211 -0
  396. package/knowledge/i18n/korean-product-conventions.md +96 -0
  397. package/knowledge/i18n/korean-publishing.md +139 -0
  398. package/knowledge/i18n/korean-typography.md +123 -0
  399. package/knowledge/icons/curated-sets.md +225 -0
  400. package/knowledge/illustration/hero-illustrations.md +234 -0
  401. package/knowledge/illustration/illustration-systems.md +221 -0
  402. package/knowledge/illustration/mascot-design.md +208 -0
  403. package/knowledge/illustration/spot-illustrations.md +246 -0
  404. package/knowledge/illustration/svg-optimization.md +308 -0
  405. package/knowledge/layout/spacing-and-grid.md +119 -0
  406. package/knowledge/motion/app-loading-sequences.md +277 -0
  407. package/knowledge/motion/choreography-depth.md +297 -0
  408. package/knowledge/motion/marketing-motion.md +223 -0
  409. package/knowledge/motion/micro-interactions.md +266 -0
  410. package/knowledge/motion/motion-tools.md +281 -0
  411. package/knowledge/motion/principles.md +126 -0
  412. package/knowledge/patterns/auth-flow-design.md +316 -0
  413. package/knowledge/patterns/b2b-onboarding-flows.md +182 -0
  414. package/knowledge/patterns/brand-identity.md +238 -0
  415. package/knowledge/patterns/brand-references.md +97 -0
  416. package/knowledge/patterns/chart-color-encoding.md +269 -0
  417. package/knowledge/patterns/chart-types.md +344 -0
  418. package/knowledge/patterns/dashboard-composition.md +299 -0
  419. package/knowledge/patterns/design-system-qa.md +356 -0
  420. package/knowledge/patterns/document-typography.md +248 -0
  421. package/knowledge/patterns/email-design.md +338 -0
  422. package/knowledge/patterns/empty-states.md +263 -0
  423. package/knowledge/patterns/error-states.md +318 -0
  424. package/knowledge/patterns/form-design.md +237 -0
  425. package/knowledge/patterns/information-architecture.md +341 -0
  426. package/knowledge/patterns/landing-hero-design.md +283 -0
  427. package/knowledge/patterns/landing-page-patterns.md +681 -0
  428. package/knowledge/patterns/list-and-feed.md +371 -0
  429. package/knowledge/patterns/mobile-navigation.md +278 -0
  430. package/knowledge/patterns/money-and-amount.md +301 -0
  431. package/knowledge/patterns/onboarding.md +300 -0
  432. package/knowledge/patterns/pricing-page-design.md +261 -0
  433. package/knowledge/patterns/realtime-data.md +280 -0
  434. package/knowledge/patterns/report-design.md +330 -0
  435. package/knowledge/patterns/search-ux.md +373 -0
  436. package/knowledge/patterns/settings-page.md +325 -0
  437. package/knowledge/patterns/slide-deck-design.md +316 -0
  438. package/knowledge/patterns/styles-catalog.md +2599 -0
  439. package/knowledge/patterns/technical-writing.md +306 -0
  440. package/knowledge/patterns/ui-reasoning.md +1853 -0
  441. package/knowledge/patterns/ux-guidelines.md +1454 -0
  442. package/knowledge/platforms/react-native.md +395 -0
  443. package/knowledge/print/brochures-and-flyers.md +276 -0
  444. package/knowledge/print/korean-print-conventions.md +284 -0
  445. package/knowledge/print/packaging.md +321 -0
  446. package/knowledge/print/print-fundamentals.md +238 -0
  447. package/knowledge/print/signage-and-posters.md +235 -0
  448. package/knowledge/print/stationery.md +262 -0
  449. package/knowledge/spatial/ar-patterns.md +253 -0
  450. package/knowledge/spatial/comfort-and-accessibility.md +245 -0
  451. package/knowledge/spatial/spatial-design-fundamentals.md +346 -0
  452. package/knowledge/spatial/spatial-ui-elements.md +343 -0
  453. package/knowledge/spatial/vr-patterns.md +302 -0
  454. package/knowledge/typography/font-pairings.md +332 -0
  455. package/knowledge/typography/mui-type-scale.md +57 -0
  456. package/knowledge/typography/type-scale-fundamentals.md +105 -0
  457. package/knowledge/video/in-product-video.md +277 -0
  458. package/knowledge/video/korean-video-conventions.md +247 -0
  459. package/knowledge/video/marketing-video.md +258 -0
  460. package/knowledge/video/social-and-short-form.md +257 -0
  461. package/knowledge/video/video-fundamentals.md +296 -0
  462. package/package.json +106 -0
  463. package/skills/README.md +39 -0
  464. package/skills/color-palette/PLAYBOOK.md +175 -0
  465. package/skills/color-palette/SKILL.md +6 -0
  466. package/skills/color-palette/TEMPLATE.md +103 -0
  467. package/skills/component-spec-writer/PLAYBOOK.md +169 -0
  468. package/skills/component-spec-writer/SKILL.md +6 -0
  469. package/skills/component-spec-writer/TEMPLATE.md +115 -0
  470. package/skills/conversational-ui-designer/PLAYBOOK.md +231 -0
  471. package/skills/conversational-ui-designer/SKILL.md +6 -0
  472. package/skills/design-broadcast/PLAYBOOK.md +146 -0
  473. package/skills/design-broadcast/SKILL.md +6 -0
  474. package/skills/design-critique/PLAYBOOK.md +137 -0
  475. package/skills/design-critique/SKILL.md +6 -0
  476. package/skills/design-pr-review/PLAYBOOK.md +171 -0
  477. package/skills/design-pr-review/SKILL.md +6 -0
  478. package/skills/design-system-builder/PLAYBOOK.md +218 -0
  479. package/skills/design-system-builder/SKILL.md +6 -0
  480. package/skills/design-system-qa/PLAYBOOK.md +163 -0
  481. package/skills/design-system-qa/SKILL.md +6 -0
  482. package/skills/document-author/PLAYBOOK.md +167 -0
  483. package/skills/document-author/SKILL.md +6 -0
  484. package/skills/figma-token-sync/PLAYBOOK.md +149 -0
  485. package/skills/figma-token-sync/SKILL.md +6 -0
  486. package/skills/game-ui-designer/PLAYBOOK.md +209 -0
  487. package/skills/game-ui-designer/SKILL.md +6 -0
  488. package/skills/handoff-spec/PLAYBOOK.md +170 -0
  489. package/skills/handoff-spec/SKILL.md +6 -0
  490. package/skills/illustration-designer/PLAYBOOK.md +166 -0
  491. package/skills/illustration-designer/SKILL.md +6 -0
  492. package/skills/motion-designer/PLAYBOOK.md +223 -0
  493. package/skills/motion-designer/SKILL.md +6 -0
  494. package/skills/print-designer/PLAYBOOK.md +209 -0
  495. package/skills/print-designer/SKILL.md +6 -0
  496. package/skills/slide-deck-author/PLAYBOOK.md +198 -0
  497. package/skills/slide-deck-author/SKILL.md +6 -0
  498. package/skills/spatial-designer/PLAYBOOK.md +238 -0
  499. package/skills/spatial-designer/SKILL.md +6 -0
  500. package/skills/ux-audit/PLAYBOOK.md +142 -0
  501. package/skills/ux-audit/SKILL.md +6 -0
  502. package/skills/video-designer/PLAYBOOK.md +240 -0
  503. package/skills/video-designer/SKILL.md +6 -0
  504. package/skills/website-improvement/PLAYBOOK.md +118 -0
  505. package/skills/website-improvement/SKILL.md +6 -0
  506. package/skills/website-improvement/TEMPLATE.md +103 -0
  507. package/tools/audit/changelog-generate.py +176 -0
  508. package/tools/audit/check-coverage.py +483 -0
  509. package/tools/audit/doctor_assertions.py +256 -0
  510. package/tools/audit/example-qa.py +108 -0
  511. package/tools/audit/frontmatter-check.py +199 -0
  512. package/tools/audit/integration-check.py +95 -0
  513. package/tools/audit/korean-copy-check.py +161 -0
  514. package/tools/audit/link-check.py +146 -0
  515. package/tools/audit/local-ci.py +558 -0
  516. package/tools/audit/package-contents.py +723 -0
  517. package/tools/audit/package-smoke.py +22443 -0
  518. package/tools/audit/raw-hex-check.py +252 -0
  519. package/tools/audit/registry-smoke.py +8188 -0
  520. package/tools/audit/release-metadata.py +9832 -0
  521. package/tools/audit/run-all.py +351 -0
  522. package/tools/audit/smoke_assertions.py +12742 -0
  523. package/tools/audit/stability-review.py +332 -0
  524. package/tools/audit/stale-check.py +156 -0
  525. package/tools/migrations/add-version-frontmatter.py +132 -0
  526. package/tools/migrations/bump-last-updated.py +131 -0
  527. package/tools/migrations/promote-stability.py +172 -0
  528. package/tools/preview/README.md +58 -0
  529. package/tools/preview/render-tokens.py +454 -0
@@ -0,0 +1,740 @@
1
+ <!-- generated by tools/audit/check-coverage.py — do not hand-edit -->
2
+ ---
3
+ title: Design-AI coverage report
4
+ generated_at: 2026-05-29
5
+ ---
6
+
7
+ # Coverage report
8
+
9
+ > Regenerated by `python3 tools/audit/check-coverage.py`. Don't hand-edit.
10
+
11
+ ## Summary
12
+
13
+ | Layer | Count | Detail |
14
+ | --- | --- | --- |
15
+ | Knowledge files | 92 | 77 hand-written + 15 generated |
16
+ | Skills (PLAYBOOK + SKILL) | 20 | 20 with verification phase |
17
+ | Worked examples | 221 | |
18
+ | Extractors | 11 | |
19
+ | Canonical components | 200 | indexed across Ant / MUI / shadcn |
20
+ | Components with worked spec | 181 | **90.5% spec coverage** (16 via parent/alias specs) |
21
+
22
+ ## Knowledge by category
23
+
24
+ | Category | Files | Hand-written | Generated |
25
+ | --- | --- | --- | --- |
26
+ | `(root)` | 2 | 1 | 1 |
27
+ | `a11y` | 2 | 2 | 0 |
28
+ | `colors` | 3 | 1 | 2 |
29
+ | `components` | 2 | 0 | 2 |
30
+ | `conversational` | 5 | 5 | 0 |
31
+ | `design-tokens` | 4 | 3 | 1 |
32
+ | `game-ui` | 5 | 5 | 0 |
33
+ | `i18n` | 6 | 6 | 0 |
34
+ | `icons` | 1 | 0 | 1 |
35
+ | `illustration` | 5 | 5 | 0 |
36
+ | `layout` | 1 | 1 | 0 |
37
+ | `motion` | 6 | 6 | 0 |
38
+ | `patterns` | 30 | 24 | 6 |
39
+ | `platforms` | 1 | 1 | 0 |
40
+ | `print` | 6 | 6 | 0 |
41
+ | `spatial` | 5 | 5 | 0 |
42
+ | `typography` | 3 | 1 | 2 |
43
+ | `video` | 5 | 5 | 0 |
44
+
45
+ ### File details
46
+
47
+
48
+ #### (root)
49
+
50
+ | File | Lines | Type | Title |
51
+ | --- | --- | --- | --- |
52
+ | [knowledge/COVERAGE.md](../knowledge/COVERAGE.md) | 740 | generated | Coverage report |
53
+ | [knowledge/PRINCIPLES.md](../knowledge/PRINCIPLES.md) | 108 | hand-written | Design-AI principles |
54
+
55
+ #### a11y
56
+
57
+ | File | Lines | Type | Title |
58
+ | --- | --- | --- | --- |
59
+ | [knowledge/a11y/contrast.md](../knowledge/a11y/contrast.md) | 70 | hand-written | Contrast |
60
+ | [knowledge/a11y/keyboard-and-focus.md](../knowledge/a11y/keyboard-and-focus.md) | 108 | hand-written | Keyboard and focus |
61
+
62
+ #### colors
63
+
64
+ | File | Lines | Type | Title |
65
+ | --- | --- | --- | --- |
66
+ | [knowledge/colors/color-theory.md](../knowledge/colors/color-theory.md) | 90 | hand-written | Color theory for product UI |
67
+ | [knowledge/colors/mui-palette-structure.md](../knowledge/colors/mui-palette-structure.md) | 105 | generated | MUI palette structure |
68
+ | [knowledge/colors/palettes-by-product-type.md](../knowledge/colors/palettes-by-product-type.md) | 876 | generated | Curated palettes by product type |
69
+
70
+ #### components
71
+
72
+ | File | Lines | Type | Title |
73
+ | --- | --- | --- | --- |
74
+ | [knowledge/components/INDEX.md](../knowledge/components/INDEX.md) | 231 | generated | Component index |
75
+ | [knowledge/components/shadcn-registry.md](../knowledge/components/shadcn-registry.md) | 159 | generated | shadcn-ui registry catalog (new-york-v4) |
76
+
77
+ #### conversational
78
+
79
+ | File | Lines | Type | Title |
80
+ | --- | --- | --- | --- |
81
+ | [knowledge/conversational/ai-chat-interfaces.md](../knowledge/conversational/ai-chat-interfaces.md) | 323 | hand-written | AI chat interfaces |
82
+ | [knowledge/conversational/chatbot-design.md](../knowledge/conversational/chatbot-design.md) | 312 | hand-written | Chatbot design |
83
+ | [knowledge/conversational/conversational-ui-fundamentals.md](../knowledge/conversational/conversational-ui-fundamentals.md) | 299 | hand-written | Conversational UI fundamentals |
84
+ | [knowledge/conversational/korean-voice-conventions.md](../knowledge/conversational/korean-voice-conventions.md) | 281 | hand-written | Korean voice and conversational conventions |
85
+ | [knowledge/conversational/voice-ui-patterns.md](../knowledge/conversational/voice-ui-patterns.md) | 297 | hand-written | Voice UI patterns |
86
+
87
+ #### design-tokens
88
+
89
+ | File | Lines | Type | Title |
90
+ | --- | --- | --- | --- |
91
+ | [knowledge/design-tokens/ant-design.md](../knowledge/design-tokens/ant-design.md) | 124 | generated | Ant Design seed tokens |
92
+ | [knowledge/design-tokens/material-3.md](../knowledge/design-tokens/material-3.md) | 235 | hand-written | Material Design 3 (Material You) |
93
+ | [knowledge/design-tokens/polaris-and-carbon.md](../knowledge/design-tokens/polaris-and-carbon.md) | 231 | hand-written | Polaris and Carbon |
94
+ | [knowledge/design-tokens/tailwind-v4.md](../knowledge/design-tokens/tailwind-v4.md) | 284 | hand-written | Tailwind CSS v4 default theme |
95
+
96
+ #### game-ui
97
+
98
+ | File | Lines | Type | Title |
99
+ | --- | --- | --- | --- |
100
+ | [knowledge/game-ui/game-accessibility.md](../knowledge/game-ui/game-accessibility.md) | 317 | hand-written | Game accessibility |
101
+ | [knowledge/game-ui/game-ui-fundamentals.md](../knowledge/game-ui/game-ui-fundamentals.md) | 281 | hand-written | Game UI fundamentals |
102
+ | [knowledge/game-ui/hud-design.md](../knowledge/game-ui/hud-design.md) | 324 | hand-written | HUD design |
103
+ | [knowledge/game-ui/korean-gaming-conventions.md](../knowledge/game-ui/korean-gaming-conventions.md) | 312 | hand-written | Korean gaming conventions |
104
+ | [knowledge/game-ui/menu-systems.md](../knowledge/game-ui/menu-systems.md) | 388 | hand-written | Menu systems |
105
+
106
+ #### i18n
107
+
108
+ | File | Lines | Type | Title |
109
+ | --- | --- | --- | --- |
110
+ | [knowledge/i18n/korean-app-store-visual.md](../knowledge/i18n/korean-app-store-visual.md) | 223 | hand-written | Korean app store visual design |
111
+ | [knowledge/i18n/korean-document-style.md](../knowledge/i18n/korean-document-style.md) | 301 | hand-written | Korean document style |
112
+ | [knowledge/i18n/korean-payments.md](../knowledge/i18n/korean-payments.md) | 211 | hand-written | Korean payments |
113
+ | [knowledge/i18n/korean-product-conventions.md](../knowledge/i18n/korean-product-conventions.md) | 96 | hand-written | Korean product UX conventions |
114
+ | [knowledge/i18n/korean-publishing.md](../knowledge/i18n/korean-publishing.md) | 139 | hand-written | Korean app store & publishing requirements |
115
+ | [knowledge/i18n/korean-typography.md](../knowledge/i18n/korean-typography.md) | 123 | hand-written | Korean (Hangul) typography for product UI |
116
+
117
+ #### icons
118
+
119
+ | File | Lines | Type | Title |
120
+ | --- | --- | --- | --- |
121
+ | [knowledge/icons/curated-sets.md](../knowledge/icons/curated-sets.md) | 225 | generated | Curated icon sets |
122
+
123
+ #### illustration
124
+
125
+ | File | Lines | Type | Title |
126
+ | --- | --- | --- | --- |
127
+ | [knowledge/illustration/hero-illustrations.md](../knowledge/illustration/hero-illustrations.md) | 234 | hand-written | Hero illustrations |
128
+ | [knowledge/illustration/illustration-systems.md](../knowledge/illustration/illustration-systems.md) | 221 | hand-written | Illustration systems |
129
+ | [knowledge/illustration/mascot-design.md](../knowledge/illustration/mascot-design.md) | 208 | hand-written | Mascot design |
130
+ | [knowledge/illustration/spot-illustrations.md](../knowledge/illustration/spot-illustrations.md) | 246 | hand-written | Spot illustrations |
131
+ | [knowledge/illustration/svg-optimization.md](../knowledge/illustration/svg-optimization.md) | 308 | hand-written | SVG optimization |
132
+
133
+ #### layout
134
+
135
+ | File | Lines | Type | Title |
136
+ | --- | --- | --- | --- |
137
+ | [knowledge/layout/spacing-and-grid.md](../knowledge/layout/spacing-and-grid.md) | 119 | hand-written | Spacing, grid, and responsive layout |
138
+
139
+ #### motion
140
+
141
+ | File | Lines | Type | Title |
142
+ | --- | --- | --- | --- |
143
+ | [knowledge/motion/app-loading-sequences.md](../knowledge/motion/app-loading-sequences.md) | 277 | hand-written | App loading sequences |
144
+ | [knowledge/motion/choreography-depth.md](../knowledge/motion/choreography-depth.md) | 297 | hand-written | Motion choreography |
145
+ | [knowledge/motion/marketing-motion.md](../knowledge/motion/marketing-motion.md) | 223 | hand-written | Marketing motion |
146
+ | [knowledge/motion/micro-interactions.md](../knowledge/motion/micro-interactions.md) | 266 | hand-written | Micro-interactions |
147
+ | [knowledge/motion/motion-tools.md](../knowledge/motion/motion-tools.md) | 281 | hand-written | Motion tools comparison |
148
+ | [knowledge/motion/principles.md](../knowledge/motion/principles.md) | 126 | hand-written | Motion principles for product UI |
149
+
150
+ #### patterns
151
+
152
+ | File | Lines | Type | Title |
153
+ | --- | --- | --- | --- |
154
+ | [knowledge/patterns/auth-flow-design.md](../knowledge/patterns/auth-flow-design.md) | 316 | hand-written | Authentication flow design |
155
+ | [knowledge/patterns/b2b-onboarding-flows.md](../knowledge/patterns/b2b-onboarding-flows.md) | 182 | hand-written | B2B onboarding flows |
156
+ | [knowledge/patterns/brand-identity.md](../knowledge/patterns/brand-identity.md) | 238 | hand-written | Brand identity |
157
+ | [knowledge/patterns/brand-references.md](../knowledge/patterns/brand-references.md) | 97 | generated | Brand reference index |
158
+ | [knowledge/patterns/chart-color-encoding.md](../knowledge/patterns/chart-color-encoding.md) | 269 | hand-written | Chart color encoding |
159
+ | [knowledge/patterns/chart-types.md](../knowledge/patterns/chart-types.md) | 344 | generated | Chart type selection guide |
160
+ | [knowledge/patterns/dashboard-composition.md](../knowledge/patterns/dashboard-composition.md) | 299 | hand-written | Dashboard composition |
161
+ | [knowledge/patterns/design-system-qa.md](../knowledge/patterns/design-system-qa.md) | 356 | hand-written | Design system QA |
162
+ | [knowledge/patterns/document-typography.md](../knowledge/patterns/document-typography.md) | 248 | hand-written | Document typography |
163
+ | [knowledge/patterns/email-design.md](../knowledge/patterns/email-design.md) | 338 | hand-written | Email design |
164
+ | [knowledge/patterns/empty-states.md](../knowledge/patterns/empty-states.md) | 263 | hand-written | Empty states |
165
+ | [knowledge/patterns/error-states.md](../knowledge/patterns/error-states.md) | 318 | hand-written | Error states |
166
+ | [knowledge/patterns/form-design.md](../knowledge/patterns/form-design.md) | 237 | hand-written | Form design patterns |
167
+ | [knowledge/patterns/information-architecture.md](../knowledge/patterns/information-architecture.md) | 341 | hand-written | Information architecture |
168
+ | [knowledge/patterns/landing-hero-design.md](../knowledge/patterns/landing-hero-design.md) | 283 | hand-written | Landing hero design |
169
+ | [knowledge/patterns/landing-page-patterns.md](../knowledge/patterns/landing-page-patterns.md) | 681 | generated | Landing page patterns |
170
+ | [knowledge/patterns/list-and-feed.md](../knowledge/patterns/list-and-feed.md) | 371 | hand-written | List and feed patterns |
171
+ | [knowledge/patterns/mobile-navigation.md](../knowledge/patterns/mobile-navigation.md) | 278 | hand-written | Mobile navigation patterns |
172
+ | [knowledge/patterns/money-and-amount.md](../knowledge/patterns/money-and-amount.md) | 301 | hand-written | Money and amount |
173
+ | [knowledge/patterns/onboarding.md](../knowledge/patterns/onboarding.md) | 300 | hand-written | Onboarding patterns |
174
+ | [knowledge/patterns/pricing-page-design.md](../knowledge/patterns/pricing-page-design.md) | 261 | hand-written | Pricing page design |
175
+ | [knowledge/patterns/realtime-data.md](../knowledge/patterns/realtime-data.md) | 280 | hand-written | Real-time data UX |
176
+ | [knowledge/patterns/report-design.md](../knowledge/patterns/report-design.md) | 330 | hand-written | Report design |
177
+ | [knowledge/patterns/search-ux.md](../knowledge/patterns/search-ux.md) | 373 | hand-written | Search UX |
178
+ | [knowledge/patterns/settings-page.md](../knowledge/patterns/settings-page.md) | 325 | hand-written | Settings page patterns |
179
+ | [knowledge/patterns/slide-deck-design.md](../knowledge/patterns/slide-deck-design.md) | 316 | hand-written | Slide deck design |
180
+ | [knowledge/patterns/styles-catalog.md](../knowledge/patterns/styles-catalog.md) | 2599 | generated | Visual style catalog |
181
+ | [knowledge/patterns/technical-writing.md](../knowledge/patterns/technical-writing.md) | 306 | hand-written | Technical writing |
182
+ | [knowledge/patterns/ui-reasoning.md](../knowledge/patterns/ui-reasoning.md) | 1853 | generated | UI category decision rules |
183
+ | [knowledge/patterns/ux-guidelines.md](../knowledge/patterns/ux-guidelines.md) | 1454 | generated | UX guidelines |
184
+
185
+ #### platforms
186
+
187
+ | File | Lines | Type | Title |
188
+ | --- | --- | --- | --- |
189
+ | [knowledge/platforms/react-native.md](../knowledge/platforms/react-native.md) | 395 | hand-written | React Native platform notes |
190
+
191
+ #### print
192
+
193
+ | File | Lines | Type | Title |
194
+ | --- | --- | --- | --- |
195
+ | [knowledge/print/brochures-and-flyers.md](../knowledge/print/brochures-and-flyers.md) | 276 | hand-written | Brochures and flyers |
196
+ | [knowledge/print/korean-print-conventions.md](../knowledge/print/korean-print-conventions.md) | 284 | hand-written | Korean print conventions |
197
+ | [knowledge/print/packaging.md](../knowledge/print/packaging.md) | 321 | hand-written | Packaging |
198
+ | [knowledge/print/print-fundamentals.md](../knowledge/print/print-fundamentals.md) | 238 | hand-written | Print fundamentals |
199
+ | [knowledge/print/signage-and-posters.md](../knowledge/print/signage-and-posters.md) | 235 | hand-written | Signage and posters |
200
+ | [knowledge/print/stationery.md](../knowledge/print/stationery.md) | 262 | hand-written | Stationery |
201
+
202
+ #### spatial
203
+
204
+ | File | Lines | Type | Title |
205
+ | --- | --- | --- | --- |
206
+ | [knowledge/spatial/ar-patterns.md](../knowledge/spatial/ar-patterns.md) | 253 | hand-written | AR patterns |
207
+ | [knowledge/spatial/comfort-and-accessibility.md](../knowledge/spatial/comfort-and-accessibility.md) | 245 | hand-written | Comfort and accessibility in spatial |
208
+ | [knowledge/spatial/spatial-design-fundamentals.md](../knowledge/spatial/spatial-design-fundamentals.md) | 346 | hand-written | Spatial design fundamentals |
209
+ | [knowledge/spatial/spatial-ui-elements.md](../knowledge/spatial/spatial-ui-elements.md) | 343 | hand-written | Spatial UI elements |
210
+ | [knowledge/spatial/vr-patterns.md](../knowledge/spatial/vr-patterns.md) | 302 | hand-written | VR patterns |
211
+
212
+ #### typography
213
+
214
+ | File | Lines | Type | Title |
215
+ | --- | --- | --- | --- |
216
+ | [knowledge/typography/font-pairings.md](../knowledge/typography/font-pairings.md) | 332 | generated | Curated font pairings |
217
+ | [knowledge/typography/mui-type-scale.md](../knowledge/typography/mui-type-scale.md) | 57 | generated | MUI default type scale |
218
+ | [knowledge/typography/type-scale-fundamentals.md](../knowledge/typography/type-scale-fundamentals.md) | 105 | hand-written | Type scale fundamentals |
219
+
220
+ #### video
221
+
222
+ | File | Lines | Type | Title |
223
+ | --- | --- | --- | --- |
224
+ | [knowledge/video/in-product-video.md](../knowledge/video/in-product-video.md) | 277 | hand-written | In-product video |
225
+ | [knowledge/video/korean-video-conventions.md](../knowledge/video/korean-video-conventions.md) | 247 | hand-written | Korean video conventions |
226
+ | [knowledge/video/marketing-video.md](../knowledge/video/marketing-video.md) | 258 | hand-written | Marketing video |
227
+ | [knowledge/video/social-and-short-form.md](../knowledge/video/social-and-short-form.md) | 257 | hand-written | Social and short-form video |
228
+ | [knowledge/video/video-fundamentals.md](../knowledge/video/video-fundamentals.md) | 296 | hand-written | Video fundamentals |
229
+
230
+ ## Skills
231
+
232
+ | Skill | Playbook | SKILL.md | Template | Verification phase | Lines |
233
+ | --- | --- | --- | --- | --- | --- |
234
+ | [color-palette](../skills/color-palette/PLAYBOOK.md) | ✓ | ✓ | ✓ | ✓ | 175 |
235
+ | [component-spec-writer](../skills/component-spec-writer/PLAYBOOK.md) | ✓ | ✓ | ✓ | ✓ | 169 |
236
+ | [conversational-ui-designer](../skills/conversational-ui-designer/PLAYBOOK.md) | ✓ | ✓ | — | ✓ | 231 |
237
+ | [design-broadcast](../skills/design-broadcast/PLAYBOOK.md) | ✓ | ✓ | — | ✓ | 146 |
238
+ | [design-critique](../skills/design-critique/PLAYBOOK.md) | ✓ | ✓ | — | ✓ | 137 |
239
+ | [design-pr-review](../skills/design-pr-review/PLAYBOOK.md) | ✓ | ✓ | — | ✓ | 171 |
240
+ | [design-system-builder](../skills/design-system-builder/PLAYBOOK.md) | ✓ | ✓ | — | ✓ | 218 |
241
+ | [design-system-qa](../skills/design-system-qa/PLAYBOOK.md) | ✓ | ✓ | — | ✓ | 163 |
242
+ | [document-author](../skills/document-author/PLAYBOOK.md) | ✓ | ✓ | — | ✓ | 167 |
243
+ | [figma-token-sync](../skills/figma-token-sync/PLAYBOOK.md) | ✓ | ✓ | — | ✓ | 149 |
244
+ | [game-ui-designer](../skills/game-ui-designer/PLAYBOOK.md) | ✓ | ✓ | — | ✓ | 209 |
245
+ | [handoff-spec](../skills/handoff-spec/PLAYBOOK.md) | ✓ | ✓ | — | ✓ | 170 |
246
+ | [illustration-designer](../skills/illustration-designer/PLAYBOOK.md) | ✓ | ✓ | — | ✓ | 166 |
247
+ | [motion-designer](../skills/motion-designer/PLAYBOOK.md) | ✓ | ✓ | — | ✓ | 223 |
248
+ | [print-designer](../skills/print-designer/PLAYBOOK.md) | ✓ | ✓ | — | ✓ | 209 |
249
+ | [slide-deck-author](../skills/slide-deck-author/PLAYBOOK.md) | ✓ | ✓ | — | ✓ | 198 |
250
+ | [spatial-designer](../skills/spatial-designer/PLAYBOOK.md) | ✓ | ✓ | — | ✓ | 238 |
251
+ | [ux-audit](../skills/ux-audit/PLAYBOOK.md) | ✓ | ✓ | — | ✓ | 142 |
252
+ | [video-designer](../skills/video-designer/PLAYBOOK.md) | ✓ | ✓ | — | ✓ | 240 |
253
+ | [website-improvement](../skills/website-improvement/PLAYBOOK.md) | ✓ | ✓ | ✓ | ✓ | 118 |
254
+
255
+ ## Worked examples
256
+
257
+ | File | Lines | Title |
258
+ | --- | --- | --- |
259
+ | [examples/component-accordion-actions.md](../examples/component-accordion-actions.md) | 153 | `AccordionActions` - spec |
260
+ | [examples/component-accordion-details.md](../examples/component-accordion-details.md) | 147 | `AccordionDetails` - spec |
261
+ | [examples/component-accordion-summary.md](../examples/component-accordion-summary.md) | 180 | `AccordionSummary` - spec |
262
+ | [examples/component-accordion.md](../examples/component-accordion.md) | 229 | `Accordion` (Collapse) — spec |
263
+ | [examples/component-account-card.md](../examples/component-account-card.md) | 284 | `AccountCard` (custom — Korean banking / fintech) — spec |
264
+ | [examples/component-address-input.md](../examples/component-address-input.md) | 260 | `AddressInput` (custom — Korean) — spec |
265
+ | [examples/component-affix.md](../examples/component-affix.md) | 190 | `Affix` (sticky positioning) — spec |
266
+ | [examples/component-alert-dialog.md](../examples/component-alert-dialog.md) | 210 | `AlertDialog` — spec |
267
+ | [examples/component-alert-title.md](../examples/component-alert-title.md) | 77 | `AlertTitle` — spec |
268
+ | [examples/component-alert.md](../examples/component-alert.md) | 192 | `Alert` (Banner) — spec |
269
+ | [examples/component-amount-input.md](../examples/component-amount-input.md) | 278 | `AmountInput` (custom) — spec |
270
+ | [examples/component-anchor.md](../examples/component-anchor.md) | 198 | `Anchor` (scrollspy / TOC) — spec |
271
+ | [examples/component-app-bar.md](../examples/component-app-bar.md) | 249 | `AppBar` (Top app bar / header) — spec |
272
+ | [examples/component-aspect-ratio.md](../examples/component-aspect-ratio.md) | 156 | `AspectRatio` — spec |
273
+ | [examples/component-auto-complete.md](../examples/component-auto-complete.md) | 199 | `AutoComplete` — spec |
274
+ | [examples/component-avatar-group.md](../examples/component-avatar-group.md) | 170 | `AvatarGroup` - spec |
275
+ | [examples/component-avatar.md](../examples/component-avatar.md) | 191 | `Avatar` — spec |
276
+ | [examples/component-back-top.md](../examples/component-back-top.md) | 123 | `BackTop` — spec |
277
+ | [examples/component-backdrop.md](../examples/component-backdrop.md) | 148 | `Backdrop` — spec |
278
+ | [examples/component-badge.md](../examples/component-badge.md) | 181 | `Badge` — spec |
279
+ | [examples/component-banner.md](../examples/component-banner.md) | 237 | `Banner` — spec |
280
+ | [examples/component-biometric-gate.md](../examples/component-biometric-gate.md) | 281 | `BiometricGate` (custom — Korean mobile fintech) — spec |
281
+ | [examples/component-blockquote.md](../examples/component-blockquote.md) | 153 | `Blockquote` — spec |
282
+ | [examples/component-border-beam.md](../examples/component-border-beam.md) | 207 | `BorderBeam` — spec |
283
+ | [examples/component-bottom-navigation.md](../examples/component-bottom-navigation.md) | 226 | `BottomNavigation` — spec |
284
+ | [examples/component-box.md](../examples/component-box.md) | 112 | `Box` — spec |
285
+ | [examples/component-breadcrumb.md](../examples/component-breadcrumb.md) | 222 | `Breadcrumb` — spec |
286
+ | [examples/component-button-base.md](../examples/component-button-base.md) | 190 | `ButtonBase` — spec |
287
+ | [examples/component-button-group.md](../examples/component-button-group.md) | 117 | `ButtonGroup` — spec |
288
+ | [examples/component-button.md](../examples/component-button.md) | 213 | `Button` — spec |
289
+ | [examples/component-calendar.md](../examples/component-calendar.md) | 280 | `Calendar` (full month view) — spec |
290
+ | [examples/component-callout.md](../examples/component-callout.md) | 131 | `Callout` (info/warning/note in docs) — spec |
291
+ | [examples/component-card-actions.md](../examples/component-card-actions.md) | 101 | `CardActions` — spec |
292
+ | [examples/component-card-content.md](../examples/component-card-content.md) | 90 | `CardContent` — spec |
293
+ | [examples/component-card-header.md](../examples/component-card-header.md) | 122 | `CardHeader` — spec |
294
+ | [examples/component-card-media.md](../examples/component-card-media.md) | 79 | `CardMedia` — spec |
295
+ | [examples/component-card.md](../examples/component-card.md) | 233 | `Card` — spec |
296
+ | [examples/component-carousel.md](../examples/component-carousel.md) | 266 | `Carousel` — spec |
297
+ | [examples/component-cascader.md](../examples/component-cascader.md) | 135 | `Cascader` — spec |
298
+ | [examples/component-category-picker.md](../examples/component-category-picker.md) | 271 | `CategoryPicker` (custom — Korean fintech / 가계부) — spec |
299
+ | [examples/component-chart.md](../examples/component-chart.md) | 237 | `Chart` — spec |
300
+ | [examples/component-chat-interface.md](../examples/component-chat-interface.md) | 399 | `ChatInterface` (custom — generic chat UI for chatbot / AI / live agent) — spec |
301
+ | [examples/component-checkbox.md](../examples/component-checkbox.md) | 149 | `Checkbox` — spec |
302
+ | [examples/component-click-away-listener.md](../examples/component-click-away-listener.md) | 87 | `ClickAwayListener` — spec |
303
+ | [examples/component-code.md](../examples/component-code.md) | 213 | `Code` (inline + block) — spec |
304
+ | [examples/component-collapsible.md](../examples/component-collapsible.md) | 219 | `Collapsible` — spec |
305
+ | [examples/component-color-picker.md](../examples/component-color-picker.md) | 110 | `ColorPicker` — spec |
306
+ | [examples/component-combobox.md](../examples/component-combobox.md) | 267 | `Combobox` — spec |
307
+ | [examples/component-command.md](../examples/component-command.md) | 299 | `CommandPalette` — spec |
308
+ | [examples/component-config-provider.md](../examples/component-config-provider.md) | 190 | `ConfigProvider` — spec |
309
+ | [examples/component-context-menu.md](../examples/component-context-menu.md) | 179 | `ContextMenu` — spec |
310
+ | [examples/component-css-baseline.md](../examples/component-css-baseline.md) | 148 | `CssBaseline` — spec |
311
+ | [examples/component-date-picker.md](../examples/component-date-picker.md) | 249 | `DatePicker` — spec |
312
+ | [examples/component-descriptions.md](../examples/component-descriptions.md) | 242 | `Descriptions` (key-value list) — spec |
313
+ | [examples/component-dialog-actions.md](../examples/component-dialog-actions.md) | 111 | `DialogActions` — spec |
314
+ | [examples/component-dialog-content-text.md](../examples/component-dialog-content-text.md) | 76 | `DialogContentText` — spec |
315
+ | [examples/component-dialog-content.md](../examples/component-dialog-content.md) | 105 | `DialogContent` — spec |
316
+ | [examples/component-dialog-title.md](../examples/component-dialog-title.md) | 104 | `DialogTitle` — spec |
317
+ | [examples/component-dialog.md](../examples/component-dialog.md) | 176 | `Dialog` — spec |
318
+ | [examples/component-divider.md](../examples/component-divider.md) | 182 | `Divider` (Separator) — spec |
319
+ | [examples/component-doc-page.md](../examples/component-doc-page.md) | 217 | `DocPage` (full doc page layout) — spec |
320
+ | [examples/component-drawer.md](../examples/component-drawer.md) | 257 | `Drawer` — spec |
321
+ | [examples/component-dropdown.md](../examples/component-dropdown.md) | 220 | `DropdownMenu` — spec |
322
+ | [examples/component-email-layout.md](../examples/component-email-layout.md) | 253 | `EmailLayout` — spec |
323
+ | [examples/component-empty-state.md](../examples/component-empty-state.md) | 269 | `EmptyState` (custom — no-data + filtered-empty + first-run shell) — spec |
324
+ | [examples/component-empty.md](../examples/component-empty.md) | 172 | `Empty` — spec |
325
+ | [examples/component-fade.md](../examples/component-fade.md) | 87 | `Fade` — spec |
326
+ | [examples/component-feature-grid.md](../examples/component-feature-grid.md) | 201 | `FeatureGrid` (3-up / 4-up feature display) — spec |
327
+ | [examples/component-field.md](../examples/component-field.md) | 266 | `Field` — spec |
328
+ | [examples/component-filled-input.md](../examples/component-filled-input.md) | 114 | `FilledInput` — spec |
329
+ | [examples/component-flex.md](../examples/component-flex.md) | 117 | `Flex` — spec |
330
+ | [examples/component-float-button.md](../examples/component-float-button.md) | 214 | `FloatButton` (FAB — Floating Action Button) — spec |
331
+ | [examples/component-form-control-label.md](../examples/component-form-control-label.md) | 134 | `FormControlLabel` — spec |
332
+ | [examples/component-form-control.md](../examples/component-form-control.md) | 113 | `FormControl` — spec |
333
+ | [examples/component-form-controls.md](../examples/component-form-controls.md) | 251 | `Switch` / `Checkbox` / `Radio` — combined spec |
334
+ | [examples/component-form-group.md](../examples/component-form-group.md) | 86 | `FormGroup` — spec |
335
+ | [examples/component-form-helper-text.md](../examples/component-form-helper-text.md) | 95 | `FormHelperText` — spec |
336
+ | [examples/component-form-label.md](../examples/component-form-label.md) | 98 | `FormLabel` — spec |
337
+ | [examples/component-form.md](../examples/component-form.md) | 291 | `Form` — spec |
338
+ | [examples/component-game-hud.md](../examples/component-game-hud.md) | 362 | `GameHUD` (custom — composable in-game heads-up display) — spec |
339
+ | [examples/component-game-menu.md](../examples/component-game-menu.md) | 327 | `GameMenu` (custom — composable game menu shell with focus / input handling) — spec |
340
+ | [examples/component-grid.md](../examples/component-grid.md) | 140 | `Grid` — spec |
341
+ | [examples/component-grow.md](../examples/component-grow.md) | 79 | `Grow` — spec |
342
+ | [examples/component-hero-block.md](../examples/component-hero-block.md) | 252 | `HeroBlock` (landing hero) — spec |
343
+ | [examples/component-hover-card.md](../examples/component-hover-card.md) | 211 | `HoverCard` — spec |
344
+ | [examples/component-icon-button.md](../examples/component-icon-button.md) | 142 | `IconButton` — spec |
345
+ | [examples/component-icon.md](../examples/component-icon.md) | 102 | `Icon` — spec |
346
+ | [examples/component-illustration.md](../examples/component-illustration.md) | 280 | `Illustration` (custom — themeable SVG illustration display) — spec |
347
+ | [examples/component-image-list.md](../examples/component-image-list.md) | 107 | `ImageList` — spec |
348
+ | [examples/component-image.md](../examples/component-image.md) | 282 | `Image` — spec |
349
+ | [examples/component-input-adornment.md](../examples/component-input-adornment.md) | 101 | `InputAdornment` — spec |
350
+ | [examples/component-input-base.md](../examples/component-input-base.md) | 134 | `InputBase` — spec |
351
+ | [examples/component-input-number.md](../examples/component-input-number.md) | 141 | `InputNumber` — spec |
352
+ | [examples/component-input-otp.md](../examples/component-input-otp.md) | 271 | `InputOTP` (one-time password input) — spec |
353
+ | [examples/component-input.md](../examples/component-input.md) | 213 | `Input` — spec |
354
+ | [examples/component-item.md](../examples/component-item.md) | 243 | `Item` — spec |
355
+ | [examples/component-kbd.md](../examples/component-kbd.md) | 197 | `Kbd` — spec |
356
+ | [examples/component-krw-amount.md](../examples/component-krw-amount.md) | 219 | `KRWAmount` (custom — display-only currency formatter) — spec |
357
+ | [examples/component-label.md](../examples/component-label.md) | 118 | `Label` — spec |
358
+ | [examples/component-layout.md](../examples/component-layout.md) | 217 | `Layout` (page chrome) — spec |
359
+ | [examples/component-link.md](../examples/component-link.md) | 223 | `Link` — spec |
360
+ | [examples/component-list-item-avatar.md](../examples/component-list-item-avatar.md) | 72 | `ListItemAvatar` — spec |
361
+ | [examples/component-list-item-button.md](../examples/component-list-item-button.md) | 139 | `ListItemButton` — spec |
362
+ | [examples/component-list-item-icon.md](../examples/component-list-item-icon.md) | 82 | `ListItemIcon` — spec |
363
+ | [examples/component-list-item-text.md](../examples/component-list-item-text.md) | 98 | `ListItemText` — spec |
364
+ | [examples/component-list-item.md](../examples/component-list-item.md) | 116 | `ListItem` — spec |
365
+ | [examples/component-list-subheader.md](../examples/component-list-subheader.md) | 70 | `ListSubheader` — spec |
366
+ | [examples/component-list.md](../examples/component-list.md) | 198 | `List` — spec |
367
+ | [examples/component-loading-button.md](../examples/component-loading-button.md) | 125 | `LoadingButton` (pattern) — spec |
368
+ | [examples/component-loading-sequence.md](../examples/component-loading-sequence.md) | 254 | `LoadingSequence` (custom — splash + first-screen coordination) — spec |
369
+ | [examples/component-lottie-player.md](../examples/component-lottie-player.md) | 279 | `LottiePlayer` (custom — designer-led After Effects animation in product UI) — spec |
370
+ | [examples/component-masonry.md](../examples/component-masonry.md) | 191 | `Masonry` — spec |
371
+ | [examples/component-mentions.md](../examples/component-mentions.md) | 189 | `Mention` (@-trigger autocomplete) — spec |
372
+ | [examples/component-menu-item.md](../examples/component-menu-item.md) | 102 | `MenuItem` — spec |
373
+ | [examples/component-menu-list.md](../examples/component-menu-list.md) | 98 | `MenuList` — spec |
374
+ | [examples/component-menu.md](../examples/component-menu.md) | 139 | `Menu` — spec |
375
+ | [examples/component-menubar.md](../examples/component-menubar.md) | 259 | `Menubar` — spec |
376
+ | [examples/component-message.md](../examples/component-message.md) | 162 | `Message` — spec |
377
+ | [examples/component-mobile-stepper.md](../examples/component-mobile-stepper.md) | 155 | `MobileStepper` — spec |
378
+ | [examples/component-modal.md](../examples/component-modal.md) | 220 | `Modal` (Dialog) — spec |
379
+ | [examples/component-navigation-menu.md](../examples/component-navigation-menu.md) | 295 | `NavigationMenu` — spec |
380
+ | [examples/component-notification.md](../examples/component-notification.md) | 166 | `Notification` — spec |
381
+ | [examples/component-otp-countdown.md](../examples/component-otp-countdown.md) | 245 | `OTPCountdown` (custom — Korean SMS verification timer) — spec |
382
+ | [examples/component-outlined-input.md](../examples/component-outlined-input.md) | 145 | `OutlinedInput` — spec |
383
+ | [examples/component-page-transition.md](../examples/component-page-transition.md) | 281 | `PageTransition` (custom — route-level animation wrapper) — spec |
384
+ | [examples/component-pagination.md](../examples/component-pagination.md) | 226 | `Pagination` — spec |
385
+ | [examples/component-paper.md](../examples/component-paper.md) | 199 | `Paper` — spec |
386
+ | [examples/component-pass-auth.md](../examples/component-pass-auth.md) | 265 | `PASSAuth` (custom — Korean 본인인증) — spec |
387
+ | [examples/component-payment-brand-button.md](../examples/component-payment-brand-button.md) | 253 | `PaymentBrandButton` (custom — Korean) — spec |
388
+ | [examples/component-payment-method-selector.md](../examples/component-payment-method-selector.md) | 272 | `PaymentMethodSelector` (custom — Korean) — spec |
389
+ | [examples/component-payment-receipt.md](../examples/component-payment-receipt.md) | 277 | `PaymentReceipt` (custom — Korean fintech) — spec |
390
+ | [examples/component-popconfirm.md](../examples/component-popconfirm.md) | 144 | `Popconfirm` — spec |
391
+ | [examples/component-popover.md](../examples/component-popover.md) | 239 | `Popover` — spec |
392
+ | [examples/component-popper.md](../examples/component-popper.md) | 129 | `Popper` — spec |
393
+ | [examples/component-pricing-cards.md](../examples/component-pricing-cards.md) | 247 | `PricingCards` — spec |
394
+ | [examples/component-progress.md](../examples/component-progress.md) | 195 | `Progress` — spec |
395
+ | [examples/component-qr-code.md](../examples/component-qr-code.md) | 201 | `QRCode` — spec |
396
+ | [examples/component-radio.md](../examples/component-radio.md) | 167 | `Radio` (and `RadioGroup`) — spec |
397
+ | [examples/component-rate.md](../examples/component-rate.md) | 202 | `Rate` (Rating) — spec |
398
+ | [examples/component-resizable.md](../examples/component-resizable.md) | 163 | `Resizable` — spec |
399
+ | [examples/component-result.md](../examples/component-result.md) | 270 | `Result` + `Empty` — combined spec |
400
+ | [examples/component-scroll-area.md](../examples/component-scroll-area.md) | 199 | `ScrollArea` — spec |
401
+ | [examples/component-scroll-reveal.md](../examples/component-scroll-reveal.md) | 320 | `ScrollReveal` (custom — viewport-triggered animation primitive) — spec |
402
+ | [examples/component-segmented.md](../examples/component-segmented.md) | 178 | `Segmented` (Toggle button group) — spec |
403
+ | [examples/component-select.md](../examples/component-select.md) | 258 | `Select` / `Combobox` — spec |
404
+ | [examples/component-separator.md](../examples/component-separator.md) | 177 | `Separator` — spec |
405
+ | [examples/component-sheet.md](../examples/component-sheet.md) | 277 | `Sheet` — spec |
406
+ | [examples/component-sidebar.md](../examples/component-sidebar.md) | 257 | `Sidebar` — spec |
407
+ | [examples/component-skeleton.md](../examples/component-skeleton.md) | 178 | `Skeleton` — spec |
408
+ | [examples/component-slide.md](../examples/component-slide.md) | 89 | `Slide` — spec |
409
+ | [examples/component-slider.md](../examples/component-slider.md) | 208 | `Slider` — spec |
410
+ | [examples/component-snackbar-content.md](../examples/component-snackbar-content.md) | 92 | `SnackbarContent` — spec |
411
+ | [examples/component-snackbar.md](../examples/component-snackbar.md) | 121 | `Snackbar` — spec |
412
+ | [examples/component-sonner.md](../examples/component-sonner.md) | 165 | `Sonner` — spec |
413
+ | [examples/component-space.md](../examples/component-space.md) | 125 | `Space` — spec |
414
+ | [examples/component-spatial-locomotion.md](../examples/component-spatial-locomotion.md) | 373 | `SpatialLocomotion` (custom — VR locomotion controller with comfort options) — spec |
415
+ | [examples/component-spatial-panel.md](../examples/component-spatial-panel.md) | 330 | `SpatialPanel` (custom — floating UI panel for VR / AR / spatial computing) — spec |
416
+ | [examples/component-speed-dial-action.md](../examples/component-speed-dial-action.md) | 78 | `SpeedDialAction` — spec |
417
+ | [examples/component-speed-dial.md](../examples/component-speed-dial.md) | 177 | `SpeedDial` — spec |
418
+ | [examples/component-spin.md](../examples/component-spin.md) | 173 | `Spin` (Spinner) — spec |
419
+ | [examples/component-spinner.md](../examples/component-spinner.md) | 204 | `Spinner` — spec |
420
+ | [examples/component-splitter.md](../examples/component-splitter.md) | 210 | `Splitter` (resizable panel) — spec |
421
+ | [examples/component-stack.md](../examples/component-stack.md) | 130 | `Stack` — spec |
422
+ | [examples/component-statistic.md](../examples/component-statistic.md) | 282 | `Statistic` — spec |
423
+ | [examples/component-step-button.md](../examples/component-step-button.md) | 157 | `StepButton` - spec |
424
+ | [examples/component-step-connector.md](../examples/component-step-connector.md) | 157 | `StepConnector` - spec |
425
+ | [examples/component-step-content.md](../examples/component-step-content.md) | 121 | `StepContent` — spec |
426
+ | [examples/component-step-icon.md](../examples/component-step-icon.md) | 115 | `StepIcon` — spec |
427
+ | [examples/component-step-label.md](../examples/component-step-label.md) | 101 | `StepLabel` — spec |
428
+ | [examples/component-step.md](../examples/component-step.md) | 84 | `Step` — spec |
429
+ | [examples/component-steps.md](../examples/component-steps.md) | 264 | `Steps` (Stepper) — spec |
430
+ | [examples/component-stock-chart.md](../examples/component-stock-chart.md) | 251 | `StockChart` (custom — Korean stock convention) — spec |
431
+ | [examples/component-swipeable-drawer.md](../examples/component-swipeable-drawer.md) | 149 | `SwipeableDrawer` — spec |
432
+ | [examples/component-switch.md](../examples/component-switch.md) | 99 | `Switch` — spec |
433
+ | [examples/component-tab-scroll-button.md](../examples/component-tab-scroll-button.md) | 180 | `TabScrollButton` - spec |
434
+ | [examples/component-tab.md](../examples/component-tab.md) | 120 | `Tab` — spec |
435
+ | [examples/component-table-body.md](../examples/component-table-body.md) | 82 | `TableBody` — spec |
436
+ | [examples/component-table-cell.md](../examples/component-table-cell.md) | 118 | `TableCell` — spec |
437
+ | [examples/component-table-container.md](../examples/component-table-container.md) | 75 | `TableContainer` — spec |
438
+ | [examples/component-table-footer.md](../examples/component-table-footer.md) | 72 | `TableFooter` — spec |
439
+ | [examples/component-table-head.md](../examples/component-table-head.md) | 78 | `TableHead` — spec |
440
+ | [examples/component-table-pagination.md](../examples/component-table-pagination.md) | 137 | `TablePagination` — spec |
441
+ | [examples/component-table-row.md](../examples/component-table-row.md) | 113 | `TableRow` — spec |
442
+ | [examples/component-table-sort-label.md](../examples/component-table-sort-label.md) | 109 | `TableSortLabel` — spec |
443
+ | [examples/component-table.md](../examples/component-table.md) | 202 | `Table` — spec |
444
+ | [examples/component-tabs.md](../examples/component-tabs.md) | 184 | `Tabs` — spec |
445
+ | [examples/component-tag-badge.md](../examples/component-tag-badge.md) | 309 | `Tag` + `Badge` — combined spec |
446
+ | [examples/component-tag.md](../examples/component-tag.md) | 102 | `Tag` — spec |
447
+ | [examples/component-testimonial-carousel.md](../examples/component-testimonial-carousel.md) | 218 | `TestimonialCarousel` — spec |
448
+ | [examples/component-textarea-autosize.md](../examples/component-textarea-autosize.md) | 114 | `TextareaAutosize` — spec |
449
+ | [examples/component-textarea.md](../examples/component-textarea.md) | 173 | `Textarea` — spec |
450
+ | [examples/component-time-picker.md](../examples/component-time-picker.md) | 205 | `TimePicker` — spec |
451
+ | [examples/component-timeline.md](../examples/component-timeline.md) | 170 | `Timeline` — spec |
452
+ | [examples/component-toast.md](../examples/component-toast.md) | 224 | `Toast` (Snackbar) — spec |
453
+ | [examples/component-toggle-button.md](../examples/component-toggle-button.md) | 129 | `ToggleButton` — spec |
454
+ | [examples/component-toggle.md](../examples/component-toggle.md) | 220 | `Toggle` and `ToggleGroup` — spec |
455
+ | [examples/component-toolbar.md](../examples/component-toolbar.md) | 104 | `Toolbar` — spec |
456
+ | [examples/component-tooltip.md](../examples/component-tooltip.md) | 178 | `Tooltip` — spec |
457
+ | [examples/component-tour.md](../examples/component-tour.md) | 176 | `Tour` (in-product overlay tour) — spec |
458
+ | [examples/component-transaction-list-item.md](../examples/component-transaction-list-item.md) | 243 | `TransactionListItem` (custom — Korean fintech / 가계부) — spec |
459
+ | [examples/component-transfer.md](../examples/component-transfer.md) | 156 | `Transfer` (dual list) — spec |
460
+ | [examples/component-tree-select.md](../examples/component-tree-select.md) | 202 | `TreeSelect` — spec |
461
+ | [examples/component-tree.md](../examples/component-tree.md) | 297 | `Tree` (TreeView) — spec |
462
+ | [examples/component-typography.md](../examples/component-typography.md) | 215 | `Typography` (text primitive) — spec |
463
+ | [examples/component-upload.md](../examples/component-upload.md) | 295 | `Upload` — spec |
464
+ | [examples/component-video-hero.md](../examples/component-video-hero.md) | 409 | `VideoHero` (custom — autoplay landing-page video hero) — spec |
465
+ | [examples/component-video-player.md](../examples/component-video-player.md) | 340 | `VideoPlayer` (custom — accessible HTML5 video with captions, speed, transcript) — spec |
466
+ | [examples/component-voice-input.md](../examples/component-voice-input.md) | 408 | `VoiceInput` (custom — push-to-talk + transcript voice input) — spec |
467
+ | [examples/component-watermark.md](../examples/component-watermark.md) | 217 | `Watermark` — spec |
468
+ | [examples/component-zoom.md](../examples/component-zoom.md) | 92 | `Zoom` — spec |
469
+ | [examples/doc-explanation-example.md](../examples/doc-explanation-example.md) | 196 | Worked example: explanation |
470
+ | [examples/doc-how-to-example.md](../examples/doc-how-to-example.md) | 205 | Worked example: how-to |
471
+ | [examples/doc-tutorial-example.md](../examples/doc-tutorial-example.md) | 162 | Worked example: tutorial |
472
+ | [examples/dogfood-korean-fintech-system.md](../examples/dogfood-korean-fintech-system.md) | 433 | Dogfood: Korean fintech mobile app — design system bootstrap |
473
+ | [examples/email-transactional-example.md](../examples/email-transactional-example.md) | 259 | Worked example: transactional email (Korean fintech) |
474
+ | [examples/palette-saas-violet.md](../examples/palette-saas-violet.md) | 235 | Palette: B2B SaaS — violet primary |
475
+ | [examples/print-business-card-spec.md](../examples/print-business-card-spec.md) | 205 | Print spec: business card (Korean 명함, premium tier) |
476
+ | [examples/print-packaging-spec.md](../examples/print-packaging-spec.md) | 285 | Print spec: folding carton (Korean cosmetics, mid-tier) |
477
+ | [examples/report-example.md](../examples/report-example.md) | 228 | Worked example: design audit report |
478
+ | [examples/slide-deck-example.md](../examples/slide-deck-example.md) | 237 | Worked example: slide deck (talk archetype) |
479
+ | [examples/website-improvement-report.md](../examples/website-improvement-report.md) | 128 | Website Improvement Plan: Korean SaaS Marketing Site |
480
+
481
+ ## Component spec coverage
482
+
483
+ **181 / 200 canonical components have a worked spec (90.5%)** — 16 are covered by parent/alias specs.
484
+
485
+ Specs that match canonical names directly:
486
+
487
+ - `accordion` → [examples/component-accordion.md](../examples/component-accordion.md)
488
+ - `accordion-actions` → [examples/component-accordion-actions.md](../examples/component-accordion-actions.md)
489
+ - `accordion-details` → [examples/component-accordion-details.md](../examples/component-accordion-details.md)
490
+ - `accordion-summary` → [examples/component-accordion-summary.md](../examples/component-accordion-summary.md)
491
+ - `affix` → [examples/component-affix.md](../examples/component-affix.md)
492
+ - `alert` → [examples/component-alert.md](../examples/component-alert.md)
493
+ - `alert-dialog` → [examples/component-alert-dialog.md](../examples/component-alert-dialog.md)
494
+ - `alert-title` → [examples/component-alert-title.md](../examples/component-alert-title.md)
495
+ - `anchor` → [examples/component-anchor.md](../examples/component-anchor.md)
496
+ - `app-bar` → [examples/component-app-bar.md](../examples/component-app-bar.md)
497
+ - `aspect-ratio` → [examples/component-aspect-ratio.md](../examples/component-aspect-ratio.md)
498
+ - `auto-complete` → [examples/component-auto-complete.md](../examples/component-auto-complete.md)
499
+ - `avatar` → [examples/component-avatar.md](../examples/component-avatar.md)
500
+ - `avatar-group` → [examples/component-avatar-group.md](../examples/component-avatar-group.md)
501
+ - `back-top` → [examples/component-back-top.md](../examples/component-back-top.md)
502
+ - `backdrop` → [examples/component-backdrop.md](../examples/component-backdrop.md)
503
+ - `badge` → [examples/component-badge.md](../examples/component-badge.md)
504
+ - `border-beam` → [examples/component-border-beam.md](../examples/component-border-beam.md)
505
+ - `bottom-navigation` → [examples/component-bottom-navigation.md](../examples/component-bottom-navigation.md)
506
+ - `box` → [examples/component-box.md](../examples/component-box.md)
507
+ - `breadcrumb` → [examples/component-breadcrumb.md](../examples/component-breadcrumb.md)
508
+ - `button` → [examples/component-button.md](../examples/component-button.md)
509
+ - `button-base` → [examples/component-button-base.md](../examples/component-button-base.md)
510
+ - `button-group` → [examples/component-button-group.md](../examples/component-button-group.md)
511
+ - `card` → [examples/component-card.md](../examples/component-card.md)
512
+ - `card-actions` → [examples/component-card-actions.md](../examples/component-card-actions.md)
513
+ - `card-content` → [examples/component-card-content.md](../examples/component-card-content.md)
514
+ - `card-header` → [examples/component-card-header.md](../examples/component-card-header.md)
515
+ - `card-media` → [examples/component-card-media.md](../examples/component-card-media.md)
516
+ - `carousel` → [examples/component-carousel.md](../examples/component-carousel.md)
517
+ - `cascader` → [examples/component-cascader.md](../examples/component-cascader.md)
518
+ - `chart` → [examples/component-chart.md](../examples/component-chart.md)
519
+ - `checkbox` → [examples/component-checkbox.md](../examples/component-checkbox.md)
520
+ - `click-away-listener` → [examples/component-click-away-listener.md](../examples/component-click-away-listener.md)
521
+ - `collapsible` → [examples/component-collapsible.md](../examples/component-collapsible.md)
522
+ - `color-picker` → [examples/component-color-picker.md](../examples/component-color-picker.md)
523
+ - `combobox` → [examples/component-combobox.md](../examples/component-combobox.md)
524
+ - `command` → [examples/component-command.md](../examples/component-command.md)
525
+ - `config-provider` → [examples/component-config-provider.md](../examples/component-config-provider.md)
526
+ - `context-menu` → [examples/component-context-menu.md](../examples/component-context-menu.md)
527
+ - `css-baseline` → [examples/component-css-baseline.md](../examples/component-css-baseline.md)
528
+ - `date-picker` → [examples/component-date-picker.md](../examples/component-date-picker.md)
529
+ - `descriptions` → [examples/component-descriptions.md](../examples/component-descriptions.md)
530
+ - `dialog-actions` → [examples/component-dialog-actions.md](../examples/component-dialog-actions.md)
531
+ - `dialog-content` → [examples/component-dialog-content.md](../examples/component-dialog-content.md)
532
+ - `dialog-content-text` → [examples/component-dialog-content-text.md](../examples/component-dialog-content-text.md)
533
+ - `dialog-title` → [examples/component-dialog-title.md](../examples/component-dialog-title.md)
534
+ - `divider` → [examples/component-divider.md](../examples/component-divider.md)
535
+ - `drawer` → [examples/component-drawer.md](../examples/component-drawer.md)
536
+ - `dropdown` → [examples/component-dropdown.md](../examples/component-dropdown.md)
537
+ - `empty` → [examples/component-empty.md](../examples/component-empty.md)
538
+ - `fade` → [examples/component-fade.md](../examples/component-fade.md)
539
+ - `field` → [examples/component-field.md](../examples/component-field.md)
540
+ - `filled-input` → [examples/component-filled-input.md](../examples/component-filled-input.md)
541
+ - `flex` → [examples/component-flex.md](../examples/component-flex.md)
542
+ - `float-button` → [examples/component-float-button.md](../examples/component-float-button.md)
543
+ - `form` → [examples/component-form.md](../examples/component-form.md)
544
+ - `form-control` → [examples/component-form-control.md](../examples/component-form-control.md)
545
+ - `form-control-label` → [examples/component-form-control-label.md](../examples/component-form-control-label.md)
546
+ - `form-group` → [examples/component-form-group.md](../examples/component-form-group.md)
547
+ - `form-helper-text` → [examples/component-form-helper-text.md](../examples/component-form-helper-text.md)
548
+ - `form-label` → [examples/component-form-label.md](../examples/component-form-label.md)
549
+ - `grid` → [examples/component-grid.md](../examples/component-grid.md)
550
+ - `grow` → [examples/component-grow.md](../examples/component-grow.md)
551
+ - `hover-card` → [examples/component-hover-card.md](../examples/component-hover-card.md)
552
+ - `icon` → [examples/component-icon.md](../examples/component-icon.md)
553
+ - `icon-button` → [examples/component-icon-button.md](../examples/component-icon-button.md)
554
+ - `image` → [examples/component-image.md](../examples/component-image.md)
555
+ - `image-list` → [examples/component-image-list.md](../examples/component-image-list.md)
556
+ - `input` → [examples/component-input.md](../examples/component-input.md)
557
+ - `input-adornment` → [examples/component-input-adornment.md](../examples/component-input-adornment.md)
558
+ - `input-base` → [examples/component-input-base.md](../examples/component-input-base.md)
559
+ - `input-number` → [examples/component-input-number.md](../examples/component-input-number.md)
560
+ - `input-otp` → [examples/component-input-otp.md](../examples/component-input-otp.md)
561
+ - `item` → [examples/component-item.md](../examples/component-item.md)
562
+ - `kbd` → [examples/component-kbd.md](../examples/component-kbd.md)
563
+ - `label` → [examples/component-label.md](../examples/component-label.md)
564
+ - `layout` → [examples/component-layout.md](../examples/component-layout.md)
565
+ - `link` → [examples/component-link.md](../examples/component-link.md)
566
+ - `list` → [examples/component-list.md](../examples/component-list.md)
567
+ - `list-item` → [examples/component-list-item.md](../examples/component-list-item.md)
568
+ - `list-item-avatar` → [examples/component-list-item-avatar.md](../examples/component-list-item-avatar.md)
569
+ - `list-item-button` → [examples/component-list-item-button.md](../examples/component-list-item-button.md)
570
+ - `list-item-icon` → [examples/component-list-item-icon.md](../examples/component-list-item-icon.md)
571
+ - `list-item-text` → [examples/component-list-item-text.md](../examples/component-list-item-text.md)
572
+ - `list-subheader` → [examples/component-list-subheader.md](../examples/component-list-subheader.md)
573
+ - `masonry` → [examples/component-masonry.md](../examples/component-masonry.md)
574
+ - `mentions` → [examples/component-mentions.md](../examples/component-mentions.md)
575
+ - `menu` → [examples/component-menu.md](../examples/component-menu.md)
576
+ - `menu-item` → [examples/component-menu-item.md](../examples/component-menu-item.md)
577
+ - `menu-list` → [examples/component-menu-list.md](../examples/component-menu-list.md)
578
+ - `menubar` → [examples/component-menubar.md](../examples/component-menubar.md)
579
+ - `message` → [examples/component-message.md](../examples/component-message.md)
580
+ - `mobile-stepper` → [examples/component-mobile-stepper.md](../examples/component-mobile-stepper.md)
581
+ - `modal` → [examples/component-modal.md](../examples/component-modal.md)
582
+ - `notification` → [examples/component-notification.md](../examples/component-notification.md)
583
+ - `outlined-input` → [examples/component-outlined-input.md](../examples/component-outlined-input.md)
584
+ - `pagination` → [examples/component-pagination.md](../examples/component-pagination.md)
585
+ - `paper` → [examples/component-paper.md](../examples/component-paper.md)
586
+ - `popconfirm` → [examples/component-popconfirm.md](../examples/component-popconfirm.md)
587
+ - `popover` → [examples/component-popover.md](../examples/component-popover.md)
588
+ - `popper` → [examples/component-popper.md](../examples/component-popper.md)
589
+ - `progress` → [examples/component-progress.md](../examples/component-progress.md)
590
+ - `qr-code` → [examples/component-qr-code.md](../examples/component-qr-code.md)
591
+ - `radio` → [examples/component-radio.md](../examples/component-radio.md)
592
+ - `rate` → [examples/component-rate.md](../examples/component-rate.md)
593
+ - `resizable` → [examples/component-resizable.md](../examples/component-resizable.md)
594
+ - `result` → [examples/component-result.md](../examples/component-result.md)
595
+ - `scroll-area` → [examples/component-scroll-area.md](../examples/component-scroll-area.md)
596
+ - `segmented` → [examples/component-segmented.md](../examples/component-segmented.md)
597
+ - `select` → [examples/component-select.md](../examples/component-select.md)
598
+ - `separator` → [examples/component-separator.md](../examples/component-separator.md)
599
+ - `sheet` → [examples/component-sheet.md](../examples/component-sheet.md)
600
+ - `sidebar` → [examples/component-sidebar.md](../examples/component-sidebar.md)
601
+ - `skeleton` → [examples/component-skeleton.md](../examples/component-skeleton.md)
602
+ - `slide` → [examples/component-slide.md](../examples/component-slide.md)
603
+ - `slider` → [examples/component-slider.md](../examples/component-slider.md)
604
+ - `snackbar` → [examples/component-snackbar.md](../examples/component-snackbar.md)
605
+ - `snackbar-content` → [examples/component-snackbar-content.md](../examples/component-snackbar-content.md)
606
+ - `sonner` → [examples/component-sonner.md](../examples/component-sonner.md)
607
+ - `space` → [examples/component-space.md](../examples/component-space.md)
608
+ - `speed-dial` → [examples/component-speed-dial.md](../examples/component-speed-dial.md)
609
+ - `speed-dial-action` → [examples/component-speed-dial-action.md](../examples/component-speed-dial-action.md)
610
+ - `spin` → [examples/component-spin.md](../examples/component-spin.md)
611
+ - `spinner` → [examples/component-spinner.md](../examples/component-spinner.md)
612
+ - `splitter` → [examples/component-splitter.md](../examples/component-splitter.md)
613
+ - `statistic` → [examples/component-statistic.md](../examples/component-statistic.md)
614
+ - `step` → [examples/component-step.md](../examples/component-step.md)
615
+ - `step-button` → [examples/component-step-button.md](../examples/component-step-button.md)
616
+ - `step-connector` → [examples/component-step-connector.md](../examples/component-step-connector.md)
617
+ - `step-content` → [examples/component-step-content.md](../examples/component-step-content.md)
618
+ - `step-icon` → [examples/component-step-icon.md](../examples/component-step-icon.md)
619
+ - `step-label` → [examples/component-step-label.md](../examples/component-step-label.md)
620
+ - `steps` → [examples/component-steps.md](../examples/component-steps.md)
621
+ - `swipeable-drawer` → [examples/component-swipeable-drawer.md](../examples/component-swipeable-drawer.md)
622
+ - `switch` → [examples/component-switch.md](../examples/component-switch.md)
623
+ - `tab` → [examples/component-tab.md](../examples/component-tab.md)
624
+ - `tab-scroll-button` → [examples/component-tab-scroll-button.md](../examples/component-tab-scroll-button.md)
625
+ - `table` → [examples/component-table.md](../examples/component-table.md)
626
+ - `table-body` → [examples/component-table-body.md](../examples/component-table-body.md)
627
+ - `table-cell` → [examples/component-table-cell.md](../examples/component-table-cell.md)
628
+ - `table-container` → [examples/component-table-container.md](../examples/component-table-container.md)
629
+ - `table-footer` → [examples/component-table-footer.md](../examples/component-table-footer.md)
630
+ - `table-head` → [examples/component-table-head.md](../examples/component-table-head.md)
631
+ - `table-pagination` → [examples/component-table-pagination.md](../examples/component-table-pagination.md)
632
+ - `table-row` → [examples/component-table-row.md](../examples/component-table-row.md)
633
+ - `table-sort-label` → [examples/component-table-sort-label.md](../examples/component-table-sort-label.md)
634
+ - `tabs` → [examples/component-tabs.md](../examples/component-tabs.md)
635
+ - `tag` → [examples/component-tag.md](../examples/component-tag.md)
636
+ - `textarea` → [examples/component-textarea.md](../examples/component-textarea.md)
637
+ - `textarea-autosize` → [examples/component-textarea-autosize.md](../examples/component-textarea-autosize.md)
638
+ - `time-picker` → [examples/component-time-picker.md](../examples/component-time-picker.md)
639
+ - `timeline` → [examples/component-timeline.md](../examples/component-timeline.md)
640
+ - `toggle` → [examples/component-toggle.md](../examples/component-toggle.md)
641
+ - `toggle-button` → [examples/component-toggle-button.md](../examples/component-toggle-button.md)
642
+ - `toolbar` → [examples/component-toolbar.md](../examples/component-toolbar.md)
643
+ - `tooltip` → [examples/component-tooltip.md](../examples/component-tooltip.md)
644
+ - `tour` → [examples/component-tour.md](../examples/component-tour.md)
645
+ - `transfer` → [examples/component-transfer.md](../examples/component-transfer.md)
646
+ - `tree` → [examples/component-tree.md](../examples/component-tree.md)
647
+ - `tree-select` → [examples/component-tree-select.md](../examples/component-tree-select.md)
648
+ - `typography` → [examples/component-typography.md](../examples/component-typography.md)
649
+ - `upload` → [examples/component-upload.md](../examples/component-upload.md)
650
+ - `watermark` → [examples/component-watermark.md](../examples/component-watermark.md)
651
+ - `zoom` → [examples/component-zoom.md](../examples/component-zoom.md)
652
+
653
+ Canonical components covered by parent/alias specs:
654
+
655
+ | Canonical component | Covering spec |
656
+ | --- | --- |
657
+ | `bottom-navigation-action` | [examples/component-bottom-navigation.md](../examples/component-bottom-navigation.md) |
658
+ | `card-action-area` | [examples/component-card.md](../examples/component-card.md) |
659
+ | `col` | [examples/component-grid.md](../examples/component-grid.md) |
660
+ | `image-list-item` | [examples/component-image-list.md](../examples/component-image-list.md) |
661
+ | `image-list-item-bar` | [examples/component-image-list.md](../examples/component-image-list.md) |
662
+ | `input-group` | [examples/component-input.md](../examples/component-input.md) |
663
+ | `input-label` | [examples/component-input.md](../examples/component-input.md) |
664
+ | `list-item-secondary-action` | [examples/component-list-item.md](../examples/component-list-item.md) |
665
+ | `native-select` | [examples/component-select.md](../examples/component-select.md) |
666
+ | `pagination-item` | [examples/component-pagination.md](../examples/component-pagination.md) |
667
+ | `qrcode` | [examples/component-qr-code.md](../examples/component-qr-code.md) |
668
+ | `row` | [examples/component-grid.md](../examples/component-grid.md) |
669
+ | `speed-dial-icon` | [examples/component-speed-dial.md](../examples/component-speed-dial.md) |
670
+ | `svg-icon` | [examples/component-icon.md](../examples/component-icon.md) |
671
+ | `table-pagination-actions` | [examples/component-table-pagination.md](../examples/component-table-pagination.md) |
672
+ | `toggle-group` | [examples/component-toggle.md](../examples/component-toggle.md) |
673
+
674
+ Specs that don't match the canonical index and are not used as coverage aliases:
675
+
676
+ - `account-card`
677
+ - `address-input`
678
+ - `amount-input`
679
+ - `banner`
680
+ - `biometric-gate`
681
+ - `blockquote`
682
+ - `calendar`
683
+ - `callout`
684
+ - `category-picker`
685
+ - `chat-interface`
686
+ - `code`
687
+ - `dialog`
688
+ - `doc-page`
689
+ - `email-layout`
690
+ - `empty-state`
691
+ - `feature-grid`
692
+ - `form-controls`
693
+ - `game-hud`
694
+ - `game-menu`
695
+ - `hero-block`
696
+ - `illustration`
697
+ - `krw-amount`
698
+ - `loading-button`
699
+ - `loading-sequence`
700
+ - `lottie-player`
701
+ - `navigation-menu`
702
+ - `otp-countdown`
703
+ - `page-transition`
704
+ - `pass-auth`
705
+ - `payment-brand-button`
706
+ - `payment-method-selector`
707
+ - `payment-receipt`
708
+ - `pricing-cards`
709
+ - `scroll-reveal`
710
+ - `spatial-locomotion`
711
+ - `spatial-panel`
712
+ - `stack`
713
+ - `stock-chart`
714
+ - `tag-badge`
715
+ - `testimonial-carousel`
716
+ - `toast`
717
+ - `transaction-list-item`
718
+ - `video-hero`
719
+ - `video-player`
720
+ - `voice-input`
721
+
722
+ ## Extractors
723
+
724
+ - `tools/extractors/ant_design_tokens.py`
725
+ - `tools/extractors/awesome_design_mirror.py`
726
+ - `tools/extractors/component_index.py`
727
+ - `tools/extractors/component_spec_conflict_check.py`
728
+ - `tools/extractors/component_spec_reconcile.py`
729
+ - `tools/extractors/component_spec_scaffold.py`
730
+ - `tools/extractors/component_spec_scaffold_v2.py`
731
+ - `tools/extractors/mui_palette.py`
732
+ - `tools/extractors/shadcn_registry.py`
733
+ - `tools/extractors/ui_ux_pro_max.py`
734
+ - `tools/extractors/ui_ux_pro_max_extras.py`
735
+
736
+ ## Refresh
737
+
738
+ ```bash
739
+ python3 tools/audit/check-coverage.py
740
+ ```