@koobiq/components 20.1.0 → 20.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (249) hide show
  1. package/accordion/_accordion-theme.scss +6 -2
  2. package/accordion/accordion-tokens.scss +3 -0
  3. package/accordion/{accordion-trigger.component.scss → accordion-trigger.scss} +10 -0
  4. package/accordion/accordion.scss +71 -0
  5. package/accordion/index.d.ts +264 -121
  6. package/actions-panel/index.d.ts +25 -13
  7. package/alert/_alert-theme.scss +14 -0
  8. package/alert/alert.component.scss +24 -13
  9. package/alert/index.d.ts +63 -29
  10. package/app-switcher/app-switcher-dropdown-app.scss +7 -5
  11. package/app-switcher/app-switcher-dropdown-site.scss +6 -4
  12. package/app-switcher/index.d.ts +41 -4
  13. package/app-switcher/kbq-app-switcher-list-item.scss +6 -8
  14. package/autocomplete/autocomplete.scss +2 -1
  15. package/autocomplete/index.d.ts +58 -37
  16. package/badge/index.d.ts +2 -3
  17. package/breadcrumbs/index.d.ts +1 -1
  18. package/button/index.d.ts +2 -2
  19. package/button-toggle/button-toggle-tokens.scss +2 -0
  20. package/button-toggle/button-toggle.scss +9 -0
  21. package/button-toggle/index.d.ts +5 -0
  22. package/checkbox/index.d.ts +33 -29
  23. package/clamped-text/index.d.ts +3 -2
  24. package/code-block/index.d.ts +24 -19
  25. package/content-panel/index.d.ts +1 -1
  26. package/core/index.d.ts +1217 -186
  27. package/core/option/_action-container-mixins.scss +28 -0
  28. package/core/option/_option-theme.scss +24 -0
  29. package/core/option/action.scss +7 -0
  30. package/core/styles/_core.scss +2 -0
  31. package/core/styles/_koobiq-theme.scss +2 -0
  32. package/core/styles/_tokens.scss +1 -0
  33. package/core/styles/common/_animation.scss +31 -24
  34. package/core/styles/common/_connected-overlay.scss +39 -0
  35. package/core/styles/common/_select.scss +19 -2
  36. package/core/styles/common/_tokens.scss +0 -9
  37. package/core/styles/theming/_index.scss +0 -1
  38. package/core/styles/theming/_theming.scss +34 -5
  39. package/datepicker/index.d.ts +46 -15
  40. package/dl/dl.scss +26 -0
  41. package/dl/index.d.ts +8 -1
  42. package/dropdown/_dropdown-theme.scss +28 -2
  43. package/dropdown/dropdown-item.scss +29 -0
  44. package/dropdown/dropdown-tokens.scss +2 -1
  45. package/dropdown/dropdown.scss +16 -1
  46. package/dropdown/index.d.ts +331 -17
  47. package/dynamic-translation/index.d.ts +1 -1
  48. package/fesm2022/koobiq-components-accordion.mjs +480 -317
  49. package/fesm2022/koobiq-components-accordion.mjs.map +1 -1
  50. package/fesm2022/koobiq-components-actions-panel.mjs +57 -46
  51. package/fesm2022/koobiq-components-actions-panel.mjs.map +1 -1
  52. package/fesm2022/koobiq-components-alert.mjs +98 -58
  53. package/fesm2022/koobiq-components-alert.mjs.map +1 -1
  54. package/fesm2022/koobiq-components-app-switcher.mjs +233 -38
  55. package/fesm2022/koobiq-components-app-switcher.mjs.map +1 -1
  56. package/fesm2022/koobiq-components-autocomplete.mjs +89 -52
  57. package/fesm2022/koobiq-components-autocomplete.mjs.map +1 -1
  58. package/fesm2022/koobiq-components-badge.mjs +18 -17
  59. package/fesm2022/koobiq-components-badge.mjs.map +1 -1
  60. package/fesm2022/koobiq-components-breadcrumbs.mjs +25 -25
  61. package/fesm2022/koobiq-components-breadcrumbs.mjs.map +1 -1
  62. package/fesm2022/koobiq-components-button-toggle.mjs +17 -12
  63. package/fesm2022/koobiq-components-button-toggle.mjs.map +1 -1
  64. package/fesm2022/koobiq-components-button.mjs +25 -25
  65. package/fesm2022/koobiq-components-checkbox.mjs +69 -92
  66. package/fesm2022/koobiq-components-checkbox.mjs.map +1 -1
  67. package/fesm2022/koobiq-components-clamped-text.mjs +18 -13
  68. package/fesm2022/koobiq-components-clamped-text.mjs.map +1 -1
  69. package/fesm2022/koobiq-components-code-block.mjs +56 -69
  70. package/fesm2022/koobiq-components-code-block.mjs.map +1 -1
  71. package/fesm2022/koobiq-components-content-panel.mjs +29 -29
  72. package/fesm2022/koobiq-components-core.mjs +2485 -735
  73. package/fesm2022/koobiq-components-core.mjs.map +1 -1
  74. package/fesm2022/koobiq-components-datepicker.mjs +168 -126
  75. package/fesm2022/koobiq-components-datepicker.mjs.map +1 -1
  76. package/fesm2022/koobiq-components-divider.mjs +7 -7
  77. package/fesm2022/koobiq-components-dl.mjs +23 -15
  78. package/fesm2022/koobiq-components-dl.mjs.map +1 -1
  79. package/fesm2022/koobiq-components-dropdown.mjs +814 -136
  80. package/fesm2022/koobiq-components-dropdown.mjs.map +1 -1
  81. package/fesm2022/koobiq-components-dynamic-translation.mjs +13 -13
  82. package/fesm2022/koobiq-components-ellipsis-center.mjs +7 -7
  83. package/fesm2022/koobiq-components-empty-state.mjs +19 -19
  84. package/fesm2022/koobiq-components-file-upload.mjs +74 -42
  85. package/fesm2022/koobiq-components-file-upload.mjs.map +1 -1
  86. package/fesm2022/koobiq-components-filter-bar.mjs +783 -199
  87. package/fesm2022/koobiq-components-filter-bar.mjs.map +1 -1
  88. package/fesm2022/koobiq-components-flag.mjs +7 -7
  89. package/fesm2022/koobiq-components-form-field.mjs +350 -162
  90. package/fesm2022/koobiq-components-form-field.mjs.map +1 -1
  91. package/fesm2022/koobiq-components-icon.mjs +52 -25
  92. package/fesm2022/koobiq-components-icon.mjs.map +1 -1
  93. package/fesm2022/koobiq-components-inline-edit.mjs +175 -28
  94. package/fesm2022/koobiq-components-inline-edit.mjs.map +1 -1
  95. package/fesm2022/koobiq-components-input.mjs +41 -24
  96. package/fesm2022/koobiq-components-input.mjs.map +1 -1
  97. package/fesm2022/koobiq-components-link.mjs +8 -8
  98. package/fesm2022/koobiq-components-list.mjs +657 -143
  99. package/fesm2022/koobiq-components-list.mjs.map +1 -1
  100. package/fesm2022/koobiq-components-loader-overlay.mjs +16 -16
  101. package/fesm2022/koobiq-components-markdown.mjs +14 -11
  102. package/fesm2022/koobiq-components-markdown.mjs.map +1 -1
  103. package/fesm2022/koobiq-components-modal.mjs +59 -35
  104. package/fesm2022/koobiq-components-modal.mjs.map +1 -1
  105. package/fesm2022/koobiq-components-navbar.mjs +177 -67
  106. package/fesm2022/koobiq-components-navbar.mjs.map +1 -1
  107. package/fesm2022/koobiq-components-notification-center.mjs +40 -24
  108. package/fesm2022/koobiq-components-notification-center.mjs.map +1 -1
  109. package/fesm2022/koobiq-components-overflow-items.mjs +16 -17
  110. package/fesm2022/koobiq-components-overflow-items.mjs.map +1 -1
  111. package/fesm2022/koobiq-components-popover.mjs +31 -21
  112. package/fesm2022/koobiq-components-popover.mjs.map +1 -1
  113. package/fesm2022/koobiq-components-progress-bar.mjs +13 -13
  114. package/fesm2022/koobiq-components-progress-spinner.mjs +13 -13
  115. package/fesm2022/koobiq-components-radio.mjs +10 -10
  116. package/fesm2022/koobiq-components-resizer.mjs +33 -14
  117. package/fesm2022/koobiq-components-resizer.mjs.map +1 -1
  118. package/fesm2022/koobiq-components-scrollbar.mjs +10 -10
  119. package/fesm2022/koobiq-components-search-expandable.mjs +49 -14
  120. package/fesm2022/koobiq-components-search-expandable.mjs.map +1 -1
  121. package/fesm2022/koobiq-components-select.mjs +450 -146
  122. package/fesm2022/koobiq-components-select.mjs.map +1 -1
  123. package/fesm2022/koobiq-components-sidebar.mjs +14 -14
  124. package/fesm2022/koobiq-components-sidepanel.mjs +26 -26
  125. package/fesm2022/koobiq-components-skeleton.mjs +10 -10
  126. package/fesm2022/koobiq-components-split-button.mjs +10 -17
  127. package/fesm2022/koobiq-components-split-button.mjs.map +1 -1
  128. package/fesm2022/koobiq-components-splitter.mjs +17 -17
  129. package/fesm2022/koobiq-components-table.mjs +15 -13
  130. package/fesm2022/koobiq-components-table.mjs.map +1 -1
  131. package/fesm2022/koobiq-components-tabs.mjs +80 -68
  132. package/fesm2022/koobiq-components-tabs.mjs.map +1 -1
  133. package/fesm2022/koobiq-components-tags.mjs +283 -122
  134. package/fesm2022/koobiq-components-tags.mjs.map +1 -1
  135. package/fesm2022/koobiq-components-textarea.mjs +13 -8
  136. package/fesm2022/koobiq-components-textarea.mjs.map +1 -1
  137. package/fesm2022/koobiq-components-time-range.mjs +29 -24
  138. package/fesm2022/koobiq-components-time-range.mjs.map +1 -1
  139. package/fesm2022/koobiq-components-timepicker.mjs +61 -30
  140. package/fesm2022/koobiq-components-timepicker.mjs.map +1 -1
  141. package/fesm2022/koobiq-components-timezone.mjs +77 -42
  142. package/fesm2022/koobiq-components-timezone.mjs.map +1 -1
  143. package/fesm2022/koobiq-components-title.mjs +7 -7
  144. package/fesm2022/koobiq-components-toast.mjs +51 -26
  145. package/fesm2022/koobiq-components-toast.mjs.map +1 -1
  146. package/fesm2022/koobiq-components-toggle.mjs +72 -64
  147. package/fesm2022/koobiq-components-toggle.mjs.map +1 -1
  148. package/fesm2022/koobiq-components-tooltip.mjs +219 -28
  149. package/fesm2022/koobiq-components-tooltip.mjs.map +1 -1
  150. package/fesm2022/koobiq-components-top-bar.mjs +13 -13
  151. package/fesm2022/koobiq-components-tree-select.mjs +222 -80
  152. package/fesm2022/koobiq-components-tree-select.mjs.map +1 -1
  153. package/fesm2022/koobiq-components-tree.mjs +302 -81
  154. package/fesm2022/koobiq-components-tree.mjs.map +1 -1
  155. package/fesm2022/koobiq-components-username.mjs +27 -27
  156. package/file-upload/index.d.ts +25 -6
  157. package/file-upload/multiple-file-upload.component.scss +14 -0
  158. package/filter-bar/_filter-bar-theme.scss +0 -10
  159. package/filter-bar/filter-bar-tokens.scss +3 -0
  160. package/filter-bar/filters.scss +3 -2
  161. package/filter-bar/index.d.ts +281 -9
  162. package/filter-bar/pipes/base-pipe.scss +0 -11
  163. package/filter-bar/pipes/pipe-input.scss +10 -0
  164. package/filter-bar/pipes/pipe-multi-tree-select.scss +0 -6
  165. package/filter-bar/pipes/pipe-multiselect.scss +0 -6
  166. package/filter-bar/pipes/pipe-tree-select.scss +0 -6
  167. package/form-field/_form-field-theme.scss +76 -20
  168. package/form-field/fieldset.scss +10 -0
  169. package/form-field/form-field-tokens.scss +15 -1
  170. package/form-field/form-field.scss +15 -19
  171. package/form-field/index.d.ts +147 -65
  172. package/icon/icon-button.scss +3 -1
  173. package/icon/index.d.ts +45 -7
  174. package/inline-edit/index.d.ts +57 -4
  175. package/inline-edit/inline-edit.scss +10 -0
  176. package/input/index.d.ts +17 -2
  177. package/list/_list-theme.scss +42 -10
  178. package/list/index.d.ts +326 -79
  179. package/list/list-tokens.scss +43 -8
  180. package/list/list.scss +186 -12
  181. package/markdown/index.d.ts +1 -1
  182. package/modal/index.d.ts +21 -4
  183. package/modal/modal-tokens.scss +1 -1
  184. package/navbar/_navbar-item_vertical.scss +7 -5
  185. package/navbar/index.d.ts +54 -5
  186. package/navbar/navbar-brand.scss +23 -7
  187. package/navbar/vertical-navbar.scss +6 -0
  188. package/notification-center/index.d.ts +2 -1
  189. package/notification-center/notification-item.scss +6 -0
  190. package/package.json +3 -6
  191. package/popover/index.d.ts +2 -2
  192. package/prebuilt-themes/dark-theme.css +1 -1
  193. package/prebuilt-themes/light-theme.css +1 -1
  194. package/prebuilt-themes/theme.css +1 -1
  195. package/resizer/index.d.ts +12 -0
  196. package/schematics/collection.json +10 -0
  197. package/schematics/migrations/alert-signals/README.md +64 -0
  198. package/schematics/migrations/alert-signals/data.js +70 -0
  199. package/schematics/migrations/alert-signals/index.js +350 -0
  200. package/schematics/migrations/alert-signals/schema.json +20 -0
  201. package/schematics/migrations/autocomplete-panel-width-auto/README.md +68 -0
  202. package/schematics/migrations/autocomplete-panel-width-auto/index.js +70 -0
  203. package/schematics/migrations/autocomplete-panel-width-auto/schema.json +15 -0
  204. package/schematics/migrations/deprecated-icons/README.md +29 -4
  205. package/schematics/migrations/deprecated-icons/data.js +7 -0
  206. package/schematics/migrations/deprecated-icons/index.js +62 -35
  207. package/schematics/migrations/filter-bar-signals/README.md +1 -1
  208. package/schematics/migrations/new-icons-pack/README.md +37 -2
  209. package/schematics/migrations/new-icons-pack/data.js +8 -0
  210. package/schematics/migrations/new-icons-pack/index.js +144 -53
  211. package/schematics/migrations.json +11 -1
  212. package/schematics/ng-add/index.js +3 -3
  213. package/schematics/utils/angular-parsing.js +41 -14
  214. package/schematics/utils/ast.js +31 -0
  215. package/schematics/utils/icon-migration.js +530 -0
  216. package/schematics/utils/typescript.js +44 -0
  217. package/scrollbar/index.d.ts +1 -1
  218. package/search-expandable/index.d.ts +3 -0
  219. package/select/index.d.ts +212 -40
  220. package/select/select-tokens.scss +0 -1
  221. package/select/select.scss +0 -2
  222. package/splitter/index.d.ts +1 -1
  223. package/table/_table-theme.scss +4 -0
  224. package/table/index.d.ts +2 -1
  225. package/table/table.scss +8 -0
  226. package/tabs/_tabs-common.scss +60 -31
  227. package/tabs/_tabs-theme.scss +12 -0
  228. package/tabs/index.d.ts +2 -2
  229. package/tabs/tab-header.scss +14 -0
  230. package/tabs/tab-nav-bar.scss +4 -0
  231. package/tabs/tabs-tokens.scss +1 -0
  232. package/tags/index.d.ts +128 -29
  233. package/textarea/index.d.ts +5 -0
  234. package/time-range/index.d.ts +1 -1
  235. package/timepicker/index.d.ts +4 -0
  236. package/timezone/index.d.ts +10 -8
  237. package/toast/index.d.ts +26 -3
  238. package/toggle/index.d.ts +34 -14
  239. package/tooltip/index.d.ts +119 -7
  240. package/tree/_tree-theme.scss +25 -5
  241. package/tree/index.d.ts +71 -3
  242. package/tree/tree-option.scss +2 -8
  243. package/tree-select/_tree-select-theme.scss +22 -0
  244. package/tree-select/index.d.ts +127 -36
  245. package/accordion/accordion.component.scss +0 -50
  246. package/core/styles/_tokens.kbq.import.scss +0 -4
  247. package/core/styles/theming/_components-theming.scss +0 -1927
  248. package/filter-bar/pipes/pipe-select.scss +0 -5
  249. package/overflow-items/overflow-items.scss +0 -20
@@ -1,14 +1,15 @@
1
+ import { Directionality } from '@angular/cdk/bidi';
1
2
  import { coerceBooleanProperty } from '@angular/cdk/coercion';
2
3
  import { Overlay } from '@angular/cdk/overlay';
3
4
  import * as i0 from '@angular/core';
4
- import { inject, Input, ViewEncapsulation, ChangeDetectionStrategy, Component, input, booleanAttribute, InjectionToken, viewChild, EventEmitter, output, numberAttribute, Output, Directive, NgModule } from '@angular/core';
5
+ import { inject, Input, ViewEncapsulation, ChangeDetectionStrategy, Component, input, booleanAttribute, InjectionToken, viewChild, QueryList, ViewChildren, EventEmitter, output, numberAttribute, Output, Directive, NgModule } from '@angular/core';
5
6
  import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
6
7
  import * as i1$2 from '@angular/forms';
7
8
  import { FormControl, FormsModule, ReactiveFormsModule } from '@angular/forms';
8
9
  import * as i1 from '@koobiq/components/badge';
9
10
  import { KbqBadgeModule } from '@koobiq/components/badge';
10
11
  import * as i9 from '@koobiq/components/core';
11
- import { KbqAnimationCurves, KbqAnimationDurations, KBQ_TITLE_TEXT_REF, ruRULocaleData, KbqPopUp, KBQ_LOCALE_SERVICE, applyPopupMargins, KbqOptionModule, KbqPopUpTrigger, PopUpSizes, PopUpPlacements, PopUpTriggers, POSITION_TO_CSS_MAP, EmptyFocusTrapStrategy } from '@koobiq/components/core';
12
+ import { KbqAnimationCurves, KbqAnimationDurations, KBQ_TITLE_TEXT_REF, KbqHighlightBackgroundPipe, ruRULocaleData, KbqPopUp, KBQ_LOCALE_SERVICE, FocusKeyManager, applyPopupMargins, ESCAPE, DOWN_ARROW, TAB, LEFT_ARROW, RIGHT_ARROW, ENTER, SPACE, UP_ARROW, KbqOptionModule, KbqPopUpTrigger, PopUpSizes, PopUpPlacements, PopUpTriggers, POSITION_TO_CSS_MAP, EmptyFocusTrapStrategy } from '@koobiq/components/core';
12
13
  import * as i5 from '@koobiq/components/divider';
13
14
  import { KbqDividerModule } from '@koobiq/components/divider';
14
15
  import * as i7 from '@koobiq/components/dropdown';
@@ -21,7 +22,8 @@ import { defaultOffsetYWithArrow } from '@koobiq/components/popover';
21
22
  import * as i8 from '@koobiq/components/scrollbar';
22
23
  import { KbqScrollbarModule } from '@koobiq/components/scrollbar';
23
24
  import { merge } from 'rxjs';
24
- import { trigger, state, transition, style, animate } from '@angular/animations';
25
+ import { startWith } from 'rxjs/operators';
26
+ import { trigger, state, style, transition, animate } from '@angular/animations';
25
27
  import { NgOptimizedImage } from '@angular/common';
26
28
  import { DomSanitizer } from '@angular/platform-browser';
27
29
  import * as i3 from '@koobiq/components/form-field';
@@ -52,8 +54,8 @@ class KbqAppSwitcherDropdownApp extends KbqDropdownItem {
52
54
  getIcon(icon) {
53
55
  return this.sanitizer.bypassSecurityTrustHtml(icon || '');
54
56
  }
55
- /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqAppSwitcherDropdownApp, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
56
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: KbqAppSwitcherDropdownApp, isStandalone: true, selector: "[kbq-app-switcher-dropdown-app]", inputs: { app: ["kbq-app-switcher-dropdown-app", "app"] }, host: { properties: { "class.kbq-dropdown-item": "false" }, classAttribute: "kbq-app-switcher-dropdown-app" }, providers: [
57
+ /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqAppSwitcherDropdownApp, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
58
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.30", type: KbqAppSwitcherDropdownApp, isStandalone: true, selector: "[kbq-app-switcher-dropdown-app]", inputs: { app: ["kbq-app-switcher-dropdown-app", "app"] }, host: { attributes: { "role": "menuitem" }, properties: { "class.kbq-dropdown-item": "false", "attr.tabindex": "getTabIndex()", "attr.aria-haspopup": "isNested ? 'menu' : null" }, classAttribute: "kbq-app-switcher-dropdown-app" }, providers: [
57
59
  { provide: KBQ_TITLE_TEXT_REF, useExisting: KbqAppSwitcherDropdownApp },
58
60
  { provide: KbqDropdownItem, useExisting: KbqAppSwitcherDropdownApp }
59
61
  ], exportAs: ["kbqAppSwitcherDropdownApp"], usesInheritance: true, ngImport: i0, template: `
@@ -82,9 +84,9 @@ class KbqAppSwitcherDropdownApp extends KbqDropdownItem {
82
84
  <div class="kbq-app-switcher-dropdown-app__caption">{{ app.caption }}</div>
83
85
  }
84
86
  </div>
85
- `, isInline: true, styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:64px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,#0000000a 12px,#ffffff1a 12px 22px,#0000000a 22px 34px,#ffffff1a 34px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}@media(prefers-reduced-motion:reduce){.kbq-progress:after{animation:none}}.kbq-group{display:flex;flex-direction:row}.kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-size-border-width))}.kbq-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-vertical-group{display:flex;flex-direction:column}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-size-border-width))}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-truncate-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-no-select{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-app-switcher-dropdown-app{display:flex;flex-direction:row;width:100%;min-height:50px;border-radius:var(--kbq-size-xs);border:var(--kbq-size-3xs) solid transparent;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;text-decoration:none;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent;cursor:pointer;padding:var(--kbq-size-xxs) var(--kbq-size-m)}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-app__icon{padding-top:var(--kbq-size-s);padding-right:var(--kbq-size-m)}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-app__container{width:100%;align-self:center}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-app__container .kbq-app-switcher-dropdown-app__name{display:flex;flex-direction:row;justify-content:space-between}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-app__container .kbq-app-switcher-dropdown-app__caption{margin-left:var(--kbq-size-3xs)}.kbq-app-switcher-dropdown-app .kbq-dropdown-item__caption{padding-top:var(--kbq-size-3xs)}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-item-trigger__icon{margin-top:var(--kbq-size-3xs)}.kbq-app-switcher-dropdown-app{background:var(--kbq-list-default-container-background);color:var(--kbq-list-default-text-color)}.kbq-app-switcher-dropdown-app.kbq-dropdown-item_highlighted,.kbq-app-switcher-dropdown-app:hover{background:var(--kbq-states-background-transparent-active)}.kbq-app-switcher-dropdown-app.cdk-keyboard-focused{border-color:var(--kbq-list-states-focused-focus-outline-color)}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-app__caption{color:var(--kbq-dropdown-item-caption-color)}.kbq-app-switcher-dropdown-app{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-app__caption{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}\n"], dependencies: [{ kind: "component", type: KbqIcon, selector: "[kbq-icon]", inputs: ["small", "autoColor", "kbq-icon"] }, { kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "decoding", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
87
+ `, isInline: true, styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:64px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,#0000000a 12px,#ffffff1a 12px 22px,#0000000a 22px 34px,#ffffff1a 34px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}@media(prefers-reduced-motion:reduce){.kbq-progress:after{animation:none}}.kbq-group{display:flex;flex-direction:row}.kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-size-border-width))}.kbq-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-vertical-group{display:flex;flex-direction:column}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-size-border-width))}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-truncate-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-no-select{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-app-switcher-dropdown-app{display:flex;flex-direction:row;width:100%;min-height:50px;border-radius:var(--kbq-size-xs);border:var(--kbq-size-3xs) solid transparent;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;text-decoration:none;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent;cursor:pointer;padding:var(--kbq-size-xxs) var(--kbq-size-m)}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-app__icon{padding-top:var(--kbq-size-s);padding-right:var(--kbq-size-m)}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-app__container{width:100%;align-self:center}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-app__container .kbq-app-switcher-dropdown-app__name{display:flex;flex-direction:row;justify-content:space-between}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-app__container .kbq-app-switcher-dropdown-app__caption{margin-left:var(--kbq-size-3xs)}.kbq-app-switcher-dropdown-app .kbq-dropdown-item__caption{padding-top:var(--kbq-size-3xs)}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-item-trigger__icon{margin-top:var(--kbq-size-3xs)}.kbq-app-switcher-dropdown-app{background:var(--kbq-list-default-container-background);color:var(--kbq-list-default-text-color)}.kbq-app-switcher-dropdown-app.kbq-dropdown-item_highlighted,.kbq-app-switcher-dropdown-app:hover,.kbq-app-switcher-dropdown-app.cdk-keyboard-focused{background:var(--kbq-states-background-transparent-hover)}.kbq-app-switcher-dropdown-app:active,.kbq-app-switcher-dropdown-app.kbq-active{background:var(--kbq-states-background-transparent-active)}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-app__caption{color:var(--kbq-dropdown-item-caption-color)}.kbq-app-switcher-dropdown-app{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-app__caption{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}\n"], dependencies: [{ kind: "component", type: KbqIcon, selector: "[kbq-icon]", inputs: ["small", "autoColor", "kbq-icon"] }, { kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "decoding", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
86
88
  }
87
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqAppSwitcherDropdownApp, decorators: [{
89
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqAppSwitcherDropdownApp, decorators: [{
88
90
  type: Component,
89
91
  args: [{ selector: '[kbq-app-switcher-dropdown-app]', imports: [KbqIcon, NgOptimizedImage], template: `
90
92
  <i class="kbq kbq-icon" [className]=""></i>
@@ -117,8 +119,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
117
119
  { provide: KbqDropdownItem, useExisting: KbqAppSwitcherDropdownApp }
118
120
  ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
119
121
  class: 'kbq-app-switcher-dropdown-app',
120
- '[class.kbq-dropdown-item]': 'false'
121
- }, exportAs: 'kbqAppSwitcherDropdownApp', styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:64px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,#0000000a 12px,#ffffff1a 12px 22px,#0000000a 22px 34px,#ffffff1a 34px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}@media(prefers-reduced-motion:reduce){.kbq-progress:after{animation:none}}.kbq-group{display:flex;flex-direction:row}.kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-size-border-width))}.kbq-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-vertical-group{display:flex;flex-direction:column}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-size-border-width))}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-truncate-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-no-select{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-app-switcher-dropdown-app{display:flex;flex-direction:row;width:100%;min-height:50px;border-radius:var(--kbq-size-xs);border:var(--kbq-size-3xs) solid transparent;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;text-decoration:none;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent;cursor:pointer;padding:var(--kbq-size-xxs) var(--kbq-size-m)}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-app__icon{padding-top:var(--kbq-size-s);padding-right:var(--kbq-size-m)}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-app__container{width:100%;align-self:center}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-app__container .kbq-app-switcher-dropdown-app__name{display:flex;flex-direction:row;justify-content:space-between}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-app__container .kbq-app-switcher-dropdown-app__caption{margin-left:var(--kbq-size-3xs)}.kbq-app-switcher-dropdown-app .kbq-dropdown-item__caption{padding-top:var(--kbq-size-3xs)}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-item-trigger__icon{margin-top:var(--kbq-size-3xs)}.kbq-app-switcher-dropdown-app{background:var(--kbq-list-default-container-background);color:var(--kbq-list-default-text-color)}.kbq-app-switcher-dropdown-app.kbq-dropdown-item_highlighted,.kbq-app-switcher-dropdown-app:hover{background:var(--kbq-states-background-transparent-active)}.kbq-app-switcher-dropdown-app.cdk-keyboard-focused{border-color:var(--kbq-list-states-focused-focus-outline-color)}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-app__caption{color:var(--kbq-dropdown-item-caption-color)}.kbq-app-switcher-dropdown-app{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-app__caption{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}\n"] }]
122
+ role: 'menuitem',
123
+ '[class.kbq-dropdown-item]': 'false',
124
+ '[attr.tabindex]': 'getTabIndex()',
125
+ '[attr.aria-haspopup]': "isNested ? 'menu' : null"
126
+ }, exportAs: 'kbqAppSwitcherDropdownApp', styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:64px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,#0000000a 12px,#ffffff1a 12px 22px,#0000000a 22px 34px,#ffffff1a 34px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}@media(prefers-reduced-motion:reduce){.kbq-progress:after{animation:none}}.kbq-group{display:flex;flex-direction:row}.kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-size-border-width))}.kbq-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-vertical-group{display:flex;flex-direction:column}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-size-border-width))}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-truncate-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-no-select{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-app-switcher-dropdown-app{display:flex;flex-direction:row;width:100%;min-height:50px;border-radius:var(--kbq-size-xs);border:var(--kbq-size-3xs) solid transparent;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;text-decoration:none;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent;cursor:pointer;padding:var(--kbq-size-xxs) var(--kbq-size-m)}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-app__icon{padding-top:var(--kbq-size-s);padding-right:var(--kbq-size-m)}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-app__container{width:100%;align-self:center}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-app__container .kbq-app-switcher-dropdown-app__name{display:flex;flex-direction:row;justify-content:space-between}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-app__container .kbq-app-switcher-dropdown-app__caption{margin-left:var(--kbq-size-3xs)}.kbq-app-switcher-dropdown-app .kbq-dropdown-item__caption{padding-top:var(--kbq-size-3xs)}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-item-trigger__icon{margin-top:var(--kbq-size-3xs)}.kbq-app-switcher-dropdown-app{background:var(--kbq-list-default-container-background);color:var(--kbq-list-default-text-color)}.kbq-app-switcher-dropdown-app.kbq-dropdown-item_highlighted,.kbq-app-switcher-dropdown-app:hover,.kbq-app-switcher-dropdown-app.cdk-keyboard-focused{background:var(--kbq-states-background-transparent-hover)}.kbq-app-switcher-dropdown-app:active,.kbq-app-switcher-dropdown-app.kbq-active{background:var(--kbq-states-background-transparent-active)}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-app__caption{color:var(--kbq-dropdown-item-caption-color)}.kbq-app-switcher-dropdown-app{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-app-switcher-dropdown-app .kbq-app-switcher-dropdown-app__caption{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}\n"] }]
122
127
  }], propDecorators: { app: [{
123
128
  type: Input,
124
129
  args: ['kbq-app-switcher-dropdown-app']
@@ -126,8 +131,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
126
131
 
127
132
  /** @docs-private */
128
133
  class KbqAppSwitcherDropdownSite extends KbqDropdownItem {
129
- /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqAppSwitcherDropdownSite, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
130
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: KbqAppSwitcherDropdownSite, isStandalone: true, selector: "[kbq-app-switcher-dropdown-site]", inputs: { site: ["kbq-app-switcher-dropdown-site", "site"] }, host: { properties: { "class.kbq-dropdown-item": "false" }, classAttribute: "kbq-app-switcher-dropdown-site" }, providers: [
134
+ /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqAppSwitcherDropdownSite, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
135
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.30", type: KbqAppSwitcherDropdownSite, isStandalone: true, selector: "[kbq-app-switcher-dropdown-site]", inputs: { site: ["kbq-app-switcher-dropdown-site", "site"] }, host: { attributes: { "role": "menuitem" }, properties: { "class.kbq-dropdown-item": "false", "attr.tabindex": "getTabIndex()", "attr.aria-haspopup": "isNested ? 'menu' : null" }, classAttribute: "kbq-app-switcher-dropdown-site" }, providers: [
131
136
  { provide: KBQ_TITLE_TEXT_REF, useExisting: KbqAppSwitcherDropdownSite },
132
137
  { provide: KbqDropdownItem, useExisting: KbqAppSwitcherDropdownSite }
133
138
  ], exportAs: ["kbqAppSwitcherDropdownSite"], usesInheritance: true, ngImport: i0, template: `
@@ -144,9 +149,9 @@ class KbqAppSwitcherDropdownSite extends KbqDropdownItem {
144
149
  [color]="componentColors.ContrastFade"
145
150
  ></i>
146
151
  }
147
- `, isInline: true, styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:64px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,#0000000a 12px,#ffffff1a 12px 22px,#0000000a 22px 34px,#ffffff1a 34px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}@media(prefers-reduced-motion:reduce){.kbq-progress:after{animation:none}}.kbq-group{display:flex;flex-direction:row}.kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-size-border-width))}.kbq-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-vertical-group{display:flex;flex-direction:column}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-size-border-width))}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-truncate-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-no-select{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-app-switcher-dropdown-site{justify-content:space-between;width:100%;min-height:var(--kbq-size-3xl);text-decoration:none;border-radius:var(--kbq-size-xs);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative;display:flex;flex-direction:row;align-items:center;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent;min-height:32px;gap:var(--kbq-size-s);border:var(--kbq-size-3xs) solid transparent;padding:var(--kbq-size-xxs) calc(var(--kbq-size-m) - var(--kbq-size-3xs))}.kbq-app-switcher-dropdown-site .kbq-list-text>*{margin:0;padding:0;font-weight:400;font-size:inherit}.kbq-app-switcher-dropdown-site .kbq-list-text{display:flex;flex-direction:column;width:100%;box-sizing:content-box;overflow:hidden}.kbq-app-switcher-dropdown-site .kbq-list-text:empty{display:none}.kbq-app-switcher-dropdown-site .kbq-list-text{display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-app-switcher-dropdown-site .kbq-list-option-caption{padding-top:var(--kbq-size-3xs)}.kbq-app-switcher-dropdown-site{padding:var(--kbq-size-xxs) var(--kbq-size-m)}.kbq-app-switcher-dropdown-site .kbq-app-switcher-dropdown-item-trigger__icon,.kbq-app-switcher-dropdown-site .kbq-badge{margin-top:var(--kbq-size-3xs);align-self:flex-start}.kbq-app-switcher-dropdown-site{background:var(--kbq-list-default-container-background);color:var(--kbq-list-default-text-color)}.kbq-app-switcher-dropdown-site.kbq-dropdown-item_highlighted,.kbq-app-switcher-dropdown-site:hover{background:var(--kbq-states-background-transparent-active)}.kbq-app-switcher-dropdown-site.cdk-keyboard-focused{border-color:var(--kbq-list-states-focused-focus-outline-color)}.kbq-app-switcher-dropdown-site{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}\n"], dependencies: [{ kind: "component", type: KbqIcon, selector: "[kbq-icon]", inputs: ["small", "autoColor", "kbq-icon"] }, { kind: "ngmodule", type: KbqBadgeModule }, { kind: "component", type: i1.KbqBadge, selector: "kbq-badge", inputs: ["compact", "outline", "badgeColor"] }, { kind: "directive", type: i1.KbqBadgeCssStyler, selector: "kbq-badge" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
152
+ `, isInline: true, styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:64px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,#0000000a 12px,#ffffff1a 12px 22px,#0000000a 22px 34px,#ffffff1a 34px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}@media(prefers-reduced-motion:reduce){.kbq-progress:after{animation:none}}.kbq-group{display:flex;flex-direction:row}.kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-size-border-width))}.kbq-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-vertical-group{display:flex;flex-direction:column}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-size-border-width))}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-truncate-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-no-select{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-app-switcher-dropdown-site{justify-content:space-between;width:100%;min-height:var(--kbq-size-3xl);text-decoration:none;border-radius:var(--kbq-size-xs);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative;display:flex;flex-direction:row;align-items:center;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent;min-height:32px;gap:var(--kbq-size-s);border:var(--kbq-size-3xs) solid transparent;padding:var(--kbq-size-xxs) calc(var(--kbq-size-m) - var(--kbq-size-3xs))}.kbq-app-switcher-dropdown-site .kbq-list-text>*{margin:0;padding:0;font-weight:400;font-size:inherit}.kbq-app-switcher-dropdown-site .kbq-list-text{display:flex;flex-direction:column;width:100%;box-sizing:content-box;overflow:hidden}.kbq-app-switcher-dropdown-site .kbq-list-text:empty{display:none}.kbq-app-switcher-dropdown-site .kbq-list-text{display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-app-switcher-dropdown-site .kbq-list-option-caption{padding-top:var(--kbq-size-3xs)}.kbq-app-switcher-dropdown-site{padding:var(--kbq-size-xxs) var(--kbq-size-m)}.kbq-app-switcher-dropdown-site .kbq-app-switcher-dropdown-item-trigger__icon,.kbq-app-switcher-dropdown-site .kbq-badge{margin-top:var(--kbq-size-3xs);align-self:flex-start}.kbq-app-switcher-dropdown-site{background:var(--kbq-list-default-container-background);color:var(--kbq-list-default-text-color)}.kbq-app-switcher-dropdown-site.kbq-dropdown-item_highlighted,.kbq-app-switcher-dropdown-site:hover,.kbq-app-switcher-dropdown-site.cdk-keyboard-focused{background:var(--kbq-states-background-transparent-hover)}.kbq-app-switcher-dropdown-site:active,.kbq-app-switcher-dropdown-site.kbq-active{background:var(--kbq-states-background-transparent-active)}.kbq-app-switcher-dropdown-site{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}\n"], dependencies: [{ kind: "component", type: KbqIcon, selector: "[kbq-icon]", inputs: ["small", "autoColor", "kbq-icon"] }, { kind: "ngmodule", type: KbqBadgeModule }, { kind: "component", type: i1.KbqBadge, selector: "kbq-badge", inputs: ["compact", "outline", "badgeColor"] }, { kind: "directive", type: i1.KbqBadgeCssStyler, selector: "kbq-badge" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
148
153
  }
149
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqAppSwitcherDropdownSite, decorators: [{
154
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqAppSwitcherDropdownSite, decorators: [{
150
155
  type: Component,
151
156
  args: [{ selector: '[kbq-app-switcher-dropdown-site]', imports: [
152
157
  KbqIcon,
@@ -170,8 +175,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
170
175
  { provide: KbqDropdownItem, useExisting: KbqAppSwitcherDropdownSite }
171
176
  ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
172
177
  class: 'kbq-app-switcher-dropdown-site',
173
- '[class.kbq-dropdown-item]': 'false'
174
- }, exportAs: 'kbqAppSwitcherDropdownSite', styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:64px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,#0000000a 12px,#ffffff1a 12px 22px,#0000000a 22px 34px,#ffffff1a 34px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}@media(prefers-reduced-motion:reduce){.kbq-progress:after{animation:none}}.kbq-group{display:flex;flex-direction:row}.kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-size-border-width))}.kbq-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-vertical-group{display:flex;flex-direction:column}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-size-border-width))}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-truncate-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-no-select{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-app-switcher-dropdown-site{justify-content:space-between;width:100%;min-height:var(--kbq-size-3xl);text-decoration:none;border-radius:var(--kbq-size-xs);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative;display:flex;flex-direction:row;align-items:center;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent;min-height:32px;gap:var(--kbq-size-s);border:var(--kbq-size-3xs) solid transparent;padding:var(--kbq-size-xxs) calc(var(--kbq-size-m) - var(--kbq-size-3xs))}.kbq-app-switcher-dropdown-site .kbq-list-text>*{margin:0;padding:0;font-weight:400;font-size:inherit}.kbq-app-switcher-dropdown-site .kbq-list-text{display:flex;flex-direction:column;width:100%;box-sizing:content-box;overflow:hidden}.kbq-app-switcher-dropdown-site .kbq-list-text:empty{display:none}.kbq-app-switcher-dropdown-site .kbq-list-text{display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-app-switcher-dropdown-site .kbq-list-option-caption{padding-top:var(--kbq-size-3xs)}.kbq-app-switcher-dropdown-site{padding:var(--kbq-size-xxs) var(--kbq-size-m)}.kbq-app-switcher-dropdown-site .kbq-app-switcher-dropdown-item-trigger__icon,.kbq-app-switcher-dropdown-site .kbq-badge{margin-top:var(--kbq-size-3xs);align-self:flex-start}.kbq-app-switcher-dropdown-site{background:var(--kbq-list-default-container-background);color:var(--kbq-list-default-text-color)}.kbq-app-switcher-dropdown-site.kbq-dropdown-item_highlighted,.kbq-app-switcher-dropdown-site:hover{background:var(--kbq-states-background-transparent-active)}.kbq-app-switcher-dropdown-site.cdk-keyboard-focused{border-color:var(--kbq-list-states-focused-focus-outline-color)}.kbq-app-switcher-dropdown-site{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}\n"] }]
178
+ role: 'menuitem',
179
+ '[class.kbq-dropdown-item]': 'false',
180
+ '[attr.tabindex]': 'getTabIndex()',
181
+ '[attr.aria-haspopup]': "isNested ? 'menu' : null"
182
+ }, exportAs: 'kbqAppSwitcherDropdownSite', styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:64px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,#0000000a 12px,#ffffff1a 12px 22px,#0000000a 22px 34px,#ffffff1a 34px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}@media(prefers-reduced-motion:reduce){.kbq-progress:after{animation:none}}.kbq-group{display:flex;flex-direction:row}.kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-size-border-width))}.kbq-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-vertical-group{display:flex;flex-direction:column}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-size-border-width))}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-truncate-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-no-select{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-app-switcher-dropdown-site{justify-content:space-between;width:100%;min-height:var(--kbq-size-3xl);text-decoration:none;border-radius:var(--kbq-size-xs);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;position:relative;display:flex;flex-direction:row;align-items:center;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent;min-height:32px;gap:var(--kbq-size-s);border:var(--kbq-size-3xs) solid transparent;padding:var(--kbq-size-xxs) calc(var(--kbq-size-m) - var(--kbq-size-3xs))}.kbq-app-switcher-dropdown-site .kbq-list-text>*{margin:0;padding:0;font-weight:400;font-size:inherit}.kbq-app-switcher-dropdown-site .kbq-list-text{display:flex;flex-direction:column;width:100%;box-sizing:content-box;overflow:hidden}.kbq-app-switcher-dropdown-site .kbq-list-text:empty{display:none}.kbq-app-switcher-dropdown-site .kbq-list-text{display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-app-switcher-dropdown-site .kbq-list-option-caption{padding-top:var(--kbq-size-3xs)}.kbq-app-switcher-dropdown-site{padding:var(--kbq-size-xxs) var(--kbq-size-m)}.kbq-app-switcher-dropdown-site .kbq-app-switcher-dropdown-item-trigger__icon,.kbq-app-switcher-dropdown-site .kbq-badge{margin-top:var(--kbq-size-3xs);align-self:flex-start}.kbq-app-switcher-dropdown-site{background:var(--kbq-list-default-container-background);color:var(--kbq-list-default-text-color)}.kbq-app-switcher-dropdown-site.kbq-dropdown-item_highlighted,.kbq-app-switcher-dropdown-site:hover,.kbq-app-switcher-dropdown-site.cdk-keyboard-focused{background:var(--kbq-states-background-transparent-hover)}.kbq-app-switcher-dropdown-site:active,.kbq-app-switcher-dropdown-site.kbq-active{background:var(--kbq-states-background-transparent-active)}.kbq-app-switcher-dropdown-site{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}\n"] }]
175
183
  }], propDecorators: { site: [{
176
184
  type: Input,
177
185
  args: ['kbq-app-switcher-dropdown-site']
@@ -183,6 +191,8 @@ class KbqAppSwitcherListItem extends KbqDropdownItem {
183
191
  super(...arguments);
184
192
  this.sanitizer = inject(DomSanitizer);
185
193
  this.toggle = input(false, ...(ngDevMode ? [{ debugName: "toggle", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
194
+ /** Search query to highlight within the app name. */
195
+ this.highlightText = input('', ...(ngDevMode ? [{ debugName: "highlightText" }] : []));
186
196
  // TODO: Skipped for migration because:
187
197
  // Your application code writes to the input. This prevents migration.
188
198
  this.collapsed = false;
@@ -197,8 +207,8 @@ class KbqAppSwitcherListItem extends KbqDropdownItem {
197
207
  getIcon(icon) {
198
208
  return this.sanitizer.bypassSecurityTrustHtml(icon || '');
199
209
  }
200
- /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqAppSwitcherListItem, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
201
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: KbqAppSwitcherListItem, isStandalone: true, selector: "[kbq-app-switcher-list-item]", inputs: { app: { classPropertyName: "app", publicName: "app", isSignal: false, isRequired: false, transformFunction: null }, toggle: { classPropertyName: "toggle", publicName: "toggle", isSignal: true, isRequired: false, transformFunction: null }, collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: false, isRequired: false, transformFunction: booleanAttribute } }, host: { listeners: { "click": "clickHandler($event)" }, properties: { "class.kbq-dropdown-item": "false" }, classAttribute: "kbq-app-switcher-list-item" }, providers: [
210
+ /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqAppSwitcherListItem, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
211
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.30", type: KbqAppSwitcherListItem, isStandalone: true, selector: "[kbq-app-switcher-list-item]", inputs: { app: { classPropertyName: "app", publicName: "app", isSignal: false, isRequired: false, transformFunction: null }, toggle: { classPropertyName: "toggle", publicName: "toggle", isSignal: true, isRequired: false, transformFunction: null }, highlightText: { classPropertyName: "highlightText", publicName: "highlightText", isSignal: true, isRequired: false, transformFunction: null }, collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: false, isRequired: false, transformFunction: booleanAttribute } }, host: { attributes: { "role": "menuitem" }, listeners: { "click": "clickHandler($event)" }, properties: { "class.kbq-dropdown-item": "false", "attr.tabindex": "getTabIndex()", "attr.aria-expanded": "toggle() ? !collapsed : null" }, classAttribute: "kbq-app-switcher-list-item" }, providers: [
202
212
  { provide: KBQ_TITLE_TEXT_REF, useExisting: KbqAppSwitcherListItem },
203
213
  { provide: KbqDropdownItem, useExisting: KbqAppSwitcherListItem }
204
214
  ], exportAs: ["kbqAppSwitcherApp"], usesInheritance: true, ngImport: i0, template: `
@@ -211,7 +221,10 @@ class KbqAppSwitcherListItem extends KbqDropdownItem {
211
221
  }
212
222
 
213
223
  <div class="kbq-app-switcher-list-item__container">
214
- <div class="kbq-app-switcher-list-item__name">{{ app.name }}</div>
224
+ <div
225
+ class="kbq-app-switcher-list-item__name"
226
+ [innerHTML]="app.name | kbqHighlightBackground: highlightText()"
227
+ ></div>
215
228
  @if (app.caption) {
216
229
  <div class="kbq-app-switcher-list-item__caption">{{ app.caption }}</div>
217
230
  }
@@ -222,13 +235,14 @@ class KbqAppSwitcherListItem extends KbqDropdownItem {
222
235
  <i kbq-icon="kbq-chevron-down-s_16" [color]="'contrast-fade'"></i>
223
236
  </div>
224
237
  }
225
- `, isInline: true, styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:64px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,#0000000a 12px,#ffffff1a 12px 22px,#0000000a 22px 34px,#ffffff1a 34px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}@media(prefers-reduced-motion:reduce){.kbq-progress:after{animation:none}}.kbq-group{display:flex;flex-direction:row}.kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-size-border-width))}.kbq-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-vertical-group{display:flex;flex-direction:column}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-size-border-width))}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-truncate-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-no-select{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-app-switcher-list-item{position:relative;display:flex;flex-direction:row;max-width:100%;min-height:38px;border-radius:var(--kbq-size-s);padding:var(--kbq-size-xxs) var(--kbq-size-m) var(--kbq-size-xs) var(--kbq-size-m);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;text-decoration:none;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent;cursor:pointer}.kbq-app-switcher-list-item.kbq-app-switcher-site_nested{margin-left:var(--kbq-size-xxl);border-top-left-radius:unset;border-bottom-left-radius:unset}.kbq-app-switcher-list-item.kbq-app-switcher-site_nested:after{content:\"\";position:absolute;left:-1px;top:0;height:100%;border-left-width:1px;border-left-style:solid}.kbq-app-switcher-list-item.kbq-app-switcher-site_nested:has(+:not(.kbq-app-switcher-site_nested)),.kbq-app-switcher-list-item.kbq-app-switcher-site_nested:last-child{border-bottom-left-radius:var(--kbq-size-s)}.kbq-app-switcher-list-item.kbq-app-switcher-site_nested:has(+:not(.kbq-app-switcher-site_nested)):after,.kbq-app-switcher-list-item.kbq-app-switcher-site_nested:last-child:after{top:0;width:var(--kbq-size-m);height:var(--kbq-size-xxl);border-bottom-left-radius:var(--kbq-size-s);border-bottom-width:1px;border-bottom-style:solid}.kbq-app-switcher-list-item__toggle{position:absolute;display:none;align-items:center;justify-content:center;top:var(--kbq-size-m);left:var(--kbq-size-m);width:var(--kbq-size-xxl);height:var(--kbq-size-xxl);border-radius:var(--kbq-size-xxs)}.kbq-app-switcher-list-item__toggle .kbq-icon{transform:rotate(0)}.kbq-app-switcher-list-item__toggle.kbq-expanded .kbq-icon{transform:rotate(180deg)}.kbq-app-switcher-list-item__icon{padding-top:var(--kbq-size-s);padding-right:var(--kbq-size-m)}.kbq-app-switcher-list-item__container{max-width:100%;min-width:0;align-self:center}.kbq-app-switcher-list-item__container .kbq-app-switcher-list-item__name,.kbq-app-switcher-list-item__container .kbq-app-switcher-list-item__caption{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-app-switcher-site_nested:after{border-left-color:var(--kbq-line-contrast-less);border-bottom-color:var(--kbq-line-contrast-less)}.kbq-app-switcher-list-item__caption{color:var(--kbq-foreground-contrast-secondary)}.kbq-app-switcher-list-item:hover:has(.kbq-app-switcher-list-item__toggle) .kbq-app-switcher-list-item__icon,.kbq-app-switcher-list-item.kbq-hover:has(.kbq-app-switcher-list-item__toggle) .kbq-app-switcher-list-item__icon,.kbq-app-switcher-list-item.kbq-focused:has(.kbq-app-switcher-list-item__toggle) .kbq-app-switcher-list-item__icon{visibility:hidden}.kbq-app-switcher-list-item:hover .kbq-app-switcher-list-item__toggle,.kbq-app-switcher-list-item.kbq-hover .kbq-app-switcher-list-item__toggle,.kbq-app-switcher-list-item.kbq-focused .kbq-app-switcher-list-item__toggle{display:flex}.kbq-app-switcher-list-item:hover,.kbq-app-switcher-list-item.kbq-hover,.kbq-app-switcher-list-item:hover .kbq-app-switcher-list-item__toggle,.kbq-app-switcher-list-item.kbq-hover .kbq-app-switcher-list-item__toggle{background:var(--kbq-states-background-transparent-hover)}.kbq-app-switcher-list-item:active,.kbq-app-switcher-list-item.kbq-active{background:var(--kbq-states-background-transparent-active)}.kbq-app-switcher-list-item.kbq-selected{background:var(--kbq-background-theme-less)}.kbq-app-switcher-list-item.kbq-selected:hover,.kbq-app-switcher-list-item.kbq-selected.kbq-hover{background:var(--kbq-states-background-theme-less-hover)}.kbq-app-switcher-list-item.kbq-selected:active,.kbq-app-switcher-list-item.kbq-selected.kbq-active{background:var(--kbq-states-background-theme-less-active)}.kbq-app-switcher-list-item{background:var(--kbq-list-default-container-background);color:var(--kbq-list-default-text-color)}.kbq-app-switcher-list-item.cdk-keyboard-focused{outline:none;border-color:var(--kbq-list-states-focused-focus-outline-color)}.kbq-app-switcher-list-item__name{font-size:var(--kbq-typography-text-normal-medium-font-size);font-style:var(--kbq-typography-text-normal-medium-font-style);font-weight:var(--kbq-typography-text-normal-medium-font-weight);line-height:var(--kbq-typography-text-normal-medium-line-height);font-family:var(--kbq-typography-text-normal-medium-font-family);text-transform:var(--kbq-typography-text-normal-medium-text-transform);font-feature-settings:var(--kbq-typography-text-normal-medium-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-medium-letter-spacing)}.kbq-app-switcher-list-item__caption{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}\n"], dependencies: [{ kind: "ngmodule", type: KbqIconModule }, { kind: "component", type: i1$1.KbqIcon, selector: "[kbq-icon]", inputs: ["small", "autoColor", "kbq-icon"] }, { kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "decoding", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
238
+ `, isInline: true, styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:64px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,#0000000a 12px,#ffffff1a 12px 22px,#0000000a 22px 34px,#ffffff1a 34px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}@media(prefers-reduced-motion:reduce){.kbq-progress:after{animation:none}}.kbq-group{display:flex;flex-direction:row}.kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-size-border-width))}.kbq-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-vertical-group{display:flex;flex-direction:column}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-size-border-width))}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-truncate-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-no-select{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-app-switcher-list-item{position:relative;display:flex;flex-direction:row;max-width:100%;min-height:38px;border-radius:var(--kbq-size-s);padding:var(--kbq-size-xxs) var(--kbq-size-m) var(--kbq-size-xs) var(--kbq-size-m);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;text-decoration:none;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent;cursor:pointer}.kbq-app-switcher-list-item.kbq-app-switcher-site_nested{margin-left:var(--kbq-size-xxl);border-top-left-radius:unset;border-bottom-left-radius:unset}.kbq-app-switcher-list-item.kbq-app-switcher-site_nested:after{content:\"\";position:absolute;left:-1px;top:0;height:100%;border-left-width:1px;border-left-style:solid}.kbq-app-switcher-list-item.kbq-app-switcher-site_nested:has(+:not(.kbq-app-switcher-site_nested)),.kbq-app-switcher-list-item.kbq-app-switcher-site_nested:last-child{border-bottom-left-radius:var(--kbq-size-s)}.kbq-app-switcher-list-item.kbq-app-switcher-site_nested:has(+:not(.kbq-app-switcher-site_nested)):after,.kbq-app-switcher-list-item.kbq-app-switcher-site_nested:last-child:after{top:0;width:var(--kbq-size-m);height:var(--kbq-size-xxl);border-bottom-left-radius:var(--kbq-size-s);border-bottom-width:1px;border-bottom-style:solid}.kbq-app-switcher-list-item__toggle{position:absolute;display:none;align-items:center;justify-content:center;top:var(--kbq-size-m);left:var(--kbq-size-m);width:var(--kbq-size-xxl);height:var(--kbq-size-xxl);border-radius:var(--kbq-size-xxs)}.kbq-app-switcher-list-item__toggle .kbq-icon{transform:rotate(0)}.kbq-app-switcher-list-item__toggle.kbq-expanded .kbq-icon{transform:rotate(180deg)}.kbq-app-switcher-list-item__icon{padding-top:var(--kbq-size-s);padding-right:var(--kbq-size-m)}.kbq-app-switcher-list-item__container{max-width:100%;min-width:0;align-self:center}.kbq-app-switcher-list-item__container .kbq-app-switcher-list-item__name,.kbq-app-switcher-list-item__container .kbq-app-switcher-list-item__caption{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-app-switcher-site_nested:after{border-left-color:var(--kbq-line-contrast-less);border-bottom-color:var(--kbq-line-contrast-less)}.kbq-app-switcher-list-item__caption{color:var(--kbq-foreground-contrast-secondary)}.kbq-app-switcher-list-item:hover:has(.kbq-app-switcher-list-item__toggle) .kbq-app-switcher-list-item__icon,.kbq-app-switcher-list-item.kbq-hover:has(.kbq-app-switcher-list-item__toggle) .kbq-app-switcher-list-item__icon,.kbq-app-switcher-list-item.kbq-focused:has(.kbq-app-switcher-list-item__toggle) .kbq-app-switcher-list-item__icon,.kbq-app-switcher-list-item.cdk-keyboard-focused:has(.kbq-app-switcher-list-item__toggle) .kbq-app-switcher-list-item__icon{visibility:hidden}.kbq-app-switcher-list-item:hover .kbq-app-switcher-list-item__toggle,.kbq-app-switcher-list-item.kbq-hover .kbq-app-switcher-list-item__toggle,.kbq-app-switcher-list-item.kbq-focused .kbq-app-switcher-list-item__toggle,.kbq-app-switcher-list-item.cdk-keyboard-focused .kbq-app-switcher-list-item__toggle{display:flex}.kbq-app-switcher-list-item:hover,.kbq-app-switcher-list-item.kbq-hover,.kbq-app-switcher-list-item.cdk-keyboard-focused,.kbq-app-switcher-list-item:hover .kbq-app-switcher-list-item__toggle,.kbq-app-switcher-list-item.kbq-hover .kbq-app-switcher-list-item__toggle,.kbq-app-switcher-list-item.cdk-keyboard-focused .kbq-app-switcher-list-item__toggle{background:var(--kbq-states-background-transparent-hover)}.kbq-app-switcher-list-item:active,.kbq-app-switcher-list-item.kbq-active{background:var(--kbq-states-background-transparent-active)}.kbq-app-switcher-list-item.kbq-selected{background:var(--kbq-background-theme-less)}.kbq-app-switcher-list-item.kbq-selected:hover,.kbq-app-switcher-list-item.kbq-selected.kbq-hover,.kbq-app-switcher-list-item.kbq-selected.cdk-keyboard-focused{background:var(--kbq-states-background-theme-less-hover)}.kbq-app-switcher-list-item.kbq-selected:active,.kbq-app-switcher-list-item.kbq-selected.kbq-active{background:var(--kbq-states-background-theme-less-active)}.kbq-app-switcher-list-item{background:var(--kbq-list-default-container-background);color:var(--kbq-list-default-text-color)}.kbq-app-switcher-list-item__name{font-size:var(--kbq-typography-text-normal-medium-font-size);font-style:var(--kbq-typography-text-normal-medium-font-style);font-weight:var(--kbq-typography-text-normal-medium-font-weight);line-height:var(--kbq-typography-text-normal-medium-line-height);font-family:var(--kbq-typography-text-normal-medium-font-family);text-transform:var(--kbq-typography-text-normal-medium-text-transform);font-feature-settings:var(--kbq-typography-text-normal-medium-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-medium-letter-spacing)}.kbq-app-switcher-list-item__caption{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}\n"], dependencies: [{ kind: "ngmodule", type: KbqIconModule }, { kind: "component", type: i1$1.KbqIcon, selector: "[kbq-icon]", inputs: ["small", "autoColor", "kbq-icon"] }, { kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "decoding", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }, { kind: "pipe", type: KbqHighlightBackgroundPipe, name: "kbqHighlightBackground" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
226
239
  }
227
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqAppSwitcherListItem, decorators: [{
240
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqAppSwitcherListItem, decorators: [{
228
241
  type: Component,
229
242
  args: [{ selector: '[kbq-app-switcher-list-item]', imports: [
230
243
  KbqIconModule,
231
- NgOptimizedImage
244
+ NgOptimizedImage,
245
+ KbqHighlightBackgroundPipe
232
246
  ], template: `
233
247
  @if (app.icon) {
234
248
  <span class="kbq-app-switcher-list-item__icon" [innerHtml]="getIcon(app.icon)"></span>
@@ -239,7 +253,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
239
253
  }
240
254
 
241
255
  <div class="kbq-app-switcher-list-item__container">
242
- <div class="kbq-app-switcher-list-item__name">{{ app.name }}</div>
256
+ <div
257
+ class="kbq-app-switcher-list-item__name"
258
+ [innerHTML]="app.name | kbqHighlightBackground: highlightText()"
259
+ ></div>
243
260
  @if (app.caption) {
244
261
  <div class="kbq-app-switcher-list-item__caption">{{ app.caption }}</div>
245
262
  }
@@ -255,12 +272,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
255
272
  { provide: KbqDropdownItem, useExisting: KbqAppSwitcherListItem }
256
273
  ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
257
274
  class: 'kbq-app-switcher-list-item',
275
+ role: 'menuitem',
258
276
  '[class.kbq-dropdown-item]': 'false',
277
+ '[attr.tabindex]': 'getTabIndex()',
278
+ '[attr.aria-expanded]': 'toggle() ? !collapsed : null',
259
279
  '(click)': 'clickHandler($event)'
260
- }, exportAs: 'kbqAppSwitcherApp', styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:64px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,#0000000a 12px,#ffffff1a 12px 22px,#0000000a 22px 34px,#ffffff1a 34px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}@media(prefers-reduced-motion:reduce){.kbq-progress:after{animation:none}}.kbq-group{display:flex;flex-direction:row}.kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-size-border-width))}.kbq-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-vertical-group{display:flex;flex-direction:column}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-size-border-width))}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-truncate-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-no-select{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-app-switcher-list-item{position:relative;display:flex;flex-direction:row;max-width:100%;min-height:38px;border-radius:var(--kbq-size-s);padding:var(--kbq-size-xxs) var(--kbq-size-m) var(--kbq-size-xs) var(--kbq-size-m);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;text-decoration:none;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent;cursor:pointer}.kbq-app-switcher-list-item.kbq-app-switcher-site_nested{margin-left:var(--kbq-size-xxl);border-top-left-radius:unset;border-bottom-left-radius:unset}.kbq-app-switcher-list-item.kbq-app-switcher-site_nested:after{content:\"\";position:absolute;left:-1px;top:0;height:100%;border-left-width:1px;border-left-style:solid}.kbq-app-switcher-list-item.kbq-app-switcher-site_nested:has(+:not(.kbq-app-switcher-site_nested)),.kbq-app-switcher-list-item.kbq-app-switcher-site_nested:last-child{border-bottom-left-radius:var(--kbq-size-s)}.kbq-app-switcher-list-item.kbq-app-switcher-site_nested:has(+:not(.kbq-app-switcher-site_nested)):after,.kbq-app-switcher-list-item.kbq-app-switcher-site_nested:last-child:after{top:0;width:var(--kbq-size-m);height:var(--kbq-size-xxl);border-bottom-left-radius:var(--kbq-size-s);border-bottom-width:1px;border-bottom-style:solid}.kbq-app-switcher-list-item__toggle{position:absolute;display:none;align-items:center;justify-content:center;top:var(--kbq-size-m);left:var(--kbq-size-m);width:var(--kbq-size-xxl);height:var(--kbq-size-xxl);border-radius:var(--kbq-size-xxs)}.kbq-app-switcher-list-item__toggle .kbq-icon{transform:rotate(0)}.kbq-app-switcher-list-item__toggle.kbq-expanded .kbq-icon{transform:rotate(180deg)}.kbq-app-switcher-list-item__icon{padding-top:var(--kbq-size-s);padding-right:var(--kbq-size-m)}.kbq-app-switcher-list-item__container{max-width:100%;min-width:0;align-self:center}.kbq-app-switcher-list-item__container .kbq-app-switcher-list-item__name,.kbq-app-switcher-list-item__container .kbq-app-switcher-list-item__caption{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-app-switcher-site_nested:after{border-left-color:var(--kbq-line-contrast-less);border-bottom-color:var(--kbq-line-contrast-less)}.kbq-app-switcher-list-item__caption{color:var(--kbq-foreground-contrast-secondary)}.kbq-app-switcher-list-item:hover:has(.kbq-app-switcher-list-item__toggle) .kbq-app-switcher-list-item__icon,.kbq-app-switcher-list-item.kbq-hover:has(.kbq-app-switcher-list-item__toggle) .kbq-app-switcher-list-item__icon,.kbq-app-switcher-list-item.kbq-focused:has(.kbq-app-switcher-list-item__toggle) .kbq-app-switcher-list-item__icon{visibility:hidden}.kbq-app-switcher-list-item:hover .kbq-app-switcher-list-item__toggle,.kbq-app-switcher-list-item.kbq-hover .kbq-app-switcher-list-item__toggle,.kbq-app-switcher-list-item.kbq-focused .kbq-app-switcher-list-item__toggle{display:flex}.kbq-app-switcher-list-item:hover,.kbq-app-switcher-list-item.kbq-hover,.kbq-app-switcher-list-item:hover .kbq-app-switcher-list-item__toggle,.kbq-app-switcher-list-item.kbq-hover .kbq-app-switcher-list-item__toggle{background:var(--kbq-states-background-transparent-hover)}.kbq-app-switcher-list-item:active,.kbq-app-switcher-list-item.kbq-active{background:var(--kbq-states-background-transparent-active)}.kbq-app-switcher-list-item.kbq-selected{background:var(--kbq-background-theme-less)}.kbq-app-switcher-list-item.kbq-selected:hover,.kbq-app-switcher-list-item.kbq-selected.kbq-hover{background:var(--kbq-states-background-theme-less-hover)}.kbq-app-switcher-list-item.kbq-selected:active,.kbq-app-switcher-list-item.kbq-selected.kbq-active{background:var(--kbq-states-background-theme-less-active)}.kbq-app-switcher-list-item{background:var(--kbq-list-default-container-background);color:var(--kbq-list-default-text-color)}.kbq-app-switcher-list-item.cdk-keyboard-focused{outline:none;border-color:var(--kbq-list-states-focused-focus-outline-color)}.kbq-app-switcher-list-item__name{font-size:var(--kbq-typography-text-normal-medium-font-size);font-style:var(--kbq-typography-text-normal-medium-font-style);font-weight:var(--kbq-typography-text-normal-medium-font-weight);line-height:var(--kbq-typography-text-normal-medium-line-height);font-family:var(--kbq-typography-text-normal-medium-font-family);text-transform:var(--kbq-typography-text-normal-medium-text-transform);font-feature-settings:var(--kbq-typography-text-normal-medium-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-medium-letter-spacing)}.kbq-app-switcher-list-item__caption{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}\n"] }]
280
+ }, exportAs: 'kbqAppSwitcherApp', styles: ["@keyframes kbq-progress{0%{background-position:0 0}to{background-position:64px 0}}.kbq-progress{position:relative}.kbq-progress:after{content:\"\";position:absolute;border-radius:inherit;inset:0;background:linear-gradient(135deg,#0000000a 12px,#ffffff1a 12px 22px,#0000000a 22px 34px,#ffffff1a 34px) repeat;background-size:32px 32px;animation:kbq-progress 1s linear infinite}@media(prefers-reduced-motion:reduce){.kbq-progress:after{animation:none}}.kbq-group{display:flex;flex-direction:row}.kbq-group_justified>.kbq-group-item{width:100%}.kbq-group .kbq-group-item+.kbq-group-item{margin-left:calc(-1 * var(--kbq-size-border-width))}.kbq-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child){border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-top-right-radius:0}.kbq-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-bottom-left-radius:0;border-top-left-radius:0}.kbq-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-vertical-group{display:flex;flex-direction:column}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0;border-top-right-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child){border-top-right-radius:0;border-top-left-radius:0;border-bottom-left-radius:var(--kbq-size-border-radius)}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child){border-radius:0}.kbq-vertical-group .kbq-group-item+.kbq-group-item{margin-top:calc(-1 * var(--kbq-size-border-width))}.kbq-vertical-group>.kbq-group-item:first-child:not(:last-child) .kbq-form-field__container{border-bottom-right-radius:0;border-bottom-left-radius:0}.kbq-vertical-group>.kbq-group-item:last-child:not(:first-child) .kbq-form-field__container{border-top-right-radius:0;border-top-left-radius:0}.kbq-vertical-group>.kbq-group-item:not(:first-child):not(:last-child) .kbq-form-field__container{border-radius:0}.kbq-truncate-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-no-select{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.kbq-app-switcher-list-item{position:relative;display:flex;flex-direction:row;max-width:100%;min-height:38px;border-radius:var(--kbq-size-s);padding:var(--kbq-size-xxs) var(--kbq-size-m) var(--kbq-size-xs) var(--kbq-size-m);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;text-decoration:none;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent;cursor:pointer}.kbq-app-switcher-list-item.kbq-app-switcher-site_nested{margin-left:var(--kbq-size-xxl);border-top-left-radius:unset;border-bottom-left-radius:unset}.kbq-app-switcher-list-item.kbq-app-switcher-site_nested:after{content:\"\";position:absolute;left:-1px;top:0;height:100%;border-left-width:1px;border-left-style:solid}.kbq-app-switcher-list-item.kbq-app-switcher-site_nested:has(+:not(.kbq-app-switcher-site_nested)),.kbq-app-switcher-list-item.kbq-app-switcher-site_nested:last-child{border-bottom-left-radius:var(--kbq-size-s)}.kbq-app-switcher-list-item.kbq-app-switcher-site_nested:has(+:not(.kbq-app-switcher-site_nested)):after,.kbq-app-switcher-list-item.kbq-app-switcher-site_nested:last-child:after{top:0;width:var(--kbq-size-m);height:var(--kbq-size-xxl);border-bottom-left-radius:var(--kbq-size-s);border-bottom-width:1px;border-bottom-style:solid}.kbq-app-switcher-list-item__toggle{position:absolute;display:none;align-items:center;justify-content:center;top:var(--kbq-size-m);left:var(--kbq-size-m);width:var(--kbq-size-xxl);height:var(--kbq-size-xxl);border-radius:var(--kbq-size-xxs)}.kbq-app-switcher-list-item__toggle .kbq-icon{transform:rotate(0)}.kbq-app-switcher-list-item__toggle.kbq-expanded .kbq-icon{transform:rotate(180deg)}.kbq-app-switcher-list-item__icon{padding-top:var(--kbq-size-s);padding-right:var(--kbq-size-m)}.kbq-app-switcher-list-item__container{max-width:100%;min-width:0;align-self:center}.kbq-app-switcher-list-item__container .kbq-app-switcher-list-item__name,.kbq-app-switcher-list-item__container .kbq-app-switcher-list-item__caption{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kbq-app-switcher-site_nested:after{border-left-color:var(--kbq-line-contrast-less);border-bottom-color:var(--kbq-line-contrast-less)}.kbq-app-switcher-list-item__caption{color:var(--kbq-foreground-contrast-secondary)}.kbq-app-switcher-list-item:hover:has(.kbq-app-switcher-list-item__toggle) .kbq-app-switcher-list-item__icon,.kbq-app-switcher-list-item.kbq-hover:has(.kbq-app-switcher-list-item__toggle) .kbq-app-switcher-list-item__icon,.kbq-app-switcher-list-item.kbq-focused:has(.kbq-app-switcher-list-item__toggle) .kbq-app-switcher-list-item__icon,.kbq-app-switcher-list-item.cdk-keyboard-focused:has(.kbq-app-switcher-list-item__toggle) .kbq-app-switcher-list-item__icon{visibility:hidden}.kbq-app-switcher-list-item:hover .kbq-app-switcher-list-item__toggle,.kbq-app-switcher-list-item.kbq-hover .kbq-app-switcher-list-item__toggle,.kbq-app-switcher-list-item.kbq-focused .kbq-app-switcher-list-item__toggle,.kbq-app-switcher-list-item.cdk-keyboard-focused .kbq-app-switcher-list-item__toggle{display:flex}.kbq-app-switcher-list-item:hover,.kbq-app-switcher-list-item.kbq-hover,.kbq-app-switcher-list-item.cdk-keyboard-focused,.kbq-app-switcher-list-item:hover .kbq-app-switcher-list-item__toggle,.kbq-app-switcher-list-item.kbq-hover .kbq-app-switcher-list-item__toggle,.kbq-app-switcher-list-item.cdk-keyboard-focused .kbq-app-switcher-list-item__toggle{background:var(--kbq-states-background-transparent-hover)}.kbq-app-switcher-list-item:active,.kbq-app-switcher-list-item.kbq-active{background:var(--kbq-states-background-transparent-active)}.kbq-app-switcher-list-item.kbq-selected{background:var(--kbq-background-theme-less)}.kbq-app-switcher-list-item.kbq-selected:hover,.kbq-app-switcher-list-item.kbq-selected.kbq-hover,.kbq-app-switcher-list-item.kbq-selected.cdk-keyboard-focused{background:var(--kbq-states-background-theme-less-hover)}.kbq-app-switcher-list-item.kbq-selected:active,.kbq-app-switcher-list-item.kbq-selected.kbq-active{background:var(--kbq-states-background-theme-less-active)}.kbq-app-switcher-list-item{background:var(--kbq-list-default-container-background);color:var(--kbq-list-default-text-color)}.kbq-app-switcher-list-item__name{font-size:var(--kbq-typography-text-normal-medium-font-size);font-style:var(--kbq-typography-text-normal-medium-font-style);font-weight:var(--kbq-typography-text-normal-medium-font-weight);line-height:var(--kbq-typography-text-normal-medium-line-height);font-family:var(--kbq-typography-text-normal-medium-font-family);text-transform:var(--kbq-typography-text-normal-medium-text-transform);font-feature-settings:var(--kbq-typography-text-normal-medium-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-medium-letter-spacing)}.kbq-app-switcher-list-item__caption{font-size:var(--kbq-typography-text-compact-font-size);font-style:var(--kbq-typography-text-compact-font-style);font-weight:var(--kbq-typography-text-compact-font-weight);line-height:var(--kbq-typography-text-compact-line-height);font-family:var(--kbq-typography-text-compact-font-family);text-transform:var(--kbq-typography-text-compact-text-transform);font-feature-settings:var(--kbq-typography-text-compact-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-letter-spacing)}\n"] }]
261
281
  }], propDecorators: { app: [{
262
282
  type: Input
263
- }], toggle: [{ type: i0.Input, args: [{ isSignal: true, alias: "toggle", required: false }] }], collapsed: [{
283
+ }], toggle: [{ type: i0.Input, args: [{ isSignal: true, alias: "toggle", required: false }] }], highlightText: [{ type: i0.Input, args: [{ isSignal: true, alias: "highlightText", required: false }] }], collapsed: [{
264
284
  type: Input,
265
285
  args: [{ transform: booleanAttribute }]
266
286
  }] } });
@@ -328,6 +348,16 @@ class KbqAppSwitcherComponent extends KbqPopUp {
328
348
  this.input = viewChild(KbqInput, ...(ngDevMode ? [{ debugName: "input" }] : []));
329
349
  /** @docs-private */
330
350
  this.otherSites = viewChild.required('otherSites');
351
+ /** @docs-private */
352
+ this.menuItems = new QueryList();
353
+ /** @docs-private */
354
+ this.dir = inject(Directionality, { optional: true });
355
+ /**
356
+ * CSS class marking a nested alias row, bound in the template (see app-switcher.html). Kept as a
357
+ * single named constant, rather than a literal repeated in both places, so handleGroupHorizontal's
358
+ * classList check can't silently drift from the template's class binding if the class is renamed.
359
+ */
360
+ this.nestedAliasClass = 'kbq-app-switcher-site_nested';
331
361
  this.updateLocaleParams = () => {
332
362
  this.configuration = this.externalConfiguration || this.localeService?.getParams('appSwitcher');
333
363
  this.changeDetectorRef.markForCheck();
@@ -339,6 +369,28 @@ class KbqAppSwitcherComponent extends KbqPopUp {
339
369
  }
340
370
  ngAfterViewInit() {
341
371
  const input = this.input();
372
+ this.keyManager = new FocusKeyManager(this.menuItems)
373
+ .withVerticalOrientation()
374
+ .withHomeAndEnd()
375
+ .withTypeAhead();
376
+ // Focus the first item only once, and only after it is actually rendered (see below).
377
+ let initialItemFocused = false;
378
+ // Build the roving menu from the inline (static-content) items: the flat app rows, expanded
379
+ // aliases and search results (`KbqAppSwitcherListItem`) plus the other-site rows
380
+ // (`KbqAppSwitcherDropdownSite`). The apps inside the site flyouts (`KbqAppSwitcherDropdownApp`)
381
+ // live in their own overlay dropdowns, which drive their own key manager, so they are excluded.
382
+ this.allItems.changes.pipe(startWith(null), takeUntilDestroyed(this.destroyRef)).subscribe(() => {
383
+ this.menuItems.reset(this.allItems.filter((item) => item instanceof KbqAppSwitcherListItem || item instanceof KbqAppSwitcherDropdownSite));
384
+ this.menuItems.notifyOnChanges();
385
+ // When there is no search field, focus the first item on open. The static-content rows live
386
+ // inside a `kbq-dropdown` that only materialises after this component's `ngAfterViewInit`, so
387
+ // focusing eagerly there races the render and silently no-ops in production builds — wait for
388
+ // the items to appear in the query instead.
389
+ if (!input && !initialItemFocused && this.menuItems.length) {
390
+ initialItemFocused = true;
391
+ this.keyManager.setFirstItemActive();
392
+ }
393
+ });
342
394
  if (input) {
343
395
  input.focus();
344
396
  }
@@ -347,7 +399,17 @@ class KbqAppSwitcherComponent extends KbqPopUp {
347
399
  applyPopupMargins(this.renderer, this.elementRef.nativeElement, this.prefix, `${this.offset.toString()}px`);
348
400
  }
349
401
  });
350
- this.searchControl.valueChanges.subscribe((value) => (this.filteredSites = this.filterSites(value)));
402
+ this.searchControl.valueChanges.subscribe((value) => {
403
+ this.filteredSites = this.filterSites(value);
404
+ // Switching between the flat list and the search results swaps the rendered items;
405
+ // drop any stale active item so navigation restarts from the top.
406
+ this.keyManager?.setActiveItem(-1);
407
+ });
408
+ }
409
+ /** Releases the internal roving-focus menu QueryList. */
410
+ ngOnDestroy() {
411
+ this.menuItems.destroy();
412
+ super.ngOnDestroy();
351
413
  }
352
414
  /** @docs-private */
353
415
  updateClassMap(placement, customClass, size) {
@@ -361,6 +423,133 @@ class KbqAppSwitcherComponent extends KbqPopUp {
361
423
  escapeHandler() {
362
424
  this.hide(0);
363
425
  }
426
+ /** Handles keyboard navigation across the app-switcher menu items.
427
+ * @docs-private */
428
+ keydownHandler(event) {
429
+ const keyCode = event.keyCode;
430
+ if (keyCode === ESCAPE) {
431
+ // Stop here so Escape closes only this popup instead of bubbling into overlays opened
432
+ // earlier (mirrors KbqDropdown.handleKeydown).
433
+ event.preventDefault();
434
+ event.stopPropagation();
435
+ this.escapeHandler();
436
+ return;
437
+ }
438
+ // The host `(keydown)` binding is live before `ngAfterViewInit` builds the key manager; until
439
+ // then there is nothing to navigate, so ignore the key (mirrors `focusinHandler`).
440
+ if (!this.keyManager) {
441
+ return;
442
+ }
443
+ // Keep the search field's native typing/caret behaviour; only ArrowDown moves into the list.
444
+ if (this.eventFromInput(event)) {
445
+ if (keyCode === DOWN_ARROW) {
446
+ event.preventDefault();
447
+ this.keyManager.setFocusOrigin('keyboard').setFirstItemActive();
448
+ }
449
+ return;
450
+ }
451
+ // Tab leaves the menu (WAI-ARIA menu pattern): close and move focus to the trigger ourselves.
452
+ // Preventing the default stops the browser from first shifting focus into its own chrome, which
453
+ // would leave the real focus out of sync with the ring shown on the trigger.
454
+ if (keyCode === TAB) {
455
+ event.preventDefault();
456
+ this.hide(0);
457
+ this.trigger.focus();
458
+ return;
459
+ }
460
+ // Any key past this point is a keyboard interaction on a menu item, so show the focus ring.
461
+ this.keyManager.setFocusOrigin('keyboard');
462
+ const activeItem = this.keyManager.activeItem;
463
+ if ((keyCode === LEFT_ARROW || keyCode === RIGHT_ARROW) && this.handleGroupHorizontal(keyCode, activeItem)) {
464
+ event.preventDefault();
465
+ return;
466
+ }
467
+ if ((keyCode === ENTER || keyCode === SPACE) && activeItem && !this.keyManager.isTyping()) {
468
+ event.preventDefault();
469
+ // A group header toggles its aliases; any other item activates its underlying link.
470
+ if (activeItem instanceof KbqAppSwitcherListItem && activeItem.toggle()) {
471
+ activeItem.collapsed = !activeItem.collapsed;
472
+ this.markForCheck();
473
+ }
474
+ else {
475
+ activeItem.getHostElement().click();
476
+ }
477
+ return;
478
+ }
479
+ // ArrowUp on the first item returns focus to the search field (no wrap-around).
480
+ if (keyCode === UP_ARROW && this.keyManager.activeItemIndex === 0 && this.input()) {
481
+ event.preventDefault();
482
+ this.keyManager.setActiveItem(-1);
483
+ this.input().focus();
484
+ return;
485
+ }
486
+ this.keyManager.onKeydown(event);
487
+ }
488
+ /**
489
+ * Expands/collapses an app group (or steps from an alias back to its header) on Left/Right,
490
+ * honouring the current text direction. Returns whether the key was consumed.
491
+ */
492
+ handleGroupHorizontal(keyCode, activeItem) {
493
+ if (!(activeItem instanceof KbqAppSwitcherListItem)) {
494
+ return false;
495
+ }
496
+ const rtl = this.dir?.value === 'rtl';
497
+ const expandKey = rtl ? LEFT_ARROW : RIGHT_ARROW;
498
+ const collapseKey = rtl ? RIGHT_ARROW : LEFT_ARROW;
499
+ if (activeItem.toggle()) {
500
+ if (keyCode === expandKey && activeItem.collapsed) {
501
+ activeItem.collapsed = false;
502
+ this.markForCheck();
503
+ return true;
504
+ }
505
+ if (keyCode === collapseKey && !activeItem.collapsed) {
506
+ activeItem.collapsed = true;
507
+ this.markForCheck();
508
+ return true;
509
+ }
510
+ return false;
511
+ }
512
+ // Collapse key on a nested alias row moves focus back to its parent group header.
513
+ if (keyCode === collapseKey && activeItem.getHostElement().classList.contains(this.nestedAliasClass)) {
514
+ const items = this.menuItems.toArray();
515
+ for (let index = this.keyManager.activeItemIndex - 1; index >= 0; index--) {
516
+ const candidate = items[index];
517
+ if (candidate instanceof KbqAppSwitcherListItem && candidate.toggle()) {
518
+ this.keyManager.setActiveItem(index);
519
+ return true;
520
+ }
521
+ }
522
+ }
523
+ return false;
524
+ }
525
+ /** Whether the keyboard event originated from the search input. */
526
+ eventFromInput(event) {
527
+ return !!event.target?.attributes.getNamedItem('kbqinput');
528
+ }
529
+ /** Syncs the key manager's active item with focus that arrives via Tab, click or a closing flyout.
530
+ * Clears the active item (index -1) when focus lands on a focusable element that isn't one of
531
+ * `menuItems` (e.g. the search field's clear button) - otherwise a stale `activeItem` from before
532
+ * the focus move would keep receiving Enter/Space/arrow-key actions meant for the new target.
533
+ * @docs-private */
534
+ focusinHandler(event) {
535
+ if (!this.keyManager)
536
+ return;
537
+ const index = this.menuItems.toArray().findIndex((item) => item.getHostElement() === event.target);
538
+ this.keyManager.updateActiveItem(index);
539
+ }
540
+ /** Closes the popup once focus leaves the menu and its site flyouts, mirroring the dropdown.
541
+ * @docs-private */
542
+ focusoutHandler(event) {
543
+ const next = event.relatedTarget;
544
+ // Keep open while focus stays inside the popup or moves into a site flyout overlay
545
+ // (flyouts are separate overlays whose panes carry the `.kbq-app-switcher-sites` class).
546
+ if (!next || !next.closest('.kbq-app-switcher, .kbq-app-switcher-sites')) {
547
+ this.hide(0);
548
+ // Return focus to the trigger (the same landing spot as Shift+Tab), instead of
549
+ // leaving it wherever it was heading.
550
+ this.trigger.focus();
551
+ }
552
+ }
364
553
  /** @docs-private */
365
554
  selectAppInSite(site, app) {
366
555
  this.trigger.selectedSite = site;
@@ -384,10 +573,10 @@ class KbqAppSwitcherComponent extends KbqPopUp {
384
573
  initDefaultParams() {
385
574
  this.configuration = KBQ_APP_SWITCHER_DEFAULT_CONFIGURATION;
386
575
  }
387
- /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqAppSwitcherComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
388
- /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.25", type: KbqAppSwitcherComponent, isStandalone: true, selector: "kbq-app-switcher", inputs: { trigger: "trigger" }, host: { classAttribute: "kbq-app-switcher" }, viewQueries: [{ propertyName: "input", first: true, predicate: KbqInput, descendants: true, isSignal: true }, { propertyName: "otherSites", first: true, predicate: ["otherSites"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (trigger.withSearch) {\n <div class=\"kbq-app-switcher__search-container\" (mouseenter)=\"otherSites()?.close()\">\n <kbq-form-field noBorders>\n <i kbq-icon=\"kbq-magnifying-glass_16\" kbqPrefix></i>\n <input\n placeholder=\"{{ localeData.searchPlaceholder }}\"\n autocomplete=\"off\"\n kbqInput\n [formControl]=\"searchControl\"\n (keydown.escape)=\"escapeHandler()\"\n />\n <kbq-cleaner />\n </kbq-form-field>\n </div>\n\n <kbq-divider />\n}\n\n<div kbq-scrollbar>\n @if (!searchControl.getRawValue()) {\n <div class=\"kbq-app-switcher__app-container\" (mouseenter)=\"otherSites()?.close()\">\n @if (trigger.sitesMode) {\n <div class=\"kbq-app-switcher-group-header\">\n <div class=\"kbq-app-switcher-group-header__text\">{{ trigger.selectedSite?.name }}</div>\n @if (trigger.selectedSite?.status) {\n <kbq-badge class=\"kbq-app-switcher-group-header__badge\" [compact]=\"true\">\n {{ trigger.selectedSite.status }}\n </kbq-badge>\n }\n </div>\n }\n\n <kbq-dropdown [class]=\"'kbq-app-switcher-sites'\">\n <div kbqDropdownStaticContent class=\"kbq-app-switcher-site\">\n @for (app of trigger.currentApps; track app) {\n @if (!app.aliases) {\n <a\n href=\"{{ app.link }}\"\n kbq-app-switcher-list-item\n [class.kbq-selected]=\"app.id === trigger.selectedApp?.id\"\n [app]=\"app\"\n [toggle]=\"!!app.aliases\"\n ></a>\n } @else {\n <div\n #appSwitcherApp=\"kbqAppSwitcherApp\"\n kbq-app-switcher-list-item\n [app]=\"app\"\n [toggle]=\"!!app.aliases\"\n ></div>\n\n @if (!appSwitcherApp.collapsed) {\n @for (alias of app.aliases; track alias) {\n <a\n href=\"{{ alias.link }}\"\n class=\"kbq-app-switcher-site_nested\"\n kbq-app-switcher-list-item\n [class.kbq-selected]=\"alias.id === trigger.selectedApp?.id\"\n [app]=\"alias\"\n ></a>\n }\n }\n }\n }\n </div>\n </kbq-dropdown>\n </div>\n\n @if (trigger.sitesMode) {\n <kbq-divider />\n\n <div class=\"kbq-app-switcher__sites-container\">\n <div class=\"kbq-app-switcher-group-header\">\n <div class=\"kbq-app-switcher-group-header__text\">{{ localeData.sitesHeader }}</div>\n </div>\n\n <kbq-dropdown #otherSites=\"kbqDropdown\">\n <div kbqDropdownStaticContent class=\"kbq-app-switcher-sites\">\n @for (site of trigger.sites; track site) {\n @if (site.id !== trigger.selectedSite?.id) {\n <div\n [kbq-app-switcher-dropdown-site]=\"site\"\n [kbqDropdownTriggerFor]=\"dropdownWithSelectedSite\"\n [offsetX]=\"0\"\n (mouseenter)=\"activeSite = site\"\n ></div>\n }\n }\n </div>\n </kbq-dropdown>\n </div>\n\n <kbq-dropdown #dropdownWithSelectedSite=\"kbqDropdown\" [class]=\"'kbq-app-switcher-sites'\">\n @for (app of activeSite?.apps; track app) {\n @if (app.aliases) {\n <div\n #dropdownWithGroupedAppsTrigger=\"kbqDropdownTrigger\"\n [kbq-app-switcher-dropdown-app]=\"app\"\n [kbqDropdownTriggerFor]=\"dropdownWithGroupedApps\"\n [offsetX]=\"0\"\n [class.kbq-pressed]=\"dropdownWithGroupedAppsTrigger.opened\"\n (mouseenter)=\"activeApp = app\"\n ></div>\n } @else {\n <a\n href=\"{{ app.link }}\"\n [kbq-app-switcher-dropdown-app]=\"app\"\n (click)=\"selectAppInSite(activeSite, app)\"\n ></a>\n }\n }\n </kbq-dropdown>\n\n <kbq-dropdown #dropdownWithGroupedApps=\"kbqDropdown\" [class]=\"'kbq-app-switcher-sites'\">\n @for (alias of activeApp?.aliases; track alias) {\n <a\n href=\"{{ alias.link }}\"\n [kbq-app-switcher-dropdown-app]=\"alias\"\n (click)=\"selectAppInSite(activeSite, alias)\"\n ></a>\n }\n </kbq-dropdown>\n }\n } @else {\n <div class=\"kbq-app-switcher__search-result\">\n <kbq-dropdown [class]=\"'kbq-app-switcher-sites'\">\n <div kbqDropdownStaticContent class=\"kbq-app-switcher-site\">\n @for (site of filteredSites; track site) {\n @if (trigger.sitesMode && site.apps) {\n <kbq-optgroup label=\"{{ site.name }}\" />\n }\n\n @for (app of site.apps; track app) {\n <a href=\"{{ app.link }}\" kbq-app-switcher-list-item [app]=\"app\"></a>\n }\n } @empty {\n <div class=\"kbq-app-switcher__empty-search-result\">{{ localeData.searchEmptyResult }}</div>\n }\n </div>\n </kbq-dropdown>\n </div>\n }\n</div>\n", styles: [".kbq-app-switcher{position:relative;display:flex;flex-direction:column;margin-top:var(--kbq-size-xxs);margin-bottom:var(--kbq-size-xxs);width:320px;border-radius:var(--kbq-size-xs);box-shadow:var(--kbq-shadow-popup);box-sizing:border-box;z-index:1}.kbq-app-switcher__search-container{padding-top:var(--kbq-size-xxs)}.kbq-app-switcher__search-result{max-width:320px;min-height:0;padding:var(--kbq-size-s) var(--kbq-size-xxs)}.kbq-app-switcher__empty-search-result{display:flex;justify-content:center;align-items:center;height:96px}.kbq-app-switcher__app-container{display:flex;flex-direction:column;min-height:0;padding:var(--kbq-size-s) var(--kbq-size-xxs)}.kbq-app-switcher-group-header{padding:var(--kbq-size-s) var(--kbq-size-m);display:flex;flex-direction:row;justify-content:space-between}.kbq-app-switcher__sites-container{padding:var(--kbq-size-xxs)}.kbq-app-switcher{background:var(--kbq-background-card)}.kbq-app-switcher .kbq-app-switcher-group-header,.kbq-app-switcher__empty-search-result{color:var(--kbq-foreground-contrast-secondary)}.kbq-app-switcher,.kbq-app-switcher__empty-search-result{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-app-switcher-group-header__text{font-size:var(--kbq-typography-caps-compact-strong-font-size);font-style:var(--kbq-typography-caps-compact-strong-font-style);font-weight:var(--kbq-typography-caps-compact-strong-font-weight);line-height:var(--kbq-typography-caps-compact-strong-line-height);font-family:var(--kbq-typography-caps-compact-strong-font-family);text-transform:var(--kbq-typography-caps-compact-strong-text-transform);font-feature-settings:var(--kbq-typography-caps-compact-strong-font-feature-settings);letter-spacing:var(--kbq-typography-caps-compact-strong-letter-spacing)}.kbq-app-switcher-group-header__badge{font-size:var(--kbq-typography-text-compact-medium-font-size);font-style:var(--kbq-typography-text-compact-medium-font-style);font-weight:var(--kbq-typography-text-compact-medium-font-weight);line-height:var(--kbq-typography-text-compact-medium-line-height);font-family:var(--kbq-typography-text-compact-medium-font-family);text-transform:var(--kbq-typography-text-compact-medium-text-transform);font-feature-settings:var(--kbq-typography-text-compact-medium-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-medium-letter-spacing)}.kbq-app-switch-tree-option__text{font-size:var(--kbq-typography-text-normal-medium-font-size);font-style:var(--kbq-typography-text-normal-medium-font-style);font-weight:var(--kbq-typography-text-normal-medium-font-weight);line-height:var(--kbq-typography-text-normal-medium-line-height);font-family:var(--kbq-typography-text-normal-medium-font-family);text-transform:var(--kbq-typography-text-normal-medium-text-transform);font-feature-settings:var(--kbq-typography-text-normal-medium-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-medium-letter-spacing)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: KbqInputModule }, { kind: "directive", type: i2.KbqInput, selector: "input[kbqInput],input[kbqNumberInput]", inputs: ["errorStateMatcher", "placeholder", "disabled", "id", "required", "type", "value"], exportAs: ["kbqInput"] }, { kind: "component", type: i3.KbqCleaner, selector: "kbq-cleaner", exportAs: ["kbqCleaner"] }, { kind: "component", type: i3.KbqFormField, selector: "kbq-form-field", inputs: ["noBorders", "inOverlay", "horizontal", "labelClass", "contentClass"], outputs: ["inOverlayChange"], exportAs: ["kbqFormField"] }, { kind: "directive", type: i3.KbqPrefix, selector: "[kbqPrefix]", exportAs: ["kbqPrefix"] }, { kind: "directive", type: i3.KbqTrim, selector: "[kbqInput], [kbqTextarea]", exportAs: ["KbqTrim"] }, { kind: "ngmodule", type: KbqIconModule }, { kind: "component", type: i1$1.KbqIcon, selector: "[kbq-icon]", inputs: ["small", "autoColor", "kbq-icon"] }, { kind: "ngmodule", type: KbqDividerModule }, { kind: "component", type: i5.KbqDivider, selector: "kbq-divider", inputs: ["vertical", "paddings"] }, { kind: "ngmodule", type: KbqBadgeModule }, { kind: "component", type: i1.KbqBadge, selector: "kbq-badge", inputs: ["compact", "outline", "badgeColor"] }, { kind: "directive", type: i1.KbqBadgeCssStyler, selector: "kbq-badge" }, { kind: "ngmodule", type: KbqDropdownModule }, { kind: "component", type: i7.KbqDropdown, selector: "kbq-dropdown", inputs: ["navigationWithWrap", "xPosition", "yPosition", "overlapTriggerY", "overlapTriggerX", "hasBackdrop", "class", "backdropClass"], outputs: ["closed"], exportAs: ["kbqDropdown"] }, { kind: "directive", type: i7.KbqDropdownTrigger, selector: "[kbqDropdownTriggerFor]", inputs: ["offsetX", "offsetY", "kbqDropdownTriggerData", "openByArrowDown", "demoteOverlay", "kbqDropdownTriggerRestoreFocus", "kbqDropdownTriggerFor"], outputs: ["dropdownOpened", "dropdownClosed"], exportAs: ["kbqDropdownTrigger"] }, { kind: "directive", type: i7.KbqDropdownStaticContent, selector: "[kbqDropdownStaticContent]" }, { kind: "ngmodule", type: KbqScrollbarModule }, { kind: "component", type: i8.KbqScrollbar, selector: "kbq-scrollbar, [kbq-scrollbar]", inputs: ["initializationTarget", "options", "events", "defer"], outputs: ["onInitialize", "onUpdate", "onDestroy", "onScroll"], exportAs: ["kbqScrollbar"] }, { kind: "ngmodule", type: KbqOptionModule }, { kind: "component", type: i9.KbqOptgroup, selector: "kbq-optgroup", inputs: ["label", "disabled"], exportAs: ["kbqOptgroup"] }, { kind: "component", type: KbqAppSwitcherDropdownApp, selector: "[kbq-app-switcher-dropdown-app]", inputs: ["kbq-app-switcher-dropdown-app"], exportAs: ["kbqAppSwitcherDropdownApp"] }, { kind: "component", type: KbqAppSwitcherDropdownSite, selector: "[kbq-app-switcher-dropdown-site]", inputs: ["kbq-app-switcher-dropdown-site"], exportAs: ["kbqAppSwitcherDropdownSite"] }, { kind: "component", type: KbqAppSwitcherListItem, selector: "[kbq-app-switcher-list-item]", inputs: ["app", "toggle", "collapsed"], exportAs: ["kbqAppSwitcherApp"] }], animations: [kbqAppSwitcherAnimations.state], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
576
+ /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqAppSwitcherComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
577
+ /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.30", type: KbqAppSwitcherComponent, isStandalone: true, selector: "kbq-app-switcher", inputs: { trigger: "trigger" }, host: { listeners: { "keydown": "keydownHandler($event)", "focusin": "focusinHandler($event)", "focusout": "focusoutHandler($event)" }, classAttribute: "kbq-app-switcher" }, viewQueries: [{ propertyName: "input", first: true, predicate: KbqInput, descendants: true, isSignal: true }, { propertyName: "otherSites", first: true, predicate: ["otherSites"], descendants: true, isSignal: true }, { propertyName: "allItems", predicate: KbqDropdownItem, descendants: true }], usesInheritance: true, ngImport: i0, template: "@if (trigger.withSearch) {\n <div class=\"kbq-app-switcher__search-container\" (mouseenter)=\"otherSites()?.close()\">\n <kbq-form-field noBorders>\n <i kbq-icon=\"kbq-magnifying-glass_16\" kbqPrefix></i>\n <input\n placeholder=\"{{ localeData.searchPlaceholder }}\"\n autocomplete=\"off\"\n kbqInput\n [formControl]=\"searchControl\"\n />\n <kbq-cleaner />\n </kbq-form-field>\n </div>\n\n <kbq-divider />\n}\n\n<div kbq-scrollbar role=\"menu\" aria-orientation=\"vertical\">\n @if (!searchControl.getRawValue()) {\n <div class=\"kbq-app-switcher__app-container\" (mouseenter)=\"otherSites()?.close()\">\n @if (trigger.sitesMode) {\n <div class=\"kbq-app-switcher-group-header\">\n <div class=\"kbq-app-switcher-group-header__text\">{{ trigger.selectedSite?.name }}</div>\n @if (trigger.selectedSite?.status) {\n <kbq-badge class=\"kbq-app-switcher-group-header__badge\" [compact]=\"true\">\n {{ trigger.selectedSite.status }}\n </kbq-badge>\n }\n </div>\n }\n\n <kbq-dropdown [class]=\"'kbq-app-switcher-sites'\">\n <div kbqDropdownStaticContent class=\"kbq-app-switcher-site\">\n @for (app of trigger.currentApps; track app) {\n @if (!app.aliases) {\n <a\n href=\"{{ app.link }}\"\n kbq-app-switcher-list-item\n [class.kbq-selected]=\"app.id === trigger.selectedApp?.id\"\n [app]=\"app\"\n [toggle]=\"!!app.aliases\"\n ></a>\n } @else {\n <div\n #appSwitcherApp=\"kbqAppSwitcherApp\"\n kbq-app-switcher-list-item\n [app]=\"app\"\n [toggle]=\"!!app.aliases\"\n ></div>\n\n @if (!appSwitcherApp.collapsed) {\n @for (alias of app.aliases; track alias) {\n <a\n href=\"{{ alias.link }}\"\n kbq-app-switcher-list-item\n [class]=\"nestedAliasClass\"\n [class.kbq-selected]=\"alias.id === trigger.selectedApp?.id\"\n [app]=\"alias\"\n ></a>\n }\n }\n }\n }\n </div>\n </kbq-dropdown>\n </div>\n\n @if (trigger.sitesMode) {\n <kbq-divider />\n\n <div class=\"kbq-app-switcher__sites-container\">\n <div class=\"kbq-app-switcher-group-header\">\n <div class=\"kbq-app-switcher-group-header__text\">{{ localeData.sitesHeader }}</div>\n </div>\n\n <kbq-dropdown #otherSites=\"kbqDropdown\">\n <div kbqDropdownStaticContent class=\"kbq-app-switcher-sites\">\n @for (site of trigger.sites; track site) {\n @if (site.id !== trigger.selectedSite?.id) {\n <div\n #siteFlyoutTrigger=\"kbqDropdownTrigger\"\n [kbq-app-switcher-dropdown-site]=\"site\"\n [kbqDropdownTriggerFor]=\"dropdownWithSelectedSite\"\n [offsetX]=\"0\"\n [attr.aria-expanded]=\"siteFlyoutTrigger.opened\"\n (mouseenter)=\"activeSite = site\"\n (focus)=\"activeSite = site\"\n ></div>\n }\n }\n </div>\n </kbq-dropdown>\n </div>\n\n <kbq-dropdown #dropdownWithSelectedSite=\"kbqDropdown\" [class]=\"'kbq-app-switcher-sites'\">\n @for (app of activeSite?.apps; track app) {\n @if (app.aliases) {\n <div\n #dropdownWithGroupedAppsTrigger=\"kbqDropdownTrigger\"\n [kbq-app-switcher-dropdown-app]=\"app\"\n [kbqDropdownTriggerFor]=\"dropdownWithGroupedApps\"\n [offsetX]=\"0\"\n [class.kbq-pressed]=\"dropdownWithGroupedAppsTrigger.opened\"\n [attr.aria-expanded]=\"dropdownWithGroupedAppsTrigger.opened\"\n (mouseenter)=\"activeApp = app\"\n (focus)=\"activeApp = app\"\n ></div>\n } @else {\n <a\n href=\"{{ app.link }}\"\n [kbq-app-switcher-dropdown-app]=\"app\"\n (click)=\"selectAppInSite(activeSite, app)\"\n ></a>\n }\n }\n </kbq-dropdown>\n\n <kbq-dropdown #dropdownWithGroupedApps=\"kbqDropdown\" [class]=\"'kbq-app-switcher-sites'\">\n @for (alias of activeApp?.aliases; track alias) {\n <a\n href=\"{{ alias.link }}\"\n [kbq-app-switcher-dropdown-app]=\"alias\"\n (click)=\"selectAppInSite(activeSite, alias)\"\n ></a>\n }\n </kbq-dropdown>\n }\n } @else {\n <div class=\"kbq-app-switcher__search-result\">\n <kbq-dropdown [class]=\"'kbq-app-switcher-sites'\">\n <div kbqDropdownStaticContent class=\"kbq-app-switcher-site\">\n @for (site of filteredSites; track site) {\n @if (trigger.sitesMode && site.apps) {\n <kbq-optgroup label=\"{{ site.name }}\" />\n }\n\n @for (app of site.apps; track app) {\n <a\n href=\"{{ app.link }}\"\n kbq-app-switcher-list-item\n [app]=\"app\"\n [highlightText]=\"searchControl.getRawValue() ?? ''\"\n ></a>\n }\n } @empty {\n <div class=\"kbq-app-switcher__empty-search-result\">{{ localeData.searchEmptyResult }}</div>\n }\n </div>\n </kbq-dropdown>\n </div>\n }\n</div>\n", styles: [".kbq-app-switcher{position:relative;display:flex;flex-direction:column;margin-top:var(--kbq-size-xxs);margin-bottom:var(--kbq-size-xxs);width:320px;border-radius:var(--kbq-size-xs);box-shadow:var(--kbq-shadow-popup);box-sizing:border-box;z-index:1}.kbq-app-switcher__search-container{padding-top:var(--kbq-size-xxs)}.kbq-app-switcher__search-result{max-width:320px;min-height:0;padding:var(--kbq-size-s) var(--kbq-size-xxs)}.kbq-app-switcher__empty-search-result{display:flex;justify-content:center;align-items:center;height:96px}.kbq-app-switcher__app-container{display:flex;flex-direction:column;min-height:0;padding:var(--kbq-size-s) var(--kbq-size-xxs)}.kbq-app-switcher-group-header{padding:var(--kbq-size-s) var(--kbq-size-m);display:flex;flex-direction:row;justify-content:space-between}.kbq-app-switcher__sites-container{padding:var(--kbq-size-xxs)}.kbq-app-switcher{background:var(--kbq-background-card)}.kbq-app-switcher .kbq-app-switcher-group-header,.kbq-app-switcher__empty-search-result{color:var(--kbq-foreground-contrast-secondary)}.kbq-app-switcher,.kbq-app-switcher__empty-search-result{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-app-switcher-group-header__text{font-size:var(--kbq-typography-caps-compact-strong-font-size);font-style:var(--kbq-typography-caps-compact-strong-font-style);font-weight:var(--kbq-typography-caps-compact-strong-font-weight);line-height:var(--kbq-typography-caps-compact-strong-line-height);font-family:var(--kbq-typography-caps-compact-strong-font-family);text-transform:var(--kbq-typography-caps-compact-strong-text-transform);font-feature-settings:var(--kbq-typography-caps-compact-strong-font-feature-settings);letter-spacing:var(--kbq-typography-caps-compact-strong-letter-spacing)}.kbq-app-switcher-group-header__badge{font-size:var(--kbq-typography-text-compact-medium-font-size);font-style:var(--kbq-typography-text-compact-medium-font-style);font-weight:var(--kbq-typography-text-compact-medium-font-weight);line-height:var(--kbq-typography-text-compact-medium-line-height);font-family:var(--kbq-typography-text-compact-medium-font-family);text-transform:var(--kbq-typography-text-compact-medium-text-transform);font-feature-settings:var(--kbq-typography-text-compact-medium-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-medium-letter-spacing)}.kbq-app-switch-tree-option__text{font-size:var(--kbq-typography-text-normal-medium-font-size);font-style:var(--kbq-typography-text-normal-medium-font-style);font-weight:var(--kbq-typography-text-normal-medium-font-weight);line-height:var(--kbq-typography-text-normal-medium-line-height);font-family:var(--kbq-typography-text-normal-medium-font-family);text-transform:var(--kbq-typography-text-normal-medium-text-transform);font-feature-settings:var(--kbq-typography-text-normal-medium-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-medium-letter-spacing)}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: KbqInputModule }, { kind: "directive", type: i2.KbqInput, selector: "input[kbqInput],input[kbqNumberInput]", inputs: ["errorStateMatcher", "placeholder", "disabled", "id", "required", "type", "value"], exportAs: ["kbqInput"] }, { kind: "component", type: i3.KbqCleaner, selector: "kbq-cleaner", inputs: ["aria-label"], exportAs: ["kbqCleaner"] }, { kind: "component", type: i3.KbqFormField, selector: "kbq-form-field", inputs: ["noBorders", "inOverlay", "horizontal", "labelClass", "contentClass"], outputs: ["inOverlayChange"], exportAs: ["kbqFormField"] }, { kind: "directive", type: i3.KbqPrefix, selector: "[kbqPrefix]", exportAs: ["kbqPrefix"] }, { kind: "directive", type: i3.KbqTrim, selector: "[kbqInput], [kbqTextarea]", exportAs: ["KbqTrim"] }, { kind: "ngmodule", type: KbqIconModule }, { kind: "component", type: i1$1.KbqIcon, selector: "[kbq-icon]", inputs: ["small", "autoColor", "kbq-icon"] }, { kind: "ngmodule", type: KbqDividerModule }, { kind: "component", type: i5.KbqDivider, selector: "kbq-divider", inputs: ["vertical", "paddings"] }, { kind: "ngmodule", type: KbqBadgeModule }, { kind: "component", type: i1.KbqBadge, selector: "kbq-badge", inputs: ["compact", "outline", "badgeColor"] }, { kind: "directive", type: i1.KbqBadgeCssStyler, selector: "kbq-badge" }, { kind: "ngmodule", type: KbqDropdownModule }, { kind: "component", type: i7.KbqDropdown, selector: "kbq-dropdown", inputs: ["navigationWithWrap", "xPosition", "yPosition", "overlapTriggerY", "overlapTriggerX", "hasBackdrop", "class", "backdropClass", "panelWidth", "panelMinWidth", "panelMaxWidth", "safeArea"], outputs: ["closed"], exportAs: ["kbqDropdown"] }, { kind: "directive", type: i7.KbqDropdownTrigger, selector: "[kbqDropdownTriggerFor]", inputs: ["offsetX", "offsetY", "kbqDropdownTriggerData", "openByArrowDown", "demoteOverlay", "kbqDropdownTriggerRestoreFocus", "kbqDropdownTriggerFor"], outputs: ["dropdownOpened", "dropdownClosed"], exportAs: ["kbqDropdownTrigger"] }, { kind: "directive", type: i7.KbqDropdownStaticContent, selector: "[kbqDropdownStaticContent]" }, { kind: "ngmodule", type: KbqScrollbarModule }, { kind: "component", type: i8.KbqScrollbar, selector: "kbq-scrollbar, [kbq-scrollbar]", inputs: ["initializationTarget", "options", "events", "defer"], outputs: ["onInitialize", "onUpdate", "onDestroy", "onScroll"], exportAs: ["kbqScrollbar"] }, { kind: "ngmodule", type: KbqOptionModule }, { kind: "component", type: i9.KbqOptgroup, selector: "kbq-optgroup", inputs: ["label", "disabled"], exportAs: ["kbqOptgroup"] }, { kind: "component", type: KbqAppSwitcherDropdownApp, selector: "[kbq-app-switcher-dropdown-app]", inputs: ["kbq-app-switcher-dropdown-app"], exportAs: ["kbqAppSwitcherDropdownApp"] }, { kind: "component", type: KbqAppSwitcherDropdownSite, selector: "[kbq-app-switcher-dropdown-site]", inputs: ["kbq-app-switcher-dropdown-site"], exportAs: ["kbqAppSwitcherDropdownSite"] }, { kind: "component", type: KbqAppSwitcherListItem, selector: "[kbq-app-switcher-list-item]", inputs: ["app", "toggle", "highlightText", "collapsed"], exportAs: ["kbqAppSwitcherApp"] }], animations: [kbqAppSwitcherAnimations.state], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
389
578
  }
390
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqAppSwitcherComponent, decorators: [{
579
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqAppSwitcherComponent, decorators: [{
391
580
  type: Component,
392
581
  args: [{ selector: 'kbq-app-switcher', imports: [
393
582
  FormsModule,
@@ -403,11 +592,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
403
592
  KbqAppSwitcherDropdownSite,
404
593
  KbqAppSwitcherListItem
405
594
  ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
406
- class: 'kbq-app-switcher'
407
- }, animations: [kbqAppSwitcherAnimations.state], preserveWhitespaces: false, template: "@if (trigger.withSearch) {\n <div class=\"kbq-app-switcher__search-container\" (mouseenter)=\"otherSites()?.close()\">\n <kbq-form-field noBorders>\n <i kbq-icon=\"kbq-magnifying-glass_16\" kbqPrefix></i>\n <input\n placeholder=\"{{ localeData.searchPlaceholder }}\"\n autocomplete=\"off\"\n kbqInput\n [formControl]=\"searchControl\"\n (keydown.escape)=\"escapeHandler()\"\n />\n <kbq-cleaner />\n </kbq-form-field>\n </div>\n\n <kbq-divider />\n}\n\n<div kbq-scrollbar>\n @if (!searchControl.getRawValue()) {\n <div class=\"kbq-app-switcher__app-container\" (mouseenter)=\"otherSites()?.close()\">\n @if (trigger.sitesMode) {\n <div class=\"kbq-app-switcher-group-header\">\n <div class=\"kbq-app-switcher-group-header__text\">{{ trigger.selectedSite?.name }}</div>\n @if (trigger.selectedSite?.status) {\n <kbq-badge class=\"kbq-app-switcher-group-header__badge\" [compact]=\"true\">\n {{ trigger.selectedSite.status }}\n </kbq-badge>\n }\n </div>\n }\n\n <kbq-dropdown [class]=\"'kbq-app-switcher-sites'\">\n <div kbqDropdownStaticContent class=\"kbq-app-switcher-site\">\n @for (app of trigger.currentApps; track app) {\n @if (!app.aliases) {\n <a\n href=\"{{ app.link }}\"\n kbq-app-switcher-list-item\n [class.kbq-selected]=\"app.id === trigger.selectedApp?.id\"\n [app]=\"app\"\n [toggle]=\"!!app.aliases\"\n ></a>\n } @else {\n <div\n #appSwitcherApp=\"kbqAppSwitcherApp\"\n kbq-app-switcher-list-item\n [app]=\"app\"\n [toggle]=\"!!app.aliases\"\n ></div>\n\n @if (!appSwitcherApp.collapsed) {\n @for (alias of app.aliases; track alias) {\n <a\n href=\"{{ alias.link }}\"\n class=\"kbq-app-switcher-site_nested\"\n kbq-app-switcher-list-item\n [class.kbq-selected]=\"alias.id === trigger.selectedApp?.id\"\n [app]=\"alias\"\n ></a>\n }\n }\n }\n }\n </div>\n </kbq-dropdown>\n </div>\n\n @if (trigger.sitesMode) {\n <kbq-divider />\n\n <div class=\"kbq-app-switcher__sites-container\">\n <div class=\"kbq-app-switcher-group-header\">\n <div class=\"kbq-app-switcher-group-header__text\">{{ localeData.sitesHeader }}</div>\n </div>\n\n <kbq-dropdown #otherSites=\"kbqDropdown\">\n <div kbqDropdownStaticContent class=\"kbq-app-switcher-sites\">\n @for (site of trigger.sites; track site) {\n @if (site.id !== trigger.selectedSite?.id) {\n <div\n [kbq-app-switcher-dropdown-site]=\"site\"\n [kbqDropdownTriggerFor]=\"dropdownWithSelectedSite\"\n [offsetX]=\"0\"\n (mouseenter)=\"activeSite = site\"\n ></div>\n }\n }\n </div>\n </kbq-dropdown>\n </div>\n\n <kbq-dropdown #dropdownWithSelectedSite=\"kbqDropdown\" [class]=\"'kbq-app-switcher-sites'\">\n @for (app of activeSite?.apps; track app) {\n @if (app.aliases) {\n <div\n #dropdownWithGroupedAppsTrigger=\"kbqDropdownTrigger\"\n [kbq-app-switcher-dropdown-app]=\"app\"\n [kbqDropdownTriggerFor]=\"dropdownWithGroupedApps\"\n [offsetX]=\"0\"\n [class.kbq-pressed]=\"dropdownWithGroupedAppsTrigger.opened\"\n (mouseenter)=\"activeApp = app\"\n ></div>\n } @else {\n <a\n href=\"{{ app.link }}\"\n [kbq-app-switcher-dropdown-app]=\"app\"\n (click)=\"selectAppInSite(activeSite, app)\"\n ></a>\n }\n }\n </kbq-dropdown>\n\n <kbq-dropdown #dropdownWithGroupedApps=\"kbqDropdown\" [class]=\"'kbq-app-switcher-sites'\">\n @for (alias of activeApp?.aliases; track alias) {\n <a\n href=\"{{ alias.link }}\"\n [kbq-app-switcher-dropdown-app]=\"alias\"\n (click)=\"selectAppInSite(activeSite, alias)\"\n ></a>\n }\n </kbq-dropdown>\n }\n } @else {\n <div class=\"kbq-app-switcher__search-result\">\n <kbq-dropdown [class]=\"'kbq-app-switcher-sites'\">\n <div kbqDropdownStaticContent class=\"kbq-app-switcher-site\">\n @for (site of filteredSites; track site) {\n @if (trigger.sitesMode && site.apps) {\n <kbq-optgroup label=\"{{ site.name }}\" />\n }\n\n @for (app of site.apps; track app) {\n <a href=\"{{ app.link }}\" kbq-app-switcher-list-item [app]=\"app\"></a>\n }\n } @empty {\n <div class=\"kbq-app-switcher__empty-search-result\">{{ localeData.searchEmptyResult }}</div>\n }\n </div>\n </kbq-dropdown>\n </div>\n }\n</div>\n", styles: [".kbq-app-switcher{position:relative;display:flex;flex-direction:column;margin-top:var(--kbq-size-xxs);margin-bottom:var(--kbq-size-xxs);width:320px;border-radius:var(--kbq-size-xs);box-shadow:var(--kbq-shadow-popup);box-sizing:border-box;z-index:1}.kbq-app-switcher__search-container{padding-top:var(--kbq-size-xxs)}.kbq-app-switcher__search-result{max-width:320px;min-height:0;padding:var(--kbq-size-s) var(--kbq-size-xxs)}.kbq-app-switcher__empty-search-result{display:flex;justify-content:center;align-items:center;height:96px}.kbq-app-switcher__app-container{display:flex;flex-direction:column;min-height:0;padding:var(--kbq-size-s) var(--kbq-size-xxs)}.kbq-app-switcher-group-header{padding:var(--kbq-size-s) var(--kbq-size-m);display:flex;flex-direction:row;justify-content:space-between}.kbq-app-switcher__sites-container{padding:var(--kbq-size-xxs)}.kbq-app-switcher{background:var(--kbq-background-card)}.kbq-app-switcher .kbq-app-switcher-group-header,.kbq-app-switcher__empty-search-result{color:var(--kbq-foreground-contrast-secondary)}.kbq-app-switcher,.kbq-app-switcher__empty-search-result{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-app-switcher-group-header__text{font-size:var(--kbq-typography-caps-compact-strong-font-size);font-style:var(--kbq-typography-caps-compact-strong-font-style);font-weight:var(--kbq-typography-caps-compact-strong-font-weight);line-height:var(--kbq-typography-caps-compact-strong-line-height);font-family:var(--kbq-typography-caps-compact-strong-font-family);text-transform:var(--kbq-typography-caps-compact-strong-text-transform);font-feature-settings:var(--kbq-typography-caps-compact-strong-font-feature-settings);letter-spacing:var(--kbq-typography-caps-compact-strong-letter-spacing)}.kbq-app-switcher-group-header__badge{font-size:var(--kbq-typography-text-compact-medium-font-size);font-style:var(--kbq-typography-text-compact-medium-font-style);font-weight:var(--kbq-typography-text-compact-medium-font-weight);line-height:var(--kbq-typography-text-compact-medium-line-height);font-family:var(--kbq-typography-text-compact-medium-font-family);text-transform:var(--kbq-typography-text-compact-medium-text-transform);font-feature-settings:var(--kbq-typography-text-compact-medium-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-medium-letter-spacing)}.kbq-app-switch-tree-option__text{font-size:var(--kbq-typography-text-normal-medium-font-size);font-style:var(--kbq-typography-text-normal-medium-font-style);font-weight:var(--kbq-typography-text-normal-medium-font-weight);line-height:var(--kbq-typography-text-normal-medium-line-height);font-family:var(--kbq-typography-text-normal-medium-font-family);text-transform:var(--kbq-typography-text-normal-medium-text-transform);font-feature-settings:var(--kbq-typography-text-normal-medium-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-medium-letter-spacing)}\n"] }]
595
+ class: 'kbq-app-switcher',
596
+ '(keydown)': 'keydownHandler($event)',
597
+ '(focusin)': 'focusinHandler($event)',
598
+ '(focusout)': 'focusoutHandler($event)'
599
+ }, animations: [kbqAppSwitcherAnimations.state], preserveWhitespaces: false, template: "@if (trigger.withSearch) {\n <div class=\"kbq-app-switcher__search-container\" (mouseenter)=\"otherSites()?.close()\">\n <kbq-form-field noBorders>\n <i kbq-icon=\"kbq-magnifying-glass_16\" kbqPrefix></i>\n <input\n placeholder=\"{{ localeData.searchPlaceholder }}\"\n autocomplete=\"off\"\n kbqInput\n [formControl]=\"searchControl\"\n />\n <kbq-cleaner />\n </kbq-form-field>\n </div>\n\n <kbq-divider />\n}\n\n<div kbq-scrollbar role=\"menu\" aria-orientation=\"vertical\">\n @if (!searchControl.getRawValue()) {\n <div class=\"kbq-app-switcher__app-container\" (mouseenter)=\"otherSites()?.close()\">\n @if (trigger.sitesMode) {\n <div class=\"kbq-app-switcher-group-header\">\n <div class=\"kbq-app-switcher-group-header__text\">{{ trigger.selectedSite?.name }}</div>\n @if (trigger.selectedSite?.status) {\n <kbq-badge class=\"kbq-app-switcher-group-header__badge\" [compact]=\"true\">\n {{ trigger.selectedSite.status }}\n </kbq-badge>\n }\n </div>\n }\n\n <kbq-dropdown [class]=\"'kbq-app-switcher-sites'\">\n <div kbqDropdownStaticContent class=\"kbq-app-switcher-site\">\n @for (app of trigger.currentApps; track app) {\n @if (!app.aliases) {\n <a\n href=\"{{ app.link }}\"\n kbq-app-switcher-list-item\n [class.kbq-selected]=\"app.id === trigger.selectedApp?.id\"\n [app]=\"app\"\n [toggle]=\"!!app.aliases\"\n ></a>\n } @else {\n <div\n #appSwitcherApp=\"kbqAppSwitcherApp\"\n kbq-app-switcher-list-item\n [app]=\"app\"\n [toggle]=\"!!app.aliases\"\n ></div>\n\n @if (!appSwitcherApp.collapsed) {\n @for (alias of app.aliases; track alias) {\n <a\n href=\"{{ alias.link }}\"\n kbq-app-switcher-list-item\n [class]=\"nestedAliasClass\"\n [class.kbq-selected]=\"alias.id === trigger.selectedApp?.id\"\n [app]=\"alias\"\n ></a>\n }\n }\n }\n }\n </div>\n </kbq-dropdown>\n </div>\n\n @if (trigger.sitesMode) {\n <kbq-divider />\n\n <div class=\"kbq-app-switcher__sites-container\">\n <div class=\"kbq-app-switcher-group-header\">\n <div class=\"kbq-app-switcher-group-header__text\">{{ localeData.sitesHeader }}</div>\n </div>\n\n <kbq-dropdown #otherSites=\"kbqDropdown\">\n <div kbqDropdownStaticContent class=\"kbq-app-switcher-sites\">\n @for (site of trigger.sites; track site) {\n @if (site.id !== trigger.selectedSite?.id) {\n <div\n #siteFlyoutTrigger=\"kbqDropdownTrigger\"\n [kbq-app-switcher-dropdown-site]=\"site\"\n [kbqDropdownTriggerFor]=\"dropdownWithSelectedSite\"\n [offsetX]=\"0\"\n [attr.aria-expanded]=\"siteFlyoutTrigger.opened\"\n (mouseenter)=\"activeSite = site\"\n (focus)=\"activeSite = site\"\n ></div>\n }\n }\n </div>\n </kbq-dropdown>\n </div>\n\n <kbq-dropdown #dropdownWithSelectedSite=\"kbqDropdown\" [class]=\"'kbq-app-switcher-sites'\">\n @for (app of activeSite?.apps; track app) {\n @if (app.aliases) {\n <div\n #dropdownWithGroupedAppsTrigger=\"kbqDropdownTrigger\"\n [kbq-app-switcher-dropdown-app]=\"app\"\n [kbqDropdownTriggerFor]=\"dropdownWithGroupedApps\"\n [offsetX]=\"0\"\n [class.kbq-pressed]=\"dropdownWithGroupedAppsTrigger.opened\"\n [attr.aria-expanded]=\"dropdownWithGroupedAppsTrigger.opened\"\n (mouseenter)=\"activeApp = app\"\n (focus)=\"activeApp = app\"\n ></div>\n } @else {\n <a\n href=\"{{ app.link }}\"\n [kbq-app-switcher-dropdown-app]=\"app\"\n (click)=\"selectAppInSite(activeSite, app)\"\n ></a>\n }\n }\n </kbq-dropdown>\n\n <kbq-dropdown #dropdownWithGroupedApps=\"kbqDropdown\" [class]=\"'kbq-app-switcher-sites'\">\n @for (alias of activeApp?.aliases; track alias) {\n <a\n href=\"{{ alias.link }}\"\n [kbq-app-switcher-dropdown-app]=\"alias\"\n (click)=\"selectAppInSite(activeSite, alias)\"\n ></a>\n }\n </kbq-dropdown>\n }\n } @else {\n <div class=\"kbq-app-switcher__search-result\">\n <kbq-dropdown [class]=\"'kbq-app-switcher-sites'\">\n <div kbqDropdownStaticContent class=\"kbq-app-switcher-site\">\n @for (site of filteredSites; track site) {\n @if (trigger.sitesMode && site.apps) {\n <kbq-optgroup label=\"{{ site.name }}\" />\n }\n\n @for (app of site.apps; track app) {\n <a\n href=\"{{ app.link }}\"\n kbq-app-switcher-list-item\n [app]=\"app\"\n [highlightText]=\"searchControl.getRawValue() ?? ''\"\n ></a>\n }\n } @empty {\n <div class=\"kbq-app-switcher__empty-search-result\">{{ localeData.searchEmptyResult }}</div>\n }\n </div>\n </kbq-dropdown>\n </div>\n }\n</div>\n", styles: [".kbq-app-switcher{position:relative;display:flex;flex-direction:column;margin-top:var(--kbq-size-xxs);margin-bottom:var(--kbq-size-xxs);width:320px;border-radius:var(--kbq-size-xs);box-shadow:var(--kbq-shadow-popup);box-sizing:border-box;z-index:1}.kbq-app-switcher__search-container{padding-top:var(--kbq-size-xxs)}.kbq-app-switcher__search-result{max-width:320px;min-height:0;padding:var(--kbq-size-s) var(--kbq-size-xxs)}.kbq-app-switcher__empty-search-result{display:flex;justify-content:center;align-items:center;height:96px}.kbq-app-switcher__app-container{display:flex;flex-direction:column;min-height:0;padding:var(--kbq-size-s) var(--kbq-size-xxs)}.kbq-app-switcher-group-header{padding:var(--kbq-size-s) var(--kbq-size-m);display:flex;flex-direction:row;justify-content:space-between}.kbq-app-switcher__sites-container{padding:var(--kbq-size-xxs)}.kbq-app-switcher{background:var(--kbq-background-card)}.kbq-app-switcher .kbq-app-switcher-group-header,.kbq-app-switcher__empty-search-result{color:var(--kbq-foreground-contrast-secondary)}.kbq-app-switcher,.kbq-app-switcher__empty-search-result{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}.kbq-app-switcher-group-header__text{font-size:var(--kbq-typography-caps-compact-strong-font-size);font-style:var(--kbq-typography-caps-compact-strong-font-style);font-weight:var(--kbq-typography-caps-compact-strong-font-weight);line-height:var(--kbq-typography-caps-compact-strong-line-height);font-family:var(--kbq-typography-caps-compact-strong-font-family);text-transform:var(--kbq-typography-caps-compact-strong-text-transform);font-feature-settings:var(--kbq-typography-caps-compact-strong-font-feature-settings);letter-spacing:var(--kbq-typography-caps-compact-strong-letter-spacing)}.kbq-app-switcher-group-header__badge{font-size:var(--kbq-typography-text-compact-medium-font-size);font-style:var(--kbq-typography-text-compact-medium-font-style);font-weight:var(--kbq-typography-text-compact-medium-font-weight);line-height:var(--kbq-typography-text-compact-medium-line-height);font-family:var(--kbq-typography-text-compact-medium-font-family);text-transform:var(--kbq-typography-text-compact-medium-text-transform);font-feature-settings:var(--kbq-typography-text-compact-medium-font-feature-settings);letter-spacing:var(--kbq-typography-text-compact-medium-letter-spacing)}.kbq-app-switch-tree-option__text{font-size:var(--kbq-typography-text-normal-medium-font-size);font-style:var(--kbq-typography-text-normal-medium-font-style);font-weight:var(--kbq-typography-text-normal-medium-font-weight);line-height:var(--kbq-typography-text-normal-medium-line-height);font-family:var(--kbq-typography-text-normal-medium-font-family);text-transform:var(--kbq-typography-text-normal-medium-text-transform);font-feature-settings:var(--kbq-typography-text-normal-medium-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-medium-letter-spacing)}\n"] }]
408
600
  }], ctorParameters: () => [], propDecorators: { trigger: [{
409
601
  type: Input
410
- }], input: [{ type: i0.ViewChild, args: [i0.forwardRef(() => KbqInput), { isSignal: true }] }], otherSites: [{ type: i0.ViewChild, args: ['otherSites', { isSignal: true }] }] } });
602
+ }], input: [{ type: i0.ViewChild, args: [i0.forwardRef(() => KbqInput), { isSignal: true }] }], otherSites: [{ type: i0.ViewChild, args: ['otherSites', { isSignal: true }] }], allItems: [{
603
+ type: ViewChildren,
604
+ args: [KbqDropdownItem]
605
+ }] } });
411
606
  class KbqAppSwitcherTrigger extends KbqPopUpTrigger {
412
607
  constructor() {
413
608
  super(...arguments);
@@ -639,10 +834,10 @@ class KbqAppSwitcherTrigger extends KbqPopUpTrigger {
639
834
  closingActions() {
640
835
  return merge(this.overlayRef.outsidePointerEvents(), this.overlayRef.backdropClick(), this.scrollDispatcher.scrolled());
641
836
  }
642
- /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqAppSwitcherTrigger, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
643
- /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "20.3.25", type: KbqAppSwitcherTrigger, isStandalone: true, selector: "[kbqAppSwitcher]", inputs: { selectedApp: "selectedApp", placement: ["kbqAppSwitcherPlacement", "placement"], backdropClass: "backdropClass", offset: ["offset", "offset", numberAttribute], sites: "sites", groupBy: "groupBy", selectedSite: "selectedSite", disabled: ["disabled", "disabled", booleanAttribute] }, outputs: { placementChange: "kbqPlacementChange", visibleChange: "kbqVisibleChange", selectedSiteChange: "selectedSiteChange", selectedAppChange: "selectedAppChange" }, host: { listeners: { "keydown": "keydownHandler($event)", "touchend": "touchendHandler()" }, properties: { "class.kbq-app-switcher_open": "isOpen", "class.kbq-active": "hasClickTrigger && isOpen" } }, exportAs: ["kbqAppSwitcher"], usesInheritance: true, ngImport: i0 }); }
837
+ /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqAppSwitcherTrigger, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
838
+ /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "20.3.30", type: KbqAppSwitcherTrigger, isStandalone: true, selector: "[kbqAppSwitcher]", inputs: { selectedApp: "selectedApp", placement: ["kbqAppSwitcherPlacement", "placement"], backdropClass: "backdropClass", offset: ["offset", "offset", numberAttribute], sites: "sites", groupBy: "groupBy", selectedSite: "selectedSite", disabled: ["disabled", "disabled", booleanAttribute] }, outputs: { placementChange: "kbqPlacementChange", visibleChange: "kbqVisibleChange", selectedSiteChange: "selectedSiteChange", selectedAppChange: "selectedAppChange" }, host: { listeners: { "keydown": "keydownHandler($event)", "touchend": "touchendHandler()" }, properties: { "class.kbq-app-switcher_open": "isOpen", "class.kbq-active": "hasClickTrigger && isOpen" } }, exportAs: ["kbqAppSwitcher"], usesInheritance: true, ngImport: i0 }); }
644
839
  }
645
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqAppSwitcherTrigger, decorators: [{
840
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqAppSwitcherTrigger, decorators: [{
646
841
  type: Directive,
647
842
  args: [{
648
843
  selector: '[kbqAppSwitcher]',
@@ -682,13 +877,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImpo
682
877
  }], selectedSiteChange: [{ type: i0.Output, args: ["selectedSiteChange"] }], selectedAppChange: [{ type: i0.Output, args: ["selectedAppChange"] }] } });
683
878
 
684
879
  class KbqAppSwitcherModule {
685
- /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqAppSwitcherModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
686
- /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.25", ngImport: i0, type: KbqAppSwitcherModule, imports: [KbqAppSwitcherComponent,
880
+ /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqAppSwitcherModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
881
+ /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.30", ngImport: i0, type: KbqAppSwitcherModule, imports: [KbqAppSwitcherComponent,
687
882
  KbqAppSwitcherTrigger,
688
883
  KbqAppSwitcherListItem,
689
884
  KbqAppSwitcherDropdownApp,
690
885
  KbqAppSwitcherDropdownSite], exports: [KbqAppSwitcherTrigger] }); }
691
- /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqAppSwitcherModule, providers: [
886
+ /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqAppSwitcherModule, providers: [
692
887
  KBQ_APP_SWITCHER_SCROLL_STRATEGY_FACTORY_PROVIDER,
693
888
  { provide: FocusTrapFactory, useClass: ConfigurableFocusTrapFactory },
694
889
  { provide: FOCUS_TRAP_INERT_STRATEGY, useClass: EmptyFocusTrapStrategy }
@@ -697,7 +892,7 @@ class KbqAppSwitcherModule {
697
892
  KbqAppSwitcherDropdownApp,
698
893
  KbqAppSwitcherDropdownSite] }); }
699
894
  }
700
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.25", ngImport: i0, type: KbqAppSwitcherModule, decorators: [{
895
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.30", ngImport: i0, type: KbqAppSwitcherModule, decorators: [{
701
896
  type: NgModule,
702
897
  args: [{
703
898
  imports: [