@acorex/components 22.1.7 → 22.2.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/fesm2022/acorex-components-accordion.mjs +2 -2
- package/fesm2022/acorex-components-accordion.mjs.map +1 -1
- package/fesm2022/acorex-components-button-group.mjs +12 -5
- package/fesm2022/acorex-components-button-group.mjs.map +1 -1
- package/fesm2022/acorex-components-button.mjs +2 -2
- package/fesm2022/acorex-components-button.mjs.map +1 -1
- package/fesm2022/acorex-components-combo-box.mjs +109 -16
- package/fesm2022/acorex-components-combo-box.mjs.map +1 -1
- package/fesm2022/{acorex-components-conversation-acorex-components-conversation-EiqMwr9v.mjs → acorex-components-conversation-acorex-components-conversation-CVgneI8Q.mjs} +1680 -877
- package/fesm2022/acorex-components-conversation-acorex-components-conversation-CVgneI8Q.mjs.map +1 -0
- package/fesm2022/acorex-components-conversation-composer-action-choice-dialog.component-COUB9zrM.mjs +50 -0
- package/fesm2022/acorex-components-conversation-composer-action-choice-dialog.component-COUB9zrM.mjs.map +1 -0
- package/fesm2022/{acorex-components-conversation-image-picker-editor-dialog.component-QVs1XWYf.mjs → acorex-components-conversation-image-picker-editor-dialog.component-AO1evM19.mjs} +4 -4
- package/fesm2022/acorex-components-conversation-image-picker-editor-dialog.component-AO1evM19.mjs.map +1 -0
- package/fesm2022/{acorex-components-conversation-picker-rename-file-dialog.component-DuRLMEa3.mjs → acorex-components-conversation-picker-rename-file-dialog.component-Vc1R5AFc.mjs} +3 -3
- package/fesm2022/{acorex-components-conversation-picker-rename-file-dialog.component-DuRLMEa3.mjs.map → acorex-components-conversation-picker-rename-file-dialog.component-Vc1R5AFc.mjs.map} +1 -1
- package/fesm2022/acorex-components-conversation.mjs +1 -1
- package/fesm2022/acorex-components-data-pager.mjs +4 -4
- package/fesm2022/acorex-components-data-pager.mjs.map +1 -1
- package/fesm2022/acorex-components-data-table.mjs +34 -10
- package/fesm2022/acorex-components-data-table.mjs.map +1 -1
- package/fesm2022/acorex-components-datetime-picker.mjs +1 -1
- package/fesm2022/acorex-components-datetime-picker.mjs.map +1 -1
- package/fesm2022/acorex-components-dialog.mjs +1 -1
- package/fesm2022/acorex-components-dialog.mjs.map +1 -1
- package/fesm2022/acorex-components-dropdown-button.mjs +1 -1
- package/fesm2022/acorex-components-dropdown-button.mjs.map +1 -1
- package/fesm2022/acorex-components-fab.mjs +2 -2
- package/fesm2022/acorex-components-fab.mjs.map +1 -1
- package/fesm2022/acorex-components-file-viewer.mjs +29 -11
- package/fesm2022/acorex-components-file-viewer.mjs.map +1 -1
- package/fesm2022/acorex-components-flow-chart.mjs +1 -1
- package/fesm2022/acorex-components-flow-chart.mjs.map +1 -1
- package/fesm2022/acorex-components-form.mjs +1 -1
- package/fesm2022/acorex-components-form.mjs.map +1 -1
- package/fesm2022/acorex-components-highlight.mjs +80 -0
- package/fesm2022/acorex-components-highlight.mjs.map +1 -0
- package/fesm2022/acorex-components-image-editor.mjs +7 -7
- package/fesm2022/acorex-components-image-editor.mjs.map +1 -1
- package/fesm2022/acorex-components-kanban.mjs +1 -1
- package/fesm2022/acorex-components-kanban.mjs.map +1 -1
- package/fesm2022/acorex-components-loading-dialog.mjs +1 -1
- package/fesm2022/acorex-components-loading-dialog.mjs.map +1 -1
- package/fesm2022/acorex-components-lookup.mjs +310 -48
- package/fesm2022/acorex-components-lookup.mjs.map +1 -1
- package/fesm2022/acorex-components-notification.mjs +1 -1
- package/fesm2022/acorex-components-notification.mjs.map +1 -1
- package/fesm2022/acorex-components-paint.mjs +1 -1
- package/fesm2022/acorex-components-paint.mjs.map +1 -1
- package/fesm2022/acorex-components-popup.mjs +1 -1
- package/fesm2022/acorex-components-popup.mjs.map +1 -1
- package/fesm2022/acorex-components-query-builder.mjs +1 -1
- package/fesm2022/acorex-components-query-builder.mjs.map +1 -1
- package/fesm2022/acorex-components-rest-api-generator.mjs +4 -4
- package/fesm2022/acorex-components-rest-api-generator.mjs.map +1 -1
- package/fesm2022/acorex-components-rrule.mjs +1 -1
- package/fesm2022/acorex-components-rrule.mjs.map +1 -1
- package/fesm2022/acorex-components-scheduler-picker.mjs +5 -5
- package/fesm2022/acorex-components-scheduler-picker.mjs.map +1 -1
- package/fesm2022/acorex-components-scheduler.mjs +1 -1
- package/fesm2022/acorex-components-scheduler.mjs.map +1 -1
- package/fesm2022/acorex-components-selection-list.mjs +1 -2
- package/fesm2022/acorex-components-selection-list.mjs.map +1 -1
- package/fesm2022/acorex-components-tabs.mjs +143 -43
- package/fesm2022/acorex-components-tabs.mjs.map +1 -1
- package/fesm2022/acorex-components-tree-view.mjs +2 -2
- package/fesm2022/acorex-components-tree-view.mjs.map +1 -1
- package/fesm2022/acorex-components-wysiwyg.mjs +76 -6
- package/fesm2022/acorex-components-wysiwyg.mjs.map +1 -1
- package/highlight/README.md +13 -0
- package/package.json +7 -3
- package/types/acorex-components-button-group.d.ts +4 -0
- package/types/acorex-components-button.d.ts +1 -1
- package/types/acorex-components-combo-box.d.ts +15 -0
- package/types/acorex-components-conversation.d.ts +135 -126
- package/types/acorex-components-data-table.d.ts +6 -1
- package/types/acorex-components-file-viewer.d.ts +1 -0
- package/types/acorex-components-highlight.d.ts +31 -0
- package/types/acorex-components-lookup.d.ts +20 -1
- package/types/acorex-components-selection-list.d.ts +1 -1
- package/types/acorex-components-tabs.d.ts +13 -0
- package/types/acorex-components-wysiwyg.d.ts +13 -0
- package/fesm2022/acorex-components-conversation-acorex-components-conversation-EiqMwr9v.mjs.map +0 -1
- package/fesm2022/acorex-components-conversation-composer-action-choice-dialog.component-D4ca9Mvt.mjs +0 -51
- package/fesm2022/acorex-components-conversation-composer-action-choice-dialog.component-D4ca9Mvt.mjs.map +0 -1
- package/fesm2022/acorex-components-conversation-image-picker-editor-dialog.component-QVs1XWYf.mjs.map +0 -1
- package/fesm2022/acorex-components-conversation-open-composer-picker-for-files-C7BnTUw2.mjs +0 -210
- package/fesm2022/acorex-components-conversation-open-composer-picker-for-files-C7BnTUw2.mjs.map +0 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { AXDataSource, AXListDataSource, NXValueComponent,
|
|
1
|
+
import { AXDataSource, retryFrames, scrollNearestIntoView, AXListDataSource, NXValueComponent, AXComponent, AXClearableComponent, AXClosableComponent, AXValuableComponent } from '@acorex/cdk/common';
|
|
2
2
|
import { AXButtonComponent } from '@acorex/components/button';
|
|
3
3
|
import { AXChipsComponent } from '@acorex/components/chips';
|
|
4
4
|
import * as i1$1 from '@acorex/components/decorators';
|
|
@@ -6,14 +6,14 @@ import { AXDecoratorModule } from '@acorex/components/decorators';
|
|
|
6
6
|
import { AXPopoverComponent } from '@acorex/components/popover';
|
|
7
7
|
import { AXSearchBoxComponent } from '@acorex/components/search-box';
|
|
8
8
|
import { AXPlatform } from '@acorex/core/platform';
|
|
9
|
-
import { AXTranslatorPipe } from '@acorex/core/translation';
|
|
9
|
+
import { AXTranslatorPipe, AXTranslationService, toTranslatedSignal } from '@acorex/core/translation';
|
|
10
10
|
import { NgTemplateOutlet, AsyncPipe, DOCUMENT } from '@angular/common';
|
|
11
11
|
import * as i0 from '@angular/core';
|
|
12
|
-
import { input, output, signal, computed, viewChild, viewChildren, inject, NgZone, effect, untracked, Directive, ViewEncapsulation, ChangeDetectionStrategy, Component, ElementRef, DestroyRef, model, booleanAttribute, linkedSignal,
|
|
12
|
+
import { input, output, signal, computed, viewChild, viewChildren, inject, NgZone, effect, untracked, Directive, ViewEncapsulation, ChangeDetectionStrategy, Component, ElementRef, afterRenderEffect, DestroyRef, model, booleanAttribute, linkedSignal, NgModule } from '@angular/core';
|
|
13
13
|
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
|
14
14
|
import * as i2 from '@acorex/cdk/list-navigation';
|
|
15
15
|
import { AXListNavigationDirective, AXListNavigationItemDirective, AXListNavigationModule } from '@acorex/cdk/list-navigation';
|
|
16
|
-
import { AXHighlightTextComponent } from '@acorex/
|
|
16
|
+
import { AXHighlightTextComponent } from '@acorex/components/highlight';
|
|
17
17
|
import * as i1 from '@angular/cdk/scrolling';
|
|
18
18
|
import { CdkVirtualScrollViewport, ScrollingModule } from '@angular/cdk/scrolling';
|
|
19
19
|
import { AXTreeViewComponent } from '@acorex/components/tree-view';
|
|
@@ -21,6 +21,66 @@ import { AXDataTableComponent, AXDataTableTextColumnComponent } from '@acorex/co
|
|
|
21
21
|
import { fromEvent, auditTime } from 'rxjs';
|
|
22
22
|
import { AXCheckBoxComponent } from '@acorex/components/check-box';
|
|
23
23
|
|
|
24
|
+
/** Whether an item label matches a search query (raw or translated). */
|
|
25
|
+
function matchesLookupText(text, query, translateText) {
|
|
26
|
+
const needle = query.trim().toLowerCase();
|
|
27
|
+
if (!needle) {
|
|
28
|
+
return true;
|
|
29
|
+
}
|
|
30
|
+
const raw = String(text ?? '').toLowerCase();
|
|
31
|
+
if (raw.includes(needle)) {
|
|
32
|
+
return true;
|
|
33
|
+
}
|
|
34
|
+
if (translateText) {
|
|
35
|
+
return translateText(String(text ?? '')).toLowerCase().includes(needle);
|
|
36
|
+
}
|
|
37
|
+
return false;
|
|
38
|
+
}
|
|
39
|
+
/**
|
|
40
|
+
* Array-backed datasource with optional i18n-aware text filtering.
|
|
41
|
+
*/
|
|
42
|
+
function convertLookupArrayToDataSource(items, options) {
|
|
43
|
+
const normalizedItems = items.map((candidate) => {
|
|
44
|
+
const isObjectItem = candidate != null && typeof candidate === 'object';
|
|
45
|
+
if (isObjectItem) {
|
|
46
|
+
return candidate;
|
|
47
|
+
}
|
|
48
|
+
return { [options.key]: candidate, text: String(candidate ?? '') };
|
|
49
|
+
});
|
|
50
|
+
const config = {
|
|
51
|
+
key: options.key,
|
|
52
|
+
pageSize: options.pageSize,
|
|
53
|
+
load: async (e) => {
|
|
54
|
+
const itemsForFilter = normalizedItems;
|
|
55
|
+
const resultNormalized = e.filter
|
|
56
|
+
? applyLookupArrayFilter(itemsForFilter, e.filter, options.textField, options.translateText)
|
|
57
|
+
: itemsForFilter;
|
|
58
|
+
const result = resultNormalized;
|
|
59
|
+
return {
|
|
60
|
+
items: result.slice(e.skip, e.skip + e.take),
|
|
61
|
+
total: resultNormalized.length,
|
|
62
|
+
};
|
|
63
|
+
},
|
|
64
|
+
byKey: (v) => normalizedItems.find((record) => record[options.key] == v),
|
|
65
|
+
};
|
|
66
|
+
return new AXDataSource(config);
|
|
67
|
+
}
|
|
68
|
+
function applyLookupArrayFilter(items, filter, textField, translateText) {
|
|
69
|
+
if (!filter?.field || filter.value === undefined || filter.value === null) {
|
|
70
|
+
return items;
|
|
71
|
+
}
|
|
72
|
+
const query = String(filter.value);
|
|
73
|
+
return items.filter((item) => {
|
|
74
|
+
const itemField = item[filter.field];
|
|
75
|
+
if (filter.field === textField) {
|
|
76
|
+
return matchesLookupText(String(itemField ?? ''), query, translateText);
|
|
77
|
+
}
|
|
78
|
+
if (typeof itemField === 'string' && typeof filter.value === 'string') {
|
|
79
|
+
return itemField.toLowerCase().includes(filter.value.toLowerCase());
|
|
80
|
+
}
|
|
81
|
+
return false;
|
|
82
|
+
});
|
|
83
|
+
}
|
|
24
84
|
/**
|
|
25
85
|
* Converts a drop-down-tree datasource (nested array or lazy callback) into an
|
|
26
86
|
* `AXDataSource` that a multi-column data table can load and expand.
|
|
@@ -83,7 +143,7 @@ function mapTreeNode(node, options) {
|
|
|
83
143
|
* all children. Every kept ancestor is a new object with `expanded: true` so
|
|
84
144
|
* nested hits are visible without mutating the original tree.
|
|
85
145
|
*/
|
|
86
|
-
function filterTreeNodes(nodes, textField, query) {
|
|
146
|
+
function filterTreeNodes(nodes, textField, query, translateText) {
|
|
87
147
|
const needle = query.trim().toLowerCase();
|
|
88
148
|
if (!needle) {
|
|
89
149
|
return nodes;
|
|
@@ -92,10 +152,8 @@ function filterTreeNodes(nodes, textField, query) {
|
|
|
92
152
|
for (const node of nodes) {
|
|
93
153
|
const rawChildren = node['children'];
|
|
94
154
|
const nested = Array.isArray(rawChildren) ? rawChildren : undefined;
|
|
95
|
-
const children = nested ? filterTreeNodes(nested, textField, needle) : undefined;
|
|
96
|
-
const selfMatch = String(node[textField] ?? '')
|
|
97
|
-
.toLowerCase()
|
|
98
|
-
.includes(needle);
|
|
155
|
+
const children = nested ? filterTreeNodes(nested, textField, needle, translateText) : undefined;
|
|
156
|
+
const selfMatch = matchesLookupText(String(node[textField] ?? ''), needle, translateText);
|
|
99
157
|
if (selfMatch) {
|
|
100
158
|
result.push({
|
|
101
159
|
...node,
|
|
@@ -157,6 +215,58 @@ function findTreeNode(nodes, valueField, key) {
|
|
|
157
215
|
return null;
|
|
158
216
|
}
|
|
159
217
|
|
|
218
|
+
/**
|
|
219
|
+
* Scrolls a CDK virtual viewport so the row at `index` is visible using nearest-edge behavior.
|
|
220
|
+
* Uses offset math because the row may not be rendered in the DOM yet.
|
|
221
|
+
*/
|
|
222
|
+
function scrollNearestByOffset(viewport, index, itemHeight, totalCount) {
|
|
223
|
+
const viewportSize = viewport.getViewportSize();
|
|
224
|
+
const maxOffset = Math.max(0, totalCount * itemHeight - viewportSize);
|
|
225
|
+
const itemTop = index * itemHeight;
|
|
226
|
+
const itemBottom = itemTop + itemHeight;
|
|
227
|
+
const currentOffset = viewport.measureScrollOffset();
|
|
228
|
+
if (itemTop < currentOffset) {
|
|
229
|
+
viewport.scrollToOffset(itemTop);
|
|
230
|
+
}
|
|
231
|
+
else if (itemBottom > currentOffset + viewportSize) {
|
|
232
|
+
viewport.scrollToOffset(Math.min(maxOffset, itemBottom - viewportSize));
|
|
233
|
+
}
|
|
234
|
+
}
|
|
235
|
+
/**
|
|
236
|
+
* Scrolls a data-table body so the selected row is visible, accounting for a sticky header.
|
|
237
|
+
*/
|
|
238
|
+
function scrollTableToSelectedRow(host, attempts = 5) {
|
|
239
|
+
retryFrames(() => {
|
|
240
|
+
const wrapper = host.querySelector('.ax-data-table-wrapper');
|
|
241
|
+
const row = wrapper?.querySelector('tr.ax-state-selected');
|
|
242
|
+
if (!wrapper || !row) {
|
|
243
|
+
return false;
|
|
244
|
+
}
|
|
245
|
+
const thead = wrapper.querySelector('thead');
|
|
246
|
+
const topInset = thead?.offsetHeight ?? 0;
|
|
247
|
+
scrollNearestIntoView(wrapper, row, topInset);
|
|
248
|
+
return true;
|
|
249
|
+
}, attempts);
|
|
250
|
+
}
|
|
251
|
+
/**
|
|
252
|
+
* Scrolls a lookup tree container so the node with `selectedId` is visible.
|
|
253
|
+
* Nodes inside collapsed branches are not in the DOM and are skipped.
|
|
254
|
+
*/
|
|
255
|
+
function scrollTreeToSelectedNode(host, selectedId, attempts = 5) {
|
|
256
|
+
if (!selectedId) {
|
|
257
|
+
return;
|
|
258
|
+
}
|
|
259
|
+
retryFrames(() => {
|
|
260
|
+
const container = host.querySelector('.ax-lookup-tree');
|
|
261
|
+
const node = container?.querySelector(`[data-tree-node-id="${CSS.escape(selectedId)}"]`);
|
|
262
|
+
if (!container || !node) {
|
|
263
|
+
return false;
|
|
264
|
+
}
|
|
265
|
+
scrollNearestIntoView(container, node);
|
|
266
|
+
return true;
|
|
267
|
+
}, attempts);
|
|
268
|
+
}
|
|
269
|
+
|
|
160
270
|
/**
|
|
161
271
|
* Shared `AXDataSource` + CDK virtual scroll plumbing for the list-based lookup views
|
|
162
272
|
* (`ax-lookup-drop-down-list`, `ax-lookup-multi-select`).
|
|
@@ -171,6 +281,16 @@ class AXLookupListViewBase {
|
|
|
171
281
|
return this.totalCount();
|
|
172
282
|
}
|
|
173
283
|
#ngZone;
|
|
284
|
+
/**
|
|
285
|
+
* Before the first page loads, `totalCount` is 0 but `cachedItems` is pre-sized to `pageSize`.
|
|
286
|
+
* After a completed load with no rows, `cachedItems` is an empty array.
|
|
287
|
+
*/
|
|
288
|
+
#hasPendingInitialLoad(source) {
|
|
289
|
+
return source.totalCount === 0 && source.cachedItems.length > 0 && !source.isLoading;
|
|
290
|
+
}
|
|
291
|
+
#syncLoadingState(source, isLoading) {
|
|
292
|
+
this.isLoading.set(isLoading || this.#hasPendingInitialLoad(source));
|
|
293
|
+
}
|
|
174
294
|
constructor() {
|
|
175
295
|
/**
|
|
176
296
|
* The datasource providing the items (paged, remote-capable).
|
|
@@ -287,20 +407,76 @@ class AXLookupListViewBase {
|
|
|
287
407
|
const list = new AXListDataSource({ source });
|
|
288
408
|
untracked(() => {
|
|
289
409
|
this.totalCount.set(source.totalCount);
|
|
290
|
-
this
|
|
410
|
+
this.#syncLoadingState(source, source.isLoading);
|
|
291
411
|
this.listDataSource.set(list);
|
|
292
412
|
});
|
|
293
|
-
const loadingSub = source.onLoadingChanged.subscribe((value) => this
|
|
294
|
-
const changedSub = source.onChanged.subscribe((e) =>
|
|
413
|
+
const loadingSub = source.onLoadingChanged.subscribe((value) => this.#syncLoadingState(source, value));
|
|
414
|
+
const changedSub = source.onChanged.subscribe((e) => {
|
|
415
|
+
this.totalCount.set(e.totalCount);
|
|
416
|
+
if (!source.isLoading) {
|
|
417
|
+
this.#syncLoadingState(source, false);
|
|
418
|
+
}
|
|
419
|
+
});
|
|
295
420
|
onCleanup(() => {
|
|
296
421
|
loadingSub.unsubscribe();
|
|
297
422
|
changedSub.unsubscribe();
|
|
298
423
|
});
|
|
299
424
|
});
|
|
425
|
+
// Scroll the selected row into view once the virtual viewport and data are ready.
|
|
426
|
+
effect(() => {
|
|
427
|
+
const viewport = this.viewportRef();
|
|
428
|
+
const loading = this.isLoading();
|
|
429
|
+
const count = this.totalCount();
|
|
430
|
+
const values = this.selectedValues();
|
|
431
|
+
const field = this.valueField();
|
|
432
|
+
const height = this.itemHeight();
|
|
433
|
+
const source = this.dataSource();
|
|
434
|
+
if (!viewport || loading || count === 0 || values.length === 0) {
|
|
435
|
+
return;
|
|
436
|
+
}
|
|
437
|
+
untracked(() => {
|
|
438
|
+
requestAnimationFrame(() => {
|
|
439
|
+
viewport.checkViewportSize();
|
|
440
|
+
const index = this.#resolveSelectedIndex(source, values, field);
|
|
441
|
+
if (index >= 0) {
|
|
442
|
+
scrollNearestByOffset(viewport, index, height, count);
|
|
443
|
+
}
|
|
444
|
+
});
|
|
445
|
+
});
|
|
446
|
+
});
|
|
300
447
|
}
|
|
301
|
-
|
|
448
|
+
#resolveSelectedIndex(source, values, valueField) {
|
|
449
|
+
const selectedValue = values[0];
|
|
450
|
+
if (selectedValue == null) {
|
|
451
|
+
return -1;
|
|
452
|
+
}
|
|
453
|
+
const items = source.cachedItems;
|
|
454
|
+
for (let index = 0; index < items.length; index++) {
|
|
455
|
+
const item = items[index];
|
|
456
|
+
if (item != null && item[valueField] == selectedValue) {
|
|
457
|
+
return index;
|
|
458
|
+
}
|
|
459
|
+
}
|
|
460
|
+
return -1;
|
|
461
|
+
}
|
|
462
|
+
/** Moves keyboard focus to the selected list option, or the first option when none is selected. */
|
|
302
463
|
focusFirst() {
|
|
303
|
-
this.listNavigation()
|
|
464
|
+
const nav = this.listNavigation();
|
|
465
|
+
if (!nav) {
|
|
466
|
+
return;
|
|
467
|
+
}
|
|
468
|
+
const viewport = this.viewportRef();
|
|
469
|
+
const selectedHost = viewport?.elementRef.nativeElement.querySelector('.ax-lookup-option-host.ax-state-selected');
|
|
470
|
+
if (selectedHost) {
|
|
471
|
+
const items = this.navItems();
|
|
472
|
+
const index = items.findIndex((item) => item.itemElem.nativeElement === selectedHost);
|
|
473
|
+
if (index >= 0) {
|
|
474
|
+
nav.activeIndex.set(index);
|
|
475
|
+
nav.navigateTo(items[index]);
|
|
476
|
+
return;
|
|
477
|
+
}
|
|
478
|
+
}
|
|
479
|
+
nav.focusOnIndex(0);
|
|
304
480
|
}
|
|
305
481
|
getValue(item) {
|
|
306
482
|
return item?.[this.valueField()];
|
|
@@ -439,7 +615,7 @@ class AXLookupDropDownListComponent extends AXLookupListViewBase {
|
|
|
439
615
|
/>
|
|
440
616
|
} @else {
|
|
441
617
|
<span class="ax-lookup-option-text">
|
|
442
|
-
<ax-highlight-text [text]="getText(item)" [query]="highlightText()" />
|
|
618
|
+
<ax-highlight-text [text]="getText(item) | translate | async" [query]="highlightText()" />
|
|
443
619
|
</span>
|
|
444
620
|
@if (isSelected(item)) {
|
|
445
621
|
<span class="ax-lookup-option-check ax-icon ax-icon-check" aria-hidden="true"></span>
|
|
@@ -513,7 +689,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
513
689
|
/>
|
|
514
690
|
} @else {
|
|
515
691
|
<span class="ax-lookup-option-text">
|
|
516
|
-
<ax-highlight-text [text]="getText(item)" [query]="highlightText()" />
|
|
692
|
+
<ax-highlight-text [text]="getText(item) | translate | async" [query]="highlightText()" />
|
|
517
693
|
</span>
|
|
518
694
|
@if (isSelected(item)) {
|
|
519
695
|
<span class="ax-lookup-option-check ax-icon ax-icon-check" aria-hidden="true"></span>
|
|
@@ -544,7 +720,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
544
720
|
* @category Components
|
|
545
721
|
*/
|
|
546
722
|
class AXLookupDropDownTreeComponent {
|
|
723
|
+
#host;
|
|
547
724
|
constructor() {
|
|
725
|
+
this.#host = inject((ElementRef));
|
|
548
726
|
/**
|
|
549
727
|
* The tree datasource: an array of nodes or a lazy children callback.
|
|
550
728
|
*/
|
|
@@ -608,6 +786,13 @@ class AXLookupDropDownTreeComponent {
|
|
|
608
786
|
...(ngDevMode ? [{ debugName: "isEmpty" }] : /* istanbul ignore next */ []));
|
|
609
787
|
this.treeInstances = computed(() => [{ id: this.filterKey(), source: this.dataSource() }], /* @ts-ignore */
|
|
610
788
|
...(ngDevMode ? [{ debugName: "treeInstances" }] : /* istanbul ignore next */ []));
|
|
789
|
+
afterRenderEffect(() => {
|
|
790
|
+
const selectedId = this.selectedIds()[0];
|
|
791
|
+
if (!selectedId || this.isEmpty()) {
|
|
792
|
+
return;
|
|
793
|
+
}
|
|
794
|
+
scrollTreeToSelectedNode(this.#host.nativeElement, selectedId);
|
|
795
|
+
});
|
|
611
796
|
}
|
|
612
797
|
/** Whether the filtered tree currently has no nodes. */
|
|
613
798
|
hasNoMatches() {
|
|
@@ -645,7 +830,7 @@ class AXLookupDropDownTreeComponent {
|
|
|
645
830
|
[idField]="valueField()"
|
|
646
831
|
[titleField]="textField()"
|
|
647
832
|
[disabledField]="disabledField()"
|
|
648
|
-
[nodeTemplate]="nodeTemplate()"
|
|
833
|
+
[nodeTemplate]="nodeTemplate() ?? defaultNodeTemplate"
|
|
649
834
|
[alternate]="alternate()"
|
|
650
835
|
[highlightText]="highlightText()"
|
|
651
836
|
(onSelectionChange)="handleSelectionChange($event)"
|
|
@@ -653,6 +838,10 @@ class AXLookupDropDownTreeComponent {
|
|
|
653
838
|
}
|
|
654
839
|
</div>
|
|
655
840
|
}
|
|
841
|
+
|
|
842
|
+
<ng-template #defaultNodeTemplate let-node>
|
|
843
|
+
<span class="ax-lookup-tree-node-label">{{ node?.[textField()] | translate | async }}</span>
|
|
844
|
+
</ng-template>
|
|
656
845
|
`, isInline: true, dependencies: [{ kind: "component", type: AXTreeViewComponent, selector: "ax-tree-view", inputs: ["datasource", "selectMode", "selectionBehavior", "dragArea", "dragBehavior", "showIcons", "showChildrenBadge", "expandedIcon", "collapsedIcon", "indentSize", "look", "alternate", "nodeTemplate", "idField", "titleField", "highlightText", "tooltipField", "iconField", "expandedField", "selectedField", "indeterminateField", "disabledField", "hiddenField", "childrenField", "childrenCountField", "dataField", "inheritDisabled", "expandOnDoubleClick", "doubleClickDuration", "tooltipDelay", "controlledSelection", "selectedIds"], outputs: ["datasourceChange", "selectedIdsChange", "onBeforeDrop", "onNodeToggle", "onNodeSelect", "onNodeDoubleClick", "onNodeClick", "onSelectionChange", "onOrderChange", "onMoveChange", "onItemsChange"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
657
846
|
}
|
|
658
847
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXLookupDropDownTreeComponent, decorators: [{
|
|
@@ -683,7 +872,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
683
872
|
[idField]="valueField()"
|
|
684
873
|
[titleField]="textField()"
|
|
685
874
|
[disabledField]="disabledField()"
|
|
686
|
-
[nodeTemplate]="nodeTemplate()"
|
|
875
|
+
[nodeTemplate]="nodeTemplate() ?? defaultNodeTemplate"
|
|
687
876
|
[alternate]="alternate()"
|
|
688
877
|
[highlightText]="highlightText()"
|
|
689
878
|
(onSelectionChange)="handleSelectionChange($event)"
|
|
@@ -691,9 +880,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
691
880
|
}
|
|
692
881
|
</div>
|
|
693
882
|
}
|
|
883
|
+
|
|
884
|
+
<ng-template #defaultNodeTemplate let-node>
|
|
885
|
+
<span class="ax-lookup-tree-node-label">{{ node?.[textField()] | translate | async }}</span>
|
|
886
|
+
</ng-template>
|
|
694
887
|
`,
|
|
695
888
|
}]
|
|
696
|
-
}], propDecorators: { dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: true }] }], valueField: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueField", required: false }] }], textField: [{ type: i0.Input, args: [{ isSignal: true, alias: "textField", required: false }] }], disabledField: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabledField", required: false }] }], selectedValues: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedValues", required: false }] }], nodeTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "nodeTemplate", required: false }] }], emptyTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyTemplate", required: false }] }], alternate: [{ type: i0.Input, args: [{ isSignal: true, alias: "alternate", required: false }] }], filterKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterKey", required: false }] }], highlightText: [{ type: i0.Input, args: [{ isSignal: true, alias: "highlightText", required: false }] }], itemClick: [{ type: i0.Output, args: ["itemClick"] }] } });
|
|
889
|
+
}], ctorParameters: () => [], propDecorators: { dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: true }] }], valueField: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueField", required: false }] }], textField: [{ type: i0.Input, args: [{ isSignal: true, alias: "textField", required: false }] }], disabledField: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabledField", required: false }] }], selectedValues: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedValues", required: false }] }], nodeTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "nodeTemplate", required: false }] }], emptyTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyTemplate", required: false }] }], alternate: [{ type: i0.Input, args: [{ isSignal: true, alias: "alternate", required: false }] }], filterKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterKey", required: false }] }], highlightText: [{ type: i0.Input, args: [{ isSignal: true, alias: "highlightText", required: false }] }], itemClick: [{ type: i0.Output, args: ["itemClick"] }] } });
|
|
697
890
|
|
|
698
891
|
/**
|
|
699
892
|
* Internal mini component for the `multi-column-tree` lookup mode:
|
|
@@ -703,7 +896,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
703
896
|
* @category Components
|
|
704
897
|
*/
|
|
705
898
|
class AXLookupMultiColumnTreeComponent {
|
|
899
|
+
#host;
|
|
706
900
|
constructor() {
|
|
901
|
+
this.#host = inject((ElementRef));
|
|
707
902
|
/**
|
|
708
903
|
* The datasource providing hierarchical rows (roots on load, children via `parentField`).
|
|
709
904
|
*/
|
|
@@ -810,6 +1005,12 @@ class AXLookupMultiColumnTreeComponent {
|
|
|
810
1005
|
}
|
|
811
1006
|
return classes.join(' ');
|
|
812
1007
|
};
|
|
1008
|
+
afterRenderEffect(() => {
|
|
1009
|
+
if (this.selectedValues().length === 0) {
|
|
1010
|
+
return;
|
|
1011
|
+
}
|
|
1012
|
+
scrollTableToSelectedRow(this.#host.nativeElement);
|
|
1013
|
+
});
|
|
813
1014
|
}
|
|
814
1015
|
/** Stable unique key for `@for` — avoids NG0955 when `field` is missing or duplicated. */
|
|
815
1016
|
trackColumnKey(index, column) {
|
|
@@ -881,7 +1082,8 @@ class AXLookupMultiColumnTreeComponent {
|
|
|
881
1082
|
@for (column of columns(); track trackColumnKey($index, column)) {
|
|
882
1083
|
<ax-text-column
|
|
883
1084
|
[dataField]="column.field"
|
|
884
|
-
[caption]="column.title"
|
|
1085
|
+
[caption]="column.title | translate | async"
|
|
1086
|
+
[translate]="true"
|
|
885
1087
|
[width]="resolveColumnWidth(column)"
|
|
886
1088
|
[expandHandler]="isExpandColumn($index, column)"
|
|
887
1089
|
[allowSorting]="false"
|
|
@@ -908,7 +1110,7 @@ class AXLookupMultiColumnTreeComponent {
|
|
|
908
1110
|
</td>
|
|
909
1111
|
</tr>
|
|
910
1112
|
</ng-template>
|
|
911
|
-
`, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: AXDataTableComponent, selector: "ax-data-table", inputs: ["dataSource", "selectedRows", "parentField", "hasChildrenField", "rowDetailsTemplate", "rowCssClass", "cellCssClass", "highlightText", "look", "rowTemplate", "emptyTemplate", "noDataTemplate", "alternative", "showHeader", "fixedHeader", "showFooter", "fixedFooter", "itemHeight", "allowReordering", "paging", "fetchDataMode", "loading", "focusedRow"], outputs: ["selectedRowsChange", "focusedRowChange", "onRowClick", "onRowDbClick", "onColumnsOrderChanged", "onColumnSizeChanged", "onPageChanged"] }, { kind: "component", type: AXDataTableTextColumnComponent, selector: "ax-text-column", inputs: ["width", "caption", "allowSorting", "allowResizing", "fixed", "hasTitle", "customExpandIcon", "customCollapseIcon", "dataField", "expandHandler", "wrapText", "cellTemplate", "footerTemplate", "headerTemplate", "format", "formatOptions"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1113
|
+
`, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: AXDataTableComponent, selector: "ax-data-table", inputs: ["dataSource", "selectedRows", "parentField", "hasChildrenField", "rowDetailsTemplate", "rowCssClass", "cellCssClass", "highlightText", "look", "rowTemplate", "emptyTemplate", "noDataTemplate", "alternative", "showHeader", "fixedHeader", "showFooter", "fixedFooter", "itemHeight", "allowReordering", "paging", "fetchDataMode", "loading", "focusedRow"], outputs: ["selectedRowsChange", "focusedRowChange", "onRowClick", "onRowDbClick", "onColumnsOrderChanged", "onColumnSizeChanged", "onPageChanged"] }, { kind: "component", type: AXDataTableTextColumnComponent, selector: "ax-text-column", inputs: ["width", "caption", "allowSorting", "allowResizing", "fixed", "hasTitle", "customExpandIcon", "customCollapseIcon", "dataField", "expandHandler", "wrapText", "translate", "cellTemplate", "footerTemplate", "headerTemplate", "format", "formatOptions"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
912
1114
|
}
|
|
913
1115
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXLookupMultiColumnTreeComponent, decorators: [{
|
|
914
1116
|
type: Component,
|
|
@@ -916,7 +1118,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
916
1118
|
selector: 'ax-lookup-multi-column-tree',
|
|
917
1119
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
918
1120
|
encapsulation: ViewEncapsulation.None,
|
|
919
|
-
imports: [NgTemplateOutlet, AXDataTableComponent, AXDataTableTextColumnComponent],
|
|
1121
|
+
imports: [NgTemplateOutlet, AsyncPipe, AXTranslatorPipe, AXDataTableComponent, AXDataTableTextColumnComponent],
|
|
920
1122
|
host: {
|
|
921
1123
|
class: 'ax-lookup-multi-column ax-lookup-multi-column-tree',
|
|
922
1124
|
'[style.height.px]': 'tableHeight()',
|
|
@@ -945,7 +1147,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
945
1147
|
@for (column of columns(); track trackColumnKey($index, column)) {
|
|
946
1148
|
<ax-text-column
|
|
947
1149
|
[dataField]="column.field"
|
|
948
|
-
[caption]="column.title"
|
|
1150
|
+
[caption]="column.title | translate | async"
|
|
1151
|
+
[translate]="true"
|
|
949
1152
|
[width]="resolveColumnWidth(column)"
|
|
950
1153
|
[expandHandler]="isExpandColumn($index, column)"
|
|
951
1154
|
[allowSorting]="false"
|
|
@@ -974,7 +1177,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
974
1177
|
</ng-template>
|
|
975
1178
|
`,
|
|
976
1179
|
}]
|
|
977
|
-
}], propDecorators: { dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: true }] }], valueField: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueField", required: false }] }], textField: [{ type: i0.Input, args: [{ isSignal: true, alias: "textField", required: false }] }], disabledField: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabledField", required: false }] }], parentField: [{ type: i0.Input, args: [{ isSignal: true, alias: "parentField", required: false }] }], hasChildrenField: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasChildrenField", required: false }] }], selectedValues: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedValues", required: false }] }], itemHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemHeight", required: false }] }], maxVisibleItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxVisibleItems", required: false }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], itemTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemTemplate", required: false }] }], emptyTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyTemplate", required: false }] }], loadingTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingTemplate", required: false }] }], alternate: [{ type: i0.Input, args: [{ isSignal: true, alias: "alternate", required: false }] }], highlightText: [{ type: i0.Input, args: [{ isSignal: true, alias: "highlightText", required: false }] }], itemClick: [{ type: i0.Output, args: ["itemClick"] }] } });
|
|
1180
|
+
}], ctorParameters: () => [], propDecorators: { dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: true }] }], valueField: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueField", required: false }] }], textField: [{ type: i0.Input, args: [{ isSignal: true, alias: "textField", required: false }] }], disabledField: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabledField", required: false }] }], parentField: [{ type: i0.Input, args: [{ isSignal: true, alias: "parentField", required: false }] }], hasChildrenField: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasChildrenField", required: false }] }], selectedValues: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedValues", required: false }] }], itemHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemHeight", required: false }] }], maxVisibleItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxVisibleItems", required: false }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], itemTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemTemplate", required: false }] }], emptyTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyTemplate", required: false }] }], loadingTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingTemplate", required: false }] }], alternate: [{ type: i0.Input, args: [{ isSignal: true, alias: "alternate", required: false }] }], highlightText: [{ type: i0.Input, args: [{ isSignal: true, alias: "highlightText", required: false }] }], itemClick: [{ type: i0.Output, args: ["itemClick"] }] } });
|
|
978
1181
|
|
|
979
1182
|
/**
|
|
980
1183
|
* Internal mini component for the `multi-column` lookup mode:
|
|
@@ -1114,6 +1317,12 @@ class AXLookupMultiColumnComponent {
|
|
|
1114
1317
|
}
|
|
1115
1318
|
return classes.join(' ');
|
|
1116
1319
|
};
|
|
1320
|
+
afterRenderEffect(() => {
|
|
1321
|
+
if (this.selectedValues().length === 0 || this.#totalCount() === 0) {
|
|
1322
|
+
return;
|
|
1323
|
+
}
|
|
1324
|
+
scrollTableToSelectedRow(this.#host.nativeElement);
|
|
1325
|
+
});
|
|
1117
1326
|
effect((onCleanup) => {
|
|
1118
1327
|
const source = this.dataSource();
|
|
1119
1328
|
this.tableDataSource.config.key = source.config.key || this.valueField();
|
|
@@ -1236,7 +1445,8 @@ class AXLookupMultiColumnComponent {
|
|
|
1236
1445
|
@for (column of columns(); track trackColumnKey($index, column)) {
|
|
1237
1446
|
<ax-text-column
|
|
1238
1447
|
[dataField]="column.field"
|
|
1239
|
-
[caption]="column.title"
|
|
1448
|
+
[caption]="column.title | translate | async"
|
|
1449
|
+
[translate]="true"
|
|
1240
1450
|
[width]="resolveColumnWidth(column)"
|
|
1241
1451
|
[allowSorting]="false"
|
|
1242
1452
|
[allowResizing]="false"
|
|
@@ -1262,7 +1472,7 @@ class AXLookupMultiColumnComponent {
|
|
|
1262
1472
|
</td>
|
|
1263
1473
|
</tr>
|
|
1264
1474
|
</ng-template>
|
|
1265
|
-
`, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: AXDataTableComponent, selector: "ax-data-table", inputs: ["dataSource", "selectedRows", "parentField", "hasChildrenField", "rowDetailsTemplate", "rowCssClass", "cellCssClass", "highlightText", "look", "rowTemplate", "emptyTemplate", "noDataTemplate", "alternative", "showHeader", "fixedHeader", "showFooter", "fixedFooter", "itemHeight", "allowReordering", "paging", "fetchDataMode", "loading", "focusedRow"], outputs: ["selectedRowsChange", "focusedRowChange", "onRowClick", "onRowDbClick", "onColumnsOrderChanged", "onColumnSizeChanged", "onPageChanged"] }, { kind: "component", type: AXDataTableTextColumnComponent, selector: "ax-text-column", inputs: ["width", "caption", "allowSorting", "allowResizing", "fixed", "hasTitle", "customExpandIcon", "customCollapseIcon", "dataField", "expandHandler", "wrapText", "cellTemplate", "footerTemplate", "headerTemplate", "format", "formatOptions"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1475
|
+
`, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: AXDataTableComponent, selector: "ax-data-table", inputs: ["dataSource", "selectedRows", "parentField", "hasChildrenField", "rowDetailsTemplate", "rowCssClass", "cellCssClass", "highlightText", "look", "rowTemplate", "emptyTemplate", "noDataTemplate", "alternative", "showHeader", "fixedHeader", "showFooter", "fixedFooter", "itemHeight", "allowReordering", "paging", "fetchDataMode", "loading", "focusedRow"], outputs: ["selectedRowsChange", "focusedRowChange", "onRowClick", "onRowDbClick", "onColumnsOrderChanged", "onColumnSizeChanged", "onPageChanged"] }, { kind: "component", type: AXDataTableTextColumnComponent, selector: "ax-text-column", inputs: ["width", "caption", "allowSorting", "allowResizing", "fixed", "hasTitle", "customExpandIcon", "customCollapseIcon", "dataField", "expandHandler", "wrapText", "translate", "cellTemplate", "footerTemplate", "headerTemplate", "format", "formatOptions"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1266
1476
|
}
|
|
1267
1477
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXLookupMultiColumnComponent, decorators: [{
|
|
1268
1478
|
type: Component,
|
|
@@ -1270,7 +1480,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
1270
1480
|
selector: 'ax-lookup-multi-column',
|
|
1271
1481
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
1272
1482
|
encapsulation: ViewEncapsulation.None,
|
|
1273
|
-
imports: [NgTemplateOutlet, AXDataTableComponent, AXDataTableTextColumnComponent],
|
|
1483
|
+
imports: [NgTemplateOutlet, AsyncPipe, AXTranslatorPipe, AXDataTableComponent, AXDataTableTextColumnComponent],
|
|
1274
1484
|
host: {
|
|
1275
1485
|
class: 'ax-lookup-multi-column',
|
|
1276
1486
|
'[style.height.px]': 'tableHeight()',
|
|
@@ -1297,7 +1507,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
1297
1507
|
@for (column of columns(); track trackColumnKey($index, column)) {
|
|
1298
1508
|
<ax-text-column
|
|
1299
1509
|
[dataField]="column.field"
|
|
1300
|
-
[caption]="column.title"
|
|
1510
|
+
[caption]="column.title | translate | async"
|
|
1511
|
+
[translate]="true"
|
|
1301
1512
|
[width]="resolveColumnWidth(column)"
|
|
1302
1513
|
[allowSorting]="false"
|
|
1303
1514
|
[allowResizing]="false"
|
|
@@ -1334,7 +1545,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
1334
1545
|
* @category Components
|
|
1335
1546
|
*/
|
|
1336
1547
|
class AXLookupMultiSelectTreeComponent {
|
|
1548
|
+
#host;
|
|
1337
1549
|
constructor() {
|
|
1550
|
+
this.#host = inject((ElementRef));
|
|
1338
1551
|
/**
|
|
1339
1552
|
* The tree datasource: an array of nodes or a lazy children callback.
|
|
1340
1553
|
*/
|
|
@@ -1403,6 +1616,13 @@ class AXLookupMultiSelectTreeComponent {
|
|
|
1403
1616
|
...(ngDevMode ? [{ debugName: "isEmpty" }] : /* istanbul ignore next */ []));
|
|
1404
1617
|
this.treeInstances = computed(() => [{ id: this.filterKey(), source: this.dataSource() }], /* @ts-ignore */
|
|
1405
1618
|
...(ngDevMode ? [{ debugName: "treeInstances" }] : /* istanbul ignore next */ []));
|
|
1619
|
+
afterRenderEffect(() => {
|
|
1620
|
+
const selectedId = this.selectedIds()[0];
|
|
1621
|
+
if (!selectedId || this.isEmpty()) {
|
|
1622
|
+
return;
|
|
1623
|
+
}
|
|
1624
|
+
scrollTreeToSelectedNode(this.#host.nativeElement, selectedId);
|
|
1625
|
+
});
|
|
1406
1626
|
}
|
|
1407
1627
|
/** Whether the filtered tree currently has no nodes. */
|
|
1408
1628
|
hasNoMatches() {
|
|
@@ -1436,7 +1656,7 @@ class AXLookupMultiSelectTreeComponent {
|
|
|
1436
1656
|
[idField]="valueField()"
|
|
1437
1657
|
[titleField]="textField()"
|
|
1438
1658
|
[disabledField]="disabledField()"
|
|
1439
|
-
[nodeTemplate]="nodeTemplate()"
|
|
1659
|
+
[nodeTemplate]="nodeTemplate() ?? defaultNodeTemplate"
|
|
1440
1660
|
[alternate]="alternate()"
|
|
1441
1661
|
[highlightText]="highlightText()"
|
|
1442
1662
|
(onSelectionChange)="handleSelectionChange($event)"
|
|
@@ -1444,6 +1664,10 @@ class AXLookupMultiSelectTreeComponent {
|
|
|
1444
1664
|
}
|
|
1445
1665
|
</div>
|
|
1446
1666
|
}
|
|
1667
|
+
|
|
1668
|
+
<ng-template #defaultNodeTemplate let-node>
|
|
1669
|
+
<span class="ax-lookup-tree-node-label">{{ node?.[textField()] | translate | async }}</span>
|
|
1670
|
+
</ng-template>
|
|
1447
1671
|
`, isInline: true, dependencies: [{ kind: "component", type: AXTreeViewComponent, selector: "ax-tree-view", inputs: ["datasource", "selectMode", "selectionBehavior", "dragArea", "dragBehavior", "showIcons", "showChildrenBadge", "expandedIcon", "collapsedIcon", "indentSize", "look", "alternate", "nodeTemplate", "idField", "titleField", "highlightText", "tooltipField", "iconField", "expandedField", "selectedField", "indeterminateField", "disabledField", "hiddenField", "childrenField", "childrenCountField", "dataField", "inheritDisabled", "expandOnDoubleClick", "doubleClickDuration", "tooltipDelay", "controlledSelection", "selectedIds"], outputs: ["datasourceChange", "selectedIdsChange", "onBeforeDrop", "onNodeToggle", "onNodeSelect", "onNodeDoubleClick", "onNodeClick", "onSelectionChange", "onOrderChange", "onMoveChange", "onItemsChange"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1448
1672
|
}
|
|
1449
1673
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXLookupMultiSelectTreeComponent, decorators: [{
|
|
@@ -1474,7 +1698,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
1474
1698
|
[idField]="valueField()"
|
|
1475
1699
|
[titleField]="textField()"
|
|
1476
1700
|
[disabledField]="disabledField()"
|
|
1477
|
-
[nodeTemplate]="nodeTemplate()"
|
|
1701
|
+
[nodeTemplate]="nodeTemplate() ?? defaultNodeTemplate"
|
|
1478
1702
|
[alternate]="alternate()"
|
|
1479
1703
|
[highlightText]="highlightText()"
|
|
1480
1704
|
(onSelectionChange)="handleSelectionChange($event)"
|
|
@@ -1482,9 +1706,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
1482
1706
|
}
|
|
1483
1707
|
</div>
|
|
1484
1708
|
}
|
|
1709
|
+
|
|
1710
|
+
<ng-template #defaultNodeTemplate let-node>
|
|
1711
|
+
<span class="ax-lookup-tree-node-label">{{ node?.[textField()] | translate | async }}</span>
|
|
1712
|
+
</ng-template>
|
|
1485
1713
|
`,
|
|
1486
1714
|
}]
|
|
1487
|
-
}], propDecorators: { dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: true }] }], valueField: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueField", required: false }] }], textField: [{ type: i0.Input, args: [{ isSignal: true, alias: "textField", required: false }] }], disabledField: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabledField", required: false }] }], selectedValues: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedValues", required: false }] }], selectionBehavior: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectionBehavior", required: false }] }], nodeTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "nodeTemplate", required: false }] }], emptyTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyTemplate", required: false }] }], alternate: [{ type: i0.Input, args: [{ isSignal: true, alias: "alternate", required: false }] }], filterKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterKey", required: false }] }], highlightText: [{ type: i0.Input, args: [{ isSignal: true, alias: "highlightText", required: false }] }], selectionChange: [{ type: i0.Output, args: ["selectionChange"] }] } });
|
|
1715
|
+
}], ctorParameters: () => [], propDecorators: { dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: true }] }], valueField: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueField", required: false }] }], textField: [{ type: i0.Input, args: [{ isSignal: true, alias: "textField", required: false }] }], disabledField: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabledField", required: false }] }], selectedValues: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedValues", required: false }] }], selectionBehavior: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectionBehavior", required: false }] }], nodeTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "nodeTemplate", required: false }] }], emptyTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyTemplate", required: false }] }], alternate: [{ type: i0.Input, args: [{ isSignal: true, alias: "alternate", required: false }] }], filterKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterKey", required: false }] }], highlightText: [{ type: i0.Input, args: [{ isSignal: true, alias: "highlightText", required: false }] }], selectionChange: [{ type: i0.Output, args: ["selectionChange"] }] } });
|
|
1488
1716
|
|
|
1489
1717
|
/**
|
|
1490
1718
|
* Internal mini component for the `multi-select` lookup mode:
|
|
@@ -1545,7 +1773,7 @@ class AXLookupMultiSelectComponent extends AXLookupListViewBase {
|
|
|
1545
1773
|
/>
|
|
1546
1774
|
} @else {
|
|
1547
1775
|
<span class="ax-lookup-option-text">
|
|
1548
|
-
<ax-highlight-text [text]="getText(item)" [query]="highlightText()" />
|
|
1776
|
+
<ax-highlight-text [text]="getText(item) | translate | async" [query]="highlightText()" />
|
|
1549
1777
|
</span>
|
|
1550
1778
|
}
|
|
1551
1779
|
} @else {
|
|
@@ -1623,7 +1851,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
1623
1851
|
/>
|
|
1624
1852
|
} @else {
|
|
1625
1853
|
<span class="ax-lookup-option-text">
|
|
1626
|
-
<ax-highlight-text [text]="getText(item)" [query]="highlightText()" />
|
|
1854
|
+
<ax-highlight-text [text]="getText(item) | translate | async" [query]="highlightText()" />
|
|
1627
1855
|
</span>
|
|
1628
1856
|
}
|
|
1629
1857
|
} @else {
|
|
@@ -1671,6 +1899,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
1671
1899
|
class AXLookupComponent extends NXValueComponent {
|
|
1672
1900
|
#platform;
|
|
1673
1901
|
#destroyRef;
|
|
1902
|
+
#translation;
|
|
1674
1903
|
/** Whether search filters the tree datasource instead of `AXDataSource`. */
|
|
1675
1904
|
#isTreeOnlySearchMode() {
|
|
1676
1905
|
const mode = this.mode();
|
|
@@ -1708,6 +1937,7 @@ class AXLookupComponent extends NXValueComponent {
|
|
|
1708
1937
|
super();
|
|
1709
1938
|
this.#platform = inject(AXPlatform);
|
|
1710
1939
|
this.#destroyRef = inject(DestroyRef);
|
|
1940
|
+
this.#translation = inject(AXTranslationService);
|
|
1711
1941
|
/**
|
|
1712
1942
|
* The name of the form field, used by validation rules and `ax-form.validate(names)`.
|
|
1713
1943
|
*/
|
|
@@ -1783,6 +2013,7 @@ class AXLookupComponent extends NXValueComponent {
|
|
|
1783
2013
|
...(ngDevMode ? [{ debugName: "adaptivityEnabled" }] : /* istanbul ignore next */ []));
|
|
1784
2014
|
/**
|
|
1785
2015
|
* Title shown in the actionsheet header on small screens. Falls back to `placeholder`.
|
|
2016
|
+
* Supports i18n expressions (e.g. `@acorex:selectbox.popover.title`).
|
|
1786
2017
|
*/
|
|
1787
2018
|
this.caption = input('', /* @ts-ignore */
|
|
1788
2019
|
...(ngDevMode ? [{ debugName: "caption" }] : /* istanbul ignore next */ []));
|
|
@@ -1796,14 +2027,20 @@ class AXLookupComponent extends NXValueComponent {
|
|
|
1796
2027
|
* Placeholder for the trigger search input when items are already selected
|
|
1797
2028
|
* (mainly useful in `multi-select` / `multi-select-tree`), and for the in-sheet search field on small screens.
|
|
1798
2029
|
* Falls back to `placeholder` when the selection is empty on desktop.
|
|
2030
|
+
* Supports i18n expressions (e.g. `@acorex:common.actions.search`).
|
|
1799
2031
|
*/
|
|
1800
|
-
this.searchPlaceholder = input('
|
|
2032
|
+
this.searchPlaceholder = input('@acorex:common.actions.search', /* @ts-ignore */
|
|
1801
2033
|
...(ngDevMode ? [{ debugName: "searchPlaceholder" }] : /* istanbul ignore next */ []));
|
|
1802
2034
|
/**
|
|
1803
2035
|
* The placeholder text shown when no value is selected.
|
|
2036
|
+
* Supports i18n expressions (e.g. `@acorex:chat.placeholders.select-conversation`).
|
|
1804
2037
|
*/
|
|
1805
2038
|
this.placeholder = input('', /* @ts-ignore */
|
|
1806
2039
|
...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
2040
|
+
/** Resolved `placeholder` (i18n-aware). */
|
|
2041
|
+
this.translatedPlaceholder = toTranslatedSignal(this.placeholder);
|
|
2042
|
+
/** Resolved `searchPlaceholder` (i18n-aware). */
|
|
2043
|
+
this.translatedSearchPlaceholder = toTranslatedSignal(this.searchPlaceholder);
|
|
1807
2044
|
/**
|
|
1808
2045
|
* Whether the lookup is disabled.
|
|
1809
2046
|
*/
|
|
@@ -1987,10 +2224,20 @@ class AXLookupComponent extends NXValueComponent {
|
|
|
1987
2224
|
}
|
|
1988
2225
|
const source = this.dataSource();
|
|
1989
2226
|
if (!source) {
|
|
1990
|
-
return
|
|
2227
|
+
return convertLookupArrayToDataSource([], {
|
|
2228
|
+
key: this.valueField(),
|
|
2229
|
+
pageSize: 20,
|
|
2230
|
+
textField: this.textField(),
|
|
2231
|
+
translateText: (text) => this.#translateItemText(text),
|
|
2232
|
+
});
|
|
1991
2233
|
}
|
|
1992
2234
|
return Array.isArray(source)
|
|
1993
|
-
?
|
|
2235
|
+
? convertLookupArrayToDataSource(source, {
|
|
2236
|
+
key: this.valueField(),
|
|
2237
|
+
pageSize: 20,
|
|
2238
|
+
textField: this.textField(),
|
|
2239
|
+
translateText: (text) => this.#translateItemText(text),
|
|
2240
|
+
})
|
|
1994
2241
|
: source;
|
|
1995
2242
|
}, /* @ts-ignore */
|
|
1996
2243
|
...(ngDevMode ? [{ debugName: "resolvedDataSource" }] : /* istanbul ignore next */ []));
|
|
@@ -2008,7 +2255,9 @@ class AXLookupComponent extends NXValueComponent {
|
|
|
2008
2255
|
return [];
|
|
2009
2256
|
}
|
|
2010
2257
|
if (Array.isArray(source)) {
|
|
2011
|
-
return query
|
|
2258
|
+
return query
|
|
2259
|
+
? filterTreeNodes(source, textField, query, (text) => this.#translateItemText(text))
|
|
2260
|
+
: cloneLookupTreeNodes(source);
|
|
2012
2261
|
}
|
|
2013
2262
|
if (!query) {
|
|
2014
2263
|
return (nodeId) => this.#loadCachedTreeNodes(source, nodeId);
|
|
@@ -2034,11 +2283,18 @@ class AXLookupComponent extends NXValueComponent {
|
|
|
2034
2283
|
return item ? this.getItemText(item) : '';
|
|
2035
2284
|
}, /* @ts-ignore */
|
|
2036
2285
|
...(ngDevMode ? [{ debugName: "displayText" }] : /* istanbul ignore next */ []));
|
|
2286
|
+
/** Resolved display text for the trigger input (i18n-aware). */
|
|
2287
|
+
this.translatedDisplayText = toTranslatedSignal(this.displayText);
|
|
2288
|
+
/** Actionsheet header title with i18n fallback chain. */
|
|
2289
|
+
this.actionsheetTitleSource = computed(() => this.caption() || this.placeholder() || '@acorex:selectbox.popover.title', /* @ts-ignore */
|
|
2290
|
+
...(ngDevMode ? [{ debugName: "actionsheetTitleSource" }] : /* istanbul ignore next */ []));
|
|
2291
|
+
/** Resolved actionsheet title (i18n-aware). */
|
|
2292
|
+
this.actionsheetTitle = toTranslatedSignal(this.actionsheetTitleSource);
|
|
2037
2293
|
/**
|
|
2038
2294
|
* Text typed in the editable trigger input.
|
|
2039
2295
|
* Multi-select starts empty; single modes sync from the selected display text.
|
|
2040
2296
|
*/
|
|
2041
|
-
this.searchText = linkedSignal(() => (this.isMultiple() ? '' : this.
|
|
2297
|
+
this.searchText = linkedSignal(() => (this.isMultiple() ? '' : this.translatedDisplayText()), /* @ts-ignore */
|
|
2042
2298
|
...(ngDevMode ? [{ debugName: "searchText" }] : /* istanbul ignore next */ []));
|
|
2043
2299
|
/**
|
|
2044
2300
|
* Whether the trigger should render `selectedTemplate` instead of the plain input text.
|
|
@@ -2052,18 +2308,18 @@ class AXLookupComponent extends NXValueComponent {
|
|
|
2052
2308
|
if (!this.isEditableTrigger()) {
|
|
2053
2309
|
return true;
|
|
2054
2310
|
}
|
|
2055
|
-
return !this.expanded() && this.searchText() === this.
|
|
2311
|
+
return !this.expanded() && this.searchText() === this.translatedDisplayText();
|
|
2056
2312
|
}, /* @ts-ignore */
|
|
2057
2313
|
...(ngDevMode ? [{ debugName: "showSelectedTemplate" }] : /* istanbul ignore next */ []));
|
|
2058
2314
|
/** Placeholder for the editable trigger search input. */
|
|
2059
2315
|
this.triggerSearchPlaceholder = computed(() => {
|
|
2060
2316
|
if (this.isActionsheetStyle()) {
|
|
2061
|
-
return this.isMultiple() && this.selectedItems().length > 0 ? '' : this.
|
|
2317
|
+
return this.isMultiple() && this.selectedItems().length > 0 ? '' : this.translatedPlaceholder();
|
|
2062
2318
|
}
|
|
2063
2319
|
if (this.isMultiple() && this.selectedItems().length > 0) {
|
|
2064
|
-
return this.
|
|
2320
|
+
return this.translatedSearchPlaceholder();
|
|
2065
2321
|
}
|
|
2066
|
-
return this.
|
|
2322
|
+
return this.translatedPlaceholder();
|
|
2067
2323
|
}, /* @ts-ignore */
|
|
2068
2324
|
...(ngDevMode ? [{ debugName: "triggerSearchPlaceholder" }] : /* istanbul ignore next */ []));
|
|
2069
2325
|
this.popoverRef = viewChild(AXPopoverComponent, /* @ts-ignore */
|
|
@@ -2366,7 +2622,10 @@ class AXLookupComponent extends NXValueComponent {
|
|
|
2366
2622
|
return false;
|
|
2367
2623
|
}
|
|
2368
2624
|
if (!this.isSheetSearchEnabled() && !this.isMultiple()) {
|
|
2369
|
-
|
|
2625
|
+
const queryLower = query.toLowerCase();
|
|
2626
|
+
const translated = this.translatedDisplayText().trim().toLowerCase();
|
|
2627
|
+
const raw = this.displayText().trim().toLowerCase();
|
|
2628
|
+
return queryLower !== translated && queryLower !== raw;
|
|
2370
2629
|
}
|
|
2371
2630
|
return true;
|
|
2372
2631
|
}
|
|
@@ -2419,7 +2678,7 @@ class AXLookupComponent extends NXValueComponent {
|
|
|
2419
2678
|
*/
|
|
2420
2679
|
onPopoverClosed() {
|
|
2421
2680
|
this.expanded.set(false);
|
|
2422
|
-
this.searchText.set(this.isMultiple() ? '' : this.
|
|
2681
|
+
this.searchText.set(this.isMultiple() ? '' : this.translatedDisplayText());
|
|
2423
2682
|
this.sheetSearchText.set('');
|
|
2424
2683
|
this.#appliedSearchQuery.set('');
|
|
2425
2684
|
this.#treeFilterQuery.set('');
|
|
@@ -2479,7 +2738,7 @@ class AXLookupComponent extends NXValueComponent {
|
|
|
2479
2738
|
this.#emitItemSelected(e.item);
|
|
2480
2739
|
this.#itemsCache.set(e.value, e.item);
|
|
2481
2740
|
this.selectedItems.set([e.item]);
|
|
2482
|
-
this.searchText.set(this.getItemText(e.item));
|
|
2741
|
+
this.searchText.set(this.#translateItemText(this.getItemText(e.item)));
|
|
2483
2742
|
this.#isUserInteraction = true;
|
|
2484
2743
|
this.value.set(e.value);
|
|
2485
2744
|
this.close();
|
|
@@ -2744,7 +3003,7 @@ class AXLookupComponent extends NXValueComponent {
|
|
|
2744
3003
|
async #loadFilteredCachedTreeNodes(source, nodeId, query) {
|
|
2745
3004
|
const nodes = await this.#loadCachedTreeNodes(source, nodeId);
|
|
2746
3005
|
const hydrated = await this.#hydrateTreeChildrenForSearch(source, nodes);
|
|
2747
|
-
return filterTreeNodes(hydrated, this.textField(), query);
|
|
3006
|
+
return filterTreeNodes(hydrated, this.textField(), query, (text) => this.#translateItemText(text));
|
|
2748
3007
|
}
|
|
2749
3008
|
#applyFilterNow(text) {
|
|
2750
3009
|
const query = text?.trim() ?? '';
|
|
@@ -2905,13 +3164,16 @@ class AXLookupComponent extends NXValueComponent {
|
|
|
2905
3164
|
};
|
|
2906
3165
|
expanded ? this.onOpened.emit(event) : this.onClosed.emit(event);
|
|
2907
3166
|
}
|
|
3167
|
+
#translateItemText(text) {
|
|
3168
|
+
return this.#translation.translateSync(text, { waitForLoad: true });
|
|
3169
|
+
}
|
|
2908
3170
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXLookupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2909
3171
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXLookupComponent, isStandalone: true, selector: "ax-lookup", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null }, treeDataSource: { classPropertyName: "treeDataSource", publicName: "treeDataSource", isSignal: true, isRequired: false, transformFunction: null }, valueField: { classPropertyName: "valueField", publicName: "valueField", isSignal: true, isRequired: false, transformFunction: null }, textField: { classPropertyName: "textField", publicName: "textField", isSignal: true, isRequired: false, transformFunction: null }, disabledField: { classPropertyName: "disabledField", publicName: "disabledField", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, treeParentField: { classPropertyName: "treeParentField", publicName: "treeParentField", isSignal: true, isRequired: false, transformFunction: null }, hasChildrenField: { classPropertyName: "hasChildrenField", publicName: "hasChildrenField", isSignal: true, isRequired: false, transformFunction: null }, searchable: { classPropertyName: "searchable", publicName: "searchable", isSignal: true, isRequired: false, transformFunction: null }, adaptivityEnabled: { classPropertyName: "adaptivityEnabled", publicName: "adaptivityEnabled", isSignal: true, isRequired: false, transformFunction: null }, caption: { classPropertyName: "caption", publicName: "caption", isSignal: true, isRequired: false, transformFunction: null }, alternate: { classPropertyName: "alternate", publicName: "alternate", isSignal: true, isRequired: false, transformFunction: null }, searchPlaceholder: { classPropertyName: "searchPlaceholder", publicName: "searchPlaceholder", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, look: { classPropertyName: "look", publicName: "look", isSignal: true, isRequired: false, transformFunction: null }, itemHeight: { classPropertyName: "itemHeight", publicName: "itemHeight", isSignal: true, isRequired: false, transformFunction: null }, maxVisibleItems: { classPropertyName: "maxVisibleItems", publicName: "maxVisibleItems", isSignal: true, isRequired: false, transformFunction: null }, treeSelectionBehavior: { classPropertyName: "treeSelectionBehavior", publicName: "treeSelectionBehavior", isSignal: true, isRequired: false, transformFunction: null }, highlightSearch: { classPropertyName: "highlightSearch", publicName: "highlightSearch", isSignal: true, isRequired: false, transformFunction: null }, itemTemplate: { classPropertyName: "itemTemplate", publicName: "itemTemplate", isSignal: true, isRequired: false, transformFunction: null }, selectedTemplate: { classPropertyName: "selectedTemplate", publicName: "selectedTemplate", isSignal: true, isRequired: false, transformFunction: null }, emptyTemplate: { classPropertyName: "emptyTemplate", publicName: "emptyTemplate", isSignal: true, isRequired: false, transformFunction: null }, loadingTemplate: { classPropertyName: "loadingTemplate", publicName: "loadingTemplate", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, valueItems: { classPropertyName: "valueItems", publicName: "valueItems", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { look: "lookChange", value: "valueChange", onValueChanged: "onValueChanged", onSelectionChanged: "onSelectionChanged", onFocus: "onFocus", onBlur: "onBlur", onItemClick: "onItemClick", onItemSelected: "onItemSelected", onOpened: "onOpened", onClosed: "onClosed" }, providers: [
|
|
2910
3172
|
{ provide: AXComponent, useExisting: AXLookupComponent },
|
|
2911
3173
|
{ provide: AXClearableComponent, useExisting: AXLookupComponent },
|
|
2912
3174
|
{ provide: AXClosableComponent, useExisting: AXLookupComponent },
|
|
2913
3175
|
{ provide: AXValuableComponent, useExisting: AXLookupComponent },
|
|
2914
|
-
], viewQueries: [{ propertyName: "popoverRef", first: true, predicate: AXPopoverComponent, descendants: true, isSignal: true }, { propertyName: "originRef", first: true, predicate: ["origin"], descendants: true, isSignal: true }, { propertyName: "popupRef", first: true, predicate: ["popup"], descendants: true, isSignal: true }, { propertyName: "triggerSearchInput", first: true, predicate: ["triggerSearchInput"], descendants: true, isSignal: true }, { propertyName: "listView", first: true, predicate: AXLookupListViewBase, descendants: true, isSignal: true }, { propertyName: "dropDownTreeView", first: true, predicate: AXLookupDropDownTreeComponent, descendants: true, isSignal: true }, { propertyName: "multiSelectTreeView", first: true, predicate: AXLookupMultiSelectTreeComponent, descendants: true, isSignal: true }, { propertyName: "sheetSearchRef", first: true, predicate: ["sheetSearch"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div\n #origin\n class=\"ax-editor-container ax-{{ look() }} ax-default\"\n [class.ax-lookup-trigger]=\"!isEditableTrigger()\"\n [class.ax-lookup-trigger-multiple]=\"isMultiple()\"\n [class.ax-state-disabled]=\"disabled()\"\n [class.ax-state-readonly]=\"readonly()\"\n (click)=\"onTriggerClick()\"\n>\n <ng-content select=\"ax-prefix\"></ng-content>\n\n @if (isMultiple()) {\n <div class=\"ax-lookup-chips\">\n @for (item of selectedItems(); track trackSelectedKey(item)) {\n <ax-chips class=\"ax-sm\" look=\"fill\" [text]=\"selectedTemplate() ? '' : getItemText(item)\">\n @if (selectedTemplate()) {\n <ax-prefix>\n <ng-container\n [ngTemplateOutlet]=\"selectedTemplate()!\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"\n />\n </ax-prefix>\n }\n @if (!disabled() && !readonly()) {\n <ax-suffix>\n <button type=\"button\" tabindex=\"-1\" (click)=\"removeChip($event, item)\">\n <span class=\"ax-icon ax-icon-close\"></span>\n </button>\n </ax-suffix>\n }\n </ax-chips>\n }\n <input\n #triggerSearchInput\n type=\"text\"\n class=\"ax-input ax-lookup-trigger-search\"\n [class.ax-lookup-select-input]=\"!isEditableTrigger()\"\n [placeholder]=\"triggerSearchPlaceholder()\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly() || !isEditableTrigger()\"\n [attr.inputmode]=\"isEditableTrigger() ? null : 'none'\"\n [value]=\"searchText()\"\n (input)=\"onTriggerSearchInput($any($event.target).value)\"\n (keydown)=\"onTriggerKeydown($event)\"\n (beforeinput)=\"onBeforeInput($event)\"\n (focus)=\"emitOnFocus($event)\"\n (blur)=\"emitOnBlur($event)\"\n />\n </div>\n } @else {\n <div class=\"ax-lookup-value\">\n @if (showSelectedTemplate()) {\n <div class=\"ax-lookup-selected-content\" aria-hidden=\"true\">\n <ng-container\n [ngTemplateOutlet]=\"selectedTemplate()!\"\n [ngTemplateOutletContext]=\"{ $implicit: selectedItems()[0] }\"\n />\n </div>\n }\n <input\n #triggerSearchInput\n type=\"text\"\n class=\"ax-input\"\n [class.ax-lookup-select-input]=\"!isEditableTrigger()\"\n [class.ax-lookup-input-overlay]=\"showSelectedTemplate()\"\n [placeholder]=\"placeholder()\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly() || !isEditableTrigger()\"\n [attr.inputmode]=\"isEditableTrigger() ? null : 'none'\"\n [value]=\"searchText()\"\n (input)=\"onTriggerSearchInput($any($event.target).value)\"\n (keydown)=\"onTriggerKeydown($event)\"\n (beforeinput)=\"onBeforeInput($event)\"\n (focus)=\"emitOnFocus($event)\"\n (blur)=\"emitOnBlur($event)\"\n />\n </div>\n }\n\n @if (selectedValues().length > 0 && !disabled() && !readonly()) {\n <ng-content select=\"ax-clear-button\"></ng-content>\n }\n\n <button\n type=\"button\"\n class=\"ax-general-button-icon\"\n tabindex=\"-1\"\n [disabled]=\"disabled() || readonly()\"\n >\n <span\n class=\"ax-icon\"\n [class.ax-icon-chevron-down]=\"!expanded()\"\n [class.ax-icon-chevron-up]=\"expanded()\"\n ></span>\n </button>\n <ng-content select=\"ax-suffix\"></ng-content>\n</div>\n\n<ax-popover\n [target]=\"origin\"\n [openOn]=\"'manual'\"\n [closeOn]=\"isActionsheetStyle() ? 'manual' : 'clickOut'\"\n [closeOnScroll]=\"!isActionsheetStyle()\"\n [placement]=\"'bottom-start'\"\n [width]=\"isActionsheetStyle() ? '100%' : origin.offsetWidth + 'px'\"\n [adaptivityEnabled]=\"isActionsheetStyle()\"\n [disabled]=\"disabled() || readonly()\"\n (onClosed)=\"onPopoverClosed()\"\n>\n <div\n #popup\n class=\"ax-lookup-popup\"\n [class.ax-is-actionsheet]=\"isActionsheetStyle()\"\n [class.ax-is-alternate]=\"alternate()\"\n (keydown.escape)=\"close()\"\n >\n @if (isActionsheetStyle()) {\n <ax-header class=\"ax-solid\">\n <ax-title>{{ caption() || placeholder() || ('@acorex:selectbox.popover.title' | translate | async) }}</ax-title>\n @if (isMultiple()) {\n <ax-button\n class=\"ax-sm\"\n color=\"primary\"\n look=\"solid\"\n text=\"@acorex:common.actions.apply\"\n (onClick)=\"close()\"\n ></ax-button>\n } @else {\n <ax-close-button></ax-close-button>\n }\n </ax-header>\n }\n @if (isSheetSearchEnabled()) {\n <div class=\"ax-lookup-sheet-search\">\n <ax-search-box\n #sheetSearch\n class=\"ax-sm\"\n look=\"fill\"\n [autoSearch]=\"false\"\n [delayTime]=\"0\"\n [placeholder]=\"searchPlaceholder()\"\n (onValueChanged)=\"onSheetSearchInput()\"\n (onKeyUp)=\"onSheetSearchInput()\"\n (onKeyDown)=\"onSheetSearchKeydown($event)\"\n >\n <ax-clear-button></ax-clear-button>\n </ax-search-box>\n </div>\n }\n <ng-content select=\"ax-header\"></ng-content>\n @if (expanded()) {\n @switch (mode()) {\n @case ('drop-down-list') {\n <ax-lookup-drop-down-list\n [dataSource]=\"resolvedDataSource()\"\n [valueField]=\"valueField()\"\n [textField]=\"textField()\"\n [disabledField]=\"disabledField()\"\n [selectedValues]=\"selectedValues()\"\n [itemHeight]=\"itemHeight()\"\n [maxVisibleItems]=\"maxVisibleItems()\"\n [itemTemplate]=\"itemTemplate()\"\n [emptyTemplate]=\"emptyTemplate()\"\n [loadingTemplate]=\"loadingTemplate()\"\n [alternate]=\"alternate()\"\n [highlightText]=\"highlightQuery()\"\n (itemClick)=\"handleSinglePick($event)\"\n (navigateOut)=\"onListNavigateOut($event)\"\n />\n }\n @case ('multi-select') {\n <ax-lookup-multi-select\n [dataSource]=\"resolvedDataSource()\"\n [valueField]=\"valueField()\"\n [textField]=\"textField()\"\n [disabledField]=\"disabledField()\"\n [selectedValues]=\"selectedValues()\"\n [itemHeight]=\"itemHeight()\"\n [maxVisibleItems]=\"maxVisibleItems()\"\n [itemTemplate]=\"itemTemplate()\"\n [emptyTemplate]=\"emptyTemplate()\"\n [loadingTemplate]=\"loadingTemplate()\"\n [alternate]=\"alternate()\"\n [highlightText]=\"highlightQuery()\"\n (itemClick)=\"handleMultiToggle($event)\"\n (navigateOut)=\"onListNavigateOut($event)\"\n />\n }\n @case ('drop-down-tree') {\n <ax-lookup-drop-down-tree\n [dataSource]=\"resolvedTreeDataSource()\"\n [valueField]=\"valueField()\"\n [textField]=\"textField()\"\n [disabledField]=\"disabledField()\"\n [selectedValues]=\"selectedValues()\"\n [nodeTemplate]=\"$any(itemTemplate())\"\n [emptyTemplate]=\"emptyTemplate()\"\n [filterKey]=\"treeFilterKey()\"\n [alternate]=\"alternate()\"\n [highlightText]=\"highlightQuery()\"\n (itemClick)=\"handleSinglePick($event)\"\n />\n }\n @case ('multi-select-tree') {\n <ax-lookup-multi-select-tree\n [dataSource]=\"resolvedTreeDataSource()\"\n [valueField]=\"valueField()\"\n [textField]=\"textField()\"\n [disabledField]=\"disabledField()\"\n [selectedValues]=\"selectedValues()\"\n [selectionBehavior]=\"treeSelectionBehavior()\"\n [nodeTemplate]=\"$any(itemTemplate())\"\n [emptyTemplate]=\"emptyTemplate()\"\n [filterKey]=\"treeFilterKey()\"\n [alternate]=\"alternate()\"\n [highlightText]=\"highlightQuery()\"\n (selectionChange)=\"handleTreeSelectionChange($event)\"\n />\n }\n @case ('multi-column') {\n <ax-lookup-multi-column\n [dataSource]=\"resolvedDataSource()\"\n [valueField]=\"valueField()\"\n [textField]=\"textField()\"\n [disabledField]=\"disabledField()\"\n [selectedValues]=\"selectedValues()\"\n [itemHeight]=\"itemHeight()\"\n [maxVisibleItems]=\"maxVisibleItems()\"\n [columns]=\"columns()\"\n [itemTemplate]=\"itemTemplate()\"\n [emptyTemplate]=\"emptyTemplate()\"\n [loadingTemplate]=\"loadingTemplate()\"\n [alternate]=\"alternate()\"\n [highlightText]=\"highlightQuery()\"\n (itemClick)=\"handleSinglePick($event)\"\n />\n }\n @case ('multi-column-tree') {\n <ax-lookup-multi-column-tree\n [dataSource]=\"resolvedDataSource()\"\n [valueField]=\"valueField()\"\n [textField]=\"textField()\"\n [disabledField]=\"disabledField()\"\n [parentField]=\"treeParentField()\"\n [hasChildrenField]=\"hasChildrenField()\"\n [selectedValues]=\"selectedValues()\"\n [itemHeight]=\"itemHeight()\"\n [maxVisibleItems]=\"maxVisibleItems()\"\n [columns]=\"columns()\"\n [itemTemplate]=\"itemTemplate()\"\n [emptyTemplate]=\"emptyTemplate()\"\n [loadingTemplate]=\"loadingTemplate()\"\n [alternate]=\"alternate()\"\n [highlightText]=\"highlightQuery()\"\n (itemClick)=\"handleSinglePick($event)\"\n />\n }\n }\n }\n <ng-content select=\"ax-footer\"></ng-content>\n </div>\n</ax-popover>\n<ng-content select=\"ax-validation-rule\"></ng-content>\n", styles: ["@layer properties;@layer components{ax-lookup{display:block;width:100%}ax-lookup .ax-editor-container{justify-content:flex-start;gap:calc(var(--spacing, .25rem) * 1)}ax-lookup .ax-lookup-trigger{cursor:pointer;-webkit-user-select:none;user-select:none}ax-lookup .ax-lookup-trigger-multiple{height:auto;min-height:calc(var(--spacing, .25rem) * 9);padding-block:calc(var(--spacing, .25rem) * 1)}ax-lookup .ax-lookup-value{position:relative;display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;align-items:center;overflow:hidden}ax-lookup .ax-lookup-select-input{cursor:pointer;caret-color:transparent;-webkit-user-select:none;user-select:none}ax-lookup .ax-lookup-selected-content{pointer-events:none;position:relative;z-index:0;display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;align-items:center;overflow:hidden}ax-lookup .ax-lookup-input-overlay{position:absolute;inset:calc(var(--spacing, .25rem) * 0);z-index:10;margin:calc(var(--spacing, .25rem) * 0)!important;height:100%;width:100%;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0)!important;color:transparent;caret-color:transparent}ax-lookup .ax-lookup-chips{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * 1)}ax-lookup .ax-lookup-trigger-search{margin:calc(var(--spacing, .25rem) * 0)!important;height:calc(var(--spacing, .25rem) * 7.5);width:auto!important;min-width:calc(var(--spacing, .25rem) * 16);flex:1;flex-basis:calc(var(--spacing, .25rem) * 16)}ax-lookup .ax-lookup-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){ax-lookup .ax-lookup-placeholder{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 50%,transparent)}}ax-lookup ax-chips ax-prefix,ax-lookup ax-chips ax-suffix{padding:calc(var(--spacing, .25rem) * 0)!important}ax-lookup ax-chips ax-suffix button{display:flex;cursor:pointer;align-items:center;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0)}.ax-lookup-popup{--ax-comp-lookup-highlight-bg-color: var(--ax-sys-color-warning-lighter-surface);--ax-comp-lookup-highlight-text-color: var(--ax-sys-color-on-warning-lighter-surface);--ax-comp-lookup-highlight-border-color: var(--ax-sys-color-warning-500);box-sizing:border-box;display:flex;width:100%;max-width:100%;min-width:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ax-lookup-popup .ax-highlight{display:inline;margin:0;padding:0;background-color:rgb(var(--ax-comp-lookup-highlight-bg-color));color:rgb(var(--ax-comp-lookup-highlight-text-color));font-weight:inherit;box-shadow:none}.ax-lookup-popup:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-darkest-surface))}.ax-lookup-popup.ax-is-actionsheet{height:100dvh;max-height:100dvh;min-height:100dvh;border-bottom-right-radius:0;border-bottom-left-radius:0;--tw-shadow: 0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ax-lookup-popup.ax-is-actionsheet>ax-header.ax-solid{border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}.ax-lookup-popup.ax-is-actionsheet>ax-header.ax-solid ax-title{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-leading: calc(var(--spacing, .25rem) * 6);line-height:calc(var(--spacing, .25rem) * 6);--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.ax-lookup-popup.ax-is-actionsheet>ax-header.ax-solid ax-button{flex-shrink:0}.ax-lookup-popup.ax-is-actionsheet ax-lookup-drop-down-list,.ax-lookup-popup.ax-is-actionsheet ax-lookup-multi-select,.ax-lookup-popup.ax-is-actionsheet ax-lookup-drop-down-tree,.ax-lookup-popup.ax-is-actionsheet ax-lookup-multi-select-tree,.ax-lookup-popup.ax-is-actionsheet ax-lookup-multi-column,.ax-lookup-popup.ax-is-actionsheet ax-lookup-multi-column-tree{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;height:auto!important}.ax-lookup-popup.ax-is-actionsheet .ax-lookup-viewport{min-height:calc(var(--spacing, .25rem) * 0);flex:1;height:auto!important;max-height:none!important}.ax-lookup-popup.ax-is-actionsheet .ax-lookup-tree{max-height:none;min-height:calc(var(--spacing, .25rem) * 0);flex:1;overflow:auto}.ax-lookup-popup.ax-is-actionsheet .ax-lookup-empty{display:flex;flex:1;align-items:center;justify-content:center}:is(.ax-lookup-popup.ax-is-actionsheet .ax-lookup-multi-column,.ax-lookup-popup.ax-is-actionsheet .ax-lookup-multi-column-tree) .ax-lookup-multi-column-table,:is(.ax-lookup-popup.ax-is-actionsheet .ax-lookup-multi-column,.ax-lookup-popup.ax-is-actionsheet .ax-lookup-multi-column-tree) ax-data-table{height:100%;min-height:calc(var(--spacing, .25rem) * 0)}.ax-lookup-popup .ax-lookup-sheet-search{flex-shrink:0;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}.ax-lookup-popup>ax-header:not(.ax-solid),.ax-lookup-popup>ax-footer{flex-shrink:0;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}.ax-lookup-popup>ax-header:not(.ax-solid){border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.ax-lookup-popup>ax-footer{border-top-style:var(--tw-border-style);border-top-width:1px}.ax-lookup-viewport{width:100%;min-width:calc(var(--spacing, .25rem) * 0);overflow-x:hidden}.ax-lookup-empty{display:flex;min-height:calc(var(--spacing, .25rem) * 12);width:100%;align-items:center;justify-content:center;padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 3);text-align:center;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-empty{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 60%,transparent)}}.ax-lookup-option-host{box-sizing:border-box;cursor:pointer;border-style:var(--tw-border-style);border-width:1px;border-color:transparent;--tw-outline-style: none;outline-style:none}.ax-lookup-option-host.ax-state-alternate{background-color:rgba(var(--ax-sys-color-light-surface))}.ax-lookup-option-host.ax-state-alternate:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-surface))}.ax-lookup-option-host:hover,.ax-lookup-option-host.ax-state-active{background-color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host:hover,.ax-lookup-option-host.ax-state-active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 10%,transparent)}}.ax-lookup-option-host.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-alternate.ax-state-active{background-color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-alternate.ax-state-active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 15%,transparent)}}.ax-lookup-option-host.ax-state-selected,.ax-lookup-option-host.ax-state-selected:hover,.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate,.ax-lookup-option-host.ax-state-selected.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}:is(.ax-lookup-option-host.ax-state-selected,.ax-lookup-option-host.ax-state-selected:hover,.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate,.ax-lookup-option-host.ax-state-selected.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-primary-darkest-surface))}@supports (color: color-mix(in lab,red,red)){:is(.ax-lookup-option-host.ax-state-selected,.ax-lookup-option-host.ax-state-selected:hover,.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate,.ax-lookup-option-host.ax-state-selected.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-darkest-surface)) 25%,transparent)}}.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-lightest-surface)) 80%,transparent)}}:is(.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-primary-darkest-surface))}@supports (color: color-mix(in lab,red,red)){:is(.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-darkest-surface)) 40%,transparent)}}.ax-lookup-option-host.ax-lookup-option-multiple{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}.ax-lookup-option-host.ax-lookup-option-multiple:not(.ax-lookup-option){padding-inline:calc(var(--spacing, .25rem) * 3)}.ax-lookup-option-host .ax-lookup-checkbox{pointer-events:none;display:inline-flex;flex-shrink:0;align-items:center}.ax-lookup-option-host .ax-lookup-option-loading{width:100%;padding-inline:calc(var(--spacing, .25rem) * 3);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host .ax-lookup-option-loading{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 50%,transparent)}}.ax-lookup-option{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 3);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}.ax-lookup-option.ax-state-selected{color:rgba(var(--ax-sys-color-primary-surface))}.ax-lookup-option.ax-lookup-option-multiple{justify-content:flex-start}.ax-lookup-option .ax-lookup-option-text{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ax-lookup-option .ax-lookup-option-check{margin-inline-start:auto;flex-shrink:0;color:rgba(var(--ax-sys-color-primary-surface))}ax-lookup-multi-column,ax-lookup-multi-column-tree,.ax-lookup-multi-column,.ax-lookup-multi-column-tree{display:block;min-height:calc(var(--spacing, .25rem) * 0);width:100%}:is(ax-lookup-multi-column,ax-lookup-multi-column-tree,.ax-lookup-multi-column,.ax-lookup-multi-column-tree) .ax-lookup-multi-column-table,:is(ax-lookup-multi-column,ax-lookup-multi-column-tree,.ax-lookup-multi-column,.ax-lookup-multi-column-tree) ax-data-table{height:100%;min-height:calc(var(--spacing, .25rem) * 0);border-style:var(--tw-border-style)!important;border-width:0px!important}:is(ax-lookup-multi-column,ax-lookup-multi-column-tree,.ax-lookup-multi-column,.ax-lookup-multi-column-tree) tr.ax-state-selected{background-color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){:is(ax-lookup-multi-column,ax-lookup-multi-column-tree,.ax-lookup-multi-column,.ax-lookup-multi-column-tree) tr.ax-state-selected{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 10%,transparent)}}:is(ax-lookup-multi-column,ax-lookup-multi-column-tree,.ax-lookup-multi-column,.ax-lookup-multi-column-tree) tr.ax-state-disabled{pointer-events:none;opacity:50%}.ax-lookup-tree{max-height:calc(var(--spacing, .25rem) * 80);overflow:auto;padding:calc(var(--spacing, .25rem) * 2)}.ax-lookup-tree .ax-tree-view-node{margin-block:0;border-radius:0}.ax-lookup-tree .ax-tree-view-node.ax-state-alternate{background-color:rgba(var(--ax-sys-color-light-surface))}.ax-lookup-tree .ax-tree-view-node.ax-state-alternate:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-surface))}.ax-lookup-tree .ax-tree-view-node.ax-state-alternate:hover:not(.ax-dragging){background-color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-tree .ax-tree-view-node.ax-state-alternate:hover:not(.ax-dragging){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 15%,transparent)}}.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected,.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}:is(.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected,.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-primary-darkest-surface))}@supports (color: color-mix(in lab,red,red)){:is(.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected,.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-darkest-surface)) 25%,transparent)}}.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected:hover:not(.ax-dragging),.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected:hover:not(.ax-dragging){background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected:hover:not(.ax-dragging),.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected:hover:not(.ax-dragging){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-lightest-surface)) 80%,transparent)}}:is(.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected:hover:not(.ax-dragging),.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected:hover:not(.ax-dragging)):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-primary-darkest-surface))}@supports (color: color-mix(in lab,red,red)){:is(.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected:hover:not(.ax-dragging),.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected:hover:not(.ax-dragging)):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-darkest-surface)) 40%,transparent)}}}ax-lookup .ax-editor-container.ax-fill ax-chips.ax-default.ax-fill-interactive{background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);border-color:rgba(var(--ax-sys-color-border-surface))}ax-lookup .ax-editor-container.ax-fill ax-chips.ax-default.ax-fill-interactive:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}ax-lookup .ax-editor-container.ax-fill ax-chips.ax-default.ax-fill-interactive:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){border-color:rgba(var(--ax-sys-color-border-light-surface))}ax-lookup .ax-editor-container.ax-fill ax-chips.ax-default.ax-fill-interactive:not(.ax-state-disabled):hover{background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}ax-lookup .ax-editor-container.ax-fill ax-chips.ax-default.ax-fill-interactive:not(.ax-state-disabled):hover:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:var(--color-light);color:var(--color-on-light);border-color:var(--color-border-light)}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-leading: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: AXChipsComponent, selector: "ax-chips", inputs: ["tabIndex", "color", "look", "text"], outputs: ["textChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i1$1.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "component", type: i1$1.AXDecoratorCloseButtonComponent, selector: "ax-close-button", inputs: ["closeAll", "icon"] }, { kind: "component", type: i1$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "visualContextScope", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "component", type: AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "class", "delayTime", "type", "autoSearch"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "component", type: AXLookupDropDownListComponent, selector: "ax-lookup-drop-down-list" }, { kind: "component", type: AXLookupMultiSelectComponent, selector: "ax-lookup-multi-select" }, { kind: "component", type: AXLookupDropDownTreeComponent, selector: "ax-lookup-drop-down-tree", inputs: ["dataSource", "valueField", "textField", "disabledField", "selectedValues", "nodeTemplate", "emptyTemplate", "alternate", "filterKey", "highlightText"], outputs: ["itemClick"] }, { kind: "component", type: AXLookupMultiSelectTreeComponent, selector: "ax-lookup-multi-select-tree", inputs: ["dataSource", "valueField", "textField", "disabledField", "selectedValues", "selectionBehavior", "nodeTemplate", "emptyTemplate", "alternate", "filterKey", "highlightText"], outputs: ["selectionChange"] }, { kind: "component", type: AXLookupMultiColumnComponent, selector: "ax-lookup-multi-column", inputs: ["dataSource", "valueField", "textField", "disabledField", "selectedValues", "itemHeight", "maxVisibleItems", "columns", "itemTemplate", "emptyTemplate", "loadingTemplate", "alternate", "highlightText"], outputs: ["itemClick"] }, { kind: "component", type: AXLookupMultiColumnTreeComponent, selector: "ax-lookup-multi-column-tree", inputs: ["dataSource", "valueField", "textField", "disabledField", "parentField", "hasChildrenField", "selectedValues", "itemHeight", "maxVisibleItems", "columns", "itemTemplate", "emptyTemplate", "loadingTemplate", "alternate", "highlightText"], outputs: ["itemClick"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
3176
|
+
], viewQueries: [{ propertyName: "popoverRef", first: true, predicate: AXPopoverComponent, descendants: true, isSignal: true }, { propertyName: "originRef", first: true, predicate: ["origin"], descendants: true, isSignal: true }, { propertyName: "popupRef", first: true, predicate: ["popup"], descendants: true, isSignal: true }, { propertyName: "triggerSearchInput", first: true, predicate: ["triggerSearchInput"], descendants: true, isSignal: true }, { propertyName: "listView", first: true, predicate: AXLookupListViewBase, descendants: true, isSignal: true }, { propertyName: "dropDownTreeView", first: true, predicate: AXLookupDropDownTreeComponent, descendants: true, isSignal: true }, { propertyName: "multiSelectTreeView", first: true, predicate: AXLookupMultiSelectTreeComponent, descendants: true, isSignal: true }, { propertyName: "sheetSearchRef", first: true, predicate: ["sheetSearch"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div\n #origin\n class=\"ax-editor-container ax-{{ look() }} ax-default\"\n [class.ax-lookup-trigger]=\"!isEditableTrigger()\"\n [class.ax-lookup-trigger-multiple]=\"isMultiple()\"\n [class.ax-state-disabled]=\"disabled()\"\n [class.ax-state-readonly]=\"readonly()\"\n (click)=\"onTriggerClick()\"\n>\n <ng-content select=\"ax-prefix\"></ng-content>\n\n @if (isMultiple()) {\n <div class=\"ax-lookup-chips\">\n @for (item of selectedItems(); track trackSelectedKey(item)) {\n <ax-chips class=\"ax-sm\" look=\"fill\" [text]=\"selectedTemplate() ? '' : (getItemText(item) | translate | async)\">\n @if (selectedTemplate()) {\n <ax-prefix>\n <ng-container\n [ngTemplateOutlet]=\"selectedTemplate()!\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"\n />\n </ax-prefix>\n }\n @if (!disabled() && !readonly()) {\n <ax-suffix>\n <button type=\"button\" tabindex=\"-1\" (click)=\"removeChip($event, item)\">\n <span class=\"ax-icon ax-icon-close\"></span>\n </button>\n </ax-suffix>\n }\n </ax-chips>\n }\n <input\n #triggerSearchInput\n type=\"text\"\n class=\"ax-input ax-lookup-trigger-search\"\n [class.ax-lookup-select-input]=\"!isEditableTrigger()\"\n [placeholder]=\"triggerSearchPlaceholder()\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly() || !isEditableTrigger()\"\n [attr.inputmode]=\"isEditableTrigger() ? null : 'none'\"\n [value]=\"searchText()\"\n (input)=\"onTriggerSearchInput($any($event.target).value)\"\n (keydown)=\"onTriggerKeydown($event)\"\n (beforeinput)=\"onBeforeInput($event)\"\n (focus)=\"emitOnFocus($event)\"\n (blur)=\"emitOnBlur($event)\"\n />\n </div>\n } @else {\n <div class=\"ax-lookup-value\">\n @if (showSelectedTemplate()) {\n <div class=\"ax-lookup-selected-content\" aria-hidden=\"true\">\n <ng-container\n [ngTemplateOutlet]=\"selectedTemplate()!\"\n [ngTemplateOutletContext]=\"{ $implicit: selectedItems()[0] }\"\n />\n </div>\n }\n <input\n #triggerSearchInput\n type=\"text\"\n class=\"ax-input\"\n [class.ax-lookup-select-input]=\"!isEditableTrigger()\"\n [class.ax-lookup-input-overlay]=\"showSelectedTemplate()\"\n [placeholder]=\"translatedPlaceholder()\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly() || !isEditableTrigger()\"\n [attr.inputmode]=\"isEditableTrigger() ? null : 'none'\"\n [value]=\"searchText()\"\n (input)=\"onTriggerSearchInput($any($event.target).value)\"\n (keydown)=\"onTriggerKeydown($event)\"\n (beforeinput)=\"onBeforeInput($event)\"\n (focus)=\"emitOnFocus($event)\"\n (blur)=\"emitOnBlur($event)\"\n />\n </div>\n }\n\n @if (selectedValues().length > 0 && !disabled() && !readonly()) {\n <ng-content select=\"ax-clear-button\"></ng-content>\n }\n\n <button\n type=\"button\"\n class=\"ax-general-button-icon\"\n tabindex=\"-1\"\n [disabled]=\"disabled() || readonly()\"\n >\n <span\n class=\"ax-icon\"\n [class.ax-icon-chevron-down]=\"!expanded()\"\n [class.ax-icon-chevron-up]=\"expanded()\"\n ></span>\n </button>\n <ng-content select=\"ax-suffix\"></ng-content>\n</div>\n\n<ax-popover\n [target]=\"origin\"\n [openOn]=\"'manual'\"\n [closeOn]=\"isActionsheetStyle() ? 'manual' : 'clickOut'\"\n [closeOnScroll]=\"!isActionsheetStyle()\"\n [placement]=\"'bottom-start'\"\n [width]=\"isActionsheetStyle() ? '100%' : origin.offsetWidth + 'px'\"\n [adaptivityEnabled]=\"isActionsheetStyle()\"\n [disabled]=\"disabled() || readonly()\"\n (onClosed)=\"onPopoverClosed()\"\n>\n <div\n #popup\n class=\"ax-lookup-popup\"\n [class.ax-is-actionsheet]=\"isActionsheetStyle()\"\n [class.ax-is-alternate]=\"alternate()\"\n (keydown.escape)=\"close()\"\n >\n @if (isActionsheetStyle()) {\n <ax-header class=\"ax-solid\">\n <ax-title>{{ actionsheetTitle() }}</ax-title>\n @if (isMultiple()) {\n <ax-button\n class=\"ax-sm\"\n color=\"primary\"\n look=\"solid\"\n text=\"@acorex:common.actions.apply\"\n (onClick)=\"close()\"\n ></ax-button>\n } @else {\n <ax-close-button></ax-close-button>\n }\n </ax-header>\n }\n @if (isSheetSearchEnabled()) {\n <div class=\"ax-lookup-sheet-search\">\n <ax-search-box\n #sheetSearch\n class=\"ax-sm\"\n look=\"fill\"\n [autoSearch]=\"false\"\n [delayTime]=\"0\"\n [placeholder]=\"searchPlaceholder()\"\n (onValueChanged)=\"onSheetSearchInput()\"\n (onKeyUp)=\"onSheetSearchInput()\"\n (onKeyDown)=\"onSheetSearchKeydown($event)\"\n >\n <ax-clear-button></ax-clear-button>\n </ax-search-box>\n </div>\n }\n <ng-content select=\"ax-header\"></ng-content>\n @if (expanded()) {\n @switch (mode()) {\n @case ('drop-down-list') {\n <ax-lookup-drop-down-list\n [dataSource]=\"resolvedDataSource()\"\n [valueField]=\"valueField()\"\n [textField]=\"textField()\"\n [disabledField]=\"disabledField()\"\n [selectedValues]=\"selectedValues()\"\n [itemHeight]=\"itemHeight()\"\n [maxVisibleItems]=\"maxVisibleItems()\"\n [itemTemplate]=\"itemTemplate()\"\n [emptyTemplate]=\"emptyTemplate()\"\n [loadingTemplate]=\"loadingTemplate()\"\n [alternate]=\"alternate()\"\n [highlightText]=\"highlightQuery()\"\n (itemClick)=\"handleSinglePick($event)\"\n (navigateOut)=\"onListNavigateOut($event)\"\n />\n }\n @case ('multi-select') {\n <ax-lookup-multi-select\n [dataSource]=\"resolvedDataSource()\"\n [valueField]=\"valueField()\"\n [textField]=\"textField()\"\n [disabledField]=\"disabledField()\"\n [selectedValues]=\"selectedValues()\"\n [itemHeight]=\"itemHeight()\"\n [maxVisibleItems]=\"maxVisibleItems()\"\n [itemTemplate]=\"itemTemplate()\"\n [emptyTemplate]=\"emptyTemplate()\"\n [loadingTemplate]=\"loadingTemplate()\"\n [alternate]=\"alternate()\"\n [highlightText]=\"highlightQuery()\"\n (itemClick)=\"handleMultiToggle($event)\"\n (navigateOut)=\"onListNavigateOut($event)\"\n />\n }\n @case ('drop-down-tree') {\n <ax-lookup-drop-down-tree\n [dataSource]=\"resolvedTreeDataSource()\"\n [valueField]=\"valueField()\"\n [textField]=\"textField()\"\n [disabledField]=\"disabledField()\"\n [selectedValues]=\"selectedValues()\"\n [nodeTemplate]=\"$any(itemTemplate())\"\n [emptyTemplate]=\"emptyTemplate()\"\n [filterKey]=\"treeFilterKey()\"\n [alternate]=\"alternate()\"\n [highlightText]=\"highlightQuery()\"\n (itemClick)=\"handleSinglePick($event)\"\n />\n }\n @case ('multi-select-tree') {\n <ax-lookup-multi-select-tree\n [dataSource]=\"resolvedTreeDataSource()\"\n [valueField]=\"valueField()\"\n [textField]=\"textField()\"\n [disabledField]=\"disabledField()\"\n [selectedValues]=\"selectedValues()\"\n [selectionBehavior]=\"treeSelectionBehavior()\"\n [nodeTemplate]=\"$any(itemTemplate())\"\n [emptyTemplate]=\"emptyTemplate()\"\n [filterKey]=\"treeFilterKey()\"\n [alternate]=\"alternate()\"\n [highlightText]=\"highlightQuery()\"\n (selectionChange)=\"handleTreeSelectionChange($event)\"\n />\n }\n @case ('multi-column') {\n <ax-lookup-multi-column\n [dataSource]=\"resolvedDataSource()\"\n [valueField]=\"valueField()\"\n [textField]=\"textField()\"\n [disabledField]=\"disabledField()\"\n [selectedValues]=\"selectedValues()\"\n [itemHeight]=\"itemHeight()\"\n [maxVisibleItems]=\"maxVisibleItems()\"\n [columns]=\"columns()\"\n [itemTemplate]=\"itemTemplate()\"\n [emptyTemplate]=\"emptyTemplate()\"\n [loadingTemplate]=\"loadingTemplate()\"\n [alternate]=\"alternate()\"\n [highlightText]=\"highlightQuery()\"\n (itemClick)=\"handleSinglePick($event)\"\n />\n }\n @case ('multi-column-tree') {\n <ax-lookup-multi-column-tree\n [dataSource]=\"resolvedDataSource()\"\n [valueField]=\"valueField()\"\n [textField]=\"textField()\"\n [disabledField]=\"disabledField()\"\n [parentField]=\"treeParentField()\"\n [hasChildrenField]=\"hasChildrenField()\"\n [selectedValues]=\"selectedValues()\"\n [itemHeight]=\"itemHeight()\"\n [maxVisibleItems]=\"maxVisibleItems()\"\n [columns]=\"columns()\"\n [itemTemplate]=\"itemTemplate()\"\n [emptyTemplate]=\"emptyTemplate()\"\n [loadingTemplate]=\"loadingTemplate()\"\n [alternate]=\"alternate()\"\n [highlightText]=\"highlightQuery()\"\n (itemClick)=\"handleSinglePick($event)\"\n />\n }\n }\n }\n <ng-content select=\"ax-footer\"></ng-content>\n </div>\n</ax-popover>\n<ng-content select=\"ax-validation-rule\"></ng-content>\n", styles: ["@layer properties;@layer components{ax-lookup{display:block;width:100%}ax-lookup .ax-editor-container{justify-content:flex-start;gap:calc(var(--spacing, .25rem) * 1)}ax-lookup .ax-lookup-trigger{cursor:pointer;-webkit-user-select:none;user-select:none}ax-lookup .ax-lookup-trigger-multiple{height:auto;min-height:calc(var(--spacing, .25rem) * 9);padding-block:calc(var(--spacing, .25rem) * 1)}ax-lookup .ax-lookup-value{position:relative;display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;align-items:center;overflow:hidden}ax-lookup .ax-lookup-select-input{cursor:pointer;caret-color:transparent;-webkit-user-select:none;user-select:none}ax-lookup .ax-lookup-selected-content{pointer-events:none;position:relative;z-index:0;display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;align-items:center;overflow:hidden}ax-lookup .ax-lookup-input-overlay{position:absolute;inset:calc(var(--spacing, .25rem) * 0);z-index:10;margin:calc(var(--spacing, .25rem) * 0)!important;height:100%;width:100%;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0)!important;color:transparent;caret-color:transparent}ax-lookup .ax-lookup-chips{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * 1)}ax-lookup .ax-lookup-trigger-search{margin:calc(var(--spacing, .25rem) * 0)!important;height:calc(var(--spacing, .25rem) * 7.5);width:auto!important;min-width:calc(var(--spacing, .25rem) * 16);flex:1;flex-basis:calc(var(--spacing, .25rem) * 16)}ax-lookup .ax-lookup-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){ax-lookup .ax-lookup-placeholder{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 50%,transparent)}}ax-lookup ax-chips ax-prefix,ax-lookup ax-chips ax-suffix{padding:calc(var(--spacing, .25rem) * 0)!important}ax-lookup ax-chips ax-suffix button{display:flex;cursor:pointer;align-items:center;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0)}.ax-lookup-popup{--ax-comp-lookup-highlight-bg-color: var(--ax-sys-color-warning-lighter-surface);--ax-comp-lookup-highlight-text-color: var(--ax-sys-color-on-warning-lighter-surface);--ax-comp-lookup-highlight-border-color: var(--ax-sys-color-warning-500);box-sizing:border-box;display:flex;width:100%;max-width:100%;min-width:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ax-lookup-popup .ax-highlight{display:inline;margin:0;padding:0;background-color:rgb(var(--ax-comp-lookup-highlight-bg-color));color:rgb(var(--ax-comp-lookup-highlight-text-color));font-weight:inherit;box-shadow:none}.ax-lookup-popup:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-darkest-surface))}.ax-lookup-popup.ax-is-actionsheet{height:100dvh;max-height:100dvh;min-height:100dvh;border-bottom-right-radius:0;border-bottom-left-radius:0;--tw-shadow: 0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ax-lookup-popup.ax-is-actionsheet>ax-header.ax-solid{border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}.ax-lookup-popup.ax-is-actionsheet>ax-header.ax-solid ax-title{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-leading: calc(var(--spacing, .25rem) * 6);line-height:calc(var(--spacing, .25rem) * 6);--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.ax-lookup-popup.ax-is-actionsheet>ax-header.ax-solid ax-button{flex-shrink:0}.ax-lookup-popup.ax-is-actionsheet ax-lookup-drop-down-list,.ax-lookup-popup.ax-is-actionsheet ax-lookup-multi-select,.ax-lookup-popup.ax-is-actionsheet ax-lookup-drop-down-tree,.ax-lookup-popup.ax-is-actionsheet ax-lookup-multi-select-tree,.ax-lookup-popup.ax-is-actionsheet ax-lookup-multi-column,.ax-lookup-popup.ax-is-actionsheet ax-lookup-multi-column-tree{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;height:auto!important}.ax-lookup-popup.ax-is-actionsheet .ax-lookup-viewport{min-height:calc(var(--spacing, .25rem) * 0);flex:1;height:auto!important;max-height:none!important}.ax-lookup-popup.ax-is-actionsheet .ax-lookup-tree{max-height:none;min-height:calc(var(--spacing, .25rem) * 0);flex:1;overflow:auto}.ax-lookup-popup.ax-is-actionsheet .ax-lookup-empty{display:flex;flex:1;align-items:center;justify-content:center}:is(.ax-lookup-popup.ax-is-actionsheet .ax-lookup-multi-column,.ax-lookup-popup.ax-is-actionsheet .ax-lookup-multi-column-tree) .ax-lookup-multi-column-table,:is(.ax-lookup-popup.ax-is-actionsheet .ax-lookup-multi-column,.ax-lookup-popup.ax-is-actionsheet .ax-lookup-multi-column-tree) ax-data-table{height:100%;min-height:calc(var(--spacing, .25rem) * 0)}.ax-lookup-popup .ax-lookup-sheet-search{flex-shrink:0;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}.ax-lookup-popup>ax-header:not(.ax-solid),.ax-lookup-popup>ax-footer{flex-shrink:0;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}.ax-lookup-popup>ax-header:not(.ax-solid){border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.ax-lookup-popup>ax-footer{border-top-style:var(--tw-border-style);border-top-width:1px}.ax-lookup-viewport{width:100%;min-width:calc(var(--spacing, .25rem) * 0);overflow-x:hidden}.ax-lookup-empty{display:flex;min-height:calc(var(--spacing, .25rem) * 12);width:100%;align-items:center;justify-content:center;padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 3);text-align:center;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-empty{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 60%,transparent)}}.ax-lookup-option-host{box-sizing:border-box;cursor:pointer;border-style:var(--tw-border-style);border-width:1px;border-color:transparent;--tw-outline-style: none;outline-style:none}.ax-lookup-option-host.ax-state-alternate{background-color:rgba(var(--ax-sys-color-light-surface))}.ax-lookup-option-host.ax-state-alternate:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-surface))}.ax-lookup-option-host:hover,.ax-lookup-option-host.ax-state-active{background-color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host:hover,.ax-lookup-option-host.ax-state-active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 10%,transparent)}}.ax-lookup-option-host.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-alternate.ax-state-active{background-color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-alternate.ax-state-active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 15%,transparent)}}.ax-lookup-option-host.ax-state-selected,.ax-lookup-option-host.ax-state-selected:hover,.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate,.ax-lookup-option-host.ax-state-selected.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}:is(.ax-lookup-option-host.ax-state-selected,.ax-lookup-option-host.ax-state-selected:hover,.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate,.ax-lookup-option-host.ax-state-selected.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-primary-darkest-surface))}@supports (color: color-mix(in lab,red,red)){:is(.ax-lookup-option-host.ax-state-selected,.ax-lookup-option-host.ax-state-selected:hover,.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate,.ax-lookup-option-host.ax-state-selected.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-darkest-surface)) 25%,transparent)}}.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-lightest-surface)) 80%,transparent)}}:is(.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-primary-darkest-surface))}@supports (color: color-mix(in lab,red,red)){:is(.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-darkest-surface)) 40%,transparent)}}.ax-lookup-option-host.ax-lookup-option-multiple{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}.ax-lookup-option-host.ax-lookup-option-multiple:not(.ax-lookup-option){padding-inline:calc(var(--spacing, .25rem) * 3)}.ax-lookup-option-host .ax-lookup-checkbox{pointer-events:none;display:inline-flex;flex-shrink:0;align-items:center}.ax-lookup-option-host .ax-lookup-option-loading{width:100%;padding-inline:calc(var(--spacing, .25rem) * 3);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host .ax-lookup-option-loading{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 50%,transparent)}}.ax-lookup-option{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 3);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}.ax-lookup-option.ax-state-selected{color:rgba(var(--ax-sys-color-primary-surface))}.ax-lookup-option.ax-lookup-option-multiple{justify-content:flex-start}.ax-lookup-option .ax-lookup-option-text{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ax-lookup-option .ax-lookup-option-check{margin-inline-start:auto;flex-shrink:0;color:rgba(var(--ax-sys-color-primary-surface))}ax-lookup-multi-column,ax-lookup-multi-column-tree,.ax-lookup-multi-column,.ax-lookup-multi-column-tree{display:block;min-height:calc(var(--spacing, .25rem) * 0);width:100%}:is(ax-lookup-multi-column,ax-lookup-multi-column-tree,.ax-lookup-multi-column,.ax-lookup-multi-column-tree) .ax-lookup-multi-column-table,:is(ax-lookup-multi-column,ax-lookup-multi-column-tree,.ax-lookup-multi-column,.ax-lookup-multi-column-tree) ax-data-table{height:100%;min-height:calc(var(--spacing, .25rem) * 0);border-style:var(--tw-border-style)!important;border-width:0px!important}:is(ax-lookup-multi-column,ax-lookup-multi-column-tree,.ax-lookup-multi-column,.ax-lookup-multi-column-tree) tr.ax-state-selected{background-color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){:is(ax-lookup-multi-column,ax-lookup-multi-column-tree,.ax-lookup-multi-column,.ax-lookup-multi-column-tree) tr.ax-state-selected{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 10%,transparent)}}:is(ax-lookup-multi-column,ax-lookup-multi-column-tree,.ax-lookup-multi-column,.ax-lookup-multi-column-tree) tr.ax-state-disabled{pointer-events:none;opacity:50%}.ax-lookup-tree{max-height:calc(var(--spacing, .25rem) * 80);overflow:auto;padding:calc(var(--spacing, .25rem) * 2)}.ax-lookup-tree .ax-tree-view-node{margin-block:0;border-radius:0}.ax-lookup-tree .ax-tree-view-node.ax-state-alternate{background-color:rgba(var(--ax-sys-color-light-surface))}.ax-lookup-tree .ax-tree-view-node.ax-state-alternate:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-surface))}.ax-lookup-tree .ax-tree-view-node.ax-state-alternate:hover:not(.ax-dragging){background-color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-tree .ax-tree-view-node.ax-state-alternate:hover:not(.ax-dragging){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 15%,transparent)}}.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected,.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}:is(.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected,.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-primary-darkest-surface))}@supports (color: color-mix(in lab,red,red)){:is(.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected,.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-darkest-surface)) 25%,transparent)}}.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected:hover:not(.ax-dragging),.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected:hover:not(.ax-dragging){background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected:hover:not(.ax-dragging),.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected:hover:not(.ax-dragging){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-lightest-surface)) 80%,transparent)}}:is(.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected:hover:not(.ax-dragging),.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected:hover:not(.ax-dragging)):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-primary-darkest-surface))}@supports (color: color-mix(in lab,red,red)){:is(.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected:hover:not(.ax-dragging),.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected:hover:not(.ax-dragging)):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-darkest-surface)) 40%,transparent)}}}ax-lookup .ax-editor-container.ax-fill ax-chips.ax-default.ax-fill-interactive{background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);border-color:rgba(var(--ax-sys-color-border-surface))}ax-lookup .ax-editor-container.ax-fill ax-chips.ax-default.ax-fill-interactive:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}ax-lookup .ax-editor-container.ax-fill ax-chips.ax-default.ax-fill-interactive:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){border-color:rgba(var(--ax-sys-color-border-light-surface))}ax-lookup .ax-editor-container.ax-fill ax-chips.ax-default.ax-fill-interactive:not(.ax-state-disabled):hover{background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}ax-lookup .ax-editor-container.ax-fill ax-chips.ax-default.ax-fill-interactive:not(.ax-state-disabled):hover:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:var(--color-light);color:var(--color-on-light);border-color:var(--color-border-light)}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-leading: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["disabled", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "component", type: AXChipsComponent, selector: "ax-chips", inputs: ["tabIndex", "color", "look", "text"], outputs: ["textChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i1$1.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "component", type: i1$1.AXDecoratorCloseButtonComponent, selector: "ax-close-button", inputs: ["closeAll", "icon"] }, { kind: "component", type: i1$1.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "visualContextScope", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { kind: "component", type: AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "class", "delayTime", "type", "autoSearch"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "component", type: AXLookupDropDownListComponent, selector: "ax-lookup-drop-down-list" }, { kind: "component", type: AXLookupMultiSelectComponent, selector: "ax-lookup-multi-select" }, { kind: "component", type: AXLookupDropDownTreeComponent, selector: "ax-lookup-drop-down-tree", inputs: ["dataSource", "valueField", "textField", "disabledField", "selectedValues", "nodeTemplate", "emptyTemplate", "alternate", "filterKey", "highlightText"], outputs: ["itemClick"] }, { kind: "component", type: AXLookupMultiSelectTreeComponent, selector: "ax-lookup-multi-select-tree", inputs: ["dataSource", "valueField", "textField", "disabledField", "selectedValues", "selectionBehavior", "nodeTemplate", "emptyTemplate", "alternate", "filterKey", "highlightText"], outputs: ["selectionChange"] }, { kind: "component", type: AXLookupMultiColumnComponent, selector: "ax-lookup-multi-column", inputs: ["dataSource", "valueField", "textField", "disabledField", "selectedValues", "itemHeight", "maxVisibleItems", "columns", "itemTemplate", "emptyTemplate", "loadingTemplate", "alternate", "highlightText"], outputs: ["itemClick"] }, { kind: "component", type: AXLookupMultiColumnTreeComponent, selector: "ax-lookup-multi-column-tree", inputs: ["dataSource", "valueField", "textField", "disabledField", "parentField", "hasChildrenField", "selectedValues", "itemHeight", "maxVisibleItems", "columns", "itemTemplate", "emptyTemplate", "loadingTemplate", "alternate", "highlightText"], outputs: ["itemClick"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
2915
3177
|
}
|
|
2916
3178
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXLookupComponent, decorators: [{
|
|
2917
3179
|
type: Component,
|
|
@@ -2935,7 +3197,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
|
|
|
2935
3197
|
{ provide: AXClearableComponent, useExisting: AXLookupComponent },
|
|
2936
3198
|
{ provide: AXClosableComponent, useExisting: AXLookupComponent },
|
|
2937
3199
|
{ provide: AXValuableComponent, useExisting: AXLookupComponent },
|
|
2938
|
-
], template: "<div\n #origin\n class=\"ax-editor-container ax-{{ look() }} ax-default\"\n [class.ax-lookup-trigger]=\"!isEditableTrigger()\"\n [class.ax-lookup-trigger-multiple]=\"isMultiple()\"\n [class.ax-state-disabled]=\"disabled()\"\n [class.ax-state-readonly]=\"readonly()\"\n (click)=\"onTriggerClick()\"\n>\n <ng-content select=\"ax-prefix\"></ng-content>\n\n @if (isMultiple()) {\n <div class=\"ax-lookup-chips\">\n @for (item of selectedItems(); track trackSelectedKey(item)) {\n <ax-chips class=\"ax-sm\" look=\"fill\" [text]=\"selectedTemplate() ? '' : getItemText(item)\">\n @if (selectedTemplate()) {\n <ax-prefix>\n <ng-container\n [ngTemplateOutlet]=\"selectedTemplate()!\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"\n />\n </ax-prefix>\n }\n @if (!disabled() && !readonly()) {\n <ax-suffix>\n <button type=\"button\" tabindex=\"-1\" (click)=\"removeChip($event, item)\">\n <span class=\"ax-icon ax-icon-close\"></span>\n </button>\n </ax-suffix>\n }\n </ax-chips>\n }\n <input\n #triggerSearchInput\n type=\"text\"\n class=\"ax-input ax-lookup-trigger-search\"\n [class.ax-lookup-select-input]=\"!isEditableTrigger()\"\n [placeholder]=\"triggerSearchPlaceholder()\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly() || !isEditableTrigger()\"\n [attr.inputmode]=\"isEditableTrigger() ? null : 'none'\"\n [value]=\"searchText()\"\n (input)=\"onTriggerSearchInput($any($event.target).value)\"\n (keydown)=\"onTriggerKeydown($event)\"\n (beforeinput)=\"onBeforeInput($event)\"\n (focus)=\"emitOnFocus($event)\"\n (blur)=\"emitOnBlur($event)\"\n />\n </div>\n } @else {\n <div class=\"ax-lookup-value\">\n @if (showSelectedTemplate()) {\n <div class=\"ax-lookup-selected-content\" aria-hidden=\"true\">\n <ng-container\n [ngTemplateOutlet]=\"selectedTemplate()!\"\n [ngTemplateOutletContext]=\"{ $implicit: selectedItems()[0] }\"\n />\n </div>\n }\n <input\n #triggerSearchInput\n type=\"text\"\n class=\"ax-input\"\n [class.ax-lookup-select-input]=\"!isEditableTrigger()\"\n [class.ax-lookup-input-overlay]=\"showSelectedTemplate()\"\n [placeholder]=\"placeholder()\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly() || !isEditableTrigger()\"\n [attr.inputmode]=\"isEditableTrigger() ? null : 'none'\"\n [value]=\"searchText()\"\n (input)=\"onTriggerSearchInput($any($event.target).value)\"\n (keydown)=\"onTriggerKeydown($event)\"\n (beforeinput)=\"onBeforeInput($event)\"\n (focus)=\"emitOnFocus($event)\"\n (blur)=\"emitOnBlur($event)\"\n />\n </div>\n }\n\n @if (selectedValues().length > 0 && !disabled() && !readonly()) {\n <ng-content select=\"ax-clear-button\"></ng-content>\n }\n\n <button\n type=\"button\"\n class=\"ax-general-button-icon\"\n tabindex=\"-1\"\n [disabled]=\"disabled() || readonly()\"\n >\n <span\n class=\"ax-icon\"\n [class.ax-icon-chevron-down]=\"!expanded()\"\n [class.ax-icon-chevron-up]=\"expanded()\"\n ></span>\n </button>\n <ng-content select=\"ax-suffix\"></ng-content>\n</div>\n\n<ax-popover\n [target]=\"origin\"\n [openOn]=\"'manual'\"\n [closeOn]=\"isActionsheetStyle() ? 'manual' : 'clickOut'\"\n [closeOnScroll]=\"!isActionsheetStyle()\"\n [placement]=\"'bottom-start'\"\n [width]=\"isActionsheetStyle() ? '100%' : origin.offsetWidth + 'px'\"\n [adaptivityEnabled]=\"isActionsheetStyle()\"\n [disabled]=\"disabled() || readonly()\"\n (onClosed)=\"onPopoverClosed()\"\n>\n <div\n #popup\n class=\"ax-lookup-popup\"\n [class.ax-is-actionsheet]=\"isActionsheetStyle()\"\n [class.ax-is-alternate]=\"alternate()\"\n (keydown.escape)=\"close()\"\n >\n @if (isActionsheetStyle()) {\n <ax-header class=\"ax-solid\">\n <ax-title>{{ caption() || placeholder() || ('@acorex:selectbox.popover.title' | translate | async) }}</ax-title>\n @if (isMultiple()) {\n <ax-button\n class=\"ax-sm\"\n color=\"primary\"\n look=\"solid\"\n text=\"@acorex:common.actions.apply\"\n (onClick)=\"close()\"\n ></ax-button>\n } @else {\n <ax-close-button></ax-close-button>\n }\n </ax-header>\n }\n @if (isSheetSearchEnabled()) {\n <div class=\"ax-lookup-sheet-search\">\n <ax-search-box\n #sheetSearch\n class=\"ax-sm\"\n look=\"fill\"\n [autoSearch]=\"false\"\n [delayTime]=\"0\"\n [placeholder]=\"searchPlaceholder()\"\n (onValueChanged)=\"onSheetSearchInput()\"\n (onKeyUp)=\"onSheetSearchInput()\"\n (onKeyDown)=\"onSheetSearchKeydown($event)\"\n >\n <ax-clear-button></ax-clear-button>\n </ax-search-box>\n </div>\n }\n <ng-content select=\"ax-header\"></ng-content>\n @if (expanded()) {\n @switch (mode()) {\n @case ('drop-down-list') {\n <ax-lookup-drop-down-list\n [dataSource]=\"resolvedDataSource()\"\n [valueField]=\"valueField()\"\n [textField]=\"textField()\"\n [disabledField]=\"disabledField()\"\n [selectedValues]=\"selectedValues()\"\n [itemHeight]=\"itemHeight()\"\n [maxVisibleItems]=\"maxVisibleItems()\"\n [itemTemplate]=\"itemTemplate()\"\n [emptyTemplate]=\"emptyTemplate()\"\n [loadingTemplate]=\"loadingTemplate()\"\n [alternate]=\"alternate()\"\n [highlightText]=\"highlightQuery()\"\n (itemClick)=\"handleSinglePick($event)\"\n (navigateOut)=\"onListNavigateOut($event)\"\n />\n }\n @case ('multi-select') {\n <ax-lookup-multi-select\n [dataSource]=\"resolvedDataSource()\"\n [valueField]=\"valueField()\"\n [textField]=\"textField()\"\n [disabledField]=\"disabledField()\"\n [selectedValues]=\"selectedValues()\"\n [itemHeight]=\"itemHeight()\"\n [maxVisibleItems]=\"maxVisibleItems()\"\n [itemTemplate]=\"itemTemplate()\"\n [emptyTemplate]=\"emptyTemplate()\"\n [loadingTemplate]=\"loadingTemplate()\"\n [alternate]=\"alternate()\"\n [highlightText]=\"highlightQuery()\"\n (itemClick)=\"handleMultiToggle($event)\"\n (navigateOut)=\"onListNavigateOut($event)\"\n />\n }\n @case ('drop-down-tree') {\n <ax-lookup-drop-down-tree\n [dataSource]=\"resolvedTreeDataSource()\"\n [valueField]=\"valueField()\"\n [textField]=\"textField()\"\n [disabledField]=\"disabledField()\"\n [selectedValues]=\"selectedValues()\"\n [nodeTemplate]=\"$any(itemTemplate())\"\n [emptyTemplate]=\"emptyTemplate()\"\n [filterKey]=\"treeFilterKey()\"\n [alternate]=\"alternate()\"\n [highlightText]=\"highlightQuery()\"\n (itemClick)=\"handleSinglePick($event)\"\n />\n }\n @case ('multi-select-tree') {\n <ax-lookup-multi-select-tree\n [dataSource]=\"resolvedTreeDataSource()\"\n [valueField]=\"valueField()\"\n [textField]=\"textField()\"\n [disabledField]=\"disabledField()\"\n [selectedValues]=\"selectedValues()\"\n [selectionBehavior]=\"treeSelectionBehavior()\"\n [nodeTemplate]=\"$any(itemTemplate())\"\n [emptyTemplate]=\"emptyTemplate()\"\n [filterKey]=\"treeFilterKey()\"\n [alternate]=\"alternate()\"\n [highlightText]=\"highlightQuery()\"\n (selectionChange)=\"handleTreeSelectionChange($event)\"\n />\n }\n @case ('multi-column') {\n <ax-lookup-multi-column\n [dataSource]=\"resolvedDataSource()\"\n [valueField]=\"valueField()\"\n [textField]=\"textField()\"\n [disabledField]=\"disabledField()\"\n [selectedValues]=\"selectedValues()\"\n [itemHeight]=\"itemHeight()\"\n [maxVisibleItems]=\"maxVisibleItems()\"\n [columns]=\"columns()\"\n [itemTemplate]=\"itemTemplate()\"\n [emptyTemplate]=\"emptyTemplate()\"\n [loadingTemplate]=\"loadingTemplate()\"\n [alternate]=\"alternate()\"\n [highlightText]=\"highlightQuery()\"\n (itemClick)=\"handleSinglePick($event)\"\n />\n }\n @case ('multi-column-tree') {\n <ax-lookup-multi-column-tree\n [dataSource]=\"resolvedDataSource()\"\n [valueField]=\"valueField()\"\n [textField]=\"textField()\"\n [disabledField]=\"disabledField()\"\n [parentField]=\"treeParentField()\"\n [hasChildrenField]=\"hasChildrenField()\"\n [selectedValues]=\"selectedValues()\"\n [itemHeight]=\"itemHeight()\"\n [maxVisibleItems]=\"maxVisibleItems()\"\n [columns]=\"columns()\"\n [itemTemplate]=\"itemTemplate()\"\n [emptyTemplate]=\"emptyTemplate()\"\n [loadingTemplate]=\"loadingTemplate()\"\n [alternate]=\"alternate()\"\n [highlightText]=\"highlightQuery()\"\n (itemClick)=\"handleSinglePick($event)\"\n />\n }\n }\n }\n <ng-content select=\"ax-footer\"></ng-content>\n </div>\n</ax-popover>\n<ng-content select=\"ax-validation-rule\"></ng-content>\n", styles: ["@layer properties;@layer components{ax-lookup{display:block;width:100%}ax-lookup .ax-editor-container{justify-content:flex-start;gap:calc(var(--spacing, .25rem) * 1)}ax-lookup .ax-lookup-trigger{cursor:pointer;-webkit-user-select:none;user-select:none}ax-lookup .ax-lookup-trigger-multiple{height:auto;min-height:calc(var(--spacing, .25rem) * 9);padding-block:calc(var(--spacing, .25rem) * 1)}ax-lookup .ax-lookup-value{position:relative;display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;align-items:center;overflow:hidden}ax-lookup .ax-lookup-select-input{cursor:pointer;caret-color:transparent;-webkit-user-select:none;user-select:none}ax-lookup .ax-lookup-selected-content{pointer-events:none;position:relative;z-index:0;display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;align-items:center;overflow:hidden}ax-lookup .ax-lookup-input-overlay{position:absolute;inset:calc(var(--spacing, .25rem) * 0);z-index:10;margin:calc(var(--spacing, .25rem) * 0)!important;height:100%;width:100%;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0)!important;color:transparent;caret-color:transparent}ax-lookup .ax-lookup-chips{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * 1)}ax-lookup .ax-lookup-trigger-search{margin:calc(var(--spacing, .25rem) * 0)!important;height:calc(var(--spacing, .25rem) * 7.5);width:auto!important;min-width:calc(var(--spacing, .25rem) * 16);flex:1;flex-basis:calc(var(--spacing, .25rem) * 16)}ax-lookup .ax-lookup-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){ax-lookup .ax-lookup-placeholder{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 50%,transparent)}}ax-lookup ax-chips ax-prefix,ax-lookup ax-chips ax-suffix{padding:calc(var(--spacing, .25rem) * 0)!important}ax-lookup ax-chips ax-suffix button{display:flex;cursor:pointer;align-items:center;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0)}.ax-lookup-popup{--ax-comp-lookup-highlight-bg-color: var(--ax-sys-color-warning-lighter-surface);--ax-comp-lookup-highlight-text-color: var(--ax-sys-color-on-warning-lighter-surface);--ax-comp-lookup-highlight-border-color: var(--ax-sys-color-warning-500);box-sizing:border-box;display:flex;width:100%;max-width:100%;min-width:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ax-lookup-popup .ax-highlight{display:inline;margin:0;padding:0;background-color:rgb(var(--ax-comp-lookup-highlight-bg-color));color:rgb(var(--ax-comp-lookup-highlight-text-color));font-weight:inherit;box-shadow:none}.ax-lookup-popup:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-darkest-surface))}.ax-lookup-popup.ax-is-actionsheet{height:100dvh;max-height:100dvh;min-height:100dvh;border-bottom-right-radius:0;border-bottom-left-radius:0;--tw-shadow: 0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ax-lookup-popup.ax-is-actionsheet>ax-header.ax-solid{border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}.ax-lookup-popup.ax-is-actionsheet>ax-header.ax-solid ax-title{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-leading: calc(var(--spacing, .25rem) * 6);line-height:calc(var(--spacing, .25rem) * 6);--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.ax-lookup-popup.ax-is-actionsheet>ax-header.ax-solid ax-button{flex-shrink:0}.ax-lookup-popup.ax-is-actionsheet ax-lookup-drop-down-list,.ax-lookup-popup.ax-is-actionsheet ax-lookup-multi-select,.ax-lookup-popup.ax-is-actionsheet ax-lookup-drop-down-tree,.ax-lookup-popup.ax-is-actionsheet ax-lookup-multi-select-tree,.ax-lookup-popup.ax-is-actionsheet ax-lookup-multi-column,.ax-lookup-popup.ax-is-actionsheet ax-lookup-multi-column-tree{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;height:auto!important}.ax-lookup-popup.ax-is-actionsheet .ax-lookup-viewport{min-height:calc(var(--spacing, .25rem) * 0);flex:1;height:auto!important;max-height:none!important}.ax-lookup-popup.ax-is-actionsheet .ax-lookup-tree{max-height:none;min-height:calc(var(--spacing, .25rem) * 0);flex:1;overflow:auto}.ax-lookup-popup.ax-is-actionsheet .ax-lookup-empty{display:flex;flex:1;align-items:center;justify-content:center}:is(.ax-lookup-popup.ax-is-actionsheet .ax-lookup-multi-column,.ax-lookup-popup.ax-is-actionsheet .ax-lookup-multi-column-tree) .ax-lookup-multi-column-table,:is(.ax-lookup-popup.ax-is-actionsheet .ax-lookup-multi-column,.ax-lookup-popup.ax-is-actionsheet .ax-lookup-multi-column-tree) ax-data-table{height:100%;min-height:calc(var(--spacing, .25rem) * 0)}.ax-lookup-popup .ax-lookup-sheet-search{flex-shrink:0;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}.ax-lookup-popup>ax-header:not(.ax-solid),.ax-lookup-popup>ax-footer{flex-shrink:0;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}.ax-lookup-popup>ax-header:not(.ax-solid){border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.ax-lookup-popup>ax-footer{border-top-style:var(--tw-border-style);border-top-width:1px}.ax-lookup-viewport{width:100%;min-width:calc(var(--spacing, .25rem) * 0);overflow-x:hidden}.ax-lookup-empty{display:flex;min-height:calc(var(--spacing, .25rem) * 12);width:100%;align-items:center;justify-content:center;padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 3);text-align:center;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-empty{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 60%,transparent)}}.ax-lookup-option-host{box-sizing:border-box;cursor:pointer;border-style:var(--tw-border-style);border-width:1px;border-color:transparent;--tw-outline-style: none;outline-style:none}.ax-lookup-option-host.ax-state-alternate{background-color:rgba(var(--ax-sys-color-light-surface))}.ax-lookup-option-host.ax-state-alternate:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-surface))}.ax-lookup-option-host:hover,.ax-lookup-option-host.ax-state-active{background-color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host:hover,.ax-lookup-option-host.ax-state-active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 10%,transparent)}}.ax-lookup-option-host.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-alternate.ax-state-active{background-color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-alternate.ax-state-active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 15%,transparent)}}.ax-lookup-option-host.ax-state-selected,.ax-lookup-option-host.ax-state-selected:hover,.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate,.ax-lookup-option-host.ax-state-selected.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}:is(.ax-lookup-option-host.ax-state-selected,.ax-lookup-option-host.ax-state-selected:hover,.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate,.ax-lookup-option-host.ax-state-selected.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-primary-darkest-surface))}@supports (color: color-mix(in lab,red,red)){:is(.ax-lookup-option-host.ax-state-selected,.ax-lookup-option-host.ax-state-selected:hover,.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate,.ax-lookup-option-host.ax-state-selected.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-darkest-surface)) 25%,transparent)}}.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-lightest-surface)) 80%,transparent)}}:is(.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-primary-darkest-surface))}@supports (color: color-mix(in lab,red,red)){:is(.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-darkest-surface)) 40%,transparent)}}.ax-lookup-option-host.ax-lookup-option-multiple{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}.ax-lookup-option-host.ax-lookup-option-multiple:not(.ax-lookup-option){padding-inline:calc(var(--spacing, .25rem) * 3)}.ax-lookup-option-host .ax-lookup-checkbox{pointer-events:none;display:inline-flex;flex-shrink:0;align-items:center}.ax-lookup-option-host .ax-lookup-option-loading{width:100%;padding-inline:calc(var(--spacing, .25rem) * 3);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host .ax-lookup-option-loading{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 50%,transparent)}}.ax-lookup-option{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 3);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}.ax-lookup-option.ax-state-selected{color:rgba(var(--ax-sys-color-primary-surface))}.ax-lookup-option.ax-lookup-option-multiple{justify-content:flex-start}.ax-lookup-option .ax-lookup-option-text{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ax-lookup-option .ax-lookup-option-check{margin-inline-start:auto;flex-shrink:0;color:rgba(var(--ax-sys-color-primary-surface))}ax-lookup-multi-column,ax-lookup-multi-column-tree,.ax-lookup-multi-column,.ax-lookup-multi-column-tree{display:block;min-height:calc(var(--spacing, .25rem) * 0);width:100%}:is(ax-lookup-multi-column,ax-lookup-multi-column-tree,.ax-lookup-multi-column,.ax-lookup-multi-column-tree) .ax-lookup-multi-column-table,:is(ax-lookup-multi-column,ax-lookup-multi-column-tree,.ax-lookup-multi-column,.ax-lookup-multi-column-tree) ax-data-table{height:100%;min-height:calc(var(--spacing, .25rem) * 0);border-style:var(--tw-border-style)!important;border-width:0px!important}:is(ax-lookup-multi-column,ax-lookup-multi-column-tree,.ax-lookup-multi-column,.ax-lookup-multi-column-tree) tr.ax-state-selected{background-color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){:is(ax-lookup-multi-column,ax-lookup-multi-column-tree,.ax-lookup-multi-column,.ax-lookup-multi-column-tree) tr.ax-state-selected{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 10%,transparent)}}:is(ax-lookup-multi-column,ax-lookup-multi-column-tree,.ax-lookup-multi-column,.ax-lookup-multi-column-tree) tr.ax-state-disabled{pointer-events:none;opacity:50%}.ax-lookup-tree{max-height:calc(var(--spacing, .25rem) * 80);overflow:auto;padding:calc(var(--spacing, .25rem) * 2)}.ax-lookup-tree .ax-tree-view-node{margin-block:0;border-radius:0}.ax-lookup-tree .ax-tree-view-node.ax-state-alternate{background-color:rgba(var(--ax-sys-color-light-surface))}.ax-lookup-tree .ax-tree-view-node.ax-state-alternate:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-surface))}.ax-lookup-tree .ax-tree-view-node.ax-state-alternate:hover:not(.ax-dragging){background-color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-tree .ax-tree-view-node.ax-state-alternate:hover:not(.ax-dragging){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 15%,transparent)}}.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected,.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}:is(.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected,.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-primary-darkest-surface))}@supports (color: color-mix(in lab,red,red)){:is(.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected,.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-darkest-surface)) 25%,transparent)}}.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected:hover:not(.ax-dragging),.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected:hover:not(.ax-dragging){background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected:hover:not(.ax-dragging),.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected:hover:not(.ax-dragging){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-lightest-surface)) 80%,transparent)}}:is(.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected:hover:not(.ax-dragging),.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected:hover:not(.ax-dragging)):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-primary-darkest-surface))}@supports (color: color-mix(in lab,red,red)){:is(.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected:hover:not(.ax-dragging),.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected:hover:not(.ax-dragging)):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-darkest-surface)) 40%,transparent)}}}ax-lookup .ax-editor-container.ax-fill ax-chips.ax-default.ax-fill-interactive{background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);border-color:rgba(var(--ax-sys-color-border-surface))}ax-lookup .ax-editor-container.ax-fill ax-chips.ax-default.ax-fill-interactive:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}ax-lookup .ax-editor-container.ax-fill ax-chips.ax-default.ax-fill-interactive:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){border-color:rgba(var(--ax-sys-color-border-light-surface))}ax-lookup .ax-editor-container.ax-fill ax-chips.ax-default.ax-fill-interactive:not(.ax-state-disabled):hover{background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}ax-lookup .ax-editor-container.ax-fill ax-chips.ax-default.ax-fill-interactive:not(.ax-state-disabled):hover:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:var(--color-light);color:var(--color-on-light);border-color:var(--color-border-light)}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-leading: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
|
|
3200
|
+
], template: "<div\n #origin\n class=\"ax-editor-container ax-{{ look() }} ax-default\"\n [class.ax-lookup-trigger]=\"!isEditableTrigger()\"\n [class.ax-lookup-trigger-multiple]=\"isMultiple()\"\n [class.ax-state-disabled]=\"disabled()\"\n [class.ax-state-readonly]=\"readonly()\"\n (click)=\"onTriggerClick()\"\n>\n <ng-content select=\"ax-prefix\"></ng-content>\n\n @if (isMultiple()) {\n <div class=\"ax-lookup-chips\">\n @for (item of selectedItems(); track trackSelectedKey(item)) {\n <ax-chips class=\"ax-sm\" look=\"fill\" [text]=\"selectedTemplate() ? '' : (getItemText(item) | translate | async)\">\n @if (selectedTemplate()) {\n <ax-prefix>\n <ng-container\n [ngTemplateOutlet]=\"selectedTemplate()!\"\n [ngTemplateOutletContext]=\"{ $implicit: item }\"\n />\n </ax-prefix>\n }\n @if (!disabled() && !readonly()) {\n <ax-suffix>\n <button type=\"button\" tabindex=\"-1\" (click)=\"removeChip($event, item)\">\n <span class=\"ax-icon ax-icon-close\"></span>\n </button>\n </ax-suffix>\n }\n </ax-chips>\n }\n <input\n #triggerSearchInput\n type=\"text\"\n class=\"ax-input ax-lookup-trigger-search\"\n [class.ax-lookup-select-input]=\"!isEditableTrigger()\"\n [placeholder]=\"triggerSearchPlaceholder()\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly() || !isEditableTrigger()\"\n [attr.inputmode]=\"isEditableTrigger() ? null : 'none'\"\n [value]=\"searchText()\"\n (input)=\"onTriggerSearchInput($any($event.target).value)\"\n (keydown)=\"onTriggerKeydown($event)\"\n (beforeinput)=\"onBeforeInput($event)\"\n (focus)=\"emitOnFocus($event)\"\n (blur)=\"emitOnBlur($event)\"\n />\n </div>\n } @else {\n <div class=\"ax-lookup-value\">\n @if (showSelectedTemplate()) {\n <div class=\"ax-lookup-selected-content\" aria-hidden=\"true\">\n <ng-container\n [ngTemplateOutlet]=\"selectedTemplate()!\"\n [ngTemplateOutletContext]=\"{ $implicit: selectedItems()[0] }\"\n />\n </div>\n }\n <input\n #triggerSearchInput\n type=\"text\"\n class=\"ax-input\"\n [class.ax-lookup-select-input]=\"!isEditableTrigger()\"\n [class.ax-lookup-input-overlay]=\"showSelectedTemplate()\"\n [placeholder]=\"translatedPlaceholder()\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly() || !isEditableTrigger()\"\n [attr.inputmode]=\"isEditableTrigger() ? null : 'none'\"\n [value]=\"searchText()\"\n (input)=\"onTriggerSearchInput($any($event.target).value)\"\n (keydown)=\"onTriggerKeydown($event)\"\n (beforeinput)=\"onBeforeInput($event)\"\n (focus)=\"emitOnFocus($event)\"\n (blur)=\"emitOnBlur($event)\"\n />\n </div>\n }\n\n @if (selectedValues().length > 0 && !disabled() && !readonly()) {\n <ng-content select=\"ax-clear-button\"></ng-content>\n }\n\n <button\n type=\"button\"\n class=\"ax-general-button-icon\"\n tabindex=\"-1\"\n [disabled]=\"disabled() || readonly()\"\n >\n <span\n class=\"ax-icon\"\n [class.ax-icon-chevron-down]=\"!expanded()\"\n [class.ax-icon-chevron-up]=\"expanded()\"\n ></span>\n </button>\n <ng-content select=\"ax-suffix\"></ng-content>\n</div>\n\n<ax-popover\n [target]=\"origin\"\n [openOn]=\"'manual'\"\n [closeOn]=\"isActionsheetStyle() ? 'manual' : 'clickOut'\"\n [closeOnScroll]=\"!isActionsheetStyle()\"\n [placement]=\"'bottom-start'\"\n [width]=\"isActionsheetStyle() ? '100%' : origin.offsetWidth + 'px'\"\n [adaptivityEnabled]=\"isActionsheetStyle()\"\n [disabled]=\"disabled() || readonly()\"\n (onClosed)=\"onPopoverClosed()\"\n>\n <div\n #popup\n class=\"ax-lookup-popup\"\n [class.ax-is-actionsheet]=\"isActionsheetStyle()\"\n [class.ax-is-alternate]=\"alternate()\"\n (keydown.escape)=\"close()\"\n >\n @if (isActionsheetStyle()) {\n <ax-header class=\"ax-solid\">\n <ax-title>{{ actionsheetTitle() }}</ax-title>\n @if (isMultiple()) {\n <ax-button\n class=\"ax-sm\"\n color=\"primary\"\n look=\"solid\"\n text=\"@acorex:common.actions.apply\"\n (onClick)=\"close()\"\n ></ax-button>\n } @else {\n <ax-close-button></ax-close-button>\n }\n </ax-header>\n }\n @if (isSheetSearchEnabled()) {\n <div class=\"ax-lookup-sheet-search\">\n <ax-search-box\n #sheetSearch\n class=\"ax-sm\"\n look=\"fill\"\n [autoSearch]=\"false\"\n [delayTime]=\"0\"\n [placeholder]=\"searchPlaceholder()\"\n (onValueChanged)=\"onSheetSearchInput()\"\n (onKeyUp)=\"onSheetSearchInput()\"\n (onKeyDown)=\"onSheetSearchKeydown($event)\"\n >\n <ax-clear-button></ax-clear-button>\n </ax-search-box>\n </div>\n }\n <ng-content select=\"ax-header\"></ng-content>\n @if (expanded()) {\n @switch (mode()) {\n @case ('drop-down-list') {\n <ax-lookup-drop-down-list\n [dataSource]=\"resolvedDataSource()\"\n [valueField]=\"valueField()\"\n [textField]=\"textField()\"\n [disabledField]=\"disabledField()\"\n [selectedValues]=\"selectedValues()\"\n [itemHeight]=\"itemHeight()\"\n [maxVisibleItems]=\"maxVisibleItems()\"\n [itemTemplate]=\"itemTemplate()\"\n [emptyTemplate]=\"emptyTemplate()\"\n [loadingTemplate]=\"loadingTemplate()\"\n [alternate]=\"alternate()\"\n [highlightText]=\"highlightQuery()\"\n (itemClick)=\"handleSinglePick($event)\"\n (navigateOut)=\"onListNavigateOut($event)\"\n />\n }\n @case ('multi-select') {\n <ax-lookup-multi-select\n [dataSource]=\"resolvedDataSource()\"\n [valueField]=\"valueField()\"\n [textField]=\"textField()\"\n [disabledField]=\"disabledField()\"\n [selectedValues]=\"selectedValues()\"\n [itemHeight]=\"itemHeight()\"\n [maxVisibleItems]=\"maxVisibleItems()\"\n [itemTemplate]=\"itemTemplate()\"\n [emptyTemplate]=\"emptyTemplate()\"\n [loadingTemplate]=\"loadingTemplate()\"\n [alternate]=\"alternate()\"\n [highlightText]=\"highlightQuery()\"\n (itemClick)=\"handleMultiToggle($event)\"\n (navigateOut)=\"onListNavigateOut($event)\"\n />\n }\n @case ('drop-down-tree') {\n <ax-lookup-drop-down-tree\n [dataSource]=\"resolvedTreeDataSource()\"\n [valueField]=\"valueField()\"\n [textField]=\"textField()\"\n [disabledField]=\"disabledField()\"\n [selectedValues]=\"selectedValues()\"\n [nodeTemplate]=\"$any(itemTemplate())\"\n [emptyTemplate]=\"emptyTemplate()\"\n [filterKey]=\"treeFilterKey()\"\n [alternate]=\"alternate()\"\n [highlightText]=\"highlightQuery()\"\n (itemClick)=\"handleSinglePick($event)\"\n />\n }\n @case ('multi-select-tree') {\n <ax-lookup-multi-select-tree\n [dataSource]=\"resolvedTreeDataSource()\"\n [valueField]=\"valueField()\"\n [textField]=\"textField()\"\n [disabledField]=\"disabledField()\"\n [selectedValues]=\"selectedValues()\"\n [selectionBehavior]=\"treeSelectionBehavior()\"\n [nodeTemplate]=\"$any(itemTemplate())\"\n [emptyTemplate]=\"emptyTemplate()\"\n [filterKey]=\"treeFilterKey()\"\n [alternate]=\"alternate()\"\n [highlightText]=\"highlightQuery()\"\n (selectionChange)=\"handleTreeSelectionChange($event)\"\n />\n }\n @case ('multi-column') {\n <ax-lookup-multi-column\n [dataSource]=\"resolvedDataSource()\"\n [valueField]=\"valueField()\"\n [textField]=\"textField()\"\n [disabledField]=\"disabledField()\"\n [selectedValues]=\"selectedValues()\"\n [itemHeight]=\"itemHeight()\"\n [maxVisibleItems]=\"maxVisibleItems()\"\n [columns]=\"columns()\"\n [itemTemplate]=\"itemTemplate()\"\n [emptyTemplate]=\"emptyTemplate()\"\n [loadingTemplate]=\"loadingTemplate()\"\n [alternate]=\"alternate()\"\n [highlightText]=\"highlightQuery()\"\n (itemClick)=\"handleSinglePick($event)\"\n />\n }\n @case ('multi-column-tree') {\n <ax-lookup-multi-column-tree\n [dataSource]=\"resolvedDataSource()\"\n [valueField]=\"valueField()\"\n [textField]=\"textField()\"\n [disabledField]=\"disabledField()\"\n [parentField]=\"treeParentField()\"\n [hasChildrenField]=\"hasChildrenField()\"\n [selectedValues]=\"selectedValues()\"\n [itemHeight]=\"itemHeight()\"\n [maxVisibleItems]=\"maxVisibleItems()\"\n [columns]=\"columns()\"\n [itemTemplate]=\"itemTemplate()\"\n [emptyTemplate]=\"emptyTemplate()\"\n [loadingTemplate]=\"loadingTemplate()\"\n [alternate]=\"alternate()\"\n [highlightText]=\"highlightQuery()\"\n (itemClick)=\"handleSinglePick($event)\"\n />\n }\n }\n }\n <ng-content select=\"ax-footer\"></ng-content>\n </div>\n</ax-popover>\n<ng-content select=\"ax-validation-rule\"></ng-content>\n", styles: ["@layer properties;@layer components{ax-lookup{display:block;width:100%}ax-lookup .ax-editor-container{justify-content:flex-start;gap:calc(var(--spacing, .25rem) * 1)}ax-lookup .ax-lookup-trigger{cursor:pointer;-webkit-user-select:none;user-select:none}ax-lookup .ax-lookup-trigger-multiple{height:auto;min-height:calc(var(--spacing, .25rem) * 9);padding-block:calc(var(--spacing, .25rem) * 1)}ax-lookup .ax-lookup-value{position:relative;display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;align-items:center;overflow:hidden}ax-lookup .ax-lookup-select-input{cursor:pointer;caret-color:transparent;-webkit-user-select:none;user-select:none}ax-lookup .ax-lookup-selected-content{pointer-events:none;position:relative;z-index:0;display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;align-items:center;overflow:hidden}ax-lookup .ax-lookup-input-overlay{position:absolute;inset:calc(var(--spacing, .25rem) * 0);z-index:10;margin:calc(var(--spacing, .25rem) * 0)!important;height:100%;width:100%;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0)!important;color:transparent;caret-color:transparent}ax-lookup .ax-lookup-chips{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * 1)}ax-lookup .ax-lookup-trigger-search{margin:calc(var(--spacing, .25rem) * 0)!important;height:calc(var(--spacing, .25rem) * 7.5);width:auto!important;min-width:calc(var(--spacing, .25rem) * 16);flex:1;flex-basis:calc(var(--spacing, .25rem) * 16)}ax-lookup .ax-lookup-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){ax-lookup .ax-lookup-placeholder{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 50%,transparent)}}ax-lookup ax-chips ax-prefix,ax-lookup ax-chips ax-suffix{padding:calc(var(--spacing, .25rem) * 0)!important}ax-lookup ax-chips ax-suffix button{display:flex;cursor:pointer;align-items:center;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0)}.ax-lookup-popup{--ax-comp-lookup-highlight-bg-color: var(--ax-sys-color-warning-lighter-surface);--ax-comp-lookup-highlight-text-color: var(--ax-sys-color-on-warning-lighter-surface);--ax-comp-lookup-highlight-border-color: var(--ax-sys-color-warning-500);box-sizing:border-box;display:flex;width:100%;max-width:100%;min-width:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ax-lookup-popup .ax-highlight{display:inline;margin:0;padding:0;background-color:rgb(var(--ax-comp-lookup-highlight-bg-color));color:rgb(var(--ax-comp-lookup-highlight-text-color));font-weight:inherit;box-shadow:none}.ax-lookup-popup:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-darkest-surface))}.ax-lookup-popup.ax-is-actionsheet{height:100dvh;max-height:100dvh;min-height:100dvh;border-bottom-right-radius:0;border-bottom-left-radius:0;--tw-shadow: 0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ax-lookup-popup.ax-is-actionsheet>ax-header.ax-solid{border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}.ax-lookup-popup.ax-is-actionsheet>ax-header.ax-solid ax-title{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-leading: calc(var(--spacing, .25rem) * 6);line-height:calc(var(--spacing, .25rem) * 6);--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.ax-lookup-popup.ax-is-actionsheet>ax-header.ax-solid ax-button{flex-shrink:0}.ax-lookup-popup.ax-is-actionsheet ax-lookup-drop-down-list,.ax-lookup-popup.ax-is-actionsheet ax-lookup-multi-select,.ax-lookup-popup.ax-is-actionsheet ax-lookup-drop-down-tree,.ax-lookup-popup.ax-is-actionsheet ax-lookup-multi-select-tree,.ax-lookup-popup.ax-is-actionsheet ax-lookup-multi-column,.ax-lookup-popup.ax-is-actionsheet ax-lookup-multi-column-tree{display:flex;min-height:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;height:auto!important}.ax-lookup-popup.ax-is-actionsheet .ax-lookup-viewport{min-height:calc(var(--spacing, .25rem) * 0);flex:1;height:auto!important;max-height:none!important}.ax-lookup-popup.ax-is-actionsheet .ax-lookup-tree{max-height:none;min-height:calc(var(--spacing, .25rem) * 0);flex:1;overflow:auto}.ax-lookup-popup.ax-is-actionsheet .ax-lookup-empty{display:flex;flex:1;align-items:center;justify-content:center}:is(.ax-lookup-popup.ax-is-actionsheet .ax-lookup-multi-column,.ax-lookup-popup.ax-is-actionsheet .ax-lookup-multi-column-tree) .ax-lookup-multi-column-table,:is(.ax-lookup-popup.ax-is-actionsheet .ax-lookup-multi-column,.ax-lookup-popup.ax-is-actionsheet .ax-lookup-multi-column-tree) ax-data-table{height:100%;min-height:calc(var(--spacing, .25rem) * 0)}.ax-lookup-popup .ax-lookup-sheet-search{flex-shrink:0;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}.ax-lookup-popup>ax-header:not(.ax-solid),.ax-lookup-popup>ax-footer{flex-shrink:0;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}.ax-lookup-popup>ax-header:not(.ax-solid){border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.ax-lookup-popup>ax-footer{border-top-style:var(--tw-border-style);border-top-width:1px}.ax-lookup-viewport{width:100%;min-width:calc(var(--spacing, .25rem) * 0);overflow-x:hidden}.ax-lookup-empty{display:flex;min-height:calc(var(--spacing, .25rem) * 12);width:100%;align-items:center;justify-content:center;padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 3);text-align:center;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-empty{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 60%,transparent)}}.ax-lookup-option-host{box-sizing:border-box;cursor:pointer;border-style:var(--tw-border-style);border-width:1px;border-color:transparent;--tw-outline-style: none;outline-style:none}.ax-lookup-option-host.ax-state-alternate{background-color:rgba(var(--ax-sys-color-light-surface))}.ax-lookup-option-host.ax-state-alternate:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-surface))}.ax-lookup-option-host:hover,.ax-lookup-option-host.ax-state-active{background-color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host:hover,.ax-lookup-option-host.ax-state-active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 10%,transparent)}}.ax-lookup-option-host.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-alternate.ax-state-active{background-color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-alternate.ax-state-active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 15%,transparent)}}.ax-lookup-option-host.ax-state-selected,.ax-lookup-option-host.ax-state-selected:hover,.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate,.ax-lookup-option-host.ax-state-selected.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}:is(.ax-lookup-option-host.ax-state-selected,.ax-lookup-option-host.ax-state-selected:hover,.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate,.ax-lookup-option-host.ax-state-selected.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-primary-darkest-surface))}@supports (color: color-mix(in lab,red,red)){:is(.ax-lookup-option-host.ax-state-selected,.ax-lookup-option-host.ax-state-selected:hover,.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate,.ax-lookup-option-host.ax-state-selected.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-darkest-surface)) 25%,transparent)}}.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-lightest-surface)) 80%,transparent)}}:is(.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-primary-darkest-surface))}@supports (color: color-mix(in lab,red,red)){:is(.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-darkest-surface)) 40%,transparent)}}.ax-lookup-option-host.ax-lookup-option-multiple{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2)}.ax-lookup-option-host.ax-lookup-option-multiple:not(.ax-lookup-option){padding-inline:calc(var(--spacing, .25rem) * 3)}.ax-lookup-option-host .ax-lookup-checkbox{pointer-events:none;display:inline-flex;flex-shrink:0;align-items:center}.ax-lookup-option-host .ax-lookup-option-loading{width:100%;padding-inline:calc(var(--spacing, .25rem) * 3);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host .ax-lookup-option-loading{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 50%,transparent)}}.ax-lookup-option{display:flex;align-items:center;justify-content:space-between;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 3);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}.ax-lookup-option.ax-state-selected{color:rgba(var(--ax-sys-color-primary-surface))}.ax-lookup-option.ax-lookup-option-multiple{justify-content:flex-start}.ax-lookup-option .ax-lookup-option-text{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ax-lookup-option .ax-lookup-option-check{margin-inline-start:auto;flex-shrink:0;color:rgba(var(--ax-sys-color-primary-surface))}ax-lookup-multi-column,ax-lookup-multi-column-tree,.ax-lookup-multi-column,.ax-lookup-multi-column-tree{display:block;min-height:calc(var(--spacing, .25rem) * 0);width:100%}:is(ax-lookup-multi-column,ax-lookup-multi-column-tree,.ax-lookup-multi-column,.ax-lookup-multi-column-tree) .ax-lookup-multi-column-table,:is(ax-lookup-multi-column,ax-lookup-multi-column-tree,.ax-lookup-multi-column,.ax-lookup-multi-column-tree) ax-data-table{height:100%;min-height:calc(var(--spacing, .25rem) * 0);border-style:var(--tw-border-style)!important;border-width:0px!important}:is(ax-lookup-multi-column,ax-lookup-multi-column-tree,.ax-lookup-multi-column,.ax-lookup-multi-column-tree) tr.ax-state-selected{background-color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){:is(ax-lookup-multi-column,ax-lookup-multi-column-tree,.ax-lookup-multi-column,.ax-lookup-multi-column-tree) tr.ax-state-selected{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 10%,transparent)}}:is(ax-lookup-multi-column,ax-lookup-multi-column-tree,.ax-lookup-multi-column,.ax-lookup-multi-column-tree) tr.ax-state-disabled{pointer-events:none;opacity:50%}.ax-lookup-tree{max-height:calc(var(--spacing, .25rem) * 80);overflow:auto;padding:calc(var(--spacing, .25rem) * 2)}.ax-lookup-tree .ax-tree-view-node{margin-block:0;border-radius:0}.ax-lookup-tree .ax-tree-view-node.ax-state-alternate{background-color:rgba(var(--ax-sys-color-light-surface))}.ax-lookup-tree .ax-tree-view-node.ax-state-alternate:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-surface))}.ax-lookup-tree .ax-tree-view-node.ax-state-alternate:hover:not(.ax-dragging){background-color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-tree .ax-tree-view-node.ax-state-alternate:hover:not(.ax-dragging){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 15%,transparent)}}.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected,.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}:is(.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected,.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-primary-darkest-surface))}@supports (color: color-mix(in lab,red,red)){:is(.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected,.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-darkest-surface)) 25%,transparent)}}.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected:hover:not(.ax-dragging),.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected:hover:not(.ax-dragging){background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected:hover:not(.ax-dragging),.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected:hover:not(.ax-dragging){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-lightest-surface)) 80%,transparent)}}:is(.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected:hover:not(.ax-dragging),.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected:hover:not(.ax-dragging)):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-primary-darkest-surface))}@supports (color: color-mix(in lab,red,red)){:is(.ax-lookup-tree .ax-tree-view-node.ax-tree-view-node-selected:hover:not(.ax-dragging),.ax-lookup-tree .ax-tree-view-node.ax-state-alternate.ax-tree-view-node-selected:hover:not(.ax-dragging)):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-darkest-surface)) 40%,transparent)}}}ax-lookup .ax-editor-container.ax-fill ax-chips.ax-default.ax-fill-interactive{background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);border-color:rgba(var(--ax-sys-color-border-surface))}ax-lookup .ax-editor-container.ax-fill ax-chips.ax-default.ax-fill-interactive:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}ax-lookup .ax-editor-container.ax-fill ax-chips.ax-default.ax-fill-interactive:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){border-color:rgba(var(--ax-sys-color-border-light-surface))}ax-lookup .ax-editor-container.ax-fill ax-chips.ax-default.ax-fill-interactive:not(.ax-state-disabled):hover{background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}ax-lookup .ax-editor-container.ax-fill ax-chips.ax-default.ax-fill-interactive:not(.ax-state-disabled):hover:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:var(--color-light);color:var(--color-on-light);border-color:var(--color-border-light)}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-leading: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
|
|
2939
3201
|
}], ctorParameters: () => [], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: false }] }], treeDataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "treeDataSource", required: false }] }], valueField: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueField", required: false }] }], textField: [{ type: i0.Input, args: [{ isSignal: true, alias: "textField", required: false }] }], disabledField: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabledField", required: false }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], treeParentField: [{ type: i0.Input, args: [{ isSignal: true, alias: "treeParentField", required: false }] }], hasChildrenField: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasChildrenField", required: false }] }], searchable: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchable", required: false }] }], adaptivityEnabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "adaptivityEnabled", required: false }] }], caption: [{ type: i0.Input, args: [{ isSignal: true, alias: "caption", required: false }] }], alternate: [{ type: i0.Input, args: [{ isSignal: true, alias: "alternate", required: false }] }], searchPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchPlaceholder", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], look: [{ type: i0.Input, args: [{ isSignal: true, alias: "look", required: false }] }, { type: i0.Output, args: ["lookChange"] }], itemHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemHeight", required: false }] }], maxVisibleItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxVisibleItems", required: false }] }], treeSelectionBehavior: [{ type: i0.Input, args: [{ isSignal: true, alias: "treeSelectionBehavior", required: false }] }], highlightSearch: [{ type: i0.Input, args: [{ isSignal: true, alias: "highlightSearch", required: false }] }], itemTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemTemplate", required: false }] }], selectedTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedTemplate", required: false }] }], emptyTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyTemplate", required: false }] }], loadingTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingTemplate", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], valueItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueItems", required: false }] }], onValueChanged: [{ type: i0.Output, args: ["onValueChanged"] }], onSelectionChanged: [{ type: i0.Output, args: ["onSelectionChanged"] }], onFocus: [{ type: i0.Output, args: ["onFocus"] }], onBlur: [{ type: i0.Output, args: ["onBlur"] }], onItemClick: [{ type: i0.Output, args: ["onItemClick"] }], onItemSelected: [{ type: i0.Output, args: ["onItemSelected"] }], onOpened: [{ type: i0.Output, args: ["onOpened"] }], onClosed: [{ type: i0.Output, args: ["onClosed"] }], popoverRef: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AXPopoverComponent), { isSignal: true }] }], originRef: [{ type: i0.ViewChild, args: ['origin', { isSignal: true }] }], popupRef: [{ type: i0.ViewChild, args: ['popup', { isSignal: true }] }], triggerSearchInput: [{ type: i0.ViewChild, args: ['triggerSearchInput', { isSignal: true }] }], listView: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AXLookupListViewBase), { isSignal: true }] }], dropDownTreeView: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AXLookupDropDownTreeComponent), { isSignal: true }] }], multiSelectTreeView: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AXLookupMultiSelectTreeComponent), { isSignal: true }] }], sheetSearchRef: [{ type: i0.ViewChild, args: ['sheetSearch', { isSignal: true }] }] } });
|
|
2940
3202
|
|
|
2941
3203
|
class AXLookupModule {
|