@kerfjs/ui 5.0.0-beta.67 → 5.0.0-beta.69

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 (103) hide show
  1. package/README.md +3 -0
  2. package/ai/application-ui-profile-sync.cjs +20 -1
  3. package/ai/application-ui-profile.d.ts +4 -0
  4. package/ai/application-ui-profile.mjs +27 -0
  5. package/ai/application-ui-profile.schema.json +10 -0
  6. package/ai/component-catalog-extension.schema.json +12 -0
  7. package/ai/component-catalog.json +14 -4
  8. package/ai/component-catalog.schema.json +14 -0
  9. package/ai/component-composition-rules.json +2 -2
  10. package/ai/component-composition.d.ts +2 -0
  11. package/ai/component-composition.json +2 -2
  12. package/ai/component-composition.schema.json +24 -0
  13. package/ai/components/loading-spinner.md +1 -0
  14. package/ai/components/tab-bar.md +5 -4
  15. package/ai/components/toolbar-control-group.md +2 -2
  16. package/ai/public-api-signatures-v1.md +34 -14
  17. package/ai/skill.md +18 -3
  18. package/ai/webawesome-jsx-signatures-v1.md +1 -1
  19. package/analyzer/index.d.mts +1 -0
  20. package/analyzer/index.mjs +108 -12
  21. package/dist/catalog.js +4 -4
  22. package/dist/catalog.js.map +1 -1
  23. package/dist/{chunk-P4UXSYIJ.js → chunk-2ZOLX3IE.js} +2 -2
  24. package/dist/{chunk-P4UXSYIJ.js.map → chunk-2ZOLX3IE.js.map} +1 -1
  25. package/dist/{chunk-E36EVCKG.js → chunk-47CKKLBE.js} +2 -2
  26. package/dist/{chunk-E36EVCKG.js.map → chunk-47CKKLBE.js.map} +1 -1
  27. package/dist/{chunk-JCV4GXWB.js → chunk-6DFDTWGG.js} +100 -61
  28. package/dist/chunk-6DFDTWGG.js.map +1 -0
  29. package/dist/{chunk-IAOAZUOO.js → chunk-7OKX3EF6.js} +2 -2
  30. package/dist/{chunk-IAOAZUOO.js.map → chunk-7OKX3EF6.js.map} +1 -1
  31. package/dist/{chunk-C74LITXE.js → chunk-B3XWUX3A.js} +2 -2
  32. package/dist/{chunk-C74LITXE.js.map → chunk-B3XWUX3A.js.map} +1 -1
  33. package/dist/{chunk-F7OCOBTG.js → chunk-CRVDF4A6.js} +4 -1
  34. package/dist/chunk-CRVDF4A6.js.map +1 -0
  35. package/dist/{chunk-TGM424PI.js → chunk-H7IODXGY.js} +3 -3
  36. package/dist/{chunk-TGM424PI.js.map → chunk-H7IODXGY.js.map} +1 -1
  37. package/dist/chunk-KVBRMEPM.js +44 -0
  38. package/dist/chunk-KVBRMEPM.js.map +1 -0
  39. package/dist/{chunk-EN4LDR5Y.js → chunk-NC4CFOID.js} +2 -2
  40. package/dist/{chunk-EN4LDR5Y.js.map → chunk-NC4CFOID.js.map} +1 -1
  41. package/dist/{chunk-5SYE4CCT.js → chunk-PQZPVBP4.js} +25 -18
  42. package/dist/chunk-PQZPVBP4.js.map +1 -0
  43. package/dist/{chunk-NXWE5S57.js → chunk-QJ5VFCW3.js} +12 -3
  44. package/dist/chunk-QJ5VFCW3.js.map +1 -0
  45. package/dist/{chunk-RKTTF3L4.js → chunk-X3TPECWG.js} +1 -1
  46. package/dist/chunk-X3TPECWG.js.map +1 -0
  47. package/dist/{chunk-VY6YRCTV.js → chunk-X3X4KRDK.js} +2 -2
  48. package/dist/{chunk-VY6YRCTV.js.map → chunk-X3X4KRDK.js.map} +1 -1
  49. package/dist/collapsible-panel.js +2 -2
  50. package/dist/empty-state.js +2 -1
  51. package/dist/index.js +10 -10
  52. package/dist/list-action-row.js +1 -1
  53. package/dist/list-item.js +1 -1
  54. package/dist/loading-spinner.d.ts +7 -2
  55. package/dist/loading-spinner.js +2 -1
  56. package/dist/nav-stack.js +1 -1
  57. package/dist/select.d.ts +4 -2
  58. package/dist/select.js +1 -1
  59. package/dist/split-view.js +1 -1
  60. package/dist/styles/app-tab.css +29 -0
  61. package/dist/styles/loading-spinner.css +4 -0
  62. package/dist/styles/select.css +79 -0
  63. package/dist/styles/tab-bar.css +12 -8
  64. package/dist/styles/token-search-field.css +28 -10
  65. package/dist/styles/toolbar-control-group.css +96 -3
  66. package/dist/styles/webawesome.css +17 -0
  67. package/dist/tab-bar.d.ts +2 -0
  68. package/dist/tab-bar.js +1 -1
  69. package/dist/token-search-field.js +1 -1
  70. package/dist/toolbar-control-group.d.ts +13 -5
  71. package/dist/toolbar-control-group.js +2 -1
  72. package/dist/wire-catalog.js +1 -1
  73. package/dist/wire-scroll-dividers.d.ts +7 -4
  74. package/dist/wire-scroll-dividers.js +1 -1
  75. package/dist/wire-token-search-fields.js +1 -1
  76. package/dist/workbench.js +1 -1
  77. package/docs/accessibility.md +14 -0
  78. package/docs/apple-hig.md +1 -0
  79. package/docs/catalog.md +3 -0
  80. package/docs/component-contract.md +65 -10
  81. package/docs/component-selection.md +24 -6
  82. package/docs/design/templates/toolbar/title-and-actions-dark.svg +1 -1
  83. package/docs/design/templates/toolbar/title-and-actions.svg +1 -1
  84. package/docs/design/templates/toolbar-dark.svg +1 -1
  85. package/docs/design/templates/toolbar.svg +1 -1
  86. package/docs/examples/component-catalog-extension.json +1 -0
  87. package/docs/layout.md +6 -0
  88. package/docs/ui-analyzer.md +12 -0
  89. package/docs/ui-doctor.md +15 -3
  90. package/docs/webawesome-theme.md +7 -0
  91. package/doctor/cli.mjs +5 -0
  92. package/doctor/config.schema.json +2 -0
  93. package/doctor/index.d.mts +3 -0
  94. package/doctor/index.mjs +27 -1
  95. package/llms.txt +15 -5
  96. package/package.json +1 -1
  97. package/dist/chunk-5SYE4CCT.js.map +0 -1
  98. package/dist/chunk-F7OCOBTG.js.map +0 -1
  99. package/dist/chunk-JCV4GXWB.js.map +0 -1
  100. package/dist/chunk-NXWE5S57.js.map +0 -1
  101. package/dist/chunk-RKTTF3L4.js.map +0 -1
  102. package/dist/chunk-ZLWQZUGF.js +0 -27
  103. package/dist/chunk-ZLWQZUGF.js.map +0 -1
@@ -22,6 +22,7 @@ export interface UiDoctorConfig {
22
22
  schemaVersion: 1;
23
23
  mode?: 'full' | 'changed';
24
24
  package?: string;
25
+ ownership?: 'package' | 'component';
25
26
  stages?: Partial<
26
27
  Record<
27
28
  'catalog' | 'typescript' | 'eslint' | 'analyzer' | 'browser',
@@ -36,6 +37,7 @@ export interface UiDoctorConfig {
36
37
  reportPath?: string;
37
38
  };
38
39
  cache?: boolean;
40
+ failOn?: 'error' | 'review' | 'warning';
39
41
  suppressions?: UiDoctorSuppression[];
40
42
  }
41
43
 
@@ -109,6 +111,7 @@ export function runUiDoctor(options?: {
109
111
  config?: UiDoctorConfig;
110
112
  configPath?: string;
111
113
  cache?: boolean;
114
+ failOn?: 'error' | 'review' | 'warning';
112
115
  signal?: AbortSignal;
113
116
  browser?: UiDoctorConfig['browser'];
114
117
  eslintConfig?: 'recommended-ui' | 'strict-ui';
package/doctor/index.mjs CHANGED
@@ -131,9 +131,11 @@ export function validateUiDoctorConfig(
131
131
  'schemaVersion',
132
132
  'mode',
133
133
  'package',
134
+ 'ownership',
134
135
  'stages',
135
136
  'browser',
136
137
  'cache',
138
+ 'failOn',
137
139
  'suppressions',
138
140
  ]);
139
141
  for (const key of Object.keys(config))
@@ -152,6 +154,11 @@ export function validateUiDoctorConfig(
152
154
  '$.package',
153
155
  'package must be a non-empty workspace package name or path.',
154
156
  );
157
+ if (
158
+ config.ownership !== undefined &&
159
+ !['package', 'component'].includes(config.ownership)
160
+ )
161
+ add('$.ownership', 'ownership must be package or component.');
155
162
  if (config.stages !== undefined) {
156
163
  if (
157
164
  !config.stages ||
@@ -224,6 +231,11 @@ export function validateUiDoctorConfig(
224
231
  }
225
232
  if (config.cache !== undefined && typeof config.cache !== 'boolean')
226
233
  add('$.cache', 'cache must be boolean.');
234
+ if (
235
+ config.failOn !== undefined &&
236
+ !['error', 'review', 'warning'].includes(config.failOn)
237
+ )
238
+ add('$.failOn', 'failOn must be error, review, or warning.');
227
239
  if (config.suppressions !== undefined) {
228
240
  if (!Array.isArray(config.suppressions))
229
241
  add('$.suppressions', 'suppressions must be an array.');
@@ -975,6 +987,7 @@ export async function runUiDoctor({
975
987
  config: suppliedConfig,
976
988
  configPath,
977
989
  cache,
990
+ failOn,
978
991
  signal,
979
992
  browser,
980
993
  runners = {},
@@ -1008,6 +1021,14 @@ export async function runUiDoctor({
1008
1021
  );
1009
1022
  }
1010
1023
  const selectedMode = mode ?? config.mode ?? 'full';
1024
+ const selectedFailOn = failOn ?? config.failOn ?? 'error';
1025
+ if (failOn !== undefined && !['error', 'review', 'warning'].includes(failOn))
1026
+ initialDiagnostics.push(
1027
+ configDiagnostic('failOn must be error, review, or warning.', {
1028
+ file: '<options>',
1029
+ path: '$.failOn',
1030
+ }),
1031
+ );
1011
1032
  const stages = { ...defaultStages, ...config.stages };
1012
1033
  if (browser?.url || config.browser?.url) stages.browser = true;
1013
1034
  const selectedPaths =
@@ -1035,6 +1056,7 @@ export async function runUiDoctor({
1035
1056
  const cachePath = resolve(root, '.kerf-cache/ui-doctor-v1.json');
1036
1057
  const key = await cacheKey(root, packageRoot, selectedMode, selectedPaths, {
1037
1058
  ...config,
1059
+ failOn: selectedFailOn,
1038
1060
  browser: config.browser
1039
1061
  ? { ...config.browser, url: '<redacted-url>' }
1040
1062
  : undefined,
@@ -1123,6 +1145,7 @@ export async function runUiDoctor({
1123
1145
  root,
1124
1146
  packageRoot,
1125
1147
  paths: selectedPaths,
1148
+ ownership: config.ownership ?? 'package',
1126
1149
  signal,
1127
1150
  })
1128
1151
  : (async () => ({
@@ -1130,6 +1153,7 @@ export async function runUiDoctor({
1130
1153
  await analyzeUiProject({
1131
1154
  root: packageRoot,
1132
1155
  paths: selectedPaths,
1156
+ ownership: config.ownership ?? 'package',
1133
1157
  knownRules: [...registeredRuleIds, ...eslintRuleIds],
1134
1158
  }),
1135
1159
  ),
@@ -1228,7 +1252,9 @@ export async function runUiDoctor({
1228
1252
  ? UI_DOCTOR_EXIT.cancelled
1229
1253
  : infrastructureFailure
1230
1254
  ? UI_DOCTOR_EXIT.configuration
1231
- : summary.errors
1255
+ : summary.errors ||
1256
+ (selectedFailOn !== 'error' && summary.review) ||
1257
+ (selectedFailOn === 'warning' && summary.warnings)
1232
1258
  ? UI_DOCTOR_EXIT.findings
1233
1259
  : UI_DOCTOR_EXIT.clean;
1234
1260
  const report = redact(root, {
package/llms.txt CHANGED
@@ -109,7 +109,7 @@ not a reason to override — and your own components follow the same rule.
109
109
  pair measures below 4.5:1, is review finding `KUI-L018` (set both); CSS that restyles a component
110
110
  (`KUI-L019`), touches its private `--_*` variables (`KUI-L020`), overrides a token a typed prop sets
111
111
  (`KUI-L021`), or styles it through a hook class on its root (`KUI-L022`) is an error: configure the
112
- component instead, and report a component gap when no prop exists; repair source-located errors until exit 0. Use full mode for release gates;
112
+ component instead, and report a component gap when no prop exists; application-component imports may use TypeScript `paths` aliases; use `"ownership": "component"` with catalog `styleSources` to apply this boundary between an app's own components; repair source-located errors until exit 0. Use full mode for release gates;
113
113
  generated `dist`/`coverage`, dependency, cache, evidence, and nested-worktree
114
114
  directories are excluded consistently from every static stage.
115
115
  [`kerf-ui-analyze`](./docs/ui-analyzer.md) remains available when only static
@@ -165,6 +165,9 @@ headingLevel`, `TokenSearchField clearIcon`, `ContentItem frame="framed"` for a
165
165
  expanded trailing control to a full second row at `responsiveAt`; the leading
166
166
  title remains above it. Public leading-min-width, trailing-gap/justify, and
167
167
  per-zone inline-padding tokens cover app-specific toolbar geometry.
168
+ In a stacked Toolbar, `ToolbarControlGroup placement="end"` places a collapsed
169
+ search at its row's trailing edge; `sizing="fill"` gives its expanded state a
170
+ full row and a reduced-motion-aware downward entrance.
168
171
  `--kui-toolbar-inset: 0px` removes an embedded Toolbar's outer padding and
169
172
  corresponding minimum-height allowance while preserving its zone gap and
170
173
  safe-area compensation.
@@ -286,7 +289,9 @@ headingLevel`, `TokenSearchField clearIcon`, `ContentItem frame="framed"` for a
286
289
  (`@kerfjs/ui/popup-menu`, registered once via `@kerfjs/ui/popup-menu/register`)
287
290
  in a `single` `ToolbarControlGroup` with `nestedDropdown`; never hand-write
288
291
  `wa-dropdown` markup for a menu. Let the group size the trigger from its icon,
289
- localized text, and caret. `PopupMenu` items also support nested `submenu`
292
+ localized text, and caret. Set `overflow="wrap"` for independent action links
293
+ that must remain fully visible at narrow widths; whole links move to a second
294
+ row, as in the catalog resource footer. `PopupMenu` items also support nested `submenu`
290
295
  actions, headings, dividers, checked or trailing choice marks, danger tone,
291
296
  and disabled reasons; nested headings/dividers stay out of keyboard choices;
292
297
  use `context` with `openPopupMenuAt`/`closePopupMenu` for pointer-anchored row
@@ -379,7 +384,9 @@ headingLevel`, `TokenSearchField clearIcon`, `ContentItem frame="framed"` for a
379
384
  callbacks. For a tab-local action plus a separate far-edge action, set
380
385
  `TabBar trailingPlacement="adjacent"`, put the local action in `trailing`, and
381
386
  the workspace action in `end`; the component keeps both visible while its tab
382
- list shrinks and scrolls, without application descendant CSS. Managed
387
+ list shrinks and scrolls, without application descendant CSS. Each action
388
+ zone accepts one ToolbarControlGroup or a standalone `wa-button` for its own
389
+ Web Awesome chrome. Managed
383
390
  TokenSearchField clear also preserves open state and replacement
384
391
  editor focus before the next input task, so shortcut-letter typing stays in search.
385
392
  Select All deletion does the same; deletion
@@ -416,7 +423,8 @@ headingLevel`, `TokenSearchField clearIcon`, `ContentItem frame="framed"` for a
416
423
  `busy` spinner while its `status` (and a `ListItem`'s `trailing`) content
417
424
  become skeletons. Use the standalone `Skeleton` for a custom slot. Prefer it over `wa-skeleton`
418
425
  (the pure-Kerf primitives avoid Web Awesome), and never animate it — use
419
- `LoadingSpinner` for known busy activity instead.
426
+ `LoadingSpinner` for known busy activity instead. Set its `size` prop to a
427
+ named icon step or positive pixel number when the inherited 1em is unsuitable.
420
428
  - **Keep ListItem content inside the row.** The rounded `ListItem` root clips
421
429
  overflowing label, status, and dormant trailing content. Set `multiline` when
422
430
  the primary label should wrap; use `ListActionRow` instead when trailing content
@@ -435,7 +443,9 @@ headingLevel`, `TokenSearchField clearIcon`, `ContentItem frame="framed"` for a
435
443
  - **Size a Select through its API.** `triggerWidth` chooses `fit-content`,
436
444
  `max-content`, or `fill`; `--kui-select-trigger-max-width` caps it. For custom
437
445
  selected text, use the public color, font-size, and font-weight tokens; the
438
- closed value ellipsizes when space runs out.
446
+ closed value ellipsizes when space runs out. `presentation="title"` gives a
447
+ rail view heading a 36px bold, flush-start trigger and adjacent caret;
448
+ `focusRingInset` keeps its ring inside clipping ancestors.
439
449
  - **Configure application tabs at their owners.** AppTab's `icon-only`
440
450
  presentation keeps `name` accessible, `labelMaxWidth` ellipsizes a long name,
441
451
  `nameOverflow="visible"` shows the full name during inline loading, and
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kerfjs/ui",
3
- "version": "5.0.0-beta.67",
3
+ "version": "5.0.0-beta.69",
4
4
  "description": "Accessible, composable UI primitives for kerf applications.",
5
5
  "type": "module",
6
6
  "license": "MIT",
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/token-search-field.tsx"],"names":[],"mappings":"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","file":"chunk-5SYE4CCT.js","sourcesContent":["import type { SafeHtml } from 'kerfjs';\nimport { Search, X } from 'lucide';\n\nimport { LucideIcon } from './lucide-icon.js';\nimport type { KerfUiContent } from './semantic-content.js';\nimport type { TokenSearchModel } from './token-search-model.js';\n\nexport interface TokenSearchToken {\n value: string;\n label: string;\n offset?: number;\n accessibleLabel?: string;\n}\n\nexport interface TokenSearchTrailingAction {\n icon: SafeHtml;\n label: string;\n action: string;\n id?: string;\n}\n\nexport type TokenSearchEditorAttributes = Readonly<\n Record<`data-${string}`, string | undefined> & {\n 'data-component'?: never;\n 'data-key'?: never;\n 'data-morph-skip'?: never;\n 'data-token-search-editor'?: never;\n 'data-token-count'?: never;\n 'data-placeholder'?: never;\n }\n>;\n\ninterface TokenSearchFieldBaseProps {\n id: string;\n label: string;\n query?: string;\n tokens?: readonly TokenSearchToken[];\n /** Opt-in grammar, suggestion, and evaluation state. Overrides `query` and `tokens`. */\n model?: TokenSearchModel;\n /**\n * Editor identity for a programmatic text replacement. The editor's text is\n * DOM-owned between token changes, so a new `query` with the same tokens\n * does not re-render it (that would reset the caret on every keystroke).\n * Change `revision` when the app replaces the text itself — reseeding a\n * persistent dialog's field on reopen, applying a saved search — and the\n * editor is rebuilt from `query` and `tokens`.\n */\n revision?: string | number;\n placeholder?: string;\n tokenPlaceholder?: string;\n disabled?: boolean;\n autofocus?: boolean;\n /** Let an expanded collapsible field consume the available inline width. */\n fill?: boolean;\n leading?: KerfUiContent;\n editAction?: string;\n removeAction?: string;\n clearAction?: string;\n clearLabel?: string;\n /** Icon for the clear button. Default: the Lucide `x` glyph token chips also use. */\n clearIcon?: SafeHtml;\n className?: string;\n editorAttributes?: TokenSearchEditorAttributes;\n /** Native named-slot assignment when composed inside a web component. */\n slot?: string;\n}\n\ntype TokenSearchTrailingProps =\n | { trailing?: KerfUiContent; trailingAction?: never }\n | { trailing?: never; trailingAction: TokenSearchTrailingAction };\n\ntype TokenSearchPresentationProps =\n | {\n /** Standalone field chrome or the inset visual layer of a configured toolbar group. */\n presentation?: 'standalone' | 'toolbar-group';\n hint?: never;\n required?: never;\n }\n | {\n /** Visible form label and optional hint around the full-width standalone control. */\n presentation: 'form-field';\n hint?: string;\n /** Marks the editor required; the app validates its value. */\n required?: boolean;\n };\n\ntype TokenSearchCollapsibleProps =\n | {\n /** Allow an empty field to render as one iconic action. */\n collapsible: true;\n /** Keep an empty collapsible field open while the application owns focus. */\n expanded?: boolean;\n expandAction?: string;\n expandLabel?: string;\n }\n | {\n collapsible?: false;\n expanded?: never;\n expandAction?: never;\n expandLabel?: never;\n };\n\nexport type TokenSearchFieldProps = TokenSearchFieldBaseProps &\n TokenSearchCollapsibleProps &\n TokenSearchTrailingProps &\n TokenSearchPresentationProps;\n\nexport interface TokenSearchFieldValue {\n query: string;\n tokens: TokenSearchToken[];\n}\n\ntype TokenSearchPart =\n { kind: 'text'; value: string } | { kind: 'token'; token: TokenSearchToken };\n\nfunction orderedParts(\n query: string,\n tokens: readonly TokenSearchToken[],\n): TokenSearchPart[] {\n const ordered = tokens\n .map((token, index) => ({\n token,\n index,\n offset: Math.max(0, Math.min(query.length, token.offset ?? query.length)),\n }))\n .sort(\n (left, right) => left.offset - right.offset || left.index - right.index,\n );\n const parts: TokenSearchPart[] = [];\n let cursor = 0;\n for (const { token, offset } of ordered) {\n parts.push({ kind: 'text', value: query.slice(cursor, offset) });\n parts.push({ kind: 'token', token: { ...token, offset } });\n cursor = offset;\n }\n parts.push({ kind: 'text', value: query.slice(cursor) });\n return parts;\n}\n\nfunction CloseIcon() {\n return <LucideIcon icon={X} name=\"x\" />;\n}\n\nexport function TokenSearchField({\n id,\n label,\n query = '',\n tokens = [],\n model,\n revision,\n placeholder = 'Search',\n tokenPlaceholder = 'Add search…',\n disabled = false,\n autofocus = false,\n fill = false,\n collapsible = false,\n expanded = false,\n expandAction = 'expand-token-search',\n expandLabel,\n leading,\n trailing,\n trailingAction,\n presentation = 'standalone',\n hint,\n required = false,\n editAction = 'edit-search-token',\n removeAction = 'remove-search-token',\n clearAction = 'clear-token-search',\n clearLabel = 'Clear search',\n clearIcon,\n className = '',\n editorAttributes = {},\n slot,\n}: TokenSearchFieldProps) {\n if (model) {\n query = model.state.value.query;\n tokens = model.state.value.tokens;\n }\n const suggestions = model?.suggestions.value ?? [];\n const parts = orderedParts(query, tokens);\n const tokenKey = tokens.map((token) => token.value).join('|');\n const key = model\n ? `${id}@${String(revision ?? '')}:${model.editorRevision.value}:${tokenKey}`\n : revision === undefined\n ? `${id}:${tokenKey}`\n : `${id}@${String(revision)}:${tokenKey}`;\n const resolvedExpanded =\n !collapsible || expanded || query.length > 0 || tokens.length > 0;\n const control = (\n <div\n class={`kui-token-search ${className}`.trim()}\n data-component=\"token-search-field\"\n data-token-search-id={id}\n data-disabled={String(disabled)}\n data-collapsible={String(collapsible)}\n data-expanded={String(resolvedExpanded)}\n data-fill={String(fill)}\n data-has-trailing={String(Boolean(trailing || trailingAction))}\n data-presentation={presentation}\n slot={slot}\n >\n {!resolvedExpanded ? (\n <button\n type=\"button\"\n class=\"kui-token-search__expand\"\n data-action={expandAction}\n aria-label={expandLabel ?? label}\n title={expandLabel ?? label}\n disabled={disabled}\n >\n <LucideIcon icon={Search} name=\"search\" />\n </button>\n ) : (\n <>\n <span class=\"kui-token-search__leading\" aria-hidden=\"true\">\n {leading ?? <LucideIcon icon={Search} name=\"search\" />}\n </span>\n <div\n {...editorAttributes}\n class=\"kui-token-search__editor\"\n data-key={key}\n data-morph-skip\n data-token-search-editor={id}\n data-token-count={tokens.length}\n data-placeholder={tokens.length ? tokenPlaceholder : placeholder}\n role=\"searchbox\"\n aria-label={presentation === 'form-field' ? undefined : label}\n aria-labelledby={\n presentation === 'form-field' ? `${id}-label` : undefined\n }\n aria-describedby={\n presentation === 'form-field' && hint ? `${id}-hint` : undefined\n }\n aria-required={required ? 'true' : undefined}\n aria-disabled={disabled ? 'true' : undefined}\n contenteditable={disabled ? 'false' : 'true'}\n spellcheck=\"false\"\n autofocus={autofocus}\n >\n {parts.map((part) =>\n part.kind === 'text' ? (\n <span\n data-token-search-text\n data-empty={String(part.value.length === 0)}\n >\n {part.value || (tokens.length ? '\\u200b' : '')}\n </span>\n ) : (\n <span\n class=\"kui-token-search__token\"\n contenteditable=\"false\"\n data-component=\"token-search-token\"\n data-token-value={part.token.value}\n >\n <button\n type=\"button\"\n class=\"kui-token-search__token-edit\"\n data-action={editAction}\n data-token-value={part.token.value}\n aria-label={`Edit ${part.token.accessibleLabel ?? part.token.label}`}\n disabled={disabled}\n >\n {part.token.label}\n </button>\n <button\n type=\"button\"\n class=\"kui-token-search__token-remove\"\n data-action={removeAction}\n data-token-value={part.token.value}\n aria-label={`Remove ${part.token.accessibleLabel ?? part.token.label}`}\n disabled={disabled}\n >\n <CloseIcon />\n </button>\n </span>\n ),\n )}\n </div>\n {(query || tokens.length > 0) && (\n <button\n type=\"button\"\n class=\"kui-token-search__clear\"\n data-action={clearAction}\n aria-label={clearLabel}\n title={clearLabel}\n disabled={disabled}\n >\n {clearIcon ?? <CloseIcon />}\n </button>\n )}\n {trailingAction ? (\n <button\n type=\"button\"\n class=\"kui-token-search__trailing-action\"\n id={trailingAction.id}\n data-action={trailingAction.action}\n aria-label={trailingAction.label}\n title={trailingAction.label}\n disabled={disabled}\n >\n {trailingAction.icon}\n </button>\n ) : trailing ? (\n <span class=\"kui-token-search__trailing\">{trailing}</span>\n ) : null}\n {!disabled && suggestions.length > 0 && (\n <div\n class=\"kui-token-search__suggestions\"\n data-token-search-keep-open\n >\n {suggestions.map((suggestion) => (\n <button\n type=\"button\"\n class=\"kui-token-search__suggestion\"\n data-token-search-suggestion={suggestion.value}\n >\n {suggestion.label}\n </button>\n ))}\n </div>\n )}\n </>\n )}\n </div>\n );\n if (presentation !== 'form-field') return control;\n return (\n <div class=\"kui-token-search__field\" data-token-search-form-field={id}>\n <div\n class=\"kui-token-search__field-label\"\n id={`${id}-label`}\n data-token-search-form-label={id}\n >\n {label}\n {required && (\n <span class=\"kui-token-search__field-required\" aria-hidden=\"true\">\n *\n </span>\n )}\n </div>\n {control}\n {hint && (\n <div class=\"kui-token-search__field-hint\" id={`${id}-hint`}>\n {hint}\n </div>\n )}\n </div>\n );\n}\n\n/** Read editable text and ordered token offsets from a rendered TokenSearchField editor. */\nexport function readTokenSearchField(\n editor: HTMLElement,\n knownTokens: readonly TokenSearchToken[] = [],\n): TokenSearchFieldValue {\n let query = '';\n const tokens: TokenSearchToken[] = [];\n const visit = (node: Node): void => {\n if (node.nodeType === Node.TEXT_NODE) {\n query += (node.textContent ?? '')\n .replaceAll('\\u00a0', ' ')\n .replaceAll('\\u200b', '');\n return;\n }\n if (!(node instanceof HTMLElement)) return;\n if (node.matches('[data-component=\"token-search-token\"]')) {\n const value = node.dataset.tokenValue;\n const known = knownTokens.find((token) => token.value === value);\n if (known) tokens.push({ ...known, offset: query.length });\n else if (value)\n tokens.push({ value, label: value, offset: query.length });\n return;\n }\n if (node.tagName === 'BR') {\n query += ' ';\n return;\n }\n for (const child of node.childNodes) visit(child);\n };\n for (const child of editor.childNodes) visit(child);\n return { query, tokens };\n}\n\n/** Focus an editor and place its caret at a text offset, skipping atomic token chips. */\nexport function placeTokenSearchCaret(\n editor: HTMLElement,\n offset?: number,\n): void {\n editor.focus({ preventScroll: true });\n const selection = globalThis.getSelection();\n if (!selection) return;\n const range = document.createRange();\n if (offset === undefined) {\n range.selectNodeContents(editor);\n range.collapse(false);\n } else {\n let remaining = Math.max(0, offset);\n let found = false;\n const walker = document.createTreeWalker(editor, NodeFilter.SHOW_TEXT, {\n acceptNode: (node) =>\n node.parentElement?.closest('[data-component=\"token-search-token\"]')\n ? NodeFilter.FILTER_REJECT\n : NodeFilter.FILTER_ACCEPT,\n });\n for (let node = walker.nextNode(); node; node = walker.nextNode()) {\n const source = node.textContent ?? '';\n const length = source.replaceAll('\\u200b', '').length;\n if (remaining <= length) {\n range.setStart(\n node,\n source === '\\u200b' ? 0 : Math.min(remaining, source.length),\n );\n range.collapse(true);\n found = true;\n break;\n }\n remaining -= length;\n }\n if (!found) {\n range.selectNodeContents(editor);\n range.collapse(false);\n }\n }\n selection.removeAllRanges();\n selection.addRange(range);\n}\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/select.tsx"],"names":[],"mappings":"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","file":"chunk-F7OCOBTG.js","sourcesContent":["import type { SafeHtml } from 'kerfjs';\n\nimport { Badge } from './badge.js';\nimport { type CssForegroundColor, em } from './css-values.js';\nimport { LucideIcon, type LucideNode } from './lucide-icon.js';\nimport type { KerfUiContent } from './semantic-content.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 /**\n * Foreground color for the optional icon: a semantic foreground token such\n * as `uiColor('success-on-quiet')`, or an application-owned\n * `foregroundColorVar('--app-icon-color')`. Fill tokens such as\n * `uiColor('success-fill-quiet')` are pale background tints and do not\n * type-check.\n */\n color?: CssForegroundColor;\n group?: string;\n /** Keep an unavailable choice visible but prevent selection. */\n disabled?: boolean;\n /** Optional explanation exposed as the disabled option's native tooltip. */\n disabledReason?: string;\n /**\n * Draw a divider between this choice and the previous choice in the same\n * list. A group boundary is already a separator, so the first choice of a\n * group (or of the whole menu) never draws a second one.\n */\n separatorBefore?: boolean;\n}\n\ntype SelectAccessibleName =\n { label: string; ariaLabel?: string } | { label?: never; ariaLabel: string };\n\nexport type SelectPresentation = 'form' | 'toolbar-borderless' | 'navigation';\nexport type SelectSize = 'default' | 'compact';\nexport type SelectSelectedPresentation = 'label' | 'icon-only';\nexport type SelectFocusRingOwner = 'select' | 'group';\nexport type SelectTriggerWidth = 'fit-content' | 'max-content' | 'fill';\n\ninterface SelectBaseProps<Value extends string = string> {\n name: string;\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 /** Supporting text shown below the control and associated with its combobox. */\n hint?: string;\n disabled?: boolean;\n fitMenu?: boolean;\n /** Render as an unanimated loading skeleton: the label above a static, empty control box. */\n placeholder?: boolean;\n /** Form (default), borderless toolbar, or intrinsic navigation chrome. */\n presentation?: SelectPresentation;\n size?: SelectSize;\n /** Closed trigger width; omit to keep the presentation's default. */\n triggerWidth?: SelectTriggerWidth;\n /** Show the disclosure caret (default); omit it for a compact icon-only trigger. */\n caret?: boolean;\n /** Let an enclosing ToolbarControlGroup paint the composed focus ring. */\n focusRingOwner?: SelectFocusRingOwner;\n /** Maximum closed-control label width in CSS pixels before ellipsis. */\n labelMaxWidth?: number;\n /** Native named-slot assignment when composed inside a web component. */\n slot?: string;\n}\n\n/** One chosen value (the default). */\nexport interface SelectSingleValueProps<Value extends string = string> {\n multiple?: false;\n value: NoInfer<Value>;\n renderSelected?: (choice: SelectChoice<Value>) => SafeHtml;\n /** Show only the selected choice icon while retaining the Select's accessible name. */\n selectedPresentation?: SelectSelectedPresentation;\n triggerIcon?: never;\n selectAllLabel?: never;\n clearLabel?: never;\n}\n\n/**\n * Any number of chosen values. The popup stays open while the person toggles\n * choices and closes on an outside click, Escape, or focus leaving; the closed\n * control summarizes the chosen labels in choice order.\n */\nexport interface SelectMultipleLabelProps<Value extends string = string> {\n multiple: true;\n value: readonly NoInfer<Value>[];\n renderSelected?: never;\n selectedPresentation?: 'label';\n triggerIcon?: never;\n /** Opt in to a footer action that selects every enabled choice. */\n selectAllLabel?: string;\n /** Opt in to a footer action that clears the current selection. */\n clearLabel?: string;\n}\n\n/**\n * A multiple Select drawn as an icon-only toolbar trigger, such as a\n * \"Filter by label\" funnel. No single choice is selected, so the trigger shows\n * a fixed `triggerIcon` naming the menu's purpose; while any choice is chosen\n * a count badge sits beside it, and the combobox's accessible name ends with\n * the chosen labels in choice order.\n */\nexport interface SelectMultipleIconProps<Value extends string = string> {\n multiple: true;\n value: readonly NoInfer<Value>[];\n renderSelected?: never;\n selectedPresentation: 'icon-only';\n /**\n * The trigger's fixed icon, typically a `LucideIcon` naming the menu's\n * purpose (a funnel for a filter), independent of the selection.\n */\n triggerIcon: KerfUiContent;\n /** Opt in to a footer action that selects every enabled choice. */\n selectAllLabel?: string;\n /** Opt in to a footer action that clears the current selection. */\n clearLabel?: string;\n}\n\nexport type SelectMultipleValueProps<Value extends string = string> =\n SelectMultipleLabelProps<Value> | SelectMultipleIconProps<Value>;\n\nexport type SelectProps<Value extends string = string> =\n SelectBaseProps<Value> &\n SelectAccessibleName &\n (SelectSingleValueProps<Value> | SelectMultipleValueProps<Value>);\n\n// The closed wa-select's disclosure glyph: Web Awesome's system `chevron-down`,\n// Font Awesome Free 7.0.0 by @fontawesome (https://fontawesome.com), licensed\n// CC BY 4.0 (https://fontawesome.com/license/free). The placeholder draws the\n// same path so the loading box matches the live control without registering\n// Web Awesome.\nfunction SelectChevron() {\n return (\n <svg viewBox=\"0 0 448 512\" aria-hidden=\"true\">\n <path d=\"M201.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 338.7 54.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z\"></path>\n </svg>\n );\n}\n\nexport function Select<Value extends string>(props: SelectProps<Value>) {\n const {\n name,\n label,\n ariaLabel,\n choices,\n className = '',\n placeholderText,\n hint,\n disabled = false,\n fitMenu = false,\n placeholder = false,\n presentation = 'form',\n size = 'default',\n triggerWidth,\n caret = true,\n focusRingOwner = 'select',\n labelMaxWidth,\n slot,\n } = props;\n const multiple = props.multiple === true;\n const values: readonly Value[] = props.multiple ? props.value : [props.value];\n const renderSelected = props.multiple ? undefined : props.renderSelected;\n const selectedPresentation: SelectSelectedPresentation =\n props.selectedPresentation ?? 'label';\n // A multiple icon-only trigger shows a fixed icon naming the menu's\n // purpose instead of a selected choice's icon.\n const iconTrigger =\n props.multiple && props.selectedPresentation === 'icon-only';\n const triggerIcon = iconTrigger ? props.triggerIcon : undefined;\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 data-presentation={presentation}\n data-size={size}\n data-trigger-width={triggerWidth}\n data-caret={caret ? undefined : 'false'}\n data-selected-presentation={selectedPresentation}\n data-focus-ring-owner={focusRingOwner}\n aria-busy=\"true\"\n style={\n labelMaxWidth === undefined\n ? undefined\n : `--kui-select-label-max-width:${labelMaxWidth}px`\n }\n slot={slot}\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={em(10)} />\n <span class=\"kui-select__placeholder-chevron\" aria-hidden=\"true\">\n <SelectChevron />\n </span>\n </span>\n {hint && <span class=\"kui-select__placeholder-hint\">{hint}</span>}\n </div>\n );\n }\n // A multiple Select summarizes its choices in the display text instead of\n // leading with one selected icon.\n const selected = multiple\n ? undefined\n : choices.find((choice) => choice.value === values[0] && !choice.disabled);\n const chosenCount = iconTrigger\n ? choices.filter(\n (choice) => !choice.disabled && values.includes(choice.value),\n ).length\n : 0;\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>, index: number) => (\n <>\n {/* Web Awesome sets the divider's role and aria-orientation on its\n host once, so a template that omits them would lose them to the\n next kerf re-render's morph for good. Render them explicitly, with\n the orientation it reflects (see the wa-select note below). */}\n {choice.separatorBefore && index > 0 && (\n <wa-divider\n orientation=\"horizontal\"\n role=\"separator\"\n aria-orientation=\"horizontal\"\n ></wa-divider>\n )}\n <wa-option\n value={choice.value}\n selected={multiple && !choice.disabled && values.includes(choice.value)}\n disabled={choice.disabled}\n title={choice.disabled ? choice.disabledReason : undefined}\n >\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 // Web Awesome names its shadow combobox from the label, not the host's\n // aria-label. Keep ariaLabel-only names available without visible chrome.\n // A multiple Select's value is its selected options (the value attribute\n // holds only one string), kept in sync by @kerfjs/ui/select/register.\n // size/appearance/placement are Web Awesome's defaults, which it reflects\n // onto the host; rendering them keeps a re-render's morph from stripping\n // them and forcing a Lit update to put them back.\n return (\n <wa-select\n size=\"m\"\n appearance=\"outlined\"\n placement=\"bottom\"\n class={`kui-select${renderSelected ? ' kui-select--custom-selected' : ''}${fitMenu ? ' kui-select--fit-menu' : ''}${!label ? ' kui-select--label-hidden' : ''} ${className}`.trim()}\n data-component=\"select\"\n data-presentation={presentation}\n data-size={size}\n data-trigger-width={triggerWidth}\n data-caret={caret ? undefined : 'false'}\n data-selected-presentation={selectedPresentation}\n data-focus-ring-owner={focusRingOwner}\n name={name}\n label={label || ariaLabel}\n aria-label={ariaLabel}\n multiple={multiple}\n value={multiple ? undefined : values[0]}\n placeholder={placeholderText}\n hint={hint}\n disabled={disabled}\n style={\n labelMaxWidth === undefined\n ? undefined\n : `--kui-select-label-max-width:${labelMaxWidth}px`\n }\n slot={slot}\n >\n {iconTrigger && (\n <>\n {/* The accessible name ends with the chosen labels, which\n @kerfjs/ui/select/register writes into the summary. */}\n <span slot=\"label\" data-key={`${name}:trigger-label`}>\n {label || ariaLabel}\n <span class=\"kui-select__name-summary\" data-morph-skip></span>\n </span>\n <span\n data-key={`${name}:trigger-icon`}\n slot=\"start\"\n class=\"kui-select__icon kui-select__icon--selected kui-select__trigger-icon\"\n >\n {triggerIcon}\n </span>\n {chosenCount > 0 && (\n <Badge slot=\"end\" tone=\"brand\" size=\"compact\" ariaHidden>\n {chosenCount}\n </Badge>\n )}\n </>\n )}\n {selected &&\n (renderSelected ? (\n <span\n data-key={`${name}:${values[0]}:custom-selected`}\n slot=\"start\"\n class=\"kui-select__custom-selected\"\n >\n <span class=\"kui-select__custom-selected-content\">\n {renderSelected(selected)}\n </span>\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 {props.multiple && (props.selectAllLabel || props.clearLabel) && (\n <div\n class=\"kui-select__actions\"\n role=\"group\"\n aria-label={label || ariaLabel}\n >\n {props.selectAllLabel && (\n <button\n class=\"kui-select__action\"\n type=\"button\"\n data-select-action=\"all\"\n >\n {props.selectAllLabel}\n </button>\n )}\n {props.clearLabel && (\n <button\n class=\"kui-select__action\"\n type=\"button\"\n data-select-action=\"clear\"\n >\n {props.clearLabel}\n </button>\n )}\n </div>\n )}\n </wa-select>\n );\n}\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/wire-scroll-dividers.ts"],"names":["view"],"mappings":"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","file":"chunk-JCV4GXWB.js","sourcesContent":["/**\n * An app-owned scroll arrangement outside a `Pane`: the `id` of the element\n * that scrolls and the `id`s of the pinned chrome on each physical side of it.\n * Each named chrome element shows its divider on the side facing the scroller\n * while content is scrolled away beyond that side. Ids are resolved below the\n * wired root on every refresh, so a re-render that replaces an element keeps\n * the pairing.\n */\nexport interface ScrollDividerTarget {\n /** The `id` of the scrolling element. */\n scroller: string;\n /** Chrome above the scroller: shows its bottom divider once scrolled down. */\n top?: string;\n /**\n * Chrome right of the scroller: shows its left divider while content is\n * hidden beyond the scroller's right edge (never when nothing overflows).\n */\n right?: string;\n /**\n * Chrome below the scroller: shows its top divider while content is hidden\n * beyond the scroller's bottom edge (never when nothing overflows).\n */\n bottom?: string;\n /** Chrome left of the scroller: shows its right divider once scrolled right. */\n left?: string;\n}\n\nexport interface WireScrollDividersOptions {\n /**\n * App-owned scroll arrangements to pair beyond the ones found by structure\n * (every `Pane`'s header and footer around its content, every `NavStack`'s\n * and `TabScaffold`'s chrome around its active region, and every `TabBar`\n * strip).\n */\n targets?: readonly ScrollDividerTarget[];\n}\n\ntype Edge = 't' | 'r' | 'b' | 'l';\n\nconst EDGES: readonly Edge[] = ['t', 'r', 'b', 'l'];\n\n/** The side of a chrome element that faces a scroller it sits on `edge` of. */\nconst FACING: Record<Edge, Edge> = { t: 'b', r: 'l', b: 't', l: 'r' };\n\nconst TARGET_EDGES: Record<Edge, 'top' | 'right' | 'bottom' | 'left'> = {\n t: 'top',\n r: 'right',\n b: 'bottom',\n l: 'left',\n};\n\n/** On a scroller: the edges beyond which content is currently hidden. */\nconst SCROLL_OVERFLOW = 'data-scroll-overflow';\n/** On a chrome element: its sides that currently show a scroll divider. */\nconst SCROLL_DIVIDER = 'data-scroll-divider';\n\n/**\n * Scroll distance, in px, that must be exceeded to count as \"away from an\n * edge\": `scrollWidth`/`scrollHeight` are rounded to whole pixels while the\n * scroll position is fractional, so a scroller at its end can report up to a\n * pixel still to go.\n */\nconst THRESHOLD = 1;\n\ninterface Pairing {\n scroller: HTMLElement;\n chrome: Partial<Record<Edge, HTMLElement>>;\n}\n\n/** A double-quoted CSS attribute-selector value. */\nconst quoted = (value: string) =>\n `\"${value.replaceAll('\\\\', '\\\\\\\\').replaceAll('\"', '\\\\\"')}\"`;\n\n/** Elements matching `selector` at and below root. */\nfunction within<T extends Element>(\n root: HTMLElement | Document,\n selector: string,\n): T[] {\n const found = [...root.querySelectorAll<T>(selector)];\n if (root.nodeType === 1 && (root as HTMLElement).matches(selector))\n found.unshift(root as unknown as T);\n return found;\n}\n\nconst directChild = (parent: Element, selector: string) =>\n [...parent.children].find((child): child is HTMLElement =>\n child.matches(selector),\n );\n\nconst PANE_CHROME = {\n t: '.kui-pane__header, .kui-pane__toolbar',\n b: '.kui-pane__footer',\n} as const;\n\n/** A NavStack's live (not cross-fading copy) chrome on `edge`. */\nconst NAV_STACK_CHROME = {\n t: '.kui-nav-stack__chrome:not([data-nav-chrome-copy])',\n b: '.kui-nav-stack__bottom:not([data-nav-chrome-copy])',\n} as const;\n\n/** A NavStack's active view: the top entry, never one sliding out. */\nfunction activeView(stack: Element): HTMLElement | undefined {\n const viewport = directChild(stack, '.kui-nav-stack__viewport');\n if (!viewport) return undefined;\n return [...viewport.children]\n .filter((child): child is HTMLElement =>\n child.matches(\n '.kui-nav-stack__view[data-nav-active=\"true\"]:not([data-nav-exiting=\"true\"])',\n ),\n )\n .at(-1);\n}\n\n/** A TabScaffold's shown scene. */\nfunction activeScene(scaffold: Element): HTMLElement | undefined {\n const scenes = directChild(scaffold, '.kui-tab-scaffold__scenes');\n return scenes\n ? directChild(scenes, '.kui-tab-scaffold__scene[data-active=\"true\"]')\n : undefined;\n}\n\n/**\n * The elements that may scroll against a layout region's `edge` (the top or\n * bottom of a NavStack view or a TabScaffold scene): the region itself, then,\n * through a sole child that puts no chrome of its own on that edge, a Pane's\n * content slot or a nested NavStack's or TabScaffold's active region. Every\n * candidate is paired with the layout's chrome; one that does not overflow\n * reports nothing, so the chrome keys on whichever element actually scrolls.\n * A sole child with chrome on that edge (a Pane header, a nested NavStack's\n * top chrome, a TabScaffold's bar) stops the walk: that chrome draws its own\n * divider against its own content.\n */\nfunction regionScrollers(region: HTMLElement, edge: 't' | 'b'): HTMLElement[] {\n const found: HTMLElement[] = [];\n let current: HTMLElement | undefined = region;\n while (current) {\n found.push(current);\n if (current.children.length !== 1) break;\n const child: Element = current.children[0]!;\n if (child.matches('.kui-pane')) {\n current = directChild(child, PANE_CHROME[edge])\n ? undefined\n : directChild(child, '.kui-pane__content');\n if (current) found.push(current);\n break;\n }\n if (child.matches('.kui-nav-stack'))\n current = directChild(child, NAV_STACK_CHROME[edge])\n ? undefined\n : activeView(child);\n else if (child.matches('.kui-tab-scaffold') && edge === 't')\n current = activeScene(child);\n else current = undefined;\n }\n return found;\n}\n\n/** Canonical top/right/bottom/left string of the given edges. */\nconst sides = (edges: ReadonlySet<Edge>) =>\n EDGES.filter((edge) => edges.has(edge)).join('');\n\n/**\n * Which edges of `scroller` currently have content hidden beyond them. Nothing\n * overflows when the content fits, so the far edges report no divider then.\n * Horizontal edges are physical, so a right-to-left scroller (whose\n * `scrollLeft` runs from the negative maximum to 0) reports the same sides.\n */\nfunction measure(scroller: HTMLElement): string {\n const edges = new Set<Edge>();\n const maxY = scroller.scrollHeight - scroller.clientHeight;\n if (maxY > THRESHOLD) {\n if (scroller.scrollTop > THRESHOLD) edges.add('t');\n if (maxY - scroller.scrollTop > THRESHOLD) edges.add('b');\n }\n const maxX = scroller.scrollWidth - scroller.clientWidth;\n if (maxX > THRESHOLD) {\n const view = scroller.ownerDocument.defaultView;\n const rtl = view?.getComputedStyle(scroller).direction === 'rtl';\n const left = rtl ? maxX + scroller.scrollLeft : scroller.scrollLeft;\n if (left > THRESHOLD) edges.add('l');\n if (maxX - left > THRESHOLD) edges.add('r');\n }\n return sides(edges);\n}\n\ntype StateAttribute = typeof SCROLL_OVERFLOW | typeof SCROLL_DIVIDER;\n\n/** Set (or, for an empty value, remove) one of this wiring's attributes. */\nfunction write(element: Element, name: StateAttribute, value: string) {\n if (element.getAttribute(name) === (value || null)) return;\n if (name === SCROLL_OVERFLOW) {\n if (value) element.setAttribute(SCROLL_OVERFLOW, value);\n else element.removeAttribute(SCROLL_OVERFLOW);\n } else if (value) element.setAttribute(SCROLL_DIVIDER, value);\n else element.removeAttribute(SCROLL_DIVIDER);\n}\n\n/**\n * Wire scroll dividers below `root`: a divider between pinned chrome and the\n * content that scrolls beside it shows only while content is scrolled away\n * from that edge. Near edges (top, left) hide at the scroll start; far edges\n * (bottom, right) hide at the scroll end and whenever nothing overflows.\n *\n * The wiring only reports scroll state; each component draws its own divider\n * from it. It writes `data-scroll-overflow` (the edges with hidden content, in\n * canonical `t`/`r`/`b`/`l` order) on each scroller, and `data-scroll-divider`\n * (the sides to draw) on each paired chrome element:\n *\n * - every `Pane` with a header or footer: its header shows a bottom divider and\n * its footer a top divider (drawn by the Pane, per its `chromeDividers`);\n * - every `NavStack`'s top chrome and bottom toolbar around its active view,\n * and every `TabScaffold`'s bar under its active scene: the chrome shows a\n * bottom (top chrome) or top (bottom toolbar, bar) divider. The scroller is\n * whichever element actually scrolls there: the view or scene itself, or,\n * through a sole child with no chrome of its own on that edge, a `Pane`'s\n * content or a nested `NavStack` / `TabScaffold` region (a Pane's own header\n * or footer draws that boundary instead);\n * - every `TabBar` strip: the bar draws a divider on each side of the strip\n * whose tabs are scrolled out of view;\n * - each app-owned `targets` pairing: a `Toolbar` or `List` named as chrome\n * draws the divider on its facing side.\n *\n * Structure is re-read after every DOM change below root (a re-render that\n * drops the attributes gets them back before paint), scroll is tracked with\n * one capturing listener, and size changes of each scroller and its children\n * with a `ResizeObserver`. Returns a disposer that removes every attribute it\n * wrote. See `docs/23-app-layouts.md` §3.7.\n */\nexport function wireScrollDividers(\n root: HTMLElement | Document,\n { targets = [] }: WireScrollDividersOptions = {},\n): () => void {\n const ownerDocument = (\n root.nodeType === 9 ? (root as Document) : root.ownerDocument\n )!;\n const view = ownerDocument.defaultView;\n let disposed = false;\n let pairings: Pairing[] = [];\n const overflow = new Map<HTMLElement, string>();\n /** Every element this wiring has written, with what it wrote. */\n const written = new Map<Element, Map<StateAttribute, string>>();\n\n const byId = (id: string | undefined) => {\n if (!id) return undefined;\n const [match] = within<HTMLElement>(root, `[id=${quoted(id)}]`);\n return match;\n };\n\n const collect = (): Pairing[] => {\n const found: Pairing[] = [];\n for (const pane of within<HTMLElement>(root, '.kui-pane')) {\n const scroller = directChild(pane, '.kui-pane__content');\n const header = directChild(pane, PANE_CHROME.t);\n const footer = directChild(pane, PANE_CHROME.b);\n if (scroller && (header || footer))\n found.push({ scroller, chrome: { t: header, b: footer } });\n }\n const pairRegion = (\n region: HTMLElement | undefined,\n edge: 't' | 'b',\n chrome: HTMLElement | undefined,\n ) => {\n if (!region || !chrome) return;\n for (const scroller of regionScrollers(region, edge))\n found.push({ scroller, chrome: { [edge]: chrome } });\n };\n for (const stack of within<HTMLElement>(root, '.kui-nav-stack')) {\n const view = activeView(stack);\n for (const edge of ['t', 'b'] as const)\n pairRegion(view, edge, directChild(stack, NAV_STACK_CHROME[edge]));\n }\n for (const scaffold of within<HTMLElement>(root, '.kui-tab-scaffold'))\n pairRegion(\n activeScene(scaffold),\n 'b',\n directChild(scaffold, '.kui-tab-scaffold__bar'),\n );\n for (const strip of within<HTMLElement>(root, '[data-kui-tab-list]'))\n found.push({ scroller: strip, chrome: {} });\n for (const target of targets) {\n const scroller = byId(target.scroller);\n if (!scroller) continue;\n const chrome: Pairing['chrome'] = {};\n for (const edge of EDGES) chrome[edge] = byId(target[TARGET_EDGES[edge]]);\n found.push({ scroller, chrome });\n }\n return found;\n };\n\n /** Write every paired element's attributes from the measured overflow. */\n const apply = () => {\n const current = new Map<Element, Map<StateAttribute, string>>();\n const dividers = new Map<HTMLElement, Set<Edge>>();\n for (const { scroller, chrome } of pairings) {\n const edges = overflow.get(scroller)!;\n (\n current.get(scroller) ?? current.set(scroller, new Map()).get(scroller)!\n ).set(SCROLL_OVERFLOW, edges);\n for (const edge of EDGES) {\n const element = chrome[edge];\n if (!element) continue;\n const shown = dividers.get(element) ?? new Set<Edge>();\n dividers.set(element, shown);\n if (edges.includes(edge)) shown.add(FACING[edge]);\n }\n }\n for (const [element, shown] of dividers)\n (\n current.get(element) ?? current.set(element, new Map()).get(element)!\n ).set(SCROLL_DIVIDER, sides(shown));\n // Anything written before that is no longer paired gets its attributes back.\n for (const [element, values] of written)\n for (const name of values.keys())\n if (!current.get(element)?.has(name)) write(element, name, '');\n written.clear();\n for (const [element, values] of current) {\n written.set(element, values);\n for (const [name, value] of values) write(element, name, value);\n }\n };\n\n const observed = new Set<Element>();\n const resizeObserver = view?.ResizeObserver\n ? new view.ResizeObserver((entries) => {\n if (disposed) return;\n const scrollers = new Set(pairings.map(({ scroller }) => scroller));\n for (const { target } of entries) {\n const scroller = scrollers.has(target as HTMLElement)\n ? (target as HTMLElement)\n : target.parentElement;\n if (scroller && scrollers.has(scroller))\n overflow.set(scroller, measure(scroller));\n }\n apply();\n })\n : undefined;\n\n const observeSizes = () => {\n if (!resizeObserver) return;\n const wanted = new Set<Element>();\n for (const { scroller } of pairings) {\n wanted.add(scroller);\n for (const child of scroller.children) wanted.add(child);\n }\n for (const element of observed)\n if (!wanted.has(element)) {\n resizeObserver.unobserve(element);\n observed.delete(element);\n }\n for (const element of wanted)\n if (!observed.has(element)) {\n resizeObserver.observe(element);\n observed.add(element);\n }\n };\n\n const refresh = () => {\n pairings = collect();\n overflow.clear();\n for (const { scroller } of pairings)\n overflow.set(scroller, measure(scroller));\n observeSizes();\n apply();\n };\n\n const onScroll = (event: Event) => {\n const scroller = event.target as HTMLElement;\n if (!overflow.has(scroller)) return;\n const edges = measure(scroller);\n if (edges === overflow.get(scroller)) return;\n overflow.set(scroller, edges);\n apply();\n };\n\n const mutationObserver = view?.MutationObserver\n ? new view.MutationObserver((records) => {\n // A re-render that only dropped or changed attributes this wiring\n // owns gets them back without re-measuring; structure changes\n // re-read every pairing.\n if (\n records.every(\n ({ type, attributeName }) =>\n type === 'attributes' &&\n (attributeName === SCROLL_OVERFLOW ||\n attributeName === SCROLL_DIVIDER),\n )\n )\n apply();\n else refresh();\n })\n : undefined;\n\n refresh();\n root.addEventListener('scroll', onScroll, { capture: true, passive: true });\n mutationObserver?.observe(root, {\n subtree: true,\n childList: true,\n attributes: true,\n // The shown NavStack view and TabScaffold scene change by attribute.\n attributeFilter: [\n SCROLL_OVERFLOW,\n SCROLL_DIVIDER,\n 'id',\n 'class',\n 'data-nav-active',\n 'data-nav-exiting',\n 'data-active',\n ],\n });\n\n return () => {\n if (disposed) return;\n disposed = true;\n mutationObserver?.disconnect();\n resizeObserver?.disconnect();\n root.removeEventListener('scroll', onScroll, { capture: true });\n for (const [element, values] of written)\n for (const name of values.keys()) write(element, name, '');\n written.clear();\n overflow.clear();\n observed.clear();\n pairings = [];\n };\n}\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/panel-toolbar-group.ts","../src/toolbar-control-group.tsx"],"names":[],"mappings":"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","file":"chunk-NXWE5S57.js","sourcesContent":["import { isSafeHtml, type SafeHtml } from 'kerfjs';\n\n// A render-time annotation, shared across separately bundled UI subpaths.\n// It never appears in the DOM or changes the group's visual treatment.\nconst RELOCATE_ON_COLLAPSE = Symbol.for(\n '@kerfjs/ui.ToolbarControlGroup.relocateOnCollapse',\n);\n\nexport function markRelocatableGroup(group: SafeHtml): SafeHtml {\n Object.defineProperty(group, RELOCATE_ON_COLLAPSE, { value: true });\n return group;\n}\n\nexport function isRelocatableGroup(value: unknown): value is SafeHtml {\n return (\n isSafeHtml(value) &&\n (value as SafeHtml & { [RELOCATE_ON_COLLAPSE]?: boolean })[\n RELOCATE_ON_COLLAPSE\n ] === true\n );\n}\n","import { LoadingSpinner } from './loading-spinner.js';\nimport { markRelocatableGroup } from './panel-toolbar-group.js';\nimport type { KerfUiContent } from './semantic-content.js';\n\nexport type ToolbarControlGroupAppearance = 'contained' | 'borderless';\nexport type ToolbarControlGroupTone = 'default' | 'dark';\nexport type ToolbarControlGroupButtonAppearance = 'plain' | 'push';\nexport type ToolbarControlGroupShape = 'pill' | 'rounded';\nexport type ToolbarControlGroupSize = 'default' | 'compact';\nexport type ToolbarControlGroupDensity = 'comfortable' | 'tight';\nexport type ToolbarControlGroupContent =\n 'icon' | 'text' | 'mixed' | 'avatar' | 'search';\nexport type ToolbarControlGroupFocusRing = 'control' | 'outline' | 'halo';\nexport type ToolbarControlGroupSelectedChrome = 'raised' | 'filled' | 'outline';\nexport type ToolbarControlGroupSelectedTone = 'brand' | 'neutral' | 'pop';\nexport type ToolbarControlGroupOverflow = 'visible' | 'scroll';\nexport type ToolbarControlGroupMenuInset = 'standard' | 'compact' | 'list-zero';\nexport type ToolbarControlGroupVisibility = 'always' | 'compact-only';\n\nexport interface ToolbarActionLinkProps {\n href: string;\n label: string;\n icon?: KerfUiContent;\n /** Optional machine-readable detail hidden visually but included in the default accessible name. */\n detail?: string;\n /** Override the accessible name when surrounding context is needed. */\n ariaLabel?: string;\n /** Open in a new tab with a safe rel and announce that behavior. */\n external?: boolean;\n className?: string;\n /** Native named-slot assignment when composed inside a web component. */\n slot?: string;\n}\n\n/** A semantic anchor with ToolbarControlGroup-owned action geometry. */\nexport function ToolbarActionLink({\n href,\n label,\n icon,\n detail,\n ariaLabel,\n external = false,\n className = '',\n slot,\n}: ToolbarActionLinkProps) {\n const accessibleLabel =\n ariaLabel ??\n `${label}${detail ? `, ${detail}` : ''}${external ? ' (opens in new tab)' : ''}`;\n return (\n <a\n class={`kui-toolbar-action-link ${className}`.trim()}\n data-component=\"toolbar-action-link\"\n href={href}\n target={external ? '_blank' : undefined}\n rel={external ? 'noopener noreferrer' : undefined}\n aria-label={accessibleLabel}\n slot={slot}\n >\n {icon}\n <span>{label}</span>\n {detail ? <code aria-hidden=\"true\">{detail}</code> : null}\n </a>\n );\n}\n\nexport interface ToolbarControlGroupProps {\n children: KerfUiContent;\n label?: string;\n className?: string;\n expanded?: boolean;\n single?: boolean;\n appearance?: ToolbarControlGroupAppearance;\n tone?: ToolbarControlGroupTone;\n buttonAppearance?: ToolbarControlGroupButtonAppearance;\n /** Corner shape: fully round `pill` (default) or a softer `rounded` rectangle. */\n shape?: ToolbarControlGroupShape;\n size?: ToolbarControlGroupSize;\n density?: ToolbarControlGroupDensity;\n content?: ToolbarControlGroupContent;\n /** Whether controls paint focus individually or the group paints an outline/halo on focus-within. */\n focusRing?: ToolbarControlGroupFocusRing;\n selectedChrome?: ToolbarControlGroupSelectedChrome;\n selectedTone?: ToolbarControlGroupSelectedTone;\n /** Size a nested Web Awesome dropdown trigger as part of this group. */\n nestedDropdown?: boolean;\n /** Configure the nested dropdown menu inset without consumer ::part() CSS. */\n menuInset?: ToolbarControlGroupMenuInset;\n /** Keep an overlong row of actions inside the available width with horizontal scrolling. */\n overflow?: ToolbarControlGroupOverflow;\n /** Responsive visibility owned by the enclosing Toolbar container. */\n visibility?: ToolbarControlGroupVisibility;\n /** Move this group into the work-area toolbar when its panel collapses. */\n relocateOnCollapse?: boolean;\n /** Add contrast behind photo-backed avatar content. */\n scrim?: boolean;\n /** Block the group's controls and show a spinner without changing its dimensions. */\n busy?: boolean;\n /** Announced status while busy; defaults to “Working”. */\n busyLabel?: string;\n /**\n * Avatar image URL. A single-control group paints it on the group; a\n * multi-control group paints it only on the pressed selection highlight.\n */\n avatarImage?: string;\n /** Native named-slot assignment when composed inside a web component. */\n slot?: string;\n}\n\nexport function ToolbarControlGroup({\n children,\n label,\n className = '',\n expanded = false,\n single = false,\n appearance = 'contained',\n tone = 'default',\n buttonAppearance = 'plain',\n shape = 'pill',\n size = 'default',\n density = 'comfortable',\n content = 'icon',\n focusRing = 'control',\n selectedChrome = 'raised',\n selectedTone = 'brand',\n nestedDropdown = false,\n menuInset = 'standard',\n overflow = 'visible',\n visibility = 'always',\n relocateOnCollapse = false,\n scrim = false,\n busy = false,\n busyLabel = 'Working',\n avatarImage,\n slot,\n}: ToolbarControlGroupProps) {\n const group = (\n <div\n class={`kui-toolbar-control-group ${className}`.trim()}\n data-component=\"toolbar-control-group\"\n role={label ? 'group' : undefined}\n aria-label={label}\n data-appearance={appearance}\n data-tone={tone}\n data-button-appearance={buttonAppearance}\n data-expanded={String(expanded)}\n data-single={String(single)}\n data-shape={shape}\n data-size={size}\n data-density={density}\n data-content={content}\n data-focus-ring={focusRing}\n data-selected-chrome={selectedChrome}\n data-selected-tone={selectedTone}\n data-nested-dropdown={String(nestedDropdown)}\n data-menu-inset={menuInset}\n data-overflow={overflow}\n data-visibility={visibility}\n data-scrim={String(scrim)}\n data-busy={String(busy)}\n aria-busy={busy ? 'true' : undefined}\n inert={busy}\n style={\n avatarImage\n ? `--kui-toolbar-avatar-image:url(${JSON.stringify(avatarImage)})`\n : undefined\n }\n slot={slot}\n >\n {children}\n {busy ? (\n <span\n class=\"kui-toolbar-control-group__busy-spinner\"\n aria-hidden=\"true\"\n >\n <LoadingSpinner />\n </span>\n ) : null}\n </div>\n );\n const renderedGroup = relocateOnCollapse\n ? markRelocatableGroup(group)\n : group;\n return busy ? (\n <>\n {renderedGroup}\n <span class=\"kui-toolbar-control-group__busy-status\" role=\"status\">\n {busyLabel}\n </span>\n </>\n ) : (\n renderedGroup\n );\n}\n"]}
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/tab-bar.tsx"],"names":[],"mappings":";;;AAyCO,SAAS,MAAA,CAAO;AAAA,EACrB,EAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,OAAA;AAAA,EACA,QAAA;AAAA,EACA,GAAA;AAAA,EACA,SAAA,GAAY,EAAA;AAAA,EACZ,UAAA;AAAA,EACA,UAAA,GAAa,WAAA;AAAA,EACb,YAAA,GAAe,MAAA;AAAA,EACf,UAAA;AAAA,EACA,iBAAA,GAAoB,UAAA;AAAA,EACpB;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,iBAAA,EAAiB,UAAA;AAAA,MACjB,mBAAA,EAAmB,YAAA;AAAA,MACnB,mBAAA,EAAmB,UAAA;AAAA,MACnB,yBAAA,EAAyB,iBAAA;AAAA,MACzB,YAAA,EAAY,KAAA;AAAA,MACZ,IAAA;AAAA,MAEC,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,CAAA;AAAA,QACzD,GAAA,oBAAO,GAAA,CAAC,KAAA,EAAA,EAAI,KAAA,EAAM,oBAAoB,QAAA,EAAA,GAAA,EAAI;AAAA;AAAA;AAAA,GAC7C;AAEJ","file":"chunk-RKTTF3L4.js","sourcesContent":["import type { KerfUiContent } from './semantic-content.js';\n\nexport type TabActivation = 'automatic' | 'manual';\nexport type TabBarAllocation = 'intrinsic' | 'fill';\nexport type TabBarPresentation = 'rail' | 'segmented' | 'inspector';\nexport type TabBarTrailingPlacement = 'separate' | 'adjacent';\n/** Tablist width where segmented AppTabs switch to icon-only. */\nexport type TabBarIconOnlyAt = 'wide' | 'narrow' | 'compact';\n\nexport interface TabBarProps {\n id: string;\n label: string;\n children: KerfUiContent;\n leading?: KerfUiContent;\n trailing?: KerfUiContent;\n /**\n * Action pinned to the far edge of the bar. Combine with an adjacent `trailing`\n * action when the tab-local and workspace-level actions must remain distinct.\n */\n end?: KerfUiContent;\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 /** How available strip width is allocated across child AppTabs. */\n allocation?: TabBarAllocation;\n /** Named strip chrome for application rails, segmented tabs, or inspectors. */\n presentation?: TabBarPresentation;\n /** Switch segmented AppTabs to icon-only at tablist widths of 832, 704, or 448px. Each tab needs a leading icon. */\n iconOnlyAt?: TabBarIconOnlyAt;\n /** Keep a trailing action beside the final tab or at the far edge of the bar. */\n trailingPlacement?: TabBarTrailingPlacement;\n /** Native named-slot assignment when composed inside a web component. */\n slot?: string;\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 end,\n className = '',\n activation,\n allocation = 'intrinsic',\n presentation = 'rail',\n iconOnlyAt,\n trailingPlacement = 'separate',\n slot,\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 data-allocation={allocation}\n data-presentation={presentation}\n data-icon-only-at={iconOnlyAt}\n data-trailing-placement={trailingPlacement}\n aria-label={label}\n slot={slot}\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 {end && <div class=\"kui-tab-bar__end\">{end}</div>}\n </nav>\n );\n}\n"]}
@@ -1,27 +0,0 @@
1
- import { jsx } from 'kerfjs/jsx-runtime';
2
-
3
- // src/loading-spinner.tsx
4
- function LoadingSpinner({
5
- className = "",
6
- label,
7
- slot
8
- }) {
9
- const slotAttribute = { slot };
10
- return /* @__PURE__ */ jsx(
11
- "svg",
12
- {
13
- ...slotAttribute,
14
- class: `kui-loading-spinner ${className}`.trim(),
15
- "data-component": "loading-spinner",
16
- viewBox: "0 0 24 24",
17
- role: label ? "img" : void 0,
18
- "aria-label": label,
19
- "aria-hidden": label ? void 0 : "true",
20
- children: /* @__PURE__ */ jsx("path", { d: "M12,4a8,8,0,0,1,7.89,6.7A1.53,1.53,0,0,0,21.38,12h0a1.5,1.5,0,0,0,1.48-1.75,11,11,0,0,0-21.72,0A1.5,1.5,0,0,0,2.62,12h0a1.53,1.53,0,0,0,1.49-1.3A8,8,0,0,1,12,4Z" })
21
- }
22
- );
23
- }
24
-
25
- export { LoadingSpinner };
26
-
27
- //# sourceMappingURL=chunk-ZLWQZUGF.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/loading-spinner.tsx"],"names":[],"mappings":";;;AAQO,SAAS,cAAA,CAAe;AAAA,EAC7B,SAAA,GAAY,EAAA;AAAA,EACZ,KAAA;AAAA,EACA;AACF,CAAA,EAAwB;AACtB,EAAA,MAAM,aAAA,GAAgB,EAAE,IAAA,EAAK;AAC7B,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,aAAA;AAAA,MACJ,KAAA,EAAO,CAAA,oBAAA,EAAuB,SAAS,CAAA,CAAA,CAAG,IAAA,EAAK;AAAA,MAC/C,gBAAA,EAAe,iBAAA;AAAA,MACf,OAAA,EAAQ,WAAA;AAAA,MACR,IAAA,EAAM,QAAQ,KAAA,GAAQ,MAAA;AAAA,MACtB,YAAA,EAAY,KAAA;AAAA,MACZ,aAAA,EAAa,QAAQ,MAAA,GAAY,MAAA;AAAA,MAEjC,QAAA,kBAAA,GAAA,CAAC,MAAA,EAAA,EAAK,CAAA,EAAE,kKAAA,EAAmK;AAAA;AAAA,GAC7K;AAEJ","file":"chunk-ZLWQZUGF.js","sourcesContent":["export interface LoadingSpinnerProps {\n className?: string;\n label?: string;\n /** Native named-slot assignment when composed inside a web component. */\n slot?: string;\n}\n\n/** Stable viewBox-centered progress ring based on svg-spinners' MIT-licensed 180-ring. */\nexport function LoadingSpinner({\n className = '',\n label,\n slot,\n}: LoadingSpinnerProps) {\n const slotAttribute = { slot };\n return (\n <svg\n {...slotAttribute}\n class={`kui-loading-spinner ${className}`.trim()}\n data-component=\"loading-spinner\"\n viewBox=\"0 0 24 24\"\n role={label ? 'img' : undefined}\n aria-label={label}\n aria-hidden={label ? undefined : 'true'}\n >\n <path d=\"M12,4a8,8,0,0,1,7.89,6.7A1.53,1.53,0,0,0,21.38,12h0a1.5,1.5,0,0,0,1.48-1.75,11,11,0,0,0-21.72,0A1.5,1.5,0,0,0,2.62,12h0a1.53,1.53,0,0,0,1.49-1.3A8,8,0,0,1,12,4Z\"></path>\n </svg>\n );\n}\n"]}