@indigina/ui-kit 1.1.214 → 1.1.216

package/fesm2022/indigina-ui-kit.mjs

@@ -5907,13 +5907,15 @@ class KitScrollNavigationSectionComponent {
         this.propertyChanged?.emit();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: KitScrollNavigationSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.3", type: KitScrollNavigationSectionComponent, isStandalone: true, selector: "kit-scroll-navigation-section", inputs: { title: "title", buttonState: "buttonState", buttonIcon: "buttonIcon", tooltipText: "tooltipText", badgeCount: "badgeCount" }, outputs: { propertyChanged: "propertyChanged" }, viewQueries: [{ propertyName: "sectionTemplate", first: true, predicate: ["sectionTemplate"], descendants: true, static: true }, { propertyName: "sectionContent", first: true, predicate: ["sectionContent"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-template #sectionTemplate>\n  <div #sectionContent\n       class=\"kit-scroll-navigation-section\">\n    <ng-content></ng-content>\n  </div>\n</ng-template>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.3", type: KitScrollNavigationSectionComponent, isStandalone: true, selector: "kit-scroll-navigation-section", inputs: { title: "title", id: "id", buttonState: "buttonState", buttonIcon: "buttonIcon", tooltipText: "tooltipText", badgeCount: "badgeCount" }, outputs: { propertyChanged: "propertyChanged" }, viewQueries: [{ propertyName: "sectionTemplate", first: true, predicate: ["sectionTemplate"], descendants: true, static: true }, { propertyName: "sectionContent", first: true, predicate: ["sectionContent"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-template #sectionTemplate>\n  <div #sectionContent\n       class=\"kit-scroll-navigation-section\">\n    <ng-content></ng-content>\n  </div>\n</ng-template>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: KitScrollNavigationSectionComponent, decorators: [{
             type: Component,
             args: [{ selector: 'kit-scroll-navigation-section', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-template #sectionTemplate>\n  <div #sectionContent\n       class=\"kit-scroll-navigation-section\">\n    <ng-content></ng-content>\n  </div>\n</ng-template>\n" }]
         }], propDecorators: { title: [{
                 type: Input
+            }], id: [{
+                type: Input
             }], buttonState: [{
                 type: Input
             }], buttonIcon: [{
@@ -6065,9 +6067,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImpor
         }] });
 
 class KitScrollNavigationComponent {
+    get currentVisibleItem() {
+        return this.collapsedList?.selectedItem ?? null;
+    }
     constructor() {
         this.isNavigationBtnDisabled = input(false, ...(ngDevMode ? [{ debugName: "isNavigationBtnDisabled" }] : []));
         this.dropdownDefaultText = input('View More', ...(ngDevMode ? [{ debugName: "dropdownDefaultText" }] : []));
+        this.firstRenderScrollElementId = input('', ...(ngDevMode ? [{ debugName: "firstRenderScrollElementId" }] : []));
         this.sections = null;
         this.content = null;
         this.collapsedList = null;
@@ -6081,9 +6087,21 @@ class KitScrollNavigationComponent {
         this.kitCollapsedListDropdownAlign = KitCollapsedListDropdownAlign;
         this.collapsedListItems = signal([], ...(ngDevMode ? [{ debugName: "collapsedListItems" }] : []));
         this.disableScrollUpdates = false;
-    }
-    get currentVisibleItem() {
-        return this.collapsedList?.selectedItem ?? null;
+        this.hasScrolled = false;
+        effect(() => {
+            if (!this.isNavigationBtnDisabled() && !this.hasScrolled) {
+                requestAnimationFrame(() => {
+                    const section = this.sections?.toArray()
+                        .find(section => section.id === this.firstRenderScrollElementId())?.sectionContent?.nativeElement;
+                    this.hasScrolled = true;
+                    section?.scrollIntoView({
+                        behavior: 'smooth',
+                        block: 'start',
+                        inline: 'start',
+                    });
+                });
+            }
+        });
     }
     ngAfterViewInit() {
         this.setLastSectionMinHeight();
@@ -6095,6 +6113,7 @@ class KitScrollNavigationComponent {
         if (!contentElement || !this.sections?.length || this.disableScrollUpdates) {
             return;
         }
+        this.hasScrolled = true;
         let index = 0;
         const contentScrollTop = contentElement.scrollTop + (contentElement.clientHeight / 2);
         const scrolledSectionIndexes = new Set();
@@ -6136,6 +6155,7 @@ class KitScrollNavigationComponent {
                 icon: section.buttonIcon,
                 tooltipText: section.tooltipText,
                 badgeCount: section.badgeCount,
+                id: section.id,
             };
         }) ?? [];
         this.collapsedListItems.set(sectionsData);
@@ -6157,7 +6177,7 @@ class KitScrollNavigationComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: KitScrollNavigationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: KitScrollNavigationComponent, isStandalone: true, selector: "kit-scroll-navigation", inputs: { isNavigationBtnDisabled: { classPropertyName: "isNavigationBtnDisabled", publicName: "isNavigationBtnDisabled", isSignal: true, isRequired: false, transformFunction: null }, dropdownDefaultText: { classPropertyName: "dropdownDefaultText", publicName: "dropdownDefaultText", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "sections", predicate: KitScrollNavigationSectionComponent }], viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true, static: true }, { propertyName: "collapsedList", first: true, predicate: KitCollapsedListComponent, descendants: true }], ngImport: i0, template: "<div class=\"kit-scroll-navigation\">\n  <div class=\"kit-scroll-navigation-items\">\n    <kit-collapsed-list [itemList]=\"collapsedListItems()\"\n                        [dropdownDefaultValueText]=\"dropdownDefaultText()\"\n                        [gap]=\"18\"\n                        [itemTemplate]=\"navItem\"\n                        [disableActions]=\"isNavigationBtnDisabled()\"\n                        [dropdownAlign]=\"kitCollapsedListDropdownAlign.END\"\n                        (onSelectItem)=\"scrollToSection($event)\" />\n  </div>\n\n  <div #content\n       class=\"kit-scroll-navigation-content\"\n       (scroll)=\"onSectionScroll()\">\n    @for (item of sections?.toArray(); track item) {\n      <ng-container *ngTemplateOutlet=\"item.sectionTemplate\"\n      ></ng-container>\n    }\n  </div>\n</div>\n\n<ng-template #navItem let-item>\n  <div kitBadge\n       [kitBadgeVisible]=\"item.badgeCount\"\n       [kitBadgeText]=\"item.badgeCount\"\n       [kitBadgeTheme]=\"kitBadgeTheme.DANGER\">\n    <kit-button kitTooltip\n                kitTooltipFilter='.nav-item'\n                class=\"nav-item\"\n                [active]=\"currentVisibleItem?.value === item.value\"\n                [type]=\"kitButtonType.GHOST\"\n                [kind]=\"kitButtonKind.SMALL\"\n                [icon]=\"item.icon\"\n                [iconPosition]=\"kitButtonIconPosition.LEADING\"\n                [state]=\"item.state ?? kitButtonState.DEFAULT\"\n                [label]=\"item.text\"\n                [title]=\"item.tooltipText\"\n                [disabled]=\"isNavigationBtnDisabled()\"\n                [kitTooltipVisible]=\"!!item.tooltipText\"\n    ></kit-button>\n  </div>\n</ng-template>\n", styles: [".kit-scroll-navigation{display:flex;flex-direction:column;height:100%}.kit-scroll-navigation-items{padding-bottom:27px}.kit-scroll-navigation .nav-item.active .kit-button .k-button{color:var(--ui-kit-color-white);border-color:var(--ui-kit-color-main);background:var(--ui-kit-color-main)}.kit-scroll-navigation-content{display:flex;flex-direction:column;flex:1;gap:20px;position:relative;overflow-y:auto}.kit-scroll-navigation-section{flex-shrink:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: KitButtonModule }, { kind: "component", type: KitButtonComponent, selector: "kit-button", inputs: ["disabled", "label", "type", "icon", "iconType", "kind", "state", "iconPosition", "buttonClass", "active"], outputs: ["clicked"] }, { kind: "ngmodule", type: KitSvgIconModule }, { kind: "component", type: KitCollapsedListComponent, selector: "kit-collapsed-list", inputs: ["itemList", "lineHeight", "dropdownDefaultValueText", "gap", "disableActions", "itemTemplate", "dropdownFooterTemplate", "dropdownItemTemplate", "dropdownNoDataTemplate", "appendTo", "alwaysShowDropdown", "dropdownAlign"], outputs: ["onSelectItem"] }, { kind: "directive", type: KitTooltipDirective, selector: "[kitTooltip]", inputs: ["kitTooltipPosition", "kitTooltipFilter", "kitTooltipTemplateRef", "kitTooltipVisible"] }, { kind: "directive", type: KitBadgeDirective, selector: "[kitBadge]", inputs: ["kitBadgeText", "kitBadgeTheme", "kitBadgeVisible"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: KitScrollNavigationComponent, isStandalone: true, selector: "kit-scroll-navigation", inputs: { isNavigationBtnDisabled: { classPropertyName: "isNavigationBtnDisabled", publicName: "isNavigationBtnDisabled", isSignal: true, isRequired: false, transformFunction: null }, dropdownDefaultText: { classPropertyName: "dropdownDefaultText", publicName: "dropdownDefaultText", isSignal: true, isRequired: false, transformFunction: null }, firstRenderScrollElementId: { classPropertyName: "firstRenderScrollElementId", publicName: "firstRenderScrollElementId", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "sections", predicate: KitScrollNavigationSectionComponent }], viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true, static: true }, { propertyName: "collapsedList", first: true, predicate: KitCollapsedListComponent, descendants: true }], ngImport: i0, template: "<div class=\"kit-scroll-navigation\">\n  <div class=\"kit-scroll-navigation-items\">\n    <kit-collapsed-list [itemList]=\"collapsedListItems()\"\n                        [dropdownDefaultValueText]=\"dropdownDefaultText()\"\n                        [gap]=\"18\"\n                        [itemTemplate]=\"navItem\"\n                        [disableActions]=\"isNavigationBtnDisabled()\"\n                        [dropdownAlign]=\"kitCollapsedListDropdownAlign.END\"\n                        (onSelectItem)=\"scrollToSection($event)\" />\n  </div>\n\n  <div #content\n       class=\"kit-scroll-navigation-content\"\n       (scroll)=\"onSectionScroll()\">\n    @for (item of sections?.toArray(); track item) {\n      <ng-container *ngTemplateOutlet=\"item.sectionTemplate\"\n      ></ng-container>\n    }\n  </div>\n</div>\n\n<ng-template #navItem let-item>\n  <div kitBadge\n       [kitBadgeVisible]=\"item.badgeCount\"\n       [kitBadgeText]=\"item.badgeCount\"\n       [kitBadgeTheme]=\"kitBadgeTheme.DANGER\">\n    <kit-button kitTooltip\n                kitTooltipFilter='.nav-item'\n                class=\"nav-item\"\n                [active]=\"currentVisibleItem?.value === item.value\"\n                [type]=\"kitButtonType.GHOST\"\n                [kind]=\"kitButtonKind.SMALL\"\n                [icon]=\"item.icon\"\n                [iconPosition]=\"kitButtonIconPosition.LEADING\"\n                [state]=\"item.state ?? kitButtonState.DEFAULT\"\n                [label]=\"item.text\"\n                [title]=\"item.tooltipText\"\n                [disabled]=\"isNavigationBtnDisabled()\"\n                [kitTooltipVisible]=\"!!item.tooltipText\"\n    ></kit-button>\n  </div>\n</ng-template>\n", styles: [".kit-scroll-navigation{display:flex;flex-direction:column;height:100%}.kit-scroll-navigation-items{padding-bottom:27px}.kit-scroll-navigation .nav-item.active .kit-button .k-button{color:var(--ui-kit-color-white);border-color:var(--ui-kit-color-main);background:var(--ui-kit-color-main)}.kit-scroll-navigation-content{display:flex;flex-direction:column;flex:1;gap:20px;position:relative;overflow-y:auto}.kit-scroll-navigation-section{flex-shrink:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: KitButtonModule }, { kind: "component", type: KitButtonComponent, selector: "kit-button", inputs: ["disabled", "label", "type", "icon", "iconType", "kind", "state", "iconPosition", "buttonClass", "active"], outputs: ["clicked"] }, { kind: "ngmodule", type: KitSvgIconModule }, { kind: "component", type: KitCollapsedListComponent, selector: "kit-collapsed-list", inputs: ["itemList", "lineHeight", "dropdownDefaultValueText", "gap", "disableActions", "itemTemplate", "dropdownFooterTemplate", "dropdownItemTemplate", "dropdownNoDataTemplate", "appendTo", "alwaysShowDropdown", "dropdownAlign"], outputs: ["onSelectItem"] }, { kind: "directive", type: KitTooltipDirective, selector: "[kitTooltip]", inputs: ["kitTooltipPosition", "kitTooltipFilter", "kitTooltipTemplateRef", "kitTooltipVisible"] }, { kind: "directive", type: KitBadgeDirective, selector: "[kitBadge]", inputs: ["kitBadgeText", "kitBadgeTheme", "kitBadgeVisible"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: KitScrollNavigationComponent, decorators: [{
             type: Component,
@@ -6169,7 +6189,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImpor
                         KitTooltipDirective,
                         KitBadgeDirective,
                     ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"kit-scroll-navigation\">\n  <div class=\"kit-scroll-navigation-items\">\n    <kit-collapsed-list [itemList]=\"collapsedListItems()\"\n                        [dropdownDefaultValueText]=\"dropdownDefaultText()\"\n                        [gap]=\"18\"\n                        [itemTemplate]=\"navItem\"\n                        [disableActions]=\"isNavigationBtnDisabled()\"\n                        [dropdownAlign]=\"kitCollapsedListDropdownAlign.END\"\n                        (onSelectItem)=\"scrollToSection($event)\" />\n  </div>\n\n  <div #content\n       class=\"kit-scroll-navigation-content\"\n       (scroll)=\"onSectionScroll()\">\n    @for (item of sections?.toArray(); track item) {\n      <ng-container *ngTemplateOutlet=\"item.sectionTemplate\"\n      ></ng-container>\n    }\n  </div>\n</div>\n\n<ng-template #navItem let-item>\n  <div kitBadge\n       [kitBadgeVisible]=\"item.badgeCount\"\n       [kitBadgeText]=\"item.badgeCount\"\n       [kitBadgeTheme]=\"kitBadgeTheme.DANGER\">\n    <kit-button kitTooltip\n                kitTooltipFilter='.nav-item'\n                class=\"nav-item\"\n                [active]=\"currentVisibleItem?.value === item.value\"\n                [type]=\"kitButtonType.GHOST\"\n                [kind]=\"kitButtonKind.SMALL\"\n                [icon]=\"item.icon\"\n                [iconPosition]=\"kitButtonIconPosition.LEADING\"\n                [state]=\"item.state ?? kitButtonState.DEFAULT\"\n                [label]=\"item.text\"\n                [title]=\"item.tooltipText\"\n                [disabled]=\"isNavigationBtnDisabled()\"\n                [kitTooltipVisible]=\"!!item.tooltipText\"\n    ></kit-button>\n  </div>\n</ng-template>\n", styles: [".kit-scroll-navigation{display:flex;flex-direction:column;height:100%}.kit-scroll-navigation-items{padding-bottom:27px}.kit-scroll-navigation .nav-item.active .kit-button .k-button{color:var(--ui-kit-color-white);border-color:var(--ui-kit-color-main);background:var(--ui-kit-color-main)}.kit-scroll-navigation-content{display:flex;flex-direction:column;flex:1;gap:20px;position:relative;overflow-y:auto}.kit-scroll-navigation-section{flex-shrink:0}\n"] }]
-        }], propDecorators: { sections: [{
+        }], ctorParameters: () => [], propDecorators: { sections: [{
                 type: ContentChildren,
                 args: [KitScrollNavigationSectionComponent]
             }], content: [{
@@ -6799,11 +6819,12 @@ class KitGlobalSearchComponent {
             }
         }
     }
-    navigate(link) {
-        if (!link) {
+    navigate(routeConfig) {
+        if (!routeConfig?.commands.length) {
             return;
         }
-        this.router.navigate(link, {
+        this.router.navigate(routeConfig.commands, {
+            ...routeConfig.extras,
             queryParams: {
                 search: this.searchValue,
             },
@@ -6860,13 +6881,17 @@ class KitGlobalSearchComponent {
         }
         return String(value);
     }
+    hasPermissionToShowPrompt(userPermissions, promptPermissions) {
+        const normalizedUserPermissions = new Set(userPermissions);
+        return promptPermissions.some(permission => normalizedUserPermissions.has(permission));
+    }
     findFilter(filterField) {
         return this.selectedFilters.find(selectedFilter => selectedFilter.field === filterField) || null;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: KitGlobalSearchComponent, deps: [{ token: i1$7.Router }, { token: i1$e.Store }, { token: i1$1.DatePipe }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: KitGlobalSearchComponent, isStandalone: true, selector: "kit-global-search", inputs: { searchFn: { classPropertyName: "searchFn", publicName: "searchFn", isSignal: true, isRequired: true, transformFunction: null }, displayedLineItemsNumber: { classPropertyName: "displayedLineItemsNumber", publicName: "displayedLineItemsNumber", isSignal: true, isRequired: false, transformFunction: null }, prompts: { classPropertyName: "prompts", publicName: "prompts", isSignal: true, isRequired: true, transformFunction: null }, filters: { classPropertyName: "filters", publicName: "filters", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "document:click": "documentClick($event)" } }, providers: [
             DatePipe,
-        ], viewQueries: [{ propertyName: "textbox", first: true, predicate: TextBoxComponent, descendants: true, isSignal: true }, { propertyName: "anchor", first: true, predicate: TextBoxComponent, descendants: true, read: ElementRef, isSignal: true }, { propertyName: "popup", first: true, predicate: ["popup"], descendants: true, read: KitPopupComponent, isSignal: true }, { propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef, isSignal: true }], ngImport: i0, template: "<div #container\n     class=\"global-search\"\n     [class.expanded]=\"isPopupOpen\">\n  <kendo-textbox #textbox\n                 class=\"textbox\"\n                 [placeholder]=\"'kit.globalSearch.placeholder' | translate\"\n                 [size]=\"'none'\"\n                 [(ngModel)]=\"searchValue\"\n                 (click)=\"openPopup()\">\n    <ng-template kendoTextBoxPrefixTemplate>\n      <kit-svg-icon [icon]=\"kitSvgIcon.SEARCH\"/>\n    </ng-template>\n    <ng-template kendoTextBoxSuffixTemplate>\n      <kit-svg-icon [icon]=\"kitSvgIcon.CIRCLE_CROSS_THIN\" \n                    (click)=\"clearSearch()\"/>\n    </ng-template>\n  </kendo-textbox>\n\n  <kit-popup #popup\n             [popupClass]=\"popupClass\"\n             [anchor]=\"anchor()\"\n             [content]=\"content\"\n             [closeOnOutsideClick]=\"false\" />\n\n  <ng-template #content>\n    @if (userPermissions$ | async; as userPermissions) {\n      <div class=\"popup-content\">\n        @if (showPropmts()) {\n          <div class=\"prompts\">\n            @for (prompt of prompts(); track prompt) {\n              @if (userPermissions.includes(prompt.permission)) {\n                <kit-pill [theme]=\"kitPillTheme.MAIN\"\n                          [selectable]=\"true\" \n                          (clicked)=\"onSelectPrompt(prompt)\">\n                  {{ prompt.label }}\n                </kit-pill>\n              }\n            }\n          </div>\n        } @else {\n          @if (searchResults().length) {\n            <div class=\"search-results\">\n              @for (category of searchResults(); track category?.name) {\n                @if (category) {\n                  <div class=\"category\">\n                    <p class=\"header\"\n                      [class.empty]=\"!category.total\">\n                      <kit-svg-icon [icon]=\"kitSvgIcon.CHECK_STICKER\"/>\n                      <span class=\"title\">{{ category.name.toUpperCase() }} ({{ category.total }})</span>\n                    </p>\n\n                    @for (lineItem of category.items.slice(0, this.displayedLineItemsNumber()); track $index) {\n                      <div class=\"line-item\"\n                           [class.has-link]=\"lineItem.link\"\n                           (click)=\"navigate(lineItem.link)\">\n                        <div class=\"main-content\">\n                          <div class=\"title\">\n                            <kit-truncate-text>\n                              <span [innerHTML]=\"lineItem.title | highlight:searchValue\"></span>\n                            </kit-truncate-text>\n                          </div>\n                          <div class=\"subtitle\">\n                            <kit-truncate-text>\n                              <span [innerHTML]=\"lineItem.subtitle || '' | highlight:searchValue\"></span>\n                            </kit-truncate-text>\n                          </div>\n                          <div>\n                            @if (lineItem.routePath?.from || lineItem.routePath?.to) {\n                              <kit-route-path class=\"route\"\n                                              [containerMode]=\"lineItem.routePath?.containerMode\"\n                                              [destinationPort]=\"lineItem.routePath?.to\"\n                                              [originPort]=\"lineItem.routePath?.from\"\n                                              [type]=\"lineItem.routePath?.type\"/>\n                            }\n                            @if (lineItem.status) {\n                              <kit-pill class=\"status\"\n                                        [theme]=\"kitPillTheme.MAIN\">\n                                {{ lineItem.status }}\n                              </kit-pill>\n                            }\n                          </div>\n                          <div class=\"dates first-date\">\n                            @if (lineItem.dates?.firstDate.value) {\n                              <kit-svg-icon [icon]=\"kitSvgIcon.CALENDAR\"/>\n                              <kit-truncate-text>{{ lineItem.dates?.firstDate.label }} \n                                <span class=\"date\">{{ lineItem.dates?.firstDate.value | date: dateFormat : 'UTC' }}</span>\n                              </kit-truncate-text>\n                            }\n                          </div>\n                          @if (lineItem.dates?.secondDate.value) {\n                            <div class=\"dates second-date\">\n                                <kit-svg-icon [icon]=\"kitSvgIcon.CALENDAR\"/>\n                                <kit-truncate-text>{{ lineItem.dates?.secondDate.label }} \n                                  <span class=\"date\">{{ lineItem.dates?.secondDate.value | date: dateFormat : 'UTC' }}</span>\n                                </kit-truncate-text>\n                            </div>\n                          }\n                        </div>\n\n                        <div class=\"additional-content\">\n                          @for (item of lineItem.additionalContent; track item.key) {\n                            <div>\n                              <span class=\"label\">{{ item.translateKey | translate }} </span>\n                              <span class=\"value\"\n                                    [innerHTML]=\"formatValue(item.value) | highlight:searchValue\"></span>\n                            </div>\n                          }\n                        </div>\n                      </div>\n                    }\n                    \n                    @if (category.total > this.displayedLineItemsNumber()) {\n                      <kit-button [label]=\"'kit.globalSearch.showResults' | translate\"\n                                  [type]=\"kitButtonType.GHOST\"\n                                  [kind]=\"kitButtonKind.SMALL\"\n                                  (clicked)=\"navigate(category.categoryLink)\"/>\n                    }\n                  </div>\n                }\n              }\n            </div>\n\n            @if (filters().length) {\n              <div class=\"filters\">\n                @for (filter of filters(); track $index) {\n                  <div>\n                    <p class=\"label\">{{ filter.label }}</p>\n                    @for (value of filter.values.slice(0, isFilterExpanded($index) ? filter.values.length : 3); track $index) {\n                      <kit-pill @heightExpandCollapseAnimation\n                                class=\"filter-value\"\n                                [theme]=\"kitPillTheme.MAIN\"\n                                [selectable]=\"true\"\n                                [selected]=\"isFilterSelected(value)\"\n                                (clicked)=\"onSelectFilter(value, filter.appliedTo)\">\n                        {{ value.title | translate }}\n                      </kit-pill>\n                    }\n                    @if (filter.values.length > 3) {\n                      <kit-button class=\"toggle-btn\"\n                                  [label]=\"`kit.globalSearch.${isFilterExpanded($index) ? 'showLess' : 'showMore'}` | translate\"\n                                  [icon]=\"isFilterExpanded($index) ? kitSvgIcon.CHEVRON_UP : kitSvgIcon.CHEVRON_DOWN\"\n                                  [iconPosition]=\"kitButtonIconPosition.LEADING\"\n                                  [iconType]=\"kitSvgIconType.STROKE\"\n                                  [kind]=\"kitButtonKind.SMALL\"\n                                  [type]=\"kitButtonType.GHOST\"\n                                  (clicked)=\"toggleFilterExpanded($index)\"/>\n                    }\n                  </div>\n                }\n              </div>\n            }\n          } @else {\n            <kit-empty-section class=\"empty-section\"\n                               [text]=\"'kit.globalSearch.noData' | translate\"/>\n          }\n        }\n      </div>\n    }\n  </ng-template>\n</div>\n", styles: [":host{position:relative;display:block}:host .global-search{max-width:360px}:host .global-search.expanded{max-width:100%}:host .global-search .textbox{border-color:var(--ui-kit-color-grey-11);box-shadow:none;border-radius:8px}:host .global-search .textbox.k-focus{border-color:var(--ui-kit-color-main)}:host ::ng-deep .k-animation-container{width:100%}:host ::ng-deep .kit-global-search-popup{overflow:auto;padding:0}:host ::ng-deep .kit-global-search-popup .popup-content{display:flex;justify-content:space-between}:host ::ng-deep .global-search .k-textbox.k-input .k-input-inner{padding:11px 8px}:host ::ng-deep .global-search .k-textbox.k-input .kit-svg-icon .search-icon{width:37px;height:37px;fill:none;stroke:var(--ui-kit-color-grey-10);padding-left:12px}:host ::ng-deep .global-search .k-textbox.k-input .kit-svg-icon .circle-cross-thin-icon{width:30px;height:30px;fill:none;stroke:var(--ui-kit-color-grey-12);padding-right:12px;cursor:pointer}:host ::ng-deep .search-results{padding:24px;flex:1}:host ::ng-deep .search-results .category:not(:last-child){margin-bottom:20px}:host ::ng-deep .search-results .category .header{display:flex;align-items:center;margin:0 0 20px}:host ::ng-deep .search-results .category .header .icon.check-sticker-icon{width:16px;height:16px;fill:var(--ui-kit-color-main);margin-right:10px}:host ::ng-deep .search-results .category .header .title{color:var(--ui-kit-color-main)}:host ::ng-deep .search-results .category .header.empty{margin:0}:host ::ng-deep .search-results .category .header.empty .icon.check-sticker-icon{fill:var(--ui-kit-color-grey-12)}:host ::ng-deep .search-results .category .header.empty .title{color:var(--ui-kit-color-grey-12)}:host ::ng-deep .search-results .category .line-item{min-width:700px;padding-bottom:20px;margin-bottom:20px;border-bottom:1px solid var(--ui-kit-color-grey-11)}:host ::ng-deep .search-results .category .line-item.has-link{cursor:pointer}:host ::ng-deep .search-results .category .line-item.has-link:hover{opacity:.7}:host ::ng-deep .search-results .category .line-item .highlighted{color:var(--ui-kit-color-main)}:host ::ng-deep .search-results .category .line-item .main-content{display:grid;grid-template-columns:minmax(50px,1fr) minmax(50px,1fr) minmax(200px,2fr) repeat(auto-fit,minmax(65px,1.5fr));gap:20px;align-items:center}:host ::ng-deep .search-results .category .line-item .main-content .title{font-size:16px;line-height:22px;font-weight:500}:host ::ng-deep .search-results .category .line-item .main-content .title,:host ::ng-deep .search-results .category .line-item .main-content .subtitle{color:var(--ui-kit-color-grey-10)}:host ::ng-deep .search-results .category .line-item .main-content .icon.calendar-icon{width:18px;height:18px;fill:var(--ui-kit-color-grey-12);margin-right:3px}:host ::ng-deep .search-results .category .line-item .main-content .route-path{justify-content:center}:host ::ng-deep .search-results .category .line-item .main-content .status{white-space:nowrap;width:min-content;display:block;margin:auto}:host ::ng-deep .search-results .category .line-item .main-content .kit-pill-content{margin:auto}:host ::ng-deep .search-results .category .line-item .main-content .dates{display:flex;align-items:center;justify-self:end;font-size:12px;line-height:14px}:host ::ng-deep .search-results .category .line-item .main-content .dates.date{font-size:14px;line-height:20px;font-weight:500}:host ::ng-deep .search-results .category .line-item .main-content .dates.first-date{color:var(--ui-kit-color-grey-14)}:host ::ng-deep .search-results .category .line-item .main-content .dates.second-date{color:var(--ui-kit-color-grey-10)}:host ::ng-deep .search-results .category .line-item .additional-content{text-align:right}:host ::ng-deep .search-results .category .line-item .additional-content .label{color:var(--ui-kit-color-grey-14)}:host ::ng-deep .search-results .category .line-item .additional-content .value{color:var(--ui-kit-color-grey-10)}:host ::ng-deep .filters{background-color:var(--ui-kit-color-grey-13);padding:24px;min-width:175px}:host ::ng-deep .filters .label{font-size:12px;line-height:14px;color:var(--ui-kit-color-grey-10);margin-bottom:10px;text-transform:uppercase}:host ::ng-deep .filters .filter-value{margin-bottom:10px;display:block}:host ::ng-deep .filters .filter-value .kit-pill{line-height:16px;text-align:left;display:inline-block;padding:7px 16px;font-size:13px}:host ::ng-deep .filters .toggle-btn{margin-bottom:40px;display:block}:host ::ng-deep .filters .toggle-btn .k-button{min-width:125px;padding:6px 16px;min-height:32px}:host ::ng-deep .prompts{display:flex;gap:10px;padding:24px}:host ::ng-deep .empty-section{container:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: KitTextboxModule }, { kind: "ngmodule", type: KitSvgIconModule }, { kind: "component", type: KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "component", type: i1$3.TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "type", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "successSvgIcon", "errorIcon", "errorSvgIcon", "clearButtonIcon", "clearButtonSvgIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength", "inputAttributes"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }, { kind: "directive", type: i1$3.TextBoxSuffixTemplateDirective, selector: "[kendoTextBoxSuffixTemplate]", inputs: ["showSeparator"] }, { kind: "directive", type: i1$3.TextBoxPrefixTemplateDirective, selector: "[kendoTextBoxPrefixTemplate]", inputs: ["showSeparator"] }, { kind: "component", type: KitPopupComponent, selector: "kit-popup", inputs: ["anchor", "content", "closeOnOutsideClick", "showFooter", "cancelButtonLabel", "applyButtonLabel", "isApplyButtonDisabled", "positionMode", "popupClass", "closePopupOnCancel"], outputs: ["onCancel", "onApply", "onOpen", "onClose"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: KitRoutePathComponent, selector: "kit-route-path", inputs: ["originPort", "destinationPort", "type", "containerMode"] }, { kind: "ngmodule", type: KitButtonModule }, { kind: "component", type: KitButtonComponent, selector: "kit-button", inputs: ["disabled", "label", "type", "icon", "iconType", "kind", "state", "iconPosition", "buttonClass", "active"], outputs: ["clicked"] }, { kind: "component", type: KitTruncateTextComponent, selector: "kit-truncate-text" }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: KitEmptySectionComponent, selector: "kit-empty-section", inputs: ["text"] }, { kind: "component", type: KitPillComponent, selector: "kit-pill", inputs: ["removable", "selectable", "selected", "type", "theme", "icon", "iconType"], outputs: ["clicked", "removed"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i1$b.TranslatePipe, name: "translate" }, { kind: "pipe", type: HighlightPipe, name: "highlight" }], animations: [
+        ], viewQueries: [{ propertyName: "textbox", first: true, predicate: TextBoxComponent, descendants: true, isSignal: true }, { propertyName: "anchor", first: true, predicate: TextBoxComponent, descendants: true, read: ElementRef, isSignal: true }, { propertyName: "popup", first: true, predicate: ["popup"], descendants: true, read: KitPopupComponent, isSignal: true }, { propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef, isSignal: true }], ngImport: i0, template: "<div #container\n     class=\"global-search\"\n     [class.expanded]=\"isPopupOpen\">\n  <kendo-textbox #textbox\n                 class=\"textbox\"\n                 [placeholder]=\"'kit.globalSearch.placeholder' | translate\"\n                 [size]=\"'none'\"\n                 [(ngModel)]=\"searchValue\"\n                 (click)=\"openPopup()\">\n    <ng-template kendoTextBoxPrefixTemplate>\n      <kit-svg-icon [icon]=\"kitSvgIcon.SEARCH\"/>\n    </ng-template>\n    <ng-template kendoTextBoxSuffixTemplate>\n      <kit-svg-icon [icon]=\"kitSvgIcon.CIRCLE_CROSS_THIN\" \n                    (click)=\"clearSearch()\"/>\n    </ng-template>\n  </kendo-textbox>\n\n  <kit-popup #popup\n             [popupClass]=\"popupClass\"\n             [anchor]=\"anchor()\"\n             [content]=\"content\"\n             [closeOnOutsideClick]=\"false\" />\n\n  <ng-template #content>\n    @if (userPermissions$ | async; as userPermissions) {\n      <div class=\"popup-content\">\n        @if (showPropmts()) {\n          <div class=\"prompts\">\n            @for (prompt of prompts(); track prompt) {\n              @if (hasPermissionToShowPrompt(userPermissions, prompt.permissions)) {\n                <kit-pill [theme]=\"kitPillTheme.MAIN\"\n                          [selectable]=\"true\" \n                          (clicked)=\"onSelectPrompt(prompt)\">\n                  {{ prompt.label }}\n                </kit-pill>\n              }\n            }\n          </div>\n        } @else {\n          @if (searchResults().length) {\n            <div class=\"search-results\">\n              @for (category of searchResults(); track category?.name) {\n                @if (category) {\n                  <div class=\"category\">\n                    <p class=\"header\"\n                      [class.empty]=\"!category.total\">\n                      <kit-svg-icon [icon]=\"kitSvgIcon.CHECK_STICKER\"/>\n                      <span class=\"title\">{{ category.name.toUpperCase() }} ({{ category.total }})</span>\n                    </p>\n\n                    @for (lineItem of category.items.slice(0, this.displayedLineItemsNumber()); track $index) {\n                      <div class=\"line-item\"\n                           [class.has-link]=\"lineItem.routeConfig\"\n                           (click)=\"navigate(lineItem.routeConfig)\">\n                        <div class=\"main-content\">\n                          <div class=\"title\">\n                            <kit-truncate-text>\n                              <span [innerHTML]=\"lineItem.title | highlight:searchValue\"></span>\n                            </kit-truncate-text>\n                          </div>\n                          <div class=\"subtitle\">\n                            <kit-truncate-text>\n                              <span [innerHTML]=\"lineItem.subtitle || '' | highlight:searchValue\"></span>\n                            </kit-truncate-text>\n                          </div>\n                          <div>\n                            @if (lineItem.routePath?.from || lineItem.routePath?.to) {\n                              <kit-route-path class=\"route\"\n                                              [containerMode]=\"lineItem.routePath?.containerMode\"\n                                              [destinationPort]=\"lineItem.routePath?.to\"\n                                              [originPort]=\"lineItem.routePath?.from\"\n                                              [type]=\"lineItem.routePath?.type\"/>\n                            }\n                            @if (lineItem.status) {\n                              <kit-pill class=\"status\"\n                                        [theme]=\"kitPillTheme.MAIN\">\n                                {{ lineItem.status }}\n                              </kit-pill>\n                            }\n                          </div>\n                          <div class=\"dates first-date\">\n                            @if (lineItem.dates?.firstDate.value) {\n                              <kit-svg-icon [icon]=\"kitSvgIcon.CALENDAR\"/>\n                              <kit-truncate-text>{{ lineItem.dates?.firstDate.label }} \n                                <span class=\"date\">{{ lineItem.dates?.firstDate.value | date: dateFormat : 'UTC' }}</span>\n                              </kit-truncate-text>\n                            }\n                          </div>\n                          @if (lineItem.dates?.secondDate.value) {\n                            <div class=\"dates second-date\">\n                                <kit-svg-icon [icon]=\"kitSvgIcon.CALENDAR\"/>\n                                <kit-truncate-text>{{ lineItem.dates?.secondDate.label }} \n                                  <span class=\"date\">{{ lineItem.dates?.secondDate.value | date: dateFormat : 'UTC' }}</span>\n                                </kit-truncate-text>\n                            </div>\n                          }\n                        </div>\n\n                        <div class=\"additional-content\">\n                          @for (item of lineItem.additionalContent; track item.key) {\n                            <div>\n                              <span class=\"label\">{{ item.translateKey | translate }} </span>\n                              <span class=\"value\"\n                                    [innerHTML]=\"formatValue(item.value) | highlight:searchValue\"></span>\n                            </div>\n                          }\n                        </div>\n                      </div>\n                    }\n                    \n                    @if (category.total > this.displayedLineItemsNumber()) {\n                      <kit-button [label]=\"'kit.globalSearch.showResults' | translate\"\n                                  [type]=\"kitButtonType.GHOST\"\n                                  [kind]=\"kitButtonKind.SMALL\"\n                                  (clicked)=\"navigate(category.routeConfig)\"/>\n                    }\n                  </div>\n                }\n              }\n            </div>\n\n            @if (filters().length) {\n              <div class=\"filters\">\n                @for (filter of filters(); track $index) {\n                  <div>\n                    <p class=\"label\">{{ filter.label }}</p>\n                    @for (value of filter.values.slice(0, isFilterExpanded($index) ? filter.values.length : 3); track $index) {\n                      <kit-pill @heightExpandCollapseAnimation\n                                class=\"filter-value\"\n                                [theme]=\"kitPillTheme.MAIN\"\n                                [selectable]=\"true\"\n                                [selected]=\"isFilterSelected(value)\"\n                                (clicked)=\"onSelectFilter(value, filter.appliedTo)\">\n                        {{ value.title | translate }}\n                      </kit-pill>\n                    }\n                    @if (filter.values.length > 3) {\n                      <kit-button class=\"toggle-btn\"\n                                  [label]=\"`kit.globalSearch.${isFilterExpanded($index) ? 'showLess' : 'showMore'}` | translate\"\n                                  [icon]=\"isFilterExpanded($index) ? kitSvgIcon.CHEVRON_UP : kitSvgIcon.CHEVRON_DOWN\"\n                                  [iconPosition]=\"kitButtonIconPosition.LEADING\"\n                                  [iconType]=\"kitSvgIconType.STROKE\"\n                                  [kind]=\"kitButtonKind.SMALL\"\n                                  [type]=\"kitButtonType.GHOST\"\n                                  (clicked)=\"toggleFilterExpanded($index)\"/>\n                    }\n                  </div>\n                }\n              </div>\n            }\n          } @else {\n            <kit-empty-section class=\"empty-section\"\n                               [text]=\"'kit.globalSearch.noData' | translate\"/>\n          }\n        }\n      </div>\n    }\n  </ng-template>\n</div>\n", styles: [":host{position:relative;display:block}:host .global-search{max-width:360px}:host .global-search.expanded{max-width:100%}:host .global-search .textbox{border-color:var(--ui-kit-color-grey-11);box-shadow:none;border-radius:8px}:host .global-search .textbox.k-focus{border-color:var(--ui-kit-color-main)}:host ::ng-deep .k-animation-container{width:100%}:host ::ng-deep .kit-global-search-popup{overflow:auto;padding:0}:host ::ng-deep .kit-global-search-popup .popup-content{display:flex;justify-content:space-between}:host ::ng-deep .global-search .k-textbox.k-input .k-input-inner{padding:11px 8px}:host ::ng-deep .global-search .k-textbox.k-input .kit-svg-icon .search-icon{width:37px;height:37px;fill:none;stroke:var(--ui-kit-color-grey-10);padding-left:12px}:host ::ng-deep .global-search .k-textbox.k-input .kit-svg-icon .circle-cross-thin-icon{width:30px;height:30px;fill:none;stroke:var(--ui-kit-color-grey-12);padding-right:12px;cursor:pointer}:host ::ng-deep .search-results{padding:24px;flex:1}:host ::ng-deep .search-results .category:not(:last-child){margin-bottom:20px}:host ::ng-deep .search-results .category .header{display:flex;align-items:center;margin:0 0 20px}:host ::ng-deep .search-results .category .header .icon.check-sticker-icon{width:16px;height:16px;fill:var(--ui-kit-color-main);margin-right:10px}:host ::ng-deep .search-results .category .header .title{color:var(--ui-kit-color-main)}:host ::ng-deep .search-results .category .header.empty{margin:0}:host ::ng-deep .search-results .category .header.empty .icon.check-sticker-icon{fill:var(--ui-kit-color-grey-12)}:host ::ng-deep .search-results .category .header.empty .title{color:var(--ui-kit-color-grey-12)}:host ::ng-deep .search-results .category .line-item{min-width:700px;padding-bottom:20px;margin-bottom:20px;border-bottom:1px solid var(--ui-kit-color-grey-11)}:host ::ng-deep .search-results .category .line-item.has-link{cursor:pointer}:host ::ng-deep .search-results .category .line-item.has-link:hover{opacity:.7}:host ::ng-deep .search-results .category .line-item .highlighted{color:var(--ui-kit-color-main)}:host ::ng-deep .search-results .category .line-item .main-content{display:grid;grid-template-columns:minmax(50px,1fr) minmax(50px,1fr) minmax(200px,2fr) repeat(auto-fit,minmax(65px,1.5fr));gap:20px;align-items:center}:host ::ng-deep .search-results .category .line-item .main-content .title{font-size:16px;line-height:22px;font-weight:500}:host ::ng-deep .search-results .category .line-item .main-content .title,:host ::ng-deep .search-results .category .line-item .main-content .subtitle{color:var(--ui-kit-color-grey-10)}:host ::ng-deep .search-results .category .line-item .main-content .icon.calendar-icon{width:18px;height:18px;fill:var(--ui-kit-color-grey-12);margin-right:3px}:host ::ng-deep .search-results .category .line-item .main-content .route-path{justify-content:center}:host ::ng-deep .search-results .category .line-item .main-content .status{white-space:nowrap;width:min-content;display:block;margin:auto}:host ::ng-deep .search-results .category .line-item .main-content .kit-pill-content{margin:auto}:host ::ng-deep .search-results .category .line-item .main-content .dates{display:flex;align-items:center;justify-self:end;font-size:12px;line-height:14px}:host ::ng-deep .search-results .category .line-item .main-content .dates.date{font-size:14px;line-height:20px;font-weight:500}:host ::ng-deep .search-results .category .line-item .main-content .dates.first-date{color:var(--ui-kit-color-grey-14)}:host ::ng-deep .search-results .category .line-item .main-content .dates.second-date{color:var(--ui-kit-color-grey-10)}:host ::ng-deep .search-results .category .line-item .additional-content{text-align:right}:host ::ng-deep .search-results .category .line-item .additional-content .label{color:var(--ui-kit-color-grey-14)}:host ::ng-deep .search-results .category .line-item .additional-content .value{color:var(--ui-kit-color-grey-10)}:host ::ng-deep .filters{background-color:var(--ui-kit-color-grey-13);padding:24px;min-width:175px}:host ::ng-deep .filters .label{font-size:12px;line-height:14px;color:var(--ui-kit-color-grey-10);margin-bottom:10px;text-transform:uppercase}:host ::ng-deep .filters .filter-value{margin-bottom:10px;display:block}:host ::ng-deep .filters .filter-value .kit-pill{line-height:16px;text-align:left;display:inline-block;padding:7px 16px;font-size:13px}:host ::ng-deep .filters .toggle-btn{margin-bottom:40px;display:block}:host ::ng-deep .filters .toggle-btn .k-button{min-width:125px;padding:6px 16px;min-height:32px}:host ::ng-deep .prompts{display:flex;gap:10px;padding:24px}:host ::ng-deep .empty-section{container:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: KitTextboxModule }, { kind: "ngmodule", type: KitSvgIconModule }, { kind: "component", type: KitSvgIconComponent, selector: "kit-svg-icon", inputs: ["icon", "iconClass"] }, { kind: "component", type: i1$3.TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "type", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "successSvgIcon", "errorIcon", "errorSvgIcon", "clearButtonIcon", "clearButtonSvgIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength", "inputAttributes"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }, { kind: "directive", type: i1$3.TextBoxSuffixTemplateDirective, selector: "[kendoTextBoxSuffixTemplate]", inputs: ["showSeparator"] }, { kind: "directive", type: i1$3.TextBoxPrefixTemplateDirective, selector: "[kendoTextBoxPrefixTemplate]", inputs: ["showSeparator"] }, { kind: "component", type: KitPopupComponent, selector: "kit-popup", inputs: ["anchor", "content", "closeOnOutsideClick", "showFooter", "cancelButtonLabel", "applyButtonLabel", "isApplyButtonDisabled", "positionMode", "popupClass", "closePopupOnCancel"], outputs: ["onCancel", "onApply", "onOpen", "onClose"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: KitRoutePathComponent, selector: "kit-route-path", inputs: ["originPort", "destinationPort", "type", "containerMode"] }, { kind: "ngmodule", type: KitButtonModule }, { kind: "component", type: KitButtonComponent, selector: "kit-button", inputs: ["disabled", "label", "type", "icon", "iconType", "kind", "state", "iconPosition", "buttonClass", "active"], outputs: ["clicked"] }, { kind: "component", type: KitTruncateTextComponent, selector: "kit-truncate-text" }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: KitEmptySectionComponent, selector: "kit-empty-section", inputs: ["text"] }, { kind: "component", type: KitPillComponent, selector: "kit-pill", inputs: ["removable", "selectable", "selected", "type", "theme", "icon", "iconType"], outputs: ["clicked", "removed"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i1$b.TranslatePipe, name: "translate" }, { kind: "pipe", type: HighlightPipe, name: "highlight" }], animations: [
             expandCollapseAnimation('height'),
         ], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
@@ -6892,13 +6917,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImpor
                         expandCollapseAnimation('height'),
                     ], providers: [
                         DatePipe,
-                    ], template: "<div #container\n     class=\"global-search\"\n     [class.expanded]=\"isPopupOpen\">\n  <kendo-textbox #textbox\n                 class=\"textbox\"\n                 [placeholder]=\"'kit.globalSearch.placeholder' | translate\"\n                 [size]=\"'none'\"\n                 [(ngModel)]=\"searchValue\"\n                 (click)=\"openPopup()\">\n    <ng-template kendoTextBoxPrefixTemplate>\n      <kit-svg-icon [icon]=\"kitSvgIcon.SEARCH\"/>\n    </ng-template>\n    <ng-template kendoTextBoxSuffixTemplate>\n      <kit-svg-icon [icon]=\"kitSvgIcon.CIRCLE_CROSS_THIN\" \n                    (click)=\"clearSearch()\"/>\n    </ng-template>\n  </kendo-textbox>\n\n  <kit-popup #popup\n             [popupClass]=\"popupClass\"\n             [anchor]=\"anchor()\"\n             [content]=\"content\"\n             [closeOnOutsideClick]=\"false\" />\n\n  <ng-template #content>\n    @if (userPermissions$ | async; as userPermissions) {\n      <div class=\"popup-content\">\n        @if (showPropmts()) {\n          <div class=\"prompts\">\n            @for (prompt of prompts(); track prompt) {\n              @if (userPermissions.includes(prompt.permission)) {\n                <kit-pill [theme]=\"kitPillTheme.MAIN\"\n                          [selectable]=\"true\" \n                          (clicked)=\"onSelectPrompt(prompt)\">\n                  {{ prompt.label }}\n                </kit-pill>\n              }\n            }\n          </div>\n        } @else {\n          @if (searchResults().length) {\n            <div class=\"search-results\">\n              @for (category of searchResults(); track category?.name) {\n                @if (category) {\n                  <div class=\"category\">\n                    <p class=\"header\"\n                      [class.empty]=\"!category.total\">\n                      <kit-svg-icon [icon]=\"kitSvgIcon.CHECK_STICKER\"/>\n                      <span class=\"title\">{{ category.name.toUpperCase() }} ({{ category.total }})</span>\n                    </p>\n\n                    @for (lineItem of category.items.slice(0, this.displayedLineItemsNumber()); track $index) {\n                      <div class=\"line-item\"\n                           [class.has-link]=\"lineItem.link\"\n                           (click)=\"navigate(lineItem.link)\">\n                        <div class=\"main-content\">\n                          <div class=\"title\">\n                            <kit-truncate-text>\n                              <span [innerHTML]=\"lineItem.title | highlight:searchValue\"></span>\n                            </kit-truncate-text>\n                          </div>\n                          <div class=\"subtitle\">\n                            <kit-truncate-text>\n                              <span [innerHTML]=\"lineItem.subtitle || '' | highlight:searchValue\"></span>\n                            </kit-truncate-text>\n                          </div>\n                          <div>\n                            @if (lineItem.routePath?.from || lineItem.routePath?.to) {\n                              <kit-route-path class=\"route\"\n                                              [containerMode]=\"lineItem.routePath?.containerMode\"\n                                              [destinationPort]=\"lineItem.routePath?.to\"\n                                              [originPort]=\"lineItem.routePath?.from\"\n                                              [type]=\"lineItem.routePath?.type\"/>\n                            }\n                            @if (lineItem.status) {\n                              <kit-pill class=\"status\"\n                                        [theme]=\"kitPillTheme.MAIN\">\n                                {{ lineItem.status }}\n                              </kit-pill>\n                            }\n                          </div>\n                          <div class=\"dates first-date\">\n                            @if (lineItem.dates?.firstDate.value) {\n                              <kit-svg-icon [icon]=\"kitSvgIcon.CALENDAR\"/>\n                              <kit-truncate-text>{{ lineItem.dates?.firstDate.label }} \n                                <span class=\"date\">{{ lineItem.dates?.firstDate.value | date: dateFormat : 'UTC' }}</span>\n                              </kit-truncate-text>\n                            }\n                          </div>\n                          @if (lineItem.dates?.secondDate.value) {\n                            <div class=\"dates second-date\">\n                                <kit-svg-icon [icon]=\"kitSvgIcon.CALENDAR\"/>\n                                <kit-truncate-text>{{ lineItem.dates?.secondDate.label }} \n                                  <span class=\"date\">{{ lineItem.dates?.secondDate.value | date: dateFormat : 'UTC' }}</span>\n                                </kit-truncate-text>\n                            </div>\n                          }\n                        </div>\n\n                        <div class=\"additional-content\">\n                          @for (item of lineItem.additionalContent; track item.key) {\n                            <div>\n                              <span class=\"label\">{{ item.translateKey | translate }} </span>\n                              <span class=\"value\"\n                                    [innerHTML]=\"formatValue(item.value) | highlight:searchValue\"></span>\n                            </div>\n                          }\n                        </div>\n                      </div>\n                    }\n                    \n                    @if (category.total > this.displayedLineItemsNumber()) {\n                      <kit-button [label]=\"'kit.globalSearch.showResults' | translate\"\n                                  [type]=\"kitButtonType.GHOST\"\n                                  [kind]=\"kitButtonKind.SMALL\"\n                                  (clicked)=\"navigate(category.categoryLink)\"/>\n                    }\n                  </div>\n                }\n              }\n            </div>\n\n            @if (filters().length) {\n              <div class=\"filters\">\n                @for (filter of filters(); track $index) {\n                  <div>\n                    <p class=\"label\">{{ filter.label }}</p>\n                    @for (value of filter.values.slice(0, isFilterExpanded($index) ? filter.values.length : 3); track $index) {\n                      <kit-pill @heightExpandCollapseAnimation\n                                class=\"filter-value\"\n                                [theme]=\"kitPillTheme.MAIN\"\n                                [selectable]=\"true\"\n                                [selected]=\"isFilterSelected(value)\"\n                                (clicked)=\"onSelectFilter(value, filter.appliedTo)\">\n                        {{ value.title | translate }}\n                      </kit-pill>\n                    }\n                    @if (filter.values.length > 3) {\n                      <kit-button class=\"toggle-btn\"\n                                  [label]=\"`kit.globalSearch.${isFilterExpanded($index) ? 'showLess' : 'showMore'}` | translate\"\n                                  [icon]=\"isFilterExpanded($index) ? kitSvgIcon.CHEVRON_UP : kitSvgIcon.CHEVRON_DOWN\"\n                                  [iconPosition]=\"kitButtonIconPosition.LEADING\"\n                                  [iconType]=\"kitSvgIconType.STROKE\"\n                                  [kind]=\"kitButtonKind.SMALL\"\n                                  [type]=\"kitButtonType.GHOST\"\n                                  (clicked)=\"toggleFilterExpanded($index)\"/>\n                    }\n                  </div>\n                }\n              </div>\n            }\n          } @else {\n            <kit-empty-section class=\"empty-section\"\n                               [text]=\"'kit.globalSearch.noData' | translate\"/>\n          }\n        }\n      </div>\n    }\n  </ng-template>\n</div>\n", styles: [":host{position:relative;display:block}:host .global-search{max-width:360px}:host .global-search.expanded{max-width:100%}:host .global-search .textbox{border-color:var(--ui-kit-color-grey-11);box-shadow:none;border-radius:8px}:host .global-search .textbox.k-focus{border-color:var(--ui-kit-color-main)}:host ::ng-deep .k-animation-container{width:100%}:host ::ng-deep .kit-global-search-popup{overflow:auto;padding:0}:host ::ng-deep .kit-global-search-popup .popup-content{display:flex;justify-content:space-between}:host ::ng-deep .global-search .k-textbox.k-input .k-input-inner{padding:11px 8px}:host ::ng-deep .global-search .k-textbox.k-input .kit-svg-icon .search-icon{width:37px;height:37px;fill:none;stroke:var(--ui-kit-color-grey-10);padding-left:12px}:host ::ng-deep .global-search .k-textbox.k-input .kit-svg-icon .circle-cross-thin-icon{width:30px;height:30px;fill:none;stroke:var(--ui-kit-color-grey-12);padding-right:12px;cursor:pointer}:host ::ng-deep .search-results{padding:24px;flex:1}:host ::ng-deep .search-results .category:not(:last-child){margin-bottom:20px}:host ::ng-deep .search-results .category .header{display:flex;align-items:center;margin:0 0 20px}:host ::ng-deep .search-results .category .header .icon.check-sticker-icon{width:16px;height:16px;fill:var(--ui-kit-color-main);margin-right:10px}:host ::ng-deep .search-results .category .header .title{color:var(--ui-kit-color-main)}:host ::ng-deep .search-results .category .header.empty{margin:0}:host ::ng-deep .search-results .category .header.empty .icon.check-sticker-icon{fill:var(--ui-kit-color-grey-12)}:host ::ng-deep .search-results .category .header.empty .title{color:var(--ui-kit-color-grey-12)}:host ::ng-deep .search-results .category .line-item{min-width:700px;padding-bottom:20px;margin-bottom:20px;border-bottom:1px solid var(--ui-kit-color-grey-11)}:host ::ng-deep .search-results .category .line-item.has-link{cursor:pointer}:host ::ng-deep .search-results .category .line-item.has-link:hover{opacity:.7}:host ::ng-deep .search-results .category .line-item .highlighted{color:var(--ui-kit-color-main)}:host ::ng-deep .search-results .category .line-item .main-content{display:grid;grid-template-columns:minmax(50px,1fr) minmax(50px,1fr) minmax(200px,2fr) repeat(auto-fit,minmax(65px,1.5fr));gap:20px;align-items:center}:host ::ng-deep .search-results .category .line-item .main-content .title{font-size:16px;line-height:22px;font-weight:500}:host ::ng-deep .search-results .category .line-item .main-content .title,:host ::ng-deep .search-results .category .line-item .main-content .subtitle{color:var(--ui-kit-color-grey-10)}:host ::ng-deep .search-results .category .line-item .main-content .icon.calendar-icon{width:18px;height:18px;fill:var(--ui-kit-color-grey-12);margin-right:3px}:host ::ng-deep .search-results .category .line-item .main-content .route-path{justify-content:center}:host ::ng-deep .search-results .category .line-item .main-content .status{white-space:nowrap;width:min-content;display:block;margin:auto}:host ::ng-deep .search-results .category .line-item .main-content .kit-pill-content{margin:auto}:host ::ng-deep .search-results .category .line-item .main-content .dates{display:flex;align-items:center;justify-self:end;font-size:12px;line-height:14px}:host ::ng-deep .search-results .category .line-item .main-content .dates.date{font-size:14px;line-height:20px;font-weight:500}:host ::ng-deep .search-results .category .line-item .main-content .dates.first-date{color:var(--ui-kit-color-grey-14)}:host ::ng-deep .search-results .category .line-item .main-content .dates.second-date{color:var(--ui-kit-color-grey-10)}:host ::ng-deep .search-results .category .line-item .additional-content{text-align:right}:host ::ng-deep .search-results .category .line-item .additional-content .label{color:var(--ui-kit-color-grey-14)}:host ::ng-deep .search-results .category .line-item .additional-content .value{color:var(--ui-kit-color-grey-10)}:host ::ng-deep .filters{background-color:var(--ui-kit-color-grey-13);padding:24px;min-width:175px}:host ::ng-deep .filters .label{font-size:12px;line-height:14px;color:var(--ui-kit-color-grey-10);margin-bottom:10px;text-transform:uppercase}:host ::ng-deep .filters .filter-value{margin-bottom:10px;display:block}:host ::ng-deep .filters .filter-value .kit-pill{line-height:16px;text-align:left;display:inline-block;padding:7px 16px;font-size:13px}:host ::ng-deep .filters .toggle-btn{margin-bottom:40px;display:block}:host ::ng-deep .filters .toggle-btn .k-button{min-width:125px;padding:6px 16px;min-height:32px}:host ::ng-deep .prompts{display:flex;gap:10px;padding:24px}:host ::ng-deep .empty-section{container:none}\n"] }]
+                    ], template: "<div #container\n     class=\"global-search\"\n     [class.expanded]=\"isPopupOpen\">\n  <kendo-textbox #textbox\n                 class=\"textbox\"\n                 [placeholder]=\"'kit.globalSearch.placeholder' | translate\"\n                 [size]=\"'none'\"\n                 [(ngModel)]=\"searchValue\"\n                 (click)=\"openPopup()\">\n    <ng-template kendoTextBoxPrefixTemplate>\n      <kit-svg-icon [icon]=\"kitSvgIcon.SEARCH\"/>\n    </ng-template>\n    <ng-template kendoTextBoxSuffixTemplate>\n      <kit-svg-icon [icon]=\"kitSvgIcon.CIRCLE_CROSS_THIN\" \n                    (click)=\"clearSearch()\"/>\n    </ng-template>\n  </kendo-textbox>\n\n  <kit-popup #popup\n             [popupClass]=\"popupClass\"\n             [anchor]=\"anchor()\"\n             [content]=\"content\"\n             [closeOnOutsideClick]=\"false\" />\n\n  <ng-template #content>\n    @if (userPermissions$ | async; as userPermissions) {\n      <div class=\"popup-content\">\n        @if (showPropmts()) {\n          <div class=\"prompts\">\n            @for (prompt of prompts(); track prompt) {\n              @if (hasPermissionToShowPrompt(userPermissions, prompt.permissions)) {\n                <kit-pill [theme]=\"kitPillTheme.MAIN\"\n                          [selectable]=\"true\" \n                          (clicked)=\"onSelectPrompt(prompt)\">\n                  {{ prompt.label }}\n                </kit-pill>\n              }\n            }\n          </div>\n        } @else {\n          @if (searchResults().length) {\n            <div class=\"search-results\">\n              @for (category of searchResults(); track category?.name) {\n                @if (category) {\n                  <div class=\"category\">\n                    <p class=\"header\"\n                      [class.empty]=\"!category.total\">\n                      <kit-svg-icon [icon]=\"kitSvgIcon.CHECK_STICKER\"/>\n                      <span class=\"title\">{{ category.name.toUpperCase() }} ({{ category.total }})</span>\n                    </p>\n\n                    @for (lineItem of category.items.slice(0, this.displayedLineItemsNumber()); track $index) {\n                      <div class=\"line-item\"\n                           [class.has-link]=\"lineItem.routeConfig\"\n                           (click)=\"navigate(lineItem.routeConfig)\">\n                        <div class=\"main-content\">\n                          <div class=\"title\">\n                            <kit-truncate-text>\n                              <span [innerHTML]=\"lineItem.title | highlight:searchValue\"></span>\n                            </kit-truncate-text>\n                          </div>\n                          <div class=\"subtitle\">\n                            <kit-truncate-text>\n                              <span [innerHTML]=\"lineItem.subtitle || '' | highlight:searchValue\"></span>\n                            </kit-truncate-text>\n                          </div>\n                          <div>\n                            @if (lineItem.routePath?.from || lineItem.routePath?.to) {\n                              <kit-route-path class=\"route\"\n                                              [containerMode]=\"lineItem.routePath?.containerMode\"\n                                              [destinationPort]=\"lineItem.routePath?.to\"\n                                              [originPort]=\"lineItem.routePath?.from\"\n                                              [type]=\"lineItem.routePath?.type\"/>\n                            }\n                            @if (lineItem.status) {\n                              <kit-pill class=\"status\"\n                                        [theme]=\"kitPillTheme.MAIN\">\n                                {{ lineItem.status }}\n                              </kit-pill>\n                            }\n                          </div>\n                          <div class=\"dates first-date\">\n                            @if (lineItem.dates?.firstDate.value) {\n                              <kit-svg-icon [icon]=\"kitSvgIcon.CALENDAR\"/>\n                              <kit-truncate-text>{{ lineItem.dates?.firstDate.label }} \n                                <span class=\"date\">{{ lineItem.dates?.firstDate.value | date: dateFormat : 'UTC' }}</span>\n                              </kit-truncate-text>\n                            }\n                          </div>\n                          @if (lineItem.dates?.secondDate.value) {\n                            <div class=\"dates second-date\">\n                                <kit-svg-icon [icon]=\"kitSvgIcon.CALENDAR\"/>\n                                <kit-truncate-text>{{ lineItem.dates?.secondDate.label }} \n                                  <span class=\"date\">{{ lineItem.dates?.secondDate.value | date: dateFormat : 'UTC' }}</span>\n                                </kit-truncate-text>\n                            </div>\n                          }\n                        </div>\n\n                        <div class=\"additional-content\">\n                          @for (item of lineItem.additionalContent; track item.key) {\n                            <div>\n                              <span class=\"label\">{{ item.translateKey | translate }} </span>\n                              <span class=\"value\"\n                                    [innerHTML]=\"formatValue(item.value) | highlight:searchValue\"></span>\n                            </div>\n                          }\n                        </div>\n                      </div>\n                    }\n                    \n                    @if (category.total > this.displayedLineItemsNumber()) {\n                      <kit-button [label]=\"'kit.globalSearch.showResults' | translate\"\n                                  [type]=\"kitButtonType.GHOST\"\n                                  [kind]=\"kitButtonKind.SMALL\"\n                                  (clicked)=\"navigate(category.routeConfig)\"/>\n                    }\n                  </div>\n                }\n              }\n            </div>\n\n            @if (filters().length) {\n              <div class=\"filters\">\n                @for (filter of filters(); track $index) {\n                  <div>\n                    <p class=\"label\">{{ filter.label }}</p>\n                    @for (value of filter.values.slice(0, isFilterExpanded($index) ? filter.values.length : 3); track $index) {\n                      <kit-pill @heightExpandCollapseAnimation\n                                class=\"filter-value\"\n                                [theme]=\"kitPillTheme.MAIN\"\n                                [selectable]=\"true\"\n                                [selected]=\"isFilterSelected(value)\"\n                                (clicked)=\"onSelectFilter(value, filter.appliedTo)\">\n                        {{ value.title | translate }}\n                      </kit-pill>\n                    }\n                    @if (filter.values.length > 3) {\n                      <kit-button class=\"toggle-btn\"\n                                  [label]=\"`kit.globalSearch.${isFilterExpanded($index) ? 'showLess' : 'showMore'}` | translate\"\n                                  [icon]=\"isFilterExpanded($index) ? kitSvgIcon.CHEVRON_UP : kitSvgIcon.CHEVRON_DOWN\"\n                                  [iconPosition]=\"kitButtonIconPosition.LEADING\"\n                                  [iconType]=\"kitSvgIconType.STROKE\"\n                                  [kind]=\"kitButtonKind.SMALL\"\n                                  [type]=\"kitButtonType.GHOST\"\n                                  (clicked)=\"toggleFilterExpanded($index)\"/>\n                    }\n                  </div>\n                }\n              </div>\n            }\n          } @else {\n            <kit-empty-section class=\"empty-section\"\n                               [text]=\"'kit.globalSearch.noData' | translate\"/>\n          }\n        }\n      </div>\n    }\n  </ng-template>\n</div>\n", styles: [":host{position:relative;display:block}:host .global-search{max-width:360px}:host .global-search.expanded{max-width:100%}:host .global-search .textbox{border-color:var(--ui-kit-color-grey-11);box-shadow:none;border-radius:8px}:host .global-search .textbox.k-focus{border-color:var(--ui-kit-color-main)}:host ::ng-deep .k-animation-container{width:100%}:host ::ng-deep .kit-global-search-popup{overflow:auto;padding:0}:host ::ng-deep .kit-global-search-popup .popup-content{display:flex;justify-content:space-between}:host ::ng-deep .global-search .k-textbox.k-input .k-input-inner{padding:11px 8px}:host ::ng-deep .global-search .k-textbox.k-input .kit-svg-icon .search-icon{width:37px;height:37px;fill:none;stroke:var(--ui-kit-color-grey-10);padding-left:12px}:host ::ng-deep .global-search .k-textbox.k-input .kit-svg-icon .circle-cross-thin-icon{width:30px;height:30px;fill:none;stroke:var(--ui-kit-color-grey-12);padding-right:12px;cursor:pointer}:host ::ng-deep .search-results{padding:24px;flex:1}:host ::ng-deep .search-results .category:not(:last-child){margin-bottom:20px}:host ::ng-deep .search-results .category .header{display:flex;align-items:center;margin:0 0 20px}:host ::ng-deep .search-results .category .header .icon.check-sticker-icon{width:16px;height:16px;fill:var(--ui-kit-color-main);margin-right:10px}:host ::ng-deep .search-results .category .header .title{color:var(--ui-kit-color-main)}:host ::ng-deep .search-results .category .header.empty{margin:0}:host ::ng-deep .search-results .category .header.empty .icon.check-sticker-icon{fill:var(--ui-kit-color-grey-12)}:host ::ng-deep .search-results .category .header.empty .title{color:var(--ui-kit-color-grey-12)}:host ::ng-deep .search-results .category .line-item{min-width:700px;padding-bottom:20px;margin-bottom:20px;border-bottom:1px solid var(--ui-kit-color-grey-11)}:host ::ng-deep .search-results .category .line-item.has-link{cursor:pointer}:host ::ng-deep .search-results .category .line-item.has-link:hover{opacity:.7}:host ::ng-deep .search-results .category .line-item .highlighted{color:var(--ui-kit-color-main)}:host ::ng-deep .search-results .category .line-item .main-content{display:grid;grid-template-columns:minmax(50px,1fr) minmax(50px,1fr) minmax(200px,2fr) repeat(auto-fit,minmax(65px,1.5fr));gap:20px;align-items:center}:host ::ng-deep .search-results .category .line-item .main-content .title{font-size:16px;line-height:22px;font-weight:500}:host ::ng-deep .search-results .category .line-item .main-content .title,:host ::ng-deep .search-results .category .line-item .main-content .subtitle{color:var(--ui-kit-color-grey-10)}:host ::ng-deep .search-results .category .line-item .main-content .icon.calendar-icon{width:18px;height:18px;fill:var(--ui-kit-color-grey-12);margin-right:3px}:host ::ng-deep .search-results .category .line-item .main-content .route-path{justify-content:center}:host ::ng-deep .search-results .category .line-item .main-content .status{white-space:nowrap;width:min-content;display:block;margin:auto}:host ::ng-deep .search-results .category .line-item .main-content .kit-pill-content{margin:auto}:host ::ng-deep .search-results .category .line-item .main-content .dates{display:flex;align-items:center;justify-self:end;font-size:12px;line-height:14px}:host ::ng-deep .search-results .category .line-item .main-content .dates.date{font-size:14px;line-height:20px;font-weight:500}:host ::ng-deep .search-results .category .line-item .main-content .dates.first-date{color:var(--ui-kit-color-grey-14)}:host ::ng-deep .search-results .category .line-item .main-content .dates.second-date{color:var(--ui-kit-color-grey-10)}:host ::ng-deep .search-results .category .line-item .additional-content{text-align:right}:host ::ng-deep .search-results .category .line-item .additional-content .label{color:var(--ui-kit-color-grey-14)}:host ::ng-deep .search-results .category .line-item .additional-content .value{color:var(--ui-kit-color-grey-10)}:host ::ng-deep .filters{background-color:var(--ui-kit-color-grey-13);padding:24px;min-width:175px}:host ::ng-deep .filters .label{font-size:12px;line-height:14px;color:var(--ui-kit-color-grey-10);margin-bottom:10px;text-transform:uppercase}:host ::ng-deep .filters .filter-value{margin-bottom:10px;display:block}:host ::ng-deep .filters .filter-value .kit-pill{line-height:16px;text-align:left;display:inline-block;padding:7px 16px;font-size:13px}:host ::ng-deep .filters .toggle-btn{margin-bottom:40px;display:block}:host ::ng-deep .filters .toggle-btn .k-button{min-width:125px;padding:6px 16px;min-height:32px}:host ::ng-deep .prompts{display:flex;gap:10px;padding:24px}:host ::ng-deep .empty-section{container:none}\n"] }]
         }], ctorParameters: () => [{ type: i1$7.Router }, { type: i1$e.Store }, { type: i1$1.DatePipe }], propDecorators: { documentClick: [{
                 type: HostListener,
                 args: ['document:click', ['$event']]
             }] } });
 
-const mapGlobalSearchResult = (store, requiredPermission, dataFetcher, categoryName, categoryLink, itemMapper) => {
+const mapGlobalSearchResult = (store, requiredPermission, dataFetcher, categoryName, routeConfig, itemMapper) => {
     return store.select(KIT_USER_PERMISSIONS_STATE_TOKEN).pipe(map(state => state.permissions), tap(permissions => {
         if (!permissions) {
             store.dispatch(new FetchUserPermissions());
@@ -6910,12 +6935,12 @@ const mapGlobalSearchResult = (store, requiredPermission, dataFetcher, categoryN
         return dataFetcher().pipe(map(data => ({
             name: categoryName,
             total: data.total,
-            categoryLink,
+            routeConfig,
             items: data.data.map(itemMapper),
         })), catchError(() => of({
             name: categoryName,
             total: 0,
-            categoryLink,
+            routeConfig,
             items: [],
         })));
     }));