@kerfjs/ui 5.0.0-beta.50 → 5.0.0-beta.51

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 (205) hide show
  1. package/README.md +29 -5
  2. package/ai/compile-time-contracts-v1.json +5 -2
  3. package/ai/component-catalog-v2.d.ts +19 -1
  4. package/ai/component-catalog-v2.json +842 -127
  5. package/ai/component-catalog-v2.schema.json +33 -1
  6. package/ai/component-catalog.json +603 -126
  7. package/ai/component-catalog.schema.json +21 -1
  8. package/ai/public-api-signatures-v1.md +201 -29
  9. package/ai/skill.md +12 -9
  10. package/ai/webawesome-jsx-signatures-v1.md +1 -1
  11. package/analyzer/index.mjs +105 -35
  12. package/dist/app-tab.js +1 -1
  13. package/dist/catalog-resources.d.ts +1 -1
  14. package/dist/catalog.d.ts +28 -5
  15. package/dist/catalog.js +66 -25
  16. package/dist/catalog.js.map +1 -1
  17. package/dist/{chunk-COUPLRZG.js → chunk-5FZZMIMD.js} +3 -3
  18. package/dist/{chunk-COUPLRZG.js.map → chunk-5FZZMIMD.js.map} +1 -1
  19. package/dist/{chunk-DARTMI5Z.js → chunk-5PMGQDG7.js} +2 -2
  20. package/dist/{chunk-DARTMI5Z.js.map → chunk-5PMGQDG7.js.map} +1 -1
  21. package/dist/{chunk-V6RZWDII.js → chunk-7GUQYHKA.js} +19 -2
  22. package/dist/chunk-7GUQYHKA.js.map +1 -0
  23. package/dist/{chunk-ZNZ2JDBW.js → chunk-7IUSV4XG.js} +1 -1
  24. package/dist/chunk-7IUSV4XG.js.map +1 -0
  25. package/dist/{chunk-ELRMBQEC.js → chunk-AEPXGCNF.js} +17 -2
  26. package/dist/chunk-AEPXGCNF.js.map +1 -0
  27. package/dist/{chunk-5CE64WGC.js → chunk-D547PH4L.js} +3 -3
  28. package/dist/{chunk-5CE64WGC.js.map → chunk-D547PH4L.js.map} +1 -1
  29. package/dist/{chunk-S6ZTTTV7.js → chunk-DVZCMMB3.js} +3 -3
  30. package/dist/{chunk-S6ZTTTV7.js.map → chunk-DVZCMMB3.js.map} +1 -1
  31. package/dist/chunk-EKYZCRCX.js +256 -0
  32. package/dist/chunk-EKYZCRCX.js.map +1 -0
  33. package/dist/{chunk-3V75EQIP.js → chunk-JM53SMVF.js} +3 -3
  34. package/dist/{chunk-3V75EQIP.js.map → chunk-JM53SMVF.js.map} +1 -1
  35. package/dist/{chunk-2WMSE4MK.js → chunk-JMGKM7RK.js} +2 -2
  36. package/dist/{chunk-2WMSE4MK.js.map → chunk-JMGKM7RK.js.map} +1 -1
  37. package/dist/{chunk-2YOUUEWR.js → chunk-KX7DP2GO.js} +4 -4
  38. package/dist/{chunk-2YOUUEWR.js.map → chunk-KX7DP2GO.js.map} +1 -1
  39. package/dist/{chunk-OL4TC3U2.js → chunk-MO56ZZLG.js} +6 -2
  40. package/dist/chunk-MO56ZZLG.js.map +1 -0
  41. package/dist/{chunk-OQI7RCRP.js → chunk-MTM43SJO.js} +7 -1
  42. package/dist/chunk-MTM43SJO.js.map +1 -0
  43. package/dist/{chunk-ZSYLBVWG.js → chunk-NMGTHYW3.js} +3 -3
  44. package/dist/{chunk-ZSYLBVWG.js.map → chunk-NMGTHYW3.js.map} +1 -1
  45. package/dist/{chunk-AQSKJ6U6.js → chunk-NZXWU4R5.js} +21 -2
  46. package/dist/chunk-NZXWU4R5.js.map +1 -0
  47. package/dist/{chunk-DJKWFYAA.js → chunk-O3RCCSQJ.js} +3 -3
  48. package/dist/{chunk-DJKWFYAA.js.map → chunk-O3RCCSQJ.js.map} +1 -1
  49. package/dist/{chunk-UMGY5JSP.js → chunk-S4QRSBFI.js} +22 -2
  50. package/dist/chunk-S4QRSBFI.js.map +1 -0
  51. package/dist/{chunk-KKNK3JUT.js → chunk-UBH743HV.js} +5 -5
  52. package/dist/chunk-UBH743HV.js.map +1 -0
  53. package/dist/{chunk-54HM36IQ.js → chunk-ULCDZTWL.js} +2 -2
  54. package/dist/{chunk-54HM36IQ.js.map → chunk-ULCDZTWL.js.map} +1 -1
  55. package/dist/{chunk-SIU2AC5W.js → chunk-UPZ6EEJN.js} +3 -3
  56. package/dist/{chunk-SIU2AC5W.js.map → chunk-UPZ6EEJN.js.map} +1 -1
  57. package/dist/collapsible-panel.d.ts +1 -1
  58. package/dist/collapsible-panel.js.map +1 -1
  59. package/dist/css-values.d.ts +39 -3
  60. package/dist/css-values.js +1 -1
  61. package/dist/grid.d.ts +15 -1
  62. package/dist/grid.js +2 -1
  63. package/dist/index.d.ts +1 -1
  64. package/dist/index.js +19 -19
  65. package/dist/list-action-row.js +1 -1
  66. package/dist/list-header.js +1 -1
  67. package/dist/list-item.js +1 -1
  68. package/dist/list.d.ts +21 -2
  69. package/dist/list.js +2 -1
  70. package/dist/nav-stack.js +1 -1
  71. package/dist/pane.d.ts +17 -2
  72. package/dist/pane.js +1 -1
  73. package/dist/row.d.ts +19 -1
  74. package/dist/row.js +2 -1
  75. package/dist/segmented-control.js +1 -1
  76. package/dist/select.d.ts +13 -3
  77. package/dist/select.js +1 -1
  78. package/dist/skeleton.js +1 -1
  79. package/dist/spacer.js +1 -1
  80. package/dist/split-view.js +1 -1
  81. package/dist/state-banner.js +1 -1
  82. package/dist/styles/catalog/components/catalog-example-stack.css +4 -1
  83. package/dist/styles/catalog/components/catalog-example.css +145 -0
  84. package/dist/styles/collapsible-panel.css +132 -4
  85. package/dist/styles/document.css +23 -0
  86. package/dist/styles/foundation.css +21 -7
  87. package/dist/styles/grid.css +10 -0
  88. package/dist/styles/list-header.css +45 -0
  89. package/dist/styles/list-inset-control.css +8 -1
  90. package/dist/styles/list-item.css +6 -0
  91. package/dist/styles/list.css +11 -0
  92. package/dist/styles/nav-stack.css +89 -2
  93. package/dist/styles/pane.css +86 -1
  94. package/dist/styles/resizable-region.css +93 -5
  95. package/dist/styles/row.css +10 -0
  96. package/dist/styles/select.css +39 -4
  97. package/dist/styles/split-view.css +107 -1
  98. package/dist/styles/tab-scaffold.css +64 -1
  99. package/dist/styles/text.css +6 -0
  100. package/dist/styles/toolbar-control-group.css +90 -11
  101. package/dist/styles/toolbar-text.css +4 -1
  102. package/dist/styles/toolbar.css +130 -38
  103. package/dist/styles/webawesome.css +48 -2
  104. package/dist/styles/workbench.css +136 -4
  105. package/dist/text.d.ts +4 -3
  106. package/dist/text.js +1 -1
  107. package/dist/toolbar-text.js +1 -1
  108. package/dist/toolbar.d.ts +24 -3
  109. package/dist/toolbar.js +1 -1
  110. package/dist/{types-CzgSrFXP.d.ts → types-CEsieBZi.d.ts} +6 -1
  111. package/dist/value-table.js +1 -1
  112. package/dist/wire-resizable-regions.js +1 -1
  113. package/dist/wire-sidebar.d.ts +18 -3
  114. package/dist/wire-sidebar.js +95 -14
  115. package/dist/wire-sidebar.js.map +1 -1
  116. package/docs/accessibility.md +45 -8
  117. package/docs/app-layouts.md +73 -0
  118. package/docs/catalog.md +23 -2
  119. package/docs/collapsible-panel.md +81 -8
  120. package/docs/component-contract.md +28 -9
  121. package/docs/component-integration.md +9 -4
  122. package/docs/component-selection.md +25 -6
  123. package/docs/design/templates/list/stack-dark.svg +1 -1
  124. package/docs/design/templates/list/stack.svg +1 -1
  125. package/docs/design/templates/list-dark.svg +1 -1
  126. package/docs/design/templates/list-header/action-dark.svg +1 -1
  127. package/docs/design/templates/list-header/action.svg +1 -1
  128. package/docs/design/templates/list-header/count-dark.svg +1 -1
  129. package/docs/design/templates/list-header/count.svg +1 -1
  130. package/docs/design/templates/list-header/inline-action-dark.svg +1 -1
  131. package/docs/design/templates/list-header/inline-action.svg +1 -1
  132. package/docs/design/templates/list-header/toggle-expanded-dark.svg +1 -1
  133. package/docs/design/templates/list-header/toggle-expanded.svg +1 -1
  134. package/docs/design/templates/list-header-dark.svg +1 -1
  135. package/docs/design/templates/list-header.svg +1 -1
  136. package/docs/design/templates/list.svg +1 -1
  137. package/docs/design/templates/state-banner/info-badge-dark.svg +1 -1
  138. package/docs/design/templates/state-banner/info-badge.svg +1 -1
  139. package/docs/design/templates/state-banner-dark.svg +1 -1
  140. package/docs/design/templates/state-banner.svg +1 -1
  141. package/docs/design/templates/toolbar/title-and-actions-dark.svg +1 -1
  142. package/docs/design/templates/toolbar/title-and-actions.svg +1 -1
  143. package/docs/design/templates/toolbar-control-group/with-text-dark.svg +1 -1
  144. package/docs/design/templates/toolbar-control-group/with-text.svg +1 -1
  145. package/docs/design/templates/toolbar-control-group-dark.svg +1 -1
  146. package/docs/design/templates/toolbar-control-group.svg +1 -1
  147. package/docs/design/templates/toolbar-dark.svg +1 -1
  148. package/docs/design/templates/toolbar-text/default-dark.svg +1 -1
  149. package/docs/design/templates/toolbar-text/default.svg +1 -1
  150. package/docs/design/templates/toolbar-text/large-dark.svg +1 -1
  151. package/docs/design/templates/toolbar-text/large.svg +1 -1
  152. package/docs/design/templates/toolbar-text/small-dark.svg +1 -1
  153. package/docs/design/templates/toolbar-text/small.svg +1 -1
  154. package/docs/design/templates/toolbar-text-dark.svg +1 -1
  155. package/docs/design/templates/toolbar-text.svg +1 -1
  156. package/docs/design/templates/toolbar.svg +1 -1
  157. package/docs/document-baseline.md +31 -0
  158. package/docs/layout.md +86 -21
  159. package/docs/nav-stack.md +8 -0
  160. package/docs/recipes.md +78 -43
  161. package/docs/split-view.md +8 -0
  162. package/docs/tab-scaffold.md +4 -2
  163. package/docs/type-contracts.md +21 -17
  164. package/docs/ui-analyzer.md +19 -0
  165. package/docs/ui-evaluator.md +17 -0
  166. package/docs/ux-demo.md +4 -4
  167. package/docs/webawesome-theme.md +20 -2
  168. package/docs/workbench.md +20 -1
  169. package/evaluator/index.mjs +73 -8
  170. package/llms.txt +32 -14
  171. package/package.json +4 -2
  172. package/ux-demo/recipes/app-shell.tsx +209 -178
  173. package/ux-demo/recipes/collapsible-sidebar.tsx +188 -159
  174. package/ux-demo/recipes/compact-toolbar.tsx +48 -35
  175. package/ux-demo/recipes/composer-form.tsx +85 -79
  176. package/ux-demo/recipes/list-detail-dialog.tsx +124 -142
  177. package/ux-demo/recipes/list-workspace-states.tsx +83 -83
  178. package/ux-demo/recipes/loaders.ts +5 -2
  179. package/ux-demo/recipes/loading-inspector.tsx +157 -160
  180. package/ux-demo/recipes/navigation-sidebar.tsx +111 -109
  181. package/ux-demo/recipes/navigation-stack.tsx +50 -49
  182. package/ux-demo/recipes/types.ts +14 -0
  183. package/ux-demo/recipes/workspace-header.tsx +73 -56
  184. package/dist/chunk-AQSKJ6U6.js.map +0 -1
  185. package/dist/chunk-ELRMBQEC.js.map +0 -1
  186. package/dist/chunk-J3EE6XWD.js +0 -115
  187. package/dist/chunk-J3EE6XWD.js.map +0 -1
  188. package/dist/chunk-KKNK3JUT.js.map +0 -1
  189. package/dist/chunk-OL4TC3U2.js.map +0 -1
  190. package/dist/chunk-OQI7RCRP.js.map +0 -1
  191. package/dist/chunk-UMGY5JSP.js.map +0 -1
  192. package/dist/chunk-V6RZWDII.js.map +0 -1
  193. package/dist/chunk-ZNZ2JDBW.js.map +0 -1
  194. package/ux-demo/recipes/app-shell.css +0 -87
  195. package/ux-demo/recipes/collapsible-sidebar.css +0 -83
  196. package/ux-demo/recipes/compact-toolbar.css +0 -35
  197. package/ux-demo/recipes/composer-form.css +0 -19
  198. package/ux-demo/recipes/list-detail-dialog.css +0 -42
  199. package/ux-demo/recipes/list-workspace-states.css +0 -30
  200. package/ux-demo/recipes/loading-inspector.css +0 -7
  201. package/ux-demo/recipes/navigation-sidebar.css +0 -12
  202. package/ux-demo/recipes/navigation-stack.css +0 -12
  203. package/ux-demo/recipes/recipe-root.css +0 -67
  204. package/ux-demo/recipes/recipe-root.tsx +0 -87
  205. package/ux-demo/recipes/workspace-header.css +0 -7
@@ -1,6 +1,6 @@
1
1
  # Web Awesome JSX signatures for the UI authoring corpus
2
2
 
3
- Generated from the emitted `@kerfjs/ui@5.0.0-beta.50` declaration boundary. Import `@kerfjs/ui/webawesome` for type effects when authoring direct `wa-*` JSX. The module emits no runtime behavior and does not register custom elements.
3
+ Generated from the emitted `@kerfjs/ui@5.0.0-beta.51` declaration boundary. Import `@kerfjs/ui/webawesome` for type effects when authoring direct `wa-*` JSX. The module emits no runtime behavior and does not register custom elements.
4
4
 
5
5
  ```ts
6
6
  import { KerfCustomElement } from 'kerfjs/jsx-runtime';
@@ -201,7 +201,19 @@ async function loadCatalogs(profileResult) {
201
201
  'utf8',
202
202
  ),
203
203
  );
204
- entries.push(...(artifact.entries ?? []));
204
+ const selection = await loadSelectionFacts(owner, catalog);
205
+ for (const entry of artifact.entries ?? []) {
206
+ const selected = selection.get(entry.key);
207
+ entries.push(
208
+ selected
209
+ ? {
210
+ ...entry,
211
+ publicExports: entry.publicExports ?? selected.publicExports,
212
+ moduleImports: selected.moduleImports,
213
+ }
214
+ : entry,
215
+ );
216
+ }
205
217
  } catch {
206
218
  // Profile validation reports the precise catalog load failure.
207
219
  }
@@ -209,16 +221,86 @@ async function loadCatalogs(profileResult) {
209
221
  return entries;
210
222
  }
211
223
 
224
+ // The composition (v2) catalog carries no import facts, and several of its
225
+ // entries share a display name (the Kerf `Select` and the Web Awesome
226
+ // `wa-select` are both "Select"). The selection (v1) catalog is where each
227
+ // entry's real public exports and import subpaths live, so join it by key.
228
+ async function loadSelectionFacts(owner, catalog) {
229
+ const facts = new Map();
230
+ if (!catalog.selection?.path) return facts;
231
+ let artifact;
232
+ try {
233
+ artifact = JSON.parse(
234
+ await readFile(resolve(dirname(owner), catalog.selection.path), 'utf8'),
235
+ );
236
+ } catch {
237
+ return facts;
238
+ }
239
+ const packageName = artifact.package ?? catalog.package;
240
+ for (const entry of artifact.entries ?? []) {
241
+ const delivery = entry.delivery ?? {};
242
+ facts.set(`${packageName}:${entry.id}`, {
243
+ publicExports: entry.publicExports,
244
+ moduleImports: [delivery.browserImport, delivery.moduleImport].filter(
245
+ Boolean,
246
+ ),
247
+ });
248
+ }
249
+ return facts;
250
+ }
251
+
252
+ // A catalog entry's public exports mix the component render function with
253
+ // helpers its props consume (`Select` ships `uiColor`, `List` ships
254
+ // `px`/`rem`/`flex`). Only the render function stands for the entry, so only
255
+ // it may carry the entry's contracts. A component export is one whose name
256
+ // starts with an uppercase letter: JSX itself treats a lowercase tag as an
257
+ // intrinsic element, so a lowercase export can never be a component tag, and
258
+ // scripts/check-component-catalog.mjs enforces the converse for this package
259
+ // (every uppercase runtime export returns SafeHtml; no lowercase one does).
260
+ // eslint-plugin-kerfjs applies the same rule.
261
+ function isComponentExport(name) {
262
+ return /^[A-Z]/.test(name);
263
+ }
264
+
265
+ // Pick the catalog entry an imported (or namespace-accessed) export name
266
+ // refers to. Names are not unique across a catalog, so candidates are ranked:
267
+ // an entry whose own import subpath is the module wins, then an entry that
268
+ // declares the name as a public export, then catalog order. A helper export
269
+ // never resolves to an entry.
270
+ function resolveExportEntry(candidates, name, module) {
271
+ if (!isComponentExport(name)) return undefined;
272
+ const eligible = (candidates ?? []).filter(
273
+ (entry) =>
274
+ module === entry.package || module?.startsWith(`${entry.package}/`),
275
+ );
276
+ const exported = (entry) =>
277
+ (entry.publicExports ?? []).some(
278
+ (item) => (typeof item === 'string' ? item : item.name) === name,
279
+ );
280
+ return (
281
+ eligible.find((entry) => entry.moduleImports?.includes(module)) ??
282
+ eligible.find(exported) ??
283
+ eligible[0]
284
+ );
285
+ }
286
+
212
287
  function catalogFacts(entries) {
213
288
  const publicClasses = new Set();
214
289
  const publicTokens = new Set();
215
290
  const publicParts = new Map();
216
291
  const classEntries = new Map();
217
292
  const exportEntries = new Map();
293
+ const addExport = (name, entry) => {
294
+ const candidates = exportEntries.get(name) ?? [];
295
+ if (!candidates.includes(entry)) candidates.push(entry);
296
+ exportEntries.set(name, candidates);
297
+ };
218
298
  for (const entry of entries) {
219
- exportEntries.set(entry.name, entry);
220
- for (const item of entry.publicExports ?? [])
221
- exportEntries.set(typeof item === 'string' ? item : item.name, entry);
299
+ addExport(entry.name, entry);
300
+ for (const item of entry.publicExports ?? []) {
301
+ const name = typeof item === 'string' ? item : item.name;
302
+ if (isComponentExport(name)) addExport(name, entry);
303
+ }
222
304
  for (const className of entry.boundaries?.publicClasses ?? []) {
223
305
  publicClasses.add(className);
224
306
  const owners = classEntries.get(className) ?? [];
@@ -632,12 +714,12 @@ function inspectTsx(file, sourceText, facts, cssFacts, diagnostics) {
632
714
  for (const item of bindings.elements) {
633
715
  const exported = item.propertyName?.text ?? item.name.text;
634
716
  helperImports.set(item.name.text, { imported: exported, source: module });
635
- const entry = facts.exportEntries.get(exported);
636
- if (
637
- entry &&
638
- (module === entry.package || module.startsWith(`${entry.package}/`))
639
- )
640
- imports.set(item.name.text, entry);
717
+ const entry = resolveExportEntry(
718
+ facts.exportEntries.get(exported),
719
+ exported,
720
+ module,
721
+ );
722
+ if (entry) imports.set(item.name.text, entry);
641
723
  }
642
724
  }
643
725
  const stack = [];
@@ -648,20 +730,13 @@ function inspectTsx(file, sourceText, facts, cssFacts, diagnostics) {
648
730
  const namespaceEntry =
649
731
  ts.isPropertyAccessExpression(opening.tagName) &&
650
732
  ts.isIdentifier(opening.tagName.expression)
651
- ? facts.exportEntries.get(opening.tagName.name.text)
652
- : undefined;
653
- const namespaceSource =
654
- ts.isPropertyAccessExpression(opening.tagName) &&
655
- ts.isIdentifier(opening.tagName.expression)
656
- ? namespaces.get(opening.tagName.expression.text)
733
+ ? resolveExportEntry(
734
+ facts.exportEntries.get(opening.tagName.name.text),
735
+ opening.tagName.name.text,
736
+ namespaces.get(opening.tagName.expression.text),
737
+ )
657
738
  : undefined;
658
- const entry =
659
- imports.get(tag) ??
660
- (namespaceEntry &&
661
- (namespaceSource === namespaceEntry.package ||
662
- namespaceSource?.startsWith(`${namespaceEntry.package}/`))
663
- ? namespaceEntry
664
- : undefined);
739
+ const entry = imports.get(tag) ?? namespaceEntry;
665
740
  const classAttribute = opening.attributes.properties.find(
666
741
  (item) =>
667
742
  ts.isJsxAttribute(item) &&
@@ -744,20 +819,15 @@ function inspectTsx(file, sourceText, facts, cssFacts, diagnostics) {
744
819
  return;
745
820
  }
746
821
  if (ts.isCallExpression(node)) {
747
- const namespaceEntry = ts.isPropertyAccessExpression(node.expression)
748
- ? facts.exportEntries.get(node.expression.name.text)
749
- : undefined;
750
- const namespaceSource =
751
- ts.isPropertyAccessExpression(node.expression) &&
752
- ts.isIdentifier(node.expression.expression)
753
- ? namespaces.get(node.expression.expression.text)
754
- : undefined;
755
822
  const entry = ts.isIdentifier(node.expression)
756
823
  ? imports.get(node.expression.text)
757
- : namespaceEntry &&
758
- (namespaceSource === namespaceEntry.package ||
759
- namespaceSource?.startsWith(`${namespaceEntry.package}/`))
760
- ? namespaceEntry
824
+ : ts.isPropertyAccessExpression(node.expression) &&
825
+ ts.isIdentifier(node.expression.expression)
826
+ ? resolveExportEntry(
827
+ facts.exportEntries.get(node.expression.name.text),
828
+ node.expression.name.text,
829
+ namespaces.get(node.expression.expression.text),
830
+ )
761
831
  : undefined;
762
832
  if (entry)
763
833
  inspectCssValues(
package/dist/app-tab.js CHANGED
@@ -1,4 +1,4 @@
1
- export { AppTab } from './chunk-COUPLRZG.js';
1
+ export { AppTab } from './chunk-5FZZMIMD.js';
2
2
 
3
3
 
4
4
 
@@ -1,4 +1,4 @@
1
- import { C as CatalogResource } from './types-CzgSrFXP.js';
1
+ import { C as CatalogResource } from './types-CEsieBZi.js';
2
2
  import './semantic-content-BbzjvSu9.js';
3
3
  import 'kerfjs';
4
4
 
package/dist/catalog.d.ts CHANGED
@@ -1,14 +1,33 @@
1
1
  import * as kerfjs from 'kerfjs';
2
2
  import { SafeHtml } from 'kerfjs';
3
- import { a as CatalogProps } from './types-CzgSrFXP.js';
4
- export { b as CatalogBrand, c as CatalogEntry, d as CatalogRelated, C as CatalogResource, e as CatalogSecondaryGroup, f as CatalogSection } from './types-CzgSrFXP.js';
3
+ import { a as CatalogProps } from './types-CEsieBZi.js';
4
+ export { b as CatalogBrand, c as CatalogEntry, d as CatalogRelated, C as CatalogResource, e as CatalogSecondaryGroup, f as CatalogSection, g as CatalogStageRootAttributes } from './types-CEsieBZi.js';
5
5
  import { K as KerfUiContent } from './semantic-content-BbzjvSu9.js';
6
6
 
7
7
  /** Controlled, stateless component-catalog shell. */
8
- declare function Catalog({ brand, sections, active, content, collapsed, theme, headerActions, secondarySections, sidebarFooter, status, geometryOverlay, selectAction, toggleSidebarAction, toggleThemeAction, toggleSecondaryAction, className, slot, }: CatalogProps): kerfjs.SafeHtml;
8
+ declare function Catalog({ brand, sections, active, content, collapsed, theme, headerActions, secondarySections, sidebarFooter, status, geometryOverlay, stageRootAttributes, selectAction, toggleSidebarAction, toggleThemeAction, toggleSecondaryAction, className, slot, }: CatalogProps): kerfjs.SafeHtml;
9
9
 
10
10
  /** How a specimen aligns its visible edge with its `ListHeader` label. */
11
11
  type CatalogExampleAlign = 'glyph' | 'inline-control' | 'none';
12
+ interface CatalogExampleViewport {
13
+ layout?: 'grid' | 'flex' | 'flex-column';
14
+ width?: 'full' | 'compact' | 'medium' | 'wide' | 'text' | 'control';
15
+ /** Fixed specimen height; `app` frames an application-sized recipe or layout.
16
+ * A fixed height is definite, so a child that fills with `height: 100%`
17
+ * (a horizontal `ResizableRegion`, say) spans the whole frame. */
18
+ height?: 'short' | 'reduced' | 'medium' | 'tall' | 'app';
19
+ /** A minimum the frame may grow past. It is not a definite height: a child
20
+ * sized with `height: 100%` falls back to its content height, so use
21
+ * `height` when the specimen must fill the frame. */
22
+ minHeight?: 'short' | 'medium';
23
+ frame?: 'solid' | 'dashed';
24
+ surface?: 'default' | 'lowered';
25
+ overflow?: 'hidden' | 'auto-x';
26
+ responsive?: 'roomy-only';
27
+ shadow?: boolean;
28
+ /** Public component custom properties applied to the specimen viewport. */
29
+ tokens?: Readonly<Record<`--${string}`, string>>;
30
+ }
12
31
  type CatalogExampleRootAttributes = Readonly<Record<`data-${string}`, string | undefined> & {
13
32
  'data-catalog-example'?: never;
14
33
  'data-catalog-example-stack'?: never;
@@ -20,6 +39,10 @@ interface CatalogExampleProps {
20
39
  label?: string;
21
40
  note?: SafeHtml | string;
22
41
  align?: CatalogExampleAlign;
42
+ /** Optional catalog-owned constraints for demonstrating layout components. */
43
+ viewport?: CatalogExampleViewport;
44
+ /** Replacement guidance shown when a roomy-only viewport is hidden. */
45
+ compactFallback?: SafeHtml | string;
23
46
  rootAttributes?: CatalogExampleRootAttributes;
24
47
  className?: string;
25
48
  children?: KerfUiContent;
@@ -27,7 +50,7 @@ interface CatalogExampleProps {
27
50
  slot?: string;
28
51
  }
29
52
  /** A labeled catalog specimen with optional explanatory text and alignment. */
30
- declare function CatalogExample({ label, note, align, rootAttributes, className, children, slot, }: CatalogExampleProps): SafeHtml;
53
+ declare function CatalogExample({ label, note, align, viewport, compactFallback, rootAttributes, className, children, slot, }: CatalogExampleProps): SafeHtml;
31
54
 
32
55
  type CatalogExampleStackRootAttributes = Readonly<Record<`data-${string}`, string | undefined> & {
33
56
  'data-catalog-example'?: never;
@@ -47,4 +70,4 @@ interface CatalogExampleStackProps {
47
70
  /** A vertically stacked group of catalog examples. */
48
71
  declare function CatalogExampleStack({ label, rootAttributes, className, children, slot, }: CatalogExampleStackProps): kerfjs.SafeHtml;
49
72
 
50
- export { Catalog, CatalogExample, type CatalogExampleAlign, type CatalogExampleProps, CatalogExampleStack, type CatalogExampleStackProps, CatalogProps };
73
+ export { Catalog, CatalogExample, type CatalogExampleAlign, type CatalogExampleProps, CatalogExampleStack, type CatalogExampleStackProps, type CatalogExampleViewport, CatalogProps };
package/dist/catalog.js CHANGED
@@ -1,12 +1,12 @@
1
1
  import { ToolbarControlGroup, ToolbarActionLink } from './chunk-ZIYOJFZD.js';
2
- import { Toolbar } from './chunk-OQI7RCRP.js';
3
- import { ListItem } from './chunk-ZSYLBVWG.js';
4
- import { List } from './chunk-UMGY5JSP.js';
5
- import { ToolbarText } from './chunk-DJKWFYAA.js';
6
- import { Pane } from './chunk-V6RZWDII.js';
2
+ import { Toolbar } from './chunk-MTM43SJO.js';
3
+ import { ListItem } from './chunk-NMGTHYW3.js';
4
+ import { List } from './chunk-S4QRSBFI.js';
5
+ import { ToolbarText } from './chunk-O3RCCSQJ.js';
6
+ import { Pane } from './chunk-7GUQYHKA.js';
7
7
 
8
8
 
9
- import { ListHeader } from './chunk-2YOUUEWR.js';
9
+ import { ListHeader } from './chunk-KX7DP2GO.js';
10
10
 
11
11
 
12
12
  import { filterDataAttributes } from './chunk-SRSJO5QE.js';
@@ -102,23 +102,38 @@ function CatalogResourceFooter({
102
102
  )
103
103
  ] });
104
104
  }
105
+ var protectedAttributes = /* @__PURE__ */ new Set(["data-catalog-stage"]);
105
106
  function CatalogStage({
106
107
  name,
107
108
  content,
108
- geometryOverlay
109
+ geometryOverlay,
110
+ rootAttributes = {}
109
111
  }) {
110
- return /* @__PURE__ */ jsx("section", { class: "kui-catalog__stage", "aria-label": `${name} preview`, children: /* @__PURE__ */ jsxs("div", { class: "kui-catalog__canvas", children: [
111
- content,
112
- geometryOverlay !== void 0 ? /* @__PURE__ */ jsx(
113
- "div",
114
- {
115
- class: "kui-catalog__geometry-overlay",
116
- "data-catalog-geometry-overlay": true,
117
- "data-morph-skip-children": true,
118
- "aria-hidden": "true"
119
- }
120
- ) : null
121
- ] }) });
112
+ const safeRootAttributes = filterDataAttributes(
113
+ rootAttributes,
114
+ protectedAttributes
115
+ );
116
+ return /* @__PURE__ */ jsx(
117
+ "section",
118
+ {
119
+ ...safeRootAttributes,
120
+ class: "kui-catalog__stage",
121
+ "data-catalog-stage": true,
122
+ "aria-label": `${name} preview`,
123
+ children: /* @__PURE__ */ jsxs("div", { class: "kui-catalog__canvas", children: [
124
+ content,
125
+ geometryOverlay !== void 0 ? /* @__PURE__ */ jsx(
126
+ "div",
127
+ {
128
+ class: "kui-catalog__geometry-overlay",
129
+ "data-catalog-geometry-overlay": true,
130
+ "data-morph-skip-children": true,
131
+ "aria-hidden": "true"
132
+ }
133
+ ) : null
134
+ ] })
135
+ }
136
+ );
122
137
  }
123
138
  function CatalogDetail({
124
139
  brandTitle,
@@ -130,6 +145,7 @@ function CatalogDetail({
130
145
  headerActions,
131
146
  status,
132
147
  geometryOverlay,
148
+ stageRootAttributes,
133
149
  selectAction,
134
150
  toggleSidebarAction,
135
151
  toggleThemeAction
@@ -209,7 +225,8 @@ function CatalogDetail({
209
225
  {
210
226
  name,
211
227
  content,
212
- geometryOverlay
228
+ geometryOverlay,
229
+ rootAttributes: stageRootAttributes
213
230
  }
214
231
  )
215
232
  }
@@ -376,6 +393,7 @@ function Catalog({
376
393
  sidebarFooter,
377
394
  status,
378
395
  geometryOverlay,
396
+ stageRootAttributes,
379
397
  selectAction = "catalog-select",
380
398
  toggleSidebarAction = "catalog-toggle-sidebar",
381
399
  toggleThemeAction = "catalog-toggle-theme",
@@ -419,6 +437,7 @@ function Catalog({
419
437
  headerActions,
420
438
  status,
421
439
  geometryOverlay,
440
+ stageRootAttributes,
422
441
  selectAction,
423
442
  toggleSidebarAction,
424
443
  toggleThemeAction
@@ -428,7 +447,7 @@ function Catalog({
428
447
  }
429
448
  );
430
449
  }
431
- var protectedAttributes = /* @__PURE__ */ new Set([
450
+ var protectedAttributes2 = /* @__PURE__ */ new Set([
432
451
  "data-catalog-example",
433
452
  "data-catalog-example-stack",
434
453
  "data-catalog-example-label",
@@ -439,6 +458,8 @@ function CatalogExample({
439
458
  label,
440
459
  note,
441
460
  align = "none",
461
+ viewport,
462
+ compactFallback,
442
463
  rootAttributes = {},
443
464
  className = "",
444
465
  children,
@@ -446,8 +467,27 @@ function CatalogExample({
446
467
  }) {
447
468
  const safeRootAttributes = filterDataAttributes(
448
469
  rootAttributes,
449
- protectedAttributes
470
+ protectedAttributes2
450
471
  );
472
+ const viewportStyle = viewport?.tokens ? Object.entries(viewport.tokens).map(([name, value]) => `${name}:${value}`).join(";") : void 0;
473
+ const specimen = viewport ? /* @__PURE__ */ jsx(
474
+ "div",
475
+ {
476
+ class: "kui-catalog-example__viewport",
477
+ "data-catalog-example-viewport": true,
478
+ "data-layout": viewport.layout,
479
+ "data-width": viewport.width,
480
+ "data-height": viewport.height,
481
+ "data-min-height": viewport.minHeight,
482
+ "data-frame": viewport.frame,
483
+ "data-surface": viewport.surface,
484
+ "data-overflow": viewport.overflow,
485
+ "data-responsive": viewport.responsive,
486
+ "data-shadow": viewport.shadow ? "true" : void 0,
487
+ style: viewportStyle,
488
+ children
489
+ }
490
+ ) : children;
451
491
  return /* @__PURE__ */ jsxs(
452
492
  "section",
453
493
  {
@@ -466,12 +506,13 @@ function CatalogExample({
466
506
  }
467
507
  ) : null,
468
508
  note !== void 0 ? /* @__PURE__ */ jsx("p", { class: "kui-catalog-example__note", "data-catalog-example-note": true, children: note }) : null,
469
- children
509
+ compactFallback !== void 0 ? /* @__PURE__ */ jsx("p", { class: "kui-catalog-example__compact-fallback", children: compactFallback }) : null,
510
+ specimen
470
511
  ]
471
512
  }
472
513
  );
473
514
  }
474
- var protectedAttributes2 = /* @__PURE__ */ new Set([
515
+ var protectedAttributes3 = /* @__PURE__ */ new Set([
475
516
  "data-catalog-example",
476
517
  "data-catalog-example-stack",
477
518
  "data-catalog-example-label",
@@ -487,7 +528,7 @@ function CatalogExampleStack({
487
528
  }) {
488
529
  const safeRootAttributes = filterDataAttributes(
489
530
  rootAttributes,
490
- protectedAttributes2
531
+ protectedAttributes3
491
532
  );
492
533
  return /* @__PURE__ */ jsx(
493
534
  "section",
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/catalog/components/catalog-resource-footer.tsx","../src/catalog/components/catalog-stage.tsx","../src/catalog/components/catalog-detail.tsx","../src/catalog/components/catalog-secondary-sections.tsx","../src/catalog/components/catalog-section-list.tsx","../src/catalog/components/catalog-sidebar.tsx","../src/catalog/components/catalog.tsx","../src/catalog/components/catalog-example.tsx","../src/catalog/components/catalog-example-stack.tsx"],"names":["jsx","jsxs","Fragment","protectedAttributes"],"mappings":"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","file":"catalog.js","sourcesContent":["import type { SafeHtml } from 'kerfjs';\nimport { ExternalLink, Waypoints } from 'lucide';\n\nimport { LucideIcon } from '../../lucide-icon.js';\nimport type { KerfUiContent } from '../../semantic-content.js';\nimport { Toolbar } from '../../toolbar.js';\nimport {\n ToolbarActionLink,\n ToolbarControlGroup,\n} from '../../toolbar-control-group.js';\nimport type { CatalogRelated, CatalogResource } from '../types.js';\n\ninterface CatalogResourceFooterProps {\n name: string;\n active: string;\n resources: readonly CatalogResource[];\n related: readonly CatalogRelated[];\n status?: KerfUiContent;\n selectAction: string;\n}\n\nfunction relatedMenuItems(\n related: readonly CatalogRelated[],\n selectAction: string,\n): SafeHtml[] {\n const groups: string[] = [];\n for (const entry of related)\n if (!groups.includes(entry.group)) groups.push(entry.group);\n\n const nodes: SafeHtml[] = [];\n groups.forEach((group, index) => {\n if (index > 0) nodes.push(<wa-divider></wa-divider>);\n nodes.push(<small class=\"kui-catalog__related-heading\">{group}</small>);\n for (const entry of related) {\n if (entry.group === group)\n nodes.push(\n <wa-dropdown-item data-action={selectAction} data-item-id={entry.id}>\n {entry.name}\n </wa-dropdown-item>,\n );\n }\n });\n return nodes;\n}\n\n/** Status, resources, and related-entry navigation for the active specimen. */\nexport function CatalogResourceFooter({\n name,\n active,\n resources,\n related,\n status,\n selectAction,\n}: CatalogResourceFooterProps) {\n return (\n <div class=\"kui-catalog__footer\">\n {status ? <div class=\"kui-catalog__status\">{status}</div> : null}\n <Toolbar\n label={`${name} resources`}\n dividerSides=\"\"\n responsive=\"stack\"\n responsiveAt=\"narrow\"\n leading={\n resources.length > 0 ? (\n <ToolbarControlGroup\n label={`${name} resources`}\n content=\"mixed\"\n size=\"compact\"\n overflow=\"scroll\"\n >\n {resources.map((resource) => (\n <ToolbarActionLink\n href={resource.href}\n label={resource.label}\n detail={resource.detail}\n ariaLabel={`${name}: ${resource.label} (opens in new tab)`}\n external\n icon={<LucideIcon icon={ExternalLink} name=\"external-link\" />}\n />\n ))}\n </ToolbarControlGroup>\n ) : null\n }\n trailing={\n related.length > 0 ? (\n <ToolbarControlGroup\n single\n content=\"mixed\"\n nestedDropdown\n menuInset=\"compact\"\n size=\"compact\"\n label=\"Related entries\"\n >\n <wa-dropdown\n placement=\"top-end\"\n data-key={`kui-catalog-related-${active}`}\n data-catalog-related\n data-morph-skip-children\n >\n <wa-button slot=\"trigger\" appearance=\"plain\" with-caret>\n <LucideIcon icon={Waypoints} name=\"waypoints\" />\n <span>Components</span>\n </wa-button>\n {relatedMenuItems(related, selectAction)}\n </wa-dropdown>\n </ToolbarControlGroup>\n ) : null\n }\n />\n </div>\n );\n}\n","import type { KerfUiContent } from '../../semantic-content.js';\n\ninterface CatalogStageProps {\n name: string;\n content: KerfUiContent;\n geometryOverlay?: boolean;\n}\n\n/** The centered preview canvas and its optional wire-managed geometry overlay. */\nexport function CatalogStage({\n name,\n content,\n geometryOverlay,\n}: CatalogStageProps) {\n return (\n <section class=\"kui-catalog__stage\" aria-label={`${name} preview`}>\n <div class=\"kui-catalog__canvas\">\n {content}\n {geometryOverlay !== undefined ? (\n <div\n class=\"kui-catalog__geometry-overlay\"\n data-catalog-geometry-overlay\n data-morph-skip-children\n aria-hidden=\"true\"\n />\n ) : null}\n </div>\n </section>\n );\n}\n","import { Moon, PanelLeftOpen, Sun } from 'lucide';\n\nimport { LucideIcon } from '../../lucide-icon.js';\nimport { Pane } from '../../pane.js';\nimport type { KerfUiContent } from '../../semantic-content.js';\nimport { Toolbar } from '../../toolbar.js';\nimport { ToolbarControlGroup } from '../../toolbar-control-group.js';\nimport { ToolbarText } from '../../toolbar-text.js';\nimport type { CatalogEntry } from '../types.js';\nimport { CatalogResourceFooter } from './catalog-resource-footer.js';\nimport { CatalogStage } from './catalog-stage.js';\n\ninterface CatalogDetailProps {\n brandTitle: string;\n active: string;\n selected?: CatalogEntry;\n content: KerfUiContent;\n collapsed: boolean;\n theme?: 'light' | 'dark';\n headerActions?: KerfUiContent;\n status?: KerfUiContent;\n geometryOverlay?: boolean;\n selectAction: string;\n toggleSidebarAction: string;\n toggleThemeAction: string;\n}\n\n/** Active-entry header, preview stage, and resource footer. */\nexport function CatalogDetail({\n brandTitle,\n active,\n selected,\n content,\n collapsed,\n theme,\n headerActions,\n status,\n geometryOverlay,\n selectAction,\n toggleSidebarAction,\n toggleThemeAction,\n}: CatalogDetailProps) {\n const name = selected?.name ?? '';\n const nextTheme = theme === 'dark' ? 'light' : 'dark';\n\n return (\n <article class=\"kui-catalog__detail\">\n <Pane\n contentClassName=\"kui-catalog__detail-preview\"\n header={\n <div class=\"kui-catalog__header\">\n <Toolbar\n label={`${name} header`}\n dividerSides=\"\"\n leading={\n <>\n {collapsed ? (\n <ToolbarControlGroup appearance=\"borderless\" single>\n <button\n type=\"button\"\n data-action={toggleSidebarAction}\n aria-label={`Expand ${brandTitle} catalog`}\n >\n <LucideIcon\n icon={PanelLeftOpen}\n name=\"panel-left-open\"\n />\n </button>\n </ToolbarControlGroup>\n ) : null}\n <ToolbarText text={name} size=\"xlarge\" headingLevel={2} />\n </>\n }\n trailing={\n <>\n {headerActions}\n {theme ? (\n <ToolbarControlGroup\n appearance=\"borderless\"\n content=\"mixed\"\n size=\"compact\"\n label=\"Catalog display\"\n >\n <button\n type=\"button\"\n data-action={toggleThemeAction}\n aria-label={`Use ${nextTheme} theme`}\n data-theme-preview={theme}\n >\n {nextTheme === 'dark' ? (\n <LucideIcon icon={Moon} name=\"moon\" />\n ) : (\n <LucideIcon icon={Sun} name=\"sun\" />\n )}\n <span>{nextTheme === 'dark' ? 'Dark' : 'Light'}</span>\n </button>\n </ToolbarControlGroup>\n ) : null}\n </>\n }\n />\n {selected?.description ? (\n <p class=\"kui-catalog__description kui-content-item\">\n {selected.description}\n </p>\n ) : null}\n </div>\n }\n footer={\n <CatalogResourceFooter\n name={name}\n active={active}\n resources={selected?.resources ?? []}\n related={selected?.related ?? []}\n status={status}\n selectAction={selectAction}\n />\n }\n >\n <CatalogStage\n name={name}\n content={content}\n geometryOverlay={geometryOverlay}\n />\n </Pane>\n </article>\n );\n}\n","import { List } from '../../list.js';\nimport { ListHeader } from '../../list-header.js';\nimport { ListItem } from '../../list-item.js';\nimport type { CatalogSecondaryGroup } from '../types.js';\n\ninterface CatalogSecondarySectionsProps {\n group: CatalogSecondaryGroup;\n active: string;\n selectAction: string;\n toggleAction: string;\n}\n\n/** The quieter, optionally collapsible navigation below primary sections. */\nexport function CatalogSecondarySections({\n group,\n active,\n selectAction,\n toggleAction,\n}: CatalogSecondarySectionsProps) {\n return (\n <section class=\"kui-catalog__group--secondary\">\n {group.collapsible ? (\n <ListHeader\n label={group.label}\n toggle\n expanded={Boolean(group.expanded)}\n action={toggleAction}\n />\n ) : (\n <ListHeader label={group.label} />\n )}\n {!group.collapsible || group.expanded ? (\n <div class=\"kui-catalog__secondary\" data-catalog-secondary>\n {group.sections.map((section) => (\n <section class=\"kui-catalog__secondary-group\">\n <h3 class=\"kui-catalog__secondary-heading\">{section.category}</h3>\n <div class=\"kui-catalog__secondary-items\">\n <List gap=\"2xs\">\n {section.entries.map((entry) => (\n <ListItem\n action={selectAction}\n itemId={entry.id}\n label={entry.name}\n status={entry.tags?.join(' · ')}\n selected={active === entry.id}\n title={entry.description}\n multiline\n />\n ))}\n </List>\n </div>\n </section>\n ))}\n </div>\n ) : null}\n </section>\n );\n}\n","import { List } from '../../list.js';\nimport { ListHeader } from '../../list-header.js';\nimport { ListItem } from '../../list-item.js';\nimport type { CatalogSection } from '../types.js';\n\ninterface CatalogSectionListProps {\n sections: readonly CatalogSection[];\n active: string;\n selectAction: string;\n}\n\n/** The primary category sections in the catalog navigation. */\nexport function CatalogSectionList({\n sections,\n active,\n selectAction,\n}: CatalogSectionListProps) {\n return (\n <div class=\"kui-catalog__sections\">\n {sections.map((section) => (\n <section class=\"kui-catalog__group\">\n <ListHeader label={section.category} />\n <div class=\"kui-catalog__items\">\n <List gap=\"2xs\">\n {section.entries.map((entry) => (\n <ListItem\n action={selectAction}\n itemId={entry.id}\n label={entry.name}\n status={entry.tags?.join(' · ')}\n selected={active === entry.id}\n title={entry.description}\n multiline\n />\n ))}\n </List>\n </div>\n </section>\n ))}\n </div>\n );\n}\n","import { PanelLeftClose } from 'lucide';\n\nimport { LucideIcon } from '../../lucide-icon.js';\nimport { Pane } from '../../pane.js';\nimport type { KerfUiContent } from '../../semantic-content.js';\nimport { Toolbar } from '../../toolbar.js';\nimport { ToolbarControlGroup } from '../../toolbar-control-group.js';\nimport { ToolbarText } from '../../toolbar-text.js';\nimport type {\n CatalogBrand,\n CatalogSecondaryGroup,\n CatalogSection,\n} from '../types.js';\nimport { CatalogSecondarySections } from './catalog-secondary-sections.js';\nimport { CatalogSectionList } from './catalog-section-list.js';\n\ninterface CatalogSidebarProps {\n brand: CatalogBrand;\n sections: readonly CatalogSection[];\n active: string;\n collapsed: boolean;\n secondarySections?: CatalogSecondaryGroup;\n footer?: KerfUiContent;\n selectAction: string;\n toggleSidebarAction: string;\n toggleSecondaryAction: string;\n}\n\nexport function CatalogSidebar({\n brand,\n sections,\n active,\n collapsed,\n secondarySections,\n footer,\n selectAction,\n toggleSidebarAction,\n toggleSecondaryAction,\n}: CatalogSidebarProps) {\n return (\n <aside\n class=\"kui-catalog__sidebar\"\n aria-label={`${brand.title} catalog`}\n data-collapsed={String(collapsed)}\n >\n <Pane\n header={\n <div class=\"kui-catalog__brand\">\n <Toolbar\n label={`${brand.title} catalog header`}\n dividerSides=\"\"\n leading={\n <>\n {brand.logoUrl ? (\n <ToolbarControlGroup appearance=\"borderless\" single>\n <img\n class=\"kui-catalog__mark\"\n src={brand.logoUrl}\n alt=\"\"\n />\n </ToolbarControlGroup>\n ) : null}\n <ToolbarText\n text={brand.title}\n size=\"large\"\n headingLevel={1}\n />\n </>\n }\n trailing={\n <ToolbarControlGroup appearance=\"borderless\" single>\n <button\n type=\"button\"\n data-action={toggleSidebarAction}\n aria-label={`Collapse ${brand.title} catalog`}\n >\n <LucideIcon icon={PanelLeftClose} name=\"panel-left-close\" />\n </button>\n </ToolbarControlGroup>\n }\n />\n {brand.subtitle ? (\n <p class=\"kui-catalog__subtitle\">{brand.subtitle}</p>\n ) : null}\n </div>\n }\n >\n <nav\n class=\"kui-catalog__navigation\"\n aria-label={`${brand.title} components`}\n >\n <CatalogSectionList\n sections={sections}\n active={active}\n selectAction={selectAction}\n />\n {secondarySections ? (\n <CatalogSecondarySections\n group={secondarySections}\n active={active}\n selectAction={selectAction}\n toggleAction={toggleSecondaryAction}\n />\n ) : null}\n {footer}\n </nav>\n </Pane>\n </aside>\n );\n}\n","import type { CatalogEntry, CatalogProps, CatalogSection } from '../types.js';\nimport { CatalogDetail } from './catalog-detail.js';\nimport { CatalogSidebar } from './catalog-sidebar.js';\n\nfunction findEntry(\n sections: readonly CatalogSection[],\n id: string,\n): CatalogEntry | undefined {\n for (const section of sections) {\n for (const entry of section.entries) if (entry.id === id) return entry;\n }\n return undefined;\n}\n\n/** Controlled, stateless component-catalog shell. */\nexport function Catalog({\n brand,\n sections,\n active,\n content,\n collapsed = false,\n theme,\n headerActions,\n secondarySections,\n sidebarFooter,\n status,\n geometryOverlay,\n selectAction = 'catalog-select',\n toggleSidebarAction = 'catalog-toggle-sidebar',\n toggleThemeAction = 'catalog-toggle-theme',\n toggleSecondaryAction = 'catalog-toggle-secondary',\n className = '',\n slot,\n}: CatalogProps) {\n const selected =\n findEntry(sections, active) ??\n (secondarySections\n ? findEntry(secondarySections.sections, active)\n : undefined);\n\n return (\n <main\n class={`kui-catalog ${className}`.trim()}\n data-component=\"catalog\"\n data-sidebar-collapsed={String(collapsed)}\n data-geometry-overlay={\n geometryOverlay === undefined ? undefined : String(geometryOverlay)\n }\n slot={slot}\n >\n <CatalogSidebar\n brand={brand}\n sections={sections}\n active={active}\n collapsed={collapsed}\n secondarySections={secondarySections}\n footer={sidebarFooter}\n selectAction={selectAction}\n toggleSidebarAction={toggleSidebarAction}\n toggleSecondaryAction={toggleSecondaryAction}\n />\n <CatalogDetail\n brandTitle={brand.title}\n active={active}\n selected={selected}\n content={content}\n collapsed={collapsed}\n theme={theme}\n headerActions={headerActions}\n status={status}\n geometryOverlay={geometryOverlay}\n selectAction={selectAction}\n toggleSidebarAction={toggleSidebarAction}\n toggleThemeAction={toggleThemeAction}\n />\n </main>\n );\n}\n","import type { SafeHtml } from 'kerfjs';\n\nimport { filterDataAttributes } from '../../extension-attributes.js';\nimport { ListHeader } from '../../list-header.js';\nimport type { KerfUiContent } from '../../semantic-content.js';\n\n/** How a specimen aligns its visible edge with its `ListHeader` label. */\nexport type CatalogExampleAlign = 'glyph' | 'inline-control' | 'none';\n\nconst protectedAttributes = new Set([\n 'data-catalog-example',\n 'data-catalog-example-stack',\n 'data-catalog-example-label',\n 'data-catalog-example-note',\n 'data-align',\n]);\n\ntype CatalogExampleRootAttributes = Readonly<\n Record<`data-${string}`, string | undefined> & {\n 'data-catalog-example'?: never;\n 'data-catalog-example-stack'?: never;\n 'data-catalog-example-label'?: never;\n 'data-catalog-example-note'?: never;\n 'data-align'?: never;\n }\n>;\n\nexport interface CatalogExampleProps {\n label?: string;\n note?: SafeHtml | string;\n align?: CatalogExampleAlign;\n rootAttributes?: CatalogExampleRootAttributes;\n className?: string;\n children?: KerfUiContent;\n /** Native named-slot assignment when composed inside a web component. */\n slot?: string;\n}\n\n/** A labeled catalog specimen with optional explanatory text and alignment. */\nexport function CatalogExample({\n label,\n note,\n align = 'none',\n rootAttributes = {},\n className = '',\n children,\n slot,\n}: CatalogExampleProps) {\n const safeRootAttributes = filterDataAttributes(\n rootAttributes,\n protectedAttributes,\n );\n\n return (\n <section\n {...safeRootAttributes}\n class={`kui-catalog-example ${className}`.trim()}\n data-catalog-example\n data-align={align}\n slot={slot}\n >\n {label !== undefined ? (\n <ListHeader\n label={label}\n width=\"content\"\n rootAttributes={{ 'data-catalog-example-label': '' }}\n />\n ) : null}\n {note !== undefined ? (\n <p class=\"kui-catalog-example__note\" data-catalog-example-note>\n {note}\n </p>\n ) : null}\n {children}\n </section>\n );\n}\n","import { filterDataAttributes } from '../../extension-attributes.js';\nimport type { KerfUiContent } from '../../semantic-content.js';\n\nconst protectedAttributes = new Set([\n 'data-catalog-example',\n 'data-catalog-example-stack',\n 'data-catalog-example-label',\n 'data-catalog-example-note',\n 'data-align',\n]);\n\ntype CatalogExampleStackRootAttributes = Readonly<\n Record<`data-${string}`, string | undefined> & {\n 'data-catalog-example'?: never;\n 'data-catalog-example-stack'?: never;\n 'data-catalog-example-label'?: never;\n 'data-catalog-example-note'?: never;\n 'data-align'?: never;\n }\n>;\n\nexport interface CatalogExampleStackProps {\n label?: string;\n rootAttributes?: CatalogExampleStackRootAttributes;\n className?: string;\n children?: KerfUiContent;\n /** Native named-slot assignment when composed inside a web component. */\n slot?: string;\n}\n\n/** A vertically stacked group of catalog examples. */\nexport function CatalogExampleStack({\n label,\n rootAttributes = {},\n className = '',\n children,\n slot,\n}: CatalogExampleStackProps) {\n const safeRootAttributes = filterDataAttributes(\n rootAttributes,\n protectedAttributes,\n );\n\n return (\n <section\n {...safeRootAttributes}\n class={`kui-catalog-example-stack ${className}`.trim()}\n data-catalog-example-stack\n aria-label={label}\n slot={slot}\n >\n {children}\n </section>\n );\n}\n"]}
1
+ {"version":3,"sources":["../src/catalog/components/catalog-resource-footer.tsx","../src/catalog/components/catalog-stage.tsx","../src/catalog/components/catalog-detail.tsx","../src/catalog/components/catalog-secondary-sections.tsx","../src/catalog/components/catalog-section-list.tsx","../src/catalog/components/catalog-sidebar.tsx","../src/catalog/components/catalog.tsx","../src/catalog/components/catalog-example.tsx","../src/catalog/components/catalog-example-stack.tsx"],"names":["jsx","jsxs","Fragment","protectedAttributes"],"mappings":";;;;;;;;;;;;;;;;;;;AAqBA,SAAS,gBAAA,CACP,SACA,YAAA,EACY;AACZ,EAAA,MAAM,SAAmB,EAAC;AAC1B,EAAA,KAAA,MAAW,KAAA,IAAS,OAAA;AAClB,IAAA,IAAI,CAAC,OAAO,QAAA,CAAS,KAAA,CAAM,KAAK,CAAA,EAAG,MAAA,CAAO,IAAA,CAAK,KAAA,CAAM,KAAK,CAAA;AAE5D,EAAA,MAAM,QAAoB,EAAC;AAC3B,EAAA,MAAA,CAAO,OAAA,CAAQ,CAAC,KAAA,EAAO,KAAA,KAAU;AAC/B,IAAA,IAAI,QAAQ,CAAA,EAAG,KAAA,CAAM,IAAA,iBAAK,GAAA,CAAC,gBAAW,CAAa,CAAA;AACnD,IAAA,KAAA,CAAM,qBAAK,GAAA,CAAC,OAAA,EAAA,EAAM,KAAA,EAAM,8BAAA,EAAgC,iBAAM,CAAQ,CAAA;AACtE,IAAA,KAAA,MAAW,SAAS,OAAA,EAAS;AAC3B,MAAA,IAAI,MAAM,KAAA,KAAU,KAAA;AAClB,QAAA,KAAA,CAAM,IAAA;AAAA,0BACJ,GAAA,CAAC,sBAAiB,aAAA,EAAa,YAAA,EAAc,gBAAc,KAAA,CAAM,EAAA,EAC9D,gBAAM,IAAA,EACT;AAAA,SACF;AAAA,IACJ;AAAA,EACF,CAAC,CAAA;AACD,EAAA,OAAO,KAAA;AACT;AAGO,SAAS,qBAAA,CAAsB;AAAA,EACpC,IAAA;AAAA,EACA,MAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA;AAAA,EACA,MAAA;AAAA,EACA;AACF,CAAA,EAA+B;AAC7B,EAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAI,KAAA,EAAM,qBAAA,EACR,QAAA,EAAA;AAAA,IAAA,MAAA,mBAAS,GAAA,CAAC,KAAA,EAAA,EAAI,KAAA,EAAM,qBAAA,EAAuB,kBAAO,CAAA,GAAS,IAAA;AAAA,oBAC5D,GAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACC,KAAA,EAAO,GAAG,IAAI,CAAA,UAAA,CAAA;AAAA,QACd,YAAA,EAAa,EAAA;AAAA,QACb,UAAA,EAAW,OAAA;AAAA,QACX,YAAA,EAAa,QAAA;AAAA,QACb,OAAA,EACE,SAAA,CAAU,MAAA,GAAS,CAAA,mBACjB,GAAA;AAAA,UAAC,mBAAA;AAAA,UAAA;AAAA,YACC,KAAA,EAAO,GAAG,IAAI,CAAA,UAAA,CAAA;AAAA,YACd,OAAA,EAAQ,OAAA;AAAA,YACR,IAAA,EAAK,SAAA;AAAA,YACL,QAAA,EAAS,QAAA;AAAA,YAER,QAAA,EAAA,SAAA,CAAU,GAAA,CAAI,CAAC,QAAA,qBACd,GAAA;AAAA,cAAC,iBAAA;AAAA,cAAA;AAAA,gBACC,MAAM,QAAA,CAAS,IAAA;AAAA,gBACf,OAAO,QAAA,CAAS,KAAA;AAAA,gBAChB,QAAQ,QAAA,CAAS,MAAA;AAAA,gBACjB,SAAA,EAAW,CAAA,EAAG,IAAI,CAAA,EAAA,EAAK,SAAS,KAAK,CAAA,mBAAA,CAAA;AAAA,gBACrC,QAAA,EAAQ,IAAA;AAAA,gBACR,sBAAM,GAAA,CAAC,UAAA,EAAA,EAAW,IAAA,EAAM,YAAA,EAAc,MAAK,eAAA,EAAgB;AAAA;AAAA,aAE9D;AAAA;AAAA,SACH,GACE,IAAA;AAAA,QAEN,QAAA,EACE,OAAA,CAAQ,MAAA,GAAS,CAAA,mBACf,GAAA;AAAA,UAAC,mBAAA;AAAA,UAAA;AAAA,YACC,MAAA,EAAM,IAAA;AAAA,YACN,OAAA,EAAQ,OAAA;AAAA,YACR,cAAA,EAAc,IAAA;AAAA,YACd,SAAA,EAAU,SAAA;AAAA,YACV,IAAA,EAAK,SAAA;AAAA,YACL,KAAA,EAAM,iBAAA;AAAA,YAEN,QAAA,kBAAA,IAAA;AAAA,cAAC,aAAA;AAAA,cAAA;AAAA,gBACC,SAAA,EAAU,SAAA;AAAA,gBACV,UAAA,EAAU,uBAAuB,MAAM,CAAA,CAAA;AAAA,gBACvC,sBAAA,EAAoB,IAAA;AAAA,gBACpB,0BAAA,EAAwB,IAAA;AAAA,gBAExB,QAAA,EAAA;AAAA,kCAAA,IAAA,CAAC,eAAU,IAAA,EAAK,SAAA,EAAU,UAAA,EAAW,OAAA,EAAQ,cAAU,IAAA,EACrD,QAAA,EAAA;AAAA,oCAAA,GAAA,CAAC,UAAA,EAAA,EAAW,IAAA,EAAM,SAAA,EAAW,IAAA,EAAK,WAAA,EAAY,CAAA;AAAA,oCAC9C,GAAA,CAAC,UAAK,QAAA,EAAA,YAAA,EAAU;AAAA,mBAAA,EAClB,CAAA;AAAA,kBACC,gBAAA,CAAiB,SAAS,YAAY;AAAA;AAAA;AAAA;AACzC;AAAA,SACF,GACE;AAAA;AAAA;AAER,GAAA,EACF,CAAA;AAEJ;AC3GA,IAAM,mBAAA,mBAAsB,IAAI,GAAA,CAAI,CAAC,oBAAoB,CAAC,CAAA;AAUnD,SAAS,YAAA,CAAa;AAAA,EAC3B,IAAA;AAAA,EACA,OAAA;AAAA,EACA,eAAA;AAAA,EACA,iBAAiB;AACnB,CAAA,EAAsB;AACpB,EAAA,MAAM,kBAAA,GAAqB,oBAAA;AAAA,IACzB,cAAA;AAAA,IACA;AAAA,GACF;AACA,EAAA,uBACEA,GAAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACE,GAAG,kBAAA;AAAA,MACJ,KAAA,EAAM,oBAAA;AAAA,MACN,oBAAA,EAAkB,IAAA;AAAA,MAClB,YAAA,EAAY,GAAG,IAAI,CAAA,QAAA,CAAA;AAAA,MAEnB,QAAA,kBAAAC,IAAAA,CAAC,KAAA,EAAA,EAAI,KAAA,EAAM,qBAAA,EACR,QAAA,EAAA;AAAA,QAAA,OAAA;AAAA,QACA,eAAA,KAAoB,yBACnBD,GAAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,KAAA,EAAM,+BAAA;AAAA,YACN,+BAAA,EAA6B,IAAA;AAAA,YAC7B,0BAAA,EAAwB,IAAA;AAAA,YACxB,aAAA,EAAY;AAAA;AAAA,SACd,GACE;AAAA,OAAA,EACN;AAAA;AAAA,GACF;AAEJ;ACfO,SAAS,aAAA,CAAc;AAAA,EAC5B,UAAA;AAAA,EACA,MAAA;AAAA,EACA,QAAA;AAAA,EACA,OAAA;AAAA,EACA,SAAA;AAAA,EACA,KAAA;AAAA,EACA,aAAA;AAAA,EACA,MAAA;AAAA,EACA,eAAA;AAAA,EACA,mBAAA;AAAA,EACA,YAAA;AAAA,EACA,mBAAA;AAAA,EACA;AACF,CAAA,EAAuB;AACrB,EAAA,MAAM,IAAA,GAAO,UAAU,IAAA,IAAQ,EAAA;AAC/B,EAAA,MAAM,SAAA,GAAY,KAAA,KAAU,MAAA,GAAS,OAAA,GAAU,MAAA;AAE/C,EAAA,uBACEA,GAAAA,CAAC,SAAA,EAAA,EAAQ,KAAA,EAAM,uBACb,QAAA,kBAAAA,GAAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,gBAAA,EAAiB,6BAAA;AAAA,MACjB,MAAA,kBACEC,IAAAA,CAAC,KAAA,EAAA,EAAI,OAAM,qBAAA,EACT,QAAA,EAAA;AAAA,wBAAAD,GAAAA;AAAA,UAAC,OAAA;AAAA,UAAA;AAAA,YACC,KAAA,EAAO,GAAG,IAAI,CAAA,OAAA,CAAA;AAAA,YACd,YAAA,EAAa,EAAA;AAAA,YACb,OAAA,kBACEC,IAAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,cAAA,SAAA,mBACCD,GAAAA,CAAC,mBAAA,EAAA,EAAoB,YAAW,YAAA,EAAa,MAAA,EAAM,MACjD,QAAA,kBAAAA,GAAAA;AAAA,gBAAC,QAAA;AAAA,gBAAA;AAAA,kBACC,IAAA,EAAK,QAAA;AAAA,kBACL,aAAA,EAAa,mBAAA;AAAA,kBACb,YAAA,EAAY,UAAU,UAAU,CAAA,QAAA,CAAA;AAAA,kBAEhC,QAAA,kBAAAA,GAAAA;AAAA,oBAAC,UAAA;AAAA,oBAAA;AAAA,sBACC,IAAA,EAAM,aAAA;AAAA,sBACN,IAAA,EAAK;AAAA;AAAA;AACP;AAAA,iBAEJ,CAAA,GACE,IAAA;AAAA,8BACJA,IAAC,WAAA,EAAA,EAAY,IAAA,EAAM,MAAM,IAAA,EAAK,QAAA,EAAS,cAAc,CAAA,EAAG;AAAA,aAAA,EAC1D,CAAA;AAAA,YAEF,QAAA,kBACEC,IAAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,cAAA,aAAA;AAAA,cACA,wBACCD,GAAAA;AAAA,gBAAC,mBAAA;AAAA,gBAAA;AAAA,kBACC,UAAA,EAAW,YAAA;AAAA,kBACX,OAAA,EAAQ,OAAA;AAAA,kBACR,IAAA,EAAK,SAAA;AAAA,kBACL,KAAA,EAAM,iBAAA;AAAA,kBAEN,QAAA,kBAAAC,IAAAA;AAAA,oBAAC,QAAA;AAAA,oBAAA;AAAA,sBACC,IAAA,EAAK,QAAA;AAAA,sBACL,aAAA,EAAa,iBAAA;AAAA,sBACb,YAAA,EAAY,OAAO,SAAS,CAAA,MAAA,CAAA;AAAA,sBAC5B,oBAAA,EAAoB,KAAA;AAAA,sBAEnB,QAAA,EAAA;AAAA,wBAAA,SAAA,KAAc,MAAA,mBACbD,GAAAA,CAAC,UAAA,EAAA,EAAW,MAAM,IAAA,EAAM,IAAA,EAAK,MAAA,EAAO,CAAA,mBAEpCA,GAAAA,CAAC,UAAA,EAAA,EAAW,IAAA,EAAM,GAAA,EAAK,MAAK,KAAA,EAAM,CAAA;AAAA,wCAEpCA,GAAAA,CAAC,MAAA,EAAA,EAAM,QAAA,EAAA,SAAA,KAAc,MAAA,GAAS,SAAS,OAAA,EAAQ;AAAA;AAAA;AAAA;AACjD;AAAA,eACF,GACE;AAAA,aAAA,EACN;AAAA;AAAA,SAEJ;AAAA,QACC,QAAA,EAAU,8BACTA,GAAAA,CAAC,OAAE,KAAA,EAAM,2CAAA,EACN,QAAA,EAAA,QAAA,CAAS,WAAA,EACZ,CAAA,GACE;AAAA,OAAA,EACN,CAAA;AAAA,MAEF,wBACEA,GAAAA;AAAA,QAAC,qBAAA;AAAA,QAAA;AAAA,UACC,IAAA;AAAA,UACA,MAAA;AAAA,UACA,SAAA,EAAW,QAAA,EAAU,SAAA,IAAa,EAAC;AAAA,UACnC,OAAA,EAAS,QAAA,EAAU,OAAA,IAAW,EAAC;AAAA,UAC/B,MAAA;AAAA,UACA;AAAA;AAAA,OACF;AAAA,MAGF,QAAA,kBAAAA,GAAAA;AAAA,QAAC,YAAA;AAAA,QAAA;AAAA,UACC,IAAA;AAAA,UACA,OAAA;AAAA,UACA,eAAA;AAAA,UACA,cAAA,EAAgB;AAAA;AAAA;AAClB;AAAA,GACF,EACF,CAAA;AAEJ;ACrHO,SAAS,wBAAA,CAAyB;AAAA,EACvC,KAAA;AAAA,EACA,MAAA;AAAA,EACA,YAAA;AAAA,EACA;AACF,CAAA,EAAkC;AAChC,EAAA,uBACEC,IAAAA,CAAC,SAAA,EAAA,EAAQ,KAAA,EAAM,+BAAA,EACZ,QAAA,EAAA;AAAA,IAAA,KAAA,CAAM,8BACLD,GAAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,OAAO,KAAA,CAAM,KAAA;AAAA,QACb,MAAA,EAAM,IAAA;AAAA,QACN,QAAA,EAAU,OAAA,CAAQ,KAAA,CAAM,QAAQ,CAAA;AAAA,QAChC,MAAA,EAAQ;AAAA;AAAA,wBAGVA,GAAAA,CAAC,UAAA,EAAA,EAAW,KAAA,EAAO,MAAM,KAAA,EAAO,CAAA;AAAA,IAEjC,CAAC,MAAM,WAAA,IAAe,KAAA,CAAM,2BAC3BA,GAAAA,CAAC,SAAI,KAAA,EAAM,wBAAA,EAAyB,0BAAsB,IAAA,EACvD,QAAA,EAAA,KAAA,CAAM,SAAS,GAAA,CAAI,CAAC,4BACnBC,IAAAA,CAAC,SAAA,EAAA,EAAQ,KAAA,EAAM,8BAAA,EACb,QAAA,EAAA;AAAA,sBAAAD,GAAAA,CAAC,IAAA,EAAA,EAAG,KAAA,EAAM,gCAAA,EAAkC,kBAAQ,QAAA,EAAS,CAAA;AAAA,sBAC7DA,GAAAA,CAAC,KAAA,EAAA,EAAI,KAAA,EAAM,gCACT,QAAA,kBAAAA,GAAAA,CAAC,IAAA,EAAA,EAAK,GAAA,EAAI,OACP,QAAA,EAAA,OAAA,CAAQ,OAAA,CAAQ,GAAA,CAAI,CAAC,0BACpBA,GAAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UACC,MAAA,EAAQ,YAAA;AAAA,UACR,QAAQ,KAAA,CAAM,EAAA;AAAA,UACd,OAAO,KAAA,CAAM,IAAA;AAAA,UACb,MAAA,EAAQ,KAAA,CAAM,IAAA,EAAM,IAAA,CAAK,QAAK,CAAA;AAAA,UAC9B,QAAA,EAAU,WAAW,KAAA,CAAM,EAAA;AAAA,UAC3B,OAAO,KAAA,CAAM,WAAA;AAAA,UACb,SAAA,EAAS;AAAA;AAAA,OAEZ,GACH,CAAA,EACF;AAAA,KAAA,EACF,CACD,GACH,CAAA,GACE;AAAA,GAAA,EACN,CAAA;AAEJ;AC7CO,SAAS,kBAAA,CAAmB;AAAA,EACjC,QAAA;AAAA,EACA,MAAA;AAAA,EACA;AACF,CAAA,EAA4B;AAC1B,EAAA,uBACEA,GAAAA,CAAC,KAAA,EAAA,EAAI,KAAA,EAAM,uBAAA,EACR,QAAA,EAAA,QAAA,CAAS,GAAA,CAAI,CAAC,OAAA,qBACbC,IAAAA,CAAC,SAAA,EAAA,EAAQ,OAAM,oBAAA,EACb,QAAA,EAAA;AAAA,oBAAAD,GAAAA,CAAC,UAAA,EAAA,EAAW,KAAA,EAAO,OAAA,CAAQ,QAAA,EAAU,CAAA;AAAA,oBACrCA,GAAAA,CAAC,KAAA,EAAA,EAAI,KAAA,EAAM,sBACT,QAAA,kBAAAA,GAAAA,CAAC,IAAA,EAAA,EAAK,GAAA,EAAI,OACP,QAAA,EAAA,OAAA,CAAQ,OAAA,CAAQ,GAAA,CAAI,CAAC,0BACpBA,GAAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,MAAA,EAAQ,YAAA;AAAA,QACR,QAAQ,KAAA,CAAM,EAAA;AAAA,QACd,OAAO,KAAA,CAAM,IAAA;AAAA,QACb,MAAA,EAAQ,KAAA,CAAM,IAAA,EAAM,IAAA,CAAK,QAAK,CAAA;AAAA,QAC9B,QAAA,EAAU,WAAW,KAAA,CAAM,EAAA;AAAA,QAC3B,OAAO,KAAA,CAAM,WAAA;AAAA,QACb,SAAA,EAAS;AAAA;AAAA,KAEZ,GACH,CAAA,EACF;AAAA,GAAA,EACF,CACD,CAAA,EACH,CAAA;AAEJ;ACbO,SAAS,cAAA,CAAe;AAAA,EAC7B,KAAA;AAAA,EACA,QAAA;AAAA,EACA,MAAA;AAAA,EACA,SAAA;AAAA,EACA,iBAAA;AAAA,EACA,MAAA;AAAA,EACA,YAAA;AAAA,EACA,mBAAA;AAAA,EACA;AACF,CAAA,EAAwB;AACtB,EAAA,uBACEA,GAAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAM,sBAAA;AAAA,MACN,YAAA,EAAY,CAAA,EAAG,KAAA,CAAM,KAAK,CAAA,QAAA,CAAA;AAAA,MAC1B,gBAAA,EAAgB,OAAO,SAAS,CAAA;AAAA,MAEhC,QAAA,kBAAAA,GAAAA;AAAA,QAAC,IAAA;AAAA,QAAA;AAAA,UACC,MAAA,kBACEC,IAAAA,CAAC,KAAA,EAAA,EAAI,OAAM,oBAAA,EACT,QAAA,EAAA;AAAA,4BAAAD,GAAAA;AAAA,cAAC,OAAA;AAAA,cAAA;AAAA,gBACC,KAAA,EAAO,CAAA,EAAG,KAAA,CAAM,KAAK,CAAA,eAAA,CAAA;AAAA,gBACrB,YAAA,EAAa,EAAA;AAAA,gBACb,OAAA,kBACEC,IAAAA,CAAAC,QAAAA,EAAA,EACG,QAAA,EAAA;AAAA,kBAAA,KAAA,CAAM,OAAA,mBACLF,GAAAA,CAAC,mBAAA,EAAA,EAAoB,YAAW,YAAA,EAAa,MAAA,EAAM,MACjD,QAAA,kBAAAA,GAAAA;AAAA,oBAAC,KAAA;AAAA,oBAAA;AAAA,sBACC,KAAA,EAAM,mBAAA;AAAA,sBACN,KAAK,KAAA,CAAM,OAAA;AAAA,sBACX,GAAA,EAAI;AAAA;AAAA,qBAER,CAAA,GACE,IAAA;AAAA,kCACJA,GAAAA;AAAA,oBAAC,WAAA;AAAA,oBAAA;AAAA,sBACC,MAAM,KAAA,CAAM,KAAA;AAAA,sBACZ,IAAA,EAAK,OAAA;AAAA,sBACL,YAAA,EAAc;AAAA;AAAA;AAChB,iBAAA,EACF,CAAA;AAAA,gBAEF,QAAA,kBACEA,GAAAA,CAAC,mBAAA,EAAA,EAAoB,YAAW,YAAA,EAAa,MAAA,EAAM,MACjD,QAAA,kBAAAA,GAAAA;AAAA,kBAAC,QAAA;AAAA,kBAAA;AAAA,oBACC,IAAA,EAAK,QAAA;AAAA,oBACL,aAAA,EAAa,mBAAA;AAAA,oBACb,YAAA,EAAY,CAAA,SAAA,EAAY,KAAA,CAAM,KAAK,CAAA,QAAA,CAAA;AAAA,oBAEnC,0BAAAA,GAAAA,CAAC,UAAA,EAAA,EAAW,IAAA,EAAM,cAAA,EAAgB,MAAK,kBAAA,EAAmB;AAAA;AAAA,iBAC5D,EACF;AAAA;AAAA,aAEJ;AAAA,YACC,KAAA,CAAM,2BACLA,GAAAA,CAAC,OAAE,KAAA,EAAM,uBAAA,EAAyB,QAAA,EAAA,KAAA,CAAM,QAAA,EAAS,CAAA,GAC/C;AAAA,WAAA,EACN,CAAA;AAAA,UAGF,QAAA,kBAAAC,IAAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,KAAA,EAAM,yBAAA;AAAA,cACN,YAAA,EAAY,CAAA,EAAG,KAAA,CAAM,KAAK,CAAA,WAAA,CAAA;AAAA,cAE1B,QAAA,EAAA;AAAA,gCAAAD,GAAAA;AAAA,kBAAC,kBAAA;AAAA,kBAAA;AAAA,oBACC,QAAA;AAAA,oBACA,MAAA;AAAA,oBACA;AAAA;AAAA,iBACF;AAAA,gBACC,oCACCA,GAAAA;AAAA,kBAAC,wBAAA;AAAA,kBAAA;AAAA,oBACC,KAAA,EAAO,iBAAA;AAAA,oBACP,MAAA;AAAA,oBACA,YAAA;AAAA,oBACA,YAAA,EAAc;AAAA;AAAA,iBAChB,GACE,IAAA;AAAA,gBACH;AAAA;AAAA;AAAA;AACH;AAAA;AACF;AAAA,GACF;AAEJ;ACzGA,SAAS,SAAA,CACP,UACA,EAAA,EAC0B;AAC1B,EAAA,KAAA,MAAW,WAAW,QAAA,EAAU;AAC9B,IAAA,KAAA,MAAW,SAAS,OAAA,CAAQ,OAAA,MAAa,KAAA,CAAM,EAAA,KAAO,IAAI,OAAO,KAAA;AAAA,EACnE;AACA,EAAA,OAAO,MAAA;AACT;AAGO,SAAS,OAAA,CAAQ;AAAA,EACtB,KAAA;AAAA,EACA,QAAA;AAAA,EACA,MAAA;AAAA,EACA,OAAA;AAAA,EACA,SAAA,GAAY,KAAA;AAAA,EACZ,KAAA;AAAA,EACA,aAAA;AAAA,EACA,iBAAA;AAAA,EACA,aAAA;AAAA,EACA,MAAA;AAAA,EACA,eAAA;AAAA,EACA,mBAAA;AAAA,EACA,YAAA,GAAe,gBAAA;AAAA,EACf,mBAAA,GAAsB,wBAAA;AAAA,EACtB,iBAAA,GAAoB,sBAAA;AAAA,EACpB,qBAAA,GAAwB,0BAAA;AAAA,EACxB,SAAA,GAAY,EAAA;AAAA,EACZ;AACF,CAAA,EAAiB;AACf,EAAA,MAAM,QAAA,GACJ,SAAA,CAAU,QAAA,EAAU,MAAM,CAAA,KACzB,oBACG,SAAA,CAAU,iBAAA,CAAkB,QAAA,EAAU,MAAM,CAAA,GAC5C,MAAA,CAAA;AAEN,EAAA,uBACEC,IAAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAO,CAAA,YAAA,EAAe,SAAS,CAAA,CAAA,CAAG,IAAA,EAAK;AAAA,MACvC,gBAAA,EAAe,SAAA;AAAA,MACf,wBAAA,EAAwB,OAAO,SAAS,CAAA;AAAA,MACxC,uBAAA,EACE,eAAA,KAAoB,MAAA,GAAY,MAAA,GAAY,OAAO,eAAe,CAAA;AAAA,MAEpE,IAAA;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAAD,GAAAA;AAAA,UAAC,cAAA;AAAA,UAAA;AAAA,YACC,KAAA;AAAA,YACA,QAAA;AAAA,YACA,MAAA;AAAA,YACA,SAAA;AAAA,YACA,iBAAA;AAAA,YACA,MAAA,EAAQ,aAAA;AAAA,YACR,YAAA;AAAA,YACA,mBAAA;AAAA,YACA;AAAA;AAAA,SACF;AAAA,wBACAA,GAAAA;AAAA,UAAC,aAAA;AAAA,UAAA;AAAA,YACC,YAAY,KAAA,CAAM,KAAA;AAAA,YAClB,MAAA;AAAA,YACA,QAAA;AAAA,YACA,OAAA;AAAA,YACA,SAAA;AAAA,YACA,KAAA;AAAA,YACA,aAAA;AAAA,YACA,MAAA;AAAA,YACA,eAAA;AAAA,YACA,mBAAA;AAAA,YACA,YAAA;AAAA,YACA,mBAAA;AAAA,YACA;AAAA;AAAA;AACF;AAAA;AAAA,GACF;AAEJ;AClDA,IAAMG,oBAAAA,uBAA0B,GAAA,CAAI;AAAA,EAClC,sBAAA;AAAA,EACA,4BAAA;AAAA,EACA,4BAAA;AAAA,EACA,2BAAA;AAAA,EACA;AACF,CAAC,CAAA;AA4BM,SAAS,cAAA,CAAe;AAAA,EAC7B,KAAA;AAAA,EACA,IAAA;AAAA,EACA,KAAA,GAAQ,MAAA;AAAA,EACR,QAAA;AAAA,EACA,eAAA;AAAA,EACA,iBAAiB,EAAC;AAAA,EAClB,SAAA,GAAY,EAAA;AAAA,EACZ,QAAA;AAAA,EACA;AACF,CAAA,EAAwB;AACtB,EAAA,MAAM,kBAAA,GAAqB,oBAAA;AAAA,IACzB,cAAA;AAAA,IACAA;AAAA,GACF;AACA,EAAA,MAAM,aAAA,GAAgB,UAAU,MAAA,GAC5B,MAAA,CAAO,QAAQ,QAAA,CAAS,MAAM,CAAA,CAC3B,GAAA,CAAI,CAAC,CAAC,MAAM,KAAK,CAAA,KAAM,GAAG,IAAI,CAAA,CAAA,EAAI,KAAK,CAAA,CAAE,CAAA,CACzC,IAAA,CAAK,GAAG,CAAA,GACX,MAAA;AACJ,EAAA,MAAM,QAAA,GAAW,2BACfH,GAAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAM,+BAAA;AAAA,MACN,+BAAA,EAA6B,IAAA;AAAA,MAC7B,eAAa,QAAA,CAAS,MAAA;AAAA,MACtB,cAAY,QAAA,CAAS,KAAA;AAAA,MACrB,eAAa,QAAA,CAAS,MAAA;AAAA,MACtB,mBAAiB,QAAA,CAAS,SAAA;AAAA,MAC1B,cAAY,QAAA,CAAS,KAAA;AAAA,MACrB,gBAAc,QAAA,CAAS,OAAA;AAAA,MACvB,iBAAe,QAAA,CAAS,QAAA;AAAA,MACxB,mBAAiB,QAAA,CAAS,UAAA;AAAA,MAC1B,aAAA,EAAa,QAAA,CAAS,MAAA,GAAS,MAAA,GAAS,MAAA;AAAA,MACxC,KAAA,EAAO,aAAA;AAAA,MAEN;AAAA;AAAA,GACH,GAEA,QAAA;AAGF,EAAA,uBACEC,IAAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACE,GAAG,kBAAA;AAAA,MACJ,KAAA,EAAO,CAAA,oBAAA,EAAuB,SAAS,CAAA,CAAA,CAAG,IAAA,EAAK;AAAA,MAC/C,sBAAA,EAAoB,IAAA;AAAA,MACpB,YAAA,EAAY,KAAA;AAAA,MACZ,IAAA;AAAA,MAEC,QAAA,EAAA;AAAA,QAAA,KAAA,KAAU,yBACTD,GAAAA;AAAA,UAAC,UAAA;AAAA,UAAA;AAAA,YACC,KAAA;AAAA,YACA,KAAA,EAAM,SAAA;AAAA,YACN,cAAA,EAAgB,EAAE,4BAAA,EAA8B,EAAA;AAAG;AAAA,SACrD,GACE,IAAA;AAAA,QACH,IAAA,KAAS,MAAA,mBACRA,GAAAA,CAAC,GAAA,EAAA,EAAE,OAAM,2BAAA,EAA4B,2BAAA,EAAyB,IAAA,EAC3D,QAAA,EAAA,IAAA,EACH,CAAA,GACE,IAAA;AAAA,QACH,eAAA,KAAoB,yBACnBA,GAAAA,CAAC,OAAE,KAAA,EAAM,uCAAA,EAAyC,2BAAgB,CAAA,GAChE,IAAA;AAAA,QACH;AAAA;AAAA;AAAA,GACH;AAEJ;AC/HA,IAAMG,oBAAAA,uBAA0B,GAAA,CAAI;AAAA,EAClC,sBAAA;AAAA,EACA,4BAAA;AAAA,EACA,4BAAA;AAAA,EACA,2BAAA;AAAA,EACA;AACF,CAAC,CAAA;AAsBM,SAAS,mBAAA,CAAoB;AAAA,EAClC,KAAA;AAAA,EACA,iBAAiB,EAAC;AAAA,EAClB,SAAA,GAAY,EAAA;AAAA,EACZ,QAAA;AAAA,EACA;AACF,CAAA,EAA6B;AAC3B,EAAA,MAAM,kBAAA,GAAqB,oBAAA;AAAA,IACzB,cAAA;AAAA,IACAA;AAAA,GACF;AAEA,EAAA,uBACEH,GAAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACE,GAAG,kBAAA;AAAA,MACJ,KAAA,EAAO,CAAA,0BAAA,EAA6B,SAAS,CAAA,CAAA,CAAG,IAAA,EAAK;AAAA,MACrD,4BAAA,EAA0B,IAAA;AAAA,MAC1B,YAAA,EAAY,KAAA;AAAA,MACZ,IAAA;AAAA,MAEC;AAAA;AAAA,GACH;AAEJ","file":"catalog.js","sourcesContent":["import type { SafeHtml } from 'kerfjs';\nimport { ExternalLink, Waypoints } from 'lucide';\n\nimport { LucideIcon } from '../../lucide-icon.js';\nimport type { KerfUiContent } from '../../semantic-content.js';\nimport { Toolbar } from '../../toolbar.js';\nimport {\n ToolbarActionLink,\n ToolbarControlGroup,\n} from '../../toolbar-control-group.js';\nimport type { CatalogRelated, CatalogResource } from '../types.js';\n\ninterface CatalogResourceFooterProps {\n name: string;\n active: string;\n resources: readonly CatalogResource[];\n related: readonly CatalogRelated[];\n status?: KerfUiContent;\n selectAction: string;\n}\n\nfunction relatedMenuItems(\n related: readonly CatalogRelated[],\n selectAction: string,\n): SafeHtml[] {\n const groups: string[] = [];\n for (const entry of related)\n if (!groups.includes(entry.group)) groups.push(entry.group);\n\n const nodes: SafeHtml[] = [];\n groups.forEach((group, index) => {\n if (index > 0) nodes.push(<wa-divider></wa-divider>);\n nodes.push(<small class=\"kui-catalog__related-heading\">{group}</small>);\n for (const entry of related) {\n if (entry.group === group)\n nodes.push(\n <wa-dropdown-item data-action={selectAction} data-item-id={entry.id}>\n {entry.name}\n </wa-dropdown-item>,\n );\n }\n });\n return nodes;\n}\n\n/** Status, resources, and related-entry navigation for the active specimen. */\nexport function CatalogResourceFooter({\n name,\n active,\n resources,\n related,\n status,\n selectAction,\n}: CatalogResourceFooterProps) {\n return (\n <div class=\"kui-catalog__footer\">\n {status ? <div class=\"kui-catalog__status\">{status}</div> : null}\n <Toolbar\n label={`${name} resources`}\n dividerSides=\"\"\n responsive=\"stack\"\n responsiveAt=\"narrow\"\n leading={\n resources.length > 0 ? (\n <ToolbarControlGroup\n label={`${name} resources`}\n content=\"mixed\"\n size=\"compact\"\n overflow=\"scroll\"\n >\n {resources.map((resource) => (\n <ToolbarActionLink\n href={resource.href}\n label={resource.label}\n detail={resource.detail}\n ariaLabel={`${name}: ${resource.label} (opens in new tab)`}\n external\n icon={<LucideIcon icon={ExternalLink} name=\"external-link\" />}\n />\n ))}\n </ToolbarControlGroup>\n ) : null\n }\n trailing={\n related.length > 0 ? (\n <ToolbarControlGroup\n single\n content=\"mixed\"\n nestedDropdown\n menuInset=\"compact\"\n size=\"compact\"\n label=\"Related entries\"\n >\n <wa-dropdown\n placement=\"top-end\"\n data-key={`kui-catalog-related-${active}`}\n data-catalog-related\n data-morph-skip-children\n >\n <wa-button slot=\"trigger\" appearance=\"plain\" with-caret>\n <LucideIcon icon={Waypoints} name=\"waypoints\" />\n <span>Components</span>\n </wa-button>\n {relatedMenuItems(related, selectAction)}\n </wa-dropdown>\n </ToolbarControlGroup>\n ) : null\n }\n />\n </div>\n );\n}\n","import { filterDataAttributes } from '../../extension-attributes.js';\nimport type { KerfUiContent } from '../../semantic-content.js';\nimport type { CatalogStageRootAttributes } from '../types.js';\n\nconst protectedAttributes = new Set(['data-catalog-stage']);\n\ninterface CatalogStageProps {\n name: string;\n content: KerfUiContent;\n geometryOverlay?: boolean;\n rootAttributes?: CatalogStageRootAttributes;\n}\n\n/** The centered preview canvas and its optional wire-managed geometry overlay. */\nexport function CatalogStage({\n name,\n content,\n geometryOverlay,\n rootAttributes = {},\n}: CatalogStageProps) {\n const safeRootAttributes = filterDataAttributes(\n rootAttributes,\n protectedAttributes,\n );\n return (\n <section\n {...safeRootAttributes}\n class=\"kui-catalog__stage\"\n data-catalog-stage\n aria-label={`${name} preview`}\n >\n <div class=\"kui-catalog__canvas\">\n {content}\n {geometryOverlay !== undefined ? (\n <div\n class=\"kui-catalog__geometry-overlay\"\n data-catalog-geometry-overlay\n data-morph-skip-children\n aria-hidden=\"true\"\n />\n ) : null}\n </div>\n </section>\n );\n}\n","import { Moon, PanelLeftOpen, Sun } from 'lucide';\n\nimport { LucideIcon } from '../../lucide-icon.js';\nimport { Pane } from '../../pane.js';\nimport type { KerfUiContent } from '../../semantic-content.js';\nimport { Toolbar } from '../../toolbar.js';\nimport { ToolbarControlGroup } from '../../toolbar-control-group.js';\nimport { ToolbarText } from '../../toolbar-text.js';\nimport type { CatalogEntry, CatalogStageRootAttributes } from '../types.js';\nimport { CatalogResourceFooter } from './catalog-resource-footer.js';\nimport { CatalogStage } from './catalog-stage.js';\n\ninterface CatalogDetailProps {\n brandTitle: string;\n active: string;\n selected?: CatalogEntry;\n content: KerfUiContent;\n collapsed: boolean;\n theme?: 'light' | 'dark';\n headerActions?: KerfUiContent;\n status?: KerfUiContent;\n geometryOverlay?: boolean;\n stageRootAttributes?: CatalogStageRootAttributes;\n selectAction: string;\n toggleSidebarAction: string;\n toggleThemeAction: string;\n}\n\n/** Active-entry header, preview stage, and resource footer. */\nexport function CatalogDetail({\n brandTitle,\n active,\n selected,\n content,\n collapsed,\n theme,\n headerActions,\n status,\n geometryOverlay,\n stageRootAttributes,\n selectAction,\n toggleSidebarAction,\n toggleThemeAction,\n}: CatalogDetailProps) {\n const name = selected?.name ?? '';\n const nextTheme = theme === 'dark' ? 'light' : 'dark';\n\n return (\n <article class=\"kui-catalog__detail\">\n <Pane\n contentClassName=\"kui-catalog__detail-preview\"\n header={\n <div class=\"kui-catalog__header\">\n <Toolbar\n label={`${name} header`}\n dividerSides=\"\"\n leading={\n <>\n {collapsed ? (\n <ToolbarControlGroup appearance=\"borderless\" single>\n <button\n type=\"button\"\n data-action={toggleSidebarAction}\n aria-label={`Expand ${brandTitle} catalog`}\n >\n <LucideIcon\n icon={PanelLeftOpen}\n name=\"panel-left-open\"\n />\n </button>\n </ToolbarControlGroup>\n ) : null}\n <ToolbarText text={name} size=\"xlarge\" headingLevel={2} />\n </>\n }\n trailing={\n <>\n {headerActions}\n {theme ? (\n <ToolbarControlGroup\n appearance=\"borderless\"\n content=\"mixed\"\n size=\"compact\"\n label=\"Catalog display\"\n >\n <button\n type=\"button\"\n data-action={toggleThemeAction}\n aria-label={`Use ${nextTheme} theme`}\n data-theme-preview={theme}\n >\n {nextTheme === 'dark' ? (\n <LucideIcon icon={Moon} name=\"moon\" />\n ) : (\n <LucideIcon icon={Sun} name=\"sun\" />\n )}\n <span>{nextTheme === 'dark' ? 'Dark' : 'Light'}</span>\n </button>\n </ToolbarControlGroup>\n ) : null}\n </>\n }\n />\n {selected?.description ? (\n <p class=\"kui-catalog__description kui-content-item\">\n {selected.description}\n </p>\n ) : null}\n </div>\n }\n footer={\n <CatalogResourceFooter\n name={name}\n active={active}\n resources={selected?.resources ?? []}\n related={selected?.related ?? []}\n status={status}\n selectAction={selectAction}\n />\n }\n >\n <CatalogStage\n name={name}\n content={content}\n geometryOverlay={geometryOverlay}\n rootAttributes={stageRootAttributes}\n />\n </Pane>\n </article>\n );\n}\n","import { List } from '../../list.js';\nimport { ListHeader } from '../../list-header.js';\nimport { ListItem } from '../../list-item.js';\nimport type { CatalogSecondaryGroup } from '../types.js';\n\ninterface CatalogSecondarySectionsProps {\n group: CatalogSecondaryGroup;\n active: string;\n selectAction: string;\n toggleAction: string;\n}\n\n/** The quieter, optionally collapsible navigation below primary sections. */\nexport function CatalogSecondarySections({\n group,\n active,\n selectAction,\n toggleAction,\n}: CatalogSecondarySectionsProps) {\n return (\n <section class=\"kui-catalog__group--secondary\">\n {group.collapsible ? (\n <ListHeader\n label={group.label}\n toggle\n expanded={Boolean(group.expanded)}\n action={toggleAction}\n />\n ) : (\n <ListHeader label={group.label} />\n )}\n {!group.collapsible || group.expanded ? (\n <div class=\"kui-catalog__secondary\" data-catalog-secondary>\n {group.sections.map((section) => (\n <section class=\"kui-catalog__secondary-group\">\n <h3 class=\"kui-catalog__secondary-heading\">{section.category}</h3>\n <div class=\"kui-catalog__secondary-items\">\n <List gap=\"2xs\">\n {section.entries.map((entry) => (\n <ListItem\n action={selectAction}\n itemId={entry.id}\n label={entry.name}\n status={entry.tags?.join(' · ')}\n selected={active === entry.id}\n title={entry.description}\n multiline\n />\n ))}\n </List>\n </div>\n </section>\n ))}\n </div>\n ) : null}\n </section>\n );\n}\n","import { List } from '../../list.js';\nimport { ListHeader } from '../../list-header.js';\nimport { ListItem } from '../../list-item.js';\nimport type { CatalogSection } from '../types.js';\n\ninterface CatalogSectionListProps {\n sections: readonly CatalogSection[];\n active: string;\n selectAction: string;\n}\n\n/** The primary category sections in the catalog navigation. */\nexport function CatalogSectionList({\n sections,\n active,\n selectAction,\n}: CatalogSectionListProps) {\n return (\n <div class=\"kui-catalog__sections\">\n {sections.map((section) => (\n <section class=\"kui-catalog__group\">\n <ListHeader label={section.category} />\n <div class=\"kui-catalog__items\">\n <List gap=\"2xs\">\n {section.entries.map((entry) => (\n <ListItem\n action={selectAction}\n itemId={entry.id}\n label={entry.name}\n status={entry.tags?.join(' · ')}\n selected={active === entry.id}\n title={entry.description}\n multiline\n />\n ))}\n </List>\n </div>\n </section>\n ))}\n </div>\n );\n}\n","import { PanelLeftClose } from 'lucide';\n\nimport { LucideIcon } from '../../lucide-icon.js';\nimport { Pane } from '../../pane.js';\nimport type { KerfUiContent } from '../../semantic-content.js';\nimport { Toolbar } from '../../toolbar.js';\nimport { ToolbarControlGroup } from '../../toolbar-control-group.js';\nimport { ToolbarText } from '../../toolbar-text.js';\nimport type {\n CatalogBrand,\n CatalogSecondaryGroup,\n CatalogSection,\n} from '../types.js';\nimport { CatalogSecondarySections } from './catalog-secondary-sections.js';\nimport { CatalogSectionList } from './catalog-section-list.js';\n\ninterface CatalogSidebarProps {\n brand: CatalogBrand;\n sections: readonly CatalogSection[];\n active: string;\n collapsed: boolean;\n secondarySections?: CatalogSecondaryGroup;\n footer?: KerfUiContent;\n selectAction: string;\n toggleSidebarAction: string;\n toggleSecondaryAction: string;\n}\n\nexport function CatalogSidebar({\n brand,\n sections,\n active,\n collapsed,\n secondarySections,\n footer,\n selectAction,\n toggleSidebarAction,\n toggleSecondaryAction,\n}: CatalogSidebarProps) {\n return (\n <aside\n class=\"kui-catalog__sidebar\"\n aria-label={`${brand.title} catalog`}\n data-collapsed={String(collapsed)}\n >\n <Pane\n header={\n <div class=\"kui-catalog__brand\">\n <Toolbar\n label={`${brand.title} catalog header`}\n dividerSides=\"\"\n leading={\n <>\n {brand.logoUrl ? (\n <ToolbarControlGroup appearance=\"borderless\" single>\n <img\n class=\"kui-catalog__mark\"\n src={brand.logoUrl}\n alt=\"\"\n />\n </ToolbarControlGroup>\n ) : null}\n <ToolbarText\n text={brand.title}\n size=\"large\"\n headingLevel={1}\n />\n </>\n }\n trailing={\n <ToolbarControlGroup appearance=\"borderless\" single>\n <button\n type=\"button\"\n data-action={toggleSidebarAction}\n aria-label={`Collapse ${brand.title} catalog`}\n >\n <LucideIcon icon={PanelLeftClose} name=\"panel-left-close\" />\n </button>\n </ToolbarControlGroup>\n }\n />\n {brand.subtitle ? (\n <p class=\"kui-catalog__subtitle\">{brand.subtitle}</p>\n ) : null}\n </div>\n }\n >\n <nav\n class=\"kui-catalog__navigation\"\n aria-label={`${brand.title} components`}\n >\n <CatalogSectionList\n sections={sections}\n active={active}\n selectAction={selectAction}\n />\n {secondarySections ? (\n <CatalogSecondarySections\n group={secondarySections}\n active={active}\n selectAction={selectAction}\n toggleAction={toggleSecondaryAction}\n />\n ) : null}\n {footer}\n </nav>\n </Pane>\n </aside>\n );\n}\n","import type { CatalogEntry, CatalogProps, CatalogSection } from '../types.js';\nimport { CatalogDetail } from './catalog-detail.js';\nimport { CatalogSidebar } from './catalog-sidebar.js';\n\nfunction findEntry(\n sections: readonly CatalogSection[],\n id: string,\n): CatalogEntry | undefined {\n for (const section of sections) {\n for (const entry of section.entries) if (entry.id === id) return entry;\n }\n return undefined;\n}\n\n/** Controlled, stateless component-catalog shell. */\nexport function Catalog({\n brand,\n sections,\n active,\n content,\n collapsed = false,\n theme,\n headerActions,\n secondarySections,\n sidebarFooter,\n status,\n geometryOverlay,\n stageRootAttributes,\n selectAction = 'catalog-select',\n toggleSidebarAction = 'catalog-toggle-sidebar',\n toggleThemeAction = 'catalog-toggle-theme',\n toggleSecondaryAction = 'catalog-toggle-secondary',\n className = '',\n slot,\n}: CatalogProps) {\n const selected =\n findEntry(sections, active) ??\n (secondarySections\n ? findEntry(secondarySections.sections, active)\n : undefined);\n\n return (\n <main\n class={`kui-catalog ${className}`.trim()}\n data-component=\"catalog\"\n data-sidebar-collapsed={String(collapsed)}\n data-geometry-overlay={\n geometryOverlay === undefined ? undefined : String(geometryOverlay)\n }\n slot={slot}\n >\n <CatalogSidebar\n brand={brand}\n sections={sections}\n active={active}\n collapsed={collapsed}\n secondarySections={secondarySections}\n footer={sidebarFooter}\n selectAction={selectAction}\n toggleSidebarAction={toggleSidebarAction}\n toggleSecondaryAction={toggleSecondaryAction}\n />\n <CatalogDetail\n brandTitle={brand.title}\n active={active}\n selected={selected}\n content={content}\n collapsed={collapsed}\n theme={theme}\n headerActions={headerActions}\n status={status}\n geometryOverlay={geometryOverlay}\n stageRootAttributes={stageRootAttributes}\n selectAction={selectAction}\n toggleSidebarAction={toggleSidebarAction}\n toggleThemeAction={toggleThemeAction}\n />\n </main>\n );\n}\n","import type { SafeHtml } from 'kerfjs';\n\nimport { filterDataAttributes } from '../../extension-attributes.js';\nimport { ListHeader } from '../../list-header.js';\nimport type { KerfUiContent } from '../../semantic-content.js';\n\n/** How a specimen aligns its visible edge with its `ListHeader` label. */\nexport type CatalogExampleAlign = 'glyph' | 'inline-control' | 'none';\n\nexport interface CatalogExampleViewport {\n layout?: 'grid' | 'flex' | 'flex-column';\n width?: 'full' | 'compact' | 'medium' | 'wide' | 'text' | 'control';\n /** Fixed specimen height; `app` frames an application-sized recipe or layout.\n * A fixed height is definite, so a child that fills with `height: 100%`\n * (a horizontal `ResizableRegion`, say) spans the whole frame. */\n height?: 'short' | 'reduced' | 'medium' | 'tall' | 'app';\n /** A minimum the frame may grow past. It is not a definite height: a child\n * sized with `height: 100%` falls back to its content height, so use\n * `height` when the specimen must fill the frame. */\n minHeight?: 'short' | 'medium';\n frame?: 'solid' | 'dashed';\n surface?: 'default' | 'lowered';\n overflow?: 'hidden' | 'auto-x';\n responsive?: 'roomy-only';\n shadow?: boolean;\n /** Public component custom properties applied to the specimen viewport. */\n tokens?: Readonly<Record<`--${string}`, string>>;\n}\n\nconst protectedAttributes = new Set([\n 'data-catalog-example',\n 'data-catalog-example-stack',\n 'data-catalog-example-label',\n 'data-catalog-example-note',\n 'data-align',\n]);\n\ntype CatalogExampleRootAttributes = Readonly<\n Record<`data-${string}`, string | undefined> & {\n 'data-catalog-example'?: never;\n 'data-catalog-example-stack'?: never;\n 'data-catalog-example-label'?: never;\n 'data-catalog-example-note'?: never;\n 'data-align'?: never;\n }\n>;\n\nexport interface CatalogExampleProps {\n label?: string;\n note?: SafeHtml | string;\n align?: CatalogExampleAlign;\n /** Optional catalog-owned constraints for demonstrating layout components. */\n viewport?: CatalogExampleViewport;\n /** Replacement guidance shown when a roomy-only viewport is hidden. */\n compactFallback?: SafeHtml | string;\n rootAttributes?: CatalogExampleRootAttributes;\n className?: string;\n children?: KerfUiContent;\n /** Native named-slot assignment when composed inside a web component. */\n slot?: string;\n}\n\n/** A labeled catalog specimen with optional explanatory text and alignment. */\nexport function CatalogExample({\n label,\n note,\n align = 'none',\n viewport,\n compactFallback,\n rootAttributes = {},\n className = '',\n children,\n slot,\n}: CatalogExampleProps) {\n const safeRootAttributes = filterDataAttributes(\n rootAttributes,\n protectedAttributes,\n );\n const viewportStyle = viewport?.tokens\n ? Object.entries(viewport.tokens)\n .map(([name, value]) => `${name}:${value}`)\n .join(';')\n : undefined;\n const specimen = viewport ? (\n <div\n class=\"kui-catalog-example__viewport\"\n data-catalog-example-viewport\n data-layout={viewport.layout}\n data-width={viewport.width}\n data-height={viewport.height}\n data-min-height={viewport.minHeight}\n data-frame={viewport.frame}\n data-surface={viewport.surface}\n data-overflow={viewport.overflow}\n data-responsive={viewport.responsive}\n data-shadow={viewport.shadow ? 'true' : undefined}\n style={viewportStyle}\n >\n {children}\n </div>\n ) : (\n children\n );\n\n return (\n <section\n {...safeRootAttributes}\n class={`kui-catalog-example ${className}`.trim()}\n data-catalog-example\n data-align={align}\n slot={slot}\n >\n {label !== undefined ? (\n <ListHeader\n label={label}\n width=\"content\"\n rootAttributes={{ 'data-catalog-example-label': '' }}\n />\n ) : null}\n {note !== undefined ? (\n <p class=\"kui-catalog-example__note\" data-catalog-example-note>\n {note}\n </p>\n ) : null}\n {compactFallback !== undefined ? (\n <p class=\"kui-catalog-example__compact-fallback\">{compactFallback}</p>\n ) : null}\n {specimen}\n </section>\n );\n}\n","import { filterDataAttributes } from '../../extension-attributes.js';\nimport type { KerfUiContent } from '../../semantic-content.js';\n\nconst protectedAttributes = new Set([\n 'data-catalog-example',\n 'data-catalog-example-stack',\n 'data-catalog-example-label',\n 'data-catalog-example-note',\n 'data-align',\n]);\n\ntype CatalogExampleStackRootAttributes = Readonly<\n Record<`data-${string}`, string | undefined> & {\n 'data-catalog-example'?: never;\n 'data-catalog-example-stack'?: never;\n 'data-catalog-example-label'?: never;\n 'data-catalog-example-note'?: never;\n 'data-align'?: never;\n }\n>;\n\nexport interface CatalogExampleStackProps {\n label?: string;\n rootAttributes?: CatalogExampleStackRootAttributes;\n className?: string;\n children?: KerfUiContent;\n /** Native named-slot assignment when composed inside a web component. */\n slot?: string;\n}\n\n/** A vertically stacked group of catalog examples. */\nexport function CatalogExampleStack({\n label,\n rootAttributes = {},\n className = '',\n children,\n slot,\n}: CatalogExampleStackProps) {\n const safeRootAttributes = filterDataAttributes(\n rootAttributes,\n protectedAttributes,\n );\n\n return (\n <section\n {...safeRootAttributes}\n class={`kui-catalog-example-stack ${className}`.trim()}\n data-catalog-example-stack\n aria-label={label}\n slot={slot}\n >\n {children}\n </section>\n );\n}\n"]}
@@ -1,6 +1,6 @@
1
- import { Skeleton } from './chunk-54HM36IQ.js';
1
+ import { Skeleton } from './chunk-ULCDZTWL.js';
2
2
  import { filterDataAttributes } from './chunk-SRSJO5QE.js';
3
- import { em } from './chunk-OL4TC3U2.js';
3
+ import { em } from './chunk-MO56ZZLG.js';
4
4
  import { jsxs, jsx } from 'kerfjs/jsx-runtime';
5
5
 
6
6
  var PROTECTED_ROOT_DATA_ATTRIBUTES = /* @__PURE__ */ new Set([
@@ -119,4 +119,4 @@ function AppTab({
119
119
 
120
120
  export { AppTab };
121
121
 
122
- //# sourceMappingURL=chunk-COUPLRZG.js.map
122
+ //# sourceMappingURL=chunk-5FZZMIMD.js.map