@acorex/components 22.1.0-next.31 → 22.1.0-next.33

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (263) hide show
  1. package/emoji/README.md +3 -0
  2. package/emojipicker/README.md +3 -0
  3. package/fesm2022/acorex-components-accordion.mjs +13 -13
  4. package/fesm2022/acorex-components-accordion.mjs.map +1 -1
  5. package/fesm2022/acorex-components-action-sheet.mjs +13 -13
  6. package/fesm2022/acorex-components-alert.mjs +7 -7
  7. package/fesm2022/acorex-components-aspect-ratio.mjs +3 -3
  8. package/fesm2022/acorex-components-audio-wave.mjs +295 -271
  9. package/fesm2022/acorex-components-audio-wave.mjs.map +1 -1
  10. package/fesm2022/acorex-components-autocomplete.mjs +7 -7
  11. package/fesm2022/acorex-components-avatar.mjs +10 -10
  12. package/fesm2022/acorex-components-badge.mjs +7 -7
  13. package/fesm2022/acorex-components-bottom-navigation.mjs +10 -10
  14. package/fesm2022/acorex-components-breadcrumbs.mjs +10 -10
  15. package/fesm2022/acorex-components-bubble.mjs +71 -0
  16. package/fesm2022/acorex-components-bubble.mjs.map +1 -0
  17. package/fesm2022/acorex-components-button-group.mjs +22 -15
  18. package/fesm2022/acorex-components-button-group.mjs.map +1 -1
  19. package/fesm2022/acorex-components-button.mjs +194 -51
  20. package/fesm2022/acorex-components-button.mjs.map +1 -1
  21. package/fesm2022/acorex-components-calendar.mjs +332 -130
  22. package/fesm2022/acorex-components-calendar.mjs.map +1 -1
  23. package/fesm2022/acorex-components-check-box.mjs +7 -7
  24. package/fesm2022/acorex-components-chips.mjs +7 -7
  25. package/fesm2022/acorex-components-circular-progress.mjs +7 -7
  26. package/fesm2022/acorex-components-code-editor.mjs +44 -19
  27. package/fesm2022/acorex-components-code-editor.mjs.map +1 -1
  28. package/fesm2022/acorex-components-color-box.mjs +7 -7
  29. package/fesm2022/acorex-components-color-palette.mjs +28 -28
  30. package/fesm2022/acorex-components-combo-box.mjs +244 -54
  31. package/fesm2022/acorex-components-combo-box.mjs.map +1 -1
  32. package/fesm2022/acorex-components-command.mjs +7 -7
  33. package/fesm2022/acorex-components-comment.mjs +28 -28
  34. package/fesm2022/acorex-components-conversation-acorex-components-conversation-EmV9ldrU.mjs +19539 -0
  35. package/fesm2022/acorex-components-conversation-acorex-components-conversation-EmV9ldrU.mjs.map +1 -0
  36. package/fesm2022/acorex-components-conversation-composer-action-choice-dialog.component-F5fLD_SK.mjs +50 -0
  37. package/fesm2022/acorex-components-conversation-composer-action-choice-dialog.component-F5fLD_SK.mjs.map +1 -0
  38. package/fesm2022/acorex-components-conversation-image-picker-editor-dialog.component-Bk3ixvt2.mjs +87 -0
  39. package/fesm2022/acorex-components-conversation-image-picker-editor-dialog.component-Bk3ixvt2.mjs.map +1 -0
  40. package/fesm2022/acorex-components-conversation-picker-rename-file-dialog.component-DY7nhA-e.mjs +65 -0
  41. package/fesm2022/acorex-components-conversation-picker-rename-file-dialog.component-DY7nhA-e.mjs.map +1 -0
  42. package/fesm2022/acorex-components-conversation.mjs +1 -15470
  43. package/fesm2022/acorex-components-conversation.mjs.map +1 -1
  44. package/fesm2022/acorex-components-cron-job.mjs +47 -47
  45. package/fesm2022/acorex-components-cron-job.mjs.map +1 -1
  46. package/fesm2022/acorex-components-data-list.mjs +3 -3
  47. package/fesm2022/acorex-components-data-pager.mjs +35 -35
  48. package/fesm2022/acorex-components-data-pager.mjs.map +1 -1
  49. package/fesm2022/acorex-components-data-table.mjs +734 -165
  50. package/fesm2022/acorex-components-data-table.mjs.map +1 -1
  51. package/fesm2022/acorex-components-datetime-box.mjs +7 -7
  52. package/fesm2022/acorex-components-datetime-input.mjs +7 -7
  53. package/fesm2022/acorex-components-datetime-picker.mjs +8 -8
  54. package/fesm2022/acorex-components-datetime-picker.mjs.map +1 -1
  55. package/fesm2022/acorex-components-decorators.mjs +60 -30
  56. package/fesm2022/acorex-components-decorators.mjs.map +1 -1
  57. package/fesm2022/acorex-components-dialog.mjs +11 -11
  58. package/fesm2022/acorex-components-dialog.mjs.map +1 -1
  59. package/fesm2022/acorex-components-drawer.mjs +10 -10
  60. package/fesm2022/acorex-components-dropdown-button.mjs +10 -9
  61. package/fesm2022/acorex-components-dropdown-button.mjs.map +1 -1
  62. package/fesm2022/acorex-components-dropdown.mjs +19 -14
  63. package/fesm2022/acorex-components-dropdown.mjs.map +1 -1
  64. package/fesm2022/acorex-components-editor.mjs +15 -14
  65. package/fesm2022/acorex-components-editor.mjs.map +1 -1
  66. package/fesm2022/acorex-components-emoji.mjs +74 -0
  67. package/fesm2022/acorex-components-emoji.mjs.map +1 -0
  68. package/fesm2022/acorex-components-emojipicker.mjs +425 -0
  69. package/fesm2022/acorex-components-emojipicker.mjs.map +1 -0
  70. package/fesm2022/acorex-components-fab.mjs +6 -6
  71. package/fesm2022/acorex-components-fab.mjs.map +1 -1
  72. package/fesm2022/acorex-components-file-viewer.mjs +370 -124
  73. package/fesm2022/acorex-components-file-viewer.mjs.map +1 -1
  74. package/fesm2022/acorex-components-form.mjs +17 -17
  75. package/fesm2022/acorex-components-form.mjs.map +1 -1
  76. package/fesm2022/acorex-components-grid-layout-builder.mjs +10 -10
  77. package/fesm2022/acorex-components-highlight.mjs +80 -0
  78. package/fesm2022/acorex-components-highlight.mjs.map +1 -0
  79. package/fesm2022/acorex-components-image-editor.mjs +780 -451
  80. package/fesm2022/acorex-components-image-editor.mjs.map +1 -1
  81. package/fesm2022/acorex-components-image.mjs +7 -7
  82. package/fesm2022/acorex-components-inline-reaction.mjs +111 -0
  83. package/fesm2022/acorex-components-inline-reaction.mjs.map +1 -0
  84. package/fesm2022/acorex-components-json-viewer.mjs +7 -7
  85. package/fesm2022/acorex-components-kanban.mjs +3 -3
  86. package/fesm2022/acorex-components-kanban.mjs.map +1 -1
  87. package/fesm2022/acorex-components-kbd.mjs +6 -6
  88. package/fesm2022/acorex-components-label.mjs +7 -7
  89. package/fesm2022/acorex-components-list.mjs +28 -9
  90. package/fesm2022/acorex-components-list.mjs.map +1 -1
  91. package/fesm2022/acorex-components-loading-dialog.mjs +10 -10
  92. package/fesm2022/acorex-components-loading-dialog.mjs.map +1 -1
  93. package/fesm2022/acorex-components-loading.mjs +16 -16
  94. package/fesm2022/acorex-components-lookup.mjs +764 -156
  95. package/fesm2022/acorex-components-lookup.mjs.map +1 -1
  96. package/fesm2022/acorex-components-map.mjs +20 -13
  97. package/fesm2022/acorex-components-map.mjs.map +1 -1
  98. package/fesm2022/acorex-components-media-viewer.mjs +215 -218
  99. package/fesm2022/acorex-components-media-viewer.mjs.map +1 -1
  100. package/fesm2022/acorex-components-menu.mjs +146 -45
  101. package/fesm2022/acorex-components-menu.mjs.map +1 -1
  102. package/fesm2022/acorex-components-message-status.mjs +71 -0
  103. package/fesm2022/acorex-components-message-status.mjs.map +1 -0
  104. package/fesm2022/acorex-components-message-time.mjs +36 -0
  105. package/fesm2022/acorex-components-message-time.mjs.map +1 -0
  106. package/fesm2022/acorex-components-message.mjs +120 -0
  107. package/fesm2022/acorex-components-message.mjs.map +1 -0
  108. package/fesm2022/acorex-components-navbar.mjs +7 -7
  109. package/fesm2022/acorex-components-notification.mjs +11 -11
  110. package/fesm2022/acorex-components-notification.mjs.map +1 -1
  111. package/fesm2022/acorex-components-number-box.mjs +7 -7
  112. package/fesm2022/acorex-components-otp.mjs +7 -7
  113. package/fesm2022/acorex-components-page.mjs +10 -10
  114. package/fesm2022/acorex-components-paint.mjs +25 -25
  115. package/fesm2022/acorex-components-paint.mjs.map +1 -1
  116. package/fesm2022/acorex-components-password-box.mjs +10 -10
  117. package/fesm2022/acorex-components-password-box.mjs.map +1 -1
  118. package/fesm2022/acorex-components-pdf-reader.mjs +7 -7
  119. package/fesm2022/acorex-components-phone-box.mjs +7 -7
  120. package/fesm2022/acorex-components-picker.mjs +13 -13
  121. package/fesm2022/acorex-components-popover.mjs +80 -21
  122. package/fesm2022/acorex-components-popover.mjs.map +1 -1
  123. package/fesm2022/acorex-components-popup.mjs +167 -104
  124. package/fesm2022/acorex-components-popup.mjs.map +1 -1
  125. package/fesm2022/acorex-components-progress-bar.mjs +7 -7
  126. package/fesm2022/acorex-components-qrcode.mjs +7 -7
  127. package/fesm2022/acorex-components-radio.mjs +7 -7
  128. package/fesm2022/acorex-components-rail-navigation.mjs +14 -14
  129. package/fesm2022/acorex-components-rail-navigation.mjs.map +1 -1
  130. package/fesm2022/acorex-components-range-slider.mjs +9 -9
  131. package/fesm2022/acorex-components-range-slider.mjs.map +1 -1
  132. package/fesm2022/acorex-components-rate-picker.mjs +7 -7
  133. package/fesm2022/acorex-components-reaction.mjs +144 -0
  134. package/fesm2022/acorex-components-reaction.mjs.map +1 -0
  135. package/fesm2022/acorex-components-rest-api-generator.mjs +22 -22
  136. package/fesm2022/acorex-components-rest-api-generator.mjs.map +1 -1
  137. package/fesm2022/acorex-components-result.mjs +7 -7
  138. package/fesm2022/acorex-components-routing-progress.mjs +7 -7
  139. package/fesm2022/acorex-components-rrule.mjs +9 -9
  140. package/fesm2022/acorex-components-rrule.mjs.map +1 -1
  141. package/fesm2022/acorex-components-scheduler-picker.mjs +56 -56
  142. package/fesm2022/acorex-components-scheduler-picker.mjs.map +1 -1
  143. package/fesm2022/acorex-components-scheduler.mjs +34 -34
  144. package/fesm2022/acorex-components-scheduler.mjs.map +1 -1
  145. package/fesm2022/acorex-components-search-box.mjs +7 -7
  146. package/fesm2022/acorex-components-select-box.mjs +7 -7
  147. package/fesm2022/acorex-components-selection-list.mjs +7 -8
  148. package/fesm2022/acorex-components-selection-list.mjs.map +1 -1
  149. package/fesm2022/acorex-components-side-menu.mjs +55 -42
  150. package/fesm2022/acorex-components-side-menu.mjs.map +1 -1
  151. package/fesm2022/acorex-components-sidebar.mjs +28 -28
  152. package/fesm2022/acorex-components-skeleton.mjs +7 -7
  153. package/fesm2022/acorex-components-slider.mjs +7 -7
  154. package/fesm2022/acorex-components-sliding-item.mjs +13 -13
  155. package/fesm2022/acorex-components-step-wizard.mjs +16 -18
  156. package/fesm2022/acorex-components-step-wizard.mjs.map +1 -1
  157. package/fesm2022/acorex-components-switch.mjs +10 -10
  158. package/fesm2022/acorex-components-tabs.mjs +529 -78
  159. package/fesm2022/acorex-components-tabs.mjs.map +1 -1
  160. package/fesm2022/acorex-components-tag-box.mjs +7 -7
  161. package/fesm2022/acorex-components-tag.mjs +7 -7
  162. package/fesm2022/acorex-components-text-area.mjs +7 -7
  163. package/fesm2022/acorex-components-text-box.mjs +7 -7
  164. package/fesm2022/acorex-components-time-duration.mjs +7 -7
  165. package/fesm2022/acorex-components-time-line.mjs +10 -10
  166. package/fesm2022/acorex-components-toast.mjs +10 -10
  167. package/fesm2022/acorex-components-toolbar.mjs +7 -7
  168. package/fesm2022/acorex-components-tooltip.mjs +10 -10
  169. package/fesm2022/acorex-components-tree-view.mjs +58 -15
  170. package/fesm2022/acorex-components-tree-view.mjs.map +1 -1
  171. package/fesm2022/acorex-components-uploader.mjs +13 -13
  172. package/fesm2022/acorex-components-video-player.mjs +7 -7
  173. package/fesm2022/acorex-components-wysiwyg.mjs +109 -39
  174. package/fesm2022/acorex-components-wysiwyg.mjs.map +1 -1
  175. package/highlight/README.md +13 -0
  176. package/inline-reaction/README.md +3 -0
  177. package/lookup/README.md +1 -1
  178. package/message/README.md +3 -0
  179. package/message-status/README.md +3 -0
  180. package/message-time/README.md +3 -0
  181. package/package.json +42 -12
  182. package/reaction/README.md +3 -0
  183. package/types/acorex-components-action-sheet.d.ts +1 -1
  184. package/types/acorex-components-audio-wave.d.ts +132 -73
  185. package/types/acorex-components-bubble.d.ts +31 -0
  186. package/types/acorex-components-button-group.d.ts +4 -0
  187. package/types/acorex-components-button.d.ts +24 -7
  188. package/types/acorex-components-calendar.d.ts +43 -12
  189. package/types/acorex-components-check-box.d.ts +1 -1
  190. package/types/acorex-components-code-editor.d.ts +4 -1
  191. package/types/acorex-components-color-box.d.ts +1 -1
  192. package/types/acorex-components-color-palette.d.ts +2 -2
  193. package/types/acorex-components-combo-box.d.ts +34 -4
  194. package/types/acorex-components-command.d.ts +1 -1
  195. package/types/acorex-components-conversation.d.ts +1869 -1372
  196. package/types/acorex-components-cron-job.d.ts +6 -6
  197. package/types/acorex-components-data-pager.d.ts +2 -2
  198. package/types/acorex-components-data-table.d.ts +194 -21
  199. package/types/acorex-components-datetime-box.d.ts +1 -1
  200. package/types/acorex-components-datetime-picker.d.ts +1 -1
  201. package/types/acorex-components-decorators.d.ts +13 -1
  202. package/types/acorex-components-dialog.d.ts +1 -1
  203. package/types/acorex-components-dropdown-button.d.ts +2 -1
  204. package/types/acorex-components-dropdown.d.ts +6 -1
  205. package/types/acorex-components-editor.d.ts +1 -1
  206. package/types/acorex-components-emoji.d.ts +42 -0
  207. package/types/acorex-components-emojipicker.d.ts +146 -0
  208. package/types/acorex-components-file-viewer.d.ts +50 -6
  209. package/types/acorex-components-highlight.d.ts +31 -0
  210. package/types/acorex-components-image-editor.d.ts +72 -50
  211. package/types/acorex-components-inline-reaction.d.ts +52 -0
  212. package/types/acorex-components-list.d.ts +12 -0
  213. package/types/acorex-components-loading-dialog.d.ts +1 -1
  214. package/types/acorex-components-loading.d.ts +1 -1
  215. package/types/acorex-components-lookup.d.ts +213 -82
  216. package/types/acorex-components-map.d.ts +7 -2
  217. package/types/acorex-components-media-viewer.d.ts +4 -3
  218. package/types/acorex-components-menu.d.ts +17 -5
  219. package/types/acorex-components-message-status.d.ts +23 -0
  220. package/types/acorex-components-message-time.d.ts +19 -0
  221. package/types/acorex-components-message.d.ts +59 -0
  222. package/types/acorex-components-notification.d.ts +1 -1
  223. package/types/acorex-components-number-box.d.ts +1 -1
  224. package/types/acorex-components-otp.d.ts +1 -1
  225. package/types/acorex-components-page.d.ts +2 -2
  226. package/types/acorex-components-paint.d.ts +2 -2
  227. package/types/acorex-components-password-box.d.ts +1 -1
  228. package/types/acorex-components-phone-box.d.ts +1 -1
  229. package/types/acorex-components-popover.d.ts +18 -4
  230. package/types/acorex-components-popup.d.ts +62 -26
  231. package/types/acorex-components-rail-navigation.d.ts +1 -1
  232. package/types/acorex-components-range-slider.d.ts +1 -1
  233. package/types/acorex-components-reaction.d.ts +85 -0
  234. package/types/acorex-components-rest-api-generator.d.ts +1 -1
  235. package/types/acorex-components-rrule.d.ts +1 -1
  236. package/types/acorex-components-scheduler-picker.d.ts +1 -1
  237. package/types/acorex-components-scheduler.d.ts +1 -1
  238. package/types/acorex-components-search-box.d.ts +1 -1
  239. package/types/acorex-components-selection-list.d.ts +1 -1
  240. package/types/acorex-components-side-menu.d.ts +6 -8
  241. package/types/acorex-components-slider.d.ts +1 -1
  242. package/types/acorex-components-step-wizard.d.ts +4 -4
  243. package/types/acorex-components-switch.d.ts +1 -1
  244. package/types/acorex-components-tabs.d.ts +150 -19
  245. package/types/acorex-components-tag-box.d.ts +2 -2
  246. package/types/acorex-components-text-area.d.ts +1 -1
  247. package/types/acorex-components-text-box.d.ts +1 -1
  248. package/types/acorex-components-time-duration.d.ts +1 -1
  249. package/types/acorex-components-toast.d.ts +1 -1
  250. package/types/acorex-components-tree-view.d.ts +32 -3
  251. package/types/acorex-components-wysiwyg.d.ts +15 -2
  252. package/fesm2022/acorex-components-conversation-composer-action-choice-dialog.component-DCcRJYfF.mjs +0 -50
  253. package/fesm2022/acorex-components-conversation-composer-action-choice-dialog.component-DCcRJYfF.mjs.map +0 -1
  254. package/fesm2022/acorex-components-conversation-open-composer-picker-for-files-DnSW908R.mjs +0 -210
  255. package/fesm2022/acorex-components-conversation-open-composer-picker-for-files-DnSW908R.mjs.map +0 -1
  256. package/fesm2022/acorex-components-flow-chart.mjs +0 -735
  257. package/fesm2022/acorex-components-flow-chart.mjs.map +0 -1
  258. package/fesm2022/acorex-components-query-builder.mjs +0 -267
  259. package/fesm2022/acorex-components-query-builder.mjs.map +0 -1
  260. package/flow-chart/README.md +0 -3
  261. package/query-builder/README.md +0 -3
  262. package/types/acorex-components-flow-chart.d.ts +0 -187
  263. package/types/acorex-components-query-builder.d.ts +0 -52
@@ -1,4 +1,4 @@
1
- import { AXDataSource, AXListDataSource, NXValueComponent, convertArrayToDataSource, AXComponent, AXClearableComponent, AXClosableComponent, AXValuableComponent } from '@acorex/cdk/common';
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,13 +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, linkedSignal, afterRenderEffect, NgModule } from '@angular/core';
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/components/highlight';
16
17
  import * as i1 from '@angular/cdk/scrolling';
17
18
  import { CdkVirtualScrollViewport, ScrollingModule } from '@angular/cdk/scrolling';
18
19
  import { AXTreeViewComponent } from '@acorex/components/tree-view';
@@ -20,6 +21,143 @@ import { AXDataTableComponent, AXDataTableTextColumnComponent } from '@acorex/co
20
21
  import { fromEvent, auditTime } from 'rxjs';
21
22
  import { AXCheckBoxComponent } from '@acorex/components/check-box';
22
23
 
24
+ /** Whether a tree node may have descendants (embedded children or lazy metadata). */
25
+ function lookupTreeNodeMayHaveChildren(node) {
26
+ const raw = node['children'];
27
+ if (Array.isArray(raw) && raw.length > 0) {
28
+ return true;
29
+ }
30
+ const count = node['childrenCount'];
31
+ if (typeof count === 'number' && count > 0) {
32
+ return true;
33
+ }
34
+ return node['hasChild'] === true || node['hasChildren'] === true;
35
+ }
36
+ async function mapWithConcurrency(items, concurrency, fn, isCancelled) {
37
+ if (!items.length) {
38
+ return [];
39
+ }
40
+ const results = new Array(items.length);
41
+ let nextIndex = 0;
42
+ const worker = async () => {
43
+ while (nextIndex < items.length) {
44
+ if (isCancelled?.()) {
45
+ return;
46
+ }
47
+ const index = nextIndex++;
48
+ if (index >= items.length) {
49
+ break;
50
+ }
51
+ results[index] = await fn(items[index]);
52
+ }
53
+ };
54
+ const workers = Math.min(concurrency, items.length);
55
+ await Promise.all(Array.from({ length: workers }, () => worker()));
56
+ return results;
57
+ }
58
+ /**
59
+ * Loads a lazy tree into a nested in-memory snapshot using bounded-concurrency BFS.
60
+ * Returns new node objects and never mutates the input nodes.
61
+ */
62
+ async function hydrateLookupTree(roots, loadChildren, options) {
63
+ const { valueField, maxConcurrent = 6, maxNodes = 5000, isCancelled } = options;
64
+ const visited = new Set();
65
+ let nodeCount = 0;
66
+ const hydrateLevel = async (nodes) => {
67
+ if (!nodes.length || isCancelled?.()) {
68
+ return nodes.map((node) => ({ ...node }));
69
+ }
70
+ const hydrateNode = async (node) => {
71
+ if (isCancelled?.()) {
72
+ return { ...node };
73
+ }
74
+ const raw = node['children'];
75
+ if (Array.isArray(raw) && raw.length > 0) {
76
+ const children = await hydrateLevel(raw);
77
+ return { ...node, children };
78
+ }
79
+ const id = String(node[valueField] ?? '');
80
+ if (!id || visited.has(id) || !lookupTreeNodeMayHaveChildren(node)) {
81
+ return { ...node };
82
+ }
83
+ visited.add(id);
84
+ nodeCount++;
85
+ if (nodeCount > maxNodes) {
86
+ return { ...node };
87
+ }
88
+ const loaded = await loadChildren(id);
89
+ if (isCancelled?.() || !loaded.length) {
90
+ return { ...node };
91
+ }
92
+ const children = await hydrateLevel(loaded);
93
+ return children.length > 0 ? { ...node, children } : { ...node };
94
+ };
95
+ return mapWithConcurrency(nodes, maxConcurrent, hydrateNode, isCancelled);
96
+ };
97
+ return hydrateLevel(roots);
98
+ }
99
+
100
+ /** Whether an item label matches a search query (raw or translated). */
101
+ function matchesLookupText(text, query, translateText) {
102
+ const needle = query.trim().toLowerCase();
103
+ if (!needle) {
104
+ return true;
105
+ }
106
+ const raw = String(text ?? '').toLowerCase();
107
+ if (raw.includes(needle)) {
108
+ return true;
109
+ }
110
+ const value = String(text ?? '');
111
+ if (translateText && value.startsWith('@')) {
112
+ return translateText(value).toLowerCase().includes(needle);
113
+ }
114
+ return false;
115
+ }
116
+ /**
117
+ * Array-backed datasource with optional i18n-aware text filtering.
118
+ */
119
+ function convertLookupArrayToDataSource(items, options) {
120
+ const normalizedItems = items.map((candidate) => {
121
+ const isObjectItem = candidate != null && typeof candidate === 'object';
122
+ if (isObjectItem) {
123
+ return candidate;
124
+ }
125
+ return { [options.key]: candidate, text: String(candidate ?? '') };
126
+ });
127
+ const config = {
128
+ key: options.key,
129
+ pageSize: options.pageSize,
130
+ load: async (e) => {
131
+ const itemsForFilter = normalizedItems;
132
+ const resultNormalized = e.filter
133
+ ? applyLookupArrayFilter(itemsForFilter, e.filter, options.textField, options.translateText)
134
+ : itemsForFilter;
135
+ const result = resultNormalized;
136
+ return {
137
+ items: result.slice(e.skip, e.skip + e.take),
138
+ total: resultNormalized.length,
139
+ };
140
+ },
141
+ byKey: (v) => normalizedItems.find((record) => record[options.key] == v),
142
+ };
143
+ return new AXDataSource(config);
144
+ }
145
+ function applyLookupArrayFilter(items, filter, textField, translateText) {
146
+ if (!filter?.field || filter.value === undefined || filter.value === null) {
147
+ return items;
148
+ }
149
+ const query = String(filter.value);
150
+ return items.filter((item) => {
151
+ const itemField = item[filter.field];
152
+ if (filter.field === textField) {
153
+ return matchesLookupText(String(itemField ?? ''), query, translateText);
154
+ }
155
+ if (typeof itemField === 'string' && typeof filter.value === 'string') {
156
+ return itemField.toLowerCase().includes(filter.value.toLowerCase());
157
+ }
158
+ return false;
159
+ });
160
+ }
23
161
  /**
24
162
  * Converts a drop-down-tree datasource (nested array or lazy callback) into an
25
163
  * `AXDataSource` that a multi-column data table can load and expand.
@@ -30,7 +168,7 @@ function createLookupTreeTableDataSource(source, options) {
30
168
  pageSize: 8,
31
169
  key: options.valueField,
32
170
  load: (query) => loadTreeTableRows(source, options, query, isCallback),
33
- byKey: (key) => findTreeTableItem(source, options.valueField, key),
171
+ byKey: (key) => findTreeTableItem(source, options.valueField, key) ?? {},
34
172
  });
35
173
  }
36
174
  async function loadTreeTableRows(source, options, query, isCallback) {
@@ -40,8 +178,13 @@ async function loadTreeTableRows(source, options, query, isCallback) {
40
178
  const children = await loadChildren(source, options, parentFilter.value, isCallback);
41
179
  return { items: children, total: children.length };
42
180
  }
43
- const roots = mapTreeNodes(await loadRoots(source, isCallback), options);
44
- const items = textFilter ? filterTreeNodes(roots, options.textField, String(textFilter.value ?? '')) : roots;
181
+ const rootNodes = textFilter && options.loadSearchRoots
182
+ ? await options.loadSearchRoots()
183
+ : await loadRoots(source, isCallback);
184
+ const roots = mapTreeNodes(rootNodes, options);
185
+ const items = textFilter
186
+ ? prepareFilteredTreeTableRows(filterTreeNodes(roots, options.searchFields?.length ? options.searchFields : options.textField, String(textFilter.value ?? '')))
187
+ : roots;
45
188
  return { items, total: items.length };
46
189
  }
47
190
  async function loadRoots(source, isCallback) {
@@ -65,11 +208,7 @@ function mapTreeNodes(nodes, options) {
65
208
  function mapTreeNode(node, options) {
66
209
  const rawChildren = node['children'];
67
210
  const children = Array.isArray(rawChildren) ? mapTreeNodes(rawChildren, options) : undefined;
68
- const childrenCount = node['childrenCount'];
69
- const hasChildren = (children?.length ?? 0) > 0 ||
70
- (typeof childrenCount === 'number' && childrenCount > 0) ||
71
- node['hasChild'] === true ||
72
- node['hasChildren'] === true;
211
+ const hasChildren = lookupTreeNodeMayHaveChildren(node) || (children?.length ?? 0) > 0;
73
212
  return {
74
213
  ...node,
75
214
  [options.hasChildrenField]: hasChildren,
@@ -82,26 +221,48 @@ function mapTreeNode(node, options) {
82
221
  * all children. Every kept ancestor is a new object with `expanded: true` so
83
222
  * nested hits are visible without mutating the original tree.
84
223
  */
85
- function filterTreeNodes(nodes, textField, query) {
224
+ /** Reads a possibly dotted field path off a node. */
225
+ function readNodeField(node, field) {
226
+ if (!field.includes('.')) {
227
+ return node[field];
228
+ }
229
+ return field.split('.').reduce((current, segment) => {
230
+ if (current == null || typeof current !== 'object') {
231
+ return undefined;
232
+ }
233
+ return current[segment];
234
+ }, node);
235
+ }
236
+ /** Whether any of `fields` on the node matches the query. */
237
+ function matchesLookupNode(node, fields, needle, translateText) {
238
+ return fields.some((field) => {
239
+ const value = readNodeField(node, field);
240
+ if (value == null) {
241
+ return false;
242
+ }
243
+ return matchesLookupText(String(value), needle, translateText);
244
+ });
245
+ }
246
+ function filterTreeNodes(nodes, textField, query, translateText) {
86
247
  const needle = query.trim().toLowerCase();
87
248
  if (!needle) {
88
249
  return nodes;
89
250
  }
251
+ const fields = (Array.isArray(textField) ? textField : [textField]).filter((field) => !!field);
90
252
  const result = [];
91
253
  for (const node of nodes) {
92
254
  const rawChildren = node['children'];
93
255
  const nested = Array.isArray(rawChildren) ? rawChildren : undefined;
94
- const children = nested ? filterTreeNodes(nested, textField, needle) : undefined;
95
- const selfMatch = String(node[textField] ?? '')
96
- .toLowerCase()
97
- .includes(needle);
256
+ const selfMatch = matchesLookupNode(node, fields, needle, translateText);
98
257
  if (selfMatch) {
99
258
  result.push({
100
259
  ...node,
101
260
  ...(nested && nested.length > 0 ? { children: cloneTreeNodes(nested), expanded: true } : {}),
102
261
  });
262
+ continue;
103
263
  }
104
- else if (children && children.length > 0) {
264
+ const children = nested ? filterTreeNodes(nested, fields, needle, translateText) : undefined;
265
+ if (children && children.length > 0) {
105
266
  result.push({
106
267
  ...node,
107
268
  children,
@@ -111,6 +272,30 @@ function filterTreeNodes(nodes, textField, query) {
111
272
  }
112
273
  return result;
113
274
  }
275
+ /**
276
+ * Maps `filterTreeNodes` output to data-table row metadata so matching branches
277
+ * are expanded and nested rows are visible for search highlighting.
278
+ */
279
+ function prepareFilteredTreeTableRows(nodes) {
280
+ return nodes.map((node) => prepareFilteredTreeTableNode(node, 0));
281
+ }
282
+ function prepareFilteredTreeTableNode(node, level) {
283
+ const rawChildren = node['children'];
284
+ const nested = Array.isArray(rawChildren) ? rawChildren : undefined;
285
+ const children = nested?.map((child) => prepareFilteredTreeTableNode(child, level + 1));
286
+ const hasChildren = (children?.length ?? 0) > 0;
287
+ const priorMeta = node['__meta__'];
288
+ const shouldExpand = hasChildren || node['expanded'] === true;
289
+ return {
290
+ ...node,
291
+ ...(children ? { children } : {}),
292
+ __meta__: {
293
+ ...(typeof priorMeta === 'object' && priorMeta != null ? priorMeta : {}),
294
+ level,
295
+ expanded: shouldExpand,
296
+ },
297
+ };
298
+ }
114
299
  function cloneTreeNodes(nodes) {
115
300
  return nodes.map((node) => {
116
301
  const raw = node['children'];
@@ -156,6 +341,58 @@ function findTreeNode(nodes, valueField, key) {
156
341
  return null;
157
342
  }
158
343
 
344
+ /**
345
+ * Scrolls a CDK virtual viewport so the row at `index` is visible using nearest-edge behavior.
346
+ * Uses offset math because the row may not be rendered in the DOM yet.
347
+ */
348
+ function scrollNearestByOffset(viewport, index, itemHeight, totalCount) {
349
+ const viewportSize = viewport.getViewportSize();
350
+ const maxOffset = Math.max(0, totalCount * itemHeight - viewportSize);
351
+ const itemTop = index * itemHeight;
352
+ const itemBottom = itemTop + itemHeight;
353
+ const currentOffset = viewport.measureScrollOffset();
354
+ if (itemTop < currentOffset) {
355
+ viewport.scrollToOffset(itemTop);
356
+ }
357
+ else if (itemBottom > currentOffset + viewportSize) {
358
+ viewport.scrollToOffset(Math.min(maxOffset, itemBottom - viewportSize));
359
+ }
360
+ }
361
+ /**
362
+ * Scrolls a data-table body so the selected row is visible, accounting for a sticky header.
363
+ */
364
+ function scrollTableToSelectedRow(host, attempts = 5) {
365
+ retryFrames(() => {
366
+ const wrapper = host.querySelector('.ax-data-table-wrapper');
367
+ const row = wrapper?.querySelector('tr.ax-state-selected');
368
+ if (!wrapper || !row) {
369
+ return false;
370
+ }
371
+ const thead = wrapper.querySelector('thead');
372
+ const topInset = thead?.offsetHeight ?? 0;
373
+ scrollNearestIntoView(wrapper, row, topInset);
374
+ return true;
375
+ }, attempts);
376
+ }
377
+ /**
378
+ * Scrolls a lookup tree container so the node with `selectedId` is visible.
379
+ * Nodes inside collapsed branches are not in the DOM and are skipped.
380
+ */
381
+ function scrollTreeToSelectedNode(host, selectedId, attempts = 5) {
382
+ if (!selectedId) {
383
+ return;
384
+ }
385
+ retryFrames(() => {
386
+ const container = host.querySelector('.ax-lookup-tree');
387
+ const node = container?.querySelector(`[data-tree-node-id="${CSS.escape(selectedId)}"]`);
388
+ if (!container || !node) {
389
+ return false;
390
+ }
391
+ scrollNearestIntoView(container, node);
392
+ return true;
393
+ }, attempts);
394
+ }
395
+
159
396
  /**
160
397
  * Shared `AXDataSource` + CDK virtual scroll plumbing for the list-based lookup views
161
398
  * (`ax-lookup-drop-down-list`, `ax-lookup-multi-select`).
@@ -170,6 +407,16 @@ class AXLookupListViewBase {
170
407
  return this.totalCount();
171
408
  }
172
409
  #ngZone;
410
+ /**
411
+ * Before the first page loads, `totalCount` is 0 but `cachedItems` is pre-sized to `pageSize`.
412
+ * After a completed load with no rows, `cachedItems` is an empty array.
413
+ */
414
+ #hasPendingInitialLoad(source) {
415
+ return source.totalCount === 0 && source.cachedItems.length > 0 && !source.isLoading;
416
+ }
417
+ #syncLoadingState(source, isLoading) {
418
+ this.isLoading.set(isLoading || this.#hasPendingInitialLoad(source));
419
+ }
173
420
  constructor() {
174
421
  /**
175
422
  * The datasource providing the items (paged, remote-capable).
@@ -207,7 +454,8 @@ class AXLookupListViewBase {
207
454
  this.maxVisibleItems = input(8, /* @ts-ignore */
208
455
  ...(ngDevMode ? [{ debugName: "maxVisibleItems" }] : /* istanbul ignore next */ []));
209
456
  /**
210
- * Custom template rendered for each item. Context: `$implicit` is the item.
457
+ * Custom template rendered for each item. Context: `$implicit` is the item;
458
+ * `highlightText` is the active search query when result highlighting is enabled.
211
459
  * Default option chrome is not applied on top of the template.
212
460
  */
213
461
  this.itemTemplate = input(undefined, /* @ts-ignore */
@@ -227,6 +475,11 @@ class AXLookupListViewBase {
227
475
  */
228
476
  this.alternate = input(false, /* @ts-ignore */
229
477
  ...(ngDevMode ? [{ debugName: "alternate" }] : /* istanbul ignore next */ []));
478
+ /**
479
+ * When set, matching characters in the default option label are highlighted.
480
+ */
481
+ this.highlightText = input('', /* @ts-ignore */
482
+ ...(ngDevMode ? [{ debugName: "highlightText" }] : /* istanbul ignore next */ []));
230
483
  /**
231
484
  * Emitted when the user picks (or toggles) an item.
232
485
  */
@@ -280,20 +533,76 @@ class AXLookupListViewBase {
280
533
  const list = new AXListDataSource({ source });
281
534
  untracked(() => {
282
535
  this.totalCount.set(source.totalCount);
283
- this.isLoading.set(source.totalCount > 0 ? source.isLoading : true);
536
+ this.#syncLoadingState(source, source.isLoading);
284
537
  this.listDataSource.set(list);
285
538
  });
286
- const loadingSub = source.onLoadingChanged.subscribe((value) => this.isLoading.set(value));
287
- const changedSub = source.onChanged.subscribe((e) => this.totalCount.set(e.totalCount));
539
+ const loadingSub = source.onLoadingChanged.subscribe((value) => this.#syncLoadingState(source, value));
540
+ const changedSub = source.onChanged.subscribe((e) => {
541
+ this.totalCount.set(e.totalCount);
542
+ if (!source.isLoading) {
543
+ this.#syncLoadingState(source, false);
544
+ }
545
+ });
288
546
  onCleanup(() => {
289
547
  loadingSub.unsubscribe();
290
548
  changedSub.unsubscribe();
291
549
  });
292
550
  });
551
+ // Scroll the selected row into view once the virtual viewport and data are ready.
552
+ effect(() => {
553
+ const viewport = this.viewportRef();
554
+ const loading = this.isLoading();
555
+ const count = this.totalCount();
556
+ const values = this.selectedValues();
557
+ const field = this.valueField();
558
+ const height = this.itemHeight();
559
+ const source = this.dataSource();
560
+ if (!viewport || loading || count === 0 || values.length === 0) {
561
+ return;
562
+ }
563
+ untracked(() => {
564
+ requestAnimationFrame(() => {
565
+ viewport.checkViewportSize();
566
+ const index = this.#resolveSelectedIndex(source, values, field);
567
+ if (index >= 0) {
568
+ scrollNearestByOffset(viewport, index, height, count);
569
+ }
570
+ });
571
+ });
572
+ });
293
573
  }
294
- /** Moves keyboard focus to the first rendered list option. */
574
+ #resolveSelectedIndex(source, values, valueField) {
575
+ const selectedValue = values[0];
576
+ if (selectedValue == null) {
577
+ return -1;
578
+ }
579
+ const items = source.cachedItems;
580
+ for (let index = 0; index < items.length; index++) {
581
+ const item = items[index];
582
+ if (item != null && item[valueField] == selectedValue) {
583
+ return index;
584
+ }
585
+ }
586
+ return -1;
587
+ }
588
+ /** Moves keyboard focus to the selected list option, or the first option when none is selected. */
295
589
  focusFirst() {
296
- this.listNavigation()?.focusOnIndex(0);
590
+ const nav = this.listNavigation();
591
+ if (!nav) {
592
+ return;
593
+ }
594
+ const viewport = this.viewportRef();
595
+ const selectedHost = viewport?.elementRef.nativeElement.querySelector('.ax-lookup-option-host.ax-state-selected');
596
+ if (selectedHost) {
597
+ const items = this.navItems();
598
+ const index = items.findIndex((item) => item.itemElem.nativeElement === selectedHost);
599
+ if (index >= 0) {
600
+ nav.activeIndex.set(index);
601
+ nav.navigateTo(items[index]);
602
+ return;
603
+ }
604
+ }
605
+ nav.focusOnIndex(0);
297
606
  }
298
607
  getValue(item) {
299
608
  return item?.[this.valueField()];
@@ -373,12 +682,12 @@ class AXLookupListViewBase {
373
682
  activateNavItem(nav, item) {
374
683
  nav?.navigateTo(item);
375
684
  }
376
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXLookupListViewBase, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
377
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "22.0.8", type: AXLookupListViewBase, isStandalone: true, inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, 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 }, selectedValues: { classPropertyName: "selectedValues", publicName: "selectedValues", 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 }, itemTemplate: { classPropertyName: "itemTemplate", publicName: "itemTemplate", 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 }, alternate: { classPropertyName: "alternate", publicName: "alternate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemClick: "itemClick", navigateOut: "navigateOut" }, viewQueries: [{ propertyName: "viewportRef", first: true, predicate: CdkVirtualScrollViewport, descendants: true, isSignal: true }, { propertyName: "listNavigation", first: true, predicate: AXListNavigationDirective, descendants: true, isSignal: true }, { propertyName: "navItems", predicate: AXListNavigationItemDirective, descendants: true, isSignal: true }], ngImport: i0 }); }
685
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXLookupListViewBase, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
686
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "22.1.6", type: AXLookupListViewBase, isStandalone: true, inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, 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 }, selectedValues: { classPropertyName: "selectedValues", publicName: "selectedValues", 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 }, itemTemplate: { classPropertyName: "itemTemplate", publicName: "itemTemplate", 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 }, alternate: { classPropertyName: "alternate", publicName: "alternate", isSignal: true, isRequired: false, transformFunction: null }, highlightText: { classPropertyName: "highlightText", publicName: "highlightText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemClick: "itemClick", navigateOut: "navigateOut" }, viewQueries: [{ propertyName: "viewportRef", first: true, predicate: CdkVirtualScrollViewport, descendants: true, isSignal: true }, { propertyName: "listNavigation", first: true, predicate: AXListNavigationDirective, descendants: true, isSignal: true }, { propertyName: "navItems", predicate: AXListNavigationItemDirective, descendants: true, isSignal: true }], ngImport: i0 }); }
378
687
  }
379
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXLookupListViewBase, decorators: [{
688
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXLookupListViewBase, decorators: [{
380
689
  type: Directive
381
- }], 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 }] }], itemHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemHeight", required: false }] }], maxVisibleItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxVisibleItems", 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 }] }], itemClick: [{ type: i0.Output, args: ["itemClick"] }], navigateOut: [{ type: i0.Output, args: ["navigateOut"] }], viewportRef: [{ type: i0.ViewChild, args: [i0.forwardRef(() => CdkVirtualScrollViewport), { isSignal: true }] }], listNavigation: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AXListNavigationDirective), { isSignal: true }] }], navItems: [{ type: i0.ViewChildren, args: [i0.forwardRef(() => AXListNavigationItemDirective), { isSignal: true }] }] } });
690
+ }], 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 }] }], itemHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemHeight", required: false }] }], maxVisibleItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxVisibleItems", 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"] }], navigateOut: [{ type: i0.Output, args: ["navigateOut"] }], viewportRef: [{ type: i0.ViewChild, args: [i0.forwardRef(() => CdkVirtualScrollViewport), { isSignal: true }] }], listNavigation: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AXListNavigationDirective), { isSignal: true }] }], navItems: [{ type: i0.ViewChildren, args: [i0.forwardRef(() => AXListNavigationItemDirective), { isSignal: true }] }] } });
382
691
 
383
692
  /**
384
693
  * Internal mini component for the `drop-down-list` lookup mode:
@@ -387,8 +696,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
387
696
  * @category Components
388
697
  */
389
698
  class AXLookupDropDownListComponent extends AXLookupListViewBase {
390
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXLookupDropDownListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
391
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXLookupDropDownListComponent, isStandalone: true, selector: "ax-lookup-drop-down-list", providers: [{ provide: AXLookupListViewBase, useExisting: AXLookupDropDownListComponent }], usesInheritance: true, ngImport: i0, template: `
699
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXLookupDropDownListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
700
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: AXLookupDropDownListComponent, isStandalone: true, selector: "ax-lookup-drop-down-list", providers: [{ provide: AXLookupListViewBase, useExisting: AXLookupDropDownListComponent }], usesInheritance: true, ngImport: i0, template: `
392
701
  @if (isEmpty()) {
393
702
  @if (emptyTemplate()) {
394
703
  <ng-container [ngTemplateOutlet]="emptyTemplate()!" />
@@ -426,9 +735,14 @@ class AXLookupDropDownListComponent extends AXLookupListViewBase {
426
735
  >
427
736
  @if (item != null) {
428
737
  @if (itemTemplate()) {
429
- <ng-container [ngTemplateOutlet]="itemTemplate()!" [ngTemplateOutletContext]="{ $implicit: item }" />
738
+ <ng-container
739
+ [ngTemplateOutlet]="itemTemplate()!"
740
+ [ngTemplateOutletContext]="{ $implicit: item, highlightText: highlightText() }"
741
+ />
430
742
  } @else {
431
- <span class="ax-lookup-option-text">{{ getText(item) }}</span>
743
+ <span class="ax-lookup-option-text">
744
+ <ax-highlight-text [text]="getText(item) | translate | async" [query]="highlightText()" />
745
+ </span>
432
746
  @if (isSelected(item)) {
433
747
  <span class="ax-lookup-option-check ax-icon ax-icon-check" aria-hidden="true"></span>
434
748
  }
@@ -447,15 +761,15 @@ class AXLookupDropDownListComponent extends AXLookupListViewBase {
447
761
  <span class="ax-lookup-option-loading">{{ '@acorex:common.status.loading' | translate | async }}</span>
448
762
  }
449
763
  </ng-template>
450
- `, isInline: true, dependencies: [{ kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i1.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i1.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i1.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: AXListNavigationModule }, { kind: "directive", type: i2.AXListNavigationDirective, selector: "[axListNavigation]", inputs: ["orientation"], outputs: ["onNavigationChanged", "onKeypress"], exportAs: ["axListNavigation"] }, { kind: "directive", type: i2.AXListNavigationItemDirective, selector: "[axListNavigationItem]", outputs: ["onKeypress"], exportAs: ["axListNavigationItem"] }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
764
+ `, isInline: true, dependencies: [{ kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i1.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i1.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i1.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: AXListNavigationModule }, { kind: "directive", type: i2.AXListNavigationDirective, selector: "[axListNavigation]", inputs: ["orientation"], outputs: ["onNavigationChanged", "onKeypress"], exportAs: ["axListNavigation"] }, { kind: "directive", type: i2.AXListNavigationItemDirective, selector: "[axListNavigationItem]", outputs: ["onKeypress"], exportAs: ["axListNavigationItem"] }, { kind: "component", type: AXHighlightTextComponent, selector: "ax-highlight-text", inputs: ["text", "query", "highlightDisabled", "highlightOptions"] }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
451
765
  }
452
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXLookupDropDownListComponent, decorators: [{
766
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXLookupDropDownListComponent, decorators: [{
453
767
  type: Component,
454
768
  args: [{
455
769
  selector: 'ax-lookup-drop-down-list',
456
770
  changeDetection: ChangeDetectionStrategy.OnPush,
457
771
  encapsulation: ViewEncapsulation.None,
458
- imports: [ScrollingModule, NgTemplateOutlet, AXTranslatorPipe, AsyncPipe, AXListNavigationModule],
772
+ imports: [ScrollingModule, NgTemplateOutlet, AXTranslatorPipe, AsyncPipe, AXListNavigationModule, AXHighlightTextComponent],
459
773
  providers: [{ provide: AXLookupListViewBase, useExisting: AXLookupDropDownListComponent }],
460
774
  template: `
461
775
  @if (isEmpty()) {
@@ -495,9 +809,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
495
809
  >
496
810
  @if (item != null) {
497
811
  @if (itemTemplate()) {
498
- <ng-container [ngTemplateOutlet]="itemTemplate()!" [ngTemplateOutletContext]="{ $implicit: item }" />
812
+ <ng-container
813
+ [ngTemplateOutlet]="itemTemplate()!"
814
+ [ngTemplateOutletContext]="{ $implicit: item, highlightText: highlightText() }"
815
+ />
499
816
  } @else {
500
- <span class="ax-lookup-option-text">{{ getText(item) }}</span>
817
+ <span class="ax-lookup-option-text">
818
+ <ax-highlight-text [text]="getText(item) | translate | async" [query]="highlightText()" />
819
+ </span>
501
820
  @if (isSelected(item)) {
502
821
  <span class="ax-lookup-option-check ax-icon ax-icon-check" aria-hidden="true"></span>
503
822
  }
@@ -527,7 +846,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
527
846
  * @category Components
528
847
  */
529
848
  class AXLookupDropDownTreeComponent {
849
+ #host;
530
850
  constructor() {
851
+ this.#host = inject((ElementRef));
531
852
  /**
532
853
  * The tree datasource: an array of nodes or a lazy children callback.
533
854
  */
@@ -563,6 +884,16 @@ class AXLookupDropDownTreeComponent {
563
884
  */
564
885
  this.emptyTemplate = input(undefined, /* @ts-ignore */
565
886
  ...(ngDevMode ? [{ debugName: "emptyTemplate" }] : /* istanbul ignore next */ []));
887
+ /**
888
+ * Custom template rendered while the tree is hydrating for search.
889
+ */
890
+ this.loadingTemplate = input(undefined, /* @ts-ignore */
891
+ ...(ngDevMode ? [{ debugName: "loadingTemplate" }] : /* istanbul ignore next */ []));
892
+ /**
893
+ * When `true`, a loading placeholder is shown while lazy tree data is hydrated for search.
894
+ */
895
+ this.loading = input(false, /* @ts-ignore */
896
+ ...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
566
897
  /**
567
898
  * When `true`, visible tree nodes use alternating background colors.
568
899
  */
@@ -573,6 +904,11 @@ class AXLookupDropDownTreeComponent {
573
904
  */
574
905
  this.filterKey = input('0', /* @ts-ignore */
575
906
  ...(ngDevMode ? [{ debugName: "filterKey" }] : /* istanbul ignore next */ []));
907
+ /**
908
+ * When set, matching characters in the default node label are highlighted.
909
+ */
910
+ this.highlightText = input('', /* @ts-ignore */
911
+ ...(ngDevMode ? [{ debugName: "highlightText" }] : /* istanbul ignore next */ []));
576
912
  /**
577
913
  * Emitted when the user selects a node.
578
914
  */
@@ -586,6 +922,13 @@ class AXLookupDropDownTreeComponent {
586
922
  ...(ngDevMode ? [{ debugName: "isEmpty" }] : /* istanbul ignore next */ []));
587
923
  this.treeInstances = computed(() => [{ id: this.filterKey(), source: this.dataSource() }], /* @ts-ignore */
588
924
  ...(ngDevMode ? [{ debugName: "treeInstances" }] : /* istanbul ignore next */ []));
925
+ afterRenderEffect(() => {
926
+ const selectedId = this.selectedIds()[0];
927
+ if (!selectedId || this.isEmpty()) {
928
+ return;
929
+ }
930
+ scrollTreeToSelectedNode(this.#host.nativeElement, selectedId);
931
+ });
589
932
  }
590
933
  /** Whether the filtered tree currently has no nodes. */
591
934
  hasNoMatches() {
@@ -601,9 +944,17 @@ class AXLookupDropDownTreeComponent {
601
944
  }
602
945
  this.itemClick.emit({ item: node, value: node[this.valueField()] });
603
946
  }
604
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXLookupDropDownTreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
605
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXLookupDropDownTreeComponent, isStandalone: true, selector: "ax-lookup-drop-down-tree", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, 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 }, selectedValues: { classPropertyName: "selectedValues", publicName: "selectedValues", isSignal: true, isRequired: false, transformFunction: null }, nodeTemplate: { classPropertyName: "nodeTemplate", publicName: "nodeTemplate", isSignal: true, isRequired: false, transformFunction: null }, emptyTemplate: { classPropertyName: "emptyTemplate", publicName: "emptyTemplate", isSignal: true, isRequired: false, transformFunction: null }, alternate: { classPropertyName: "alternate", publicName: "alternate", isSignal: true, isRequired: false, transformFunction: null }, filterKey: { classPropertyName: "filterKey", publicName: "filterKey", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemClick: "itemClick" }, ngImport: i0, template: `
606
- @if (isEmpty()) {
947
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXLookupDropDownTreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
948
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: AXLookupDropDownTreeComponent, isStandalone: true, selector: "ax-lookup-drop-down-tree", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, 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 }, selectedValues: { classPropertyName: "selectedValues", publicName: "selectedValues", isSignal: true, isRequired: false, transformFunction: null }, nodeTemplate: { classPropertyName: "nodeTemplate", publicName: "nodeTemplate", 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 }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, alternate: { classPropertyName: "alternate", publicName: "alternate", isSignal: true, isRequired: false, transformFunction: null }, filterKey: { classPropertyName: "filterKey", publicName: "filterKey", isSignal: true, isRequired: false, transformFunction: null }, highlightText: { classPropertyName: "highlightText", publicName: "highlightText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemClick: "itemClick" }, ngImport: i0, template: `
949
+ @if (loading()) {
950
+ @if (loadingTemplate()) {
951
+ <ng-container [ngTemplateOutlet]="loadingTemplate()!" />
952
+ } @else {
953
+ <div class="ax-lookup-empty">
954
+ {{ '@acorex:common.status.loading' | translate | async }}
955
+ </div>
956
+ }
957
+ } @else if (isEmpty()) {
607
958
  @if (emptyTemplate()) {
608
959
  <ng-container [ngTemplateOutlet]="emptyTemplate()!" />
609
960
  } @else {
@@ -623,24 +974,39 @@ class AXLookupDropDownTreeComponent {
623
974
  [idField]="valueField()"
624
975
  [titleField]="textField()"
625
976
  [disabledField]="disabledField()"
626
- [nodeTemplate]="nodeTemplate()"
977
+ [nodeTemplate]="nodeTemplate() ?? defaultNodeTemplate"
627
978
  [alternate]="alternate()"
979
+ [highlightText]="highlightText()"
628
980
  (onSelectionChange)="handleSelectionChange($event)"
629
981
  />
630
982
  }
631
983
  </div>
632
984
  }
633
- `, 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", "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 }); }
985
+
986
+ <ng-template #defaultNodeTemplate let-node>
987
+ <span class="ax-lookup-tree-node-label">
988
+ <ax-highlight-text [text]="node?.[textField()] | translate | async" [query]="highlightText()" />
989
+ </span>
990
+ </ng-template>
991
+ `, 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: "component", type: AXHighlightTextComponent, selector: "ax-highlight-text", inputs: ["text", "query", "highlightDisabled", "highlightOptions"] }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
634
992
  }
635
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXLookupDropDownTreeComponent, decorators: [{
993
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXLookupDropDownTreeComponent, decorators: [{
636
994
  type: Component,
637
995
  args: [{
638
996
  selector: 'ax-lookup-drop-down-tree',
639
997
  changeDetection: ChangeDetectionStrategy.OnPush,
640
998
  encapsulation: ViewEncapsulation.None,
641
- imports: [AXTreeViewComponent, NgTemplateOutlet, AXTranslatorPipe, AsyncPipe],
999
+ imports: [AXTreeViewComponent, NgTemplateOutlet, AXTranslatorPipe, AsyncPipe, AXHighlightTextComponent],
642
1000
  template: `
643
- @if (isEmpty()) {
1001
+ @if (loading()) {
1002
+ @if (loadingTemplate()) {
1003
+ <ng-container [ngTemplateOutlet]="loadingTemplate()!" />
1004
+ } @else {
1005
+ <div class="ax-lookup-empty">
1006
+ {{ '@acorex:common.status.loading' | translate | async }}
1007
+ </div>
1008
+ }
1009
+ } @else if (isEmpty()) {
644
1010
  @if (emptyTemplate()) {
645
1011
  <ng-container [ngTemplateOutlet]="emptyTemplate()!" />
646
1012
  } @else {
@@ -660,16 +1026,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
660
1026
  [idField]="valueField()"
661
1027
  [titleField]="textField()"
662
1028
  [disabledField]="disabledField()"
663
- [nodeTemplate]="nodeTemplate()"
1029
+ [nodeTemplate]="nodeTemplate() ?? defaultNodeTemplate"
664
1030
  [alternate]="alternate()"
1031
+ [highlightText]="highlightText()"
665
1032
  (onSelectionChange)="handleSelectionChange($event)"
666
1033
  />
667
1034
  }
668
1035
  </div>
669
1036
  }
1037
+
1038
+ <ng-template #defaultNodeTemplate let-node>
1039
+ <span class="ax-lookup-tree-node-label">
1040
+ <ax-highlight-text [text]="node?.[textField()] | translate | async" [query]="highlightText()" />
1041
+ </span>
1042
+ </ng-template>
670
1043
  `,
671
1044
  }]
672
- }], 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 }] }], itemClick: [{ type: i0.Output, args: ["itemClick"] }] } });
1045
+ }], 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 }] }], loadingTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingTemplate", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", 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"] }] } });
673
1046
 
674
1047
  /**
675
1048
  * Internal mini component for the `multi-column-tree` lookup mode:
@@ -679,7 +1052,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
679
1052
  * @category Components
680
1053
  */
681
1054
  class AXLookupMultiColumnTreeComponent {
1055
+ #host;
682
1056
  constructor() {
1057
+ this.#host = inject((ElementRef));
683
1058
  /**
684
1059
  * The datasource providing hierarchical rows (roots on load, children via `parentField`).
685
1060
  */
@@ -752,6 +1127,11 @@ class AXLookupMultiColumnTreeComponent {
752
1127
  */
753
1128
  this.alternate = input(false, /* @ts-ignore */
754
1129
  ...(ngDevMode ? [{ debugName: "alternate" }] : /* istanbul ignore next */ []));
1130
+ /**
1131
+ * When set, matching text in table cells is highlighted.
1132
+ */
1133
+ this.highlightText = input('', /* @ts-ignore */
1134
+ ...(ngDevMode ? [{ debugName: "highlightText" }] : /* istanbul ignore next */ []));
755
1135
  /**
756
1136
  * Emitted when the user picks a row (not when expanding/collapsing).
757
1137
  */
@@ -781,6 +1161,12 @@ class AXLookupMultiColumnTreeComponent {
781
1161
  }
782
1162
  return classes.join(' ');
783
1163
  };
1164
+ afterRenderEffect(() => {
1165
+ if (this.selectedValues().length === 0) {
1166
+ return;
1167
+ }
1168
+ scrollTableToSelectedRow(this.#host.nativeElement);
1169
+ });
784
1170
  }
785
1171
  /** Stable unique key for `@for` — avoids NG0955 when `field` is missing or duplicated. */
786
1172
  trackColumnKey(index, column) {
@@ -827,8 +1213,8 @@ class AXLookupMultiColumnTreeComponent {
827
1213
  getValue(item) {
828
1214
  return item?.[this.valueField()];
829
1215
  }
830
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXLookupMultiColumnTreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
831
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXLookupMultiColumnTreeComponent, isStandalone: true, selector: "ax-lookup-multi-column-tree", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, 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 }, parentField: { classPropertyName: "parentField", publicName: "parentField", isSignal: true, isRequired: false, transformFunction: null }, hasChildrenField: { classPropertyName: "hasChildrenField", publicName: "hasChildrenField", isSignal: true, isRequired: false, transformFunction: null }, selectedValues: { classPropertyName: "selectedValues", publicName: "selectedValues", 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 }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, itemTemplate: { classPropertyName: "itemTemplate", publicName: "itemTemplate", 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 }, alternate: { classPropertyName: "alternate", publicName: "alternate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemClick: "itemClick" }, host: { properties: { "style.height.px": "tableHeight()" }, classAttribute: "ax-lookup-multi-column ax-lookup-multi-column-tree" }, ngImport: i0, template: `
1216
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXLookupMultiColumnTreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1217
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: AXLookupMultiColumnTreeComponent, isStandalone: true, selector: "ax-lookup-multi-column-tree", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, 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 }, parentField: { classPropertyName: "parentField", publicName: "parentField", isSignal: true, isRequired: false, transformFunction: null }, hasChildrenField: { classPropertyName: "hasChildrenField", publicName: "hasChildrenField", isSignal: true, isRequired: false, transformFunction: null }, selectedValues: { classPropertyName: "selectedValues", publicName: "selectedValues", 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 }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, itemTemplate: { classPropertyName: "itemTemplate", publicName: "itemTemplate", 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 }, alternate: { classPropertyName: "alternate", publicName: "alternate", isSignal: true, isRequired: false, transformFunction: null }, highlightText: { classPropertyName: "highlightText", publicName: "highlightText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemClick: "itemClick" }, host: { properties: { "style.height.px": "tableHeight()" }, classAttribute: "ax-lookup-multi-column ax-lookup-multi-column-tree" }, ngImport: i0, template: `
832
1218
  <ax-data-table
833
1219
  class="ax-lookup-multi-column-table"
834
1220
  look="minimal"
@@ -838,6 +1224,7 @@ class AXLookupMultiColumnTreeComponent {
838
1224
  [itemHeight]="itemHeight()"
839
1225
  [alternative]="alternate()"
840
1226
  [emptyTemplate]="emptyTemplate()"
1227
+ [highlightText]="highlightText()"
841
1228
  [loading]="loadingConfig()"
842
1229
  [paging]="false"
843
1230
  [showHeader]="true"
@@ -851,7 +1238,8 @@ class AXLookupMultiColumnTreeComponent {
851
1238
  @for (column of columns(); track trackColumnKey($index, column)) {
852
1239
  <ax-text-column
853
1240
  [dataField]="column.field"
854
- [caption]="column.title"
1241
+ [caption]="column.title | translate | async"
1242
+ [translate]="true"
855
1243
  [width]="resolveColumnWidth(column)"
856
1244
  [expandHandler]="isExpandColumn($index, column)"
857
1245
  [allowSorting]="false"
@@ -872,21 +1260,21 @@ class AXLookupMultiColumnTreeComponent {
872
1260
  @if (ctx.data != null && itemTemplate()) {
873
1261
  <ng-container
874
1262
  [ngTemplateOutlet]="itemTemplate()!"
875
- [ngTemplateOutletContext]="{ $implicit: ctx.data }"
1263
+ [ngTemplateOutletContext]="{ $implicit: ctx.data, highlightText: highlightText() }"
876
1264
  />
877
1265
  }
878
1266
  </td>
879
1267
  </tr>
880
1268
  </ng-template>
881
- `, 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 }); }
1269
+ `, 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 }); }
882
1270
  }
883
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXLookupMultiColumnTreeComponent, decorators: [{
1271
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXLookupMultiColumnTreeComponent, decorators: [{
884
1272
  type: Component,
885
1273
  args: [{
886
1274
  selector: 'ax-lookup-multi-column-tree',
887
1275
  changeDetection: ChangeDetectionStrategy.OnPush,
888
1276
  encapsulation: ViewEncapsulation.None,
889
- imports: [NgTemplateOutlet, AXDataTableComponent, AXDataTableTextColumnComponent],
1277
+ imports: [NgTemplateOutlet, AsyncPipe, AXTranslatorPipe, AXDataTableComponent, AXDataTableTextColumnComponent],
890
1278
  host: {
891
1279
  class: 'ax-lookup-multi-column ax-lookup-multi-column-tree',
892
1280
  '[style.height.px]': 'tableHeight()',
@@ -901,6 +1289,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
901
1289
  [itemHeight]="itemHeight()"
902
1290
  [alternative]="alternate()"
903
1291
  [emptyTemplate]="emptyTemplate()"
1292
+ [highlightText]="highlightText()"
904
1293
  [loading]="loadingConfig()"
905
1294
  [paging]="false"
906
1295
  [showHeader]="true"
@@ -914,7 +1303,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
914
1303
  @for (column of columns(); track trackColumnKey($index, column)) {
915
1304
  <ax-text-column
916
1305
  [dataField]="column.field"
917
- [caption]="column.title"
1306
+ [caption]="column.title | translate | async"
1307
+ [translate]="true"
918
1308
  [width]="resolveColumnWidth(column)"
919
1309
  [expandHandler]="isExpandColumn($index, column)"
920
1310
  [allowSorting]="false"
@@ -935,7 +1325,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
935
1325
  @if (ctx.data != null && itemTemplate()) {
936
1326
  <ng-container
937
1327
  [ngTemplateOutlet]="itemTemplate()!"
938
- [ngTemplateOutletContext]="{ $implicit: ctx.data }"
1328
+ [ngTemplateOutletContext]="{ $implicit: ctx.data, highlightText: highlightText() }"
939
1329
  />
940
1330
  }
941
1331
  </td>
@@ -943,7 +1333,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
943
1333
  </ng-template>
944
1334
  `,
945
1335
  }]
946
- }], 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 }] }], itemClick: [{ type: i0.Output, args: ["itemClick"] }] } });
1336
+ }], 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"] }] } });
947
1337
 
948
1338
  /**
949
1339
  * Internal mini component for the `multi-column` lookup mode:
@@ -1021,6 +1411,11 @@ class AXLookupMultiColumnComponent {
1021
1411
  */
1022
1412
  this.alternate = input(false, /* @ts-ignore */
1023
1413
  ...(ngDevMode ? [{ debugName: "alternate" }] : /* istanbul ignore next */ []));
1414
+ /**
1415
+ * When set, matching text in table cells is highlighted.
1416
+ */
1417
+ this.highlightText = input('', /* @ts-ignore */
1418
+ ...(ngDevMode ? [{ debugName: "highlightText" }] : /* istanbul ignore next */ []));
1024
1419
  /**
1025
1420
  * Emitted when the user picks a row.
1026
1421
  */
@@ -1078,6 +1473,12 @@ class AXLookupMultiColumnComponent {
1078
1473
  }
1079
1474
  return classes.join(' ');
1080
1475
  };
1476
+ afterRenderEffect(() => {
1477
+ if (this.selectedValues().length === 0 || this.#totalCount() === 0) {
1478
+ return;
1479
+ }
1480
+ scrollTableToSelectedRow(this.#host.nativeElement);
1481
+ });
1081
1482
  effect((onCleanup) => {
1082
1483
  const source = this.dataSource();
1083
1484
  this.tableDataSource.config.key = source.config.key || this.valueField();
@@ -1177,8 +1578,8 @@ class AXLookupMultiColumnComponent {
1177
1578
  getValue(item) {
1178
1579
  return item?.[this.valueField()];
1179
1580
  }
1180
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXLookupMultiColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1181
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXLookupMultiColumnComponent, isStandalone: true, selector: "ax-lookup-multi-column", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, 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 }, selectedValues: { classPropertyName: "selectedValues", publicName: "selectedValues", 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 }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, itemTemplate: { classPropertyName: "itemTemplate", publicName: "itemTemplate", 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 }, alternate: { classPropertyName: "alternate", publicName: "alternate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemClick: "itemClick" }, host: { properties: { "style.height.px": "tableHeight()" }, classAttribute: "ax-lookup-multi-column" }, viewQueries: [{ propertyName: "tableRef", first: true, predicate: AXDataTableComponent, descendants: true, isSignal: true }], ngImport: i0, template: `
1581
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXLookupMultiColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1582
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: AXLookupMultiColumnComponent, isStandalone: true, selector: "ax-lookup-multi-column", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, 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 }, selectedValues: { classPropertyName: "selectedValues", publicName: "selectedValues", 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 }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, itemTemplate: { classPropertyName: "itemTemplate", publicName: "itemTemplate", 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 }, alternate: { classPropertyName: "alternate", publicName: "alternate", isSignal: true, isRequired: false, transformFunction: null }, highlightText: { classPropertyName: "highlightText", publicName: "highlightText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemClick: "itemClick" }, host: { properties: { "style.height.px": "tableHeight()" }, classAttribute: "ax-lookup-multi-column" }, viewQueries: [{ propertyName: "tableRef", first: true, predicate: AXDataTableComponent, descendants: true, isSignal: true }], ngImport: i0, template: `
1182
1583
  <ax-data-table
1183
1584
  class="ax-lookup-multi-column-table"
1184
1585
  look="minimal"
@@ -1186,6 +1587,7 @@ class AXLookupMultiColumnComponent {
1186
1587
  [itemHeight]="itemHeight()"
1187
1588
  [alternative]="alternate()"
1188
1589
  [emptyTemplate]="emptyTemplate()"
1590
+ [highlightText]="highlightText()"
1189
1591
  [loading]="loadingConfig()"
1190
1592
  [paging]="false"
1191
1593
  [showHeader]="true"
@@ -1199,7 +1601,8 @@ class AXLookupMultiColumnComponent {
1199
1601
  @for (column of columns(); track trackColumnKey($index, column)) {
1200
1602
  <ax-text-column
1201
1603
  [dataField]="column.field"
1202
- [caption]="column.title"
1604
+ [caption]="column.title | translate | async"
1605
+ [translate]="true"
1203
1606
  [width]="resolveColumnWidth(column)"
1204
1607
  [allowSorting]="false"
1205
1608
  [allowResizing]="false"
@@ -1219,21 +1622,21 @@ class AXLookupMultiColumnComponent {
1219
1622
  @if (ctx.data != null && itemTemplate()) {
1220
1623
  <ng-container
1221
1624
  [ngTemplateOutlet]="itemTemplate()!"
1222
- [ngTemplateOutletContext]="{ $implicit: ctx.data }"
1625
+ [ngTemplateOutletContext]="{ $implicit: ctx.data, highlightText: highlightText() }"
1223
1626
  />
1224
1627
  }
1225
1628
  </td>
1226
1629
  </tr>
1227
1630
  </ng-template>
1228
- `, 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 }); }
1631
+ `, 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 }); }
1229
1632
  }
1230
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXLookupMultiColumnComponent, decorators: [{
1633
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXLookupMultiColumnComponent, decorators: [{
1231
1634
  type: Component,
1232
1635
  args: [{
1233
1636
  selector: 'ax-lookup-multi-column',
1234
1637
  changeDetection: ChangeDetectionStrategy.OnPush,
1235
1638
  encapsulation: ViewEncapsulation.None,
1236
- imports: [NgTemplateOutlet, AXDataTableComponent, AXDataTableTextColumnComponent],
1639
+ imports: [NgTemplateOutlet, AsyncPipe, AXTranslatorPipe, AXDataTableComponent, AXDataTableTextColumnComponent],
1237
1640
  host: {
1238
1641
  class: 'ax-lookup-multi-column',
1239
1642
  '[style.height.px]': 'tableHeight()',
@@ -1246,6 +1649,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
1246
1649
  [itemHeight]="itemHeight()"
1247
1650
  [alternative]="alternate()"
1248
1651
  [emptyTemplate]="emptyTemplate()"
1652
+ [highlightText]="highlightText()"
1249
1653
  [loading]="loadingConfig()"
1250
1654
  [paging]="false"
1251
1655
  [showHeader]="true"
@@ -1259,7 +1663,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
1259
1663
  @for (column of columns(); track trackColumnKey($index, column)) {
1260
1664
  <ax-text-column
1261
1665
  [dataField]="column.field"
1262
- [caption]="column.title"
1666
+ [caption]="column.title | translate | async"
1667
+ [translate]="true"
1263
1668
  [width]="resolveColumnWidth(column)"
1264
1669
  [allowSorting]="false"
1265
1670
  [allowResizing]="false"
@@ -1279,7 +1684,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
1279
1684
  @if (ctx.data != null && itemTemplate()) {
1280
1685
  <ng-container
1281
1686
  [ngTemplateOutlet]="itemTemplate()!"
1282
- [ngTemplateOutletContext]="{ $implicit: ctx.data }"
1687
+ [ngTemplateOutletContext]="{ $implicit: ctx.data, highlightText: highlightText() }"
1283
1688
  />
1284
1689
  }
1285
1690
  </td>
@@ -1287,7 +1692,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
1287
1692
  </ng-template>
1288
1693
  `,
1289
1694
  }]
1290
- }], 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 }] }], 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 }] }], itemClick: [{ type: i0.Output, args: ["itemClick"] }], tableRef: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AXDataTableComponent), { isSignal: true }] }] } });
1695
+ }], 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 }] }], 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"] }], tableRef: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AXDataTableComponent), { isSignal: true }] }] } });
1291
1696
 
1292
1697
  /**
1293
1698
  * Internal mini component for the `multi-select-tree` lookup mode:
@@ -1296,7 +1701,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
1296
1701
  * @category Components
1297
1702
  */
1298
1703
  class AXLookupMultiSelectTreeComponent {
1704
+ #host;
1299
1705
  constructor() {
1706
+ this.#host = inject((ElementRef));
1300
1707
  /**
1301
1708
  * The tree datasource: an array of nodes or a lazy children callback.
1302
1709
  */
@@ -1337,6 +1744,16 @@ class AXLookupMultiSelectTreeComponent {
1337
1744
  */
1338
1745
  this.emptyTemplate = input(undefined, /* @ts-ignore */
1339
1746
  ...(ngDevMode ? [{ debugName: "emptyTemplate" }] : /* istanbul ignore next */ []));
1747
+ /**
1748
+ * Custom template rendered while the tree is hydrating for search.
1749
+ */
1750
+ this.loadingTemplate = input(undefined, /* @ts-ignore */
1751
+ ...(ngDevMode ? [{ debugName: "loadingTemplate" }] : /* istanbul ignore next */ []));
1752
+ /**
1753
+ * When `true`, a loading placeholder is shown while lazy tree data is hydrated for search.
1754
+ */
1755
+ this.loading = input(false, /* @ts-ignore */
1756
+ ...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
1340
1757
  /**
1341
1758
  * When `true`, visible tree nodes use alternating background colors.
1342
1759
  */
@@ -1347,6 +1764,11 @@ class AXLookupMultiSelectTreeComponent {
1347
1764
  */
1348
1765
  this.filterKey = input('0', /* @ts-ignore */
1349
1766
  ...(ngDevMode ? [{ debugName: "filterKey" }] : /* istanbul ignore next */ []));
1767
+ /**
1768
+ * When set, matching characters in the default node label are highlighted.
1769
+ */
1770
+ this.highlightText = input('', /* @ts-ignore */
1771
+ ...(ngDevMode ? [{ debugName: "highlightText" }] : /* istanbul ignore next */ []));
1350
1772
  /**
1351
1773
  * Emitted when the user changes the tree selection.
1352
1774
  */
@@ -1360,6 +1782,13 @@ class AXLookupMultiSelectTreeComponent {
1360
1782
  ...(ngDevMode ? [{ debugName: "isEmpty" }] : /* istanbul ignore next */ []));
1361
1783
  this.treeInstances = computed(() => [{ id: this.filterKey(), source: this.dataSource() }], /* @ts-ignore */
1362
1784
  ...(ngDevMode ? [{ debugName: "treeInstances" }] : /* istanbul ignore next */ []));
1785
+ afterRenderEffect(() => {
1786
+ const selectedId = this.selectedIds()[0];
1787
+ if (!selectedId || this.isEmpty()) {
1788
+ return;
1789
+ }
1790
+ scrollTreeToSelectedNode(this.#host.nativeElement, selectedId);
1791
+ });
1363
1792
  }
1364
1793
  /** Whether the filtered tree currently has no nodes. */
1365
1794
  hasNoMatches() {
@@ -1371,9 +1800,17 @@ class AXLookupMultiSelectTreeComponent {
1371
1800
  }
1372
1801
  this.selectionChange.emit({ ids: e.selectedIds, nodes: e.selectedNodes });
1373
1802
  }
1374
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXLookupMultiSelectTreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1375
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXLookupMultiSelectTreeComponent, isStandalone: true, selector: "ax-lookup-multi-select-tree", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, 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 }, selectedValues: { classPropertyName: "selectedValues", publicName: "selectedValues", isSignal: true, isRequired: false, transformFunction: null }, selectionBehavior: { classPropertyName: "selectionBehavior", publicName: "selectionBehavior", isSignal: true, isRequired: false, transformFunction: null }, nodeTemplate: { classPropertyName: "nodeTemplate", publicName: "nodeTemplate", isSignal: true, isRequired: false, transformFunction: null }, emptyTemplate: { classPropertyName: "emptyTemplate", publicName: "emptyTemplate", isSignal: true, isRequired: false, transformFunction: null }, alternate: { classPropertyName: "alternate", publicName: "alternate", isSignal: true, isRequired: false, transformFunction: null }, filterKey: { classPropertyName: "filterKey", publicName: "filterKey", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectionChange: "selectionChange" }, ngImport: i0, template: `
1376
- @if (isEmpty()) {
1803
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXLookupMultiSelectTreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1804
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: AXLookupMultiSelectTreeComponent, isStandalone: true, selector: "ax-lookup-multi-select-tree", inputs: { dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: true, 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 }, selectedValues: { classPropertyName: "selectedValues", publicName: "selectedValues", isSignal: true, isRequired: false, transformFunction: null }, selectionBehavior: { classPropertyName: "selectionBehavior", publicName: "selectionBehavior", isSignal: true, isRequired: false, transformFunction: null }, nodeTemplate: { classPropertyName: "nodeTemplate", publicName: "nodeTemplate", 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 }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, alternate: { classPropertyName: "alternate", publicName: "alternate", isSignal: true, isRequired: false, transformFunction: null }, filterKey: { classPropertyName: "filterKey", publicName: "filterKey", isSignal: true, isRequired: false, transformFunction: null }, highlightText: { classPropertyName: "highlightText", publicName: "highlightText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectionChange: "selectionChange" }, ngImport: i0, template: `
1805
+ @if (loading()) {
1806
+ @if (loadingTemplate()) {
1807
+ <ng-container [ngTemplateOutlet]="loadingTemplate()!" />
1808
+ } @else {
1809
+ <div class="ax-lookup-empty">
1810
+ {{ '@acorex:common.status.loading' | translate | async }}
1811
+ </div>
1812
+ }
1813
+ } @else if (isEmpty()) {
1377
1814
  @if (emptyTemplate()) {
1378
1815
  <ng-container [ngTemplateOutlet]="emptyTemplate()!" />
1379
1816
  } @else {
@@ -1393,24 +1830,39 @@ class AXLookupMultiSelectTreeComponent {
1393
1830
  [idField]="valueField()"
1394
1831
  [titleField]="textField()"
1395
1832
  [disabledField]="disabledField()"
1396
- [nodeTemplate]="nodeTemplate()"
1833
+ [nodeTemplate]="nodeTemplate() ?? defaultNodeTemplate"
1397
1834
  [alternate]="alternate()"
1835
+ [highlightText]="highlightText()"
1398
1836
  (onSelectionChange)="handleSelectionChange($event)"
1399
1837
  />
1400
1838
  }
1401
1839
  </div>
1402
1840
  }
1403
- `, 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", "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 }); }
1841
+
1842
+ <ng-template #defaultNodeTemplate let-node>
1843
+ <span class="ax-lookup-tree-node-label">
1844
+ <ax-highlight-text [text]="node?.[textField()] | translate | async" [query]="highlightText()" />
1845
+ </span>
1846
+ </ng-template>
1847
+ `, 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: "component", type: AXHighlightTextComponent, selector: "ax-highlight-text", inputs: ["text", "query", "highlightDisabled", "highlightOptions"] }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
1404
1848
  }
1405
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXLookupMultiSelectTreeComponent, decorators: [{
1849
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXLookupMultiSelectTreeComponent, decorators: [{
1406
1850
  type: Component,
1407
1851
  args: [{
1408
1852
  selector: 'ax-lookup-multi-select-tree',
1409
1853
  changeDetection: ChangeDetectionStrategy.OnPush,
1410
1854
  encapsulation: ViewEncapsulation.None,
1411
- imports: [AXTreeViewComponent, NgTemplateOutlet, AXTranslatorPipe, AsyncPipe],
1855
+ imports: [AXTreeViewComponent, NgTemplateOutlet, AXTranslatorPipe, AsyncPipe, AXHighlightTextComponent],
1412
1856
  template: `
1413
- @if (isEmpty()) {
1857
+ @if (loading()) {
1858
+ @if (loadingTemplate()) {
1859
+ <ng-container [ngTemplateOutlet]="loadingTemplate()!" />
1860
+ } @else {
1861
+ <div class="ax-lookup-empty">
1862
+ {{ '@acorex:common.status.loading' | translate | async }}
1863
+ </div>
1864
+ }
1865
+ } @else if (isEmpty()) {
1414
1866
  @if (emptyTemplate()) {
1415
1867
  <ng-container [ngTemplateOutlet]="emptyTemplate()!" />
1416
1868
  } @else {
@@ -1430,16 +1882,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
1430
1882
  [idField]="valueField()"
1431
1883
  [titleField]="textField()"
1432
1884
  [disabledField]="disabledField()"
1433
- [nodeTemplate]="nodeTemplate()"
1885
+ [nodeTemplate]="nodeTemplate() ?? defaultNodeTemplate"
1434
1886
  [alternate]="alternate()"
1887
+ [highlightText]="highlightText()"
1435
1888
  (onSelectionChange)="handleSelectionChange($event)"
1436
1889
  />
1437
1890
  }
1438
1891
  </div>
1439
1892
  }
1893
+
1894
+ <ng-template #defaultNodeTemplate let-node>
1895
+ <span class="ax-lookup-tree-node-label">
1896
+ <ax-highlight-text [text]="node?.[textField()] | translate | async" [query]="highlightText()" />
1897
+ </span>
1898
+ </ng-template>
1440
1899
  `,
1441
1900
  }]
1442
- }], 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 }] }], selectionChange: [{ type: i0.Output, args: ["selectionChange"] }] } });
1901
+ }], 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 }] }], loadingTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingTemplate", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", 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"] }] } });
1443
1902
 
1444
1903
  /**
1445
1904
  * Internal mini component for the `multi-select` lookup mode:
@@ -1448,8 +1907,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
1448
1907
  * @category Components
1449
1908
  */
1450
1909
  class AXLookupMultiSelectComponent extends AXLookupListViewBase {
1451
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXLookupMultiSelectComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
1452
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXLookupMultiSelectComponent, isStandalone: true, selector: "ax-lookup-multi-select", providers: [{ provide: AXLookupListViewBase, useExisting: AXLookupMultiSelectComponent }], usesInheritance: true, ngImport: i0, template: `
1910
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXLookupMultiSelectComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
1911
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", type: AXLookupMultiSelectComponent, isStandalone: true, selector: "ax-lookup-multi-select", providers: [{ provide: AXLookupListViewBase, useExisting: AXLookupMultiSelectComponent }], usesInheritance: true, ngImport: i0, template: `
1453
1912
  @if (isEmpty()) {
1454
1913
  @if (emptyTemplate()) {
1455
1914
  <ng-container [ngTemplateOutlet]="emptyTemplate()!" />
@@ -1494,9 +1953,14 @@ class AXLookupMultiSelectComponent extends AXLookupListViewBase {
1494
1953
  [disabled]="isDisabled(item)"
1495
1954
  ></ax-check-box>
1496
1955
  @if (itemTemplate()) {
1497
- <ng-container [ngTemplateOutlet]="itemTemplate()!" [ngTemplateOutletContext]="{ $implicit: item }" />
1956
+ <ng-container
1957
+ [ngTemplateOutlet]="itemTemplate()!"
1958
+ [ngTemplateOutletContext]="{ $implicit: item, highlightText: highlightText() }"
1959
+ />
1498
1960
  } @else {
1499
- <span class="ax-lookup-option-text">{{ getText(item) }}</span>
1961
+ <span class="ax-lookup-option-text">
1962
+ <ax-highlight-text [text]="getText(item) | translate | async" [query]="highlightText()" />
1963
+ </span>
1500
1964
  }
1501
1965
  } @else {
1502
1966
  <ng-container [ngTemplateOutlet]="loadingRow" />
@@ -1512,15 +1976,15 @@ class AXLookupMultiSelectComponent extends AXLookupListViewBase {
1512
1976
  <span class="ax-lookup-option-loading">{{ '@acorex:common.status.loading' | translate | async }}</span>
1513
1977
  }
1514
1978
  </ng-template>
1515
- `, isInline: true, dependencies: [{ kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i1.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i1.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i1.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: AXListNavigationModule }, { kind: "directive", type: i2.AXListNavigationDirective, selector: "[axListNavigation]", inputs: ["orientation"], outputs: ["onNavigationChanged", "onKeypress"], exportAs: ["axListNavigation"] }, { kind: "directive", type: i2.AXListNavigationItemDirective, selector: "[axListNavigationItem]", outputs: ["onKeypress"], exportAs: ["axListNavigationItem"] }, { kind: "component", type: AXCheckBoxComponent, selector: "ax-check-box", inputs: ["disabled", "tabIndex", "readonly", "color", "value", "name", "id", "isLoading", "indeterminate"], outputs: ["onBlur", "onFocus", "valueChange", "onValueChanged"] }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
1979
+ `, isInline: true, dependencies: [{ kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i1.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i1.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i1.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: AXListNavigationModule }, { kind: "directive", type: i2.AXListNavigationDirective, selector: "[axListNavigation]", inputs: ["orientation"], outputs: ["onNavigationChanged", "onKeypress"], exportAs: ["axListNavigation"] }, { kind: "directive", type: i2.AXListNavigationItemDirective, selector: "[axListNavigationItem]", outputs: ["onKeypress"], exportAs: ["axListNavigationItem"] }, { kind: "component", type: AXCheckBoxComponent, selector: "ax-check-box", inputs: ["disabled", "tabIndex", "readonly", "color", "value", "name", "id", "isLoading", "indeterminate"], outputs: ["onBlur", "onFocus", "valueChange", "onValueChanged"] }, { kind: "component", type: AXHighlightTextComponent, selector: "ax-highlight-text", inputs: ["text", "query", "highlightDisabled", "highlightOptions"] }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
1516
1980
  }
1517
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXLookupMultiSelectComponent, decorators: [{
1981
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXLookupMultiSelectComponent, decorators: [{
1518
1982
  type: Component,
1519
1983
  args: [{
1520
1984
  selector: 'ax-lookup-multi-select',
1521
1985
  changeDetection: ChangeDetectionStrategy.OnPush,
1522
1986
  encapsulation: ViewEncapsulation.None,
1523
- imports: [ScrollingModule, NgTemplateOutlet, AXTranslatorPipe, AsyncPipe, AXListNavigationModule, AXCheckBoxComponent],
1987
+ imports: [ScrollingModule, NgTemplateOutlet, AXTranslatorPipe, AsyncPipe, AXListNavigationModule, AXCheckBoxComponent, AXHighlightTextComponent],
1524
1988
  providers: [{ provide: AXLookupListViewBase, useExisting: AXLookupMultiSelectComponent }],
1525
1989
  template: `
1526
1990
  @if (isEmpty()) {
@@ -1567,9 +2031,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
1567
2031
  [disabled]="isDisabled(item)"
1568
2032
  ></ax-check-box>
1569
2033
  @if (itemTemplate()) {
1570
- <ng-container [ngTemplateOutlet]="itemTemplate()!" [ngTemplateOutletContext]="{ $implicit: item }" />
2034
+ <ng-container
2035
+ [ngTemplateOutlet]="itemTemplate()!"
2036
+ [ngTemplateOutletContext]="{ $implicit: item, highlightText: highlightText() }"
2037
+ />
1571
2038
  } @else {
1572
- <span class="ax-lookup-option-text">{{ getText(item) }}</span>
2039
+ <span class="ax-lookup-option-text">
2040
+ <ax-highlight-text [text]="getText(item) | translate | async" [query]="highlightText()" />
2041
+ </span>
1573
2042
  }
1574
2043
  } @else {
1575
2044
  <ng-container [ngTemplateOutlet]="loadingRow" />
@@ -1595,6 +2064,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
1595
2064
  * Modes (each rendered by its own internal mini component):
1596
2065
  * - `drop-down-list` — a predefined list of options for picking single values.
1597
2066
  * - `multi-select` — a predefined list of options for multiple item selection (chips in the trigger).
2067
+ * In multi modes, Backspace with an empty trigger input removes the last chip; repeated presses clear
2068
+ * the whole selection.
1598
2069
  * - `drop-down-tree` — a tree-like structure for single item selection; when searchable, the trigger
1599
2070
  * input filters nested nodes as you type (on small screens the search field is inside the actionsheet).
1600
2071
  * - `multi-select-tree` — a tree-like structure for multiple item selection; searchable the same way.
@@ -1614,17 +2085,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
1614
2085
  class AXLookupComponent extends NXValueComponent {
1615
2086
  #platform;
1616
2087
  #destroyRef;
2088
+ #translation;
1617
2089
  /** Whether search filters the tree datasource instead of `AXDataSource`. */
1618
2090
  #isTreeOnlySearchMode() {
1619
2091
  const mode = this.mode();
1620
2092
  return mode === 'drop-down-tree' || mode === 'multi-select-tree';
1621
2093
  }
1622
- /**
1623
- * Applied tree search query. Set only from `#applyFilterNow` so opening a single-select
2094
+ /** Applied tree search query. Set only from `#applyFilterNow` so opening a single-select
1624
2095
  * with the selected label in the trigger does not filter the tree.
1625
2096
  */
1626
2097
  #treeFilterQuery;
1627
2098
  #treeFilterEpoch;
2099
+ #hydratedTreeNodes;
2100
+ #hydrationPromise;
2101
+ #hydrationRevision;
2102
+ /** Applied (debounced) search query used for result highlighting. */
2103
+ #appliedSearchQuery;
1628
2104
  /** Reused so closing/reopening the popup does not create a new AXDataSource (which would miss cache). */
1629
2105
  #multiColumnTreeTableSource;
1630
2106
  #multiColumnTreeTableKey;
@@ -1634,6 +2110,8 @@ class AXLookupComponent extends NXValueComponent {
1634
2110
  * drop-down-tree / multi-select-tree do not refetch on every open.
1635
2111
  */
1636
2112
  #treeChildrenCache;
2113
+ /** Stable lazy loader for on-demand expansion when no search query is active. */
2114
+ #lazyTreeLoader;
1637
2115
  #document;
1638
2116
  #itemsCache;
1639
2117
  #isUserInteraction;
@@ -1649,6 +2127,7 @@ class AXLookupComponent extends NXValueComponent {
1649
2127
  super();
1650
2128
  this.#platform = inject(AXPlatform);
1651
2129
  this.#destroyRef = inject(DestroyRef);
2130
+ this.#translation = inject(AXTranslationService);
1652
2131
  /**
1653
2132
  * The name of the form field, used by validation rules and `ax-form.validate(names)`.
1654
2133
  */
@@ -1711,6 +2190,7 @@ class AXLookupComponent extends NXValueComponent {
1711
2190
  * Whether the trigger accepts typing and filters the datasource (`true`),
1712
2191
  * or is select-only with no writable input (`false`).
1713
2192
  * Applies to all modes, including `drop-down-tree` and `multi-select-tree`.
2193
+ * Lazy callback trees are hydrated once per popup open and searched in full.
1714
2194
  * On small screens with `adaptivityEnabled`, search is typed in the actionsheet instead of the trigger.
1715
2195
  */
1716
2196
  this.searchable = input(true, /* @ts-ignore */
@@ -1724,6 +2204,7 @@ class AXLookupComponent extends NXValueComponent {
1724
2204
  ...(ngDevMode ? [{ debugName: "adaptivityEnabled" }] : /* istanbul ignore next */ []));
1725
2205
  /**
1726
2206
  * Title shown in the actionsheet header on small screens. Falls back to `placeholder`.
2207
+ * Supports i18n expressions (e.g. `@acorex:selectbox.popover.title`).
1727
2208
  */
1728
2209
  this.caption = input('', /* @ts-ignore */
1729
2210
  ...(ngDevMode ? [{ debugName: "caption" }] : /* istanbul ignore next */ []));
@@ -1737,14 +2218,20 @@ class AXLookupComponent extends NXValueComponent {
1737
2218
  * Placeholder for the trigger search input when items are already selected
1738
2219
  * (mainly useful in `multi-select` / `multi-select-tree`), and for the in-sheet search field on small screens.
1739
2220
  * Falls back to `placeholder` when the selection is empty on desktop.
2221
+ * Supports i18n expressions (e.g. `@acorex:common.actions.search`).
1740
2222
  */
1741
- this.searchPlaceholder = input('Search...', /* @ts-ignore */
2223
+ this.searchPlaceholder = input('@acorex:common.actions.search', /* @ts-ignore */
1742
2224
  ...(ngDevMode ? [{ debugName: "searchPlaceholder" }] : /* istanbul ignore next */ []));
1743
2225
  /**
1744
2226
  * The placeholder text shown when no value is selected.
2227
+ * Supports i18n expressions (e.g. `@acorex:chat.placeholders.select-conversation`).
1745
2228
  */
1746
2229
  this.placeholder = input('', /* @ts-ignore */
1747
2230
  ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
2231
+ /** Resolved `placeholder` (i18n-aware). */
2232
+ this.translatedPlaceholder = toTranslatedSignal(this.placeholder);
2233
+ /** Resolved `searchPlaceholder` (i18n-aware). */
2234
+ this.translatedSearchPlaceholder = toTranslatedSignal(this.searchPlaceholder);
1748
2235
  /**
1749
2236
  * Whether the lookup is disabled.
1750
2237
  */
@@ -1776,7 +2263,13 @@ class AXLookupComponent extends NXValueComponent {
1776
2263
  this.treeSelectionBehavior = input('all', /* @ts-ignore */
1777
2264
  ...(ngDevMode ? [{ debugName: "treeSelectionBehavior" }] : /* istanbul ignore next */ []));
1778
2265
  /**
1779
- * Custom template rendered for each item/node. Context: `$implicit` is the item.
2266
+ * When `true` (default), matching characters in popup result items are highlighted
2267
+ * while the user searches.
2268
+ */
2269
+ this.highlightSearch = input(true, { ...(ngDevMode ? { debugName: "highlightSearch" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
2270
+ /**
2271
+ * Custom template rendered for each item/node. Context: `$implicit` is the item;
2272
+ * `highlightText` is the active search query when result highlighting is enabled.
1780
2273
  * Default option chrome (padding, typography, check icon) is not applied; only the
1781
2274
  * template's styles are used. Selection and hover backgrounds remain on the row.
1782
2275
  */
@@ -1880,17 +2373,27 @@ class AXLookupComponent extends NXValueComponent {
1880
2373
  /** Query typed in the actionsheet search field (independent of the trigger display text). */
1881
2374
  this.sheetSearchText = signal('', /* @ts-ignore */
1882
2375
  ...(ngDevMode ? [{ debugName: "sheetSearchText" }] : /* istanbul ignore next */ []));
1883
- /**
1884
- * Applied tree search query. Set only from `#applyFilterNow` so opening a single-select
2376
+ /** Applied tree search query. Set only from `#applyFilterNow` so opening a single-select
1885
2377
  * with the selected label in the trigger does not filter the tree.
1886
2378
  */
1887
2379
  this.#treeFilterQuery = signal('', /* @ts-ignore */
1888
2380
  ...(ngDevMode ? [{ debugName: "#treeFilterQuery" }] : /* istanbul ignore next */ []));
1889
2381
  this.#treeFilterEpoch = signal(0, /* @ts-ignore */
1890
2382
  ...(ngDevMode ? [{ debugName: "#treeFilterEpoch" }] : /* istanbul ignore next */ []));
2383
+ this.#hydratedTreeNodes = signal(undefined, /* @ts-ignore */
2384
+ ...(ngDevMode ? [{ debugName: "#hydratedTreeNodes" }] : /* istanbul ignore next */ []));
2385
+ this.#hydrationRevision = 0;
2386
+ this.treeSearchLoading = signal(false, /* @ts-ignore */
2387
+ ...(ngDevMode ? [{ debugName: "treeSearchLoading" }] : /* istanbul ignore next */ []));
2388
+ /** Applied (debounced) search query used for result highlighting. */
2389
+ this.#appliedSearchQuery = signal('', /* @ts-ignore */
2390
+ ...(ngDevMode ? [{ debugName: "#appliedSearchQuery" }] : /* istanbul ignore next */ []));
1891
2391
  /** Increments on every tree filter apply so the tree view remounts with a new instance. */
1892
2392
  this.treeFilterKey = computed(() => String(this.#treeFilterEpoch()), /* @ts-ignore */
1893
2393
  ...(ngDevMode ? [{ debugName: "treeFilterKey" }] : /* istanbul ignore next */ []));
2394
+ /** Query passed to result-item highlighting (empty when disabled). */
2395
+ this.highlightQuery = computed(() => (this.highlightSearch() ? this.#appliedSearchQuery() : ''), /* @ts-ignore */
2396
+ ...(ngDevMode ? [{ debugName: "highlightQuery" }] : /* istanbul ignore next */ []));
1894
2397
  /** The datasource for list-based modes; plain arrays are converted. */
1895
2398
  this.resolvedDataSource = computed(() => {
1896
2399
  const tree = this.treeDataSource();
@@ -1911,15 +2414,26 @@ class AXLookupComponent extends NXValueComponent {
1911
2414
  textField: this.textField(),
1912
2415
  parentField: this.treeParentField(),
1913
2416
  hasChildrenField: this.hasChildrenField(),
2417
+ loadSearchRoots: Array.isArray(tree) ? undefined : () => this.#ensureHydratedTree(),
1914
2418
  });
1915
2419
  return this.#multiColumnTreeTableSource;
1916
2420
  }
1917
2421
  const source = this.dataSource();
1918
2422
  if (!source) {
1919
- return convertArrayToDataSource([], { key: this.valueField(), pageSize: 20 });
2423
+ return convertLookupArrayToDataSource([], {
2424
+ key: this.valueField(),
2425
+ pageSize: 20,
2426
+ textField: this.textField(),
2427
+ translateText: (text) => this.#translateItemText(text),
2428
+ });
1920
2429
  }
1921
2430
  return Array.isArray(source)
1922
- ? convertArrayToDataSource(source, { key: this.valueField(), pageSize: 20 })
2431
+ ? convertLookupArrayToDataSource(source, {
2432
+ key: this.valueField(),
2433
+ pageSize: 20,
2434
+ textField: this.textField(),
2435
+ translateText: (text) => this.#translateItemText(text),
2436
+ })
1923
2437
  : source;
1924
2438
  }, /* @ts-ignore */
1925
2439
  ...(ngDevMode ? [{ debugName: "resolvedDataSource" }] : /* istanbul ignore next */ []));
@@ -1928,21 +2442,34 @@ class AXLookupComponent extends NXValueComponent {
1928
2442
  * drop-down-tree / multi-select-tree do not refetch on every open.
1929
2443
  */
1930
2444
  this.#treeChildrenCache = new WeakMap();
2445
+ /** Stable lazy loader for on-demand expansion when no search query is active. */
2446
+ this.#lazyTreeLoader = (nodeId) => {
2447
+ const source = this.treeDataSource();
2448
+ if (typeof source !== 'function') {
2449
+ return [];
2450
+ }
2451
+ return this.#loadCachedTreeNodes(source, nodeId);
2452
+ };
1931
2453
  this.resolvedTreeDataSource = computed(() => {
1932
2454
  this.#treeFilterEpoch();
1933
2455
  const source = this.treeDataSource();
1934
- const query = this.#treeFilterQuery();
2456
+ const query = this.#treeFilterQuery().trim();
1935
2457
  const textField = this.textField();
2458
+ const translate = (text) => this.#translateItemTextForFilter(text);
1936
2459
  if (!source) {
1937
2460
  return [];
1938
2461
  }
1939
2462
  if (Array.isArray(source)) {
1940
- return query ? filterTreeNodes(source, textField, query) : cloneLookupTreeNodes(source);
2463
+ return query ? filterTreeNodes(source, textField, query, translate) : cloneLookupTreeNodes(source);
1941
2464
  }
1942
2465
  if (!query) {
1943
- return (nodeId) => this.#loadCachedTreeNodes(source, nodeId);
2466
+ return this.#lazyTreeLoader;
2467
+ }
2468
+ const snapshot = this.#hydratedTreeNodes();
2469
+ if (snapshot) {
2470
+ return filterTreeNodes(snapshot, textField, query, translate);
1944
2471
  }
1945
- return (nodeId) => this.#loadFilteredCachedTreeNodes(source, nodeId, query);
2472
+ return [];
1946
2473
  }, /* @ts-ignore */
1947
2474
  ...(ngDevMode ? [{ debugName: "resolvedTreeDataSource" }] : /* istanbul ignore next */ []));
1948
2475
  /** The current selection normalized to an array. */
@@ -1963,11 +2490,18 @@ class AXLookupComponent extends NXValueComponent {
1963
2490
  return item ? this.getItemText(item) : '';
1964
2491
  }, /* @ts-ignore */
1965
2492
  ...(ngDevMode ? [{ debugName: "displayText" }] : /* istanbul ignore next */ []));
2493
+ /** Resolved display text for the trigger input (i18n-aware). */
2494
+ this.translatedDisplayText = toTranslatedSignal(this.displayText);
2495
+ /** Actionsheet header title with i18n fallback chain. */
2496
+ this.actionsheetTitleSource = computed(() => this.caption() || this.placeholder() || '@acorex:selectbox.popover.title', /* @ts-ignore */
2497
+ ...(ngDevMode ? [{ debugName: "actionsheetTitleSource" }] : /* istanbul ignore next */ []));
2498
+ /** Resolved actionsheet title (i18n-aware). */
2499
+ this.actionsheetTitle = toTranslatedSignal(this.actionsheetTitleSource);
1966
2500
  /**
1967
2501
  * Text typed in the editable trigger input.
1968
2502
  * Multi-select starts empty; single modes sync from the selected display text.
1969
2503
  */
1970
- this.searchText = linkedSignal(() => (this.isMultiple() ? '' : this.displayText()), /* @ts-ignore */
2504
+ this.searchText = linkedSignal(() => (this.isMultiple() ? '' : this.translatedDisplayText()), /* @ts-ignore */
1971
2505
  ...(ngDevMode ? [{ debugName: "searchText" }] : /* istanbul ignore next */ []));
1972
2506
  /**
1973
2507
  * Whether the trigger should render `selectedTemplate` instead of the plain input text.
@@ -1981,18 +2515,18 @@ class AXLookupComponent extends NXValueComponent {
1981
2515
  if (!this.isEditableTrigger()) {
1982
2516
  return true;
1983
2517
  }
1984
- return !this.expanded() && this.searchText() === this.displayText();
2518
+ return !this.expanded() && this.searchText() === this.translatedDisplayText();
1985
2519
  }, /* @ts-ignore */
1986
2520
  ...(ngDevMode ? [{ debugName: "showSelectedTemplate" }] : /* istanbul ignore next */ []));
1987
2521
  /** Placeholder for the editable trigger search input. */
1988
2522
  this.triggerSearchPlaceholder = computed(() => {
1989
2523
  if (this.isActionsheetStyle()) {
1990
- return this.isMultiple() && this.selectedItems().length > 0 ? '' : this.placeholder();
2524
+ return this.isMultiple() && this.selectedItems().length > 0 ? '' : this.translatedPlaceholder();
1991
2525
  }
1992
2526
  if (this.isMultiple() && this.selectedItems().length > 0) {
1993
- return this.searchPlaceholder();
2527
+ return this.translatedSearchPlaceholder();
1994
2528
  }
1995
- return this.placeholder();
2529
+ return this.translatedPlaceholder();
1996
2530
  }, /* @ts-ignore */
1997
2531
  ...(ngDevMode ? [{ debugName: "triggerSearchPlaceholder" }] : /* istanbul ignore next */ []));
1998
2532
  this.popoverRef = viewChild(AXPopoverComponent, /* @ts-ignore */
@@ -2006,10 +2540,6 @@ class AXLookupComponent extends NXValueComponent {
2006
2540
  this.#document = inject(DOCUMENT);
2007
2541
  this.listView = viewChild(AXLookupListViewBase, /* @ts-ignore */
2008
2542
  ...(ngDevMode ? [{ debugName: "listView" }] : /* istanbul ignore next */ []));
2009
- this.dropDownTreeView = viewChild(AXLookupDropDownTreeComponent, /* @ts-ignore */
2010
- ...(ngDevMode ? [{ debugName: "dropDownTreeView" }] : /* istanbul ignore next */ []));
2011
- this.multiSelectTreeView = viewChild(AXLookupMultiSelectTreeComponent, /* @ts-ignore */
2012
- ...(ngDevMode ? [{ debugName: "multiSelectTreeView" }] : /* istanbul ignore next */ []));
2013
2543
  this.sheetSearchRef = viewChild('sheetSearch', /* @ts-ignore */
2014
2544
  ...(ngDevMode ? [{ debugName: "sheetSearchRef" }] : /* istanbul ignore next */ []));
2015
2545
  this.#itemsCache = new Map();
@@ -2103,6 +2633,24 @@ class AXLookupComponent extends NXValueComponent {
2103
2633
  }
2104
2634
  queueMicrotask(() => this.#focusPopupSearchOrList());
2105
2635
  }
2636
+ /**
2637
+ * Toggles the popup when the chevron button is clicked.
2638
+ */
2639
+ onChevronClick(event) {
2640
+ event.stopPropagation();
2641
+ if (this.disabled() || this.readonly()) {
2642
+ return;
2643
+ }
2644
+ this.expanded.update((open) => !open);
2645
+ if (!this.expanded()) {
2646
+ return;
2647
+ }
2648
+ if (this.isEditableTrigger()) {
2649
+ queueMicrotask(() => this.triggerSearchInput()?.nativeElement.focus());
2650
+ return;
2651
+ }
2652
+ queueMicrotask(() => this.#focusPopupSearchOrList());
2653
+ }
2106
2654
  /**
2107
2655
  * Focuses the lookup trigger input.
2108
2656
  */
@@ -2114,6 +2662,8 @@ class AXLookupComponent extends NXValueComponent {
2114
2662
  }
2115
2663
  /**
2116
2664
  * Handles keyboard interaction on the trigger input.
2665
+ * In multi modes, Backspace with an empty trigger input removes the last chip; repeated presses
2666
+ * clear the whole selection.
2117
2667
  */
2118
2668
  onTriggerKeydown(e) {
2119
2669
  if (this.disabled() || this.readonly()) {
@@ -2123,6 +2673,9 @@ class AXLookupComponent extends NXValueComponent {
2123
2673
  this.close();
2124
2674
  return;
2125
2675
  }
2676
+ if (e.key === 'Backspace' && this.#removeLastChipOnBackspace(e)) {
2677
+ return;
2678
+ }
2126
2679
  if (e.key === 'ArrowDown') {
2127
2680
  e.preventDefault();
2128
2681
  this.expanded.set(true);
@@ -2230,6 +2783,16 @@ class AXLookupComponent extends NXValueComponent {
2230
2783
  }
2231
2784
  }
2232
2785
  async #resolvedFilteredTreeNodes() {
2786
+ const query = this.#treeFilterQuery().trim();
2787
+ const treeSource = this.treeDataSource();
2788
+ if (query && treeSource && typeof treeSource === 'function') {
2789
+ await this.#ensureHydratedTree();
2790
+ const snapshot = this.#hydratedTreeNodes();
2791
+ if (snapshot) {
2792
+ return filterTreeNodes(snapshot, this.textField(), query, (text) => this.#translateItemTextForFilter(text));
2793
+ }
2794
+ return [];
2795
+ }
2233
2796
  const source = this.resolvedTreeDataSource();
2234
2797
  if (Array.isArray(source)) {
2235
2798
  return source;
@@ -2290,7 +2853,10 @@ class AXLookupComponent extends NXValueComponent {
2290
2853
  return false;
2291
2854
  }
2292
2855
  if (!this.isSheetSearchEnabled() && !this.isMultiple()) {
2293
- return query.toLowerCase() !== this.displayText().trim().toLowerCase();
2856
+ const queryLower = query.toLowerCase();
2857
+ const translated = this.translatedDisplayText().trim().toLowerCase();
2858
+ const raw = this.displayText().trim().toLowerCase();
2859
+ return queryLower !== translated && queryLower !== raw;
2294
2860
  }
2295
2861
  return true;
2296
2862
  }
@@ -2343,9 +2909,14 @@ class AXLookupComponent extends NXValueComponent {
2343
2909
  */
2344
2910
  onPopoverClosed() {
2345
2911
  this.expanded.set(false);
2346
- this.searchText.set(this.isMultiple() ? '' : this.displayText());
2912
+ this.searchText.set(this.isMultiple() ? '' : this.translatedDisplayText());
2347
2913
  this.sheetSearchText.set('');
2914
+ this.#appliedSearchQuery.set('');
2348
2915
  this.#treeFilterQuery.set('');
2916
+ this.#hydratedTreeNodes.set(undefined);
2917
+ this.#hydrationPromise = undefined;
2918
+ this.#hydrationRevision++;
2919
+ this.treeSearchLoading.set(false);
2349
2920
  this.#treeFilterEpoch.update((value) => value + 1);
2350
2921
  if (this.#filterApplied) {
2351
2922
  this.#filterApplied = false;
@@ -2402,7 +2973,7 @@ class AXLookupComponent extends NXValueComponent {
2402
2973
  this.#emitItemSelected(e.item);
2403
2974
  this.#itemsCache.set(e.value, e.item);
2404
2975
  this.selectedItems.set([e.item]);
2405
- this.searchText.set(this.getItemText(e.item));
2976
+ this.searchText.set(this.#translateItemText(this.getItemText(e.item)));
2406
2977
  this.#isUserInteraction = true;
2407
2978
  this.value.set(e.value);
2408
2979
  this.close();
@@ -2528,6 +3099,24 @@ class AXLookupComponent extends NXValueComponent {
2528
3099
  this.#isUserInteraction = true;
2529
3100
  this.value.set(this.selectedValues().filter((v) => !(v == value)));
2530
3101
  }
3102
+ /** Removes the last chip when Backspace is pressed with an empty trigger input (multi modes). */
3103
+ #removeLastChipOnBackspace(event) {
3104
+ if (!this.isMultiple() || !this.#isTriggerInputEmpty(event)) {
3105
+ return false;
3106
+ }
3107
+ const items = this.selectedItems();
3108
+ if (items.length === 0) {
3109
+ return false;
3110
+ }
3111
+ event.preventDefault();
3112
+ event.stopPropagation();
3113
+ this.removeChip(event, items[items.length - 1]);
3114
+ return true;
3115
+ }
3116
+ #isTriggerInputEmpty(event) {
3117
+ const input = event.target instanceof HTMLInputElement ? event.target : this.triggerSearchInput()?.nativeElement;
3118
+ return input ? input.value.length === 0 : !this.searchText();
3119
+ }
2531
3120
  /**
2532
3121
  * Seeds the item cache with known items so matching `value` keys resolve without `byKey`.
2533
3122
  * Useful after an async parent-entity load when `valueItems` is not bound.
@@ -2612,51 +3201,59 @@ class AXLookupComponent extends NXValueComponent {
2612
3201
  byParent.set(key, request);
2613
3202
  return request;
2614
3203
  }
2615
- #nodeMayHaveChildren(node) {
2616
- const raw = node['children'];
2617
- if (Array.isArray(raw) && raw.length > 0) {
2618
- return true;
2619
- }
2620
- const count = node['childrenCount'];
2621
- if (typeof count === 'number' && count > 0) {
2622
- return true;
2623
- }
2624
- return node['hasChild'] === true || node['hasChildren'] === true;
2625
- }
2626
3204
  /**
2627
- * Builds a nested tree for search by loading lazy children (using the existing cache)
2628
- * so a query can match sub-items that have not been expanded yet.
3205
+ * Hydrates a lazy tree once per popup open so whole-tree search can filter in memory.
2629
3206
  */
2630
- async #hydrateTreeChildrenForSearch(source, nodes, visited = new Set()) {
2631
- const valueField = this.valueField();
2632
- return Promise.all(nodes.map(async (node) => {
2633
- const raw = node['children'];
2634
- const nested = Array.isArray(raw) && raw.length > 0 ? raw : undefined;
2635
- if (nested) {
2636
- const children = await this.#hydrateTreeChildrenForSearch(source, nested, visited);
2637
- return { ...node, children };
3207
+ #ensureHydratedTree() {
3208
+ const cached = this.#hydratedTreeNodes();
3209
+ if (cached) {
3210
+ return Promise.resolve(cached);
3211
+ }
3212
+ if (this.#hydrationPromise) {
3213
+ return this.#hydrationPromise;
3214
+ }
3215
+ const source = this.treeDataSource();
3216
+ if (!source || Array.isArray(source)) {
3217
+ return Promise.resolve([]);
3218
+ }
3219
+ const revision = this.#hydrationRevision;
3220
+ this.treeSearchLoading.set(true);
3221
+ this.#hydrationPromise = (async () => {
3222
+ const roots = await this.#loadCachedTreeNodes(source, undefined);
3223
+ const hydrated = await hydrateLookupTree(roots, (id) => this.#loadCachedTreeNodes(source, id), {
3224
+ valueField: this.valueField(),
3225
+ isCancelled: () => revision !== this.#hydrationRevision,
3226
+ });
3227
+ if (revision !== this.#hydrationRevision) {
3228
+ return [];
2638
3229
  }
2639
- const id = String(node[valueField] ?? '');
2640
- if (!id || !this.#nodeMayHaveChildren(node) || visited.has(id)) {
2641
- return node;
3230
+ this.#hydratedTreeNodes.set(hydrated);
3231
+ this.treeSearchLoading.set(false);
3232
+ this.#treeFilterEpoch.update((value) => value + 1);
3233
+ return hydrated;
3234
+ })().finally(() => {
3235
+ if (revision === this.#hydrationRevision) {
3236
+ this.#hydrationPromise = undefined;
2642
3237
  }
2643
- visited.add(id);
2644
- const loaded = await this.#loadCachedTreeNodes(source, id);
2645
- const children = await this.#hydrateTreeChildrenForSearch(source, loaded, visited);
2646
- return { ...node, children };
2647
- }));
2648
- }
2649
- async #loadFilteredCachedTreeNodes(source, nodeId, query) {
2650
- const nodes = await this.#loadCachedTreeNodes(source, nodeId);
2651
- const hydrated = await this.#hydrateTreeChildrenForSearch(source, nodes);
2652
- return filterTreeNodes(hydrated, this.textField(), query);
3238
+ if (revision === this.#hydrationRevision && !this.#hydratedTreeNodes()) {
3239
+ this.treeSearchLoading.set(false);
3240
+ }
3241
+ });
3242
+ return this.#hydrationPromise;
2653
3243
  }
2654
3244
  #applyFilterNow(text) {
2655
3245
  const query = text?.trim() ?? '';
3246
+ this.#appliedSearchQuery.set(query);
2656
3247
  if (this.#isTreeOnlySearchMode()) {
2657
3248
  this.#treeFilterQuery.set(query);
2658
- this.#treeFilterEpoch.update((value) => value + 1);
2659
3249
  this.#filterApplied = query.length > 0;
3250
+ this.#treeFilterEpoch.update((value) => value + 1);
3251
+ if (query) {
3252
+ const source = this.treeDataSource();
3253
+ if (source && typeof source === 'function') {
3254
+ void this.#ensureHydratedTree();
3255
+ }
3256
+ }
2660
3257
  return;
2661
3258
  }
2662
3259
  const source = this.resolvedDataSource();
@@ -2698,7 +3295,7 @@ class AXLookupComponent extends NXValueComponent {
2698
3295
  component: this,
2699
3296
  htmlElement: this.nativeElement,
2700
3297
  isUserInteraction: this.#isUserInteraction,
2701
- items,
3298
+ items: items,
2702
3299
  value: this.value(),
2703
3300
  });
2704
3301
  }
@@ -2809,15 +3406,26 @@ class AXLookupComponent extends NXValueComponent {
2809
3406
  };
2810
3407
  expanded ? this.onOpened.emit(event) : this.onClosed.emit(event);
2811
3408
  }
2812
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXLookupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2813
- 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 }, 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: [
3409
+ #translateItemText(text) {
3410
+ return this.#translation.translateSync(text, { waitForLoad: true });
3411
+ }
3412
+ /** Fast path for search filtering — skips sync translation for plain labels. */
3413
+ #translateItemTextForFilter(text) {
3414
+ const value = String(text ?? '');
3415
+ if (!value.startsWith('@')) {
3416
+ return value;
3417
+ }
3418
+ return this.#translation.translateSync(value, { waitForLoad: false });
3419
+ }
3420
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXLookupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
3421
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.6", 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: [
2814
3422
  { provide: AXComponent, useExisting: AXLookupComponent },
2815
3423
  { provide: AXClearableComponent, useExisting: AXLookupComponent },
2816
3424
  { provide: AXClosableComponent, useExisting: AXLookupComponent },
2817
3425
  { provide: AXValuableComponent, useExisting: AXLookupComponent },
2818
- ], 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 (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 (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 (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 (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 (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 (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{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: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{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-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"], outputs: ["itemClick"] }, { kind: "component", type: AXLookupMultiSelectTreeComponent, selector: "ax-lookup-multi-select-tree", inputs: ["dataSource", "valueField", "textField", "disabledField", "selectedValues", "selectionBehavior", "nodeTemplate", "emptyTemplate", "alternate", "filterKey"], outputs: ["selectionChange"] }, { kind: "component", type: AXLookupMultiColumnComponent, selector: "ax-lookup-multi-column", inputs: ["dataSource", "valueField", "textField", "disabledField", "selectedValues", "itemHeight", "maxVisibleItems", "columns", "itemTemplate", "emptyTemplate", "loadingTemplate", "alternate"], 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"], outputs: ["itemClick"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
3426
+ ], 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: "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 (click)=\"onChevronClick($event)\"\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 [loadingTemplate]=\"loadingTemplate()\"\n [loading]=\"treeSearchLoading()\"\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 [loadingTemplate]=\"loadingTemplate()\"\n [loading]=\"treeSearchLoading()\"\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}.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", "closeOnNavigation", "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", "loadingTemplate", "loading", "alternate", "filterKey", "highlightText"], outputs: ["itemClick"] }, { kind: "component", type: AXLookupMultiSelectTreeComponent, selector: "ax-lookup-multi-select-tree", inputs: ["dataSource", "valueField", "textField", "disabledField", "selectedValues", "selectionBehavior", "nodeTemplate", "emptyTemplate", "loadingTemplate", "loading", "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 }); }
2819
3427
  }
2820
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXLookupComponent, decorators: [{
3428
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXLookupComponent, decorators: [{
2821
3429
  type: Component,
2822
3430
  args: [{ selector: 'ax-lookup', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [
2823
3431
  NgTemplateOutlet,
@@ -2839,12 +3447,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
2839
3447
  { provide: AXClearableComponent, useExisting: AXLookupComponent },
2840
3448
  { provide: AXClosableComponent, useExisting: AXLookupComponent },
2841
3449
  { provide: AXValuableComponent, useExisting: AXLookupComponent },
2842
- ], 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 (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 (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 (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 (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 (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 (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{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: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{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-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"] }]
2843
- }], 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 }] }], 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 }] }] } });
3450
+ ], 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 (click)=\"onChevronClick($event)\"\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 [loadingTemplate]=\"loadingTemplate()\"\n [loading]=\"treeSearchLoading()\"\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 [loadingTemplate]=\"loadingTemplate()\"\n [loading]=\"treeSearchLoading()\"\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}.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"] }]
3451
+ }], 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 }] }], sheetSearchRef: [{ type: i0.ViewChild, args: ['sheetSearch', { isSignal: true }] }] } });
2844
3452
 
2845
3453
  class AXLookupModule {
2846
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXLookupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
2847
- static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.8", ngImport: i0, type: AXLookupModule, imports: [AXLookupComponent,
3454
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXLookupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
3455
+ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.6", ngImport: i0, type: AXLookupModule, imports: [AXLookupComponent,
2848
3456
  AXLookupDropDownListComponent,
2849
3457
  AXLookupMultiSelectComponent,
2850
3458
  AXLookupDropDownTreeComponent,
@@ -2857,7 +3465,7 @@ class AXLookupModule {
2857
3465
  AXLookupMultiSelectTreeComponent,
2858
3466
  AXLookupMultiColumnComponent,
2859
3467
  AXLookupMultiColumnTreeComponent] }); }
2860
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXLookupModule, imports: [AXLookupComponent,
3468
+ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXLookupModule, imports: [AXLookupComponent,
2861
3469
  AXLookupDropDownListComponent,
2862
3470
  AXLookupMultiSelectComponent,
2863
3471
  AXLookupDropDownTreeComponent,
@@ -2865,7 +3473,7 @@ class AXLookupModule {
2865
3473
  AXLookupMultiColumnComponent,
2866
3474
  AXLookupMultiColumnTreeComponent] }); }
2867
3475
  }
2868
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXLookupModule, decorators: [{
3476
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.6", ngImport: i0, type: AXLookupModule, decorators: [{
2869
3477
  type: NgModule,
2870
3478
  args: [{
2871
3479
  imports: [
@@ -2893,5 +3501,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
2893
3501
  * Generated bundle index. Do not edit.
2894
3502
  */
2895
3503
 
2896
- export { AXLookupComponent, AXLookupDropDownListComponent, AXLookupDropDownTreeComponent, AXLookupModule, AXLookupMultiColumnComponent, AXLookupMultiColumnTreeComponent, AXLookupMultiSelectComponent, AXLookupMultiSelectTreeComponent };
3504
+ export { AXLookupComponent, AXLookupDropDownListComponent, AXLookupDropDownTreeComponent, AXLookupModule, AXLookupMultiColumnComponent, AXLookupMultiColumnTreeComponent, AXLookupMultiSelectComponent, AXLookupMultiSelectTreeComponent, cloneLookupTreeNodes, convertLookupArrayToDataSource, createLookupTreeTableDataSource, filterTreeNodes, flattenTreeNodes, hydrateLookupTree, lookupTreeNodeMayHaveChildren, matchesLookupText, prepareFilteredTreeTableRows };
2897
3505
  //# sourceMappingURL=acorex-components-lookup.mjs.map