@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.
- package/README.md +29 -6
- package/ai/component-catalog.json +51 -16
- package/ai/component-catalog.schema.json +16 -0
- package/ai/component-composition.json +16 -2
- package/ai/components/README.md +2 -2
- package/ai/components/popup-menu.md +96 -7
- package/ai/components/text.md +3 -3
- package/ai/components/token-search-field.md +6 -4
- package/ai/components/toolbar-control-group.md +2 -0
- package/ai/public-api-signatures-v1.md +67 -97
- package/ai/skill.md +6 -2
- package/ai/webawesome-jsx-signatures-v1.md +1 -1
- package/dist/catalog-resources.d.ts +1 -1
- package/dist/catalog.d.ts +1 -1
- package/dist/catalog.js +5 -5
- package/dist/{chunk-G2RKFVRB.js → chunk-2CCMJTVY.js} +2 -2
- package/dist/chunk-2CCMJTVY.js.map +1 -0
- package/dist/{chunk-ZIYOJFZD.js → chunk-7JUBXOIV.js} +17 -4
- package/dist/chunk-7JUBXOIV.js.map +1 -0
- package/dist/chunk-F7F7KRO2.js +187 -0
- package/dist/chunk-F7F7KRO2.js.map +1 -0
- package/dist/{chunk-XCO6YCYM.js → chunk-QPUPLNNB.js} +16 -5
- package/dist/chunk-QPUPLNNB.js.map +1 -0
- package/dist/{chunk-63ZWBGE3.js → chunk-RRB26JRJ.js} +25 -3
- package/dist/chunk-RRB26JRJ.js.map +1 -0
- package/dist/{chunk-NBYTIVHS.js → chunk-UFYZHYWU.js} +118 -12
- package/dist/chunk-UFYZHYWU.js.map +1 -0
- package/dist/{chunk-WLG6SSNT.js → chunk-UWONG4QE.js} +41 -8
- package/dist/chunk-UWONG4QE.js.map +1 -0
- package/dist/{chunk-553ASUK6.js → chunk-UX2VVXZ3.js} +2 -2
- package/dist/{chunk-553ASUK6.js.map → chunk-UX2VVXZ3.js.map} +1 -1
- package/dist/{chunk-24PHKUR3.js → chunk-UXT7TE6B.js} +1 -1
- package/dist/chunk-UXT7TE6B.js.map +1 -0
- package/dist/{chunk-PWXNJS2B.js → chunk-W4XKTST6.js} +2 -2
- package/dist/{chunk-PWXNJS2B.js.map → chunk-W4XKTST6.js.map} +1 -1
- package/dist/collapsible-panel.d.ts +8 -8
- package/dist/collapsible-panel.js +2 -2
- package/dist/collapsible-panel.js.map +1 -1
- package/dist/index.d.ts +2 -2
- package/dist/index.js +7 -6
- package/dist/list-header.js +1 -1
- package/dist/nav-stack.js +1 -1
- package/dist/{panel-toolbar-BN4x0rth.d.ts → panel-toolbar-DqwtBxQL.d.ts} +10 -11
- package/dist/popup-menu.d.ts +31 -3
- package/dist/popup-menu.js +1 -1
- package/dist/split-view.js +1 -1
- package/dist/styles/popup-menu.css +33 -4
- package/dist/styles/text.css +8 -0
- package/dist/styles/token-search-field.css +29 -0
- package/dist/text.d.ts +1 -1
- package/dist/text.js +1 -1
- package/dist/token-search-field-CCke1yvQ.d.ts +126 -0
- package/dist/token-search-field.d.ts +3 -75
- package/dist/token-search-field.js +1 -1
- package/dist/token-search-model.d.ts +3 -0
- package/dist/token-search-model.js +3 -0
- package/dist/token-search-model.js.map +1 -0
- package/dist/toolbar-control-group.d.ts +3 -1
- package/dist/toolbar-control-group.js +1 -1
- package/dist/wire-token-search-fields.d.ts +5 -1
- package/dist/wire-token-search-fields.js +1 -1
- package/dist/workbench.d.ts +5 -5
- package/dist/workbench.js +1 -1
- package/docs/accessibility.md +14 -0
- package/docs/collapsible-panel.md +12 -7
- package/docs/component-contract.md +2 -1
- package/docs/component-integration.md +8 -1
- package/docs/component-selection.md +43 -2
- package/docs/layout.md +4 -1
- package/docs/workbench.md +12 -11
- package/llms.txt +6 -3
- package/package.json +5 -1
- package/dist/chunk-24PHKUR3.js.map +0 -1
- package/dist/chunk-63ZWBGE3.js.map +0 -1
- package/dist/chunk-G2RKFVRB.js.map +0 -1
- package/dist/chunk-NBYTIVHS.js.map +0 -1
- package/dist/chunk-WLG6SSNT.js.map +0 -1
- package/dist/chunk-XCO6YCYM.js.map +0 -1
- 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-
|
|
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
|
-
|
|
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-
|
|
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-
|
|
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.
|
|
42
|
+
toolbar.leading
|
|
43
43
|
] }),
|
|
44
44
|
trailing: /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
45
|
-
toolbar.
|
|
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
|
-
|
|
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-
|
|
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-
|
|
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 {
|
|
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
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
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
|
-
|
|
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-
|
|
621
|
+
//# sourceMappingURL=chunk-UFYZHYWU.js.map
|