@zeyos/zx 3.0.0 → 4.1.0
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/CHANGELOG.md +95 -0
- package/DESIGN-SYSTEM.md +87 -71
- package/README.md +16 -37
- package/dist/types/components/app-icon/app-icon.d.ts +88 -0
- package/dist/types/components/app-sidebar/app-sidebar.d.ts +106 -32
- package/dist/types/components/card/card.d.ts +128 -0
- package/dist/types/components/chart/chart.d.ts +1 -0
- package/dist/types/components/filter/filter-model.d.ts +87 -0
- package/dist/types/components/filter/filter.d.ts +331 -0
- package/dist/types/components/launcher/launcher.d.ts +65 -6
- package/dist/types/components/select/select.d.ts +97 -4
- package/dist/types/components/table/table.d.ts +107 -3
- package/dist/types/components/tag-picker/tag-picker.d.ts +16 -0
- package/dist/types/core/dom.d.ts +9 -1
- package/dist/types/core/util.d.ts +9 -0
- package/dist/types/index.d.ts +6 -2
- package/dist/types/{components/app-rail → internal}/app-rail.d.ts +34 -19
- package/dist/types/zeyos/icons.d.ts +24 -2
- package/dist/types/zeyos/index.d.ts +3 -2
- package/dist/types/zeyos/launcher.d.ts +147 -0
- package/dist/types/zeyos/select.d.ts +41 -0
- package/dist/zx-zeyos.esm.js +2018 -113
- package/dist/zx-zeyos.esm.min.js +1 -1
- package/dist/zx.css +815 -16
- package/dist/zx.esm.js +2661 -338
- package/dist/zx.esm.min.js +3 -3
- package/dist/zx.global.js +2661 -338
- package/dist/zx.global.min.js +3 -3
- package/dist/zx.min.css +1 -1
- package/docs/api.json +602 -110
- package/docs/llms.md +181 -123
- package/docs/llms.txt +24 -21
- package/package.json +8 -17
- package/src/components/app-icon/app-icon.css +105 -0
- package/src/components/app-icon/app-icon.js +134 -0
- package/src/components/app-sidebar/app-sidebar.css +12 -0
- package/src/components/app-sidebar/app-sidebar.js +310 -110
- package/src/components/card/card.css +149 -0
- package/src/components/card/card.js +285 -0
- package/src/components/chart/chart.js +8 -3
- package/src/components/filter/filter-model.js +226 -0
- package/src/components/filter/filter.css +147 -0
- package/src/components/filter/filter.js +554 -0
- package/src/components/grid/grid.css +1 -1
- package/src/components/grid/grid.js +14 -4
- package/src/components/launcher/launcher.css +113 -3
- package/src/components/launcher/launcher.js +234 -26
- package/src/components/message/message.css +36 -3
- package/src/components/select/field-adapter.js +9 -4
- package/src/components/select/select.css +161 -10
- package/src/components/select/select.js +361 -48
- package/src/components/table/table.css +85 -0
- package/src/components/table/table.js +426 -31
- package/src/components/tag-picker/tag-picker.css +19 -0
- package/src/components/tag-picker/tag-picker.js +42 -5
- package/src/core/dom.js +21 -1
- package/src/core/util.js +20 -0
- package/src/index.js +9 -2
- package/src/{components/app-rail → internal}/app-rail.js +80 -30
- package/src/zeyos/icons.js +38 -20
- package/src/zeyos/index.js +8 -2
- package/src/zeyos/launcher.js +338 -0
- package/src/zeyos/modules.js +1 -0
- package/src/zeyos/select.js +116 -1
- package/styles/tokens/global.css +1 -1
- package/styles/tokens/modules.css +1 -0
- package/styles/tokens/semantic.css +9 -0
- package/styles/tokens/themes.css +2 -2
- package/styles/zx.css +3 -0
- package/MIGRATION.md +0 -749
- package/dist/types/compat/base.d.ts +0 -156
- package/dist/types/compat/globals.d.ts +0 -20
- package/dist/types/compat/index.d.ts +0 -128
- package/dist/types/compat/map/basic.d.ts +0 -175
- package/dist/types/compat/map/data.d.ts +0 -103
- package/dist/types/compat/map/date-time.d.ts +0 -80
- package/dist/types/compat/map/factory.d.ts +0 -9
- package/dist/types/compat/map/form.d.ts +0 -98
- package/dist/types/compat/map/helpers.d.ts +0 -12
- package/dist/types/compat/map/http.d.ts +0 -36
- package/dist/types/compat/map/layout.d.ts +0 -106
- package/dist/types/compat/map/options.d.ts +0 -80
- package/dist/types/compat/map/select.d.ts +0 -95
- package/dist/types/compat/map/stubs.d.ts +0 -32
- package/dist/types/compat/map/utilities.d.ts +0 -37
- package/dist/types/compat-entry.d.ts +0 -5
- package/dist/zx-compat.esm.js +0 -17848
- package/dist/zx-compat.esm.min.js +0 -1
- package/dist/zx-compat.global.js +0 -29008
- package/dist/zx-compat.global.min.js +0 -3
- package/src/compat/base.js +0 -291
- package/src/compat/globals.js +0 -167
- package/src/compat/index.js +0 -84
- package/src/compat/map/basic.js +0 -464
- package/src/compat/map/data.js +0 -254
- package/src/compat/map/date-time.js +0 -177
- package/src/compat/map/factory.js +0 -45
- package/src/compat/map/form.js +0 -330
- package/src/compat/map/helpers.js +0 -46
- package/src/compat/map/http.js +0 -117
- package/src/compat/map/layout.js +0 -256
- package/src/compat/map/options.js +0 -267
- package/src/compat/map/select.js +0 -198
- package/src/compat/map/stubs.js +0 -26
- package/src/compat/map/utilities.js +0 -113
- package/src/compat-entry.js +0 -11
|
@@ -0,0 +1,331 @@
|
|
|
1
|
+
import { Component } from '../../core/component.js';
|
|
2
|
+
export type FilterAst = import('./filter-model.js').FilterAst;
|
|
3
|
+
export type FilterField = {
|
|
4
|
+
/**
|
|
5
|
+
* Stable allowlisted field ID.
|
|
6
|
+
*/
|
|
7
|
+
id: string;
|
|
8
|
+
/**
|
|
9
|
+
* Display label.
|
|
10
|
+
*/
|
|
11
|
+
label: string;
|
|
12
|
+
/**
|
|
13
|
+
* Editor/operator type.
|
|
14
|
+
*/
|
|
15
|
+
type: 'text' | 'number' | 'money' | 'date' | 'datetime' | 'boolean' | 'enum' | 'status' | 'priority' | 'country' | 'currency' | 'unit' | 'entity' | 'tags' | 'custom';
|
|
16
|
+
/**
|
|
17
|
+
* Explicit allowlisted operator IDs.
|
|
18
|
+
*/
|
|
19
|
+
operators?: string[];
|
|
20
|
+
/**
|
|
21
|
+
* Initial operator ID.
|
|
22
|
+
*/
|
|
23
|
+
defaultOperator?: string;
|
|
24
|
+
/**
|
|
25
|
+
* Static choices.
|
|
26
|
+
*/
|
|
27
|
+
choices?: Array<{
|
|
28
|
+
value: string | number | boolean;
|
|
29
|
+
label: string;
|
|
30
|
+
icon?: Node | string;
|
|
31
|
+
color?: string;
|
|
32
|
+
}>;
|
|
33
|
+
/**
|
|
34
|
+
* Async choices.
|
|
35
|
+
*/
|
|
36
|
+
loadChoices?: (context: {
|
|
37
|
+
query: string;
|
|
38
|
+
signal: AbortSignal;
|
|
39
|
+
conditionId: string;
|
|
40
|
+
field: FilterField;
|
|
41
|
+
}) => Promise<Array<{
|
|
42
|
+
value: string | number | boolean;
|
|
43
|
+
label: string;
|
|
44
|
+
}>> | Array<{
|
|
45
|
+
value: string | number | boolean;
|
|
46
|
+
label: string;
|
|
47
|
+
}>;
|
|
48
|
+
/**
|
|
49
|
+
* Custom editor.
|
|
50
|
+
*/
|
|
51
|
+
editor?: (target: Element, context: {
|
|
52
|
+
value: unknown;
|
|
53
|
+
setValue: (value: unknown) => void;
|
|
54
|
+
field: FilterField;
|
|
55
|
+
conditionId: string;
|
|
56
|
+
}) => ({
|
|
57
|
+
destroy?: () => void;
|
|
58
|
+
} | void);
|
|
59
|
+
/**
|
|
60
|
+
* Async minimum query length.
|
|
61
|
+
*/
|
|
62
|
+
minQuery?: number;
|
|
63
|
+
/**
|
|
64
|
+
* Async debounce in milliseconds.
|
|
65
|
+
*/
|
|
66
|
+
debounce?: number;
|
|
67
|
+
};
|
|
68
|
+
export type FilterOptions = {
|
|
69
|
+
/**
|
|
70
|
+
* Field definitions.
|
|
71
|
+
*/
|
|
72
|
+
fields: FilterField[];
|
|
73
|
+
/**
|
|
74
|
+
* Initial expression.
|
|
75
|
+
*/
|
|
76
|
+
value?: FilterAst;
|
|
77
|
+
/**
|
|
78
|
+
* Additional/overridden operators.
|
|
79
|
+
*/
|
|
80
|
+
operators?: Array<{
|
|
81
|
+
id: string;
|
|
82
|
+
label: string;
|
|
83
|
+
arity: 'none' | 'single' | 'pair' | 'many';
|
|
84
|
+
types: string[];
|
|
85
|
+
}>;
|
|
86
|
+
/**
|
|
87
|
+
* Whether nested groups may be authored.
|
|
88
|
+
*/
|
|
89
|
+
allowGroups?: boolean;
|
|
90
|
+
/**
|
|
91
|
+
* Maximum nested group depth.
|
|
92
|
+
*/
|
|
93
|
+
maxDepth?: number;
|
|
94
|
+
/**
|
|
95
|
+
* Maximum condition count.
|
|
96
|
+
*/
|
|
97
|
+
maxConditions?: number;
|
|
98
|
+
/**
|
|
99
|
+
* Emit apply after every valid mutation.
|
|
100
|
+
*/
|
|
101
|
+
autoApply?: boolean;
|
|
102
|
+
/**
|
|
103
|
+
* Prevent mutations while keeping values readable.
|
|
104
|
+
*/
|
|
105
|
+
readonly?: boolean;
|
|
106
|
+
/**
|
|
107
|
+
* Disable all controls.
|
|
108
|
+
*/
|
|
109
|
+
disabled?: boolean;
|
|
110
|
+
/**
|
|
111
|
+
* Apply button label.
|
|
112
|
+
*/
|
|
113
|
+
applyLabel?: string;
|
|
114
|
+
/**
|
|
115
|
+
* Clear button label.
|
|
116
|
+
*/
|
|
117
|
+
clearLabel?: string;
|
|
118
|
+
/**
|
|
119
|
+
* Draft-change listener.
|
|
120
|
+
*/
|
|
121
|
+
onchange?: (event: CustomEvent<Record<string, unknown>>) => void;
|
|
122
|
+
/**
|
|
123
|
+
* Valid-apply listener.
|
|
124
|
+
*/
|
|
125
|
+
onapply?: (event: CustomEvent<Record<string, unknown>>) => void;
|
|
126
|
+
/**
|
|
127
|
+
* Invalid-apply listener.
|
|
128
|
+
*/
|
|
129
|
+
oninvalid?: (event: CustomEvent<Record<string, unknown>>) => void;
|
|
130
|
+
/**
|
|
131
|
+
* Async query listener.
|
|
132
|
+
*/
|
|
133
|
+
onquery?: (event: CustomEvent<Record<string, unknown>>) => void;
|
|
134
|
+
/**
|
|
135
|
+
* Async loaded listener.
|
|
136
|
+
*/
|
|
137
|
+
onloaded?: (event: CustomEvent<Record<string, unknown>>) => void;
|
|
138
|
+
/**
|
|
139
|
+
* Async failure listener.
|
|
140
|
+
*/
|
|
141
|
+
onerror?: (event: CustomEvent<Record<string, unknown>>) => void;
|
|
142
|
+
};
|
|
143
|
+
/** @typedef {import('./filter-model.js').FilterAst} FilterAst */
|
|
144
|
+
/**
|
|
145
|
+
* @typedef {Object} FilterField
|
|
146
|
+
* @property {string} id Stable allowlisted field ID.
|
|
147
|
+
* @property {string} label Display label.
|
|
148
|
+
* @property {'text'|'number'|'money'|'date'|'datetime'|'boolean'|'enum'|'status'|'priority'|'country'|'currency'|'unit'|'entity'|'tags'|'custom'} type Editor/operator type.
|
|
149
|
+
* @property {string[]} [operators] Explicit allowlisted operator IDs.
|
|
150
|
+
* @property {string} [defaultOperator] Initial operator ID.
|
|
151
|
+
* @property {Array<{value:string|number|boolean,label:string,icon?:Node|string,color?:string}>} [choices] Static choices.
|
|
152
|
+
* @property {(context:{query:string,signal:AbortSignal,conditionId:string,field:FilterField})=>Promise<Array<{value:string|number|boolean,label:string}>>|Array<{value:string|number|boolean,label:string}>} [loadChoices] Async choices.
|
|
153
|
+
* @property {(target:Element, context:{value:unknown,setValue:(value:unknown)=>void,field:FilterField,conditionId:string})=>({destroy?:()=>void}|void)} [editor] Custom editor.
|
|
154
|
+
* @property {number} [minQuery=0] Async minimum query length.
|
|
155
|
+
* @property {number} [debounce=200] Async debounce in milliseconds.
|
|
156
|
+
*/
|
|
157
|
+
/**
|
|
158
|
+
* @typedef {Object} FilterOptions
|
|
159
|
+
* @property {FilterField[]} fields Field definitions.
|
|
160
|
+
* @property {FilterAst} [value] Initial expression.
|
|
161
|
+
* @property {Array<{id:string,label:string,arity:'none'|'single'|'pair'|'many',types:string[]}>} [operators] Additional/overridden operators.
|
|
162
|
+
* @property {boolean} [allowGroups=true] Whether nested groups may be authored.
|
|
163
|
+
* @property {number} [maxDepth=3] Maximum nested group depth.
|
|
164
|
+
* @property {number} [maxConditions=50] Maximum condition count.
|
|
165
|
+
* @property {boolean} [autoApply=false] Emit apply after every valid mutation.
|
|
166
|
+
* @property {boolean} [readonly=false] Prevent mutations while keeping values readable.
|
|
167
|
+
* @property {boolean} [disabled=false] Disable all controls.
|
|
168
|
+
* @property {string} [applyLabel='Apply filters'] Apply button label.
|
|
169
|
+
* @property {string} [clearLabel='Clear'] Clear button label.
|
|
170
|
+
* @property {(event:CustomEvent<Record<string,unknown>>)=>void} [onchange] Draft-change listener.
|
|
171
|
+
* @property {(event:CustomEvent<Record<string,unknown>>)=>void} [onapply] Valid-apply listener.
|
|
172
|
+
* @property {(event:CustomEvent<Record<string,unknown>>)=>void} [oninvalid] Invalid-apply listener.
|
|
173
|
+
* @property {(event:CustomEvent<Record<string,unknown>>)=>void} [onquery] Async query listener.
|
|
174
|
+
* @property {(event:CustomEvent<Record<string,unknown>>)=>void} [onloaded] Async loaded listener.
|
|
175
|
+
* @property {(event:CustomEvent<Record<string,unknown>>)=>void} [onerror] Async failure listener.
|
|
176
|
+
*/
|
|
177
|
+
/**
|
|
178
|
+
* Backend-neutral dynamic filter expression editor.
|
|
179
|
+
* @fires Filter#change
|
|
180
|
+
* @fires Filter#apply
|
|
181
|
+
* @fires Filter#invalid
|
|
182
|
+
* @fires Filter#query
|
|
183
|
+
* @fires Filter#loaded
|
|
184
|
+
* @fires Filter#error
|
|
185
|
+
* @extends {Component<FilterOptions>}
|
|
186
|
+
*/
|
|
187
|
+
export declare class Filter extends Component<FilterOptions> {
|
|
188
|
+
_createdRoot: boolean;
|
|
189
|
+
_snapshot: import("../../core/dom.js").TargetSnapshot;
|
|
190
|
+
_fields: {
|
|
191
|
+
id: string;
|
|
192
|
+
label: string;
|
|
193
|
+
type: 'text' | 'number' | 'money' | 'date' | 'datetime' | 'boolean' | 'enum' | 'status' | 'priority' | 'country' | 'currency' | 'unit' | 'entity' | 'tags' | 'custom';
|
|
194
|
+
operators?: string[];
|
|
195
|
+
defaultOperator?: string;
|
|
196
|
+
choices?: Array<{
|
|
197
|
+
value: string | number | boolean;
|
|
198
|
+
label: string;
|
|
199
|
+
icon?: Node | string;
|
|
200
|
+
color?: string;
|
|
201
|
+
}>;
|
|
202
|
+
loadChoices?: (context: {
|
|
203
|
+
query: string;
|
|
204
|
+
signal: AbortSignal;
|
|
205
|
+
conditionId: string;
|
|
206
|
+
field: FilterField;
|
|
207
|
+
}) => Promise<Array<{
|
|
208
|
+
value: string | number | boolean;
|
|
209
|
+
label: string;
|
|
210
|
+
}>> | Array<{
|
|
211
|
+
value: string | number | boolean;
|
|
212
|
+
label: string;
|
|
213
|
+
}>;
|
|
214
|
+
editor?: (target: Element, context: {
|
|
215
|
+
value: unknown;
|
|
216
|
+
setValue: (value: unknown) => void;
|
|
217
|
+
field: FilterField;
|
|
218
|
+
conditionId: string;
|
|
219
|
+
}) => ({
|
|
220
|
+
destroy?: () => void;
|
|
221
|
+
} | void);
|
|
222
|
+
minQuery?: number;
|
|
223
|
+
debounce?: number;
|
|
224
|
+
}[];
|
|
225
|
+
_operators: any[];
|
|
226
|
+
_readonly: boolean;
|
|
227
|
+
_disabled: boolean;
|
|
228
|
+
_async: Map<any, any>;
|
|
229
|
+
_customEditors: any[];
|
|
230
|
+
_value: import("./filter-model.js").FilterAst;
|
|
231
|
+
_renderVersion: any;
|
|
232
|
+
static cssName: string;
|
|
233
|
+
/** @type {Readonly<FilterOptions>} */
|
|
234
|
+
static defaults: Readonly<FilterOptions>;
|
|
235
|
+
/** @returns {HTMLElement} */
|
|
236
|
+
render(): HTMLElement;
|
|
237
|
+
/** Returns a defensive AST copy. @returns {FilterAst} */
|
|
238
|
+
getValue(): FilterAst;
|
|
239
|
+
/** Atomically replaces the AST. @param {unknown} value @param {{silent?:boolean}} [options={}] @returns {this} */
|
|
240
|
+
setValue(value: unknown, { silent }?: {
|
|
241
|
+
silent?: boolean;
|
|
242
|
+
}): this;
|
|
243
|
+
/** Adds a condition to a group. @param {string|null} [parentId=null] @param {Record<string,unknown>} [initial={}] @returns {string|null} */
|
|
244
|
+
addCondition(parentId?: string | null, initial?: Record<string, unknown>): string | null;
|
|
245
|
+
/** Adds a nested group. @param {string|null} [parentId=null] @param {'and'|'or'} [logic='and'] @returns {string|null} */
|
|
246
|
+
addGroup(parentId?: string | null, logic?: 'and' | 'or'): string | null;
|
|
247
|
+
/** Updates a node by stable ID. @param {string} id @param {Record<string,unknown>} patch @returns {this} */
|
|
248
|
+
update(id: string, patch?: Record<string, unknown>): this;
|
|
249
|
+
/** Removes a non-root node. @param {string} id @returns {this} */
|
|
250
|
+
remove(id: string): this;
|
|
251
|
+
/** Moves a node into a group while preserving its identity. @param {string} id @param {string} parentId @param {number} index @returns {this} */
|
|
252
|
+
move(id: string, parentId: string, index: number): this;
|
|
253
|
+
/** Returns semantic validity and errors. @returns {{valid:boolean,errors:Array<Record<string,string>>}} */
|
|
254
|
+
validate(): {
|
|
255
|
+
valid: boolean;
|
|
256
|
+
errors: Array<Record<string, string>>;
|
|
257
|
+
};
|
|
258
|
+
/** Applies only a valid AST. @returns {FilterAst|null} */
|
|
259
|
+
apply(): FilterAst | null;
|
|
260
|
+
/** Clears all conditions. @param {{silent?:boolean}} [options={}] @returns {this} */
|
|
261
|
+
clear({ silent }?: {
|
|
262
|
+
silent?: boolean;
|
|
263
|
+
}): this;
|
|
264
|
+
/** Focuses a condition's field or the Add button. @param {string|null} [id=null] @returns {this} */
|
|
265
|
+
focus(id?: string | null): this;
|
|
266
|
+
/** @param {boolean} readonly @returns {this} */
|
|
267
|
+
setReadonly(readonly: boolean): this;
|
|
268
|
+
/** @returns {this} */
|
|
269
|
+
enable(): this;
|
|
270
|
+
/** @returns {this} */
|
|
271
|
+
disable(): this;
|
|
272
|
+
/** @returns {void} */
|
|
273
|
+
destroy(): void;
|
|
274
|
+
/** @returns {void} */
|
|
275
|
+
_render(): void;
|
|
276
|
+
/** @param {any} group @param {number} depth @param {boolean} root @returns {HTMLElement} */
|
|
277
|
+
_renderGroup(group: any, depth: number, root: boolean): HTMLElement;
|
|
278
|
+
/** @param {any} node @returns {HTMLElement} */
|
|
279
|
+
_renderCondition(node: any): HTMLElement;
|
|
280
|
+
/** @param {any} node @param {FilterField|null} field @param {any} operator @returns {HTMLElement} */
|
|
281
|
+
_renderValue(node: any, field: FilterField | null, operator: any): HTMLElement;
|
|
282
|
+
/** @param {Event} event @returns {void} */
|
|
283
|
+
_handleChange(event: Event): void;
|
|
284
|
+
/** @param {Event} event @returns {void} */
|
|
285
|
+
_handleInput(event: Event): void;
|
|
286
|
+
/** @param {HTMLInputElement|HTMLSelectElement} target @returns {void} */
|
|
287
|
+
_valueInput(target: HTMLInputElement | HTMLSelectElement): void;
|
|
288
|
+
/** @param {MouseEvent} event @returns {void} */
|
|
289
|
+
_handleClick(event: MouseEvent): void;
|
|
290
|
+
/** @param {string} id @param {any} value @returns {void} */
|
|
291
|
+
_setNodeValue(id: string, value: any): void;
|
|
292
|
+
/** @param {string} reason @param {string} nodeId @returns {void} */
|
|
293
|
+
_changed(reason: string, nodeId: string): void;
|
|
294
|
+
/** @param {string} id @param {FilterField} field @param {string} query @returns {void} */
|
|
295
|
+
_scheduleChoices(id: string, field: FilterField, query: string): void;
|
|
296
|
+
/** @param {string} id @returns {void} */
|
|
297
|
+
_abort(id: string): void;
|
|
298
|
+
/** @param {string} id @param {boolean} busy @returns {void} */
|
|
299
|
+
_setAsyncBusy(id: string, busy: boolean): void;
|
|
300
|
+
/** @param {any} node @returns {void} */
|
|
301
|
+
_abortTree(node: any): void;
|
|
302
|
+
/** @returns {void} */
|
|
303
|
+
_abortAll(): void;
|
|
304
|
+
/** @returns {void} */
|
|
305
|
+
_destroyEditors(): void;
|
|
306
|
+
/** @returns {boolean} */
|
|
307
|
+
_blocked(): boolean;
|
|
308
|
+
/** @returns {boolean} */
|
|
309
|
+
_canMutate(): boolean;
|
|
310
|
+
/** @returns {{maxDepth:number,maxConditions:number}} */
|
|
311
|
+
_limits(): {
|
|
312
|
+
maxDepth: number;
|
|
313
|
+
maxConditions: number;
|
|
314
|
+
};
|
|
315
|
+
/** @param {string} id @returns {FilterField|null} */
|
|
316
|
+
_field(id: string): FilterField | null;
|
|
317
|
+
/** @param {string} id @returns {any} */
|
|
318
|
+
_operator(id: string): any;
|
|
319
|
+
/** @param {FilterField|null} field @returns {any[]} */
|
|
320
|
+
_operatorsFor(field: FilterField | null): any[];
|
|
321
|
+
/** @param {FilterField|null} field @returns {string|null} */
|
|
322
|
+
_defaultOperator(field: FilterField | null): string | null;
|
|
323
|
+
/** @param {string} text @returns {void} */
|
|
324
|
+
_announce(text: string): void;
|
|
325
|
+
}
|
|
326
|
+
/** @event Filter#change @type {CustomEvent<Record<string,unknown>>} */
|
|
327
|
+
/** @event Filter#apply @type {CustomEvent<{value:FilterAst}>} */
|
|
328
|
+
/** @event Filter#invalid @type {CustomEvent<Record<string,unknown>>} */
|
|
329
|
+
/** @event Filter#query @type {CustomEvent<Record<string,unknown>>} */
|
|
330
|
+
/** @event Filter#loaded @type {CustomEvent<Record<string,unknown>>} */
|
|
331
|
+
/** @event Filter#error @type {CustomEvent<Record<string,unknown>>} */
|
|
@@ -21,19 +21,39 @@ export type LauncherItem = {
|
|
|
21
21
|
*/
|
|
22
22
|
group?: string;
|
|
23
23
|
/**
|
|
24
|
-
*
|
|
24
|
+
* Decorative icon name, node, or factory.
|
|
25
25
|
*/
|
|
26
|
-
icon?: string;
|
|
26
|
+
icon?: string | Node | ((item: LauncherItem) => Node | null);
|
|
27
27
|
/**
|
|
28
28
|
* Compact metadata.
|
|
29
29
|
*/
|
|
30
30
|
badge?: string | number;
|
|
31
|
+
/**
|
|
32
|
+
* Tile or row presentation.
|
|
33
|
+
*/
|
|
34
|
+
kind?: 'application' | 'record' | 'action';
|
|
35
|
+
/**
|
|
36
|
+
* Whether this is the current application or destination.
|
|
37
|
+
*/
|
|
38
|
+
current?: boolean;
|
|
39
|
+
/**
|
|
40
|
+
* Query state in which the item is visible.
|
|
41
|
+
*/
|
|
42
|
+
when?: 'always' | 'empty' | 'query';
|
|
43
|
+
/**
|
|
44
|
+
* Explicit group order.
|
|
45
|
+
*/
|
|
46
|
+
groupOrder?: number;
|
|
47
|
+
/**
|
|
48
|
+
* Stable order within equally ranked results.
|
|
49
|
+
*/
|
|
50
|
+
itemOrder?: number;
|
|
31
51
|
/**
|
|
32
52
|
* Emitted value; defaults to `id`.
|
|
33
53
|
*/
|
|
34
54
|
value?: unknown;
|
|
35
55
|
/**
|
|
36
|
-
* Native link target.
|
|
56
|
+
* Native link target; executable/data schemes are disabled.
|
|
37
57
|
*/
|
|
38
58
|
href?: string;
|
|
39
59
|
/**
|
|
@@ -66,6 +86,14 @@ export type LauncherSource = {
|
|
|
66
86
|
* Per-source minimum query length.
|
|
67
87
|
*/
|
|
68
88
|
minQuery?: number;
|
|
89
|
+
/**
|
|
90
|
+
* Query state in which the source runs.
|
|
91
|
+
*/
|
|
92
|
+
when?: 'always' | 'empty' | 'query';
|
|
93
|
+
/**
|
|
94
|
+
* Whether Zx ranks results or preserves source order.
|
|
95
|
+
*/
|
|
96
|
+
order?: 'rank' | 'source';
|
|
69
97
|
/**
|
|
70
98
|
* Loader.
|
|
71
99
|
*/
|
|
@@ -106,6 +134,14 @@ export type LauncherOptions = {
|
|
|
106
134
|
* Dialog and field label.
|
|
107
135
|
*/
|
|
108
136
|
label?: string;
|
|
137
|
+
/**
|
|
138
|
+
* Close-button accessible label.
|
|
139
|
+
*/
|
|
140
|
+
closeLabel?: string;
|
|
141
|
+
/**
|
|
142
|
+
* Results-region accessible label.
|
|
143
|
+
*/
|
|
144
|
+
resultsLabel?: string;
|
|
109
145
|
/**
|
|
110
146
|
* Empty-state text.
|
|
111
147
|
*/
|
|
@@ -118,6 +154,14 @@ export type LauncherOptions = {
|
|
|
118
154
|
* Optional global keyboard shortcut.
|
|
119
155
|
*/
|
|
120
156
|
shortcut?: 'mod+k' | false;
|
|
157
|
+
/**
|
|
158
|
+
* Visible keyboard hints, or false.
|
|
159
|
+
*/
|
|
160
|
+
hints?: false | {
|
|
161
|
+
move?: string;
|
|
162
|
+
open?: string;
|
|
163
|
+
close?: string;
|
|
164
|
+
};
|
|
121
165
|
/**
|
|
122
166
|
* Preventable selection listener.
|
|
123
167
|
*/
|
|
@@ -161,10 +205,15 @@ export type RankedLauncherItem = LauncherItem & {
|
|
|
161
205
|
* @property {string} [description] Secondary text.
|
|
162
206
|
* @property {string|string[]} [keywords] Additional search text.
|
|
163
207
|
* @property {string} [group] Result group.
|
|
164
|
-
* @property {string} [icon]
|
|
208
|
+
* @property {string|Node|((item: LauncherItem) => Node|null)} [icon] Decorative icon name, node, or factory.
|
|
165
209
|
* @property {string|number} [badge] Compact metadata.
|
|
210
|
+
* @property {'application'|'record'|'action'} [kind='action'] Tile or row presentation.
|
|
211
|
+
* @property {boolean} [current=false] Whether this is the current application or destination.
|
|
212
|
+
* @property {'always'|'empty'|'query'} [when='always'] Query state in which the item is visible.
|
|
213
|
+
* @property {number} [groupOrder] Explicit group order.
|
|
214
|
+
* @property {number} [itemOrder] Stable order within equally ranked results.
|
|
166
215
|
* @property {unknown} [value] Emitted value; defaults to `id`.
|
|
167
|
-
* @property {string} [href] Native link target.
|
|
216
|
+
* @property {string} [href] Native link target; executable/data schemes are disabled.
|
|
168
217
|
* @property {string} [target] Native link browsing context.
|
|
169
218
|
* @property {() => void} [invoke] Application-owned callback for non-link actions.
|
|
170
219
|
* @property {boolean|number} [pinned] Pinned state or explicit pinned order.
|
|
@@ -175,6 +224,8 @@ export type RankedLauncherItem = LauncherItem & {
|
|
|
175
224
|
* @property {string} id Source identifier.
|
|
176
225
|
* @property {string} [label] Default group label.
|
|
177
226
|
* @property {number} [minQuery] Per-source minimum query length.
|
|
227
|
+
* @property {'always'|'empty'|'query'} [when='always'] Query state in which the source runs.
|
|
228
|
+
* @property {'rank'|'source'} [order='rank'] Whether Zx ranks results or preserves source order.
|
|
178
229
|
* @property {(query: string, context: {signal: AbortSignal}) => Promise<LauncherItem[]>|LauncherItem[]} load Loader.
|
|
179
230
|
*/
|
|
180
231
|
/**
|
|
@@ -187,9 +238,12 @@ export type RankedLauncherItem = LauncherItem & {
|
|
|
187
238
|
* @property {number} [maxResults=100] Maximum combined results.
|
|
188
239
|
* @property {string} [placeholder='Search applications and records'] Search-field placeholder.
|
|
189
240
|
* @property {string} [label='Launcher'] Dialog and field label.
|
|
241
|
+
* @property {string} [closeLabel='Close launcher'] Close-button accessible label.
|
|
242
|
+
* @property {string} [resultsLabel='Launcher results'] Results-region accessible label.
|
|
190
243
|
* @property {string} [emptyText='No results'] Empty-state text.
|
|
191
244
|
* @property {string} [loadingText='Searching…'] Loading-state text.
|
|
192
245
|
* @property {'mod+k'|false} [shortcut='mod+k'] Optional global keyboard shortcut.
|
|
246
|
+
* @property {false|{move?: string, open?: string, close?: string}} [hints] Visible keyboard hints, or false.
|
|
193
247
|
* @property {(event: CustomEvent<LauncherSelectDetail>) => void} [onselect] Preventable selection listener.
|
|
194
248
|
* @property {(event: CustomEvent<{query: string}>) => void} [onquery] Query-change listener.
|
|
195
249
|
* @property {(event: CustomEvent<Record<string, never>>) => void} [onopen] Open listener.
|
|
@@ -217,8 +271,9 @@ export declare class Launcher extends Component<LauncherOptions> {
|
|
|
217
271
|
_sources: LauncherSource[];
|
|
218
272
|
_sourceItems: Map<any, any>;
|
|
219
273
|
_query: string;
|
|
274
|
+
_renderedQuery: string;
|
|
220
275
|
_results: any[];
|
|
221
|
-
_active:
|
|
276
|
+
_active: any;
|
|
222
277
|
_request: AbortController;
|
|
223
278
|
_requestSequence: number;
|
|
224
279
|
_queryTimer: number;
|
|
@@ -251,6 +306,8 @@ export declare class Launcher extends Component<LauncherOptions> {
|
|
|
251
306
|
getQuery(): string;
|
|
252
307
|
/** Replaces local catalogue items. @param {LauncherItem[]} items @returns {this} */
|
|
253
308
|
setItems(items: LauncherItem[]): this;
|
|
309
|
+
/** Marks one local item as the current destination. @param {string|number|null} id Item id. @returns {this} */
|
|
310
|
+
setCurrent(id: string | number | null): this;
|
|
254
311
|
/** Replaces asynchronous sources and aborts work from the old set. @param {LauncherSource[]} sources @returns {this} */
|
|
255
312
|
setSources(sources: LauncherSource[]): this;
|
|
256
313
|
/** Aborts sources and removes the owned dialog. @returns {void} */
|
|
@@ -273,6 +330,8 @@ export declare class Launcher extends Component<LauncherOptions> {
|
|
|
273
330
|
_syncActive(): void;
|
|
274
331
|
/** @param {KeyboardEvent} event @returns {void} */
|
|
275
332
|
_onKeydown(event: KeyboardEvent): void;
|
|
333
|
+
/** @param {string} direction @param {number[]} enabled @returns {number|null} */
|
|
334
|
+
_spatialIndex(direction: string, enabled: number[]): number | null;
|
|
276
335
|
/** @param {number} index @param {Event} event @returns {void} */
|
|
277
336
|
_activate(index: number, event: Event): void;
|
|
278
337
|
/** @param {KeyboardEvent} event @returns {void} */
|
|
@@ -3,6 +3,14 @@ export type Primitive = string | number | boolean | symbol | bigint | null | und
|
|
|
3
3
|
export type SelectItem = Record<string, any> | Primitive;
|
|
4
4
|
export type SelectValueReader = string | ((item: SelectItem) => unknown);
|
|
5
5
|
export type SelectLabelReader = string | ((item: SelectItem) => string);
|
|
6
|
+
export type SelectAction = {
|
|
7
|
+
id: string | number;
|
|
8
|
+
label: string;
|
|
9
|
+
icon?: string | Node;
|
|
10
|
+
description?: string;
|
|
11
|
+
group?: string;
|
|
12
|
+
invoke?: (detail: SelectActionDetail) => void;
|
|
13
|
+
};
|
|
6
14
|
export type SelectOptions = {
|
|
7
15
|
/**
|
|
8
16
|
* Available values.
|
|
@@ -12,6 +20,10 @@ export type SelectOptions = {
|
|
|
12
20
|
* Choices pinned above the list, kept through filtering and async loads.
|
|
13
21
|
*/
|
|
14
22
|
fixedItems?: SelectItem[];
|
|
23
|
+
/**
|
|
24
|
+
* Optional heading above pinned choices.
|
|
25
|
+
*/
|
|
26
|
+
fixedLabel?: string | null;
|
|
15
27
|
/**
|
|
16
28
|
* Item ID property or reader.
|
|
17
29
|
*/
|
|
@@ -28,6 +40,22 @@ export type SelectOptions = {
|
|
|
28
40
|
* Selected-value renderer.
|
|
29
41
|
*/
|
|
30
42
|
renderValue?: ((item: SelectItem) => string) | null;
|
|
43
|
+
/**
|
|
44
|
+
* Decorative content before the selected text.
|
|
45
|
+
*/
|
|
46
|
+
renderValueAdornment?: ((item: SelectItem) => Node | string | null) | null;
|
|
47
|
+
/**
|
|
48
|
+
* Clear-row renderer.
|
|
49
|
+
*/
|
|
50
|
+
renderNone?: ((label: string) => Node | string) | null;
|
|
51
|
+
/**
|
|
52
|
+
* Clear-row label independent from the input placeholder.
|
|
53
|
+
*/
|
|
54
|
+
noneLabel?: string | null;
|
|
55
|
+
/**
|
|
56
|
+
* Command rows that emit `action` without changing value.
|
|
57
|
+
*/
|
|
58
|
+
actions?: SelectAction[];
|
|
31
59
|
/**
|
|
32
60
|
* Initially selected ID or item.
|
|
33
61
|
*/
|
|
@@ -92,6 +120,42 @@ export type SelectOptions = {
|
|
|
92
120
|
* Async-loaded listener.
|
|
93
121
|
*/
|
|
94
122
|
onloaded?: (event: CustomEvent<SelectLoadedDetail>) => void;
|
|
123
|
+
/**
|
|
124
|
+
* Preventable command-row listener.
|
|
125
|
+
*/
|
|
126
|
+
onaction?: (event: CustomEvent<SelectActionDetail>) => void;
|
|
127
|
+
};
|
|
128
|
+
export type EntitySelectOptions = {
|
|
129
|
+
/**
|
|
130
|
+
* Choices pinned above ordinary results.
|
|
131
|
+
*/
|
|
132
|
+
recent?: SelectItem[];
|
|
133
|
+
/**
|
|
134
|
+
* Heading above recent choices.
|
|
135
|
+
*/
|
|
136
|
+
recentLabel?: string;
|
|
137
|
+
/**
|
|
138
|
+
* Optional create command at the bottom.
|
|
139
|
+
*/
|
|
140
|
+
create?: boolean | SelectAction;
|
|
141
|
+
/**
|
|
142
|
+
* Item icon reader.
|
|
143
|
+
*/
|
|
144
|
+
iconKey?: string | ((item: SelectItem) => unknown);
|
|
145
|
+
/**
|
|
146
|
+
* Optional icon colour reader.
|
|
147
|
+
*/
|
|
148
|
+
colorKey?: string | ((item: SelectItem) => unknown);
|
|
149
|
+
/**
|
|
150
|
+
* Secondary-text reader.
|
|
151
|
+
*/
|
|
152
|
+
subtitleKey?: string | ((item: SelectItem) => unknown);
|
|
153
|
+
/**
|
|
154
|
+
* Entity icon renderer.
|
|
155
|
+
*/
|
|
156
|
+
renderIcon?: ((item: SelectItem, context: {
|
|
157
|
+
selected: boolean;
|
|
158
|
+
}) => Node | string | null) | null;
|
|
95
159
|
};
|
|
96
160
|
export type SelectChangeDetail = {
|
|
97
161
|
value: unknown;
|
|
@@ -103,9 +167,16 @@ export type SelectQueryDetail = {
|
|
|
103
167
|
export type SelectLoadedDetail = {
|
|
104
168
|
items: SelectItem[];
|
|
105
169
|
};
|
|
170
|
+
export type SelectActionDetail = {
|
|
171
|
+
id: string | number;
|
|
172
|
+
action: SelectAction;
|
|
173
|
+
query: string;
|
|
174
|
+
select: Select;
|
|
175
|
+
};
|
|
106
176
|
export type SelectOptionEntry = {
|
|
107
177
|
item: SelectItem | null;
|
|
108
178
|
clear: boolean;
|
|
179
|
+
action: SelectAction | null;
|
|
109
180
|
element: HTMLElement;
|
|
110
181
|
};
|
|
111
182
|
export type SelectSetOptions = {
|
|
@@ -126,6 +197,7 @@ export declare class Select extends Component<SelectOptions> {
|
|
|
126
197
|
_visibleItems: any[];
|
|
127
198
|
_fixedItems: any[] | SelectItem[];
|
|
128
199
|
_visibleFixed: any[] | SelectItem[];
|
|
200
|
+
_actions: any[] | SelectAction[];
|
|
129
201
|
_selected: SelectItem;
|
|
130
202
|
_optionEntries: any[];
|
|
131
203
|
_activeIndex: number;
|
|
@@ -137,8 +209,7 @@ export declare class Select extends Component<SelectOptions> {
|
|
|
137
209
|
_position: import("../../core/position.js").PositionController;
|
|
138
210
|
_createdRoot: boolean;
|
|
139
211
|
_root: HTMLElement;
|
|
140
|
-
|
|
141
|
-
_originalAttributes: Map<any, any>;
|
|
212
|
+
_snapshot: import("../../core/dom.js").TargetSnapshot;
|
|
142
213
|
_handleTypeahead: (event: KeyboardEvent | string) => void;
|
|
143
214
|
static cssName: string;
|
|
144
215
|
/** @type {SelectOptions} */
|
|
@@ -171,6 +242,8 @@ export declare class Select extends Component<SelectOptions> {
|
|
|
171
242
|
* @returns {this}
|
|
172
243
|
*/
|
|
173
244
|
setFixedItems(items: SelectItem[]): this;
|
|
245
|
+
/** Replaces command rows without changing the selected value. @param {SelectAction[]} actions @returns {this} */
|
|
246
|
+
setActions(actions: SelectAction[]): this;
|
|
174
247
|
/**
|
|
175
248
|
* Restores the configured initial value.
|
|
176
249
|
* @param {{silent?: boolean}} [options={}] Reset behavior.
|
|
@@ -196,6 +269,22 @@ export declare class Select extends Component<SelectOptions> {
|
|
|
196
269
|
* @returns {Select}
|
|
197
270
|
*/
|
|
198
271
|
static priority(target: Element | string | null, options?: SelectOptions): Select;
|
|
272
|
+
/**
|
|
273
|
+
* Creates a status picker with shape- and color-distinct workflow indicators.
|
|
274
|
+
* @param {Element|string|null} target Component target.
|
|
275
|
+
* @param {SelectOptions & {items?: Array<Record<string, any>>}} [options={}] Select overrides and status items.
|
|
276
|
+
* @returns {Select}
|
|
277
|
+
*/
|
|
278
|
+
static status(target: Element | string | null, options?: SelectOptions & {
|
|
279
|
+
items?: Array<Record<string, any>>;
|
|
280
|
+
}): Select;
|
|
281
|
+
/**
|
|
282
|
+
* Creates a rich entity picker with optional Recent choices and a create command.
|
|
283
|
+
* @param {Element|string|null} target Component target.
|
|
284
|
+
* @param {SelectOptions & EntitySelectOptions} [options={}] Entity-preset options.
|
|
285
|
+
* @returns {Select}
|
|
286
|
+
*/
|
|
287
|
+
static entity(target: Element | string | null, options?: SelectOptions & EntitySelectOptions): Select;
|
|
199
288
|
/**
|
|
200
289
|
* Creates the record-permission picker: the fixed Private and Public choices above the groups a
|
|
201
290
|
* record can be shared with. The value is the tri-state ZeyOS stores — `false` for private,
|
|
@@ -228,6 +317,8 @@ export declare class Select extends Component<SelectOptions> {
|
|
|
228
317
|
_renderOptions(): void;
|
|
229
318
|
/** @param {SelectItem|null} item @param {boolean} clear @param {string} [label] @returns {void} */
|
|
230
319
|
_appendOption(item: SelectItem | null, clear: boolean, label?: string): void;
|
|
320
|
+
/** @param {SelectAction} action @returns {void} */
|
|
321
|
+
_appendAction(action: SelectAction): void;
|
|
231
322
|
/** @param {SelectItem|null} item @returns {Node|string} */
|
|
232
323
|
_renderItem(item: SelectItem | null): Node | string;
|
|
233
324
|
/** @param {string} query @returns {void} */
|
|
@@ -241,6 +332,8 @@ export declare class Select extends Component<SelectOptions> {
|
|
|
241
332
|
/** @returns {void} */
|
|
242
333
|
_syncInputValue(): void;
|
|
243
334
|
/** @returns {void} */
|
|
335
|
+
_syncValueAdornment(): void;
|
|
336
|
+
/** @returns {void} */
|
|
244
337
|
_syncDisabled(): void;
|
|
245
338
|
/** @param {unknown} candidate @returns {SelectItem|null} */
|
|
246
339
|
_findItem(candidate: unknown): SelectItem | null;
|
|
@@ -259,12 +352,12 @@ export declare class Select extends Component<SelectOptions> {
|
|
|
259
352
|
* @returns {SelectItem[]}
|
|
260
353
|
*/
|
|
261
354
|
_matchFixed(query: string): SelectItem[];
|
|
355
|
+
/** De-duplicates choices by public value while preserving caller order. @param {SelectItem[]} items @param {SelectItem[]} [excluded=[]] @returns {SelectItem[]} */
|
|
356
|
+
_uniqueItems(items: SelectItem[], excluded?: SelectItem[]): SelectItem[];
|
|
262
357
|
/** @returns {number} */
|
|
263
358
|
_selectedEntryIndex(): number;
|
|
264
359
|
/** @param {number} itemIndex @returns {number} */
|
|
265
360
|
_itemEntryIndex(itemIndex: number): number;
|
|
266
|
-
/** @param {string} name @returns {void} */
|
|
267
|
-
_rememberAttribute(element: any, name: string): void;
|
|
268
361
|
/** @param {string} key @param {string} fallback @returns {string} */
|
|
269
362
|
_message(key: string, fallback: string): string;
|
|
270
363
|
}
|