@kerfjs/ui 4.4.1 → 4.5.0-beta.1

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 (499) hide show
  1. package/README.md +425 -42
  2. package/ai/application-ui-diagnostic-ids-v1.json +92 -0
  3. package/ai/application-ui-profile-sync.cjs +529 -0
  4. package/ai/application-ui-profile.d.mts +1 -0
  5. package/ai/application-ui-profile.d.ts +102 -0
  6. package/ai/application-ui-profile.defaults.json +41 -0
  7. package/ai/application-ui-profile.mjs +626 -0
  8. package/ai/application-ui-profile.schema.json +130 -0
  9. package/ai/catalog-authoring.json +25 -0
  10. package/ai/catalog-authoring.schema.json +61 -0
  11. package/ai/compile-time-contracts-v1.json +102 -0
  12. package/ai/compile-time-contracts-v1.schema.json +49 -0
  13. package/ai/component-catalog-extension-v2.d.ts +7 -0
  14. package/ai/component-catalog-extension-v2.schema.json +7 -0
  15. package/ai/component-catalog-extension.schema.json +79 -0
  16. package/ai/component-catalog-v2-overrides.json +319 -0
  17. package/ai/component-catalog-v2.d.ts +67 -0
  18. package/ai/component-catalog-v2.json +4675 -0
  19. package/ai/component-catalog-v2.schema.json +246 -0
  20. package/ai/component-catalog.json +5826 -0
  21. package/ai/component-catalog.schema.json +95 -0
  22. package/ai/public-api-signatures-v1.md +1719 -0
  23. package/ai/skill.md +129 -21
  24. package/ai/webawesome-jsx-signatures-v1.md +106 -0
  25. package/analyzer/cli.mjs +46 -0
  26. package/analyzer/index.d.mts +45 -0
  27. package/analyzer/index.mjs +737 -0
  28. package/analyzer/report.schema.json +66 -0
  29. package/dist/app-tab.d.ts +14 -2
  30. package/dist/app-tab.js +3 -1
  31. package/dist/browser/app-tab.js +3 -2
  32. package/dist/browser/disclosure-arrow.js +4 -0
  33. package/dist/browser/empty-state.js +3 -3
  34. package/dist/browser/floating-toolbar.js +3 -0
  35. package/dist/browser/list-action-row.js +4 -0
  36. package/dist/browser/list-header.js +6 -0
  37. package/dist/browser/list-inset-control.js +3 -0
  38. package/dist/browser/list-inset-text.js +3 -0
  39. package/dist/browser/list-item.js +4 -0
  40. package/dist/browser/list.js +3 -0
  41. package/dist/browser/loading-spinner.js +2 -2
  42. package/dist/browser/lucide-icon.js +2 -2
  43. package/dist/browser/pane.js +3 -0
  44. package/dist/browser/panel-header.js +7 -0
  45. package/dist/browser/resizable-region.js +2 -2
  46. package/dist/browser/segmented-control.js +3 -2
  47. package/dist/browser/select.js +4 -3
  48. package/dist/browser/skeleton.js +3 -0
  49. package/dist/browser/state-banner.js +3 -2
  50. package/dist/browser/sunken-panel.js +3 -0
  51. package/dist/browser/tab-bar.js +2 -2
  52. package/dist/browser/token-search-field.js +4 -0
  53. package/dist/browser/toolbar-control-group.js +2 -2
  54. package/dist/browser/toolbar-text.js +3 -2
  55. package/dist/browser/toolbar.js +2 -2
  56. package/dist/browser/value-table.js +3 -2
  57. package/dist/catalog-resources.d.ts +34 -0
  58. package/dist/catalog-resources.js +22 -0
  59. package/dist/catalog-resources.js.map +1 -0
  60. package/dist/catalog.d.ts +150 -0
  61. package/dist/catalog.js +377 -0
  62. package/dist/catalog.js.map +1 -0
  63. package/dist/chunk-5VTB2BKP.js +35 -0
  64. package/dist/chunk-5VTB2BKP.js.map +1 -0
  65. package/dist/chunk-6WTETUZ6.js +21 -0
  66. package/dist/chunk-6WTETUZ6.js.map +1 -0
  67. package/dist/chunk-7KEUJIIC.js +218 -0
  68. package/dist/chunk-7KEUJIIC.js.map +1 -0
  69. package/dist/chunk-7XRDUG4Y.js +58 -0
  70. package/dist/chunk-7XRDUG4Y.js.map +1 -0
  71. package/dist/chunk-B3A3IVO5.js +83 -0
  72. package/dist/chunk-B3A3IVO5.js.map +1 -0
  73. package/dist/chunk-DPDBVKNA.js +113 -0
  74. package/dist/chunk-DPDBVKNA.js.map +1 -0
  75. package/dist/chunk-FEAMR7S4.js +68 -0
  76. package/dist/chunk-FEAMR7S4.js.map +1 -0
  77. package/dist/chunk-FEY65TBV.js +15 -0
  78. package/dist/chunk-FEY65TBV.js.map +1 -0
  79. package/dist/{chunk-TRNBHPNW.js → chunk-IJBSZ4NX.js} +11 -8
  80. package/dist/chunk-IJBSZ4NX.js.map +1 -0
  81. package/dist/chunk-J5BFYY7Q.js +35 -0
  82. package/dist/chunk-J5BFYY7Q.js.map +1 -0
  83. package/dist/chunk-JRKSK2HX.js +79 -0
  84. package/dist/chunk-JRKSK2HX.js.map +1 -0
  85. package/dist/chunk-KWWR5VMS.js +45 -0
  86. package/dist/chunk-KWWR5VMS.js.map +1 -0
  87. package/dist/chunk-LPOMRC4C.js +25 -0
  88. package/dist/chunk-LPOMRC4C.js.map +1 -0
  89. package/dist/chunk-M7JBER5U.js +41 -0
  90. package/dist/chunk-M7JBER5U.js.map +1 -0
  91. package/dist/chunk-NENBUYX5.js +79 -0
  92. package/dist/chunk-NENBUYX5.js.map +1 -0
  93. package/dist/chunk-NWSEP5RT.js +117 -0
  94. package/dist/chunk-NWSEP5RT.js.map +1 -0
  95. package/dist/chunk-OJWWHFH3.js +426 -0
  96. package/dist/chunk-OJWWHFH3.js.map +1 -0
  97. package/dist/chunk-PSKN344N.js +114 -0
  98. package/dist/chunk-PSKN344N.js.map +1 -0
  99. package/dist/chunk-PX3YSS5C.js +32 -0
  100. package/dist/chunk-PX3YSS5C.js.map +1 -0
  101. package/dist/chunk-QO55FN2Y.js +20 -0
  102. package/dist/chunk-QO55FN2Y.js.map +1 -0
  103. package/dist/chunk-R7ZWUN64.js +38 -0
  104. package/dist/chunk-R7ZWUN64.js.map +1 -0
  105. package/dist/chunk-RKVQEH4J.js +61 -0
  106. package/dist/chunk-RKVQEH4J.js.map +1 -0
  107. package/dist/chunk-SRSJO5QE.js +40 -0
  108. package/dist/chunk-SRSJO5QE.js.map +1 -0
  109. package/dist/chunk-SYDMYBPG.js +31 -0
  110. package/dist/chunk-SYDMYBPG.js.map +1 -0
  111. package/dist/chunk-TB6DY7H5.js +25 -0
  112. package/dist/chunk-TB6DY7H5.js.map +1 -0
  113. package/dist/chunk-UFZKLBCF.js +108 -0
  114. package/dist/chunk-UFZKLBCF.js.map +1 -0
  115. package/dist/{chunk-MQIZAD4A.js → chunk-UKKSMZYT.js} +76 -22
  116. package/dist/chunk-UKKSMZYT.js.map +1 -0
  117. package/dist/chunk-W5L2JSBY.js +40 -0
  118. package/dist/chunk-W5L2JSBY.js.map +1 -0
  119. package/dist/chunk-Y45PPBDV.js +105 -0
  120. package/dist/chunk-Y45PPBDV.js.map +1 -0
  121. package/dist/chunk-Y6LYKFXY.js +43 -0
  122. package/dist/chunk-Y6LYKFXY.js.map +1 -0
  123. package/dist/collapsible-panel.d.ts +66 -0
  124. package/dist/collapsible-panel.js +63 -0
  125. package/dist/collapsible-panel.js.map +1 -0
  126. package/dist/device-class.d.ts +62 -0
  127. package/dist/device-class.js +103 -0
  128. package/dist/device-class.js.map +1 -0
  129. package/dist/disclosure-arrow.d.ts +14 -0
  130. package/dist/disclosure-arrow.js +4 -0
  131. package/dist/disclosure-arrow.js.map +1 -0
  132. package/dist/divider-sides-267FA7sY.d.ts +4 -0
  133. package/dist/empty-state.d.ts +1 -1
  134. package/dist/empty-state.js +1 -1
  135. package/dist/floating-toolbar.d.ts +28 -0
  136. package/dist/floating-toolbar.js +3 -0
  137. package/dist/floating-toolbar.js.map +1 -0
  138. package/dist/index.d.ts +20 -9
  139. package/dist/index.js +29 -18
  140. package/dist/list-action-row.d.ts +52 -0
  141. package/dist/list-action-row.js +5 -0
  142. package/dist/list-action-row.js.map +1 -0
  143. package/dist/list-header.d.ts +64 -0
  144. package/dist/list-header.js +7 -0
  145. package/dist/list-header.js.map +1 -0
  146. package/dist/list-inset-control.d.ts +16 -0
  147. package/dist/list-inset-control.js +3 -0
  148. package/dist/list-inset-control.js.map +1 -0
  149. package/dist/list-inset-text.d.ts +25 -0
  150. package/dist/list-inset-text.js +3 -0
  151. package/dist/list-inset-text.js.map +1 -0
  152. package/dist/list-item.d.ts +33 -0
  153. package/dist/list-item.js +5 -0
  154. package/dist/list-item.js.map +1 -0
  155. package/dist/list.d.ts +19 -0
  156. package/dist/list.js +3 -0
  157. package/dist/list.js.map +1 -0
  158. package/dist/loading-spinner.js +1 -1
  159. package/dist/nav-stack.d.ts +38 -0
  160. package/dist/nav-stack.js +5 -0
  161. package/dist/nav-stack.js.map +1 -0
  162. package/dist/pane.d.ts +49 -0
  163. package/dist/pane.js +4 -0
  164. package/dist/pane.js.map +1 -0
  165. package/dist/panel-header.d.ts +42 -0
  166. package/dist/panel-header.js +7 -0
  167. package/dist/panel-header.js.map +1 -0
  168. package/dist/resizable-region.d.ts +3 -1
  169. package/dist/resizable-region.js +1 -1
  170. package/dist/segmented-control.d.ts +8 -6
  171. package/dist/segmented-control.js +2 -1
  172. package/dist/select-register.d.ts +5 -1
  173. package/dist/select-register.js +3 -0
  174. package/dist/select-register.js.map +1 -1
  175. package/dist/select.d.ts +15 -6
  176. package/dist/select.js +2 -1
  177. package/dist/skeleton.d.ts +24 -0
  178. package/dist/skeleton.js +3 -0
  179. package/dist/skeleton.js.map +1 -0
  180. package/dist/split-view.d.ts +42 -0
  181. package/dist/split-view.js +81 -0
  182. package/dist/split-view.js.map +1 -0
  183. package/dist/state-banner.d.ts +8 -3
  184. package/dist/state-banner.js +2 -1
  185. package/dist/styles/app-tab.css +152 -0
  186. package/dist/styles/catalog.css +575 -0
  187. package/dist/styles/collapsible-panel.css +146 -0
  188. package/dist/styles/disclosure-arrow.css +23 -0
  189. package/dist/styles/empty-state.css +47 -0
  190. package/dist/styles/floating-toolbar.css +38 -0
  191. package/dist/styles/foundation.css +362 -0
  192. package/dist/styles/layout.css +55 -0
  193. package/dist/styles/list-action-row.css +160 -0
  194. package/dist/styles/list-header.css +160 -0
  195. package/dist/styles/list-inset-control.css +7 -0
  196. package/dist/styles/list-inset-text.css +14 -0
  197. package/dist/styles/list-item.css +123 -0
  198. package/dist/styles/list.css +43 -0
  199. package/dist/styles/loading-spinner.css +21 -0
  200. package/dist/styles/lucide-icon.css +6 -0
  201. package/dist/styles/nav-stack.css +111 -0
  202. package/dist/styles/pane.css +62 -0
  203. package/dist/styles/panel-header.css +64 -0
  204. package/dist/styles/resizable-region.css +111 -0
  205. package/{src → dist/styles}/segmented-control.css +58 -31
  206. package/dist/styles/select.css +140 -0
  207. package/dist/styles/skeleton.css +31 -0
  208. package/dist/styles/split-view.css +35 -0
  209. package/dist/styles/state-banner.css +198 -0
  210. package/dist/styles/styles.css +24 -0
  211. package/dist/styles/sunken-panel.css +22 -0
  212. package/dist/styles/tab-bar.css +45 -0
  213. package/dist/styles/tab-scaffold.css +84 -0
  214. package/dist/styles/token-search-field.css +289 -0
  215. package/dist/styles/toolbar-control-group.css +225 -0
  216. package/dist/styles/toolbar-text.css +92 -0
  217. package/dist/styles/toolbar.css +97 -0
  218. package/dist/styles/value-table.css +75 -0
  219. package/dist/styles/webawesome.css +399 -0
  220. package/dist/styles/workbench.css +94 -0
  221. package/dist/sunken-panel.d.ts +19 -0
  222. package/dist/sunken-panel.js +3 -0
  223. package/dist/sunken-panel.js.map +1 -0
  224. package/dist/tab-bar.d.ts +10 -2
  225. package/dist/tab-bar.js +1 -1
  226. package/dist/tab-scaffold.d.ts +30 -0
  227. package/dist/tab-scaffold.js +51 -0
  228. package/dist/tab-scaffold.js.map +1 -0
  229. package/dist/token-search-field.d.ts +59 -0
  230. package/dist/token-search-field.js +4 -0
  231. package/dist/token-search-field.js.map +1 -0
  232. package/dist/toolbar-control-group.d.ts +11 -5
  233. package/dist/toolbar-control-group.js +1 -1
  234. package/dist/toolbar-text.d.ts +31 -4
  235. package/dist/toolbar-text.js +2 -1
  236. package/dist/toolbar.d.ts +5 -3
  237. package/dist/toolbar.js +1 -1
  238. package/dist/value-table.d.ts +13 -3
  239. package/dist/value-table.js +2 -1
  240. package/dist/webawesome.d.ts +100 -0
  241. package/dist/webawesome.js +3 -0
  242. package/dist/webawesome.js.map +1 -0
  243. package/dist/wire-catalog.d.ts +57 -0
  244. package/dist/wire-catalog.js +302 -0
  245. package/dist/wire-catalog.js.map +1 -0
  246. package/dist/wire-nav-stack.d.ts +15 -0
  247. package/dist/wire-nav-stack.js +103 -0
  248. package/dist/wire-nav-stack.js.map +1 -0
  249. package/dist/wire-resizable-regions.d.ts +1 -1
  250. package/dist/wire-resizable-regions.js +1 -1
  251. package/dist/wire-sidebar.d.ts +43 -0
  252. package/dist/wire-sidebar.js +128 -0
  253. package/dist/wire-sidebar.js.map +1 -0
  254. package/dist/wire-tab-bars.d.ts +18 -2
  255. package/dist/wire-tab-bars.js +1 -1
  256. package/dist/wire-tab-scaffold.d.ts +11 -0
  257. package/dist/wire-tab-scaffold.js +21 -0
  258. package/dist/wire-tab-scaffold.js.map +1 -0
  259. package/dist/wire-token-search-fields.d.ts +111 -0
  260. package/dist/wire-token-search-fields.js +5 -0
  261. package/dist/wire-token-search-fields.js.map +1 -0
  262. package/dist/workbench.d.ts +33 -0
  263. package/dist/workbench.js +64 -0
  264. package/dist/workbench.js.map +1 -0
  265. package/docs/accessibility.md +124 -4
  266. package/docs/app-layouts.md +61 -0
  267. package/docs/catalog.md +364 -0
  268. package/docs/collapsible-panel.md +129 -0
  269. package/docs/component-contract.md +312 -5
  270. package/docs/component-selection.md +219 -0
  271. package/docs/design/templates/empty-state/filtered-dark.svg +1 -0
  272. package/docs/design/templates/empty-state/filtered.svg +1 -0
  273. package/docs/design/templates/empty-state/with-action-dark.svg +1 -0
  274. package/docs/design/templates/empty-state/with-action.svg +1 -0
  275. package/docs/design/templates/empty-state-dark.svg +1 -0
  276. package/docs/design/templates/empty-state.svg +1 -0
  277. package/docs/design/templates/list/compact-dark.svg +1 -0
  278. package/docs/design/templates/list/compact.svg +1 -0
  279. package/docs/design/templates/list/stack-dark.svg +1 -0
  280. package/docs/design/templates/list/stack.svg +1 -0
  281. package/docs/design/templates/list-action-row/default-dark.svg +1 -0
  282. package/docs/design/templates/list-action-row/default.svg +1 -0
  283. package/docs/design/templates/list-action-row/selected-dark.svg +1 -0
  284. package/docs/design/templates/list-action-row/selected.svg +1 -0
  285. package/docs/design/templates/list-action-row-dark.svg +1 -0
  286. package/docs/design/templates/list-action-row.svg +1 -0
  287. package/docs/design/templates/list-dark.svg +1 -0
  288. package/docs/design/templates/list-header/action-dark.svg +1 -0
  289. package/docs/design/templates/list-header/action.svg +1 -0
  290. package/docs/design/templates/list-header/count-dark.svg +1 -0
  291. package/docs/design/templates/list-header/count.svg +1 -0
  292. package/docs/design/templates/list-header/toggle-collapsed-dark.svg +1 -0
  293. package/docs/design/templates/list-header/toggle-collapsed.svg +1 -0
  294. package/docs/design/templates/list-header/toggle-expanded-dark.svg +1 -0
  295. package/docs/design/templates/list-header/toggle-expanded.svg +1 -0
  296. package/docs/design/templates/list-header-dark.svg +1 -0
  297. package/docs/design/templates/list-header.svg +1 -0
  298. package/docs/design/templates/list-item/default-dark.svg +1 -0
  299. package/docs/design/templates/list-item/default.svg +1 -0
  300. package/docs/design/templates/list-item/multiline-dark.svg +1 -0
  301. package/docs/design/templates/list-item/multiline.svg +1 -0
  302. package/docs/design/templates/list-item/selected-dark.svg +1 -0
  303. package/docs/design/templates/list-item/selected.svg +1 -0
  304. package/docs/design/templates/list-item/trailing-dark.svg +1 -0
  305. package/docs/design/templates/list-item/trailing.svg +1 -0
  306. package/docs/design/templates/list-item-dark.svg +1 -0
  307. package/docs/design/templates/list-item.svg +1 -0
  308. package/docs/design/templates/list.svg +1 -0
  309. package/docs/design/templates/panel-header/icon-actions-dark.svg +1 -0
  310. package/docs/design/templates/panel-header/icon-actions.svg +1 -0
  311. package/docs/design/templates/panel-header/icon-summary-actions-dark.svg +1 -0
  312. package/docs/design/templates/panel-header/icon-summary-actions.svg +1 -0
  313. package/docs/design/templates/panel-header/no-icon-dark.svg +1 -0
  314. package/docs/design/templates/panel-header/no-icon.svg +1 -0
  315. package/docs/design/templates/panel-header/page-heading-dark.svg +1 -0
  316. package/docs/design/templates/panel-header/page-heading.svg +1 -0
  317. package/docs/design/templates/panel-header/title-only-dark.svg +1 -0
  318. package/docs/design/templates/panel-header/title-only.svg +1 -0
  319. package/docs/design/templates/panel-header-dark.svg +1 -0
  320. package/docs/design/templates/panel-header.svg +1 -0
  321. package/docs/design/templates/segmented-control/equal-dark.svg +1 -0
  322. package/docs/design/templates/segmented-control/equal.svg +1 -0
  323. package/docs/design/templates/segmented-control/pill-small-dark.svg +1 -0
  324. package/docs/design/templates/segmented-control/pill-small.svg +1 -0
  325. package/docs/design/templates/segmented-control-dark.svg +1 -0
  326. package/docs/design/templates/segmented-control.svg +1 -0
  327. package/docs/design/templates/skeleton/avatar-dark.svg +1 -0
  328. package/docs/design/templates/skeleton/avatar.svg +1 -0
  329. package/docs/design/templates/skeleton/block-dark.svg +1 -0
  330. package/docs/design/templates/skeleton/block.svg +1 -0
  331. package/docs/design/templates/skeleton/lines-dark.svg +1 -0
  332. package/docs/design/templates/skeleton/lines.svg +1 -0
  333. package/docs/design/templates/skeleton-dark.svg +1 -0
  334. package/docs/design/templates/skeleton.svg +1 -0
  335. package/docs/design/templates/state-banner/danger-dark.svg +1 -0
  336. package/docs/design/templates/state-banner/danger.svg +1 -0
  337. package/docs/design/templates/state-banner/info-badge-dark.svg +1 -0
  338. package/docs/design/templates/state-banner/info-badge.svg +1 -0
  339. package/docs/design/templates/state-banner/info-dark.svg +1 -0
  340. package/docs/design/templates/state-banner/info.svg +1 -0
  341. package/docs/design/templates/state-banner/success-dark.svg +1 -0
  342. package/docs/design/templates/state-banner/success.svg +1 -0
  343. package/docs/design/templates/state-banner/warning-dark.svg +1 -0
  344. package/docs/design/templates/state-banner/warning.svg +1 -0
  345. package/docs/design/templates/state-banner-dark.svg +1 -0
  346. package/docs/design/templates/state-banner.svg +1 -0
  347. package/docs/design/templates/tab-bar/workspace-tabs-dark.svg +1 -0
  348. package/docs/design/templates/tab-bar/workspace-tabs.svg +1 -0
  349. package/docs/design/templates/tab-bar-dark.svg +1 -0
  350. package/docs/design/templates/tab-bar.svg +1 -0
  351. package/docs/design/templates/token-search-field/empty-dark.svg +1 -0
  352. package/docs/design/templates/token-search-field/empty.svg +1 -0
  353. package/docs/design/templates/token-search-field/tokens-dark.svg +1 -0
  354. package/docs/design/templates/token-search-field/tokens.svg +1 -0
  355. package/docs/design/templates/token-search-field-dark.svg +1 -0
  356. package/docs/design/templates/token-search-field.svg +1 -0
  357. package/docs/design/templates/toolbar/title-and-actions-dark.svg +1 -0
  358. package/docs/design/templates/toolbar/title-and-actions.svg +1 -0
  359. package/docs/design/templates/toolbar-control-group/borderless-single-dark.svg +1 -0
  360. package/docs/design/templates/toolbar-control-group/borderless-single.svg +1 -0
  361. package/docs/design/templates/toolbar-control-group/icon-buttons-dark.svg +1 -0
  362. package/docs/design/templates/toolbar-control-group/icon-buttons.svg +1 -0
  363. package/docs/design/templates/toolbar-control-group/push-buttons-dark.svg +1 -0
  364. package/docs/design/templates/toolbar-control-group/push-buttons.svg +1 -0
  365. package/docs/design/templates/toolbar-control-group/with-text-dark.svg +1 -0
  366. package/docs/design/templates/toolbar-control-group/with-text.svg +1 -0
  367. package/docs/design/templates/toolbar-control-group-dark.svg +1 -0
  368. package/docs/design/templates/toolbar-control-group.svg +1 -0
  369. package/docs/design/templates/toolbar-dark.svg +1 -0
  370. package/docs/design/templates/toolbar-text/default-dark.svg +1 -0
  371. package/docs/design/templates/toolbar-text/default.svg +1 -0
  372. package/docs/design/templates/toolbar-text/large-dark.svg +1 -0
  373. package/docs/design/templates/toolbar-text/large.svg +1 -0
  374. package/docs/design/templates/toolbar-text/small-dark.svg +1 -0
  375. package/docs/design/templates/toolbar-text/small.svg +1 -0
  376. package/docs/design/templates/toolbar-text-dark.svg +1 -0
  377. package/docs/design/templates/toolbar-text.svg +1 -0
  378. package/docs/design/templates/toolbar.svg +1 -0
  379. package/docs/design/templates/value-table/details-dark.svg +1 -0
  380. package/docs/design/templates/value-table/details.svg +1 -0
  381. package/docs/design/templates/value-table-dark.svg +1 -0
  382. package/docs/design/templates/value-table.svg +1 -0
  383. package/docs/design/templates.md +130 -0
  384. package/docs/design-philosophy.md +59 -1
  385. package/docs/device-class.md +54 -0
  386. package/docs/examples/application-ui-profile.json +60 -0
  387. package/docs/examples/command-palette-adapter.tsx +120 -0
  388. package/docs/examples/component-catalog-extension-v2.json +81 -0
  389. package/docs/examples/component-catalog-extension.json +45 -0
  390. package/docs/layout.md +150 -0
  391. package/docs/nav-stack.md +56 -0
  392. package/docs/recipes.md +167 -0
  393. package/docs/split-view.md +49 -0
  394. package/docs/sunken-panel.md +53 -0
  395. package/docs/tab-scaffold.md +50 -0
  396. package/docs/type-contracts.md +102 -0
  397. package/docs/ui-analyzer.md +86 -0
  398. package/docs/ui-doctor.md +84 -0
  399. package/docs/ui-evaluator.md +122 -0
  400. package/docs/ux-demo.md +23 -9
  401. package/docs/webawesome-theme.md +87 -7
  402. package/docs/workbench.md +73 -0
  403. package/doctor/cli.mjs +115 -0
  404. package/doctor/config.schema.json +68 -0
  405. package/doctor/eslint-diagnostics.d.mts +8 -0
  406. package/doctor/eslint-diagnostics.mjs +7 -0
  407. package/doctor/index.d.mts +116 -0
  408. package/doctor/index.mjs +1257 -0
  409. package/doctor/report.schema.json +118 -0
  410. package/evaluator/cli.mjs +89 -0
  411. package/evaluator/index.d.mts +90 -0
  412. package/evaluator/index.mjs +1138 -0
  413. package/evaluator/report.schema.json +152 -0
  414. package/llms.txt +197 -14
  415. package/package.json +228 -46
  416. package/traversal-exclusions.mjs +27 -0
  417. package/ux-demo/recipes/app-shell.tsx +228 -0
  418. package/ux-demo/recipes/collapsible-sidebar.tsx +223 -0
  419. package/ux-demo/recipes/compact-toolbar.tsx +145 -0
  420. package/ux-demo/recipes/composer-form.tsx +151 -0
  421. package/ux-demo/recipes/list-detail-dialog.tsx +181 -0
  422. package/ux-demo/recipes/list-workspace-states.tsx +183 -0
  423. package/ux-demo/recipes/loaders.ts +36 -0
  424. package/ux-demo/recipes/loading-inspector.tsx +164 -0
  425. package/ux-demo/recipes/mount-recipe.ts +64 -0
  426. package/ux-demo/recipes/navigation-sidebar.tsx +137 -0
  427. package/ux-demo/recipes/navigation-stack.tsx +118 -0
  428. package/ux-demo/recipes/recipes.css +448 -0
  429. package/ux-demo/recipes/types.ts +19 -0
  430. package/ux-demo/recipes/workspace-header.tsx +67 -0
  431. package/dist/browser/dialog-header.js +0 -3
  432. package/dist/browser/menu-header.js +0 -3
  433. package/dist/browser/menu-item.js +0 -3
  434. package/dist/browser/page-header.js +0 -3
  435. package/dist/chunk-2PES33HS.js +0 -13
  436. package/dist/chunk-2PES33HS.js.map +0 -1
  437. package/dist/chunk-3O7ZEUW2.js +0 -27
  438. package/dist/chunk-3O7ZEUW2.js.map +0 -1
  439. package/dist/chunk-4HHCYSGT.js +0 -79
  440. package/dist/chunk-4HHCYSGT.js.map +0 -1
  441. package/dist/chunk-55DATV3A.js +0 -10
  442. package/dist/chunk-55DATV3A.js.map +0 -1
  443. package/dist/chunk-723YNJBH.js +0 -17
  444. package/dist/chunk-723YNJBH.js.map +0 -1
  445. package/dist/chunk-DAFFDO33.js +0 -14
  446. package/dist/chunk-DAFFDO33.js.map +0 -1
  447. package/dist/chunk-GY5WH7TO.js +0 -10
  448. package/dist/chunk-GY5WH7TO.js.map +0 -1
  449. package/dist/chunk-MBR3TYNL.js +0 -14
  450. package/dist/chunk-MBR3TYNL.js.map +0 -1
  451. package/dist/chunk-MFKMHK5W.js +0 -10
  452. package/dist/chunk-MFKMHK5W.js.map +0 -1
  453. package/dist/chunk-MQIZAD4A.js.map +0 -1
  454. package/dist/chunk-NHXX4JI5.js +0 -28
  455. package/dist/chunk-NHXX4JI5.js.map +0 -1
  456. package/dist/chunk-OPCJRCYO.js +0 -19
  457. package/dist/chunk-OPCJRCYO.js.map +0 -1
  458. package/dist/chunk-T5XNMVOI.js +0 -24
  459. package/dist/chunk-T5XNMVOI.js.map +0 -1
  460. package/dist/chunk-TRNBHPNW.js.map +0 -1
  461. package/dist/chunk-VHW5YNIB.js +0 -17
  462. package/dist/chunk-VHW5YNIB.js.map +0 -1
  463. package/dist/chunk-VKH2JLDZ.js +0 -10
  464. package/dist/chunk-VKH2JLDZ.js.map +0 -1
  465. package/dist/chunk-WVPYVDXY.js +0 -15
  466. package/dist/chunk-WVPYVDXY.js.map +0 -1
  467. package/dist/chunk-WY4CAEPG.js +0 -14
  468. package/dist/chunk-WY4CAEPG.js.map +0 -1
  469. package/dist/dialog-header.d.ts +0 -14
  470. package/dist/dialog-header.js +0 -3
  471. package/dist/dialog-header.js.map +0 -1
  472. package/dist/menu-header.d.ts +0 -15
  473. package/dist/menu-header.js +0 -3
  474. package/dist/menu-header.js.map +0 -1
  475. package/dist/menu-item.d.ts +0 -22
  476. package/dist/menu-item.js +0 -3
  477. package/dist/menu-item.js.map +0 -1
  478. package/dist/page-header.d.ts +0 -9
  479. package/dist/page-header.js +0 -3
  480. package/dist/page-header.js.map +0 -1
  481. package/src/app-tab.css +0 -20
  482. package/src/dialog-header.css +0 -9
  483. package/src/empty-state.css +0 -6
  484. package/src/foundation.css +0 -106
  485. package/src/loading-spinner.css +0 -4
  486. package/src/lucide-icon.css +0 -1
  487. package/src/menu-header.css +0 -13
  488. package/src/menu-item.css +0 -12
  489. package/src/page-header.css +0 -3
  490. package/src/resizable-region.css +0 -19
  491. package/src/select.css +0 -18
  492. package/src/state-banner.css +0 -31
  493. package/src/styles.css +0 -18
  494. package/src/tab-bar.css +0 -4
  495. package/src/toolbar-control-group.css +0 -25
  496. package/src/toolbar-text.css +0 -4
  497. package/src/toolbar.css +0 -9
  498. package/src/value-table.css +0 -5
  499. package/src/webawesome.css +0 -178
@@ -0,0 +1,4675 @@
1
+ {
2
+ "$schema": "./component-catalog-v2.schema.json",
3
+ "schemaVersion": 2,
4
+ "package": "@kerfjs/ui",
5
+ "compatibility": {
6
+ "v1Catalog": "./component-catalog.json",
7
+ "identity": "package:id"
8
+ },
9
+ "entries": [
10
+ {
11
+ "key": "@kerfjs/ui:lucide-icon",
12
+ "package": "@kerfjs/ui",
13
+ "id": "lucide-icon",
14
+ "name": "LucideIcon",
15
+ "kind": "component",
16
+ "source": "kerf",
17
+ "parents": { "mode": "any", "entries": [] },
18
+ "contexts": ["application-ui"],
19
+ "zones": [],
20
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
21
+ "state": [
22
+ { "id": "icon choice", "owner": "application", "required": false },
23
+ { "id": "meaningful label", "owner": "application", "required": false }
24
+ ],
25
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
26
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
27
+ "layout": {
28
+ "roles": ["foundation"],
29
+ "geometry": { "margin": "none", "border": "none", "padding": "none" }
30
+ },
31
+ "accessibility": {
32
+ "obligations": [
33
+ "Decorative icons are aria-hidden; meaningful icons require a label."
34
+ ]
35
+ },
36
+ "boundaries": {
37
+ "rootClass": null,
38
+ "publicClasses": [],
39
+ "publicTokens": []
40
+ },
41
+ "diagnostics": [],
42
+ "provenance": {
43
+ "selection": "ai/component-catalog.json",
44
+ "composition": "generated-permissive-default"
45
+ }
46
+ },
47
+ {
48
+ "key": "@kerfjs/ui:disclosure-arrow",
49
+ "package": "@kerfjs/ui",
50
+ "id": "disclosure-arrow",
51
+ "name": "DisclosureArrow",
52
+ "kind": "component",
53
+ "source": "kerf",
54
+ "parents": { "mode": "any", "entries": [] },
55
+ "contexts": ["application-ui"],
56
+ "zones": [],
57
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
58
+ "state": [
59
+ { "id": "open state", "owner": "application", "required": false },
60
+ { "id": "interaction", "owner": "application", "required": false },
61
+ {
62
+ "id": "accessible control label",
63
+ "owner": "application",
64
+ "required": false
65
+ }
66
+ ],
67
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
68
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
69
+ "layout": {
70
+ "roles": ["foundation"],
71
+ "geometry": { "margin": "none", "border": "none", "padding": "none" }
72
+ },
73
+ "accessibility": {
74
+ "obligations": [
75
+ "The arrow is decorative; expose expanded state through aria-expanded on its owning control and keep that control's accessible name stable."
76
+ ]
77
+ },
78
+ "boundaries": {
79
+ "rootClass": "kui-disclosure-arrow",
80
+ "publicClasses": ["kui-disclosure-arrow"],
81
+ "publicTokens": [
82
+ "--kui-disclosure-arrow-duration",
83
+ "--kui-disclosure-arrow-size"
84
+ ]
85
+ },
86
+ "diagnostics": [],
87
+ "provenance": {
88
+ "selection": "ai/component-catalog.json",
89
+ "composition": "generated-permissive-default"
90
+ }
91
+ },
92
+ {
93
+ "key": "@kerfjs/ui:webawesome-theme",
94
+ "package": "@kerfjs/ui",
95
+ "id": "webawesome-theme",
96
+ "name": "Web Awesome theme",
97
+ "kind": "composition",
98
+ "source": "kerf",
99
+ "parents": { "mode": "any", "entries": [] },
100
+ "contexts": ["application-ui"],
101
+ "zones": [],
102
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
103
+ "state": [
104
+ {
105
+ "id": "individual component registration",
106
+ "owner": "application",
107
+ "required": false
108
+ },
109
+ {
110
+ "id": "semantic token overrides",
111
+ "owner": "application",
112
+ "required": false
113
+ }
114
+ ],
115
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
116
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
117
+ "layout": {
118
+ "roles": ["foundation"],
119
+ "geometry": { "margin": "child", "border": "child", "padding": "child" }
120
+ },
121
+ "accessibility": {
122
+ "obligations": [
123
+ "Preserve Web Awesome semantics and Kerf focus/contrast tokens."
124
+ ]
125
+ },
126
+ "boundaries": {
127
+ "rootClass": null,
128
+ "publicClasses": [],
129
+ "publicTokens": [
130
+ "--kui-disclosure-icon-scale",
131
+ "--kui-wa-carousel-control-size",
132
+ "--kui-wa-carousel-dot-hit-size",
133
+ "--kui-wa-carousel-dot-size",
134
+ "--kui-wa-carousel-icon-size",
135
+ "--kui-wa-popover-arrow-size"
136
+ ]
137
+ },
138
+ "diagnostics": [],
139
+ "provenance": {
140
+ "selection": "ai/component-catalog.json",
141
+ "composition": "generated-permissive-default"
142
+ }
143
+ },
144
+ {
145
+ "key": "@kerfjs/ui:foundation",
146
+ "package": "@kerfjs/ui",
147
+ "id": "foundation",
148
+ "name": "Foundation tokens",
149
+ "kind": "composition",
150
+ "source": "kerf",
151
+ "parents": { "mode": "any", "entries": [] },
152
+ "contexts": ["application-ui"],
153
+ "zones": [],
154
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
155
+ "state": [
156
+ {
157
+ "id": "application theme overrides",
158
+ "owner": "application",
159
+ "required": false
160
+ },
161
+ {
162
+ "id": "responsive policy at the cataloged device-class breakpoints",
163
+ "owner": "application",
164
+ "required": false
165
+ }
166
+ ],
167
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
168
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
169
+ "layout": {
170
+ "roles": ["foundation"],
171
+ "geometry": { "margin": "none", "border": "none", "padding": "none" }
172
+ },
173
+ "accessibility": {
174
+ "obligations": [
175
+ "Preserve semantic contrast relationships and the visible focus ring when overriding foundation colors."
176
+ ]
177
+ },
178
+ "boundaries": {
179
+ "rootClass": null,
180
+ "publicClasses": [],
181
+ "publicTokens": [
182
+ "--kui-font-sans",
183
+ "--kui-font-mono",
184
+ "--kui-font-2xs",
185
+ "--kui-font-xs",
186
+ "--kui-font-s",
187
+ "--kui-font-m",
188
+ "--kui-font-l",
189
+ "--kui-font-2xl",
190
+ "--kui-font-weight-semibold",
191
+ "--kui-space-none",
192
+ "--kui-space-2xs",
193
+ "--kui-space-xs",
194
+ "--kui-space-s",
195
+ "--kui-space-m",
196
+ "--kui-space-l",
197
+ "--kui-space-xl",
198
+ "--kui-bp-mobile",
199
+ "--kui-bp-tablet",
200
+ "--kui-bp-desktop",
201
+ "--kui-bp-xl-desktop",
202
+ "--kui-layout-inline-margin",
203
+ "--kui-layout-item-border-width",
204
+ "--kui-layout-item-padding",
205
+ "--kui-layout-item-gap",
206
+ "--kui-layout-content-gap",
207
+ "--kui-layout-control-gap",
208
+ "--kui-layout-metadata-gap",
209
+ "--kui-layout-rounded-radius",
210
+ "--kui-layout-pill-radius",
211
+ "--kui-toolbar-group-inner-size",
212
+ "--kui-toolbar-group-size",
213
+ "--kui-toolbar-gap",
214
+ "--kui-radius-s",
215
+ "--kui-radius-m",
216
+ "--kui-radius-l",
217
+ "--kui-radius-circle",
218
+ "--kui-radius-pill",
219
+ "--kui-disclosure-icon-scale",
220
+ "--kui-color-surface",
221
+ "--kui-color-surface-raised",
222
+ "--kui-color-surface-lowered",
223
+ "--kui-color-text",
224
+ "--kui-color-text-quiet",
225
+ "--kui-color-text-link",
226
+ "--kui-color-neutral-fill-quiet",
227
+ "--kui-color-neutral-fill-normal",
228
+ "--kui-color-neutral-fill-loud",
229
+ "--kui-color-neutral-border-quiet",
230
+ "--kui-color-neutral-border-normal",
231
+ "--kui-color-neutral-border-loud",
232
+ "--kui-color-neutral-on-quiet",
233
+ "--kui-color-neutral-on-normal",
234
+ "--kui-color-neutral-on-loud",
235
+ "--kui-color-brand-fill-loud",
236
+ "--kui-color-brand-fill-quiet",
237
+ "--kui-color-brand-fill-normal",
238
+ "--kui-color-brand-border-quiet",
239
+ "--kui-color-brand-border-normal",
240
+ "--kui-color-brand-border-loud",
241
+ "--kui-color-brand-on-quiet",
242
+ "--kui-color-brand-on-normal",
243
+ "--kui-color-brand-on-loud",
244
+ "--kui-color-brand-on-fill",
245
+ "--kui-color-success-fill-loud",
246
+ "--kui-color-success-fill-quiet",
247
+ "--kui-color-success-fill-normal",
248
+ "--kui-color-success-border-quiet",
249
+ "--kui-color-success-border-normal",
250
+ "--kui-color-success-border-loud",
251
+ "--kui-color-success-on-quiet",
252
+ "--kui-color-success-on-normal",
253
+ "--kui-color-success-on-loud",
254
+ "--kui-color-success-on-fill",
255
+ "--kui-color-warning-fill-loud",
256
+ "--kui-color-warning-fill-quiet",
257
+ "--kui-color-warning-fill-normal",
258
+ "--kui-color-warning-border-quiet",
259
+ "--kui-color-warning-border-normal",
260
+ "--kui-color-warning-border-loud",
261
+ "--kui-color-warning-on-quiet",
262
+ "--kui-color-warning-on-normal",
263
+ "--kui-color-warning-on-loud",
264
+ "--kui-color-warning-on-fill",
265
+ "--kui-color-danger-fill-loud",
266
+ "--kui-color-danger-fill-quiet",
267
+ "--kui-color-danger-fill-normal",
268
+ "--kui-color-danger-border-quiet",
269
+ "--kui-color-danger-border-normal",
270
+ "--kui-color-danger-border-loud",
271
+ "--kui-color-danger-on-quiet",
272
+ "--kui-color-danger-on-normal",
273
+ "--kui-color-danger-on-loud",
274
+ "--kui-color-border",
275
+ "--kui-color-border-quiet",
276
+ "--kui-color-accent",
277
+ "--kui-color-accent-text",
278
+ "--kui-color-success",
279
+ "--kui-color-success-text",
280
+ "--kui-color-warning",
281
+ "--kui-color-warning-text",
282
+ "--kui-color-danger",
283
+ "--kui-color-danger-text",
284
+ "--kui-focus-ring",
285
+ "--kui-shadow-s",
286
+ "--kui-shadow-l"
287
+ ]
288
+ },
289
+ "diagnostics": [],
290
+ "provenance": {
291
+ "selection": "ai/component-catalog.json",
292
+ "composition": "generated-permissive-default"
293
+ }
294
+ },
295
+ {
296
+ "key": "@kerfjs/ui:layout",
297
+ "package": "@kerfjs/ui",
298
+ "id": "layout",
299
+ "name": "Application layout",
300
+ "kind": "composition",
301
+ "source": "kerf",
302
+ "parents": { "mode": "any", "entries": [] },
303
+ "contexts": ["application-ui"],
304
+ "zones": [],
305
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
306
+ "state": [
307
+ { "id": "layout hierarchy", "owner": "application", "required": false },
308
+ { "id": "reading width", "owner": "application", "required": false },
309
+ {
310
+ "id": "responsive relocation",
311
+ "owner": "application",
312
+ "required": false
313
+ },
314
+ {
315
+ "id": "pane visibility and matching collapse/restore controls",
316
+ "owner": "application",
317
+ "required": false
318
+ }
319
+ ],
320
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
321
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
322
+ "layout": {
323
+ "roles": ["foundation"],
324
+ "geometry": { "margin": "child", "border": "child", "padding": "child" }
325
+ },
326
+ "accessibility": {
327
+ "obligations": [
328
+ "Keep reading and focus order coherent when controls wrap or panes relocate, and preserve one scroll owner per pane.",
329
+ "When collapse replaces one control with its counterpart in another toolbar, move focus to the newly rendered restore or collapse control."
330
+ ]
331
+ },
332
+ "boundaries": {
333
+ "rootClass": "kui-content",
334
+ "publicClasses": [
335
+ "kui-content",
336
+ "kui-content-item",
337
+ "kui-content-item--pill",
338
+ "kui-control-cluster",
339
+ "kui-inline-metadata",
340
+ "kui-scroll-owner"
341
+ ],
342
+ "publicTokens": [
343
+ "--kui-layout-control-gap",
344
+ "--kui-layout-content-gap",
345
+ "--kui-layout-inline-margin",
346
+ "--kui-layout-item-border-width",
347
+ "--kui-layout-item-padding",
348
+ "--kui-layout-metadata-gap",
349
+ "--kui-layout-pill-radius",
350
+ "--kui-layout-rounded-radius"
351
+ ]
352
+ },
353
+ "diagnostics": [],
354
+ "provenance": {
355
+ "selection": "ai/component-catalog.json",
356
+ "composition": "generated-permissive-default"
357
+ }
358
+ },
359
+ {
360
+ "key": "@kerfjs/ui:pane",
361
+ "package": "@kerfjs/ui",
362
+ "id": "pane",
363
+ "name": "Pane",
364
+ "kind": "component",
365
+ "source": "kerf",
366
+ "parents": { "mode": "any", "entries": [] },
367
+ "contexts": ["application-ui"],
368
+ "zones": [],
369
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
370
+ "state": [
371
+ {
372
+ "id": "root and content semantics",
373
+ "owner": "application",
374
+ "required": false
375
+ },
376
+ {
377
+ "id": "accessible labels",
378
+ "owner": "application",
379
+ "required": false
380
+ },
381
+ {
382
+ "id": "header, content, and footer children",
383
+ "owner": "application",
384
+ "required": false
385
+ },
386
+ {
387
+ "id": "which logical boundaries show separators",
388
+ "owner": "application",
389
+ "required": false
390
+ },
391
+ {
392
+ "id": "responsive placement and visibility",
393
+ "owner": "application",
394
+ "required": false
395
+ }
396
+ ],
397
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
398
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
399
+ "layout": {
400
+ "roles": ["structure"],
401
+ "geometry": {
402
+ "margin": "child",
403
+ "border": "conditional",
404
+ "padding": "child",
405
+ "notes": [
406
+ "The pane is unpadded; separators are independently opt-in on logical edges and default off."
407
+ ]
408
+ }
409
+ },
410
+ "accessibility": {
411
+ "obligations": [
412
+ "Choose semantic root and content elements that match the region and provide labels for landmark elements.",
413
+ "Keep fixed header/footer chrome outside the single scrolling content slot so reading and focus order remain coherent."
414
+ ]
415
+ },
416
+ "boundaries": {
417
+ "rootClass": "kui-pane",
418
+ "publicClasses": [
419
+ "kui-pane",
420
+ "kui-pane__content",
421
+ "kui-pane__footer",
422
+ "kui-pane__header",
423
+ "kui-pane__toolbar"
424
+ ],
425
+ "publicTokens": [
426
+ "--kui-pane-separator-color",
427
+ "--kui-pane-separator-width"
428
+ ]
429
+ },
430
+ "diagnostics": [],
431
+ "provenance": {
432
+ "selection": "ai/component-catalog.json",
433
+ "composition": "generated-permissive-default"
434
+ }
435
+ },
436
+ {
437
+ "key": "@kerfjs/ui:workbench",
438
+ "package": "@kerfjs/ui",
439
+ "id": "workbench",
440
+ "name": "Workbench",
441
+ "kind": "component",
442
+ "source": "kerf",
443
+ "parents": { "mode": "any", "entries": [] },
444
+ "contexts": ["application-ui"],
445
+ "zones": [],
446
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
447
+ "state": [
448
+ {
449
+ "id": "panel presence and content",
450
+ "owner": "application",
451
+ "required": false
452
+ },
453
+ { "id": "collapsed state", "owner": "application", "required": false },
454
+ { "id": "panel sizes", "owner": "application", "required": false },
455
+ {
456
+ "id": "responsive replacement below desktop",
457
+ "owner": "application",
458
+ "required": false
459
+ },
460
+ {
461
+ "id": "collapse controls and focus policy",
462
+ "owner": "application",
463
+ "required": false
464
+ }
465
+ ],
466
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
467
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
468
+ "layout": {
469
+ "roles": ["structure"],
470
+ "geometry": {
471
+ "margin": "none",
472
+ "border": "self",
473
+ "padding": "child",
474
+ "notes": [
475
+ "Workbench owns the rail and drawer separators; each region's content owns its internal padding and scroll behavior."
476
+ ]
477
+ }
478
+ },
479
+ "accessibility": {
480
+ "obligations": [
481
+ "Give the Workbench and each meaningful rail or drawer an accessible label.",
482
+ "Keep collapse controls outside the disappearing region and move focus when a controlled rerender replaces a collapse control with its restore control."
483
+ ]
484
+ },
485
+ "boundaries": {
486
+ "rootClass": "kui-workbench",
487
+ "publicClasses": [
488
+ "kui-workbench",
489
+ "kui-workbench__rail",
490
+ "kui-workbench__rail--left",
491
+ "kui-workbench__rail--right",
492
+ "kui-workbench__center",
493
+ "kui-workbench__main",
494
+ "kui-workbench__drawer",
495
+ "kui-workbench__panel-content"
496
+ ],
497
+ "publicTokens": [
498
+ "--kui-workbench-rail-width",
499
+ "--kui-workbench-drawer-height"
500
+ ]
501
+ },
502
+ "diagnostics": [],
503
+ "provenance": {
504
+ "selection": "ai/component-catalog.json",
505
+ "composition": "generated-permissive-default"
506
+ }
507
+ },
508
+ {
509
+ "key": "@kerfjs/ui:sunken-panel",
510
+ "package": "@kerfjs/ui",
511
+ "id": "sunken-panel",
512
+ "name": "SunkenPanel",
513
+ "kind": "component",
514
+ "source": "kerf",
515
+ "parents": { "mode": "any", "entries": [] },
516
+ "contexts": ["application-ui"],
517
+ "zones": [],
518
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
519
+ "state": [
520
+ {
521
+ "id": "region semantics and accessible name",
522
+ "owner": "application",
523
+ "required": false
524
+ },
525
+ { "id": "corner shape", "owner": "application", "required": false },
526
+ { "id": "scroll ownership", "owner": "application", "required": false },
527
+ {
528
+ "id": "child ordering and content",
529
+ "owner": "application",
530
+ "required": false
531
+ }
532
+ ],
533
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
534
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
535
+ "layout": {
536
+ "roles": ["structure"],
537
+ "geometry": {
538
+ "margin": "none",
539
+ "border": "none",
540
+ "padding": "self",
541
+ "notes": [
542
+ "The root owns one 8px inset and vertical gap; children own their borders and internal geometry."
543
+ ]
544
+ }
545
+ },
546
+ "accessibility": {
547
+ "obligations": [
548
+ "Pass ariaLabel only when the surface is a distinct named region; otherwise it remains a non-landmark grouping."
549
+ ]
550
+ },
551
+ "boundaries": {
552
+ "rootClass": "kui-sunken-panel",
553
+ "publicClasses": ["kui-sunken-panel"],
554
+ "publicTokens": [
555
+ "--kui-sunken-panel-background",
556
+ "--kui-sunken-panel-foreground",
557
+ "--kui-sunken-panel-gap",
558
+ "--kui-sunken-panel-padding",
559
+ "--kui-sunken-panel-radius"
560
+ ]
561
+ },
562
+ "diagnostics": [],
563
+ "provenance": {
564
+ "selection": "ai/component-catalog.json",
565
+ "composition": "generated-permissive-default"
566
+ }
567
+ },
568
+ {
569
+ "key": "@kerfjs/ui:toolbar",
570
+ "package": "@kerfjs/ui",
571
+ "id": "toolbar",
572
+ "name": "Toolbar",
573
+ "kind": "component",
574
+ "source": "kerf",
575
+ "parents": { "mode": "any", "entries": [] },
576
+ "contexts": ["application-chrome", "panel-header"],
577
+ "zones": [
578
+ {
579
+ "id": "leading",
580
+ "accepts": ["toolbar-text", "toolbar-control-group"],
581
+ "cardinality": { "min": 0, "max": "unbounded" },
582
+ "exclusiveWith": []
583
+ },
584
+ {
585
+ "id": "center",
586
+ "accepts": ["toolbar-text", "toolbar-control-group"],
587
+ "cardinality": { "min": 0, "max": "unbounded" },
588
+ "exclusiveWith": []
589
+ },
590
+ {
591
+ "id": "trailing",
592
+ "accepts": ["toolbar-text", "toolbar-control-group"],
593
+ "cardinality": { "min": 0, "max": "unbounded" },
594
+ "exclusiveWith": []
595
+ }
596
+ ],
597
+ "children": {
598
+ "mode": "listed",
599
+ "concepts": ["toolbar-text", "toolbar-control-group"],
600
+ "requiredConcepts": []
601
+ },
602
+ "state": [
603
+ { "id": "actions", "owner": "application", "required": false },
604
+ {
605
+ "id": "command availability",
606
+ "owner": "application",
607
+ "required": false
608
+ },
609
+ {
610
+ "id": "responsive relocation",
611
+ "owner": "application",
612
+ "required": false
613
+ }
614
+ ],
615
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
616
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
617
+ "layout": {
618
+ "roles": ["structure"],
619
+ "geometry": {
620
+ "margin": "none",
621
+ "border": "conditional",
622
+ "padding": "self",
623
+ "notes": [
624
+ "Padding belongs to the toolbar; dividerSides selects any canonical combination of its physical top, right, bottom, and left edges."
625
+ ]
626
+ }
627
+ },
628
+ "accessibility": {
629
+ "obligations": [
630
+ "Supply a label when the toolbar needs an accessible name."
631
+ ]
632
+ },
633
+ "boundaries": {
634
+ "rootClass": "kui-toolbar",
635
+ "publicClasses": [
636
+ "kui-toolbar",
637
+ "kui-toolbar__center",
638
+ "kui-toolbar__leading",
639
+ "kui-toolbar__trailing"
640
+ ],
641
+ "publicTokens": [
642
+ "--kui-color-border",
643
+ "--kui-font-sans",
644
+ "--kui-toolbar-divider-color"
645
+ ]
646
+ },
647
+ "diagnostics": [
648
+ {
649
+ "id": "KUI-C101",
650
+ "severity": "error",
651
+ "when": "a direct zone child is neither ToolbarText nor ToolbarControlGroup",
652
+ "message": "Wrap toolbar controls in ToolbarControlGroup; only ToolbarText and ToolbarControlGroup are direct zone children."
653
+ }
654
+ ],
655
+ "provenance": {
656
+ "selection": "ai/component-catalog.json",
657
+ "composition": "docs/component-selection.md#toolbar-composition"
658
+ }
659
+ },
660
+ {
661
+ "key": "@kerfjs/ui:toolbar-control-group",
662
+ "package": "@kerfjs/ui",
663
+ "id": "toolbar-control-group",
664
+ "name": "ToolbarControlGroup",
665
+ "kind": "component",
666
+ "source": "kerf",
667
+ "parents": {
668
+ "mode": "listed",
669
+ "entries": ["@kerfjs/ui:toolbar", "@kerfjs/ui:panel-header"]
670
+ },
671
+ "contexts": ["toolbar-zone"],
672
+ "zones": [
673
+ {
674
+ "id": "controls",
675
+ "accepts": ["control"],
676
+ "cardinality": { "min": 1, "max": "unbounded" },
677
+ "exclusiveWith": []
678
+ }
679
+ ],
680
+ "children": {
681
+ "mode": "listed",
682
+ "concepts": ["control"],
683
+ "requiredConcepts": ["control"]
684
+ },
685
+ "state": [
686
+ { "id": "actions", "owner": "application", "required": false },
687
+ { "id": "pressed state", "owner": "application", "required": false },
688
+ { "id": "expanded state", "owner": "application", "required": false }
689
+ ],
690
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
691
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
692
+ "layout": {
693
+ "roles": ["structure"],
694
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
695
+ },
696
+ "accessibility": {
697
+ "obligations": [
698
+ "Name the group when its relationship is not evident from context."
699
+ ]
700
+ },
701
+ "boundaries": {
702
+ "rootClass": "kui-toolbar-control-group",
703
+ "publicClasses": ["kui-toolbar-control-group"],
704
+ "publicTokens": [
705
+ "--kui-color-brand-on-quiet",
706
+ "--kui-color-neutral-border-loud",
707
+ "--kui-color-neutral-border-normal",
708
+ "--kui-color-neutral-fill-loud",
709
+ "--kui-color-neutral-fill-normal",
710
+ "--kui-color-neutral-on-loud",
711
+ "--kui-color-neutral-on-quiet",
712
+ "--kui-color-surface",
713
+ "--kui-focus-ring",
714
+ "--kui-shadow-s",
715
+ "--kui-toolbar-control-background",
716
+ "--kui-toolbar-control-border",
717
+ "--kui-toolbar-control-color",
718
+ "--kui-toolbar-control-dark-border",
719
+ "--kui-toolbar-control-hover-background",
720
+ "--kui-toolbar-control-pressed-background",
721
+ "--kui-toolbar-control-pressed-border",
722
+ "--kui-toolbar-control-pressed-color",
723
+ "--kui-toolbar-control-selected-background",
724
+ "--kui-toolbar-control-selected-color",
725
+ "--kui-toolbar-control-selected-shadow"
726
+ ]
727
+ },
728
+ "diagnostics": [],
729
+ "provenance": {
730
+ "selection": "ai/component-catalog.json",
731
+ "composition": "docs/component-selection.md#toolbar-composition"
732
+ }
733
+ },
734
+ {
735
+ "key": "@kerfjs/ui:floating-toolbar",
736
+ "package": "@kerfjs/ui",
737
+ "id": "floating-toolbar",
738
+ "name": "FloatingToolbar",
739
+ "kind": "component",
740
+ "source": "kerf",
741
+ "parents": { "mode": "any", "entries": [] },
742
+ "contexts": ["application-ui"],
743
+ "zones": [],
744
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
745
+ "state": [
746
+ { "id": "controls", "owner": "application", "required": false },
747
+ { "id": "position", "owner": "application", "required": false },
748
+ { "id": "visibility", "owner": "application", "required": false }
749
+ ],
750
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
751
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
752
+ "layout": {
753
+ "roles": ["structure"],
754
+ "geometry": { "margin": "none", "border": "child", "padding": "child" }
755
+ },
756
+ "accessibility": {
757
+ "obligations": [
758
+ "Give the toolbar an accessible name (label is required — it exposes role=\"toolbar\")."
759
+ ]
760
+ },
761
+ "boundaries": {
762
+ "rootClass": "kui-floating-toolbar",
763
+ "publicClasses": ["kui-floating-toolbar"],
764
+ "publicTokens": [
765
+ "--kui-floating-toolbar-inset",
766
+ "--kui-space-m",
767
+ "--kui-space-xs"
768
+ ]
769
+ },
770
+ "diagnostics": [],
771
+ "provenance": {
772
+ "selection": "ai/component-catalog.json",
773
+ "composition": "generated-permissive-default"
774
+ }
775
+ },
776
+ {
777
+ "key": "@kerfjs/ui:toolbar-text",
778
+ "package": "@kerfjs/ui",
779
+ "id": "toolbar-text",
780
+ "name": "ToolbarText",
781
+ "kind": "component",
782
+ "source": "kerf",
783
+ "parents": { "mode": "any", "entries": [] },
784
+ "contexts": ["application-ui"],
785
+ "zones": [],
786
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
787
+ "state": [
788
+ { "id": "text", "owner": "application", "required": false },
789
+ {
790
+ "id": "responsive priority",
791
+ "owner": "application",
792
+ "required": false
793
+ }
794
+ ],
795
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
796
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
797
+ "layout": {
798
+ "roles": ["structure"],
799
+ "geometry": { "margin": "none", "border": "none", "padding": "none" }
800
+ },
801
+ "accessibility": {
802
+ "obligations": [
803
+ "Plain text is not a heading; pass headingLevel to expose role=heading + aria-level for a page/section title."
804
+ ]
805
+ },
806
+ "boundaries": {
807
+ "rootClass": "kui-toolbar-text",
808
+ "publicClasses": ["kui-toolbar-text"],
809
+ "publicTokens": [
810
+ "--kui-color-neutral-on-quiet",
811
+ "--kui-font-m",
812
+ "--kui-font-mono",
813
+ "--kui-font-s",
814
+ "--kui-font-xs"
815
+ ]
816
+ },
817
+ "diagnostics": [],
818
+ "provenance": {
819
+ "selection": "ai/component-catalog.json",
820
+ "composition": "generated-permissive-default"
821
+ }
822
+ },
823
+ {
824
+ "key": "@kerfjs/ui:headers",
825
+ "package": "@kerfjs/ui",
826
+ "id": "headers",
827
+ "name": "Header composition",
828
+ "kind": "composition",
829
+ "source": "kerf",
830
+ "parents": { "mode": "any", "entries": [] },
831
+ "contexts": ["application-ui"],
832
+ "zones": [],
833
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
834
+ "state": [
835
+ { "id": "scope hierarchy", "owner": "application", "required": false },
836
+ { "id": "copy", "owner": "application", "required": false },
837
+ { "id": "actions", "owner": "application", "required": false }
838
+ ],
839
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
840
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
841
+ "layout": {
842
+ "roles": ["structure"],
843
+ "geometry": { "margin": "child", "border": "child", "padding": "child" }
844
+ },
845
+ "accessibility": {
846
+ "obligations": [
847
+ "Preserve heading and description relationships for the containing surface."
848
+ ]
849
+ },
850
+ "boundaries": {
851
+ "rootClass": null,
852
+ "publicClasses": [],
853
+ "publicTokens": []
854
+ },
855
+ "diagnostics": [],
856
+ "provenance": {
857
+ "selection": "ai/component-catalog.json",
858
+ "composition": "generated-permissive-default"
859
+ }
860
+ },
861
+ {
862
+ "key": "@kerfjs/ui:panel-header",
863
+ "package": "@kerfjs/ui",
864
+ "id": "panel-header",
865
+ "name": "PanelHeader",
866
+ "kind": "component",
867
+ "source": "kerf",
868
+ "parents": { "mode": "any", "entries": [] },
869
+ "contexts": ["page-header", "panel-header", "dialog-header"],
870
+ "zones": [
871
+ {
872
+ "id": "title",
873
+ "accepts": ["text"],
874
+ "cardinality": { "min": 1, "max": 1 },
875
+ "exclusiveWith": []
876
+ },
877
+ {
878
+ "id": "subtitle",
879
+ "accepts": ["text"],
880
+ "cardinality": { "min": 0, "max": 1 },
881
+ "exclusiveWith": []
882
+ },
883
+ {
884
+ "id": "controls",
885
+ "accepts": ["control"],
886
+ "cardinality": { "min": 0, "max": "unbounded" },
887
+ "exclusiveWith": []
888
+ }
889
+ ],
890
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
891
+ "state": [
892
+ { "id": "placeholder", "owner": "controlled", "required": false }
893
+ ],
894
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
895
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
896
+ "layout": {
897
+ "roles": ["structure"],
898
+ "geometry": { "margin": "none", "border": "child", "padding": "child" }
899
+ },
900
+ "accessibility": {
901
+ "obligations": [
902
+ "Connect the title id and any provided summary id to the dialog or panel host.",
903
+ "Pass the trailing actions as a labeled ToolbarControlGroup when the group needs an accessible name.",
904
+ "For a page/view title pass headingLevel (usually 1) so the title exposes role=heading + aria-level as a heading landmark; omit it for a dialog title, which is referenced via aria-labelledby to titleId."
905
+ ]
906
+ },
907
+ "boundaries": {
908
+ "rootClass": "kui-panel-header",
909
+ "publicClasses": [
910
+ "kui-panel-header",
911
+ "kui-panel-header__icon",
912
+ "kui-panel-header__summary"
913
+ ],
914
+ "publicTokens": [
915
+ "--kui-color-brand-fill-quiet",
916
+ "--kui-color-brand-on-quiet",
917
+ "--kui-color-text-quiet",
918
+ "--kui-panel-header-icon-background",
919
+ "--kui-panel-header-icon-border",
920
+ "--kui-panel-header-icon-foreground"
921
+ ]
922
+ },
923
+ "diagnostics": [
924
+ {
925
+ "id": "KUI-C102",
926
+ "severity": "error",
927
+ "when": "the title is absent",
928
+ "message": "PanelHeader requires a title that names its page, panel, or dialog."
929
+ }
930
+ ],
931
+ "provenance": {
932
+ "selection": "ai/component-catalog.json",
933
+ "composition": "docs/component-selection.md#problem-to-component-matrix"
934
+ }
935
+ },
936
+ {
937
+ "key": "@kerfjs/ui:value-table",
938
+ "package": "@kerfjs/ui",
939
+ "id": "value-table",
940
+ "name": "ValueTable",
941
+ "kind": "component",
942
+ "source": "kerf",
943
+ "parents": { "mode": "any", "entries": [] },
944
+ "contexts": ["application-ui"],
945
+ "zones": [],
946
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
947
+ "state": [
948
+ { "id": "values", "owner": "application", "required": false },
949
+ { "id": "formatting", "owner": "application", "required": false },
950
+ { "id": "empty policy", "owner": "application", "required": false }
951
+ ],
952
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
953
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
954
+ "layout": {
955
+ "roles": ["structure"],
956
+ "geometry": { "margin": "self", "border": "self", "padding": "self" }
957
+ },
958
+ "accessibility": {
959
+ "obligations": [
960
+ "Name ValueTable with its label; ValueTableRow supplies dt/dd semantics, and row icons stay decorative unless meaning requires an accessible label."
961
+ ]
962
+ },
963
+ "boundaries": {
964
+ "rootClass": "kui-value-table",
965
+ "publicClasses": [
966
+ "kui-value-table",
967
+ "kui-value-table__row",
968
+ "kui-value-table__icon",
969
+ "kui-value-table__label"
970
+ ],
971
+ "publicTokens": [
972
+ "--kui-color-border",
973
+ "--kui-color-surface-lowered",
974
+ "--kui-color-text",
975
+ "--kui-color-text-quiet",
976
+ "--kui-font-weight-semibold",
977
+ "--kui-layout-inline-margin",
978
+ "--kui-layout-item-gap",
979
+ "--kui-layout-item-padding",
980
+ "--kui-space-2xs",
981
+ "--kui-value-table-background",
982
+ "--kui-value-table-border",
983
+ "--kui-value-table-icon-size"
984
+ ]
985
+ },
986
+ "diagnostics": [],
987
+ "provenance": {
988
+ "selection": "ai/component-catalog.json",
989
+ "composition": "generated-permissive-default"
990
+ }
991
+ },
992
+ {
993
+ "key": "@kerfjs/ui:list",
994
+ "package": "@kerfjs/ui",
995
+ "id": "list",
996
+ "name": "List",
997
+ "kind": "component",
998
+ "source": "kerf",
999
+ "parents": { "mode": "any", "entries": [] },
1000
+ "contexts": ["application-ui", "navigation-list", "vertical-layout"],
1001
+ "zones": [],
1002
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
1003
+ "state": [
1004
+ {
1005
+ "id": "child semantics and content",
1006
+ "owner": "application",
1007
+ "required": false
1008
+ },
1009
+ {
1010
+ "id": "the bounded height needed for scrolling",
1011
+ "owner": "application",
1012
+ "required": false
1013
+ },
1014
+ {
1015
+ "id": "gap, flex, and divider choices",
1016
+ "owner": "application",
1017
+ "required": false
1018
+ }
1019
+ ],
1020
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
1021
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
1022
+ "layout": {
1023
+ "roles": ["navigation"],
1024
+ "geometry": {
1025
+ "margin": "none",
1026
+ "border": "conditional",
1027
+ "padding": "none",
1028
+ "notes": [
1029
+ "List adds no margin or padding; dividerSides draws only the selected physical edges without changing box geometry."
1030
+ ]
1031
+ }
1032
+ },
1033
+ "accessibility": {
1034
+ "obligations": [
1035
+ "List adds layout only and no list role; children retain responsibility for their native or ARIA semantics.",
1036
+ "Give a scrollable List a bounded block size and keep keyboard focus visible as its contents scroll."
1037
+ ]
1038
+ },
1039
+ "boundaries": {
1040
+ "rootClass": "kui-list",
1041
+ "publicClasses": ["kui-list"],
1042
+ "publicTokens": [
1043
+ "--kui-color-border",
1044
+ "--kui-layout-item-gap",
1045
+ "--kui-list-divider-color",
1046
+ "--kui-list-gap"
1047
+ ]
1048
+ },
1049
+ "diagnostics": [],
1050
+ "provenance": {
1051
+ "selection": "ai/component-catalog.json",
1052
+ "composition": "docs/component-selection.md#problem-to-component-matrix"
1053
+ }
1054
+ },
1055
+ {
1056
+ "key": "@kerfjs/ui:list-header",
1057
+ "package": "@kerfjs/ui",
1058
+ "id": "list-header",
1059
+ "name": "ListHeader",
1060
+ "kind": "component",
1061
+ "source": "kerf",
1062
+ "parents": { "mode": "any", "entries": [] },
1063
+ "contexts": ["navigation-list"],
1064
+ "zones": [],
1065
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
1066
+ "state": [{ "id": "expanded", "owner": "controlled", "required": false }],
1067
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
1068
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
1069
+ "layout": {
1070
+ "roles": ["navigation"],
1071
+ "geometry": { "margin": "self", "border": "self", "padding": "self" }
1072
+ },
1073
+ "accessibility": {
1074
+ "obligations": [
1075
+ "When toggle mode is used, the application reveals matching content and keeps expanded state synchronized.",
1076
+ "The owning control retains a stable accessible name."
1077
+ ]
1078
+ },
1079
+ "boundaries": {
1080
+ "rootClass": "kui-list-header",
1081
+ "publicClasses": [
1082
+ "kui-list-header",
1083
+ "kui-list-header__action",
1084
+ "kui-list-header__action-layer",
1085
+ "kui-list-header__badge",
1086
+ "kui-list-header__count",
1087
+ "kui-list-header__label",
1088
+ "kui-list-header__title",
1089
+ "kui-list-header__toggle"
1090
+ ],
1091
+ "publicTokens": [
1092
+ "--kui-color-neutral-border-quiet",
1093
+ "--kui-color-neutral-fill-quiet",
1094
+ "--kui-color-neutral-on-quiet",
1095
+ "--kui-focus-ring",
1096
+ "--kui-font-xs",
1097
+ "--kui-list-header-action-icon-size",
1098
+ "--kui-list-header-color",
1099
+ "--kui-layout-inline-margin",
1100
+ "--kui-layout-item-gap",
1101
+ "--kui-layout-item-padding",
1102
+ "--kui-layout-pill-radius",
1103
+ "--kui-list-header-count-font-size",
1104
+ "--kui-list-header-hover-background"
1105
+ ]
1106
+ },
1107
+ "diagnostics": [
1108
+ {
1109
+ "id": "KUI-C103",
1110
+ "severity": "error",
1111
+ "when": "toggle mode does not reveal matching controlled content",
1112
+ "message": "ListHeader expanded state must match real revealed content."
1113
+ }
1114
+ ],
1115
+ "provenance": {
1116
+ "selection": "ai/component-catalog.json",
1117
+ "composition": "docs/accessibility.md#shared-rules"
1118
+ }
1119
+ },
1120
+ {
1121
+ "key": "@kerfjs/ui:list-action-row",
1122
+ "package": "@kerfjs/ui",
1123
+ "id": "list-action-row",
1124
+ "name": "ListActionRow",
1125
+ "kind": "component",
1126
+ "source": "kerf",
1127
+ "parents": { "mode": "any", "entries": [] },
1128
+ "contexts": ["application-ui"],
1129
+ "zones": [],
1130
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
1131
+ "state": [
1132
+ { "id": "routing", "owner": "application", "required": false },
1133
+ { "id": "selection", "owner": "application", "required": false },
1134
+ { "id": "action handling", "owner": "application", "required": false },
1135
+ {
1136
+ "id": "domain data attributes",
1137
+ "owner": "application",
1138
+ "required": false
1139
+ },
1140
+ {
1141
+ "id": "popover or context-menu policy",
1142
+ "owner": "application",
1143
+ "required": false
1144
+ }
1145
+ ],
1146
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
1147
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
1148
+ "layout": {
1149
+ "roles": ["navigation"],
1150
+ "geometry": { "margin": "self", "border": "self", "padding": "self" }
1151
+ },
1152
+ "accessibility": {
1153
+ "obligations": [
1154
+ "The noninteractive root contains two sibling native buttons in primary-then-trailing focus order; each button has its own action, item identity, accessible name, and disabled state.",
1155
+ "Selection semantics are exposed only by the primary button; label, icon, and trailingActionIcon are dormant SafeHtml and must not contain interactive descendants; never place an interactive descendant in ListItem.trailing."
1156
+ ]
1157
+ },
1158
+ "boundaries": {
1159
+ "rootClass": "kui-list-action-row",
1160
+ "publicClasses": [
1161
+ "kui-list-action-row",
1162
+ "kui-list-action-row__icon",
1163
+ "kui-list-action-row__label",
1164
+ "kui-list-action-row__primary",
1165
+ "kui-list-action-row__trailing-action"
1166
+ ],
1167
+ "publicTokens": [
1168
+ "--kui-color-brand-border-quiet",
1169
+ "--kui-color-brand-fill-normal",
1170
+ "--kui-color-neutral-border-normal",
1171
+ "--kui-color-neutral-fill-normal",
1172
+ "--kui-color-neutral-fill-quiet",
1173
+ "--kui-color-neutral-on-normal",
1174
+ "--kui-focus-ring",
1175
+ "--kui-layout-inline-margin",
1176
+ "--kui-layout-item-gap",
1177
+ "--kui-layout-item-padding",
1178
+ "--kui-layout-rounded-radius",
1179
+ "--kui-radius-pill",
1180
+ "--kui-list-action-row-background",
1181
+ "--kui-list-action-row-border",
1182
+ "--kui-list-action-row-color",
1183
+ "--kui-list-action-row-hover-background",
1184
+ "--kui-list-action-row-hover-border",
1185
+ "--kui-list-action-row-selected-background",
1186
+ "--kui-list-action-row-selected-border",
1187
+ "--kui-list-action-row-selected-color",
1188
+ "--kui-list-action-row-trailing-hover-background"
1189
+ ]
1190
+ },
1191
+ "diagnostics": [],
1192
+ "provenance": {
1193
+ "selection": "ai/component-catalog.json",
1194
+ "composition": "generated-permissive-default"
1195
+ }
1196
+ },
1197
+ {
1198
+ "key": "@kerfjs/ui:list-item",
1199
+ "package": "@kerfjs/ui",
1200
+ "id": "list-item",
1201
+ "name": "ListItem",
1202
+ "kind": "component",
1203
+ "source": "kerf",
1204
+ "parents": { "mode": "any", "entries": [] },
1205
+ "contexts": ["application-ui"],
1206
+ "zones": [],
1207
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
1208
+ "state": [
1209
+ { "id": "routing", "owner": "application", "required": false },
1210
+ { "id": "selection", "owner": "application", "required": false },
1211
+ { "id": "permissions", "owner": "application", "required": false },
1212
+ { "id": "action handling", "owner": "application", "required": false },
1213
+ {
1214
+ "id": "domain data attributes",
1215
+ "owner": "application",
1216
+ "required": false
1217
+ }
1218
+ ],
1219
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
1220
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
1221
+ "layout": {
1222
+ "roles": ["navigation"],
1223
+ "geometry": { "margin": "self", "border": "self", "padding": "self" }
1224
+ },
1225
+ "accessibility": {
1226
+ "obligations": [
1227
+ "Uses native button activation; selected maps to aria-current and pressed to aria-pressed; rootAttributes cannot add role=menuitem or replace owned ARIA; trailing is dormant content and must not contain controls."
1228
+ ]
1229
+ },
1230
+ "boundaries": {
1231
+ "rootClass": "kui-list-item",
1232
+ "publicClasses": [
1233
+ "kui-list-item",
1234
+ "kui-list-item__icon",
1235
+ "kui-list-item__label",
1236
+ "kui-list-item__trailing"
1237
+ ],
1238
+ "publicTokens": [
1239
+ "--kui-color-brand-fill-normal",
1240
+ "--kui-color-neutral-fill-quiet",
1241
+ "--kui-color-neutral-on-normal",
1242
+ "--kui-color-neutral-on-quiet",
1243
+ "--kui-focus-ring",
1244
+ "--kui-list-item-color",
1245
+ "--kui-list-item-hover-background",
1246
+ "--kui-list-item-selected-background",
1247
+ "--kui-list-item-selected-color",
1248
+ "--kui-layout-inline-margin",
1249
+ "--kui-layout-item-gap",
1250
+ "--kui-layout-item-padding",
1251
+ "--kui-layout-rounded-radius"
1252
+ ]
1253
+ },
1254
+ "diagnostics": [],
1255
+ "provenance": {
1256
+ "selection": "ai/component-catalog.json",
1257
+ "composition": "generated-permissive-default"
1258
+ }
1259
+ },
1260
+ {
1261
+ "key": "@kerfjs/ui:list-inset-control",
1262
+ "package": "@kerfjs/ui",
1263
+ "id": "list-inset-control",
1264
+ "name": "ListInsetControl",
1265
+ "kind": "component",
1266
+ "source": "kerf",
1267
+ "parents": { "mode": "any", "entries": [] },
1268
+ "contexts": ["application-ui"],
1269
+ "zones": [],
1270
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
1271
+ "state": [
1272
+ {
1273
+ "id": "the wrapped control and its behavior",
1274
+ "owner": "application",
1275
+ "required": false
1276
+ }
1277
+ ],
1278
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
1279
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
1280
+ "layout": {
1281
+ "roles": ["structure"],
1282
+ "geometry": { "margin": "self", "border": "child", "padding": "child" }
1283
+ },
1284
+ "accessibility": {
1285
+ "obligations": [
1286
+ "A layout wrapper only; it adds no role or name — the wrapped control keeps its own."
1287
+ ]
1288
+ },
1289
+ "boundaries": {
1290
+ "rootClass": "kui-list-inset-control",
1291
+ "publicClasses": ["kui-list-inset-control"],
1292
+ "publicTokens": ["--kui-layout-inline-margin"]
1293
+ },
1294
+ "diagnostics": [],
1295
+ "provenance": {
1296
+ "selection": "ai/component-catalog.json",
1297
+ "composition": "generated-permissive-default"
1298
+ }
1299
+ },
1300
+ {
1301
+ "key": "@kerfjs/ui:list-inset-text",
1302
+ "package": "@kerfjs/ui",
1303
+ "id": "list-inset-text",
1304
+ "name": "ListInsetText",
1305
+ "kind": "component",
1306
+ "source": "kerf",
1307
+ "parents": { "mode": "any", "entries": [] },
1308
+ "contexts": ["application-ui"],
1309
+ "zones": [],
1310
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
1311
+ "state": [
1312
+ { "id": "the text content", "owner": "application", "required": false }
1313
+ ],
1314
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
1315
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
1316
+ "layout": {
1317
+ "roles": ["structure"],
1318
+ "geometry": { "margin": "self", "border": "self", "padding": "self" }
1319
+ },
1320
+ "accessibility": {
1321
+ "obligations": ["A layout wrapper only; it adds no role or name."]
1322
+ },
1323
+ "boundaries": {
1324
+ "rootClass": "kui-list-inset-text",
1325
+ "publicClasses": [
1326
+ "kui-list-inset-text",
1327
+ "kui-list-inset-text--horizontal"
1328
+ ],
1329
+ "publicTokens": []
1330
+ },
1331
+ "diagnostics": [],
1332
+ "provenance": {
1333
+ "selection": "ai/component-catalog.json",
1334
+ "composition": "generated-permissive-default"
1335
+ }
1336
+ },
1337
+ {
1338
+ "key": "@kerfjs/ui:tabs",
1339
+ "package": "@kerfjs/ui",
1340
+ "id": "tabs",
1341
+ "name": "AppTab",
1342
+ "kind": "component",
1343
+ "source": "kerf",
1344
+ "parents": { "mode": "any", "entries": [] },
1345
+ "contexts": ["application-ui"],
1346
+ "zones": [],
1347
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
1348
+ "state": [
1349
+ { "id": "tab identity", "owner": "application", "required": false },
1350
+ { "id": "selection", "owner": "application", "required": false },
1351
+ { "id": "close policy", "owner": "application", "required": false },
1352
+ { "id": "content", "owner": "application", "required": false },
1353
+ {
1354
+ "id": "application data attribute values",
1355
+ "owner": "application",
1356
+ "required": false
1357
+ }
1358
+ ],
1359
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
1360
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
1361
+ "layout": {
1362
+ "roles": ["navigation"],
1363
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
1364
+ },
1365
+ "accessibility": {
1366
+ "obligations": [
1367
+ "Compose in a tablist and pair with an application-owned tabpanel.",
1368
+ "Keep closeIcon decorative and free of interactive descendants; the owning close button supplies its accessible name and interaction.",
1369
+ "Use rootAttributes only for application data-* metadata; component-owned identity, state, action, and role semantics are protected at runtime."
1370
+ ]
1371
+ },
1372
+ "boundaries": {
1373
+ "rootClass": "kui-app-tab",
1374
+ "publicClasses": [
1375
+ "kui-app-tab",
1376
+ "kui-app-tab__close",
1377
+ "kui-app-tab__close-icon",
1378
+ "kui-app-tab__name",
1379
+ "kui-app-tab__select",
1380
+ "kui-app-tab__trailing"
1381
+ ],
1382
+ "publicTokens": [
1383
+ "--kui-app-tab-color",
1384
+ "--kui-app-tab-drop-indicator",
1385
+ "--kui-app-tab-hover-background",
1386
+ "--kui-app-tab-selected-background",
1387
+ "--kui-app-tab-selected-border",
1388
+ "--kui-app-tab-selected-color",
1389
+ "--kui-color-brand-border-normal",
1390
+ "--kui-color-brand-on-quiet",
1391
+ "--kui-color-neutral-border-normal",
1392
+ "--kui-color-neutral-on-quiet",
1393
+ "--kui-color-surface",
1394
+ "--kui-color-text",
1395
+ "--kui-focus-ring",
1396
+ "--kui-font-xs",
1397
+ "--kui-radius-pill",
1398
+ "--kui-shadow-s",
1399
+ "--kui-space-2xs",
1400
+ "--kui-space-xs"
1401
+ ]
1402
+ },
1403
+ "diagnostics": [],
1404
+ "provenance": {
1405
+ "selection": "ai/component-catalog.json",
1406
+ "composition": "generated-permissive-default"
1407
+ }
1408
+ },
1409
+ {
1410
+ "key": "@kerfjs/ui:tab-bar",
1411
+ "package": "@kerfjs/ui",
1412
+ "id": "tab-bar",
1413
+ "name": "TabBar",
1414
+ "kind": "component",
1415
+ "source": "kerf",
1416
+ "parents": { "mode": "any", "entries": [] },
1417
+ "contexts": ["tabpanel-navigation"],
1418
+ "zones": [
1419
+ {
1420
+ "id": "tabs",
1421
+ "accepts": ["app-tab"],
1422
+ "cardinality": { "min": 1, "max": "unbounded" },
1423
+ "exclusiveWith": []
1424
+ }
1425
+ ],
1426
+ "children": {
1427
+ "mode": "listed",
1428
+ "concepts": ["app-tab"],
1429
+ "requiredConcepts": ["app-tab"]
1430
+ },
1431
+ "state": [
1432
+ { "id": "selected-tab", "owner": "controlled", "required": true }
1433
+ ],
1434
+ "wiring": {
1435
+ "required": true,
1436
+ "helpers": ["wireTabBars"],
1437
+ "obligations": [
1438
+ "Retain and invoke the disposer.",
1439
+ "Apply onReorder to application-owned order."
1440
+ ]
1441
+ },
1442
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
1443
+ "layout": {
1444
+ "roles": ["navigation"],
1445
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
1446
+ },
1447
+ "accessibility": {
1448
+ "obligations": [
1449
+ "Each tab controls a matching tabpanel.",
1450
+ "Selection and focus behavior follow the configured activation mode."
1451
+ ]
1452
+ },
1453
+ "boundaries": {
1454
+ "rootClass": "kui-tab-bar",
1455
+ "publicClasses": [
1456
+ "kui-tab-bar",
1457
+ "kui-tab-bar__leading",
1458
+ "kui-tab-bar__tabs",
1459
+ "kui-tab-bar__trailing"
1460
+ ],
1461
+ "publicTokens": ["--kui-tab-bar-background", "--kui-tab-bar-border"]
1462
+ },
1463
+ "diagnostics": [
1464
+ {
1465
+ "id": "KUI-C104",
1466
+ "severity": "error",
1467
+ "when": "wireTabBars is absent",
1468
+ "message": "TabBar requires wireTabBars for keyboard and reorder behavior."
1469
+ }
1470
+ ],
1471
+ "provenance": {
1472
+ "selection": "ai/component-catalog.json",
1473
+ "composition": "docs/accessibility.md#tabs"
1474
+ }
1475
+ },
1476
+ {
1477
+ "key": "@kerfjs/ui:segmented-control",
1478
+ "package": "@kerfjs/ui",
1479
+ "id": "segmented-control",
1480
+ "name": "SegmentedControl",
1481
+ "kind": "component",
1482
+ "source": "kerf",
1483
+ "parents": { "mode": "any", "entries": [] },
1484
+ "contexts": ["compact-exclusive-choice"],
1485
+ "zones": [],
1486
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
1487
+ "state": [{ "id": "value", "owner": "controlled", "required": true }],
1488
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
1489
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
1490
+ "layout": {
1491
+ "roles": ["controls"],
1492
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
1493
+ },
1494
+ "accessibility": {
1495
+ "obligations": [
1496
+ "Every enabled choice remains in sequential tab order.",
1497
+ "Every choice has a meaningful label."
1498
+ ]
1499
+ },
1500
+ "boundaries": {
1501
+ "rootClass": "kui-segmented-control",
1502
+ "publicClasses": [
1503
+ "kui-segmented-control",
1504
+ "kui-segmented-control__item"
1505
+ ],
1506
+ "publicTokens": [
1507
+ "--kui-color-brand-on-quiet",
1508
+ "--kui-color-neutral-border-normal",
1509
+ "--kui-color-neutral-fill-normal",
1510
+ "--kui-color-neutral-on-quiet",
1511
+ "--kui-color-surface",
1512
+ "--kui-focus-ring",
1513
+ "--kui-font-2xs",
1514
+ "--kui-font-weight-semibold",
1515
+ "--kui-font-xs",
1516
+ "--kui-segmented-background",
1517
+ "--kui-segmented-border",
1518
+ "--kui-segmented-foreground",
1519
+ "--kui-segmented-hover-background",
1520
+ "--kui-segmented-item-radius",
1521
+ "--kui-segmented-radius",
1522
+ "--kui-segmented-selected-background",
1523
+ "--kui-segmented-selected-border",
1524
+ "--kui-segmented-selected-foreground",
1525
+ "--kui-segmented-selected-shadow",
1526
+ "--kui-shadow-s",
1527
+ "--kui-toolbar-control-color",
1528
+ "--kui-toolbar-control-hover-background",
1529
+ "--kui-toolbar-control-selected-background",
1530
+ "--kui-toolbar-control-selected-color",
1531
+ "--kui-toolbar-control-selected-shadow"
1532
+ ]
1533
+ },
1534
+ "diagnostics": [],
1535
+ "provenance": {
1536
+ "selection": "ai/component-catalog.json",
1537
+ "composition": "docs/accessibility.md#segmentedcontrol"
1538
+ }
1539
+ },
1540
+ {
1541
+ "key": "@kerfjs/ui:token-search-field",
1542
+ "package": "@kerfjs/ui",
1543
+ "id": "token-search-field",
1544
+ "name": "TokenSearchField",
1545
+ "kind": "component",
1546
+ "source": "kerf",
1547
+ "parents": { "mode": "any", "entries": [] },
1548
+ "contexts": ["structured-search-editor"],
1549
+ "zones": [],
1550
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
1551
+ "state": [
1552
+ { "id": "tokens", "owner": "controlled", "required": true },
1553
+ { "id": "text", "owner": "component", "required": true },
1554
+ { "id": "expanded", "owner": "controlled", "required": false }
1555
+ ],
1556
+ "wiring": {
1557
+ "required": true,
1558
+ "helpers": ["wireTokenSearchFields"],
1559
+ "obligations": [
1560
+ "Retain and invoke the disposer.",
1561
+ "Use readTokenSearchField for DOM-owned text."
1562
+ ]
1563
+ },
1564
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
1565
+ "layout": {
1566
+ "roles": ["controls"],
1567
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
1568
+ },
1569
+ "accessibility": {
1570
+ "obligations": [
1571
+ "Announce result changes when useful and keep tokens atomic during editing.",
1572
+ "Keep leading and trailing controls aligned to the first text line while content wraps.",
1573
+ "Wire Enter to submit without inserting a contenteditable line break and preserve focus plus the text-relative caret across controlled keyboard chip deletion; visual wrapping remains available.",
1574
+ "In collapsible mode, wireTokenSearchFields manages this by default: activating the trigger reveals the searchbox and moves focus into it, Escape on an empty field collapses and returns focus to the trigger, and focus leaving an empty field collapses it; each behavior is individually opt-out."
1575
+ ]
1576
+ },
1577
+ "boundaries": {
1578
+ "rootClass": "kui-token-search",
1579
+ "publicClasses": [
1580
+ "kui-token-search",
1581
+ "kui-token-search__clear",
1582
+ "kui-token-search__editor",
1583
+ "kui-token-search__expand",
1584
+ "kui-token-search__leading",
1585
+ "kui-token-search__token",
1586
+ "kui-token-search__token-edit",
1587
+ "kui-token-search__token-remove",
1588
+ "kui-token-search__trailing"
1589
+ ],
1590
+ "publicTokens": [
1591
+ "--kui-color-accent",
1592
+ "--kui-color-accent-text",
1593
+ "--kui-color-border",
1594
+ "--kui-color-text-link",
1595
+ "--kui-color-surface",
1596
+ "--kui-color-text",
1597
+ "--kui-color-text-quiet",
1598
+ "--kui-focus-ring",
1599
+ "--kui-font-s",
1600
+ "--kui-font-xs",
1601
+ "--kui-radius-pill",
1602
+ "--kui-token-search-background",
1603
+ "--kui-token-search-border",
1604
+ "--kui-token-search-line-size",
1605
+ "--kui-token-search-token-background",
1606
+ "--kui-token-search-token-foreground",
1607
+ "--kui-token-search-expanded-width"
1608
+ ]
1609
+ },
1610
+ "diagnostics": [
1611
+ {
1612
+ "id": "KUI-C105",
1613
+ "severity": "error",
1614
+ "when": "wireTokenSearchFields is absent",
1615
+ "message": "TokenSearchField requires its public wiring helper for keyboard and collapsible behavior."
1616
+ }
1617
+ ],
1618
+ "provenance": {
1619
+ "selection": "ai/component-catalog.json",
1620
+ "composition": "docs/accessibility.md#tokensearchfield"
1621
+ }
1622
+ },
1623
+ {
1624
+ "key": "@kerfjs/ui:resize",
1625
+ "package": "@kerfjs/ui",
1626
+ "id": "resize",
1627
+ "name": "ResizableRegion",
1628
+ "kind": "component",
1629
+ "source": "kerf",
1630
+ "parents": { "mode": "any", "entries": [] },
1631
+ "contexts": ["adjustable-pane-boundary"],
1632
+ "zones": [],
1633
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
1634
+ "state": [{ "id": "size", "owner": "controlled", "required": true }],
1635
+ "wiring": {
1636
+ "required": true,
1637
+ "helpers": ["wireResizableRegions"],
1638
+ "obligations": [
1639
+ "Retain and invoke the disposer.",
1640
+ "Persist committed size in the application when persistence is required."
1641
+ ]
1642
+ },
1643
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
1644
+ "layout": {
1645
+ "roles": ["controls"],
1646
+ "geometry": {
1647
+ "margin": "none",
1648
+ "border": "conditional",
1649
+ "padding": "conditional",
1650
+ "notes": [
1651
+ "The region delegates visible separator geometry and hit-area padding to its orientation-specific handle."
1652
+ ]
1653
+ }
1654
+ },
1655
+ "accessibility": {
1656
+ "obligations": [
1657
+ "Preserve separator naming, value ARIA, and keyboard behavior.",
1658
+ "Keep handleIcon decorative and free of interactive descendants; the separator owns focus, naming, and pointer/keyboard interaction."
1659
+ ]
1660
+ },
1661
+ "boundaries": {
1662
+ "rootClass": "kui-resizable-region",
1663
+ "publicClasses": [
1664
+ "kui-resizable-region",
1665
+ "kui-resizable-region__content",
1666
+ "kui-resizable-region__handle",
1667
+ "kui-resizable-region__handle-icon"
1668
+ ],
1669
+ "publicTokens": [
1670
+ "--kui-color-border",
1671
+ "--kui-color-neutral-on-quiet",
1672
+ "--kui-color-text-link",
1673
+ "--kui-focus-ring",
1674
+ "--kui-radius-s",
1675
+ "--kui-resizable-region-handle-active-color",
1676
+ "--kui-resizable-region-handle-color",
1677
+ "--kui-resizable-region-separator-color",
1678
+ "--kui-resizable-region-size"
1679
+ ]
1680
+ },
1681
+ "diagnostics": [
1682
+ {
1683
+ "id": "KUI-C106",
1684
+ "severity": "error",
1685
+ "when": "wireResizableRegions is absent",
1686
+ "message": "ResizableRegion requires wireResizableRegions for pointer and keyboard operation."
1687
+ }
1688
+ ],
1689
+ "provenance": {
1690
+ "selection": "ai/component-catalog.json",
1691
+ "composition": "docs/accessibility.md#resizableregion"
1692
+ }
1693
+ },
1694
+ {
1695
+ "key": "@kerfjs/ui:select",
1696
+ "package": "@kerfjs/ui",
1697
+ "id": "select",
1698
+ "name": "Select",
1699
+ "kind": "component",
1700
+ "source": "kerf",
1701
+ "parents": { "mode": "any", "entries": [] },
1702
+ "contexts": ["controlled-value-selection"],
1703
+ "zones": [],
1704
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
1705
+ "state": [{ "id": "value", "owner": "controlled", "required": true }],
1706
+ "wiring": {
1707
+ "required": true,
1708
+ "helpers": ["@kerfjs/ui/select/register"],
1709
+ "obligations": [
1710
+ "Import the registration module once in the application."
1711
+ ]
1712
+ },
1713
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
1714
+ "layout": {
1715
+ "roles": ["controls"],
1716
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
1717
+ },
1718
+ "accessibility": {
1719
+ "obligations": [
1720
+ "Verify the live value, standard events, focus, and rendered output."
1721
+ ]
1722
+ },
1723
+ "boundaries": {
1724
+ "rootClass": "kui-select",
1725
+ "publicClasses": [
1726
+ "kui-select",
1727
+ "kui-select--custom-selected",
1728
+ "kui-select--fit-menu",
1729
+ "kui-select__custom-selected",
1730
+ "kui-select__group",
1731
+ "kui-select__group--separated",
1732
+ "kui-select__group-title",
1733
+ "kui-select__icon"
1734
+ ],
1735
+ "publicTokens": [
1736
+ "--kui-color-brand-fill-normal",
1737
+ "--kui-color-brand-on-fill",
1738
+ "--kui-color-neutral-border-quiet",
1739
+ "--kui-color-neutral-on-quiet",
1740
+ "--kui-disclosure-icon-scale",
1741
+ "--kui-font-2xs"
1742
+ ]
1743
+ },
1744
+ "diagnostics": [
1745
+ {
1746
+ "id": "KUI-C107",
1747
+ "severity": "error",
1748
+ "when": "the registration import is absent",
1749
+ "message": "Select requires @kerfjs/ui/select/register once per application."
1750
+ }
1751
+ ],
1752
+ "provenance": {
1753
+ "selection": "ai/component-catalog.json",
1754
+ "composition": "README.md#web-awesome-theme"
1755
+ }
1756
+ },
1757
+ {
1758
+ "key": "@kerfjs/ui:feedback",
1759
+ "package": "@kerfjs/ui",
1760
+ "id": "feedback",
1761
+ "name": "Feedback composition",
1762
+ "kind": "composition",
1763
+ "source": "kerf",
1764
+ "parents": { "mode": "any", "entries": [] },
1765
+ "contexts": ["application-ui"],
1766
+ "zones": [],
1767
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
1768
+ "state": [
1769
+ { "id": "state mapping", "owner": "application", "required": false },
1770
+ { "id": "message lifetime", "owner": "application", "required": false },
1771
+ { "id": "recovery policy", "owner": "application", "required": false }
1772
+ ],
1773
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
1774
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
1775
+ "layout": {
1776
+ "roles": ["feedback"],
1777
+ "geometry": { "margin": "child", "border": "child", "padding": "child" }
1778
+ },
1779
+ "accessibility": {
1780
+ "obligations": [
1781
+ "Choose polite status versus assertive alert deliberately."
1782
+ ]
1783
+ },
1784
+ "boundaries": {
1785
+ "rootClass": null,
1786
+ "publicClasses": [],
1787
+ "publicTokens": []
1788
+ },
1789
+ "diagnostics": [],
1790
+ "provenance": {
1791
+ "selection": "ai/component-catalog.json",
1792
+ "composition": "generated-permissive-default"
1793
+ }
1794
+ },
1795
+ {
1796
+ "key": "@kerfjs/ui:state-banner",
1797
+ "package": "@kerfjs/ui",
1798
+ "id": "state-banner",
1799
+ "name": "StateBanner",
1800
+ "kind": "component",
1801
+ "source": "kerf",
1802
+ "parents": { "mode": "any", "entries": [] },
1803
+ "contexts": ["application-ui"],
1804
+ "zones": [],
1805
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
1806
+ "state": [
1807
+ { "id": "badge content", "owner": "application", "required": false },
1808
+ { "id": "state mapping", "owner": "application", "required": false },
1809
+ { "id": "message lifetime", "owner": "application", "required": false },
1810
+ { "id": "retry behavior", "owner": "application", "required": false },
1811
+ { "id": "copy", "owner": "application", "required": false }
1812
+ ],
1813
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
1814
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
1815
+ "layout": {
1816
+ "roles": ["feedback"],
1817
+ "geometry": { "margin": "self", "border": "self", "padding": "self" }
1818
+ },
1819
+ "accessibility": {
1820
+ "obligations": [
1821
+ "Use alert urgency only for an attention-requiring failure.",
1822
+ "Keep optional badge content terse and do not rely on its tone alone for meaning."
1823
+ ]
1824
+ },
1825
+ "boundaries": {
1826
+ "rootClass": "kui-state-banner",
1827
+ "publicClasses": [
1828
+ "kui-state-banner",
1829
+ "kui-state-banner__action",
1830
+ "kui-state-banner__badge",
1831
+ "kui-state-banner__copy",
1832
+ "kui-state-banner__detail",
1833
+ "kui-state-banner__icon"
1834
+ ],
1835
+ "publicTokens": [
1836
+ "--kui-color-brand-border-quiet",
1837
+ "--kui-color-brand-fill-quiet",
1838
+ "--kui-color-brand-on-fill",
1839
+ "--kui-color-danger-border-quiet",
1840
+ "--kui-color-danger-fill-quiet",
1841
+ "--kui-color-danger-on-quiet",
1842
+ "--kui-color-neutral-border-normal",
1843
+ "--kui-color-neutral-fill-quiet",
1844
+ "--kui-color-neutral-on-normal",
1845
+ "--kui-color-success-border-normal",
1846
+ "--kui-color-success-fill-quiet",
1847
+ "--kui-color-success-on-fill",
1848
+ "--kui-color-surface",
1849
+ "--kui-color-text-link",
1850
+ "--kui-color-warning-border-normal",
1851
+ "--kui-color-warning-fill-quiet",
1852
+ "--kui-color-warning-on-fill",
1853
+ "--kui-font-2xs",
1854
+ "--kui-font-xs",
1855
+ "--kui-radius-pill",
1856
+ "--kui-state-banner-action-background",
1857
+ "--kui-state-banner-action-hover-background",
1858
+ "--kui-state-banner-background",
1859
+ "--kui-state-banner-badge-background",
1860
+ "--kui-state-banner-badge-foreground",
1861
+ "--kui-state-banner-border",
1862
+ "--kui-state-banner-danger-background",
1863
+ "--kui-state-banner-danger-border",
1864
+ "--kui-state-banner-danger-foreground",
1865
+ "--kui-state-banner-detail",
1866
+ "--kui-state-banner-foreground",
1867
+ "--kui-state-banner-info-background",
1868
+ "--kui-state-banner-info-border",
1869
+ "--kui-state-banner-info-foreground",
1870
+ "--kui-state-banner-neutral-background",
1871
+ "--kui-state-banner-neutral-border",
1872
+ "--kui-state-banner-neutral-foreground",
1873
+ "--kui-state-banner-success-background",
1874
+ "--kui-state-banner-success-border",
1875
+ "--kui-state-banner-success-foreground",
1876
+ "--kui-state-banner-warning-background",
1877
+ "--kui-state-banner-warning-border",
1878
+ "--kui-state-banner-warning-foreground"
1879
+ ]
1880
+ },
1881
+ "diagnostics": [],
1882
+ "provenance": {
1883
+ "selection": "ai/component-catalog.json",
1884
+ "composition": "generated-permissive-default"
1885
+ }
1886
+ },
1887
+ {
1888
+ "key": "@kerfjs/ui:empty-state",
1889
+ "package": "@kerfjs/ui",
1890
+ "id": "empty-state",
1891
+ "name": "EmptyState",
1892
+ "kind": "component",
1893
+ "source": "kerf",
1894
+ "parents": { "mode": "any", "entries": [] },
1895
+ "contexts": ["application-ui"],
1896
+ "zones": [],
1897
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
1898
+ "state": [
1899
+ {
1900
+ "id": "empty/busy policy",
1901
+ "owner": "application",
1902
+ "required": false
1903
+ },
1904
+ { "id": "recovery action", "owner": "application", "required": false },
1905
+ { "id": "copy", "owner": "application", "required": false }
1906
+ ],
1907
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
1908
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
1909
+ "layout": {
1910
+ "roles": ["feedback"],
1911
+ "geometry": { "margin": "self", "border": "self", "padding": "self" }
1912
+ },
1913
+ "accessibility": {
1914
+ "obligations": [
1915
+ "Busy state uses aria-busy; the illustration never supplies the only label."
1916
+ ]
1917
+ },
1918
+ "boundaries": {
1919
+ "rootClass": "kui-empty-state",
1920
+ "publicClasses": [
1921
+ "kui-empty-state",
1922
+ "kui-empty-state__action",
1923
+ "kui-empty-state__icon"
1924
+ ],
1925
+ "publicTokens": [
1926
+ "--kui-color-neutral-on-quiet",
1927
+ "--kui-color-text",
1928
+ "--kui-empty-state-foreground",
1929
+ "--kui-empty-state-title",
1930
+ "--kui-font-l",
1931
+ "--kui-font-s",
1932
+ "--kui-space-xl",
1933
+ "--kui-space-xs"
1934
+ ]
1935
+ },
1936
+ "diagnostics": [],
1937
+ "provenance": {
1938
+ "selection": "ai/component-catalog.json",
1939
+ "composition": "generated-permissive-default"
1940
+ }
1941
+ },
1942
+ {
1943
+ "key": "@kerfjs/ui:loading-spinner",
1944
+ "package": "@kerfjs/ui",
1945
+ "id": "loading-spinner",
1946
+ "name": "LoadingSpinner",
1947
+ "kind": "component",
1948
+ "source": "kerf",
1949
+ "parents": { "mode": "any", "entries": [] },
1950
+ "contexts": ["application-ui"],
1951
+ "zones": [],
1952
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
1953
+ "state": [
1954
+ {
1955
+ "id": "loading lifecycle",
1956
+ "owner": "application",
1957
+ "required": false
1958
+ },
1959
+ {
1960
+ "id": "adjacent status copy",
1961
+ "owner": "application",
1962
+ "required": false
1963
+ }
1964
+ ],
1965
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
1966
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
1967
+ "layout": {
1968
+ "roles": ["feedback"],
1969
+ "geometry": { "margin": "none", "border": "none", "padding": "none" }
1970
+ },
1971
+ "accessibility": {
1972
+ "obligations": [
1973
+ "Labeled spinners use role img; decorative spinners are hidden and stop for reduced motion."
1974
+ ]
1975
+ },
1976
+ "boundaries": {
1977
+ "rootClass": "kui-loading-spinner",
1978
+ "publicClasses": ["kui-loading-spinner"],
1979
+ "publicTokens": []
1980
+ },
1981
+ "diagnostics": [],
1982
+ "provenance": {
1983
+ "selection": "ai/component-catalog.json",
1984
+ "composition": "generated-permissive-default"
1985
+ }
1986
+ },
1987
+ {
1988
+ "key": "@kerfjs/ui:skeleton",
1989
+ "package": "@kerfjs/ui",
1990
+ "id": "skeleton",
1991
+ "name": "Skeleton",
1992
+ "kind": "component",
1993
+ "source": "kerf",
1994
+ "parents": { "mode": "any", "entries": [] },
1995
+ "contexts": ["application-ui"],
1996
+ "zones": [],
1997
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
1998
+ "state": [
1999
+ {
2000
+ "id": "loading lifecycle",
2001
+ "owner": "application",
2002
+ "required": false
2003
+ },
2004
+ {
2005
+ "id": "which slots are unknown",
2006
+ "owner": "application",
2007
+ "required": false
2008
+ },
2009
+ {
2010
+ "id": "announcing the loading region",
2011
+ "owner": "application",
2012
+ "required": false
2013
+ }
2014
+ ],
2015
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2016
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2017
+ "layout": {
2018
+ "roles": ["feedback"],
2019
+ "geometry": { "margin": "none", "border": "none", "padding": "none" }
2020
+ },
2021
+ "accessibility": {
2022
+ "obligations": [
2023
+ "Decorative by default (aria-hidden); pass label to announce it as an image. A component in placeholder mode marks itself aria-busy and disables its own controls."
2024
+ ]
2025
+ },
2026
+ "boundaries": {
2027
+ "rootClass": "kui-skeleton",
2028
+ "publicClasses": ["kui-skeleton", "kui-skeleton-lines"],
2029
+ "publicTokens": ["--kui-skeleton-radius"]
2030
+ },
2031
+ "diagnostics": [],
2032
+ "provenance": {
2033
+ "selection": "ai/component-catalog.json",
2034
+ "composition": "generated-permissive-default"
2035
+ }
2036
+ },
2037
+ {
2038
+ "key": "@kerfjs/ui:wa-button",
2039
+ "package": "@kerfjs/ui",
2040
+ "id": "wa-button",
2041
+ "name": "Button",
2042
+ "kind": "component",
2043
+ "source": "webawesome",
2044
+ "parents": { "mode": "any", "entries": [] },
2045
+ "contexts": ["application-ui"],
2046
+ "zones": [],
2047
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2048
+ "state": [],
2049
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2050
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2051
+ "layout": {
2052
+ "roles": ["actions"],
2053
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
2054
+ },
2055
+ "accessibility": { "obligations": [] },
2056
+ "boundaries": {
2057
+ "rootClass": null,
2058
+ "publicClasses": [],
2059
+ "publicTokens": []
2060
+ },
2061
+ "diagnostics": [],
2062
+ "provenance": {
2063
+ "selection": "ai/component-catalog.json",
2064
+ "composition": "generated-permissive-default"
2065
+ }
2066
+ },
2067
+ {
2068
+ "key": "@kerfjs/ui:wa-button-group",
2069
+ "package": "@kerfjs/ui",
2070
+ "id": "wa-button-group",
2071
+ "name": "Button Group",
2072
+ "kind": "component",
2073
+ "source": "webawesome",
2074
+ "parents": { "mode": "any", "entries": [] },
2075
+ "contexts": ["application-ui"],
2076
+ "zones": [],
2077
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2078
+ "state": [],
2079
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2080
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2081
+ "layout": {
2082
+ "roles": ["actions"],
2083
+ "geometry": { "margin": "none", "border": "child", "padding": "child" }
2084
+ },
2085
+ "accessibility": { "obligations": [] },
2086
+ "boundaries": {
2087
+ "rootClass": null,
2088
+ "publicClasses": [],
2089
+ "publicTokens": []
2090
+ },
2091
+ "diagnostics": [],
2092
+ "provenance": {
2093
+ "selection": "ai/component-catalog.json",
2094
+ "composition": "generated-permissive-default"
2095
+ }
2096
+ },
2097
+ {
2098
+ "key": "@kerfjs/ui:wa-copy-button",
2099
+ "package": "@kerfjs/ui",
2100
+ "id": "wa-copy-button",
2101
+ "name": "Copy Button",
2102
+ "kind": "component",
2103
+ "source": "webawesome",
2104
+ "parents": { "mode": "any", "entries": [] },
2105
+ "contexts": ["application-ui"],
2106
+ "zones": [],
2107
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2108
+ "state": [],
2109
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2110
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2111
+ "layout": {
2112
+ "roles": ["actions"],
2113
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
2114
+ },
2115
+ "accessibility": { "obligations": [] },
2116
+ "boundaries": {
2117
+ "rootClass": null,
2118
+ "publicClasses": [],
2119
+ "publicTokens": []
2120
+ },
2121
+ "diagnostics": [],
2122
+ "provenance": {
2123
+ "selection": "ai/component-catalog.json",
2124
+ "composition": "generated-permissive-default"
2125
+ }
2126
+ },
2127
+ {
2128
+ "key": "@kerfjs/ui:wa-dropdown",
2129
+ "package": "@kerfjs/ui",
2130
+ "id": "wa-dropdown",
2131
+ "name": "Dropdown",
2132
+ "kind": "component",
2133
+ "source": "webawesome",
2134
+ "parents": { "mode": "any", "entries": [] },
2135
+ "contexts": ["application-ui"],
2136
+ "zones": [],
2137
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2138
+ "state": [],
2139
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2140
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2141
+ "layout": {
2142
+ "roles": ["actions"],
2143
+ "geometry": { "margin": "none", "border": "child", "padding": "child" }
2144
+ },
2145
+ "accessibility": { "obligations": [] },
2146
+ "boundaries": {
2147
+ "rootClass": null,
2148
+ "publicClasses": [],
2149
+ "publicTokens": []
2150
+ },
2151
+ "diagnostics": [],
2152
+ "provenance": {
2153
+ "selection": "ai/component-catalog.json",
2154
+ "composition": "generated-permissive-default"
2155
+ }
2156
+ },
2157
+ {
2158
+ "key": "@kerfjs/ui:wa-dropdown-item",
2159
+ "package": "@kerfjs/ui",
2160
+ "id": "wa-dropdown-item",
2161
+ "name": "Dropdown Item",
2162
+ "kind": "component",
2163
+ "source": "webawesome",
2164
+ "parents": { "mode": "any", "entries": [] },
2165
+ "contexts": ["application-ui"],
2166
+ "zones": [],
2167
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2168
+ "state": [],
2169
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2170
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2171
+ "layout": {
2172
+ "roles": ["actions"],
2173
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
2174
+ },
2175
+ "accessibility": { "obligations": [] },
2176
+ "boundaries": {
2177
+ "rootClass": null,
2178
+ "publicClasses": [],
2179
+ "publicTokens": []
2180
+ },
2181
+ "diagnostics": [],
2182
+ "provenance": {
2183
+ "selection": "ai/component-catalog.json",
2184
+ "composition": "generated-permissive-default"
2185
+ }
2186
+ },
2187
+ {
2188
+ "key": "@kerfjs/ui:wa-checkbox",
2189
+ "package": "@kerfjs/ui",
2190
+ "id": "wa-checkbox",
2191
+ "name": "Checkbox",
2192
+ "kind": "component",
2193
+ "source": "webawesome",
2194
+ "parents": { "mode": "any", "entries": [] },
2195
+ "contexts": ["application-ui"],
2196
+ "zones": [],
2197
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2198
+ "state": [],
2199
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2200
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2201
+ "layout": {
2202
+ "roles": ["forms"],
2203
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
2204
+ },
2205
+ "accessibility": { "obligations": [] },
2206
+ "boundaries": {
2207
+ "rootClass": null,
2208
+ "publicClasses": [],
2209
+ "publicTokens": []
2210
+ },
2211
+ "diagnostics": [],
2212
+ "provenance": {
2213
+ "selection": "ai/component-catalog.json",
2214
+ "composition": "generated-permissive-default"
2215
+ }
2216
+ },
2217
+ {
2218
+ "key": "@kerfjs/ui:wa-checkbox-group",
2219
+ "package": "@kerfjs/ui",
2220
+ "id": "wa-checkbox-group",
2221
+ "name": "Checkbox Group",
2222
+ "kind": "component",
2223
+ "source": "webawesome",
2224
+ "parents": { "mode": "any", "entries": [] },
2225
+ "contexts": ["application-ui"],
2226
+ "zones": [],
2227
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2228
+ "state": [],
2229
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2230
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2231
+ "layout": {
2232
+ "roles": ["forms"],
2233
+ "geometry": { "margin": "self", "border": "child", "padding": "child" }
2234
+ },
2235
+ "accessibility": { "obligations": [] },
2236
+ "boundaries": {
2237
+ "rootClass": null,
2238
+ "publicClasses": [],
2239
+ "publicTokens": []
2240
+ },
2241
+ "diagnostics": [],
2242
+ "provenance": {
2243
+ "selection": "ai/component-catalog.json",
2244
+ "composition": "generated-permissive-default"
2245
+ }
2246
+ },
2247
+ {
2248
+ "key": "@kerfjs/ui:wa-color-picker",
2249
+ "package": "@kerfjs/ui",
2250
+ "id": "wa-color-picker",
2251
+ "name": "Color Picker",
2252
+ "kind": "component",
2253
+ "source": "webawesome",
2254
+ "parents": { "mode": "any", "entries": [] },
2255
+ "contexts": ["application-ui"],
2256
+ "zones": [],
2257
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2258
+ "state": [],
2259
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2260
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2261
+ "layout": {
2262
+ "roles": ["forms"],
2263
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
2264
+ },
2265
+ "accessibility": { "obligations": [] },
2266
+ "boundaries": {
2267
+ "rootClass": null,
2268
+ "publicClasses": [],
2269
+ "publicTokens": []
2270
+ },
2271
+ "diagnostics": [],
2272
+ "provenance": {
2273
+ "selection": "ai/component-catalog.json",
2274
+ "composition": "generated-permissive-default"
2275
+ }
2276
+ },
2277
+ {
2278
+ "key": "@kerfjs/ui:wa-input",
2279
+ "package": "@kerfjs/ui",
2280
+ "id": "wa-input",
2281
+ "name": "Input",
2282
+ "kind": "component",
2283
+ "source": "webawesome",
2284
+ "parents": { "mode": "any", "entries": [] },
2285
+ "contexts": ["application-ui"],
2286
+ "zones": [],
2287
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2288
+ "state": [],
2289
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2290
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2291
+ "layout": {
2292
+ "roles": ["forms"],
2293
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
2294
+ },
2295
+ "accessibility": { "obligations": [] },
2296
+ "boundaries": {
2297
+ "rootClass": null,
2298
+ "publicClasses": [],
2299
+ "publicTokens": []
2300
+ },
2301
+ "diagnostics": [],
2302
+ "provenance": {
2303
+ "selection": "ai/component-catalog.json",
2304
+ "composition": "generated-permissive-default"
2305
+ }
2306
+ },
2307
+ {
2308
+ "key": "@kerfjs/ui:wa-known-date",
2309
+ "package": "@kerfjs/ui",
2310
+ "id": "wa-known-date",
2311
+ "name": "Known Date",
2312
+ "kind": "component",
2313
+ "source": "webawesome",
2314
+ "parents": { "mode": "any", "entries": [] },
2315
+ "contexts": ["application-ui"],
2316
+ "zones": [],
2317
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2318
+ "state": [],
2319
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2320
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2321
+ "layout": {
2322
+ "roles": ["forms"],
2323
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
2324
+ },
2325
+ "accessibility": { "obligations": [] },
2326
+ "boundaries": {
2327
+ "rootClass": null,
2328
+ "publicClasses": [],
2329
+ "publicTokens": []
2330
+ },
2331
+ "diagnostics": [],
2332
+ "provenance": {
2333
+ "selection": "ai/component-catalog.json",
2334
+ "composition": "generated-permissive-default"
2335
+ }
2336
+ },
2337
+ {
2338
+ "key": "@kerfjs/ui:wa-number-input",
2339
+ "package": "@kerfjs/ui",
2340
+ "id": "wa-number-input",
2341
+ "name": "Number Input",
2342
+ "kind": "component",
2343
+ "source": "webawesome",
2344
+ "parents": { "mode": "any", "entries": [] },
2345
+ "contexts": ["application-ui"],
2346
+ "zones": [],
2347
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2348
+ "state": [],
2349
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2350
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2351
+ "layout": {
2352
+ "roles": ["forms"],
2353
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
2354
+ },
2355
+ "accessibility": { "obligations": [] },
2356
+ "boundaries": {
2357
+ "rootClass": null,
2358
+ "publicClasses": [],
2359
+ "publicTokens": []
2360
+ },
2361
+ "diagnostics": [],
2362
+ "provenance": {
2363
+ "selection": "ai/component-catalog.json",
2364
+ "composition": "generated-permissive-default"
2365
+ }
2366
+ },
2367
+ {
2368
+ "key": "@kerfjs/ui:wa-option",
2369
+ "package": "@kerfjs/ui",
2370
+ "id": "wa-option",
2371
+ "name": "Option",
2372
+ "kind": "component",
2373
+ "source": "webawesome",
2374
+ "parents": { "mode": "any", "entries": [] },
2375
+ "contexts": ["application-ui"],
2376
+ "zones": [],
2377
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2378
+ "state": [],
2379
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2380
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2381
+ "layout": {
2382
+ "roles": ["forms"],
2383
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
2384
+ },
2385
+ "accessibility": { "obligations": [] },
2386
+ "boundaries": {
2387
+ "rootClass": null,
2388
+ "publicClasses": [],
2389
+ "publicTokens": []
2390
+ },
2391
+ "diagnostics": [],
2392
+ "provenance": {
2393
+ "selection": "ai/component-catalog.json",
2394
+ "composition": "generated-permissive-default"
2395
+ }
2396
+ },
2397
+ {
2398
+ "key": "@kerfjs/ui:wa-otp-input",
2399
+ "package": "@kerfjs/ui",
2400
+ "id": "wa-otp-input",
2401
+ "name": "OTP Input",
2402
+ "kind": "component",
2403
+ "source": "webawesome",
2404
+ "parents": { "mode": "any", "entries": [] },
2405
+ "contexts": ["application-ui"],
2406
+ "zones": [],
2407
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2408
+ "state": [],
2409
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2410
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2411
+ "layout": {
2412
+ "roles": ["forms"],
2413
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
2414
+ },
2415
+ "accessibility": { "obligations": [] },
2416
+ "boundaries": {
2417
+ "rootClass": null,
2418
+ "publicClasses": [],
2419
+ "publicTokens": []
2420
+ },
2421
+ "diagnostics": [],
2422
+ "provenance": {
2423
+ "selection": "ai/component-catalog.json",
2424
+ "composition": "generated-permissive-default"
2425
+ }
2426
+ },
2427
+ {
2428
+ "key": "@kerfjs/ui:wa-radio",
2429
+ "package": "@kerfjs/ui",
2430
+ "id": "wa-radio",
2431
+ "name": "Radio",
2432
+ "kind": "component",
2433
+ "source": "webawesome",
2434
+ "parents": { "mode": "any", "entries": [] },
2435
+ "contexts": ["application-ui"],
2436
+ "zones": [],
2437
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2438
+ "state": [],
2439
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2440
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2441
+ "layout": {
2442
+ "roles": ["forms"],
2443
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
2444
+ },
2445
+ "accessibility": { "obligations": [] },
2446
+ "boundaries": {
2447
+ "rootClass": null,
2448
+ "publicClasses": [],
2449
+ "publicTokens": []
2450
+ },
2451
+ "diagnostics": [],
2452
+ "provenance": {
2453
+ "selection": "ai/component-catalog.json",
2454
+ "composition": "generated-permissive-default"
2455
+ }
2456
+ },
2457
+ {
2458
+ "key": "@kerfjs/ui:wa-radio-group",
2459
+ "package": "@kerfjs/ui",
2460
+ "id": "wa-radio-group",
2461
+ "name": "Radio Group",
2462
+ "kind": "component",
2463
+ "source": "webawesome",
2464
+ "parents": { "mode": "any", "entries": [] },
2465
+ "contexts": ["application-ui"],
2466
+ "zones": [
2467
+ {
2468
+ "id": "options",
2469
+ "accepts": ["wa-radio"],
2470
+ "cardinality": { "min": 1, "max": "unbounded" },
2471
+ "exclusiveWith": []
2472
+ }
2473
+ ],
2474
+ "children": {
2475
+ "mode": "listed",
2476
+ "concepts": ["wa-radio"],
2477
+ "requiredConcepts": ["wa-radio"]
2478
+ },
2479
+ "state": [],
2480
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2481
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2482
+ "layout": {
2483
+ "roles": ["forms"],
2484
+ "geometry": { "margin": "self", "border": "child", "padding": "child" }
2485
+ },
2486
+ "accessibility": { "obligations": [] },
2487
+ "boundaries": {
2488
+ "rootClass": null,
2489
+ "publicClasses": [],
2490
+ "publicTokens": []
2491
+ },
2492
+ "diagnostics": [],
2493
+ "provenance": {
2494
+ "selection": "ai/component-catalog.json",
2495
+ "composition": "docs/webawesome-theme.md#coverage"
2496
+ }
2497
+ },
2498
+ {
2499
+ "key": "@kerfjs/ui:wa-rating",
2500
+ "package": "@kerfjs/ui",
2501
+ "id": "wa-rating",
2502
+ "name": "Rating",
2503
+ "kind": "component",
2504
+ "source": "webawesome",
2505
+ "parents": { "mode": "any", "entries": [] },
2506
+ "contexts": ["application-ui"],
2507
+ "zones": [],
2508
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2509
+ "state": [],
2510
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2511
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2512
+ "layout": {
2513
+ "roles": ["forms"],
2514
+ "geometry": { "margin": "none", "border": "none", "padding": "none" }
2515
+ },
2516
+ "accessibility": { "obligations": [] },
2517
+ "boundaries": {
2518
+ "rootClass": null,
2519
+ "publicClasses": [],
2520
+ "publicTokens": []
2521
+ },
2522
+ "diagnostics": [],
2523
+ "provenance": {
2524
+ "selection": "ai/component-catalog.json",
2525
+ "composition": "generated-permissive-default"
2526
+ }
2527
+ },
2528
+ {
2529
+ "key": "@kerfjs/ui:wa-select",
2530
+ "package": "@kerfjs/ui",
2531
+ "id": "wa-select",
2532
+ "name": "Select",
2533
+ "kind": "component",
2534
+ "source": "webawesome",
2535
+ "parents": { "mode": "any", "entries": [] },
2536
+ "contexts": ["application-ui"],
2537
+ "zones": [
2538
+ {
2539
+ "id": "options",
2540
+ "accepts": ["wa-option"],
2541
+ "cardinality": { "min": 1, "max": "unbounded" },
2542
+ "exclusiveWith": []
2543
+ }
2544
+ ],
2545
+ "children": {
2546
+ "mode": "listed",
2547
+ "concepts": ["wa-option"],
2548
+ "requiredConcepts": ["wa-option"]
2549
+ },
2550
+ "state": [],
2551
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2552
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2553
+ "layout": {
2554
+ "roles": ["forms"],
2555
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
2556
+ },
2557
+ "accessibility": { "obligations": [] },
2558
+ "boundaries": {
2559
+ "rootClass": null,
2560
+ "publicClasses": [],
2561
+ "publicTokens": []
2562
+ },
2563
+ "diagnostics": [],
2564
+ "provenance": {
2565
+ "selection": "ai/component-catalog.json",
2566
+ "composition": "docs/webawesome-theme.md#coverage"
2567
+ }
2568
+ },
2569
+ {
2570
+ "key": "@kerfjs/ui:wa-slider",
2571
+ "package": "@kerfjs/ui",
2572
+ "id": "wa-slider",
2573
+ "name": "Slider",
2574
+ "kind": "component",
2575
+ "source": "webawesome",
2576
+ "parents": { "mode": "any", "entries": [] },
2577
+ "contexts": ["application-ui"],
2578
+ "zones": [],
2579
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2580
+ "state": [],
2581
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2582
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2583
+ "layout": {
2584
+ "roles": ["forms"],
2585
+ "geometry": { "margin": "self", "border": "none", "padding": "child" }
2586
+ },
2587
+ "accessibility": { "obligations": [] },
2588
+ "boundaries": {
2589
+ "rootClass": null,
2590
+ "publicClasses": [],
2591
+ "publicTokens": []
2592
+ },
2593
+ "diagnostics": [],
2594
+ "provenance": {
2595
+ "selection": "ai/component-catalog.json",
2596
+ "composition": "generated-permissive-default"
2597
+ }
2598
+ },
2599
+ {
2600
+ "key": "@kerfjs/ui:wa-switch",
2601
+ "package": "@kerfjs/ui",
2602
+ "id": "wa-switch",
2603
+ "name": "Switch",
2604
+ "kind": "component",
2605
+ "source": "webawesome",
2606
+ "parents": { "mode": "any", "entries": [] },
2607
+ "contexts": ["application-ui"],
2608
+ "zones": [],
2609
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2610
+ "state": [],
2611
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2612
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2613
+ "layout": {
2614
+ "roles": ["forms"],
2615
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
2616
+ },
2617
+ "accessibility": { "obligations": [] },
2618
+ "boundaries": {
2619
+ "rootClass": null,
2620
+ "publicClasses": [],
2621
+ "publicTokens": []
2622
+ },
2623
+ "diagnostics": [],
2624
+ "provenance": {
2625
+ "selection": "ai/component-catalog.json",
2626
+ "composition": "generated-permissive-default"
2627
+ }
2628
+ },
2629
+ {
2630
+ "key": "@kerfjs/ui:wa-textarea",
2631
+ "package": "@kerfjs/ui",
2632
+ "id": "wa-textarea",
2633
+ "name": "Textarea",
2634
+ "kind": "component",
2635
+ "source": "webawesome",
2636
+ "parents": { "mode": "any", "entries": [] },
2637
+ "contexts": ["application-ui"],
2638
+ "zones": [],
2639
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2640
+ "state": [],
2641
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2642
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2643
+ "layout": {
2644
+ "roles": ["forms"],
2645
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
2646
+ },
2647
+ "accessibility": { "obligations": [] },
2648
+ "boundaries": {
2649
+ "rootClass": null,
2650
+ "publicClasses": [],
2651
+ "publicTokens": []
2652
+ },
2653
+ "diagnostics": [],
2654
+ "provenance": {
2655
+ "selection": "ai/component-catalog.json",
2656
+ "composition": "generated-permissive-default"
2657
+ }
2658
+ },
2659
+ {
2660
+ "key": "@kerfjs/ui:wa-time-input",
2661
+ "package": "@kerfjs/ui",
2662
+ "id": "wa-time-input",
2663
+ "name": "Time Input",
2664
+ "kind": "component",
2665
+ "source": "webawesome",
2666
+ "parents": { "mode": "any", "entries": [] },
2667
+ "contexts": ["application-ui"],
2668
+ "zones": [],
2669
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2670
+ "state": [],
2671
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2672
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2673
+ "layout": {
2674
+ "roles": ["forms"],
2675
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
2676
+ },
2677
+ "accessibility": { "obligations": [] },
2678
+ "boundaries": {
2679
+ "rootClass": null,
2680
+ "publicClasses": [],
2681
+ "publicTokens": []
2682
+ },
2683
+ "diagnostics": [],
2684
+ "provenance": {
2685
+ "selection": "ai/component-catalog.json",
2686
+ "composition": "generated-permissive-default"
2687
+ }
2688
+ },
2689
+ {
2690
+ "key": "@kerfjs/ui:wa-accordion",
2691
+ "package": "@kerfjs/ui",
2692
+ "id": "wa-accordion",
2693
+ "name": "Accordion",
2694
+ "kind": "component",
2695
+ "source": "webawesome",
2696
+ "parents": { "mode": "any", "entries": [] },
2697
+ "contexts": ["application-ui"],
2698
+ "zones": [
2699
+ {
2700
+ "id": "items",
2701
+ "accepts": ["wa-accordion-item"],
2702
+ "cardinality": { "min": 1, "max": "unbounded" },
2703
+ "exclusiveWith": []
2704
+ }
2705
+ ],
2706
+ "children": {
2707
+ "mode": "listed",
2708
+ "concepts": ["wa-accordion-item"],
2709
+ "requiredConcepts": ["wa-accordion-item"]
2710
+ },
2711
+ "state": [],
2712
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2713
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2714
+ "layout": {
2715
+ "roles": ["layout"],
2716
+ "geometry": { "margin": "self", "border": "self", "padding": "self" }
2717
+ },
2718
+ "accessibility": { "obligations": [] },
2719
+ "boundaries": {
2720
+ "rootClass": null,
2721
+ "publicClasses": [],
2722
+ "publicTokens": []
2723
+ },
2724
+ "diagnostics": [],
2725
+ "provenance": {
2726
+ "selection": "ai/component-catalog.json",
2727
+ "composition": "docs/webawesome-theme.md#coverage"
2728
+ }
2729
+ },
2730
+ {
2731
+ "key": "@kerfjs/ui:wa-accordion-item",
2732
+ "package": "@kerfjs/ui",
2733
+ "id": "wa-accordion-item",
2734
+ "name": "Accordion Item",
2735
+ "kind": "component",
2736
+ "source": "webawesome",
2737
+ "parents": { "mode": "any", "entries": [] },
2738
+ "contexts": ["application-ui"],
2739
+ "zones": [],
2740
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2741
+ "state": [],
2742
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2743
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2744
+ "layout": {
2745
+ "roles": ["layout"],
2746
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
2747
+ },
2748
+ "accessibility": { "obligations": [] },
2749
+ "boundaries": {
2750
+ "rootClass": null,
2751
+ "publicClasses": [],
2752
+ "publicTokens": []
2753
+ },
2754
+ "diagnostics": [],
2755
+ "provenance": {
2756
+ "selection": "ai/component-catalog.json",
2757
+ "composition": "generated-permissive-default"
2758
+ }
2759
+ },
2760
+ {
2761
+ "key": "@kerfjs/ui:wa-card",
2762
+ "package": "@kerfjs/ui",
2763
+ "id": "wa-card",
2764
+ "name": "Card",
2765
+ "kind": "component",
2766
+ "source": "webawesome",
2767
+ "parents": { "mode": "any", "entries": [] },
2768
+ "contexts": ["application-ui"],
2769
+ "zones": [],
2770
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2771
+ "state": [],
2772
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2773
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2774
+ "layout": {
2775
+ "roles": ["layout"],
2776
+ "geometry": { "margin": "self", "border": "self", "padding": "self" }
2777
+ },
2778
+ "accessibility": { "obligations": [] },
2779
+ "boundaries": {
2780
+ "rootClass": null,
2781
+ "publicClasses": [],
2782
+ "publicTokens": []
2783
+ },
2784
+ "diagnostics": [],
2785
+ "provenance": {
2786
+ "selection": "ai/component-catalog.json",
2787
+ "composition": "generated-permissive-default"
2788
+ }
2789
+ },
2790
+ {
2791
+ "key": "@kerfjs/ui:wa-details",
2792
+ "package": "@kerfjs/ui",
2793
+ "id": "wa-details",
2794
+ "name": "Details",
2795
+ "kind": "component",
2796
+ "source": "webawesome",
2797
+ "parents": { "mode": "any", "entries": [] },
2798
+ "contexts": ["application-ui"],
2799
+ "zones": [],
2800
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2801
+ "state": [],
2802
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2803
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2804
+ "layout": {
2805
+ "roles": ["layout"],
2806
+ "geometry": { "margin": "self", "border": "self", "padding": "self" }
2807
+ },
2808
+ "accessibility": { "obligations": [] },
2809
+ "boundaries": {
2810
+ "rootClass": null,
2811
+ "publicClasses": [],
2812
+ "publicTokens": []
2813
+ },
2814
+ "diagnostics": [],
2815
+ "provenance": {
2816
+ "selection": "ai/component-catalog.json",
2817
+ "composition": "generated-permissive-default"
2818
+ }
2819
+ },
2820
+ {
2821
+ "key": "@kerfjs/ui:wa-dialog",
2822
+ "package": "@kerfjs/ui",
2823
+ "id": "wa-dialog",
2824
+ "name": "Dialog",
2825
+ "kind": "component",
2826
+ "source": "webawesome",
2827
+ "parents": { "mode": "any", "entries": [] },
2828
+ "contexts": ["application-ui"],
2829
+ "zones": [],
2830
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2831
+ "state": [],
2832
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2833
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2834
+ "layout": {
2835
+ "roles": ["layout"],
2836
+ "geometry": { "margin": "none", "border": "child", "padding": "child" }
2837
+ },
2838
+ "accessibility": { "obligations": [] },
2839
+ "boundaries": {
2840
+ "rootClass": null,
2841
+ "publicClasses": [],
2842
+ "publicTokens": []
2843
+ },
2844
+ "diagnostics": [],
2845
+ "provenance": {
2846
+ "selection": "ai/component-catalog.json",
2847
+ "composition": "generated-permissive-default"
2848
+ }
2849
+ },
2850
+ {
2851
+ "key": "@kerfjs/ui:wa-divider",
2852
+ "package": "@kerfjs/ui",
2853
+ "id": "wa-divider",
2854
+ "name": "Divider",
2855
+ "kind": "component",
2856
+ "source": "webawesome",
2857
+ "parents": { "mode": "any", "entries": [] },
2858
+ "contexts": ["application-ui"],
2859
+ "zones": [],
2860
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2861
+ "state": [],
2862
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2863
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2864
+ "layout": {
2865
+ "roles": ["layout"],
2866
+ "geometry": { "margin": "parent", "border": "self", "padding": "none" }
2867
+ },
2868
+ "accessibility": { "obligations": [] },
2869
+ "boundaries": {
2870
+ "rootClass": null,
2871
+ "publicClasses": [],
2872
+ "publicTokens": []
2873
+ },
2874
+ "diagnostics": [],
2875
+ "provenance": {
2876
+ "selection": "ai/component-catalog.json",
2877
+ "composition": "generated-permissive-default"
2878
+ }
2879
+ },
2880
+ {
2881
+ "key": "@kerfjs/ui:wa-drawer",
2882
+ "package": "@kerfjs/ui",
2883
+ "id": "wa-drawer",
2884
+ "name": "Drawer",
2885
+ "kind": "component",
2886
+ "source": "webawesome",
2887
+ "parents": { "mode": "any", "entries": [] },
2888
+ "contexts": ["application-ui"],
2889
+ "zones": [],
2890
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2891
+ "state": [],
2892
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2893
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2894
+ "layout": {
2895
+ "roles": ["layout"],
2896
+ "geometry": { "margin": "none", "border": "child", "padding": "child" }
2897
+ },
2898
+ "accessibility": { "obligations": [] },
2899
+ "boundaries": {
2900
+ "rootClass": null,
2901
+ "publicClasses": [],
2902
+ "publicTokens": []
2903
+ },
2904
+ "diagnostics": [],
2905
+ "provenance": {
2906
+ "selection": "ai/component-catalog.json",
2907
+ "composition": "generated-permissive-default"
2908
+ }
2909
+ },
2910
+ {
2911
+ "key": "@kerfjs/ui:wa-page",
2912
+ "package": "@kerfjs/ui",
2913
+ "id": "wa-page",
2914
+ "name": "Page",
2915
+ "kind": "component",
2916
+ "source": "webawesome",
2917
+ "parents": { "mode": "any", "entries": [] },
2918
+ "contexts": ["application-ui"],
2919
+ "zones": [],
2920
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2921
+ "state": [],
2922
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2923
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2924
+ "layout": {
2925
+ "roles": ["layout"],
2926
+ "geometry": { "margin": "none", "border": "child", "padding": "child" }
2927
+ },
2928
+ "accessibility": { "obligations": [] },
2929
+ "boundaries": {
2930
+ "rootClass": null,
2931
+ "publicClasses": [],
2932
+ "publicTokens": []
2933
+ },
2934
+ "diagnostics": [],
2935
+ "provenance": {
2936
+ "selection": "ai/component-catalog.json",
2937
+ "composition": "generated-permissive-default"
2938
+ }
2939
+ },
2940
+ {
2941
+ "key": "@kerfjs/ui:wa-scroller",
2942
+ "package": "@kerfjs/ui",
2943
+ "id": "wa-scroller",
2944
+ "name": "Scroller",
2945
+ "kind": "component",
2946
+ "source": "webawesome",
2947
+ "parents": { "mode": "any", "entries": [] },
2948
+ "contexts": ["application-ui"],
2949
+ "zones": [],
2950
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2951
+ "state": [],
2952
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2953
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2954
+ "layout": {
2955
+ "roles": ["layout"],
2956
+ "geometry": { "margin": "none", "border": "child", "padding": "child" }
2957
+ },
2958
+ "accessibility": { "obligations": [] },
2959
+ "boundaries": {
2960
+ "rootClass": null,
2961
+ "publicClasses": [],
2962
+ "publicTokens": []
2963
+ },
2964
+ "diagnostics": [],
2965
+ "provenance": {
2966
+ "selection": "ai/component-catalog.json",
2967
+ "composition": "generated-permissive-default"
2968
+ }
2969
+ },
2970
+ {
2971
+ "key": "@kerfjs/ui:wa-split-panel",
2972
+ "package": "@kerfjs/ui",
2973
+ "id": "wa-split-panel",
2974
+ "name": "Split Panel",
2975
+ "kind": "component",
2976
+ "source": "webawesome",
2977
+ "parents": { "mode": "any", "entries": [] },
2978
+ "contexts": ["application-ui"],
2979
+ "zones": [],
2980
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
2981
+ "state": [],
2982
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
2983
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
2984
+ "layout": {
2985
+ "roles": ["layout"],
2986
+ "geometry": { "margin": "none", "border": "child", "padding": "child" }
2987
+ },
2988
+ "accessibility": { "obligations": [] },
2989
+ "boundaries": {
2990
+ "rootClass": null,
2991
+ "publicClasses": [],
2992
+ "publicTokens": []
2993
+ },
2994
+ "diagnostics": [],
2995
+ "provenance": {
2996
+ "selection": "ai/component-catalog.json",
2997
+ "composition": "generated-permissive-default"
2998
+ }
2999
+ },
3000
+ {
3001
+ "key": "@kerfjs/ui:wa-breadcrumb",
3002
+ "package": "@kerfjs/ui",
3003
+ "id": "wa-breadcrumb",
3004
+ "name": "Breadcrumb",
3005
+ "kind": "component",
3006
+ "source": "webawesome",
3007
+ "parents": { "mode": "any", "entries": [] },
3008
+ "contexts": ["application-ui"],
3009
+ "zones": [],
3010
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3011
+ "state": [],
3012
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3013
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3014
+ "layout": {
3015
+ "roles": ["navigation"],
3016
+ "geometry": { "margin": "none", "border": "child", "padding": "child" }
3017
+ },
3018
+ "accessibility": { "obligations": [] },
3019
+ "boundaries": {
3020
+ "rootClass": null,
3021
+ "publicClasses": [],
3022
+ "publicTokens": []
3023
+ },
3024
+ "diagnostics": [],
3025
+ "provenance": {
3026
+ "selection": "ai/component-catalog.json",
3027
+ "composition": "generated-permissive-default"
3028
+ }
3029
+ },
3030
+ {
3031
+ "key": "@kerfjs/ui:wa-breadcrumb-item",
3032
+ "package": "@kerfjs/ui",
3033
+ "id": "wa-breadcrumb-item",
3034
+ "name": "Breadcrumb Item",
3035
+ "kind": "component",
3036
+ "source": "webawesome",
3037
+ "parents": { "mode": "any", "entries": [] },
3038
+ "contexts": ["application-ui"],
3039
+ "zones": [],
3040
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3041
+ "state": [],
3042
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3043
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3044
+ "layout": {
3045
+ "roles": ["navigation"],
3046
+ "geometry": { "margin": "none", "border": "none", "padding": "none" }
3047
+ },
3048
+ "accessibility": { "obligations": [] },
3049
+ "boundaries": {
3050
+ "rootClass": null,
3051
+ "publicClasses": [],
3052
+ "publicTokens": []
3053
+ },
3054
+ "diagnostics": [],
3055
+ "provenance": {
3056
+ "selection": "ai/component-catalog.json",
3057
+ "composition": "generated-permissive-default"
3058
+ }
3059
+ },
3060
+ {
3061
+ "key": "@kerfjs/ui:wa-pagination",
3062
+ "package": "@kerfjs/ui",
3063
+ "id": "wa-pagination",
3064
+ "name": "Pagination",
3065
+ "kind": "component",
3066
+ "source": "webawesome",
3067
+ "parents": { "mode": "any", "entries": [] },
3068
+ "contexts": ["application-ui"],
3069
+ "zones": [],
3070
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3071
+ "state": [],
3072
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3073
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3074
+ "layout": {
3075
+ "roles": ["navigation"],
3076
+ "geometry": { "margin": "none", "border": "child", "padding": "child" }
3077
+ },
3078
+ "accessibility": { "obligations": [] },
3079
+ "boundaries": {
3080
+ "rootClass": null,
3081
+ "publicClasses": [],
3082
+ "publicTokens": []
3083
+ },
3084
+ "diagnostics": [],
3085
+ "provenance": {
3086
+ "selection": "ai/component-catalog.json",
3087
+ "composition": "generated-permissive-default"
3088
+ }
3089
+ },
3090
+ {
3091
+ "key": "@kerfjs/ui:wa-tab",
3092
+ "package": "@kerfjs/ui",
3093
+ "id": "wa-tab",
3094
+ "name": "Tab",
3095
+ "kind": "component",
3096
+ "source": "webawesome",
3097
+ "parents": { "mode": "any", "entries": [] },
3098
+ "contexts": ["application-ui"],
3099
+ "zones": [],
3100
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3101
+ "state": [],
3102
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3103
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3104
+ "layout": {
3105
+ "roles": ["navigation"],
3106
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
3107
+ },
3108
+ "accessibility": { "obligations": [] },
3109
+ "boundaries": {
3110
+ "rootClass": null,
3111
+ "publicClasses": [],
3112
+ "publicTokens": []
3113
+ },
3114
+ "diagnostics": [],
3115
+ "provenance": {
3116
+ "selection": "ai/component-catalog.json",
3117
+ "composition": "generated-permissive-default"
3118
+ }
3119
+ },
3120
+ {
3121
+ "key": "@kerfjs/ui:wa-tab-group",
3122
+ "package": "@kerfjs/ui",
3123
+ "id": "wa-tab-group",
3124
+ "name": "Tab Group",
3125
+ "kind": "component",
3126
+ "source": "webawesome",
3127
+ "parents": { "mode": "any", "entries": [] },
3128
+ "contexts": ["application-ui"],
3129
+ "zones": [
3130
+ {
3131
+ "id": "tabs",
3132
+ "accepts": ["wa-tab"],
3133
+ "cardinality": { "min": 1, "max": "unbounded" },
3134
+ "exclusiveWith": []
3135
+ },
3136
+ {
3137
+ "id": "panels",
3138
+ "accepts": ["wa-tab-panel"],
3139
+ "cardinality": { "min": 1, "max": "unbounded" },
3140
+ "exclusiveWith": []
3141
+ }
3142
+ ],
3143
+ "children": {
3144
+ "mode": "listed",
3145
+ "concepts": ["wa-tab", "wa-tab-panel"],
3146
+ "requiredConcepts": ["wa-tab", "wa-tab-panel"]
3147
+ },
3148
+ "state": [],
3149
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3150
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3151
+ "layout": {
3152
+ "roles": ["navigation"],
3153
+ "geometry": { "margin": "none", "border": "child", "padding": "child" }
3154
+ },
3155
+ "accessibility": { "obligations": [] },
3156
+ "boundaries": {
3157
+ "rootClass": null,
3158
+ "publicClasses": [],
3159
+ "publicTokens": []
3160
+ },
3161
+ "diagnostics": [
3162
+ {
3163
+ "id": "KUI-C108",
3164
+ "severity": "error",
3165
+ "when": "tab and panel name sets differ",
3166
+ "message": "Every wa-tab must identify a matching wa-tab-panel and vice versa."
3167
+ }
3168
+ ],
3169
+ "provenance": {
3170
+ "selection": "ai/component-catalog.json",
3171
+ "composition": "docs/webawesome-theme.md#coverage"
3172
+ }
3173
+ },
3174
+ {
3175
+ "key": "@kerfjs/ui:wa-tab-panel",
3176
+ "package": "@kerfjs/ui",
3177
+ "id": "wa-tab-panel",
3178
+ "name": "Tab Panel",
3179
+ "kind": "component",
3180
+ "source": "webawesome",
3181
+ "parents": { "mode": "any", "entries": [] },
3182
+ "contexts": ["application-ui"],
3183
+ "zones": [],
3184
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3185
+ "state": [],
3186
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3187
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3188
+ "layout": {
3189
+ "roles": ["navigation"],
3190
+ "geometry": {
3191
+ "margin": "none",
3192
+ "border": "none",
3193
+ "padding": "conditional",
3194
+ "notes": [
3195
+ "Container-mode tab panels own the themed container inset; uncontained panels do not."
3196
+ ]
3197
+ }
3198
+ },
3199
+ "accessibility": { "obligations": [] },
3200
+ "boundaries": {
3201
+ "rootClass": null,
3202
+ "publicClasses": [],
3203
+ "publicTokens": []
3204
+ },
3205
+ "diagnostics": [],
3206
+ "provenance": {
3207
+ "selection": "ai/component-catalog.json",
3208
+ "composition": "generated-permissive-default"
3209
+ }
3210
+ },
3211
+ {
3212
+ "key": "@kerfjs/ui:wa-tree",
3213
+ "package": "@kerfjs/ui",
3214
+ "id": "wa-tree",
3215
+ "name": "Tree",
3216
+ "kind": "component",
3217
+ "source": "webawesome",
3218
+ "parents": { "mode": "any", "entries": [] },
3219
+ "contexts": ["application-ui"],
3220
+ "zones": [],
3221
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3222
+ "state": [],
3223
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3224
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3225
+ "layout": {
3226
+ "roles": ["navigation"],
3227
+ "geometry": { "margin": "none", "border": "child", "padding": "child" }
3228
+ },
3229
+ "accessibility": { "obligations": [] },
3230
+ "boundaries": {
3231
+ "rootClass": null,
3232
+ "publicClasses": [],
3233
+ "publicTokens": []
3234
+ },
3235
+ "diagnostics": [],
3236
+ "provenance": {
3237
+ "selection": "ai/component-catalog.json",
3238
+ "composition": "generated-permissive-default"
3239
+ }
3240
+ },
3241
+ {
3242
+ "key": "@kerfjs/ui:wa-tree-item",
3243
+ "package": "@kerfjs/ui",
3244
+ "id": "wa-tree-item",
3245
+ "name": "Tree Item",
3246
+ "kind": "component",
3247
+ "source": "webawesome",
3248
+ "parents": { "mode": "any", "entries": [] },
3249
+ "contexts": ["application-ui"],
3250
+ "zones": [],
3251
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3252
+ "state": [],
3253
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3254
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3255
+ "layout": {
3256
+ "roles": ["navigation"],
3257
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
3258
+ },
3259
+ "accessibility": { "obligations": [] },
3260
+ "boundaries": {
3261
+ "rootClass": null,
3262
+ "publicClasses": [],
3263
+ "publicTokens": []
3264
+ },
3265
+ "diagnostics": [],
3266
+ "provenance": {
3267
+ "selection": "ai/component-catalog.json",
3268
+ "composition": "generated-permissive-default"
3269
+ }
3270
+ },
3271
+ {
3272
+ "key": "@kerfjs/ui:wa-badge",
3273
+ "package": "@kerfjs/ui",
3274
+ "id": "wa-badge",
3275
+ "name": "Badge",
3276
+ "kind": "component",
3277
+ "source": "webawesome",
3278
+ "parents": { "mode": "any", "entries": [] },
3279
+ "contexts": ["application-ui"],
3280
+ "zones": [],
3281
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3282
+ "state": [],
3283
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3284
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3285
+ "layout": {
3286
+ "roles": ["feedback"],
3287
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
3288
+ },
3289
+ "accessibility": { "obligations": [] },
3290
+ "boundaries": {
3291
+ "rootClass": null,
3292
+ "publicClasses": [],
3293
+ "publicTokens": []
3294
+ },
3295
+ "diagnostics": [],
3296
+ "provenance": {
3297
+ "selection": "ai/component-catalog.json",
3298
+ "composition": "generated-permissive-default"
3299
+ }
3300
+ },
3301
+ {
3302
+ "key": "@kerfjs/ui:wa-callout",
3303
+ "package": "@kerfjs/ui",
3304
+ "id": "wa-callout",
3305
+ "name": "Callout",
3306
+ "kind": "component",
3307
+ "source": "webawesome",
3308
+ "parents": { "mode": "any", "entries": [] },
3309
+ "contexts": ["application-ui"],
3310
+ "zones": [],
3311
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3312
+ "state": [],
3313
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3314
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3315
+ "layout": {
3316
+ "roles": ["feedback"],
3317
+ "geometry": { "margin": "self", "border": "self", "padding": "self" }
3318
+ },
3319
+ "accessibility": { "obligations": [] },
3320
+ "boundaries": {
3321
+ "rootClass": null,
3322
+ "publicClasses": [],
3323
+ "publicTokens": []
3324
+ },
3325
+ "diagnostics": [],
3326
+ "provenance": {
3327
+ "selection": "ai/component-catalog.json",
3328
+ "composition": "generated-permissive-default"
3329
+ }
3330
+ },
3331
+ {
3332
+ "key": "@kerfjs/ui:wa-progress-bar",
3333
+ "package": "@kerfjs/ui",
3334
+ "id": "wa-progress-bar",
3335
+ "name": "Progress Bar",
3336
+ "kind": "component",
3337
+ "source": "webawesome",
3338
+ "parents": { "mode": "any", "entries": [] },
3339
+ "contexts": ["application-ui"],
3340
+ "zones": [],
3341
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3342
+ "state": [],
3343
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3344
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3345
+ "layout": {
3346
+ "roles": ["feedback"],
3347
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
3348
+ },
3349
+ "accessibility": { "obligations": [] },
3350
+ "boundaries": {
3351
+ "rootClass": null,
3352
+ "publicClasses": [],
3353
+ "publicTokens": []
3354
+ },
3355
+ "diagnostics": [],
3356
+ "provenance": {
3357
+ "selection": "ai/component-catalog.json",
3358
+ "composition": "generated-permissive-default"
3359
+ }
3360
+ },
3361
+ {
3362
+ "key": "@kerfjs/ui:wa-progress-ring",
3363
+ "package": "@kerfjs/ui",
3364
+ "id": "wa-progress-ring",
3365
+ "name": "Progress Ring",
3366
+ "kind": "component",
3367
+ "source": "webawesome",
3368
+ "parents": { "mode": "any", "entries": [] },
3369
+ "contexts": ["application-ui"],
3370
+ "zones": [],
3371
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3372
+ "state": [],
3373
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3374
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3375
+ "layout": {
3376
+ "roles": ["feedback"],
3377
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
3378
+ },
3379
+ "accessibility": { "obligations": [] },
3380
+ "boundaries": {
3381
+ "rootClass": null,
3382
+ "publicClasses": [],
3383
+ "publicTokens": []
3384
+ },
3385
+ "diagnostics": [],
3386
+ "provenance": {
3387
+ "selection": "ai/component-catalog.json",
3388
+ "composition": "generated-permissive-default"
3389
+ }
3390
+ },
3391
+ {
3392
+ "key": "@kerfjs/ui:wa-skeleton",
3393
+ "package": "@kerfjs/ui",
3394
+ "id": "wa-skeleton",
3395
+ "name": "Skeleton",
3396
+ "kind": "component",
3397
+ "source": "webawesome",
3398
+ "parents": { "mode": "any", "entries": [] },
3399
+ "contexts": ["application-ui"],
3400
+ "zones": [],
3401
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3402
+ "state": [],
3403
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3404
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3405
+ "layout": {
3406
+ "roles": ["feedback"],
3407
+ "geometry": { "margin": "none", "border": "none", "padding": "none" }
3408
+ },
3409
+ "accessibility": { "obligations": [] },
3410
+ "boundaries": {
3411
+ "rootClass": null,
3412
+ "publicClasses": [],
3413
+ "publicTokens": []
3414
+ },
3415
+ "diagnostics": [],
3416
+ "provenance": {
3417
+ "selection": "ai/component-catalog.json",
3418
+ "composition": "generated-permissive-default"
3419
+ }
3420
+ },
3421
+ {
3422
+ "key": "@kerfjs/ui:wa-spinner",
3423
+ "package": "@kerfjs/ui",
3424
+ "id": "wa-spinner",
3425
+ "name": "Spinner",
3426
+ "kind": "component",
3427
+ "source": "webawesome",
3428
+ "parents": { "mode": "any", "entries": [] },
3429
+ "contexts": ["application-ui"],
3430
+ "zones": [],
3431
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3432
+ "state": [],
3433
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3434
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3435
+ "layout": {
3436
+ "roles": ["feedback"],
3437
+ "geometry": { "margin": "none", "border": "none", "padding": "none" }
3438
+ },
3439
+ "accessibility": { "obligations": [] },
3440
+ "boundaries": {
3441
+ "rootClass": null,
3442
+ "publicClasses": [],
3443
+ "publicTokens": []
3444
+ },
3445
+ "diagnostics": [],
3446
+ "provenance": {
3447
+ "selection": "ai/component-catalog.json",
3448
+ "composition": "generated-permissive-default"
3449
+ }
3450
+ },
3451
+ {
3452
+ "key": "@kerfjs/ui:wa-tag",
3453
+ "package": "@kerfjs/ui",
3454
+ "id": "wa-tag",
3455
+ "name": "Tag",
3456
+ "kind": "component",
3457
+ "source": "webawesome",
3458
+ "parents": { "mode": "any", "entries": [] },
3459
+ "contexts": ["application-ui"],
3460
+ "zones": [],
3461
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3462
+ "state": [],
3463
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3464
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3465
+ "layout": {
3466
+ "roles": ["feedback"],
3467
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
3468
+ },
3469
+ "accessibility": { "obligations": [] },
3470
+ "boundaries": {
3471
+ "rootClass": null,
3472
+ "publicClasses": [],
3473
+ "publicTokens": []
3474
+ },
3475
+ "diagnostics": [],
3476
+ "provenance": {
3477
+ "selection": "ai/component-catalog.json",
3478
+ "composition": "generated-permissive-default"
3479
+ }
3480
+ },
3481
+ {
3482
+ "key": "@kerfjs/ui:wa-toast",
3483
+ "package": "@kerfjs/ui",
3484
+ "id": "wa-toast",
3485
+ "name": "Toast",
3486
+ "kind": "component",
3487
+ "source": "webawesome",
3488
+ "parents": { "mode": "any", "entries": [] },
3489
+ "contexts": ["application-ui"],
3490
+ "zones": [],
3491
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3492
+ "state": [],
3493
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3494
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3495
+ "layout": {
3496
+ "roles": ["feedback"],
3497
+ "geometry": { "margin": "none", "border": "child", "padding": "child" }
3498
+ },
3499
+ "accessibility": { "obligations": [] },
3500
+ "boundaries": {
3501
+ "rootClass": null,
3502
+ "publicClasses": [],
3503
+ "publicTokens": []
3504
+ },
3505
+ "diagnostics": [],
3506
+ "provenance": {
3507
+ "selection": "ai/component-catalog.json",
3508
+ "composition": "generated-permissive-default"
3509
+ }
3510
+ },
3511
+ {
3512
+ "key": "@kerfjs/ui:wa-toast-item",
3513
+ "package": "@kerfjs/ui",
3514
+ "id": "wa-toast-item",
3515
+ "name": "Toast Item",
3516
+ "kind": "component",
3517
+ "source": "webawesome",
3518
+ "parents": { "mode": "any", "entries": [] },
3519
+ "contexts": ["application-ui"],
3520
+ "zones": [],
3521
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3522
+ "state": [],
3523
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3524
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3525
+ "layout": {
3526
+ "roles": ["feedback"],
3527
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
3528
+ },
3529
+ "accessibility": { "obligations": [] },
3530
+ "boundaries": {
3531
+ "rootClass": null,
3532
+ "publicClasses": [],
3533
+ "publicTokens": []
3534
+ },
3535
+ "diagnostics": [],
3536
+ "provenance": {
3537
+ "selection": "ai/component-catalog.json",
3538
+ "composition": "generated-permissive-default"
3539
+ }
3540
+ },
3541
+ {
3542
+ "key": "@kerfjs/ui:wa-tooltip",
3543
+ "package": "@kerfjs/ui",
3544
+ "id": "wa-tooltip",
3545
+ "name": "Tooltip",
3546
+ "kind": "component",
3547
+ "source": "webawesome",
3548
+ "parents": { "mode": "any", "entries": [] },
3549
+ "contexts": ["application-ui"],
3550
+ "zones": [],
3551
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3552
+ "state": [],
3553
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3554
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3555
+ "layout": {
3556
+ "roles": ["feedback"],
3557
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
3558
+ },
3559
+ "accessibility": { "obligations": [] },
3560
+ "boundaries": {
3561
+ "rootClass": null,
3562
+ "publicClasses": [],
3563
+ "publicTokens": []
3564
+ },
3565
+ "diagnostics": [],
3566
+ "provenance": {
3567
+ "selection": "ai/component-catalog.json",
3568
+ "composition": "generated-permissive-default"
3569
+ }
3570
+ },
3571
+ {
3572
+ "key": "@kerfjs/ui:wa-animated-image",
3573
+ "package": "@kerfjs/ui",
3574
+ "id": "wa-animated-image",
3575
+ "name": "Animated Image",
3576
+ "kind": "component",
3577
+ "source": "webawesome",
3578
+ "parents": { "mode": "any", "entries": [] },
3579
+ "contexts": ["application-ui"],
3580
+ "zones": [],
3581
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3582
+ "state": [],
3583
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3584
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3585
+ "layout": {
3586
+ "roles": ["media"],
3587
+ "geometry": { "margin": "none", "border": "self", "padding": "none" }
3588
+ },
3589
+ "accessibility": { "obligations": [] },
3590
+ "boundaries": {
3591
+ "rootClass": null,
3592
+ "publicClasses": [],
3593
+ "publicTokens": []
3594
+ },
3595
+ "diagnostics": [],
3596
+ "provenance": {
3597
+ "selection": "ai/component-catalog.json",
3598
+ "composition": "generated-permissive-default"
3599
+ }
3600
+ },
3601
+ {
3602
+ "key": "@kerfjs/ui:wa-avatar",
3603
+ "package": "@kerfjs/ui",
3604
+ "id": "wa-avatar",
3605
+ "name": "Avatar",
3606
+ "kind": "component",
3607
+ "source": "webawesome",
3608
+ "parents": { "mode": "any", "entries": [] },
3609
+ "contexts": ["application-ui"],
3610
+ "zones": [],
3611
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3612
+ "state": [],
3613
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3614
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3615
+ "layout": {
3616
+ "roles": ["media"],
3617
+ "geometry": { "margin": "none", "border": "self", "padding": "none" }
3618
+ },
3619
+ "accessibility": { "obligations": [] },
3620
+ "boundaries": {
3621
+ "rootClass": null,
3622
+ "publicClasses": [],
3623
+ "publicTokens": []
3624
+ },
3625
+ "diagnostics": [],
3626
+ "provenance": {
3627
+ "selection": "ai/component-catalog.json",
3628
+ "composition": "generated-permissive-default"
3629
+ }
3630
+ },
3631
+ {
3632
+ "key": "@kerfjs/ui:wa-carousel",
3633
+ "package": "@kerfjs/ui",
3634
+ "id": "wa-carousel",
3635
+ "name": "Carousel",
3636
+ "kind": "component",
3637
+ "source": "webawesome",
3638
+ "parents": { "mode": "any", "entries": [] },
3639
+ "contexts": ["application-ui"],
3640
+ "zones": [],
3641
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3642
+ "state": [],
3643
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3644
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3645
+ "layout": {
3646
+ "roles": ["media"],
3647
+ "geometry": { "margin": "none", "border": "self", "padding": "child" }
3648
+ },
3649
+ "accessibility": { "obligations": [] },
3650
+ "boundaries": {
3651
+ "rootClass": null,
3652
+ "publicClasses": [],
3653
+ "publicTokens": []
3654
+ },
3655
+ "diagnostics": [],
3656
+ "provenance": {
3657
+ "selection": "ai/component-catalog.json",
3658
+ "composition": "generated-permissive-default"
3659
+ }
3660
+ },
3661
+ {
3662
+ "key": "@kerfjs/ui:wa-carousel-item",
3663
+ "package": "@kerfjs/ui",
3664
+ "id": "wa-carousel-item",
3665
+ "name": "Carousel Item",
3666
+ "kind": "component",
3667
+ "source": "webawesome",
3668
+ "parents": { "mode": "any", "entries": [] },
3669
+ "contexts": ["application-ui"],
3670
+ "zones": [],
3671
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3672
+ "state": [],
3673
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3674
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3675
+ "layout": {
3676
+ "roles": ["media"],
3677
+ "geometry": { "margin": "none", "border": "none", "padding": "none" }
3678
+ },
3679
+ "accessibility": { "obligations": [] },
3680
+ "boundaries": {
3681
+ "rootClass": null,
3682
+ "publicClasses": [],
3683
+ "publicTokens": []
3684
+ },
3685
+ "diagnostics": [],
3686
+ "provenance": {
3687
+ "selection": "ai/component-catalog.json",
3688
+ "composition": "generated-permissive-default"
3689
+ }
3690
+ },
3691
+ {
3692
+ "key": "@kerfjs/ui:wa-comparison",
3693
+ "package": "@kerfjs/ui",
3694
+ "id": "wa-comparison",
3695
+ "name": "Comparison",
3696
+ "kind": "component",
3697
+ "source": "webawesome",
3698
+ "parents": { "mode": "any", "entries": [] },
3699
+ "contexts": ["application-ui"],
3700
+ "zones": [],
3701
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3702
+ "state": [],
3703
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3704
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3705
+ "layout": {
3706
+ "roles": ["media"],
3707
+ "geometry": { "margin": "none", "border": "self", "padding": "child" }
3708
+ },
3709
+ "accessibility": { "obligations": [] },
3710
+ "boundaries": {
3711
+ "rootClass": null,
3712
+ "publicClasses": [],
3713
+ "publicTokens": []
3714
+ },
3715
+ "diagnostics": [],
3716
+ "provenance": {
3717
+ "selection": "ai/component-catalog.json",
3718
+ "composition": "generated-permissive-default"
3719
+ }
3720
+ },
3721
+ {
3722
+ "key": "@kerfjs/ui:wa-icon",
3723
+ "package": "@kerfjs/ui",
3724
+ "id": "wa-icon",
3725
+ "name": "Icon",
3726
+ "kind": "component",
3727
+ "source": "webawesome",
3728
+ "parents": { "mode": "any", "entries": [] },
3729
+ "contexts": ["application-ui"],
3730
+ "zones": [],
3731
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3732
+ "state": [],
3733
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3734
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3735
+ "layout": {
3736
+ "roles": ["media"],
3737
+ "geometry": { "margin": "none", "border": "none", "padding": "none" }
3738
+ },
3739
+ "accessibility": { "obligations": [] },
3740
+ "boundaries": {
3741
+ "rootClass": null,
3742
+ "publicClasses": [],
3743
+ "publicTokens": []
3744
+ },
3745
+ "diagnostics": [],
3746
+ "provenance": {
3747
+ "selection": "ai/component-catalog.json",
3748
+ "composition": "generated-permissive-default"
3749
+ }
3750
+ },
3751
+ {
3752
+ "key": "@kerfjs/ui:wa-markdown",
3753
+ "package": "@kerfjs/ui",
3754
+ "id": "wa-markdown",
3755
+ "name": "Markdown",
3756
+ "kind": "component",
3757
+ "source": "webawesome",
3758
+ "parents": { "mode": "any", "entries": [] },
3759
+ "contexts": ["application-ui"],
3760
+ "zones": [],
3761
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3762
+ "state": [],
3763
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3764
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3765
+ "layout": {
3766
+ "roles": ["media"],
3767
+ "geometry": { "margin": "none", "border": "child", "padding": "child" }
3768
+ },
3769
+ "accessibility": { "obligations": [] },
3770
+ "boundaries": {
3771
+ "rootClass": null,
3772
+ "publicClasses": [],
3773
+ "publicTokens": []
3774
+ },
3775
+ "diagnostics": [],
3776
+ "provenance": {
3777
+ "selection": "ai/component-catalog.json",
3778
+ "composition": "generated-permissive-default"
3779
+ }
3780
+ },
3781
+ {
3782
+ "key": "@kerfjs/ui:wa-qr-code",
3783
+ "package": "@kerfjs/ui",
3784
+ "id": "wa-qr-code",
3785
+ "name": "QR Code",
3786
+ "kind": "component",
3787
+ "source": "webawesome",
3788
+ "parents": { "mode": "any", "entries": [] },
3789
+ "contexts": ["application-ui"],
3790
+ "zones": [],
3791
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3792
+ "state": [],
3793
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3794
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3795
+ "layout": {
3796
+ "roles": ["media"],
3797
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
3798
+ },
3799
+ "accessibility": { "obligations": [] },
3800
+ "boundaries": {
3801
+ "rootClass": null,
3802
+ "publicClasses": [],
3803
+ "publicTokens": []
3804
+ },
3805
+ "diagnostics": [],
3806
+ "provenance": {
3807
+ "selection": "ai/component-catalog.json",
3808
+ "composition": "generated-permissive-default"
3809
+ }
3810
+ },
3811
+ {
3812
+ "key": "@kerfjs/ui:wa-zoomable-frame",
3813
+ "package": "@kerfjs/ui",
3814
+ "id": "wa-zoomable-frame",
3815
+ "name": "Zoomable Frame",
3816
+ "kind": "component",
3817
+ "source": "webawesome",
3818
+ "parents": { "mode": "any", "entries": [] },
3819
+ "contexts": ["application-ui"],
3820
+ "zones": [],
3821
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3822
+ "state": [],
3823
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3824
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3825
+ "layout": {
3826
+ "roles": ["media"],
3827
+ "geometry": { "margin": "none", "border": "self", "padding": "child" }
3828
+ },
3829
+ "accessibility": { "obligations": [] },
3830
+ "boundaries": {
3831
+ "rootClass": null,
3832
+ "publicClasses": [],
3833
+ "publicTokens": []
3834
+ },
3835
+ "diagnostics": [],
3836
+ "provenance": {
3837
+ "selection": "ai/component-catalog.json",
3838
+ "composition": "generated-permissive-default"
3839
+ }
3840
+ },
3841
+ {
3842
+ "key": "@kerfjs/ui:wa-animation",
3843
+ "package": "@kerfjs/ui",
3844
+ "id": "wa-animation",
3845
+ "name": "Animation",
3846
+ "kind": "component",
3847
+ "source": "webawesome",
3848
+ "parents": { "mode": "any", "entries": [] },
3849
+ "contexts": ["application-ui"],
3850
+ "zones": [],
3851
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3852
+ "state": [],
3853
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3854
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3855
+ "layout": {
3856
+ "roles": ["helpers"],
3857
+ "geometry": { "margin": "none", "border": "child", "padding": "child" }
3858
+ },
3859
+ "accessibility": { "obligations": [] },
3860
+ "boundaries": {
3861
+ "rootClass": null,
3862
+ "publicClasses": [],
3863
+ "publicTokens": []
3864
+ },
3865
+ "diagnostics": [],
3866
+ "provenance": {
3867
+ "selection": "ai/component-catalog.json",
3868
+ "composition": "generated-permissive-default"
3869
+ }
3870
+ },
3871
+ {
3872
+ "key": "@kerfjs/ui:wa-format-bytes",
3873
+ "package": "@kerfjs/ui",
3874
+ "id": "wa-format-bytes",
3875
+ "name": "Format Bytes",
3876
+ "kind": "component",
3877
+ "source": "webawesome",
3878
+ "parents": { "mode": "any", "entries": [] },
3879
+ "contexts": ["application-ui"],
3880
+ "zones": [],
3881
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3882
+ "state": [],
3883
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3884
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3885
+ "layout": {
3886
+ "roles": ["helpers"],
3887
+ "geometry": { "margin": "none", "border": "none", "padding": "none" }
3888
+ },
3889
+ "accessibility": { "obligations": [] },
3890
+ "boundaries": {
3891
+ "rootClass": null,
3892
+ "publicClasses": [],
3893
+ "publicTokens": []
3894
+ },
3895
+ "diagnostics": [],
3896
+ "provenance": {
3897
+ "selection": "ai/component-catalog.json",
3898
+ "composition": "generated-permissive-default"
3899
+ }
3900
+ },
3901
+ {
3902
+ "key": "@kerfjs/ui:wa-format-date",
3903
+ "package": "@kerfjs/ui",
3904
+ "id": "wa-format-date",
3905
+ "name": "Format Date",
3906
+ "kind": "component",
3907
+ "source": "webawesome",
3908
+ "parents": { "mode": "any", "entries": [] },
3909
+ "contexts": ["application-ui"],
3910
+ "zones": [],
3911
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3912
+ "state": [],
3913
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3914
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3915
+ "layout": {
3916
+ "roles": ["helpers"],
3917
+ "geometry": { "margin": "none", "border": "none", "padding": "none" }
3918
+ },
3919
+ "accessibility": { "obligations": [] },
3920
+ "boundaries": {
3921
+ "rootClass": null,
3922
+ "publicClasses": [],
3923
+ "publicTokens": []
3924
+ },
3925
+ "diagnostics": [],
3926
+ "provenance": {
3927
+ "selection": "ai/component-catalog.json",
3928
+ "composition": "generated-permissive-default"
3929
+ }
3930
+ },
3931
+ {
3932
+ "key": "@kerfjs/ui:wa-format-number",
3933
+ "package": "@kerfjs/ui",
3934
+ "id": "wa-format-number",
3935
+ "name": "Format Number",
3936
+ "kind": "component",
3937
+ "source": "webawesome",
3938
+ "parents": { "mode": "any", "entries": [] },
3939
+ "contexts": ["application-ui"],
3940
+ "zones": [],
3941
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3942
+ "state": [],
3943
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3944
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3945
+ "layout": {
3946
+ "roles": ["helpers"],
3947
+ "geometry": { "margin": "none", "border": "none", "padding": "none" }
3948
+ },
3949
+ "accessibility": { "obligations": [] },
3950
+ "boundaries": {
3951
+ "rootClass": null,
3952
+ "publicClasses": [],
3953
+ "publicTokens": []
3954
+ },
3955
+ "diagnostics": [],
3956
+ "provenance": {
3957
+ "selection": "ai/component-catalog.json",
3958
+ "composition": "generated-permissive-default"
3959
+ }
3960
+ },
3961
+ {
3962
+ "key": "@kerfjs/ui:wa-include",
3963
+ "package": "@kerfjs/ui",
3964
+ "id": "wa-include",
3965
+ "name": "Include",
3966
+ "kind": "component",
3967
+ "source": "webawesome",
3968
+ "parents": { "mode": "any", "entries": [] },
3969
+ "contexts": ["application-ui"],
3970
+ "zones": [],
3971
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
3972
+ "state": [],
3973
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
3974
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
3975
+ "layout": {
3976
+ "roles": ["helpers"],
3977
+ "geometry": { "margin": "self", "border": "self", "padding": "self" }
3978
+ },
3979
+ "accessibility": { "obligations": [] },
3980
+ "boundaries": {
3981
+ "rootClass": null,
3982
+ "publicClasses": [],
3983
+ "publicTokens": []
3984
+ },
3985
+ "diagnostics": [],
3986
+ "provenance": {
3987
+ "selection": "ai/component-catalog.json",
3988
+ "composition": "generated-permissive-default"
3989
+ }
3990
+ },
3991
+ {
3992
+ "key": "@kerfjs/ui:wa-intersection-observer",
3993
+ "package": "@kerfjs/ui",
3994
+ "id": "wa-intersection-observer",
3995
+ "name": "Intersection Observer",
3996
+ "kind": "component",
3997
+ "source": "webawesome",
3998
+ "parents": { "mode": "any", "entries": [] },
3999
+ "contexts": ["application-ui"],
4000
+ "zones": [],
4001
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
4002
+ "state": [],
4003
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
4004
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
4005
+ "layout": {
4006
+ "roles": ["helpers"],
4007
+ "geometry": { "margin": "none", "border": "none", "padding": "none" }
4008
+ },
4009
+ "accessibility": { "obligations": [] },
4010
+ "boundaries": {
4011
+ "rootClass": null,
4012
+ "publicClasses": [],
4013
+ "publicTokens": []
4014
+ },
4015
+ "diagnostics": [],
4016
+ "provenance": {
4017
+ "selection": "ai/component-catalog.json",
4018
+ "composition": "generated-permissive-default"
4019
+ }
4020
+ },
4021
+ {
4022
+ "key": "@kerfjs/ui:wa-mutation-observer",
4023
+ "package": "@kerfjs/ui",
4024
+ "id": "wa-mutation-observer",
4025
+ "name": "Mutation Observer",
4026
+ "kind": "component",
4027
+ "source": "webawesome",
4028
+ "parents": { "mode": "any", "entries": [] },
4029
+ "contexts": ["application-ui"],
4030
+ "zones": [],
4031
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
4032
+ "state": [],
4033
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
4034
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
4035
+ "layout": {
4036
+ "roles": ["helpers"],
4037
+ "geometry": { "margin": "none", "border": "none", "padding": "none" }
4038
+ },
4039
+ "accessibility": { "obligations": [] },
4040
+ "boundaries": {
4041
+ "rootClass": null,
4042
+ "publicClasses": [],
4043
+ "publicTokens": []
4044
+ },
4045
+ "diagnostics": [],
4046
+ "provenance": {
4047
+ "selection": "ai/component-catalog.json",
4048
+ "composition": "generated-permissive-default"
4049
+ }
4050
+ },
4051
+ {
4052
+ "key": "@kerfjs/ui:wa-popover",
4053
+ "package": "@kerfjs/ui",
4054
+ "id": "wa-popover",
4055
+ "name": "Popover",
4056
+ "kind": "component",
4057
+ "source": "webawesome",
4058
+ "parents": { "mode": "any", "entries": [] },
4059
+ "contexts": ["application-ui"],
4060
+ "zones": [],
4061
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
4062
+ "state": [],
4063
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
4064
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
4065
+ "layout": {
4066
+ "roles": ["helpers"],
4067
+ "geometry": { "margin": "none", "border": "self", "padding": "self" }
4068
+ },
4069
+ "accessibility": { "obligations": [] },
4070
+ "boundaries": {
4071
+ "rootClass": null,
4072
+ "publicClasses": [],
4073
+ "publicTokens": []
4074
+ },
4075
+ "diagnostics": [],
4076
+ "provenance": {
4077
+ "selection": "ai/component-catalog.json",
4078
+ "composition": "generated-permissive-default"
4079
+ }
4080
+ },
4081
+ {
4082
+ "key": "@kerfjs/ui:wa-popup",
4083
+ "package": "@kerfjs/ui",
4084
+ "id": "wa-popup",
4085
+ "name": "Popup",
4086
+ "kind": "component",
4087
+ "source": "webawesome",
4088
+ "parents": { "mode": "any", "entries": [] },
4089
+ "contexts": ["application-ui"],
4090
+ "zones": [],
4091
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
4092
+ "state": [],
4093
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
4094
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
4095
+ "layout": {
4096
+ "roles": ["helpers"],
4097
+ "geometry": { "margin": "none", "border": "child", "padding": "child" }
4098
+ },
4099
+ "accessibility": { "obligations": [] },
4100
+ "boundaries": {
4101
+ "rootClass": null,
4102
+ "publicClasses": [],
4103
+ "publicTokens": []
4104
+ },
4105
+ "diagnostics": [],
4106
+ "provenance": {
4107
+ "selection": "ai/component-catalog.json",
4108
+ "composition": "generated-permissive-default"
4109
+ }
4110
+ },
4111
+ {
4112
+ "key": "@kerfjs/ui:wa-random-content",
4113
+ "package": "@kerfjs/ui",
4114
+ "id": "wa-random-content",
4115
+ "name": "Random Content",
4116
+ "kind": "component",
4117
+ "source": "webawesome",
4118
+ "parents": { "mode": "any", "entries": [] },
4119
+ "contexts": ["application-ui"],
4120
+ "zones": [],
4121
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
4122
+ "state": [],
4123
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
4124
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
4125
+ "layout": {
4126
+ "roles": ["helpers"],
4127
+ "geometry": { "margin": "none", "border": "child", "padding": "child" }
4128
+ },
4129
+ "accessibility": { "obligations": [] },
4130
+ "boundaries": {
4131
+ "rootClass": null,
4132
+ "publicClasses": [],
4133
+ "publicTokens": []
4134
+ },
4135
+ "diagnostics": [],
4136
+ "provenance": {
4137
+ "selection": "ai/component-catalog.json",
4138
+ "composition": "generated-permissive-default"
4139
+ }
4140
+ },
4141
+ {
4142
+ "key": "@kerfjs/ui:wa-relative-time",
4143
+ "package": "@kerfjs/ui",
4144
+ "id": "wa-relative-time",
4145
+ "name": "Relative Time",
4146
+ "kind": "component",
4147
+ "source": "webawesome",
4148
+ "parents": { "mode": "any", "entries": [] },
4149
+ "contexts": ["application-ui"],
4150
+ "zones": [],
4151
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
4152
+ "state": [],
4153
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
4154
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
4155
+ "layout": {
4156
+ "roles": ["helpers"],
4157
+ "geometry": { "margin": "none", "border": "none", "padding": "none" }
4158
+ },
4159
+ "accessibility": { "obligations": [] },
4160
+ "boundaries": {
4161
+ "rootClass": null,
4162
+ "publicClasses": [],
4163
+ "publicTokens": []
4164
+ },
4165
+ "diagnostics": [],
4166
+ "provenance": {
4167
+ "selection": "ai/component-catalog.json",
4168
+ "composition": "generated-permissive-default"
4169
+ }
4170
+ },
4171
+ {
4172
+ "key": "@kerfjs/ui:wa-resize-observer",
4173
+ "package": "@kerfjs/ui",
4174
+ "id": "wa-resize-observer",
4175
+ "name": "Resize Observer",
4176
+ "kind": "component",
4177
+ "source": "webawesome",
4178
+ "parents": { "mode": "any", "entries": [] },
4179
+ "contexts": ["application-ui"],
4180
+ "zones": [],
4181
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
4182
+ "state": [],
4183
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
4184
+ "responsive": { "owner": "not-applicable", "behaviors": [] },
4185
+ "layout": {
4186
+ "roles": ["helpers"],
4187
+ "geometry": { "margin": "none", "border": "none", "padding": "none" }
4188
+ },
4189
+ "accessibility": { "obligations": [] },
4190
+ "boundaries": {
4191
+ "rootClass": null,
4192
+ "publicClasses": [],
4193
+ "publicTokens": []
4194
+ },
4195
+ "diagnostics": [],
4196
+ "provenance": {
4197
+ "selection": "ai/component-catalog.json",
4198
+ "composition": "generated-permissive-default"
4199
+ }
4200
+ },
4201
+ {
4202
+ "key": "@kerfjs/ui:recipe-app-shell",
4203
+ "package": "@kerfjs/ui",
4204
+ "id": "recipe-app-shell",
4205
+ "name": "Desktop application shell",
4206
+ "kind": "recipe",
4207
+ "source": "kerf",
4208
+ "parents": { "mode": "root", "entries": [] },
4209
+ "contexts": ["application-reference"],
4210
+ "zones": [],
4211
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
4212
+ "state": [
4213
+ { "id": "routing", "owner": "application", "required": false },
4214
+ { "id": "pane visibility", "owner": "application", "required": false },
4215
+ {
4216
+ "id": "pane sizes and persistence",
4217
+ "owner": "application",
4218
+ "required": false
4219
+ },
4220
+ { "id": "workspace data", "owner": "application", "required": false }
4221
+ ],
4222
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
4223
+ "responsive": { "owner": "application", "behaviors": [] },
4224
+ "layout": {
4225
+ "roles": ["reference-composition"],
4226
+ "geometry": {
4227
+ "margin": "composed",
4228
+ "border": "composed",
4229
+ "padding": "composed"
4230
+ }
4231
+ },
4232
+ "accessibility": {
4233
+ "obligations": [
4234
+ "Each pane has one scroll owner and each resize handle keeps its separator keyboard contract."
4235
+ ]
4236
+ },
4237
+ "boundaries": {
4238
+ "rootClass": null,
4239
+ "publicClasses": [],
4240
+ "publicTokens": []
4241
+ },
4242
+ "diagnostics": [],
4243
+ "provenance": {
4244
+ "selection": "ai/component-catalog.json",
4245
+ "composition": "generated-permissive-default"
4246
+ }
4247
+ },
4248
+ {
4249
+ "key": "@kerfjs/ui:recipe-navigation-sidebar",
4250
+ "package": "@kerfjs/ui",
4251
+ "id": "recipe-navigation-sidebar",
4252
+ "name": "Navigation sidebar",
4253
+ "kind": "recipe",
4254
+ "source": "kerf",
4255
+ "parents": { "mode": "root", "entries": [] },
4256
+ "contexts": ["application-reference"],
4257
+ "zones": [],
4258
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
4259
+ "state": [
4260
+ {
4261
+ "id": "information architecture",
4262
+ "owner": "application",
4263
+ "required": false
4264
+ },
4265
+ { "id": "routing", "owner": "application", "required": false },
4266
+ { "id": "permissions", "owner": "application", "required": false },
4267
+ { "id": "disclosure state", "owner": "application", "required": false }
4268
+ ],
4269
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
4270
+ "responsive": { "owner": "application", "behaviors": [] },
4271
+ "layout": {
4272
+ "roles": ["reference-composition"],
4273
+ "geometry": {
4274
+ "margin": "composed",
4275
+ "border": "composed",
4276
+ "padding": "composed"
4277
+ }
4278
+ },
4279
+ "accessibility": {
4280
+ "obligations": [
4281
+ "Native buttons retain names, current state, sequential focus, and disclosure state; rows and standalone footer actions remain at least 44px tall."
4282
+ ]
4283
+ },
4284
+ "boundaries": {
4285
+ "rootClass": null,
4286
+ "publicClasses": [],
4287
+ "publicTokens": []
4288
+ },
4289
+ "diagnostics": [],
4290
+ "provenance": {
4291
+ "selection": "ai/component-catalog.json",
4292
+ "composition": "generated-permissive-default"
4293
+ }
4294
+ },
4295
+ {
4296
+ "key": "@kerfjs/ui:recipe-workspace-header",
4297
+ "package": "@kerfjs/ui",
4298
+ "id": "recipe-workspace-header",
4299
+ "name": "Workspace header",
4300
+ "kind": "recipe",
4301
+ "source": "kerf",
4302
+ "parents": { "mode": "root", "entries": [] },
4303
+ "contexts": ["application-reference"],
4304
+ "zones": [],
4305
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
4306
+ "state": [
4307
+ { "id": "authorization", "owner": "application", "required": false },
4308
+ { "id": "command behavior", "owner": "application", "required": false },
4309
+ { "id": "breadcrumbs", "owner": "application", "required": false },
4310
+ { "id": "product copy", "owner": "application", "required": false }
4311
+ ],
4312
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
4313
+ "responsive": { "owner": "application", "behaviors": [] },
4314
+ "layout": {
4315
+ "roles": ["reference-composition"],
4316
+ "geometry": {
4317
+ "margin": "composed",
4318
+ "border": "composed",
4319
+ "padding": "composed"
4320
+ }
4321
+ },
4322
+ "accessibility": {
4323
+ "obligations": [
4324
+ "Heading order and action focus order remain stable when controls wrap."
4325
+ ]
4326
+ },
4327
+ "boundaries": {
4328
+ "rootClass": null,
4329
+ "publicClasses": [],
4330
+ "publicTokens": []
4331
+ },
4332
+ "diagnostics": [],
4333
+ "provenance": {
4334
+ "selection": "ai/component-catalog.json",
4335
+ "composition": "generated-permissive-default"
4336
+ }
4337
+ },
4338
+ {
4339
+ "key": "@kerfjs/ui:recipe-list-detail-dialog",
4340
+ "package": "@kerfjs/ui",
4341
+ "id": "recipe-list-detail-dialog",
4342
+ "name": "List-detail dialog",
4343
+ "kind": "recipe",
4344
+ "source": "kerf",
4345
+ "parents": { "mode": "root", "entries": [] },
4346
+ "contexts": ["application-reference"],
4347
+ "zones": [],
4348
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
4349
+ "state": [
4350
+ { "id": "open state", "owner": "application", "required": false },
4351
+ { "id": "selected record", "owner": "application", "required": false },
4352
+ { "id": "dismiss policy", "owner": "application", "required": false },
4353
+ { "id": "record actions", "owner": "application", "required": false }
4354
+ ],
4355
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
4356
+ "responsive": { "owner": "application", "behaviors": [] },
4357
+ "layout": {
4358
+ "roles": ["reference-composition"],
4359
+ "geometry": {
4360
+ "margin": "composed",
4361
+ "border": "composed",
4362
+ "padding": "composed"
4363
+ }
4364
+ },
4365
+ "accessibility": {
4366
+ "obligations": [
4367
+ "Web Awesome owns modal focus and Escape; the application adapter restores the invoking control after hide, and PanelHeader supplies the visible hierarchy."
4368
+ ]
4369
+ },
4370
+ "boundaries": {
4371
+ "rootClass": null,
4372
+ "publicClasses": [],
4373
+ "publicTokens": []
4374
+ },
4375
+ "diagnostics": [],
4376
+ "provenance": {
4377
+ "selection": "ai/component-catalog.json",
4378
+ "composition": "generated-permissive-default"
4379
+ }
4380
+ },
4381
+ {
4382
+ "key": "@kerfjs/ui:recipe-composer-form",
4383
+ "package": "@kerfjs/ui",
4384
+ "id": "recipe-composer-form",
4385
+ "name": "Composer form",
4386
+ "kind": "recipe",
4387
+ "source": "kerf",
4388
+ "parents": { "mode": "root", "entries": [] },
4389
+ "contexts": ["application-reference"],
4390
+ "zones": [],
4391
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
4392
+ "state": [
4393
+ { "id": "validation rules", "owner": "application", "required": false },
4394
+ {
4395
+ "id": "draft persistence",
4396
+ "owner": "application",
4397
+ "required": false
4398
+ },
4399
+ { "id": "permissions", "owner": "application", "required": false },
4400
+ { "id": "transport", "owner": "application", "required": false }
4401
+ ],
4402
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
4403
+ "responsive": { "owner": "application", "behaviors": [] },
4404
+ "layout": {
4405
+ "roles": ["reference-composition"],
4406
+ "geometry": {
4407
+ "margin": "composed",
4408
+ "border": "composed",
4409
+ "padding": "composed"
4410
+ }
4411
+ },
4412
+ "accessibility": {
4413
+ "obligations": [
4414
+ "The form references PanelHeader's title and summary ids; production fields own labels and help; invalid submission creates an assertive persistent StateBanner while successful submission creates a polite persistent banner."
4415
+ ]
4416
+ },
4417
+ "boundaries": {
4418
+ "rootClass": null,
4419
+ "publicClasses": [],
4420
+ "publicTokens": []
4421
+ },
4422
+ "diagnostics": [],
4423
+ "provenance": {
4424
+ "selection": "ai/component-catalog.json",
4425
+ "composition": "generated-permissive-default"
4426
+ }
4427
+ },
4428
+ {
4429
+ "key": "@kerfjs/ui:recipe-list-workspace-states",
4430
+ "package": "@kerfjs/ui",
4431
+ "id": "recipe-list-workspace-states",
4432
+ "name": "List workspace states",
4433
+ "kind": "recipe",
4434
+ "source": "kerf",
4435
+ "parents": { "mode": "root", "entries": [] },
4436
+ "contexts": ["application-reference"],
4437
+ "zones": [],
4438
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
4439
+ "state": [
4440
+ { "id": "fetching", "owner": "application", "required": false },
4441
+ { "id": "cache age", "owner": "application", "required": false },
4442
+ { "id": "retry policy", "owner": "application", "required": false },
4443
+ { "id": "domain rows", "owner": "application", "required": false }
4444
+ ],
4445
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
4446
+ "responsive": { "owner": "application", "behaviors": [] },
4447
+ "layout": {
4448
+ "roles": ["reference-composition"],
4449
+ "geometry": {
4450
+ "margin": "composed",
4451
+ "border": "composed",
4452
+ "padding": "composed"
4453
+ }
4454
+ },
4455
+ "accessibility": {
4456
+ "obligations": [
4457
+ "Busy, polite, and assertive states use the appropriate production feedback semantics."
4458
+ ]
4459
+ },
4460
+ "boundaries": {
4461
+ "rootClass": null,
4462
+ "publicClasses": [],
4463
+ "publicTokens": []
4464
+ },
4465
+ "diagnostics": [],
4466
+ "provenance": {
4467
+ "selection": "ai/component-catalog.json",
4468
+ "composition": "generated-permissive-default"
4469
+ }
4470
+ },
4471
+ {
4472
+ "key": "@kerfjs/ui:recipe-compact-toolbar",
4473
+ "package": "@kerfjs/ui",
4474
+ "id": "recipe-compact-toolbar",
4475
+ "name": "Compact toolbar choices and actions",
4476
+ "kind": "recipe",
4477
+ "source": "kerf",
4478
+ "parents": { "mode": "root", "entries": [] },
4479
+ "contexts": ["application-reference"],
4480
+ "zones": [],
4481
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
4482
+ "state": [
4483
+ {
4484
+ "id": "controlled values",
4485
+ "owner": "application",
4486
+ "required": false
4487
+ },
4488
+ { "id": "actions", "owner": "application", "required": false },
4489
+ { "id": "persistence", "owner": "application", "required": false },
4490
+ {
4491
+ "id": "responsive priority",
4492
+ "owner": "application",
4493
+ "required": false
4494
+ }
4495
+ ],
4496
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
4497
+ "responsive": { "owner": "application", "behaviors": [] },
4498
+ "layout": {
4499
+ "roles": ["reference-composition"],
4500
+ "geometry": {
4501
+ "margin": "composed",
4502
+ "border": "composed",
4503
+ "padding": "composed"
4504
+ }
4505
+ },
4506
+ "accessibility": {
4507
+ "obligations": [
4508
+ "Each control retains its own native name, pressed/value state, and keyboard contract."
4509
+ ]
4510
+ },
4511
+ "boundaries": {
4512
+ "rootClass": null,
4513
+ "publicClasses": [],
4514
+ "publicTokens": []
4515
+ },
4516
+ "diagnostics": [],
4517
+ "provenance": {
4518
+ "selection": "ai/component-catalog.json",
4519
+ "composition": "generated-permissive-default"
4520
+ }
4521
+ },
4522
+ {
4523
+ "key": "@kerfjs/ui:recipe-navigation-stack",
4524
+ "package": "@kerfjs/ui",
4525
+ "id": "recipe-navigation-stack",
4526
+ "name": "Navigation stack",
4527
+ "kind": "recipe",
4528
+ "source": "kerf",
4529
+ "parents": { "mode": "root", "entries": [] },
4530
+ "contexts": ["application-reference"],
4531
+ "zones": [],
4532
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
4533
+ "state": [
4534
+ {
4535
+ "id": "the stack (a signal of views)",
4536
+ "owner": "application",
4537
+ "required": false
4538
+ },
4539
+ { "id": "selection", "owner": "application", "required": false },
4540
+ { "id": "routing", "owner": "application", "required": false },
4541
+ { "id": "data", "owner": "application", "required": false }
4542
+ ],
4543
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
4544
+ "responsive": { "owner": "application", "behaviors": [] },
4545
+ "layout": {
4546
+ "roles": ["reference-composition"],
4547
+ "geometry": {
4548
+ "margin": "composed",
4549
+ "border": "composed",
4550
+ "padding": "composed"
4551
+ }
4552
+ },
4553
+ "accessibility": {
4554
+ "obligations": [
4555
+ "The back control is a real button; reduced motion collapses the slide to instant."
4556
+ ]
4557
+ },
4558
+ "boundaries": {
4559
+ "rootClass": null,
4560
+ "publicClasses": [],
4561
+ "publicTokens": []
4562
+ },
4563
+ "diagnostics": [],
4564
+ "provenance": {
4565
+ "selection": "ai/component-catalog.json",
4566
+ "composition": "generated-permissive-default"
4567
+ }
4568
+ },
4569
+ {
4570
+ "key": "@kerfjs/ui:recipe-loading-inspector",
4571
+ "package": "@kerfjs/ui",
4572
+ "id": "recipe-loading-inspector",
4573
+ "name": "Loading inspector",
4574
+ "kind": "recipe",
4575
+ "source": "kerf",
4576
+ "parents": { "mode": "root", "entries": [] },
4577
+ "contexts": ["application-reference"],
4578
+ "zones": [],
4579
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
4580
+ "state": [
4581
+ {
4582
+ "id": "loading lifecycle",
4583
+ "owner": "application",
4584
+ "required": false
4585
+ },
4586
+ {
4587
+ "id": "which values are unknown",
4588
+ "owner": "application",
4589
+ "required": false
4590
+ },
4591
+ {
4592
+ "id": "fetching, transport, and domain data",
4593
+ "owner": "application",
4594
+ "required": false
4595
+ }
4596
+ ],
4597
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
4598
+ "responsive": { "owner": "application", "behaviors": [] },
4599
+ "layout": {
4600
+ "roles": ["reference-composition"],
4601
+ "geometry": {
4602
+ "margin": "composed",
4603
+ "border": "composed",
4604
+ "padding": "composed"
4605
+ }
4606
+ },
4607
+ "accessibility": {
4608
+ "obligations": [
4609
+ "Each component marks itself aria-busy and disables its own controls while loading; the composition keeps labels and structure stable across the transition."
4610
+ ]
4611
+ },
4612
+ "boundaries": {
4613
+ "rootClass": null,
4614
+ "publicClasses": [],
4615
+ "publicTokens": []
4616
+ },
4617
+ "diagnostics": [],
4618
+ "provenance": {
4619
+ "selection": "ai/component-catalog.json",
4620
+ "composition": "generated-permissive-default"
4621
+ }
4622
+ },
4623
+ {
4624
+ "key": "@kerfjs/ui:recipe-collapsible-sidebar",
4625
+ "package": "@kerfjs/ui",
4626
+ "id": "recipe-collapsible-sidebar",
4627
+ "name": "Collapsible sidebar",
4628
+ "kind": "recipe",
4629
+ "source": "kerf",
4630
+ "parents": { "mode": "root", "entries": [] },
4631
+ "contexts": ["application-reference"],
4632
+ "zones": [],
4633
+ "children": { "mode": "any", "concepts": [], "requiredConcepts": [] },
4634
+ "state": [
4635
+ {
4636
+ "id": "each panel's collapsed signal",
4637
+ "owner": "application",
4638
+ "required": false
4639
+ },
4640
+ { "id": "panel sizes", "owner": "application", "required": false },
4641
+ {
4642
+ "id": "routing and selection",
4643
+ "owner": "application",
4644
+ "required": false
4645
+ },
4646
+ { "id": "content", "owner": "application", "required": false }
4647
+ ],
4648
+ "wiring": { "required": false, "helpers": [], "obligations": [] },
4649
+ "responsive": { "owner": "application", "behaviors": [] },
4650
+ "layout": {
4651
+ "roles": ["reference-composition"],
4652
+ "geometry": {
4653
+ "margin": "composed",
4654
+ "border": "composed",
4655
+ "padding": "composed"
4656
+ }
4657
+ },
4658
+ "accessibility": {
4659
+ "obligations": [
4660
+ "Each panel is a labeled aside that is aria-hidden while collapsed; toggles carry aria-expanded and the standard per-side glyph; while compact an open panel is an overlay with a backdrop, Escape and backdrop-click dismiss, and a trapped Tab ring."
4661
+ ]
4662
+ },
4663
+ "boundaries": {
4664
+ "rootClass": null,
4665
+ "publicClasses": [],
4666
+ "publicTokens": []
4667
+ },
4668
+ "diagnostics": [],
4669
+ "provenance": {
4670
+ "selection": "ai/component-catalog.json",
4671
+ "composition": "generated-permissive-default"
4672
+ }
4673
+ }
4674
+ ]
4675
+ }