@kerfjs/ui 5.0.0-beta.17 → 5.0.0-beta.21

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 (274) hide show
  1. package/README.md +221 -81
  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 +101 -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 +326 -0
  17. package/ai/component-catalog-v2.d.ts +67 -0
  18. package/ai/component-catalog-v2.json +4441 -0
  19. package/ai/component-catalog-v2.schema.json +246 -0
  20. package/ai/component-catalog.json +649 -6
  21. package/ai/component-catalog.schema.json +15 -0
  22. package/ai/public-api-signatures-v1.md +357 -91
  23. package/ai/skill.md +95 -50
  24. package/ai/webawesome-jsx-signatures-v1.md +1 -1
  25. package/analyzer/cli.mjs +46 -0
  26. package/analyzer/index.d.mts +45 -0
  27. package/analyzer/index.mjs +743 -0
  28. package/analyzer/report.schema.json +66 -0
  29. package/dist/app-tab.d.ts +1 -1
  30. package/dist/app-tab.js +1 -1
  31. package/dist/browser/pane.js +3 -0
  32. package/dist/browser/sunken-panel.js +3 -0
  33. package/dist/catalog-resources.d.ts +34 -0
  34. package/dist/catalog-resources.js +22 -0
  35. package/dist/catalog-resources.js.map +1 -0
  36. package/dist/catalog.d.ts +29 -4
  37. package/dist/catalog.js +302 -84
  38. package/dist/catalog.js.map +1 -1
  39. package/dist/chunk-5VTB2BKP.js +35 -0
  40. package/dist/chunk-5VTB2BKP.js.map +1 -0
  41. package/dist/chunk-6WTETUZ6.js +21 -0
  42. package/dist/chunk-6WTETUZ6.js.map +1 -0
  43. package/dist/chunk-7KEUJIIC.js +218 -0
  44. package/dist/chunk-7KEUJIIC.js.map +1 -0
  45. package/dist/chunk-7L6EHUMV.js +31 -0
  46. package/dist/chunk-7L6EHUMV.js.map +1 -0
  47. package/dist/{chunk-XXMOARTH.js → chunk-AASLYRGE.js} +57 -16
  48. package/dist/chunk-AASLYRGE.js.map +1 -0
  49. package/dist/chunk-BBRXX6PF.js +108 -0
  50. package/dist/chunk-BBRXX6PF.js.map +1 -0
  51. package/dist/{chunk-6NLRBSVX.js → chunk-CN2XNTAM.js} +129 -72
  52. package/dist/chunk-CN2XNTAM.js.map +1 -0
  53. package/dist/chunk-DPDBVKNA.js +113 -0
  54. package/dist/chunk-DPDBVKNA.js.map +1 -0
  55. package/dist/chunk-DSNIYOZ3.js +114 -0
  56. package/dist/chunk-DSNIYOZ3.js.map +1 -0
  57. package/dist/chunk-ELSJX4W7.js +68 -0
  58. package/dist/chunk-ELSJX4W7.js.map +1 -0
  59. package/dist/{chunk-AHQI52QO.js → chunk-FEY65TBV.js} +6 -2
  60. package/dist/chunk-FEY65TBV.js.map +1 -0
  61. package/dist/chunk-JRKSK2HX.js +79 -0
  62. package/dist/chunk-JRKSK2HX.js.map +1 -0
  63. package/dist/chunk-K57KRAOV.js +117 -0
  64. package/dist/chunk-K57KRAOV.js.map +1 -0
  65. package/dist/chunk-LPOMRC4C.js +25 -0
  66. package/dist/chunk-LPOMRC4C.js.map +1 -0
  67. package/dist/chunk-M7JBER5U.js +41 -0
  68. package/dist/chunk-M7JBER5U.js.map +1 -0
  69. package/dist/chunk-NENBUYX5.js +79 -0
  70. package/dist/chunk-NENBUYX5.js.map +1 -0
  71. package/dist/chunk-OHU6CI22.js +83 -0
  72. package/dist/chunk-OHU6CI22.js.map +1 -0
  73. package/dist/{chunk-YGN7OMLT.js → chunk-OZWU5ZPZ.js} +2 -2
  74. package/dist/chunk-OZWU5ZPZ.js.map +1 -0
  75. package/dist/chunk-PIDTEQ3U.js +105 -0
  76. package/dist/chunk-PIDTEQ3U.js.map +1 -0
  77. package/dist/chunk-PX3YSS5C.js +32 -0
  78. package/dist/chunk-PX3YSS5C.js.map +1 -0
  79. package/dist/chunk-PZQVSDLH.js +61 -0
  80. package/dist/chunk-PZQVSDLH.js.map +1 -0
  81. package/dist/chunk-QO55FN2Y.js +20 -0
  82. package/dist/chunk-QO55FN2Y.js.map +1 -0
  83. package/dist/chunk-QQFJMRIB.js +45 -0
  84. package/dist/chunk-QQFJMRIB.js.map +1 -0
  85. package/dist/chunk-RYRIFZCT.js +58 -0
  86. package/dist/chunk-RYRIFZCT.js.map +1 -0
  87. package/dist/{chunk-7BR3DO2A.js → chunk-SRSJO5QE.js} +13 -4
  88. package/dist/chunk-SRSJO5QE.js.map +1 -0
  89. package/dist/chunk-VLYV65LK.js +38 -0
  90. package/dist/chunk-VLYV65LK.js.map +1 -0
  91. package/dist/chunk-W4CXQYSG.js +23 -0
  92. package/dist/chunk-W4CXQYSG.js.map +1 -0
  93. package/dist/{chunk-WXMGNX2Y.js → chunk-W7YD6E4N.js} +2 -2
  94. package/dist/chunk-W7YD6E4N.js.map +1 -0
  95. package/dist/{chunk-56RJXPHG.js → chunk-Y6LYKFXY.js} +1 -1
  96. package/dist/{chunk-56RJXPHG.js.map → chunk-Y6LYKFXY.js.map} +1 -1
  97. package/dist/collapsible-panel.d.ts +2 -2
  98. package/dist/collapsible-panel.js +47 -6
  99. package/dist/collapsible-panel.js.map +1 -1
  100. package/dist/device-class.js +33 -5
  101. package/dist/device-class.js.map +1 -1
  102. package/dist/disclosure-arrow.js +1 -1
  103. package/dist/empty-state.d.ts +1 -1
  104. package/dist/empty-state.js +1 -1
  105. package/dist/floating-toolbar.d.ts +1 -1
  106. package/dist/floating-toolbar.js +1 -1
  107. package/dist/index.d.ts +6 -4
  108. package/dist/index.js +27 -25
  109. package/dist/list-action-row.d.ts +1 -1
  110. package/dist/list-action-row.js +1 -1
  111. package/dist/list-header.d.ts +30 -9
  112. package/dist/list-header.js +1 -1
  113. package/dist/list-inset-control.d.ts +1 -1
  114. package/dist/list-inset-control.js +1 -1
  115. package/dist/list-inset-text.d.ts +1 -1
  116. package/dist/list-inset-text.js +1 -1
  117. package/dist/list-item.d.ts +1 -1
  118. package/dist/list-item.js +1 -1
  119. package/dist/loading-spinner.js +1 -1
  120. package/dist/nav-stack.d.ts +1 -1
  121. package/dist/nav-stack.js +1 -1
  122. package/dist/pane.d.ts +49 -0
  123. package/dist/pane.js +4 -0
  124. package/dist/pane.js.map +1 -0
  125. package/dist/panel-header.d.ts +10 -4
  126. package/dist/panel-header.js +1 -1
  127. package/dist/resizable-region.d.ts +1 -1
  128. package/dist/resizable-region.js +1 -1
  129. package/dist/segmented-control.d.ts +6 -6
  130. package/dist/segmented-control.js +1 -1
  131. package/dist/select.d.ts +11 -5
  132. package/dist/select.js +1 -1
  133. package/dist/skeleton.d.ts +1 -1
  134. package/dist/skeleton.js +1 -1
  135. package/dist/split-view.d.ts +1 -1
  136. package/dist/split-view.js +70 -10
  137. package/dist/split-view.js.map +1 -1
  138. package/dist/state-banner.d.ts +4 -3
  139. package/dist/state-banner.js +1 -1
  140. package/dist/styles/catalog.css +32 -6
  141. package/dist/styles/layout.css +2 -20
  142. package/dist/styles/pane.css +62 -0
  143. package/dist/styles/segmented-control.css +3 -7
  144. package/dist/styles/sunken-panel.css +18 -0
  145. package/dist/sunken-panel.d.ts +16 -0
  146. package/dist/sunken-panel.js +3 -0
  147. package/dist/sunken-panel.js.map +1 -0
  148. package/dist/tab-bar.d.ts +4 -3
  149. package/dist/tab-bar.js +1 -1
  150. package/dist/tab-scaffold.d.ts +6 -6
  151. package/dist/tab-scaffold.js +43 -8
  152. package/dist/tab-scaffold.js.map +1 -1
  153. package/dist/token-search-field.d.ts +25 -9
  154. package/dist/token-search-field.js +1 -1
  155. package/dist/toolbar-control-group.d.ts +10 -6
  156. package/dist/toolbar-control-group.js +1 -1
  157. package/dist/toolbar-text.d.ts +10 -11
  158. package/dist/toolbar-text.js +1 -1
  159. package/dist/toolbar.d.ts +1 -1
  160. package/dist/toolbar.js +1 -1
  161. package/dist/value-table.d.ts +2 -2
  162. package/dist/value-table.js +1 -1
  163. package/dist/wire-catalog.d.ts +31 -2
  164. package/dist/wire-catalog.js +203 -8
  165. package/dist/wire-catalog.js.map +1 -1
  166. package/dist/wire-nav-stack.js +22 -7
  167. package/dist/wire-nav-stack.js.map +1 -1
  168. package/dist/wire-resizable-regions.d.ts +1 -1
  169. package/dist/wire-resizable-regions.js +1 -1
  170. package/dist/wire-sidebar.js +52 -41
  171. package/dist/wire-sidebar.js.map +1 -1
  172. package/dist/wire-tab-bars.d.ts +5 -2
  173. package/dist/wire-tab-bars.js +1 -1
  174. package/dist/wire-tab-scaffold.js +9 -4
  175. package/dist/wire-tab-scaffold.js.map +1 -1
  176. package/dist/wire-token-search-fields.d.ts +12 -7
  177. package/dist/wire-token-search-fields.js +1 -1
  178. package/dist/workbench.d.ts +1 -1
  179. package/dist/workbench.js +56 -9
  180. package/dist/workbench.js.map +1 -1
  181. package/docs/app-layouts.md +7 -7
  182. package/docs/catalog.md +249 -46
  183. package/docs/collapsible-panel.md +38 -11
  184. package/docs/component-contract.md +132 -7
  185. package/docs/component-selection.md +79 -67
  186. package/docs/design/templates.md +1 -1
  187. package/docs/design-philosophy.md +7 -9
  188. package/docs/device-class.md +8 -8
  189. package/docs/examples/application-ui-profile.json +60 -0
  190. package/docs/examples/command-palette-adapter.tsx +67 -17
  191. package/docs/examples/component-catalog-extension-v2.json +81 -0
  192. package/docs/examples/component-catalog-extension.json +45 -0
  193. package/docs/layout.md +51 -32
  194. package/docs/nav-stack.md +15 -6
  195. package/docs/recipes.md +4 -4
  196. package/docs/split-view.md +3 -3
  197. package/docs/sunken-panel.md +43 -0
  198. package/docs/tab-scaffold.md +16 -7
  199. package/docs/type-contracts.md +99 -0
  200. package/docs/ui-analyzer.md +81 -0
  201. package/docs/ui-doctor.md +77 -0
  202. package/docs/ui-evaluator.md +122 -0
  203. package/docs/webawesome-theme.md +8 -8
  204. package/docs/workbench.md +18 -5
  205. package/doctor/cli.mjs +115 -0
  206. package/doctor/config.schema.json +68 -0
  207. package/doctor/index.d.mts +116 -0
  208. package/doctor/index.mjs +1256 -0
  209. package/doctor/report.schema.json +118 -0
  210. package/evaluator/cli.mjs +89 -0
  211. package/evaluator/index.d.mts +90 -0
  212. package/evaluator/index.mjs +1138 -0
  213. package/evaluator/report.schema.json +152 -0
  214. package/llms.txt +58 -15
  215. package/package.json +70 -10
  216. package/ux-demo/recipes/app-shell.tsx +206 -10
  217. package/ux-demo/recipes/collapsible-sidebar.tsx +167 -44
  218. package/ux-demo/recipes/compact-toolbar.tsx +114 -12
  219. package/ux-demo/recipes/composer-form.tsx +106 -18
  220. package/ux-demo/recipes/list-detail-dialog.tsx +144 -8
  221. package/ux-demo/recipes/list-workspace-states.tsx +165 -8
  222. package/ux-demo/recipes/loaders.ts +5 -2
  223. package/ux-demo/recipes/loading-inspector.tsx +124 -41
  224. package/ux-demo/recipes/mount-recipe.ts +27 -6
  225. package/ux-demo/recipes/navigation-sidebar.tsx +120 -9
  226. package/ux-demo/recipes/navigation-stack.tsx +61 -19
  227. package/ux-demo/recipes/types.ts +3 -1
  228. package/ux-demo/recipes/workspace-header.tsx +57 -2
  229. package/dist/chunk-2Z5TWHKQ.js +0 -34
  230. package/dist/chunk-2Z5TWHKQ.js.map +0 -1
  231. package/dist/chunk-37T3VNIZ.js +0 -19
  232. package/dist/chunk-37T3VNIZ.js.map +0 -1
  233. package/dist/chunk-55DATV3A.js +0 -10
  234. package/dist/chunk-55DATV3A.js.map +0 -1
  235. package/dist/chunk-5ATCDSQS.js +0 -42
  236. package/dist/chunk-5ATCDSQS.js.map +0 -1
  237. package/dist/chunk-5E2HVJ33.js +0 -10
  238. package/dist/chunk-5E2HVJ33.js.map +0 -1
  239. package/dist/chunk-6NLRBSVX.js.map +0 -1
  240. package/dist/chunk-7BR3DO2A.js.map +0 -1
  241. package/dist/chunk-7JB7VPRI.js +0 -34
  242. package/dist/chunk-7JB7VPRI.js.map +0 -1
  243. package/dist/chunk-7LDCTU7D.js +0 -134
  244. package/dist/chunk-7LDCTU7D.js.map +0 -1
  245. package/dist/chunk-AHQI52QO.js.map +0 -1
  246. package/dist/chunk-AQNKJRFH.js +0 -79
  247. package/dist/chunk-AQNKJRFH.js.map +0 -1
  248. package/dist/chunk-AVZHJN6C.js +0 -14
  249. package/dist/chunk-AVZHJN6C.js.map +0 -1
  250. package/dist/chunk-B24C4A6T.js +0 -22
  251. package/dist/chunk-B24C4A6T.js.map +0 -1
  252. package/dist/chunk-CH4SQ6H5.js +0 -39
  253. package/dist/chunk-CH4SQ6H5.js.map +0 -1
  254. package/dist/chunk-DAFFDO33.js +0 -14
  255. package/dist/chunk-DAFFDO33.js.map +0 -1
  256. package/dist/chunk-I7INRJO4.js +0 -17
  257. package/dist/chunk-I7INRJO4.js.map +0 -1
  258. package/dist/chunk-L4OKFDJY.js +0 -24
  259. package/dist/chunk-L4OKFDJY.js.map +0 -1
  260. package/dist/chunk-M5JRI6MN.js +0 -27
  261. package/dist/chunk-M5JRI6MN.js.map +0 -1
  262. package/dist/chunk-RNPGFQ33.js +0 -10
  263. package/dist/chunk-RNPGFQ33.js.map +0 -1
  264. package/dist/chunk-VPCTCUED.js +0 -10
  265. package/dist/chunk-VPCTCUED.js.map +0 -1
  266. package/dist/chunk-WRTAQ7BZ.js +0 -23
  267. package/dist/chunk-WRTAQ7BZ.js.map +0 -1
  268. package/dist/chunk-WVPYVDXY.js +0 -15
  269. package/dist/chunk-WVPYVDXY.js.map +0 -1
  270. package/dist/chunk-WXMGNX2Y.js.map +0 -1
  271. package/dist/chunk-XXMOARTH.js.map +0 -1
  272. package/dist/chunk-YGN7OMLT.js.map +0 -1
  273. package/dist/chunk-ZQQ6P4SV.js +0 -20
  274. package/dist/chunk-ZQQ6P4SV.js.map +0 -1
@@ -0,0 +1,114 @@
1
+ import { filterDataAttributes, filterControlAttributes } from './chunk-SRSJO5QE.js';
2
+ import { Skeleton } from './chunk-PZQVSDLH.js';
3
+ import { DisclosureArrow } from './chunk-Y6LYKFXY.js';
4
+ import { jsx, jsxs } from 'kerfjs/jsx-runtime';
5
+
6
+ var PROTECTED_ROOT_DATA_ATTRIBUTES = /* @__PURE__ */ new Set([
7
+ "data-component",
8
+ "data-action",
9
+ "data-has-badge",
10
+ "data-has-count",
11
+ "data-toggle"
12
+ ]);
13
+ var PROTECTED_TRIGGER_DATA_ATTRIBUTES = /* @__PURE__ */ new Set(["data-action"]);
14
+ function ListHeader({
15
+ label,
16
+ count,
17
+ countLabel,
18
+ badge,
19
+ action,
20
+ actionLabel,
21
+ actionIcon,
22
+ actionDisabled = false,
23
+ disabledReason,
24
+ expanded,
25
+ toggle = false,
26
+ placeholder = false,
27
+ rootAttributes = {},
28
+ triggerAttributes = {}
29
+ }) {
30
+ const extensionRootAttributes = filterDataAttributes(
31
+ rootAttributes,
32
+ PROTECTED_ROOT_DATA_ATTRIBUTES
33
+ );
34
+ const extensionTriggerAttributes = filterControlAttributes(
35
+ triggerAttributes,
36
+ PROTECTED_TRIGGER_DATA_ATTRIBUTES
37
+ );
38
+ const normalizedCount = typeof count === "number" && Number.isSafeInteger(count) && count >= 0 ? count : void 0;
39
+ const normalizedCountLabel = normalizedCount === void 0 ? void 0 : typeof countLabel === "string" && countLabel.trim() ? countLabel : String(normalizedCount);
40
+ const renderedBadge = normalizedCount === void 0 ? badge : void 0;
41
+ const renderedActionIcon = actionIcon ?? (toggle ? /* @__PURE__ */ jsx(DisclosureArrow, { open: Boolean(expanded) }) : void 0);
42
+ const accessibleLabel = normalizedCount === void 0 ? void 0 : `${label}, ${normalizedCountLabel}`;
43
+ const indicator = placeholder ? (normalizedCount !== void 0 || renderedBadge) && /* @__PURE__ */ jsx("span", { class: "kui-list-header__badge", children: /* @__PURE__ */ jsx(Skeleton, { width: "1.75em" }) }) : normalizedCount === void 0 ? renderedBadge && /* @__PURE__ */ jsx("span", { class: "kui-list-header__badge", children: renderedBadge }) : /* @__PURE__ */ jsx("span", { class: "kui-list-header__count", "aria-hidden": "true", children: normalizedCount });
44
+ const busy = placeholder ? "true" : void 0;
45
+ if (toggle) {
46
+ return /* @__PURE__ */ jsx(
47
+ "header",
48
+ {
49
+ ...extensionRootAttributes,
50
+ class: "kui-list-header",
51
+ "data-component": "list-header",
52
+ "data-has-badge": String(Boolean(renderedBadge)),
53
+ "data-has-count": String(normalizedCount !== void 0),
54
+ "data-toggle": "true",
55
+ "data-placeholder": placeholder ? "true" : void 0,
56
+ "aria-busy": busy,
57
+ children: /* @__PURE__ */ jsxs(
58
+ "button",
59
+ {
60
+ ...extensionTriggerAttributes,
61
+ type: "button",
62
+ class: "kui-list-header__title kui-list-header__toggle",
63
+ "data-action": placeholder ? void 0 : action,
64
+ title: actionDisabled ? disabledReason : void 0,
65
+ disabled: actionDisabled || placeholder || void 0,
66
+ "aria-label": accessibleLabel,
67
+ "aria-expanded": String(Boolean(expanded)),
68
+ children: [
69
+ /* @__PURE__ */ jsx("span", { class: "kui-list-header__label", children: label }),
70
+ indicator,
71
+ renderedActionIcon && /* @__PURE__ */ jsx("span", { class: "kui-list-header__action-layer", children: renderedActionIcon })
72
+ ]
73
+ }
74
+ )
75
+ }
76
+ );
77
+ }
78
+ return /* @__PURE__ */ jsxs(
79
+ "header",
80
+ {
81
+ ...extensionRootAttributes,
82
+ class: "kui-list-header",
83
+ "data-component": "list-header",
84
+ "data-has-badge": String(Boolean(renderedBadge)),
85
+ "data-has-count": String(normalizedCount !== void 0),
86
+ "data-toggle": "false",
87
+ "data-placeholder": placeholder ? "true" : void 0,
88
+ "aria-busy": busy,
89
+ children: [
90
+ /* @__PURE__ */ jsxs("div", { class: "kui-list-header__title", children: [
91
+ /* @__PURE__ */ jsx("h2", { class: "kui-list-header__label", "aria-label": accessibleLabel, children: label }),
92
+ indicator
93
+ ] }),
94
+ action && /* @__PURE__ */ jsx(
95
+ "button",
96
+ {
97
+ ...extensionTriggerAttributes,
98
+ type: "button",
99
+ class: "kui-list-header__action",
100
+ "data-action": placeholder ? void 0 : action,
101
+ "aria-label": actionLabel,
102
+ title: actionDisabled ? disabledReason : actionLabel,
103
+ disabled: actionDisabled || placeholder || void 0,
104
+ children: renderedActionIcon
105
+ }
106
+ )
107
+ ]
108
+ }
109
+ );
110
+ }
111
+
112
+ export { ListHeader };
113
+
114
+ //# sourceMappingURL=chunk-DSNIYOZ3.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/list-header.tsx"],"names":[],"mappings":"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","file":"chunk-DSNIYOZ3.js","sourcesContent":["import type { SafeHtml } from 'kerfjs';\n\nimport { DisclosureArrow } from './disclosure-arrow.js';\nimport {\n filterControlAttributes,\n filterDataAttributes,\n} from './extension-attributes.js';\nimport { Skeleton } from './skeleton.js';\n\nconst PROTECTED_ROOT_DATA_ATTRIBUTES = new Set([\n 'data-component',\n 'data-action',\n 'data-has-badge',\n 'data-has-count',\n 'data-toggle',\n]);\nconst PROTECTED_TRIGGER_DATA_ATTRIBUTES = new Set(['data-action']);\n\ntype ListHeaderRootAttributes = Readonly<\n Record<`data-${string}`, string | undefined> & {\n 'data-component'?: never;\n 'data-action'?: never;\n 'data-has-badge'?: never;\n 'data-has-count'?: never;\n 'data-toggle'?: never;\n }\n>;\n\ntype ListHeaderTriggerAttributes = Readonly<\n Record<`data-${string}`, string | undefined> & {\n 'data-action'?: never;\n popoverTarget?: string;\n popoverTargetAction?: 'toggle' | 'show' | 'hide';\n 'aria-controls'?: string;\n 'aria-haspopup'?: 'dialog' | 'menu' | 'listbox' | 'tree' | 'grid' | 'true';\n }\n>;\n\ninterface ListHeaderBaseProps {\n label: string;\n /** Render as an unanimated loading skeleton: keep the label and action affordance, disable interaction. */\n placeholder?: boolean;\n rootAttributes?: ListHeaderRootAttributes;\n triggerAttributes?: ListHeaderTriggerAttributes;\n}\n\ntype ListHeaderModeProps =\n | {\n /** Render the title as a controlled disclosure trigger. */\n toggle: true;\n action: string;\n expanded: boolean;\n actionIcon?: SafeHtml;\n actionLabel?: never;\n actionDisabled?: boolean;\n disabledReason?: string;\n }\n | {\n /** Render a separately named trailing action. */\n toggle?: false;\n action: string;\n actionLabel: string;\n actionIcon: SafeHtml;\n expanded?: never;\n actionDisabled?: boolean;\n disabledReason?: string;\n }\n | {\n /** Render a passive section heading. */\n toggle?: false;\n action?: never;\n actionLabel?: never;\n actionIcon?: never;\n expanded?: never;\n actionDisabled?: never;\n disabledReason?: never;\n };\n\ntype ListHeaderIndicatorProps =\n | { count: number; countLabel: string; badge?: never }\n | { count?: never; countLabel?: never; badge?: SafeHtml };\n\nexport type ListHeaderProps = ListHeaderBaseProps &\n ListHeaderIndicatorProps &\n ListHeaderModeProps;\n\nexport function ListHeader({\n label,\n count,\n countLabel,\n badge,\n action,\n actionLabel,\n actionIcon,\n actionDisabled = false,\n disabledReason,\n expanded,\n toggle = false,\n placeholder = false,\n rootAttributes = {},\n triggerAttributes = {},\n}: ListHeaderProps) {\n const extensionRootAttributes = filterDataAttributes(\n rootAttributes,\n PROTECTED_ROOT_DATA_ATTRIBUTES,\n );\n const extensionTriggerAttributes = filterControlAttributes(\n triggerAttributes,\n PROTECTED_TRIGGER_DATA_ATTRIBUTES,\n );\n const normalizedCount =\n typeof count === 'number' && Number.isSafeInteger(count) && count >= 0\n ? count\n : undefined;\n const normalizedCountLabel =\n normalizedCount === undefined\n ? undefined\n : typeof countLabel === 'string' && countLabel.trim()\n ? countLabel\n : String(normalizedCount);\n const renderedBadge = normalizedCount === undefined ? badge : undefined;\n const renderedActionIcon =\n actionIcon ??\n (toggle ? <DisclosureArrow open={Boolean(expanded)} /> : undefined);\n const accessibleLabel =\n normalizedCount === undefined\n ? undefined\n : `${label}, ${normalizedCountLabel}`;\n const indicator = placeholder ? (\n (normalizedCount !== undefined || renderedBadge) && (\n <span class=\"kui-list-header__badge\">\n <Skeleton width=\"1.75em\" />\n </span>\n )\n ) : normalizedCount === undefined ? (\n renderedBadge && <span class=\"kui-list-header__badge\">{renderedBadge}</span>\n ) : (\n <span class=\"kui-list-header__count\" aria-hidden=\"true\">\n {normalizedCount}\n </span>\n );\n const busy = placeholder ? ('true' as const) : undefined;\n if (toggle) {\n return (\n <header\n {...extensionRootAttributes}\n class=\"kui-list-header\"\n data-component=\"list-header\"\n data-has-badge={String(Boolean(renderedBadge))}\n data-has-count={String(normalizedCount !== undefined)}\n data-toggle=\"true\"\n data-placeholder={placeholder ? 'true' : undefined}\n aria-busy={busy}\n >\n <button\n {...extensionTriggerAttributes}\n type=\"button\"\n class=\"kui-list-header__title kui-list-header__toggle\"\n data-action={placeholder ? undefined : action}\n title={actionDisabled ? disabledReason : undefined}\n disabled={actionDisabled || placeholder || undefined}\n aria-label={accessibleLabel}\n aria-expanded={String(Boolean(expanded))}\n >\n <span class=\"kui-list-header__label\">{label}</span>\n {indicator}\n {renderedActionIcon && (\n <span class=\"kui-list-header__action-layer\">\n {renderedActionIcon}\n </span>\n )}\n </button>\n </header>\n );\n }\n return (\n <header\n {...extensionRootAttributes}\n class=\"kui-list-header\"\n data-component=\"list-header\"\n data-has-badge={String(Boolean(renderedBadge))}\n data-has-count={String(normalizedCount !== undefined)}\n data-toggle=\"false\"\n data-placeholder={placeholder ? 'true' : undefined}\n aria-busy={busy}\n >\n <div class=\"kui-list-header__title\">\n <h2 class=\"kui-list-header__label\" aria-label={accessibleLabel}>\n {label}\n </h2>\n {indicator}\n </div>\n {action && (\n <button\n {...extensionTriggerAttributes}\n type=\"button\"\n class=\"kui-list-header__action\"\n data-action={placeholder ? undefined : action}\n aria-label={actionLabel}\n title={actionDisabled ? disabledReason : actionLabel}\n disabled={actionDisabled || placeholder || undefined}\n >\n {renderedActionIcon}\n </button>\n )}\n </header>\n );\n}\n"]}
@@ -0,0 +1,68 @@
1
+ import { filterDataAttributes } from './chunk-SRSJO5QE.js';
2
+ import { Skeleton } from './chunk-PZQVSDLH.js';
3
+ import { jsxs, jsx } from 'kerfjs/jsx-runtime';
4
+
5
+ var PROTECTED_ROOT_DATA_ATTRIBUTES = /* @__PURE__ */ new Set([
6
+ "data-component",
7
+ "data-action",
8
+ "data-item-id",
9
+ "data-has-icon",
10
+ "data-multiline",
11
+ "data-state"
12
+ ]);
13
+ function ListItem({
14
+ label,
15
+ icon,
16
+ trailing,
17
+ selected = false,
18
+ action,
19
+ itemId,
20
+ className = "",
21
+ style,
22
+ pressed,
23
+ accessibleLabel,
24
+ title,
25
+ multiline = false,
26
+ state,
27
+ disabled = false,
28
+ tabIndex,
29
+ placeholder = false,
30
+ rootAttributes = {}
31
+ }) {
32
+ const extensionAttributes = filterDataAttributes(
33
+ rootAttributes,
34
+ PROTECTED_ROOT_DATA_ATTRIBUTES
35
+ );
36
+ return /* @__PURE__ */ jsxs(
37
+ "button",
38
+ {
39
+ ...extensionAttributes,
40
+ type: "button",
41
+ class: `kui-list-item ${className}`.trim(),
42
+ style,
43
+ title: placeholder ? void 0 : title,
44
+ disabled: disabled || placeholder,
45
+ tabindex: placeholder ? -1 : tabIndex,
46
+ "data-component": "list-item",
47
+ "data-action": placeholder ? void 0 : action,
48
+ "data-item-id": itemId,
49
+ "data-has-icon": String(Boolean(icon)),
50
+ "data-multiline": multiline ? "true" : void 0,
51
+ "data-state": state,
52
+ "data-placeholder": placeholder ? "true" : void 0,
53
+ "aria-label": accessibleLabel,
54
+ "aria-current": selected ? "page" : void 0,
55
+ "aria-pressed": pressed === void 0 ? void 0 : String(pressed),
56
+ "aria-busy": placeholder ? "true" : void 0,
57
+ children: [
58
+ icon && /* @__PURE__ */ jsx("span", { class: "kui-list-item__icon", children: placeholder ? /* @__PURE__ */ jsx(Skeleton, { width: "1em", height: "1em" }) : icon }),
59
+ /* @__PURE__ */ jsx("span", { class: "kui-list-item__label", children: placeholder ? /* @__PURE__ */ jsx(Skeleton, { width: "9em" }) : label }),
60
+ trailing && /* @__PURE__ */ jsx("span", { class: "kui-list-item__trailing", children: placeholder ? /* @__PURE__ */ jsx(Skeleton, { width: "2.5em" }) : trailing })
61
+ ]
62
+ }
63
+ );
64
+ }
65
+
66
+ export { ListItem };
67
+
68
+ //# sourceMappingURL=chunk-ELSJX4W7.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/list-item.tsx"],"names":[],"mappings":";;;;AAKA,IAAM,8BAAA,uBAAqC,GAAA,CAAI;AAAA,EAC7C,gBAAA;AAAA,EACA,aAAA;AAAA,EACA,cAAA;AAAA,EACA,eAAA;AAAA,EACA,gBAAA;AAAA,EACA;AACF,CAAC,CAAA;AAkCM,SAAS,QAAA,CAAS;AAAA,EACvB,KAAA;AAAA,EACA,IAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA,GAAW,KAAA;AAAA,EACX,MAAA;AAAA,EACA,MAAA;AAAA,EACA,SAAA,GAAY,EAAA;AAAA,EACZ,KAAA;AAAA,EACA,OAAA;AAAA,EACA,eAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA,GAAY,KAAA;AAAA,EACZ,KAAA;AAAA,EACA,QAAA,GAAW,KAAA;AAAA,EACX,QAAA;AAAA,EACA,WAAA,GAAc,KAAA;AAAA,EACd,iBAAiB;AACnB,CAAA,EAAkB;AAChB,EAAA,MAAM,mBAAA,GAAsB,oBAAA;AAAA,IAC1B,cAAA;AAAA,IACA;AAAA,GACF;AACA,EAAA,uBACE,IAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACE,GAAG,mBAAA;AAAA,MACJ,IAAA,EAAK,QAAA;AAAA,MACL,KAAA,EAAO,CAAA,cAAA,EAAiB,SAAS,CAAA,CAAA,CAAG,IAAA,EAAK;AAAA,MACzC,KAAA;AAAA,MACA,KAAA,EAAO,cAAc,MAAA,GAAY,KAAA;AAAA,MACjC,UAAU,QAAA,IAAY,WAAA;AAAA,MACtB,QAAA,EAAU,cAAc,EAAA,GAAK,QAAA;AAAA,MAC7B,gBAAA,EAAe,WAAA;AAAA,MACf,aAAA,EAAa,cAAc,MAAA,GAAY,MAAA;AAAA,MACvC,cAAA,EAAc,MAAA;AAAA,MACd,eAAA,EAAe,MAAA,CAAO,OAAA,CAAQ,IAAI,CAAC,CAAA;AAAA,MACnC,gBAAA,EAAgB,YAAY,MAAA,GAAS,MAAA;AAAA,MACrC,YAAA,EAAY,KAAA;AAAA,MACZ,kBAAA,EAAkB,cAAc,MAAA,GAAS,MAAA;AAAA,MACzC,YAAA,EAAY,eAAA;AAAA,MACZ,cAAA,EAAc,WAAW,MAAA,GAAS,MAAA;AAAA,MAClC,cAAA,EAAc,OAAA,KAAY,MAAA,GAAY,MAAA,GAAY,OAAO,OAAO,CAAA;AAAA,MAChE,WAAA,EAAW,cAAc,MAAA,GAAS,MAAA;AAAA,MAEjC,QAAA,EAAA;AAAA,QAAA,IAAA,oBACC,GAAA,CAAC,MAAA,EAAA,EAAK,KAAA,EAAM,qBAAA,EACT,QAAA,EAAA,WAAA,mBAAc,GAAA,CAAC,QAAA,EAAA,EAAS,KAAA,EAAM,KAAA,EAAM,MAAA,EAAO,KAAA,EAAM,CAAA,GAAK,IAAA,EACzD,CAAA;AAAA,wBAEF,GAAA,CAAC,MAAA,EAAA,EAAK,KAAA,EAAM,sBAAA,EACT,QAAA,EAAA,WAAA,uBAAe,QAAA,EAAA,EAAS,KAAA,EAAM,KAAA,EAAM,CAAA,GAAK,KAAA,EAC5C,CAAA;AAAA,QACC,QAAA,oBACC,GAAA,CAAC,MAAA,EAAA,EAAK,KAAA,EAAM,yBAAA,EACT,QAAA,EAAA,WAAA,mBAAc,GAAA,CAAC,QAAA,EAAA,EAAS,KAAA,EAAM,OAAA,EAAQ,CAAA,GAAK,QAAA,EAC9C;AAAA;AAAA;AAAA,GAEJ;AAEJ","file":"chunk-ELSJX4W7.js","sourcesContent":["import type { SafeHtml } from 'kerfjs';\n\nimport { filterDataAttributes } from './extension-attributes.js';\nimport { Skeleton } from './skeleton.js';\n\nconst PROTECTED_ROOT_DATA_ATTRIBUTES = new Set([\n 'data-component',\n 'data-action',\n 'data-item-id',\n 'data-has-icon',\n 'data-multiline',\n 'data-state',\n]);\n\ntype ListItemRootAttributes = Readonly<\n Record<`data-${string}`, string | undefined> & {\n 'data-component'?: never;\n 'data-action'?: never;\n 'data-item-id'?: never;\n 'data-has-icon'?: never;\n 'data-multiline'?: never;\n 'data-state'?: never;\n }\n>;\n\nexport interface ListItemProps {\n label: string | SafeHtml;\n icon?: SafeHtml;\n trailing?: SafeHtml;\n selected?: boolean;\n action: string;\n itemId?: string;\n className?: string;\n style?: string;\n pressed?: boolean;\n accessibleLabel?: string;\n title?: string;\n multiline?: boolean;\n state?: string;\n disabled?: boolean;\n tabIndex?: number;\n /** Render the row as an unanimated loading skeleton, disabling its action. */\n placeholder?: boolean;\n rootAttributes?: ListItemRootAttributes;\n}\n\nexport function ListItem({\n label,\n icon,\n trailing,\n selected = false,\n action,\n itemId,\n className = '',\n style,\n pressed,\n accessibleLabel,\n title,\n multiline = false,\n state,\n disabled = false,\n tabIndex,\n placeholder = false,\n rootAttributes = {},\n}: ListItemProps) {\n const extensionAttributes = filterDataAttributes(\n rootAttributes,\n PROTECTED_ROOT_DATA_ATTRIBUTES,\n );\n return (\n <button\n {...extensionAttributes}\n type=\"button\"\n class={`kui-list-item ${className}`.trim()}\n style={style}\n title={placeholder ? undefined : title}\n disabled={disabled || placeholder}\n tabindex={placeholder ? -1 : tabIndex}\n data-component=\"list-item\"\n data-action={placeholder ? undefined : action}\n data-item-id={itemId}\n data-has-icon={String(Boolean(icon))}\n data-multiline={multiline ? 'true' : undefined}\n data-state={state}\n data-placeholder={placeholder ? 'true' : undefined}\n aria-label={accessibleLabel}\n aria-current={selected ? 'page' : undefined}\n aria-pressed={pressed === undefined ? undefined : String(pressed)}\n aria-busy={placeholder ? 'true' : undefined}\n >\n {icon && (\n <span class=\"kui-list-item__icon\">\n {placeholder ? <Skeleton width=\"1em\" height=\"1em\" /> : icon}\n </span>\n )}\n <span class=\"kui-list-item__label\">\n {placeholder ? <Skeleton width=\"9em\" /> : label}\n </span>\n {trailing && (\n <span class=\"kui-list-item__trailing\">\n {placeholder ? <Skeleton width=\"2.5em\" /> : trailing}\n </span>\n )}\n </button>\n );\n}\n"]}
@@ -1,11 +1,15 @@
1
1
  import { jsx } from 'kerfjs/jsx-runtime';
2
2
 
3
3
  // src/list-inset-text.tsx
4
- function ListInsetText({ children, horizontalOnly = false, className = "" }) {
4
+ function ListInsetText({
5
+ children,
6
+ horizontalOnly = false,
7
+ className = ""
8
+ }) {
5
9
  const cls = `kui-list-inset-text${horizontalOnly ? " kui-list-inset-text--horizontal" : ""} ${className}`.trim();
6
10
  return /* @__PURE__ */ jsx("div", { class: cls, "data-component": "list-inset-text", children });
7
11
  }
8
12
 
9
13
  export { ListInsetText };
10
14
 
11
- //# sourceMappingURL=chunk-AHQI52QO.js.map
15
+ //# sourceMappingURL=chunk-FEY65TBV.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/list-inset-text.tsx"],"names":[],"mappings":";;;AAuBO,SAAS,aAAA,CAAc;AAAA,EAC5B,QAAA;AAAA,EACA,cAAA,GAAiB,KAAA;AAAA,EACjB,SAAA,GAAY;AACd,CAAA,EAAuB;AACrB,EAAA,MAAM,GAAA,GACJ,sBAAsB,cAAA,GAAiB,kCAAA,GAAqC,EAAE,CAAA,CAAA,EAAI,SAAS,GAAG,IAAA,EAAK;AACrG,EAAA,2BACG,KAAA,EAAA,EAAI,KAAA,EAAO,GAAA,EAAK,gBAAA,EAAe,mBAC7B,QAAA,EACH,CAAA;AAEJ","file":"chunk-FEY65TBV.js","sourcesContent":["import type { SafeHtml } from 'kerfjs';\n\nexport interface ListInsetTextProps {\n /** Text (or inline content) that carries no margin, border, or padding of its own. */\n children: SafeHtml | SafeHtml[] | string;\n /**\n * Keep only the horizontal geometry (inline margin, left/right border, and\n * left/right padding) and drop the vertical margin, border, and padding. Use it\n * when the text edge must still align with bordered items but the line should not\n * add its own vertical box space — tight text layout inside a content region.\n */\n horizontalOnly?: boolean;\n className?: string;\n}\n\n/**\n * Gives bare text the content-item geometry — an 8px inline margin, a 1px\n * transparent border, and 8px padding — so a plain string lines up with\n * bordered `.kui-content` items (its text edge lands at the same 17px inset).\n * Use it for text elements that have no margin, border, or padding of their own.\n * Pass `horizontalOnly` to keep the horizontal inset but drop the vertical box\n * space for tight text layout.\n */\nexport function ListInsetText({\n children,\n horizontalOnly = false,\n className = '',\n}: ListInsetTextProps) {\n const cls =\n `kui-list-inset-text${horizontalOnly ? ' kui-list-inset-text--horizontal' : ''} ${className}`.trim();\n return (\n <div class={cls} data-component=\"list-inset-text\">\n {children}\n </div>\n );\n}\n"]}
@@ -0,0 +1,79 @@
1
+ import { filterDataAttributes } from './chunk-SRSJO5QE.js';
2
+ import { jsx, jsxs, Fragment } from 'kerfjs/jsx-runtime';
3
+
4
+ var paneProtectedAttributes = /* @__PURE__ */ new Set([
5
+ "data-component",
6
+ "data-separator-block-start",
7
+ "data-separator-block-end",
8
+ "data-separator-inline-start",
9
+ "data-separator-inline-end"
10
+ ]);
11
+ function paneContent(element, children, className, label) {
12
+ const attributes = {
13
+ class: `kui-pane__content kui-content ${className}`.trim(),
14
+ "aria-label": label
15
+ };
16
+ if (element === "main") return /* @__PURE__ */ jsx("main", { ...attributes, children });
17
+ if (element === "nav") return /* @__PURE__ */ jsx("nav", { ...attributes, children });
18
+ if (element === "section")
19
+ return /* @__PURE__ */ jsx("section", { ...attributes, children });
20
+ return /* @__PURE__ */ jsx("div", { ...attributes, children });
21
+ }
22
+ function Pane({
23
+ header,
24
+ children,
25
+ footer,
26
+ element = "div",
27
+ contentElement = "div",
28
+ separators = [],
29
+ id,
30
+ label,
31
+ contentLabel,
32
+ className = "",
33
+ headerClassName = "",
34
+ contentClassName = "",
35
+ footerClassName = "",
36
+ rootAttributes = {}
37
+ }) {
38
+ const safeRootAttributes = filterDataAttributes(
39
+ rootAttributes,
40
+ paneProtectedAttributes
41
+ );
42
+ const content = paneContent(
43
+ contentElement,
44
+ children,
45
+ contentClassName,
46
+ contentLabel
47
+ );
48
+ const body = /* @__PURE__ */ jsxs(Fragment, { children: [
49
+ header === void 0 ? /* @__PURE__ */ jsx(Fragment, {}) : /* @__PURE__ */ jsx(
50
+ "header",
51
+ {
52
+ class: `kui-pane__header kui-pane__toolbar ${headerClassName}`.trim(),
53
+ children: header
54
+ }
55
+ ),
56
+ content,
57
+ footer === void 0 ? /* @__PURE__ */ jsx(Fragment, {}) : /* @__PURE__ */ jsx("footer", { class: `kui-pane__footer ${footerClassName}`.trim(), children: footer })
58
+ ] });
59
+ const attributes = {
60
+ ...safeRootAttributes,
61
+ class: `kui-pane ${className}`.trim(),
62
+ id,
63
+ "data-component": "pane",
64
+ "data-separator-block-start": String(separators.includes("block-start")),
65
+ "data-separator-block-end": String(separators.includes("block-end")),
66
+ "data-separator-inline-start": String(separators.includes("inline-start")),
67
+ "data-separator-inline-end": String(separators.includes("inline-end")),
68
+ "aria-label": label
69
+ };
70
+ if (element === "article") return /* @__PURE__ */ jsx("article", { ...attributes, children: body });
71
+ if (element === "aside") return /* @__PURE__ */ jsx("aside", { ...attributes, children: body });
72
+ if (element === "main") return /* @__PURE__ */ jsx("main", { ...attributes, children: body });
73
+ if (element === "section") return /* @__PURE__ */ jsx("section", { ...attributes, children: body });
74
+ return /* @__PURE__ */ jsx("div", { ...attributes, children: body });
75
+ }
76
+
77
+ export { Pane };
78
+
79
+ //# sourceMappingURL=chunk-JRKSK2HX.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/pane.tsx"],"names":[],"mappings":"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","file":"chunk-JRKSK2HX.js","sourcesContent":["import type { SafeHtml } from 'kerfjs';\n\nimport { filterDataAttributes } from './extension-attributes.js';\n\n/** Logical sides that can show a {@link Pane} separator. */\nexport type PaneSeparatorSide =\n 'block-start' | 'block-end' | 'inline-start' | 'inline-end';\n\n/** Semantic root elements supported by {@link Pane}. */\nexport type PaneElement = 'article' | 'aside' | 'div' | 'main' | 'section';\n\n/** Semantic elements supported by the scrolling content slot. */\nexport type PaneContentElement = 'div' | 'main' | 'nav' | 'section';\n\nconst paneProtectedAttributes = new Set([\n 'data-component',\n 'data-separator-block-start',\n 'data-separator-block-end',\n 'data-separator-inline-start',\n 'data-separator-inline-end',\n]);\n\ntype PaneRootAttributes = Readonly<\n Record<`data-${string}`, string | undefined> & {\n 'data-component'?: never;\n 'data-separator-block-start'?: never;\n 'data-separator-block-end'?: never;\n 'data-separator-inline-start'?: never;\n 'data-separator-inline-end'?: never;\n }\n>;\n\nexport interface PaneProps {\n /** Optional fixed chrome above the scrolling content, arranged vertically. */\n header?: SafeHtml | readonly SafeHtml[];\n /** The pane's primary vertical, scrolling content stack. */\n children?: SafeHtml | readonly SafeHtml[];\n /** Optional fixed chrome below the scrolling content. */\n footer?: SafeHtml | readonly SafeHtml[];\n /** Root semantics. Defaults to `div`. */\n element?: PaneElement;\n /** Scrolling content semantics. Defaults to `div`. */\n contentElement?: PaneContentElement;\n /** Independent logical-edge separator lines. Defaults to none. */\n separators?: readonly PaneSeparatorSide[];\n id?: string;\n /** Accessible name for a landmark root such as `aside` or `main`. */\n label?: string;\n /** Accessible name for a landmark scrolling slot such as `nav`. */\n contentLabel?: string;\n className?: string;\n headerClassName?: string;\n contentClassName?: string;\n footerClassName?: string;\n /** Safe `data-*` metadata; Pane-owned structural attributes remain protected. */\n rootAttributes?: PaneRootAttributes;\n}\n\nfunction paneContent(\n element: PaneContentElement,\n children: SafeHtml | readonly SafeHtml[] | undefined,\n className: string,\n label: string | undefined,\n) {\n const attributes = {\n class: `kui-pane__content kui-content ${className}`.trim(),\n 'aria-label': label,\n };\n if (element === 'main') return <main {...attributes}>{children}</main>;\n if (element === 'nav') return <nav {...attributes}>{children}</nav>;\n if (element === 'section')\n return <section {...attributes}>{children}</section>;\n return <div {...attributes}>{children}</div>;\n}\n\n/**\n * An unpadded application column with optional fixed header/footer slots and one\n * scrolling vertical content owner. Separator lines are independently opt-in on\n * each logical edge, so the same component works as a sidebar, main area,\n * inspector, or dialog column.\n */\nexport function Pane({\n header,\n children,\n footer,\n element = 'div',\n contentElement = 'div',\n separators = [],\n id,\n label,\n contentLabel,\n className = '',\n headerClassName = '',\n contentClassName = '',\n footerClassName = '',\n rootAttributes = {},\n}: PaneProps) {\n const safeRootAttributes = filterDataAttributes(\n rootAttributes,\n paneProtectedAttributes,\n );\n const content = paneContent(\n contentElement,\n children,\n contentClassName,\n contentLabel,\n );\n const body = (\n <>\n {header === undefined ? (\n <></>\n ) : (\n <header\n class={`kui-pane__header kui-pane__toolbar ${headerClassName}`.trim()}\n >\n {header}\n </header>\n )}\n {content}\n {footer === undefined ? (\n <></>\n ) : (\n <footer class={`kui-pane__footer ${footerClassName}`.trim()}>\n {footer}\n </footer>\n )}\n </>\n );\n const attributes = {\n ...safeRootAttributes,\n class: `kui-pane ${className}`.trim(),\n id,\n 'data-component': 'pane',\n 'data-separator-block-start': String(separators.includes('block-start')),\n 'data-separator-block-end': String(separators.includes('block-end')),\n 'data-separator-inline-start': String(separators.includes('inline-start')),\n 'data-separator-inline-end': String(separators.includes('inline-end')),\n 'aria-label': label,\n };\n\n if (element === 'article') return <article {...attributes}>{body}</article>;\n if (element === 'aside') return <aside {...attributes}>{body}</aside>;\n if (element === 'main') return <main {...attributes}>{body}</main>;\n if (element === 'section') return <section {...attributes}>{body}</section>;\n return <div {...attributes}>{body}</div>;\n}\n"]}
@@ -0,0 +1,117 @@
1
+ import { Skeleton } from './chunk-PZQVSDLH.js';
2
+ import { LucideIcon } from './chunk-W2FK7ZNY.js';
3
+ import { ChevronDown } from 'lucide';
4
+ import { jsxs, jsx, Fragment } from 'kerfjs/jsx-runtime';
5
+
6
+ function Select({
7
+ name,
8
+ value,
9
+ label,
10
+ ariaLabel,
11
+ choices,
12
+ className = "",
13
+ placeholderText,
14
+ disabled = false,
15
+ fitMenu = false,
16
+ renderSelected,
17
+ placeholder = false
18
+ }) {
19
+ if (placeholder) {
20
+ return /* @__PURE__ */ jsxs(
21
+ "div",
22
+ {
23
+ class: `kui-select kui-select--placeholder ${className}`.trim(),
24
+ "data-component": "select",
25
+ "data-placeholder": "true",
26
+ "aria-busy": "true",
27
+ children: [
28
+ label && /* @__PURE__ */ jsx("span", { class: "kui-select__placeholder-label", children: label }),
29
+ /* @__PURE__ */ jsxs(
30
+ "span",
31
+ {
32
+ class: "kui-select__placeholder-box",
33
+ "aria-label": ariaLabel,
34
+ role: "img",
35
+ children: [
36
+ /* @__PURE__ */ jsx(Skeleton, { width: "10em" }),
37
+ /* @__PURE__ */ jsx("span", { class: "kui-select__placeholder-chevron", "aria-hidden": "true", children: /* @__PURE__ */ jsx(LucideIcon, { icon: ChevronDown, name: "chevron-down" }) })
38
+ ]
39
+ }
40
+ )
41
+ ]
42
+ }
43
+ );
44
+ }
45
+ const selected = choices.find((choice) => choice.value === value);
46
+ const icon = (choice, selectedIcon = false) => /* @__PURE__ */ jsx(
47
+ "span",
48
+ {
49
+ "data-key": `${name}:${choice.value}:${selectedIcon ? "selected" : "option"}`,
50
+ "data-morph-skip": true,
51
+ slot: "start",
52
+ class: `kui-select__icon${selectedIcon ? " kui-select__icon--selected" : ""}`,
53
+ style: choice.color ? `color:${choice.color}` : void 0,
54
+ children: choice.icon ? /* @__PURE__ */ jsx(
55
+ LucideIcon,
56
+ {
57
+ icon: choice.icon,
58
+ name: choice.iconName ?? choice.label.toLowerCase().replaceAll(" ", "-")
59
+ }
60
+ ) : null
61
+ }
62
+ );
63
+ const option = (choice) => /* @__PURE__ */ jsxs(Fragment, { children: [
64
+ choice.separatorBefore && /* @__PURE__ */ jsx("wa-divider", {}),
65
+ /* @__PURE__ */ jsxs("wa-option", { value: choice.value, children: [
66
+ choice.icon ? icon(choice) : null,
67
+ choice.label
68
+ ] })
69
+ ] });
70
+ const groups = [
71
+ ...new Set(
72
+ choices.map((choice) => choice.group).filter((group) => Boolean(group))
73
+ )
74
+ ];
75
+ const ungrouped = choices.filter((choice) => !choice.group);
76
+ return /* @__PURE__ */ jsxs(
77
+ "wa-select",
78
+ {
79
+ class: `kui-select${renderSelected ? " kui-select--custom-selected" : ""}${fitMenu ? " kui-select--fit-menu" : ""} ${className}`.trim(),
80
+ "data-component": "select",
81
+ name,
82
+ label,
83
+ "aria-label": ariaLabel,
84
+ value,
85
+ placeholder: placeholderText,
86
+ disabled,
87
+ children: [
88
+ selected && (renderSelected ? /* @__PURE__ */ jsx(
89
+ "span",
90
+ {
91
+ "data-key": `${name}:${value}:custom-selected`,
92
+ slot: "start",
93
+ class: "kui-select__custom-selected",
94
+ children: renderSelected(selected)
95
+ }
96
+ ) : selected.icon ? icon(selected, true) : null),
97
+ ungrouped.map(option),
98
+ groups.map((group, index) => /* @__PURE__ */ jsxs(
99
+ "div",
100
+ {
101
+ class: `kui-select__group${index > 0 || ungrouped.length > 0 ? " kui-select__group--separated" : ""}`,
102
+ role: "group",
103
+ "aria-label": group,
104
+ children: [
105
+ /* @__PURE__ */ jsx("span", { class: "kui-select__group-title", children: group }),
106
+ choices.filter((choice) => choice.group === group).map(option)
107
+ ]
108
+ }
109
+ ))
110
+ ]
111
+ }
112
+ );
113
+ }
114
+
115
+ export { Select };
116
+
117
+ //# sourceMappingURL=chunk-K57KRAOV.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/select.tsx"],"names":[],"mappings":"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","file":"chunk-K57KRAOV.js","sourcesContent":["import type { SafeHtml } from 'kerfjs';\nimport { ChevronDown } from 'lucide';\n\nimport { LucideIcon, type LucideNode } from './lucide-icon.js';\nimport { Skeleton } from './skeleton.js';\n\nexport interface SelectChoice<Value extends string = string> {\n value: Value;\n label: string;\n icon?: LucideNode;\n iconName?: string;\n color?: string;\n group?: string;\n separatorBefore?: boolean;\n}\n\ntype SelectAccessibleName =\n { label: string; ariaLabel?: string } | { label?: never; ariaLabel: string };\n\ninterface SelectBaseProps<Value extends string = string> {\n name: string;\n value: NoInfer<Value>;\n choices: readonly SelectChoice<Value>[];\n className?: string;\n /** Empty-value hint text shown in the closed control (the native select placeholder). */\n placeholderText?: string;\n disabled?: boolean;\n fitMenu?: boolean;\n renderSelected?: (choice: SelectChoice<Value>) => SafeHtml;\n /** Render as an unanimated loading skeleton: the label above a static, empty control box. */\n placeholder?: boolean;\n}\n\nexport type SelectProps<Value extends string = string> =\n SelectBaseProps<Value> & SelectAccessibleName;\n\nexport function Select<Value extends string>({\n name,\n value,\n label,\n ariaLabel,\n choices,\n className = '',\n placeholderText,\n disabled = false,\n fitMenu = false,\n renderSelected,\n placeholder = false,\n}: SelectProps<Value>) {\n if (placeholder) {\n return (\n <div\n class={`kui-select kui-select--placeholder ${className}`.trim()}\n data-component=\"select\"\n data-placeholder=\"true\"\n aria-busy=\"true\"\n >\n {label && <span class=\"kui-select__placeholder-label\">{label}</span>}\n <span\n class=\"kui-select__placeholder-box\"\n aria-label={ariaLabel}\n role=\"img\"\n >\n <Skeleton width=\"10em\" />\n <span class=\"kui-select__placeholder-chevron\" aria-hidden=\"true\">\n <LucideIcon icon={ChevronDown} name=\"chevron-down\" />\n </span>\n </span>\n </div>\n );\n }\n const selected = choices.find((choice) => choice.value === value);\n const icon = (choice: SelectChoice<Value>, selectedIcon = false) => (\n <span\n data-key={`${name}:${choice.value}:${selectedIcon ? 'selected' : 'option'}`}\n data-morph-skip\n slot=\"start\"\n class={`kui-select__icon${selectedIcon ? ' kui-select__icon--selected' : ''}`}\n style={choice.color ? `color:${choice.color}` : undefined}\n >\n {choice.icon ? (\n <LucideIcon\n icon={choice.icon}\n name={\n choice.iconName ?? choice.label.toLowerCase().replaceAll(' ', '-')\n }\n />\n ) : null}\n </span>\n );\n const option = (choice: SelectChoice<Value>) => (\n <>\n {choice.separatorBefore && <wa-divider></wa-divider>}\n <wa-option value={choice.value}>\n {choice.icon ? icon(choice) : null}\n {choice.label}\n </wa-option>\n </>\n );\n const groups = [\n ...new Set(\n choices\n .map((choice) => choice.group)\n .filter((group): group is string => Boolean(group)),\n ),\n ];\n const ungrouped = choices.filter((choice) => !choice.group);\n return (\n <wa-select\n class={`kui-select${renderSelected ? ' kui-select--custom-selected' : ''}${fitMenu ? ' kui-select--fit-menu' : ''} ${className}`.trim()}\n data-component=\"select\"\n name={name}\n label={label}\n aria-label={ariaLabel}\n value={value}\n placeholder={placeholderText}\n disabled={disabled}\n >\n {selected &&\n (renderSelected ? (\n <span\n data-key={`${name}:${value}:custom-selected`}\n slot=\"start\"\n class=\"kui-select__custom-selected\"\n >\n {renderSelected(selected)}\n </span>\n ) : selected.icon ? (\n icon(selected, true)\n ) : null)}\n {ungrouped.map(option)}\n {groups.map((group, index) => (\n <div\n class={`kui-select__group${index > 0 || ungrouped.length > 0 ? ' kui-select__group--separated' : ''}`}\n role=\"group\"\n aria-label={group}\n >\n <span class=\"kui-select__group-title\">{group}</span>\n {choices.filter((choice) => choice.group === group).map(option)}\n </div>\n ))}\n </wa-select>\n );\n}\n"]}
@@ -0,0 +1,25 @@
1
+ import { jsx } from 'kerfjs/jsx-runtime';
2
+
3
+ // src/floating-toolbar.tsx
4
+ function FloatingToolbar({
5
+ children,
6
+ label,
7
+ position = "bottom-end",
8
+ className = ""
9
+ }) {
10
+ return /* @__PURE__ */ jsx(
11
+ "div",
12
+ {
13
+ class: `kui-floating-toolbar ${className}`.trim(),
14
+ "data-component": "floating-toolbar",
15
+ "data-position": position,
16
+ role: "toolbar",
17
+ "aria-label": label,
18
+ children
19
+ }
20
+ );
21
+ }
22
+
23
+ export { FloatingToolbar };
24
+
25
+ //# sourceMappingURL=chunk-LPOMRC4C.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/floating-toolbar.tsx"],"names":[],"mappings":";;;AA4BO,SAAS,eAAA,CAAgB;AAAA,EAC9B,QAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA,GAAW,YAAA;AAAA,EACX,SAAA,GAAY;AACd,CAAA,EAAyB;AACvB,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAO,CAAA,qBAAA,EAAwB,SAAS,CAAA,CAAA,CAAG,IAAA,EAAK;AAAA,MAChD,gBAAA,EAAe,kBAAA;AAAA,MACf,eAAA,EAAe,QAAA;AAAA,MACf,IAAA,EAAK,SAAA;AAAA,MACL,YAAA,EAAY,KAAA;AAAA,MAEX;AAAA;AAAA,GACH;AAEJ","file":"chunk-LPOMRC4C.js","sourcesContent":["import type { SafeHtml } from 'kerfjs';\n\n/** Where a {@link FloatingToolbar} floats within its positioned container. */\nexport type FloatingToolbarPosition =\n 'bottom' | 'bottom-start' | 'bottom-end' | 'top' | 'top-start' | 'top-end';\n\nexport interface FloatingToolbarProps {\n /** Toolbar contents — normally one or more `ToolbarControlGroup`s. */\n children: SafeHtml | SafeHtml[];\n /** Accessible name for the toolbar (required — it exposes `role=\"toolbar\"`). */\n label: string;\n /**\n * Corner or edge it floats to inside its nearest positioned ancestor.\n * Default: `'bottom-end'`.\n */\n position?: FloatingToolbarPosition;\n className?: string;\n}\n\n/**\n * A toolbar that floats above the main content of its nearest positioned\n * ancestor — a transparent, forced-dark cluster of controls (e.g. a drawer\n * restore button) that sits over the content but NOT over dialogs or overlays\n * (it is not in the top layer). It is inset from the container edges by\n * `--kui-floating-toolbar-inset` (default `--kui-space-m`, i.e. 8px more than a\n * top toolbar's own inset); override that token to move it. The app owns the\n * controls and their behavior — wire them with `delegate()` as usual.\n */\nexport function FloatingToolbar({\n children,\n label,\n position = 'bottom-end',\n className = '',\n}: FloatingToolbarProps) {\n return (\n <div\n class={`kui-floating-toolbar ${className}`.trim()}\n data-component=\"floating-toolbar\"\n data-position={position}\n role=\"toolbar\"\n aria-label={label}\n >\n {children}\n </div>\n );\n}\n"]}
@@ -0,0 +1,41 @@
1
+ import { jsxs, jsx } from 'kerfjs/jsx-runtime';
2
+
3
+ // src/tab-bar.tsx
4
+ function TabBar({
5
+ id,
6
+ label,
7
+ children,
8
+ leading,
9
+ trailing,
10
+ className = "",
11
+ activation
12
+ }) {
13
+ return /* @__PURE__ */ jsxs(
14
+ "nav",
15
+ {
16
+ class: `kui-tab-bar ${className}`.trim(),
17
+ "data-component": "tab-bar",
18
+ "data-tab-bar-id": id,
19
+ "data-tab-activation": activation,
20
+ "aria-label": label,
21
+ children: [
22
+ leading && /* @__PURE__ */ jsx("div", { class: "kui-tab-bar__leading", children: leading }),
23
+ /* @__PURE__ */ jsx(
24
+ "div",
25
+ {
26
+ class: "kui-tab-bar__tabs",
27
+ role: "tablist",
28
+ "aria-label": label,
29
+ "data-kui-tab-list": true,
30
+ children
31
+ }
32
+ ),
33
+ trailing && /* @__PURE__ */ jsx("div", { class: "kui-tab-bar__trailing", children: trailing })
34
+ ]
35
+ }
36
+ );
37
+ }
38
+
39
+ export { TabBar };
40
+
41
+ //# sourceMappingURL=chunk-M7JBER5U.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/tab-bar.tsx"],"names":[],"mappings":";;;AAqBO,SAAS,MAAA,CAAO;AAAA,EACrB,EAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,OAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA,GAAY,EAAA;AAAA,EACZ;AACF,CAAA,EAAgB;AACd,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAO,CAAA,YAAA,EAAe,SAAS,CAAA,CAAA,CAAG,IAAA,EAAK;AAAA,MACvC,gBAAA,EAAe,SAAA;AAAA,MACf,iBAAA,EAAiB,EAAA;AAAA,MACjB,qBAAA,EAAqB,UAAA;AAAA,MACrB,YAAA,EAAY,KAAA;AAAA,MAEX,QAAA,EAAA;AAAA,QAAA,OAAA,oBAAW,GAAA,CAAC,KAAA,EAAA,EAAI,KAAA,EAAM,sBAAA,EAAwB,QAAA,EAAA,OAAA,EAAQ,CAAA;AAAA,wBACvD,GAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,KAAA,EAAM,mBAAA;AAAA,YACN,IAAA,EAAK,SAAA;AAAA,YACL,YAAA,EAAY,KAAA;AAAA,YACZ,mBAAA,EAAiB,IAAA;AAAA,YAEhB;AAAA;AAAA,SACH;AAAA,QACC,QAAA,oBAAY,GAAA,CAAC,KAAA,EAAA,EAAI,KAAA,EAAM,yBAAyB,QAAA,EAAA,QAAA,EAAS;AAAA;AAAA;AAAA,GAC5D;AAEJ","file":"chunk-M7JBER5U.js","sourcesContent":["import type { SafeHtml } from 'kerfjs';\n\nexport type TabActivation = 'automatic' | 'manual';\n\nexport interface TabBarProps {\n id: string;\n label: string;\n children: SafeHtml | readonly SafeHtml[];\n leading?: SafeHtml;\n trailing?: SafeHtml;\n className?: string;\n /**\n * Keyboard activation mode for this strip, emitted as `data-tab-activation` for\n * `wireTabBars` to read (overrides its `activation` option). `'automatic'` (default)\n * selects on arrow / Home / End; `'manual'` moves roving focus only and the user\n * selects with Enter / Space / click — use it when selecting a tab is a heavy action.\n */\n activation?: TabActivation;\n}\n\n/** Render a controlled tab strip. The application owns selection, order, and persistence. */\nexport function TabBar({\n id,\n label,\n children,\n leading,\n trailing,\n className = '',\n activation,\n}: TabBarProps) {\n return (\n <nav\n class={`kui-tab-bar ${className}`.trim()}\n data-component=\"tab-bar\"\n data-tab-bar-id={id}\n data-tab-activation={activation}\n aria-label={label}\n >\n {leading && <div class=\"kui-tab-bar__leading\">{leading}</div>}\n <div\n class=\"kui-tab-bar__tabs\"\n role=\"tablist\"\n aria-label={label}\n data-kui-tab-list\n >\n {children}\n </div>\n {trailing && <div class=\"kui-tab-bar__trailing\">{trailing}</div>}\n </nav>\n );\n}\n"]}
@@ -0,0 +1,79 @@
1
+ import { jsxs, jsx, Fragment } from 'kerfjs/jsx-runtime';
2
+
3
+ // src/resizable-region.tsx
4
+ var clampRegionSize = (size, min, max) => Math.min(max, Math.max(min, Math.round(size)));
5
+ var resizeRegionFromPointer = (startSize, delta, edge) => startSize + delta * (edge === "start" ? -1 : 1);
6
+ function ResizeGrip({ axis }) {
7
+ return /* @__PURE__ */ jsx(
8
+ "svg",
9
+ {
10
+ "aria-hidden": "true",
11
+ viewBox: "0 0 24 24",
12
+ fill: "none",
13
+ stroke: "currentColor",
14
+ "stroke-width": "2",
15
+ "stroke-linecap": "round",
16
+ children: axis === "horizontal" ? /* @__PURE__ */ jsxs(Fragment, { children: [
17
+ /* @__PURE__ */ jsx("path", { d: "M9 6v12" }),
18
+ /* @__PURE__ */ jsx("path", { d: "M15 6v12" })
19
+ ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
20
+ /* @__PURE__ */ jsx("path", { d: "M6 9h12" }),
21
+ /* @__PURE__ */ jsx("path", { d: "M6 15h12" })
22
+ ] })
23
+ }
24
+ );
25
+ }
26
+ function ResizableRegion({
27
+ id,
28
+ label,
29
+ size,
30
+ min,
31
+ max,
32
+ axis = "horizontal",
33
+ edge = "end",
34
+ collapsed = false,
35
+ transitioning = false,
36
+ handleIcon,
37
+ children
38
+ }) {
39
+ const expandedSize = clampRegionSize(size, min, max);
40
+ const resolved = collapsed ? 0 : expandedSize;
41
+ const orientation = axis === "horizontal" ? "vertical" : "horizontal";
42
+ return /* @__PURE__ */ jsxs(
43
+ "section",
44
+ {
45
+ class: "kui-resizable-region",
46
+ "data-component": "resizable-region",
47
+ "data-region-id": id,
48
+ "data-axis": axis,
49
+ "data-edge": edge,
50
+ "data-collapsed": String(collapsed),
51
+ "data-transitioning": String(transitioning),
52
+ style: `--kui-resizable-region-size:${resolved}px;--kui-resizable-region-expanded-size:${expandedSize}px`,
53
+ "aria-label": label,
54
+ children: [
55
+ /* @__PURE__ */ jsx("div", { class: "kui-resizable-region__content", children }),
56
+ /* @__PURE__ */ jsx(
57
+ "div",
58
+ {
59
+ class: "kui-resizable-region__handle",
60
+ role: "separator",
61
+ tabindex: "0",
62
+ "aria-label": `Resize ${label}`,
63
+ "aria-orientation": orientation,
64
+ "aria-valuemin": collapsed ? 0 : min,
65
+ "aria-valuemax": max,
66
+ "aria-valuenow": resolved,
67
+ "data-kui-resize-handle": true,
68
+ "data-region-id": id,
69
+ children: /* @__PURE__ */ jsx("span", { class: "kui-resizable-region__handle-icon", "aria-hidden": "true", children: handleIcon ?? /* @__PURE__ */ jsx(ResizeGrip, { axis }) })
70
+ }
71
+ )
72
+ ]
73
+ }
74
+ );
75
+ }
76
+
77
+ export { ResizableRegion, clampRegionSize, resizeRegionFromPointer };
78
+
79
+ //# sourceMappingURL=chunk-NENBUYX5.js.map