@kerfjs/ui 5.0.0-beta.57 → 5.0.0-beta.59

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 (79) hide show
  1. package/README.md +29 -6
  2. package/ai/component-catalog.json +51 -16
  3. package/ai/component-catalog.schema.json +16 -0
  4. package/ai/component-composition.json +16 -2
  5. package/ai/components/README.md +2 -2
  6. package/ai/components/popup-menu.md +96 -7
  7. package/ai/components/text.md +3 -3
  8. package/ai/components/token-search-field.md +6 -4
  9. package/ai/components/toolbar-control-group.md +2 -0
  10. package/ai/public-api-signatures-v1.md +67 -97
  11. package/ai/skill.md +6 -2
  12. package/ai/webawesome-jsx-signatures-v1.md +1 -1
  13. package/dist/catalog-resources.d.ts +1 -1
  14. package/dist/catalog.d.ts +1 -1
  15. package/dist/catalog.js +5 -5
  16. package/dist/{chunk-G2RKFVRB.js → chunk-2CCMJTVY.js} +2 -2
  17. package/dist/chunk-2CCMJTVY.js.map +1 -0
  18. package/dist/{chunk-ZIYOJFZD.js → chunk-7JUBXOIV.js} +17 -4
  19. package/dist/chunk-7JUBXOIV.js.map +1 -0
  20. package/dist/chunk-F7F7KRO2.js +187 -0
  21. package/dist/chunk-F7F7KRO2.js.map +1 -0
  22. package/dist/{chunk-XCO6YCYM.js → chunk-QPUPLNNB.js} +16 -5
  23. package/dist/chunk-QPUPLNNB.js.map +1 -0
  24. package/dist/{chunk-63ZWBGE3.js → chunk-RRB26JRJ.js} +25 -3
  25. package/dist/chunk-RRB26JRJ.js.map +1 -0
  26. package/dist/{chunk-NBYTIVHS.js → chunk-UFYZHYWU.js} +118 -12
  27. package/dist/chunk-UFYZHYWU.js.map +1 -0
  28. package/dist/{chunk-WLG6SSNT.js → chunk-UWONG4QE.js} +41 -8
  29. package/dist/chunk-UWONG4QE.js.map +1 -0
  30. package/dist/{chunk-553ASUK6.js → chunk-UX2VVXZ3.js} +2 -2
  31. package/dist/{chunk-553ASUK6.js.map → chunk-UX2VVXZ3.js.map} +1 -1
  32. package/dist/{chunk-24PHKUR3.js → chunk-UXT7TE6B.js} +1 -1
  33. package/dist/chunk-UXT7TE6B.js.map +1 -0
  34. package/dist/{chunk-PWXNJS2B.js → chunk-W4XKTST6.js} +2 -2
  35. package/dist/{chunk-PWXNJS2B.js.map → chunk-W4XKTST6.js.map} +1 -1
  36. package/dist/collapsible-panel.d.ts +8 -8
  37. package/dist/collapsible-panel.js +2 -2
  38. package/dist/collapsible-panel.js.map +1 -1
  39. package/dist/index.d.ts +2 -2
  40. package/dist/index.js +7 -6
  41. package/dist/list-header.js +1 -1
  42. package/dist/nav-stack.js +1 -1
  43. package/dist/{panel-toolbar-BN4x0rth.d.ts → panel-toolbar-DqwtBxQL.d.ts} +10 -11
  44. package/dist/popup-menu.d.ts +31 -3
  45. package/dist/popup-menu.js +1 -1
  46. package/dist/split-view.js +1 -1
  47. package/dist/styles/popup-menu.css +33 -4
  48. package/dist/styles/text.css +8 -0
  49. package/dist/styles/token-search-field.css +29 -0
  50. package/dist/text.d.ts +1 -1
  51. package/dist/text.js +1 -1
  52. package/dist/token-search-field-CCke1yvQ.d.ts +126 -0
  53. package/dist/token-search-field.d.ts +3 -75
  54. package/dist/token-search-field.js +1 -1
  55. package/dist/token-search-model.d.ts +3 -0
  56. package/dist/token-search-model.js +3 -0
  57. package/dist/token-search-model.js.map +1 -0
  58. package/dist/toolbar-control-group.d.ts +3 -1
  59. package/dist/toolbar-control-group.js +1 -1
  60. package/dist/wire-token-search-fields.d.ts +5 -1
  61. package/dist/wire-token-search-fields.js +1 -1
  62. package/dist/workbench.d.ts +5 -5
  63. package/dist/workbench.js +1 -1
  64. package/docs/accessibility.md +14 -0
  65. package/docs/collapsible-panel.md +12 -7
  66. package/docs/component-contract.md +2 -1
  67. package/docs/component-integration.md +8 -1
  68. package/docs/component-selection.md +43 -2
  69. package/docs/layout.md +4 -1
  70. package/docs/workbench.md +12 -11
  71. package/llms.txt +6 -3
  72. package/package.json +5 -1
  73. package/dist/chunk-24PHKUR3.js.map +0 -1
  74. package/dist/chunk-63ZWBGE3.js.map +0 -1
  75. package/dist/chunk-G2RKFVRB.js.map +0 -1
  76. package/dist/chunk-NBYTIVHS.js.map +0 -1
  77. package/dist/chunk-WLG6SSNT.js.map +0 -1
  78. package/dist/chunk-XCO6YCYM.js.map +0 -1
  79. package/dist/chunk-ZIYOJFZD.js.map +0 -1
@@ -1,6 +1,17 @@
1
+ import { isSafeHtml } from 'kerfjs';
1
2
  import { jsxs, jsx } from 'kerfjs/jsx-runtime';
2
3
 
3
- // src/toolbar-control-group.tsx
4
+ // src/panel-toolbar-group.ts
5
+ var RELOCATE_ON_COLLAPSE = /* @__PURE__ */ Symbol.for(
6
+ "@kerfjs/ui.ToolbarControlGroup.relocateOnCollapse"
7
+ );
8
+ function markRelocatableGroup(group) {
9
+ Object.defineProperty(group, RELOCATE_ON_COLLAPSE, { value: true });
10
+ return group;
11
+ }
12
+ function isRelocatableGroup(value) {
13
+ return isSafeHtml(value) && value[RELOCATE_ON_COLLAPSE] === true;
14
+ }
4
15
  function ToolbarActionLink({
5
16
  href,
6
17
  label,
@@ -50,11 +61,12 @@ function ToolbarControlGroup({
50
61
  menuInset = "standard",
51
62
  overflow = "visible",
52
63
  visibility = "always",
64
+ relocateOnCollapse = false,
53
65
  scrim = false,
54
66
  avatarImage,
55
67
  slot
56
68
  }) {
57
- return /* @__PURE__ */ jsx(
69
+ const group = /* @__PURE__ */ jsx(
58
70
  "div",
59
71
  {
60
72
  class: `kui-toolbar-control-group ${className}`.trim(),
@@ -83,8 +95,9 @@ function ToolbarControlGroup({
83
95
  children
84
96
  }
85
97
  );
98
+ return relocateOnCollapse ? markRelocatableGroup(group) : group;
86
99
  }
87
100
 
88
- export { ToolbarActionLink, ToolbarControlGroup };
101
+ export { ToolbarActionLink, ToolbarControlGroup, isRelocatableGroup };
89
102
 
90
- //# sourceMappingURL=chunk-ZIYOJFZD.js.map
103
+ //# sourceMappingURL=chunk-7JUBXOIV.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/panel-toolbar-group.ts","../src/toolbar-control-group.tsx"],"names":[],"mappings":"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","file":"chunk-7JUBXOIV.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 { 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 /**\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 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 style={\n avatarImage\n ? `--kui-toolbar-avatar-image:url(${JSON.stringify(avatarImage)})`\n : undefined\n }\n slot={slot}\n >\n {children}\n </div>\n );\n return relocateOnCollapse ? markRelocatableGroup(group) : group;\n}\n"]}
@@ -0,0 +1,187 @@
1
+ import { signal } from 'kerfjs';
2
+
3
+ // src/token-search-model.ts
4
+ var escapePattern = (text) => text.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
5
+ var quote = (text) => /[\s()"\\]/.test(text) ? `"${text.replaceAll("\\", "\\\\").replaceAll('"', '\\"')}"` : text;
6
+ var unquote = (text) => text.startsWith('"') && text.endsWith('"') ? text.slice(1, -1).replace(/\\(["\\])/g, "$1") : text;
7
+ function createTokenSearchModel({
8
+ rules = [],
9
+ initial = { query: "", tokens: [] },
10
+ evaluate,
11
+ onSubmit
12
+ } = {}) {
13
+ const byName = new Map(rules.map((rule) => [rule.name.toLowerCase(), rule]));
14
+ if (byName.size !== rules.length || rules.some((rule) => !/^[\w-]+$/.test(rule.name)))
15
+ throw new Error("Token search rule names must be unique words");
16
+ const names = [...byName.keys()].map(escapePattern).join("|");
17
+ const pattern = names ? new RegExp(
18
+ `(?:^|[\\s(])((?:${names}):(?:"(?:\\\\.|[^"])*"|[^"\\s()][^\\s()]*))(?=$|[\\s)])`,
19
+ "gi"
20
+ ) : void 0;
21
+ const activePattern = names ? new RegExp(
22
+ `(?:^|[\\s(])((?:${names}):(?:"(?:\\\\.|[^"])*|[^\\s()]*))$`,
23
+ "i"
24
+ ) : void 0;
25
+ const resolve = (raw, offset) => {
26
+ const separator = raw.indexOf(":");
27
+ const kind = raw.slice(0, separator).toLowerCase();
28
+ const rule = byName.get(kind);
29
+ if (!rule || separator < 0) return;
30
+ const input = unquote(raw.slice(separator + 1));
31
+ if (!input) return;
32
+ const parsedValue = rule.parse ? rule.parse(input) : input;
33
+ if (parsedValue === void 0) return;
34
+ return {
35
+ kind,
36
+ parsedValue,
37
+ value: `${kind}:${quote(input)}`,
38
+ label: rule.label?.(parsedValue, input) ?? `${kind}:${input}`,
39
+ offset
40
+ };
41
+ };
42
+ const rehydrate = (token) => {
43
+ const resolved = resolve(token.value, token.offset ?? 0);
44
+ return resolved ? { ...resolved, ...token } : void 0;
45
+ };
46
+ const state = signal({
47
+ query: initial.query,
48
+ tokens: initial.tokens.flatMap((token) => {
49
+ const resolved = rehydrate(token);
50
+ return resolved ? [resolved] : [];
51
+ })
52
+ });
53
+ const editorRevision = signal(0);
54
+ const suggestions = signal([]);
55
+ const result = signal(evaluate?.(state.value));
56
+ let activeStart;
57
+ const refreshSuggestions = () => {
58
+ const match = activePattern?.exec(state.value.query);
59
+ const raw = match?.[1];
60
+ const separator = raw?.indexOf(":") ?? -1;
61
+ const rule = separator < 0 ? void 0 : byName.get(raw.slice(0, separator).toLowerCase());
62
+ const input = separator < 0 ? "" : unquote(raw.slice(separator + 1));
63
+ activeStart = match && raw ? match.index + match[0].lastIndexOf(raw) : void 0;
64
+ suggestions.value = (rule?.suggest?.(input) ?? []).flatMap((candidate) => {
65
+ const value = typeof candidate === "string" ? candidate : candidate.value;
66
+ const token = resolve(`${rule.name}:${quote(value)}`, 0);
67
+ return token ? [
68
+ {
69
+ value: token.value,
70
+ label: typeof candidate === "string" ? token.label : candidate.label
71
+ }
72
+ ] : [];
73
+ });
74
+ };
75
+ const publish = (next) => {
76
+ state.value = next;
77
+ result.value = evaluate?.(next);
78
+ refreshSuggestions();
79
+ };
80
+ refreshSuggestions();
81
+ const edit = (value, commit = false) => {
82
+ let query = "";
83
+ let cursor = 0;
84
+ const added = [];
85
+ const removed = [];
86
+ for (const match of value.query.matchAll(pattern ?? /(?!) /g)) {
87
+ const raw = match[1];
88
+ const start = match.index + match[0].lastIndexOf(raw);
89
+ const end = start + raw.length;
90
+ if (end === value.query.length && !commit && !/\s$/.test(value.query))
91
+ continue;
92
+ const token = resolve(raw, query.length + start - cursor);
93
+ if (!token) continue;
94
+ query += value.query.slice(cursor, start);
95
+ token.offset = query.length;
96
+ added.push(token);
97
+ removed.push({ start, end });
98
+ cursor = end;
99
+ }
100
+ const suffix = value.query.slice(cursor);
101
+ query += added.length && /^\s+$/.test(suffix) ? "" : suffix;
102
+ const existing = value.tokens.flatMap((token) => {
103
+ const resolved = rehydrate(token);
104
+ if (!resolved) return [];
105
+ const offset = token.offset ?? value.query.length;
106
+ return [
107
+ {
108
+ ...resolved,
109
+ offset: offset - removed.reduce(
110
+ (total, range) => total + Math.max(0, Math.min(offset, range.end) - range.start),
111
+ 0
112
+ )
113
+ }
114
+ ];
115
+ });
116
+ const tokens = [...existing, ...added].sort(
117
+ (left, right) => (left.offset ?? 0) - (right.offset ?? 0)
118
+ );
119
+ publish({ query, tokens });
120
+ };
121
+ const choose = (value) => {
122
+ if (!suggestions.value.some((suggestion) => suggestion.value === value) || activeStart === void 0)
123
+ return;
124
+ const token = resolve(value, activeStart);
125
+ if (!token) return;
126
+ const query = state.value.query.slice(0, activeStart);
127
+ publish({ query, tokens: [...state.value.tokens, token] });
128
+ };
129
+ return {
130
+ state,
131
+ editorRevision,
132
+ suggestions,
133
+ result,
134
+ edit,
135
+ submit(value) {
136
+ edit(value, true);
137
+ onSubmit?.(state.value, result.value);
138
+ },
139
+ choose,
140
+ expandToken(value) {
141
+ const index = state.value.tokens.findIndex(
142
+ (token) => token.value === value
143
+ );
144
+ if (index < 0) return;
145
+ const offset = Math.max(
146
+ 0,
147
+ Math.min(
148
+ state.value.query.length,
149
+ state.value.tokens[index].offset ?? state.value.query.length
150
+ )
151
+ );
152
+ const insertion = `${value} `;
153
+ publish({
154
+ query: `${state.value.query.slice(0, offset)}${insertion}${state.value.query.slice(offset)}`,
155
+ tokens: state.value.tokens.flatMap(
156
+ (token, at) => at === index ? [] : [
157
+ {
158
+ ...token,
159
+ offset: (token.offset ?? 0) + (at > index ? insertion.length : 0)
160
+ }
161
+ ]
162
+ )
163
+ });
164
+ },
165
+ remove(value) {
166
+ const index = state.value.tokens.findIndex(
167
+ (token) => token.value === value
168
+ );
169
+ if (index < 0) return;
170
+ publish({
171
+ ...state.value,
172
+ tokens: state.value.tokens.filter((_, at) => at !== index)
173
+ });
174
+ },
175
+ clear() {
176
+ publish({ query: "", tokens: [] });
177
+ editorRevision.value++;
178
+ },
179
+ dismiss() {
180
+ suggestions.value = [];
181
+ }
182
+ };
183
+ }
184
+
185
+ export { createTokenSearchModel };
186
+
187
+ //# sourceMappingURL=chunk-F7F7KRO2.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/token-search-model.ts"],"names":[],"mappings":"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","file":"chunk-F7F7KRO2.js","sourcesContent":["import { type Signal, signal } from 'kerfjs';\n\nimport type {\n TokenSearchFieldValue,\n TokenSearchToken,\n} from './token-search-field.js';\n\nexport interface TokenSearchRule {\n /** The word before `:` (for example `tag` or `status`). */\n name: string;\n /** Return a canonical value, or undefined to leave invalid input as text. */\n parse?: (input: string) => string | undefined;\n /** Label for a committed chip. Defaults to `name:input`. */\n label?: (value: string, input: string) => string;\n /** Suggestions for the unfinished value after `name:`. */\n suggest?: (\n input: string,\n ) => readonly (string | { value: string; label: string })[];\n}\n\nexport interface TokenSearchResolvedToken extends TokenSearchToken {\n kind: string;\n parsedValue: string;\n}\n\nexport interface TokenSearchState {\n query: string;\n tokens: TokenSearchResolvedToken[];\n}\n\nexport interface TokenSearchSuggestion {\n value: string;\n label: string;\n}\n\nexport interface TokenSearchModel<Result = unknown> {\n state: Signal<TokenSearchState>;\n /** Changes when a model action must replace DOM-owned editor text. */\n editorRevision: Signal<number>;\n suggestions: Signal<readonly TokenSearchSuggestion[]>;\n result: Signal<Result | undefined>;\n edit(value: TokenSearchFieldValue, commit?: boolean): void;\n submit(value: TokenSearchFieldValue): void;\n choose(value: string): void;\n expandToken(value: string): void;\n remove(value: string): void;\n clear(): void;\n dismiss(): void;\n}\n\nexport interface TokenSearchModelOptions<Result> {\n rules?: readonly TokenSearchRule[];\n initial?: TokenSearchFieldValue;\n /** Runs after every state change, including initial state. */\n evaluate?: (state: TokenSearchState) => Result;\n onSubmit?: (state: TokenSearchState, result: Result | undefined) => void;\n}\n\nconst escapePattern = (text: string) =>\n text.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\$&');\nconst quote = (text: string) =>\n /[\\s()\"\\\\]/.test(text)\n ? `\"${text.replaceAll('\\\\', '\\\\\\\\').replaceAll('\"', '\\\\\"')}\"`\n : text;\nconst unquote = (text: string) =>\n text.startsWith('\"') && text.endsWith('\"')\n ? text.slice(1, -1).replace(/\\\\([\"\\\\])/g, '$1')\n : text;\n\n/** Opt-in state, token parsing, suggestions, and evaluation for TokenSearchField. */\nexport function createTokenSearchModel<Result = unknown>({\n rules = [],\n initial = { query: '', tokens: [] },\n evaluate,\n onSubmit,\n}: TokenSearchModelOptions<Result> = {}): TokenSearchModel<Result> {\n const byName = new Map(rules.map((rule) => [rule.name.toLowerCase(), rule]));\n if (\n byName.size !== rules.length ||\n rules.some((rule) => !/^[\\w-]+$/.test(rule.name))\n )\n throw new Error('Token search rule names must be unique words');\n const names = [...byName.keys()].map(escapePattern).join('|');\n const pattern = names\n ? new RegExp(\n `(?:^|[\\\\s(])((?:${names}):(?:\"(?:\\\\\\\\.|[^\"])*\"|[^\"\\\\s()][^\\\\s()]*))(?=$|[\\\\s)])`,\n 'gi',\n )\n : undefined;\n const activePattern = names\n ? new RegExp(\n `(?:^|[\\\\s(])((?:${names}):(?:\"(?:\\\\\\\\.|[^\"])*|[^\\\\s()]*))$`,\n 'i',\n )\n : undefined;\n\n const resolve = (\n raw: string,\n offset: number,\n ): TokenSearchResolvedToken | undefined => {\n const separator = raw.indexOf(':');\n const kind = raw.slice(0, separator).toLowerCase();\n const rule = byName.get(kind);\n if (!rule || separator < 0) return;\n const input = unquote(raw.slice(separator + 1));\n if (!input) return;\n const parsedValue = rule.parse ? rule.parse(input) : input;\n if (parsedValue === undefined) return;\n return {\n kind,\n parsedValue,\n value: `${kind}:${quote(input)}`,\n label: rule.label?.(parsedValue, input) ?? `${kind}:${input}`,\n offset,\n };\n };\n\n const rehydrate = (\n token: TokenSearchToken,\n ): TokenSearchResolvedToken | undefined => {\n const resolved = resolve(token.value, token.offset ?? 0);\n return resolved ? { ...resolved, ...token } : undefined;\n };\n\n const state = signal<TokenSearchState>({\n query: initial.query,\n tokens: initial.tokens.flatMap((token) => {\n const resolved = rehydrate(token);\n return resolved ? [resolved] : [];\n }),\n });\n const editorRevision = signal(0);\n const suggestions = signal<readonly TokenSearchSuggestion[]>([]);\n const result = signal<Result | undefined>(evaluate?.(state.value));\n let activeStart: number | undefined;\n\n const refreshSuggestions = () => {\n const match = activePattern?.exec(state.value.query);\n const raw = match?.[1];\n const separator = raw?.indexOf(':') ?? -1;\n const rule =\n separator < 0\n ? undefined\n : byName.get(raw!.slice(0, separator).toLowerCase());\n const input = separator < 0 ? '' : unquote(raw!.slice(separator + 1));\n activeStart =\n match && raw ? match.index + match[0].lastIndexOf(raw) : undefined;\n suggestions.value = (rule?.suggest?.(input) ?? []).flatMap((candidate) => {\n const value = typeof candidate === 'string' ? candidate : candidate.value;\n const token = resolve(`${rule!.name}:${quote(value)}`, 0);\n return token\n ? [\n {\n value: token.value,\n label:\n typeof candidate === 'string' ? token.label : candidate.label,\n },\n ]\n : [];\n });\n };\n const publish = (next: TokenSearchState) => {\n state.value = next;\n result.value = evaluate?.(next);\n refreshSuggestions();\n };\n refreshSuggestions();\n\n const edit = (value: TokenSearchFieldValue, commit = false) => {\n let query = '';\n let cursor = 0;\n const added: TokenSearchResolvedToken[] = [];\n const removed: Array<{ start: number; end: number }> = [];\n for (const match of value.query.matchAll(pattern ?? /(?!) /g)) {\n const raw = match[1];\n const start = match.index + match[0].lastIndexOf(raw);\n const end = start + raw.length;\n if (end === value.query.length && !commit && !/\\s$/.test(value.query))\n continue;\n const token = resolve(raw, query.length + start - cursor);\n if (!token) continue;\n query += value.query.slice(cursor, start);\n token.offset = query.length;\n added.push(token);\n removed.push({ start, end });\n cursor = end;\n }\n const suffix = value.query.slice(cursor);\n query += added.length && /^\\s+$/.test(suffix) ? '' : suffix;\n const existing = value.tokens.flatMap((token) => {\n const resolved = rehydrate(token);\n if (!resolved) return [];\n const offset = token.offset ?? value.query.length;\n return [\n {\n ...resolved,\n offset:\n offset -\n removed.reduce(\n (total, range) =>\n total + Math.max(0, Math.min(offset, range.end) - range.start),\n 0,\n ),\n },\n ];\n });\n const tokens = [...existing, ...added].sort(\n (left, right) => (left.offset ?? 0) - (right.offset ?? 0),\n );\n publish({ query, tokens });\n };\n\n const choose = (value: string) => {\n if (\n !suggestions.value.some((suggestion) => suggestion.value === value) ||\n activeStart === undefined\n )\n return;\n const token = resolve(value, activeStart);\n if (!token) return;\n const query = state.value.query.slice(0, activeStart);\n publish({ query, tokens: [...state.value.tokens, token] });\n };\n\n return {\n state,\n editorRevision,\n suggestions,\n result,\n edit,\n submit(value) {\n edit(value, true);\n onSubmit?.(state.value, result.value);\n },\n choose,\n expandToken(value) {\n const index = state.value.tokens.findIndex(\n (token) => token.value === value,\n );\n if (index < 0) return;\n const offset = Math.max(\n 0,\n Math.min(\n state.value.query.length,\n state.value.tokens[index].offset ?? state.value.query.length,\n ),\n );\n const insertion = `${value} `;\n publish({\n query: `${state.value.query.slice(0, offset)}${insertion}${state.value.query.slice(offset)}`,\n tokens: state.value.tokens.flatMap((token, at) =>\n at === index\n ? []\n : [\n {\n ...token,\n offset:\n (token.offset ?? 0) + (at > index ? insertion.length : 0),\n },\n ],\n ),\n });\n },\n remove(value) {\n const index = state.value.tokens.findIndex(\n (token) => token.value === value,\n );\n if (index < 0) return;\n publish({\n ...state.value,\n tokens: state.value.tokens.filter((_, at) => at !== index),\n });\n },\n clear() {\n publish({ query: '', tokens: [] });\n editorRevision.value++;\n },\n dismiss() {\n suggestions.value = [];\n },\n };\n}\n"]}
@@ -1,4 +1,4 @@
1
- import { ToolbarControlGroup } from './chunk-ZIYOJFZD.js';
1
+ import { isRelocatableGroup, ToolbarControlGroup } from './chunk-7JUBXOIV.js';
2
2
  import { Toolbar } from './chunk-6YFHCLHG.js';
3
3
  import { Pane } from './chunk-EZVNC4J6.js';
4
4
  import { LucideIcon } from './chunk-4R777DUZ.js';
@@ -39,10 +39,10 @@ function composedPanelToolbar(toolbar, side, collapsed, attributes) {
39
39
  center: toolbar.center,
40
40
  leading: /* @__PURE__ */ jsxs(Fragment, { children: [
41
41
  toolbar.title,
42
- toolbar.panelOnly
42
+ toolbar.leading
43
43
  ] }),
44
44
  trailing: /* @__PURE__ */ jsxs(Fragment, { children: [
45
- toolbar.constant,
45
+ toolbar.trailing,
46
46
  toolbar.toggle ? panelToggleGroup(side, toolbar.toggle, collapsed, attributes) : null
47
47
  ] })
48
48
  }
@@ -73,12 +73,23 @@ function composedPanelBody({
73
73
  }
74
74
  function relocatedPanelGroups(toolbar, side, collapsed, attributes) {
75
75
  if (!collapsed || !toolbar) return [];
76
+ const groups = [];
77
+ const collect = (content) => {
78
+ if (Array.isArray(content)) {
79
+ for (const item of content) collect(item);
80
+ } else if (isRelocatableGroup(content)) {
81
+ groups.push(content);
82
+ }
83
+ };
84
+ collect(toolbar.leading);
85
+ collect(toolbar.center);
86
+ collect(toolbar.trailing);
76
87
  return [
77
- toolbar.constant,
88
+ ...groups,
78
89
  toolbar.toggle ? panelToggleGroup(side, toolbar.toggle, true, attributes) : null
79
90
  ].filter((group) => group !== void 0 && group !== null && group !== false);
80
91
  }
81
92
 
82
93
  export { collapsiblePanelToggleIcon, composedPanelBody, relocatedPanelGroups };
83
94
 
84
- //# sourceMappingURL=chunk-XCO6YCYM.js.map
95
+ //# sourceMappingURL=chunk-QPUPLNNB.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/panel-toolbar.tsx"],"names":[],"mappings":"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","file":"chunk-QPUPLNNB.js","sourcesContent":["import type { SafeHtml } from 'kerfjs';\nimport {\n PanelBottomClose,\n PanelBottomOpen,\n PanelLeftClose,\n PanelLeftOpen,\n PanelRightClose,\n PanelRightOpen,\n} from 'lucide';\n\nimport { LucideIcon } from './lucide-icon.js';\nimport { Pane, type PaneConfig } from './pane.js';\nimport { isRelocatableGroup } from './panel-toolbar-group.js';\nimport type { KerfUiContent } from './semantic-content.js';\nimport { Toolbar, type ToolbarConfig } from './toolbar.js';\nimport { ToolbarControlGroup } from './toolbar-control-group.js';\n\n/** Which edge a collapsible panel docks to. */\nexport type PanelSide = 'left' | 'right' | 'bottom';\n\n/**\n * The standard collapse/expand icon for a panel `side` and `collapsed` state,\n * so every app's sidebars and drawers use one recognizable convention:\n * `PanelLeft*` for a left rail, `PanelRight*` for a right rail, `PanelBottom*`\n * for a bottom drawer — the `Close` glyph while open, the `Open` glyph while\n * collapsed. Exposed so an app can render its own toggle affordance.\n */\nexport function collapsiblePanelToggleIcon(\n side: PanelSide,\n collapsed: boolean,\n): { icon: Parameters<typeof LucideIcon>[0]['icon']; name: string } {\n if (side === 'left')\n return collapsed\n ? { icon: PanelLeftOpen, name: 'panel-left-open' }\n : { icon: PanelLeftClose, name: 'panel-left-close' };\n if (side === 'right')\n return collapsed\n ? { icon: PanelRightOpen, name: 'panel-right-open' }\n : { icon: PanelRightClose, name: 'panel-right-close' };\n return collapsed\n ? { icon: PanelBottomOpen, name: 'panel-bottom-open' }\n : { icon: PanelBottomClose, name: 'panel-bottom-close' };\n}\n\n/**\n * The standard collapse toggle a panel toolbar renders. The app handles the\n * button's `data-action` and flips its own `collapsed` flag.\n */\nexport interface PanelToggle {\n /** The `data-action` the toggle button carries. */\n action: string;\n /** The panel's short name, for the accessible \"Show …\" / \"Hide …\" label. */\n name: string;\n /** Accessible label while the panel is collapsed. Defaults to `Show {name}`. */\n showLabel?: string;\n /** Accessible label while the panel is open. Defaults to `Hide {name}`. */\n hideLabel?: string;\n}\n\n/**\n * A collapsible panel's top toolbar, composed so its groups follow the\n * panel's open state.\n *\n * - `title` precedes the `leading` zone. Groups may appear in any of the\n * `leading`, `center`, and `trailing` zones while the panel is open.\n * - Groups marked `relocateOnCollapse` move to the work area's toolbar while\n * the panel is collapsed, preserving their order across the three zones.\n * - `toggle` is always the last group: in the panel's toolbar while it is\n * open, and right after the relocated groups in the work area's toolbar\n * while it is collapsed.\n *\n * Relocated content renders in both places while the panel is collapsed (the\n * panel's copy is inert), so give it no `id`s. Pass groups directly or in\n * arrays so their render-time annotation remains available to the panel.\n *\n * The toolbar's configuration (`dividerSides`, `centerAlign`, `responsive`,\n * `responsiveAt`, `safeAreaEdges`) forwards to its `Toolbar`. It draws no\n * divider of its own: the panel's `Pane` draws the line under it while the\n * content is scrolled (its `chromeDividers`, wired by `wireScrollDividers`).\n */\nexport interface PanelToolbar extends ToolbarConfig {\n /** Accessible name of the panel's toolbar. */\n label: string;\n title?: KerfUiContent;\n leading?: KerfUiContent;\n center?: KerfUiContent;\n trailing?: KerfUiContent;\n toggle?: PanelToggle;\n}\n\n/** Owner-specific attributes a toggle button carries (its wiring hooks). */\nexport type PanelToggleAttributes = Readonly<Record<string, string>>;\n\n/** The standard toggle, alone in a borderless group. */\nexport function panelToggleGroup(\n side: PanelSide,\n toggle: PanelToggle,\n collapsed: boolean,\n attributes: PanelToggleAttributes,\n): SafeHtml {\n const glyph = collapsiblePanelToggleIcon(side, collapsed);\n return (\n <ToolbarControlGroup label={toggle.name} appearance=\"borderless\" single>\n <button\n type=\"button\"\n {...attributes}\n data-action={toggle.action}\n aria-expanded={String(!collapsed)}\n aria-label={\n collapsed\n ? (toggle.showLabel ?? `Show ${toggle.name}`)\n : (toggle.hideLabel ?? `Hide ${toggle.name}`)\n }\n >\n <LucideIcon icon={glyph.icon} name={glyph.name} />\n </button>\n </ToolbarControlGroup>\n );\n}\n\n/**\n * The panel's own toolbar: content keeps its chosen zones and the toggle trails.\n */\nexport function composedPanelToolbar(\n toolbar: PanelToolbar,\n side: PanelSide,\n collapsed: boolean,\n attributes: PanelToggleAttributes,\n): SafeHtml {\n return (\n <Toolbar\n label={toolbar.label}\n dividerSides={toolbar.dividerSides}\n centerAlign={toolbar.centerAlign}\n responsive={toolbar.responsive}\n responsiveAt={toolbar.responsiveAt}\n safeAreaEdges={toolbar.safeAreaEdges}\n center={toolbar.center}\n leading={\n <>\n {toolbar.title}\n {toolbar.leading}\n </>\n }\n trailing={\n <>\n {toolbar.trailing}\n {toolbar.toggle\n ? panelToggleGroup(side, toolbar.toggle, collapsed, attributes)\n : null}\n </>\n }\n />\n );\n}\n\n/**\n * A toolbar panel's body: its content in a `Pane` under its composed toolbar,\n * with its optional `footer` below. The panel's `pane` configuration forwards\n * to that `Pane`; an omitted or `undefined` field keeps the `Pane` default.\n */\nexport function composedPanelBody({\n toolbar,\n side,\n collapsed,\n attributes,\n pane,\n footer,\n content,\n}: {\n toolbar: PanelToolbar;\n side: PanelSide;\n collapsed: boolean;\n attributes: PanelToggleAttributes;\n pane: PaneConfig | undefined;\n footer: KerfUiContent;\n content: KerfUiContent;\n}): SafeHtml {\n return (\n <Pane\n header={composedPanelToolbar(toolbar, side, collapsed, attributes)}\n footer={footer}\n contentElement={pane?.contentElement}\n contentLabel={pane?.contentLabel}\n separators={pane?.separators}\n safeAreaEdges={pane?.safeAreaEdges}\n chromeDividers={pane?.chromeDividers}\n >\n {content}\n </Pane>\n );\n}\n\n/**\n * The groups a collapsed panel hands to the work area, in zone order, then its\n * toggle. Empty while the panel is open or has no toolbar.\n */\nexport function relocatedPanelGroups(\n toolbar: PanelToolbar | undefined,\n side: PanelSide,\n collapsed: boolean,\n attributes: PanelToggleAttributes,\n): KerfUiContent[] {\n if (!collapsed || !toolbar) return [];\n const groups: KerfUiContent[] = [];\n const collect = (content: KerfUiContent): void => {\n if (Array.isArray(content)) {\n for (const item of content) collect(item);\n } else if (isRelocatableGroup(content)) {\n groups.push(content);\n }\n };\n collect(toolbar.leading);\n collect(toolbar.center);\n collect(toolbar.trailing);\n return [\n ...groups,\n toolbar.toggle\n ? panelToggleGroup(side, toolbar.toggle, true, attributes)\n : null,\n ].filter((group) => group !== undefined && group !== null && group !== false);\n}\n"]}
@@ -28,6 +28,7 @@ function TokenSearchField({
28
28
  label,
29
29
  query = "",
30
30
  tokens = [],
31
+ model,
31
32
  revision,
32
33
  placeholder = "Search",
33
34
  tokenPlaceholder = "Add search\u2026",
@@ -49,9 +50,14 @@ function TokenSearchField({
49
50
  editorAttributes = {},
50
51
  slot
51
52
  }) {
53
+ if (model) {
54
+ query = model.state.value.query;
55
+ tokens = model.state.value.tokens;
56
+ }
57
+ const suggestions = model?.suggestions.value ?? [];
52
58
  const parts = orderedParts(query, tokens);
53
59
  const tokenKey = tokens.map((token) => token.value).join("|");
54
- const key = revision === void 0 ? `${id}:${tokenKey}` : `${id}@${String(revision)}:${tokenKey}`;
60
+ const key = model ? `${id}@${String(revision ?? "")}:${model.editorRevision.value}:${tokenKey}` : revision === void 0 ? `${id}:${tokenKey}` : `${id}@${String(revision)}:${tokenKey}`;
55
61
  const resolvedExpanded = !collapsible || expanded || query.length > 0 || tokens.length > 0;
56
62
  return /* @__PURE__ */ jsx(
57
63
  "div",
@@ -152,7 +158,23 @@ function TokenSearchField({
152
158
  children: clearIcon ?? /* @__PURE__ */ jsx(CloseIcon, {})
153
159
  }
154
160
  ),
155
- trailing && /* @__PURE__ */ jsx("span", { class: "kui-token-search__trailing", children: trailing })
161
+ trailing && /* @__PURE__ */ jsx("span", { class: "kui-token-search__trailing", children: trailing }),
162
+ !disabled && suggestions.length > 0 && /* @__PURE__ */ jsx(
163
+ "div",
164
+ {
165
+ class: "kui-token-search__suggestions",
166
+ "data-token-search-keep-open": true,
167
+ children: suggestions.map((suggestion) => /* @__PURE__ */ jsx(
168
+ "button",
169
+ {
170
+ type: "button",
171
+ class: "kui-token-search__suggestion",
172
+ "data-token-search-suggestion": suggestion.value,
173
+ children: suggestion.label
174
+ }
175
+ ))
176
+ }
177
+ )
156
178
  ] })
157
179
  }
158
180
  );
@@ -222,4 +244,4 @@ function placeTokenSearchCaret(editor, offset) {
222
244
 
223
245
  export { TokenSearchField, placeTokenSearchCaret, readTokenSearchField };
224
246
 
225
- //# sourceMappingURL=chunk-63ZWBGE3.js.map
247
+ //# sourceMappingURL=chunk-RRB26JRJ.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/token-search-field.tsx"],"names":[],"mappings":"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","file":"chunk-RRB26JRJ.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 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 leading?: KerfUiContent;\n trailing?: KerfUiContent;\n /** Standalone field chrome or the inset visual layer of a configured toolbar group. */\n presentation?: 'standalone' | 'toolbar-group';\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 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\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 collapsible = false,\n expanded = false,\n expandAction = 'expand-token-search',\n expandLabel,\n leading,\n trailing,\n presentation = 'standalone',\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 return (\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-has-trailing={String(Boolean(trailing))}\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={label}\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 {trailing && (\n <span class=\"kui-token-search__trailing\">{trailing}</span>\n )}\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}\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,4 +1,4 @@
1
- import { placeTokenSearchCaret, readTokenSearchField } from './chunk-63ZWBGE3.js';
1
+ import { readTokenSearchField, placeTokenSearchCaret } from './chunk-RRB26JRJ.js';
2
2
  import { delegate, delegateCapture, signal } from 'kerfjs';
3
3
 
4
4
  function editorFromEvent(root, event) {
@@ -121,6 +121,7 @@ function placeCaretAfterToken(editor, chip) {
121
121
  editor.focus({ preventScroll: true });
122
122
  }
123
123
  function wireTokenSearchFields(root, {
124
+ models = {},
124
125
  onSubmit,
125
126
  onEdit,
126
127
  collapsible = true,
@@ -133,7 +134,7 @@ function wireTokenSearchFields(root, {
133
134
  const collapseOnEscape = managed && (config.collapseOnEscape ?? true);
134
135
  const manageFocus = managed && (config.manageFocus ?? true);
135
136
  const keepOpenOn = config.keepOpenOn;
136
- const keyboardOn = keyboard !== false;
137
+ const keyboardOn = keyboard !== false || Object.keys(models).length > 0;
137
138
  const keyboardConfig = typeof keyboard === "object" ? keyboard : void 0;
138
139
  const removeAdjacentToken = keyboardOn && (keyboardConfig?.removeAdjacentToken ?? true);
139
140
  const moveCaretPastToken = keyboardOn && (keyboardConfig?.moveCaretPastToken ?? true);
@@ -255,13 +256,22 @@ function wireTokenSearchFields(root, {
255
256
  if (manageFocus && editor.closest('[data-component="token-search-field"]')?.dataset.collapsible === "true")
256
257
  setExpanded(editorId, true);
257
258
  }
258
- if (onEdit) {
259
- const field = editor.closest(
260
- '[data-component="token-search-field"]'
261
- );
262
- const id = field?.dataset.tokenSearchId;
263
- if (id && field?.dataset.disabled !== "true")
264
- onEdit({ id, editor, event });
259
+ const field = editor.closest(
260
+ '[data-component="token-search-field"]'
261
+ );
262
+ const id = field?.dataset.tokenSearchId;
263
+ if (id && field?.dataset.disabled !== "true") {
264
+ const model = models[id];
265
+ if (model) {
266
+ const before = editor.querySelectorAll(TOKEN_SELECTOR).length;
267
+ const current = readTokenSearchField(editor, model.state.value.tokens);
268
+ const input = event;
269
+ const commit = typeof input.data === "string" && /\s$/.test(input.data) || input.inputType === "insertFromPaste" && /\s$/.test(current.query);
270
+ model.edit(current, commit);
271
+ if (model.state.value.tokens.length > before)
272
+ focusAfterRender(id, "[data-token-search-editor]");
273
+ }
274
+ if (onEdit) onEdit({ id, editor, event });
265
275
  }
266
276
  pending.delete(editorId);
267
277
  };
@@ -325,20 +335,38 @@ function wireTokenSearchFields(root, {
325
335
  if (!id || field?.dataset.disabled === "true") return;
326
336
  if (keyboardEvent.key === "Enter") {
327
337
  keyboardEvent.preventDefault();
338
+ const model = models[id];
339
+ if (model)
340
+ model.submit(
341
+ readTokenSearchField(editor, model.state.value.tokens)
342
+ );
328
343
  onSubmit?.({ id, editor });
329
344
  return;
330
345
  }
346
+ if (models[id] && keyboardEvent.key === "ArrowDown") {
347
+ const first = field.querySelector(
348
+ "[data-token-search-suggestion]"
349
+ );
350
+ if (first) {
351
+ keyboardEvent.preventDefault();
352
+ first.focus();
353
+ return;
354
+ }
355
+ }
356
+ if (models[id] && keyboardEvent.key === "Escape") models[id].dismiss();
331
357
  if (removeAdjacentToken && (keyboardEvent.key === "Backspace" || keyboardEvent.key === "Delete")) {
332
358
  const direction = keyboardEvent.key === "Backspace" ? "backward" : "forward";
333
359
  const chip = adjacentToken(editor, direction);
334
360
  if (chip) {
335
361
  keyboardEvent.preventDefault();
336
- onRemoveToken?.({
362
+ const removal = {
337
363
  id,
338
364
  value: chip.dataset.tokenValue ?? "",
339
365
  editor,
340
366
  direction
341
- });
367
+ };
368
+ models[id]?.remove(removal.value);
369
+ onRemoveToken?.(removal);
342
370
  return;
343
371
  }
344
372
  }
@@ -357,6 +385,84 @@ function wireTokenSearchFields(root, {
357
385
  }
358
386
  )
359
387
  );
388
+ if (Object.keys(models).length > 0) {
389
+ disposers.push(
390
+ delegate(
391
+ root,
392
+ "keydown",
393
+ "[data-token-search-suggestion]",
394
+ (event, element) => {
395
+ const keyboard2 = event;
396
+ const button = element;
397
+ const buttons = [
398
+ ...button.parentElement.querySelectorAll(
399
+ "[data-token-search-suggestion]"
400
+ )
401
+ ];
402
+ const index = buttons.indexOf(button);
403
+ if (keyboard2.key === "Escape") {
404
+ keyboard2.preventDefault();
405
+ button.closest('[data-component="token-search-field"]')?.querySelector("[data-token-search-editor]")?.focus();
406
+ } else if (keyboard2.key === "ArrowDown" || keyboard2.key === "ArrowUp") {
407
+ keyboard2.preventDefault();
408
+ buttons[(index + (keyboard2.key === "ArrowDown" ? 1 : buttons.length - 1)) % buttons.length]?.focus();
409
+ }
410
+ }
411
+ ),
412
+ delegate(
413
+ root,
414
+ "click",
415
+ "[data-token-search-suggestion]",
416
+ (_event, element) => {
417
+ const field = element.closest(
418
+ '[data-component="token-search-field"]'
419
+ );
420
+ const id = field?.dataset.tokenSearchId;
421
+ const value = element.dataset.tokenSearchSuggestion;
422
+ if (!id || !value || field?.dataset.disabled === "true") return;
423
+ models[id]?.choose(value);
424
+ focusAfterRender(id, "[data-token-search-editor]");
425
+ }
426
+ ),
427
+ delegate(
428
+ root,
429
+ "click",
430
+ ".kui-token-search__token-edit",
431
+ (_event, element) => {
432
+ const field = element.closest(
433
+ '[data-component="token-search-field"]'
434
+ );
435
+ const id = field?.dataset.tokenSearchId;
436
+ const value = element.dataset.tokenValue;
437
+ if (!id || !value || field?.dataset.disabled === "true" || !models[id])
438
+ return;
439
+ models[id].expandToken(value);
440
+ focusAfterRender(id, "[data-token-search-editor]");
441
+ }
442
+ ),
443
+ delegate(
444
+ root,
445
+ "click",
446
+ ".kui-token-search__token-remove",
447
+ (_event, element) => {
448
+ const field = element.closest(
449
+ '[data-component="token-search-field"]'
450
+ );
451
+ const id = field?.dataset.tokenSearchId;
452
+ const value = element.dataset.tokenValue;
453
+ if (id && value && field?.dataset.disabled !== "true")
454
+ models[id]?.remove(value);
455
+ }
456
+ ),
457
+ delegate(root, "click", ".kui-token-search__clear", (_event, element) => {
458
+ const field = element.closest(
459
+ '[data-component="token-search-field"]'
460
+ );
461
+ const id = field?.dataset.tokenSearchId;
462
+ if (id && field?.dataset.disabled !== "true") models[id]?.clear();
463
+ })
464
+ );
465
+ }
360
466
  if (expandOnActivate) {
361
467
  disposers.push(
362
468
  delegate(
@@ -512,4 +618,4 @@ function wireTokenSearchFields(root, {
512
618
 
513
619
  export { wireTokenSearchFields };
514
620
 
515
- //# sourceMappingURL=chunk-NBYTIVHS.js.map
621
+ //# sourceMappingURL=chunk-UFYZHYWU.js.map