@leanix/components 0.4.386 → 0.4.388

package/fesm2022/leanix-components.mjs

@@ -1,15 +1,9 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, Component, Input, signal, ChangeDetectionStrategy, HostBinding, EventEmitter, Output, HostListener, Directive, Injectable, ElementRef, Inject, ViewChild, input, computed, ContentChildren, Pipe, Optional, NgModule, effect, ContentChild, ViewChildren, forwardRef, TemplateRef, viewChild, inject, DestroyRef, booleanAttribute, SecurityContext, Self, Host } from '@angular/core';
-import * as i1$2 from '@ngx-translate/core';
+import { InjectionToken, Component, Input, signal, ChangeDetectionStrategy, HostBinding, EventEmitter, Output, HostListener, Injectable, ElementRef, Inject, ViewChild, input, computed, Directive, ContentChildren, Pipe, Optional, NgModule, effect, ContentChild, ViewChildren, forwardRef, TemplateRef, viewChild, inject, DestroyRef, booleanAttribute, SecurityContext, Self, Host } from '@angular/core';
+import * as i1$1 from '@ngx-translate/core';
 import { TranslatePipe, TranslateModule } from '@ngx-translate/core';
 import * as i1 from '@angular/common';
 import { CommonModule, NgIf, NgClass, AsyncPipe, NgFor, NgStyle, NgTemplateOutlet, UpperCasePipe, NgSwitch, NgSwitchCase, DecimalPipe, formatDate } from '@angular/common';
-import * as i3 from '@angular/cdk/portal';
-import { ComponentPortal, CdkPortal, PortalModule } from '@angular/cdk/portal';
-import * as i1$1 from '@angular/cdk/overlay';
-import { CdkOverlayOrigin, CdkConnectedOverlay, OverlayModule } from '@angular/cdk/overlay';
-import * as i2 from '@angular/cdk/a11y';
-import { ActiveDescendantKeyManager, A11yModule } from '@angular/cdk/a11y';
 import { __decorate } from 'tslib';
 import { escape, trimEnd, sortBy, get, isEqual as isEqual$1, toLower, some, padCharsStart, toString, toNumber, isNaN as isNaN$1, includes, last, findIndex, filter as filter$1, isObject, find, uniqueId as uniqueId$1 } from 'lodash/fp';
 import * as i5 from 'rxjs';
@@ -17,6 +11,12 @@ import { BehaviorSubject, timer, Observable, Subject, combineLatest, merge, conc
 import { skipWhile, map, switchMap, startWith, pairwise, filter, take, debounceTime, skip, withLatestFrom, distinctUntilChanged, takeUntil, delay, tap, first } from 'rxjs/operators';
 import * as i1$9 from '@angular/router';
 import { RouterLink, RouterLinkActive, RouterModule } from '@angular/router';
+import * as i3 from '@angular/cdk/portal';
+import { ComponentPortal, CdkPortal, PortalModule } from '@angular/cdk/portal';
+import * as i1$2 from '@angular/cdk/overlay';
+import { CdkOverlayOrigin, CdkConnectedOverlay, OverlayModule } from '@angular/cdk/overlay';
+import * as i2 from '@angular/cdk/a11y';
+import { ActiveDescendantKeyManager, A11yModule } from '@angular/cdk/a11y';
 import { CdkStepper, CdkStepperModule } from '@angular/cdk/stepper';
 import * as i1$3 from '@angular/cdk/bidi';
 import Color from 'color';
@@ -328,242 +328,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
                 args: ['click', ['$event']]
             }] } });
 
-function toCdkX(x) {
-    switch (x) {
-        case 'left':
-            return 'start';
-        case 'center':
-            return 'center';
-        case 'right':
-            return 'end';
-    }
-}
-function invertCdkX(x) {
-    switch (x) {
-        case 'start':
-            return 'end';
-        case 'center':
-            return 'center';
-        case 'end':
-            return 'start';
-    }
-}
-function invertCdkY(x) {
-    switch (x) {
-        case 'top':
-            return 'bottom';
-        case 'center':
-            return 'center';
-        case 'bottom':
-            return 'top';
-    }
-}
-function offsetYDirection(x) {
-    switch (x) {
-        case 'top':
-            return -6;
-        case 'center':
-            return 0;
-        case 'bottom':
-            return 6;
-    }
-}
-function offsetXDirection(position) {
-    switch (position.y) {
-        case 'center':
-            switch (position.x) {
-                case 'left':
-                    return -6;
-                case 'center':
-                    return 0;
-                case 'right':
-                    return 6;
-            }
-        case 'top':
-        case 'bottom':
-            switch (position.x) {
-                case 'left':
-                    return 30;
-                case 'center':
-                    return 0;
-                case 'right':
-                    return -30;
-            }
-    }
-}
-function toCdkPosition(position) {
-    return {
-        originX: toCdkX(position.x),
-        originY: position.y,
-        overlayX: invertCdkX(toCdkX(position.x)),
-        overlayY: invertCdkY(position.y),
-        offsetY: offsetYDirection(position.y),
-        offsetX: offsetXDirection(position)
-    };
-}
-
-function isValidX(x) {
-    return ['left', 'center', 'right'].includes(x);
-}
-function isValidY(y) {
-    return ['top', 'center', 'bottom'].includes(y);
-}
-
-class TooltipComponent {
-    constructor() {
-        this.content = '';
-        this.isHtmlContent = false;
-        this.position = {
-            x: 'center',
-            y: 'top'
-        };
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: TooltipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: TooltipComponent, isStandalone: true, selector: "lx-tooltip", inputs: { content: "content", isHtmlContent: "isHtmlContent", position: "position" }, host: { attributes: { "role": "tooltip" } }, ngImport: i0, template: "<div *ngIf=\"!isHtmlContent; else htmlTooltip\" [ngClass]=\"['x-' + position.x, 'y-' + position.y]\">{{ content }}</div>\n<ng-template #htmlTooltip>\n  <div [innerHtml]=\"content\" [ngClass]=\"['x-' + position.x, 'y-' + position.y]\"></div>\n</ng-template>\n", styles: [":host{display:block;position:relative;margin:5px}div{background-color:#292929;color:#fff;border:0 solid transparent;border-radius:5px;opacity:1;font-size:12px;font-weight:400;text-shadow:0 1px black;text-align:left;word-wrap:break-word;line-height:16px;max-width:280px;min-width:50px;padding:6px 10px;overflow:hidden}.y-bottom:after,.y-top:after,.x-left:after,.x-right:after{content:\" \";position:absolute;border-width:5px;border-style:solid;border-color:#292929 transparent transparent transparent}.y-top:after{top:100%;margin-left:-5px}.y-bottom:after{top:0;margin-left:-5px;transform-origin:center top;transform:rotate(180deg)}.y-center:after{top:50%;margin-left:-5px;margin-top:-10px}.y-top.x-center:after,.y-bottom.x-center:after{left:50%}.y-top.x-left:after,.y-bottom.x-left:after{right:10px}.y-top.x-right:after,.y-bottom.x-right:after{left:10px}.y-center.x-right:after{left:0;transform-origin:left center;transform:rotate(90deg)}.y-center.x-left:after{left:100%;transform-origin:right center;transform:rotate(-90deg)}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: TooltipComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'lx-tooltip', standalone: true, imports: [NgIf, NgClass], host: { role: 'tooltip' }, template: "<div *ngIf=\"!isHtmlContent; else htmlTooltip\" [ngClass]=\"['x-' + position.x, 'y-' + position.y]\">{{ content }}</div>\n<ng-template #htmlTooltip>\n  <div [innerHtml]=\"content\" [ngClass]=\"['x-' + position.x, 'y-' + position.y]\"></div>\n</ng-template>\n", styles: [":host{display:block;position:relative;margin:5px}div{background-color:#292929;color:#fff;border:0 solid transparent;border-radius:5px;opacity:1;font-size:12px;font-weight:400;text-shadow:0 1px black;text-align:left;word-wrap:break-word;line-height:16px;max-width:280px;min-width:50px;padding:6px 10px;overflow:hidden}.y-bottom:after,.y-top:after,.x-left:after,.x-right:after{content:\" \";position:absolute;border-width:5px;border-style:solid;border-color:#292929 transparent transparent transparent}.y-top:after{top:100%;margin-left:-5px}.y-bottom:after{top:0;margin-left:-5px;transform-origin:center top;transform:rotate(180deg)}.y-center:after{top:50%;margin-left:-5px;margin-top:-10px}.y-top.x-center:after,.y-bottom.x-center:after{left:50%}.y-top.x-left:after,.y-bottom.x-left:after{right:10px}.y-top.x-right:after,.y-bottom.x-right:after{left:10px}.y-center.x-right:after{left:0;transform-origin:left center;transform:rotate(90deg)}.y-center.x-left:after{left:100%;transform-origin:right center;transform:rotate(-90deg)}\n"] }]
-        }], propDecorators: { content: [{
-                type: Input
-            }], isHtmlContent: [{
-                type: Input
-            }], position: [{
-                type: Input
-            }] } });
-
-class TooltipDirective {
-    set lxTooltipPosition(value) {
-        this.position = {
-            x: value && isValidX(value.x) ? value.x : 'center',
-            y: value && isValidY(value.y) ? value.y : 'top'
-        };
-    }
-    get positionStrategy() {
-        return this.overlayPositionBuilder.flexibleConnectedTo(this.elementRef).withPositions([toCdkPosition(this.position)]);
-    }
-    constructor(overlayPositionBuilder, elementRef, overlay, ariaDescriber) {
-        this.overlayPositionBuilder = overlayPositionBuilder;
-        this.elementRef = elementRef;
-        this.overlay = overlay;
-        this.ariaDescriber = ariaDescriber;
-        this.position = {
-            x: 'center',
-            y: 'top'
-        };
-        this.lxTooltipIsHtmlContent = false;
-        this.mouseOrFocusOnHost = false;
-    }
-    ngOnChanges(changes) {
-        if (this.overlayRef && changes['lxTooltipPosition']) {
-            this.overlayRef.updatePositionStrategy(this.positionStrategy);
-        }
-        if (this.tooltipRef) {
-            if (changes['lxTooltipPosition']) {
-                this.tooltipRef.instance.position = this.position;
-            }
-            if (changes['lxTooltipIsHtmlContent']) {
-                this.tooltipRef.instance.isHtmlContent = this.lxTooltipIsHtmlContent;
-            }
-            if (changes['content']) {
-                if (this.content) {
-                    this.tooltipRef.instance.content = this.content;
-                    this.overlayRef?.updatePosition();
-                }
-                else {
-                    this.overlayRef?.detach();
-                }
-            }
-        }
-    }
-    show() {
-        this.mouseOrFocusOnHost = true;
-        setTimeout(() => {
-            if (!this.overlayRef?.hasAttached() && this.mouseOrFocusOnHost && this.content) {
-                this.overlayRef = this.overlay.create({ positionStrategy: this.positionStrategy });
-                const tooltipPortal = new ComponentPortal(TooltipComponent);
-                this.tooltipRef = this.overlayRef.attach(tooltipPortal);
-                this.tooltipRef.instance.content = this.content;
-                this.tooltipRef.instance.isHtmlContent = this.lxTooltipIsHtmlContent;
-                this.tooltipRef.instance.position = this.position;
-                this.ariaDescriber.describe(this.elementRef.nativeElement, this.tooltipRef.location.nativeElement);
-            }
-        }, this.lxTooltipDelay ?? 90);
-    }
-    ngOnDestroy() {
-        this.mouseOrFocusOnHost = false;
-        this.overlayRef?.dispose();
-    }
-    hide() {
-        this.mouseOrFocusOnHost = false;
-        this.ariaDescriber.removeDescription(this.elementRef.nativeElement, this.tooltipRef?.location.nativeElement);
-        this.overlayRef?.dispose();
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: TooltipDirective, deps: [{ token: i1$1.OverlayPositionBuilder }, { token: i0.ElementRef }, { token: i1$1.Overlay }, { token: i2.AriaDescriber }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.8", type: TooltipDirective, isStandalone: true, selector: "[lxTooltip]", inputs: { content: ["lxTooltip", "content"], lxTooltipPosition: "lxTooltipPosition", lxTooltipDelay: "lxTooltipDelay", lxTooltipIsHtmlContent: "lxTooltipIsHtmlContent" }, host: { listeners: { "mouseenter": "show()", "focus": "show()", "mouseleave": "hide()", "click": "hide()", "blur": "hide()" } }, usesOnChanges: true, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: TooltipDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[lxTooltip]',
-                    standalone: true
-                }]
-        }], ctorParameters: () => [{ type: i1$1.OverlayPositionBuilder }, { type: i0.ElementRef }, { type: i1$1.Overlay }, { type: i2.AriaDescriber }], propDecorators: { content: [{
-                type: Input,
-                args: ['lxTooltip']
-            }], lxTooltipPosition: [{
-                type: Input
-            }], lxTooltipDelay: [{
-                type: Input
-            }], lxTooltipIsHtmlContent: [{
-                type: Input
-            }], show: [{
-                type: HostListener,
-                args: ['mouseenter']
-            }, {
-                type: HostListener,
-                args: ['focus']
-            }], hide: [{
-                type: HostListener,
-                args: ['mouseleave']
-            }, {
-                type: HostListener,
-                args: ['click']
-            }, {
-                type: HostListener,
-                args: ['blur']
-            }] } });
-
-class ColoredLabelComponent {
-    constructor() {
-        this.bgColor = '#c0c0c0';
-        this.color = '#000';
-        this.tooltip = '';
-        this.classes = ['label'];
-    }
-    get ngClass() {
-        const classObj = {};
-        this.classes.forEach((c) => {
-            classObj[c] = true;
-        });
-        return classObj;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ColoredLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: ColoredLabelComponent, isStandalone: true, selector: "lx-colored-label", inputs: { bgColor: "bgColor", color: "color", tooltip: "tooltip", classes: "classes" }, ngImport: i0, template: "<span [ngClass]=\"ngClass\" [lxTooltip]=\"tooltip\" [style.background-color]=\"bgColor\" [style.color]=\"color\">\n  <ng-content />\n</span>\n", styles: [".label{font-size:12px;display:inline-block;width:100%;padding:4px;line-height:11px;overflow:hidden;text-overflow:ellipsis}.shortLabel{font-size:12px;text-align:center;min-width:20px;padding:3px 0;border-radius:2px;width:20px;height:20px;display:flex;align-items:center;justify-content:center;line-height:normal}.minibarLabel{display:inline-block;width:25px;height:3px;border-radius:5px}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: TooltipDirective, selector: "[lxTooltip]", inputs: ["lxTooltip", "lxTooltipPosition", "lxTooltipDelay", "lxTooltipIsHtmlContent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ColoredLabelComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'lx-colored-label', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgClass, TooltipDirective], template: "<span [ngClass]=\"ngClass\" [lxTooltip]=\"tooltip\" [style.background-color]=\"bgColor\" [style.color]=\"color\">\n  <ng-content />\n</span>\n", styles: [".label{font-size:12px;display:inline-block;width:100%;padding:4px;line-height:11px;overflow:hidden;text-overflow:ellipsis}.shortLabel{font-size:12px;text-align:center;min-width:20px;padding:3px 0;border-radius:2px;width:20px;height:20px;display:flex;align-items:center;justify-content:center;line-height:normal}.minibarLabel{display:inline-block;width:25px;height:3px;border-radius:5px}\n"] }]
-        }], propDecorators: { bgColor: [{
-                type: Input
-            }], color: [{
-                type: Input
-            }], tooltip: [{
-                type: Input
-            }], classes: [{
-                type: Input
-            }] } });
-
 class CounterComponent {
     constructor() {
         this.size = 'default';
@@ -834,7 +598,7 @@ class EllipsisComponent {
         const offsetWidth = contentSpanElRef.nativeElement.clientWidth;
         return offsetWidth < scrollWidth;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: EllipsisComponent, deps: [{ token: LX_ELLIPSIS_DEBOUNCE_ON_RESIZE }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: ResizeObserverService }, { token: i1$2.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: EllipsisComponent, deps: [{ token: LX_ELLIPSIS_DEBOUNCE_ON_RESIZE }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: ResizeObserverService }, { token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: EllipsisComponent, isStandalone: true, selector: "lx-ellipsis", inputs: { content: "content", escapeHtmlInContent: "escapeHtmlInContent" }, viewQueries: [{ propertyName: "contentSpanEl", first: true, predicate: ["contentEl"], descendants: true }, { propertyName: "showMoreButtonEl", first: true, predicate: ["showMoreButton"], descendants: true, read: ElementRef }], ngImport: i0, template: "<span\n  #contentEl\n  [class.showMore]=\"isShowingMore$ | async\"\n  class=\"content truncate lx-margin-right\"\n  [innerHtml]=\"sanitizedContent$ | async\"\n></span>\n<button *ngIf=\"showButton$ | async\" (click)=\"onShowMoreToggle()\" lx-button #showMoreButton size=\"auto\" mode=\"link\" color=\"primary\">\n  {{ showMoreButtonLabel$ | async }}\n</button>\n", styles: [":host{display:block;white-space:pre-line;overflow-wrap:break-word}.content{display:inline-block;word-break:break-word}.truncate:not(.showMore){width:calc(100% - 140px);white-space:nowrap;overflow-wrap:normal;overflow:hidden;text-overflow:ellipsis}.content.showMore+button{margin-top:4px;display:block}button{white-space:nowrap;vertical-align:top}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ButtonComponent, selector: "button[lx-button]", inputs: ["size", "color", "mode", "pressed", "selected", "square", "circle", "disabled", "showSpinner"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 __decorate([
@@ -852,7 +616,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [LX_ELLIPSIS_DEBOUNCE_ON_RESIZE]
-                }] }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: ResizeObserverService }, { type: i1$2.TranslateService }], propDecorators: { content: [{
+                }] }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: ResizeObserverService }, { type: i1$1.TranslateService }], propDecorators: { content: [{
                 type: Input
             }], escapeHtmlInContent: [{
                 type: Input
@@ -936,6 +700,212 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
             args: [{ selector: 'lx-integration-link-card-group', standalone: true, template: "<ng-content />\n", styles: [":host::ng-deep lx-integration-link-card:not(:first-child){border-top-left-radius:0;border-top-right-radius:0;padding-top:4px}:host::ng-deep lx-integration-link-card:not(:last-child){border-bottom-left-radius:0;border-bottom-right-radius:0;padding-bottom:4px}:host::ng-deep lx-integration-link-card:not(:last-child):after{content:\"\";width:187px;height:1px;background:#b2bccc;position:absolute;bottom:-1px;z-index:2;left:8px}\n"] }]
         }] });
 
+function toCdkX(x) {
+    switch (x) {
+        case 'left':
+            return 'start';
+        case 'center':
+            return 'center';
+        case 'right':
+            return 'end';
+    }
+}
+function invertCdkX(x) {
+    switch (x) {
+        case 'start':
+            return 'end';
+        case 'center':
+            return 'center';
+        case 'end':
+            return 'start';
+    }
+}
+function invertCdkY(x) {
+    switch (x) {
+        case 'top':
+            return 'bottom';
+        case 'center':
+            return 'center';
+        case 'bottom':
+            return 'top';
+    }
+}
+function offsetYDirection(x) {
+    switch (x) {
+        case 'top':
+            return -6;
+        case 'center':
+            return 0;
+        case 'bottom':
+            return 6;
+    }
+}
+function offsetXDirection(position) {
+    switch (position.y) {
+        case 'center':
+            switch (position.x) {
+                case 'left':
+                    return -6;
+                case 'center':
+                    return 0;
+                case 'right':
+                    return 6;
+            }
+        case 'top':
+        case 'bottom':
+            switch (position.x) {
+                case 'left':
+                    return 30;
+                case 'center':
+                    return 0;
+                case 'right':
+                    return -30;
+            }
+    }
+}
+function toCdkPosition(position) {
+    return {
+        originX: toCdkX(position.x),
+        originY: position.y,
+        overlayX: invertCdkX(toCdkX(position.x)),
+        overlayY: invertCdkY(position.y),
+        offsetY: offsetYDirection(position.y),
+        offsetX: offsetXDirection(position)
+    };
+}
+
+function isValidX(x) {
+    return ['left', 'center', 'right'].includes(x);
+}
+function isValidY(y) {
+    return ['top', 'center', 'bottom'].includes(y);
+}
+
+class TooltipComponent {
+    constructor() {
+        this.content = '';
+        this.isHtmlContent = false;
+        this.position = {
+            x: 'center',
+            y: 'top'
+        };
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: TooltipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: TooltipComponent, isStandalone: true, selector: "lx-tooltip", inputs: { content: "content", isHtmlContent: "isHtmlContent", position: "position" }, host: { attributes: { "role": "tooltip" } }, ngImport: i0, template: "<div *ngIf=\"!isHtmlContent; else htmlTooltip\" [ngClass]=\"['x-' + position.x, 'y-' + position.y]\">{{ content }}</div>\n<ng-template #htmlTooltip>\n  <div [innerHtml]=\"content\" [ngClass]=\"['x-' + position.x, 'y-' + position.y]\"></div>\n</ng-template>\n", styles: [":host{display:block;position:relative;margin:5px}div{background-color:#292929;color:#fff;border:0 solid transparent;border-radius:5px;opacity:1;font-size:12px;font-weight:400;text-shadow:0 1px black;text-align:left;word-wrap:break-word;line-height:16px;max-width:280px;min-width:50px;padding:6px 10px;overflow:hidden}.y-bottom:after,.y-top:after,.x-left:after,.x-right:after{content:\" \";position:absolute;border-width:5px;border-style:solid;border-color:#292929 transparent transparent transparent}.y-top:after{top:100%;margin-left:-5px}.y-bottom:after{top:0;margin-left:-5px;transform-origin:center top;transform:rotate(180deg)}.y-center:after{top:50%;margin-left:-5px;margin-top:-10px}.y-top.x-center:after,.y-bottom.x-center:after{left:50%}.y-top.x-left:after,.y-bottom.x-left:after{right:10px}.y-top.x-right:after,.y-bottom.x-right:after{left:10px}.y-center.x-right:after{left:0;transform-origin:left center;transform:rotate(90deg)}.y-center.x-left:after{left:100%;transform-origin:right center;transform:rotate(-90deg)}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: TooltipComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lx-tooltip', standalone: true, imports: [NgIf, NgClass], host: { role: 'tooltip' }, template: "<div *ngIf=\"!isHtmlContent; else htmlTooltip\" [ngClass]=\"['x-' + position.x, 'y-' + position.y]\">{{ content }}</div>\n<ng-template #htmlTooltip>\n  <div [innerHtml]=\"content\" [ngClass]=\"['x-' + position.x, 'y-' + position.y]\"></div>\n</ng-template>\n", styles: [":host{display:block;position:relative;margin:5px}div{background-color:#292929;color:#fff;border:0 solid transparent;border-radius:5px;opacity:1;font-size:12px;font-weight:400;text-shadow:0 1px black;text-align:left;word-wrap:break-word;line-height:16px;max-width:280px;min-width:50px;padding:6px 10px;overflow:hidden}.y-bottom:after,.y-top:after,.x-left:after,.x-right:after{content:\" \";position:absolute;border-width:5px;border-style:solid;border-color:#292929 transparent transparent transparent}.y-top:after{top:100%;margin-left:-5px}.y-bottom:after{top:0;margin-left:-5px;transform-origin:center top;transform:rotate(180deg)}.y-center:after{top:50%;margin-left:-5px;margin-top:-10px}.y-top.x-center:after,.y-bottom.x-center:after{left:50%}.y-top.x-left:after,.y-bottom.x-left:after{right:10px}.y-top.x-right:after,.y-bottom.x-right:after{left:10px}.y-center.x-right:after{left:0;transform-origin:left center;transform:rotate(90deg)}.y-center.x-left:after{left:100%;transform-origin:right center;transform:rotate(-90deg)}\n"] }]
+        }], propDecorators: { content: [{
+                type: Input
+            }], isHtmlContent: [{
+                type: Input
+            }], position: [{
+                type: Input
+            }] } });
+
+class TooltipDirective {
+    set lxTooltipPosition(value) {
+        this.position = {
+            x: value && isValidX(value.x) ? value.x : 'center',
+            y: value && isValidY(value.y) ? value.y : 'top'
+        };
+    }
+    get positionStrategy() {
+        return this.overlayPositionBuilder.flexibleConnectedTo(this.elementRef).withPositions([toCdkPosition(this.position)]);
+    }
+    constructor(overlayPositionBuilder, elementRef, overlay, ariaDescriber) {
+        this.overlayPositionBuilder = overlayPositionBuilder;
+        this.elementRef = elementRef;
+        this.overlay = overlay;
+        this.ariaDescriber = ariaDescriber;
+        this.position = {
+            x: 'center',
+            y: 'top'
+        };
+        this.lxTooltipIsHtmlContent = false;
+        this.mouseOrFocusOnHost = false;
+    }
+    ngOnChanges(changes) {
+        if (this.overlayRef && changes['lxTooltipPosition']) {
+            this.overlayRef.updatePositionStrategy(this.positionStrategy);
+        }
+        if (this.tooltipRef) {
+            if (changes['lxTooltipPosition']) {
+                this.tooltipRef.instance.position = this.position;
+            }
+            if (changes['lxTooltipIsHtmlContent']) {
+                this.tooltipRef.instance.isHtmlContent = this.lxTooltipIsHtmlContent;
+            }
+            if (changes['content']) {
+                if (this.content) {
+                    this.tooltipRef.instance.content = this.content;
+                    this.overlayRef?.updatePosition();
+                }
+                else {
+                    this.overlayRef?.detach();
+                }
+            }
+        }
+    }
+    show() {
+        this.mouseOrFocusOnHost = true;
+        setTimeout(() => {
+            if (!this.overlayRef?.hasAttached() && this.mouseOrFocusOnHost && this.content) {
+                this.overlayRef = this.overlay.create({ positionStrategy: this.positionStrategy });
+                const tooltipPortal = new ComponentPortal(TooltipComponent);
+                this.tooltipRef = this.overlayRef.attach(tooltipPortal);
+                this.tooltipRef.instance.content = this.content;
+                this.tooltipRef.instance.isHtmlContent = this.lxTooltipIsHtmlContent;
+                this.tooltipRef.instance.position = this.position;
+                this.ariaDescriber.describe(this.elementRef.nativeElement, this.tooltipRef.location.nativeElement);
+            }
+        }, this.lxTooltipDelay ?? 90);
+    }
+    ngOnDestroy() {
+        this.mouseOrFocusOnHost = false;
+        this.overlayRef?.dispose();
+    }
+    hide() {
+        this.mouseOrFocusOnHost = false;
+        this.ariaDescriber.removeDescription(this.elementRef.nativeElement, this.tooltipRef?.location.nativeElement);
+        this.overlayRef?.dispose();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: TooltipDirective, deps: [{ token: i1$2.OverlayPositionBuilder }, { token: i0.ElementRef }, { token: i1$2.Overlay }, { token: i2.AriaDescriber }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.8", type: TooltipDirective, isStandalone: true, selector: "[lxTooltip]", inputs: { content: ["lxTooltip", "content"], lxTooltipPosition: "lxTooltipPosition", lxTooltipDelay: "lxTooltipDelay", lxTooltipIsHtmlContent: "lxTooltipIsHtmlContent" }, host: { listeners: { "mouseenter": "show()", "focus": "show()", "mouseleave": "hide()", "click": "hide()", "blur": "hide()" } }, usesOnChanges: true, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: TooltipDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[lxTooltip]',
+                    standalone: true
+                }]
+        }], ctorParameters: () => [{ type: i1$2.OverlayPositionBuilder }, { type: i0.ElementRef }, { type: i1$2.Overlay }, { type: i2.AriaDescriber }], propDecorators: { content: [{
+                type: Input,
+                args: ['lxTooltip']
+            }], lxTooltipPosition: [{
+                type: Input
+            }], lxTooltipDelay: [{
+                type: Input
+            }], lxTooltipIsHtmlContent: [{
+                type: Input
+            }], show: [{
+                type: HostListener,
+                args: ['mouseenter']
+            }, {
+                type: HostListener,
+                args: ['focus']
+            }], hide: [{
+                type: HostListener,
+                args: ['mouseleave']
+            }, {
+                type: HostListener,
+                args: ['click']
+            }, {
+                type: HostListener,
+                args: ['blur']
+            }] } });
+
 class IntegrationLinkCardComponent {
     constructor() {
         this.isInactive = false;
@@ -1752,7 +1722,7 @@ class LxTranslatePipe {
         }
         return this.translatePipe.transform(query, this.lastArgsExtended);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: LxTranslatePipe, deps: [{ token: i1$2.TranslateService }, { token: i0.ChangeDetectorRef }, { token: GLOBAL_TRANSLATION_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: LxTranslatePipe, deps: [{ token: i1$1.TranslateService }, { token: i0.ChangeDetectorRef }, { token: GLOBAL_TRANSLATION_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Pipe }); }
     static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.2.8", ngImport: i0, type: LxTranslatePipe, isStandalone: true, name: "lxTranslate", pure: false }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: LxTranslatePipe, providedIn: 'root' }); }
 }
@@ -1766,7 +1736,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
                     pure: false, // Because the underlying TranslatePipe isn't pure, too.
                     standalone: true
                 }]
-        }], ctorParameters: () => [{ type: i1$2.TranslateService }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
+        }], ctorParameters: () => [{ type: i1$1.TranslateService }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
                     type: Optional
                 }, {
                     type: Inject,
@@ -1907,7 +1877,7 @@ class TranslationBeforePipe {
     transform(translationKey, cutMarkAndParams) {
         return getTranslationParts(this.translateService, translationKey, cutMarkAndParams)[0];
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: TranslationBeforePipe, deps: [{ token: i1$2.TranslateService }], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: TranslationBeforePipe, deps: [{ token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Pipe }); }
     static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.2.8", ngImport: i0, type: TranslationBeforePipe, isStandalone: true, name: "lxTranslationBefore" }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: TranslationBeforePipe, decorators: [{
@@ -1916,7 +1886,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
                     name: 'lxTranslationBefore',
                     standalone: true
                 }]
-        }], ctorParameters: () => [{ type: i1$2.TranslateService }] });
+        }], ctorParameters: () => [{ type: i1$1.TranslateService }] });
 
 /**
  * Translates the given i18n-key (instantly) and returns the part of the translation
@@ -1932,7 +1902,7 @@ class TranslationAfterPipe {
     transform(translationKey, cutMarkAndParams) {
         return getTranslationParts(this.translateService, translationKey, cutMarkAndParams)[1] || '';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: TranslationAfterPipe, deps: [{ token: i1$2.TranslateService }], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: TranslationAfterPipe, deps: [{ token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Pipe }); }
     static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.2.8", ngImport: i0, type: TranslationAfterPipe, isStandalone: true, name: "lxTranslationAfter" }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: TranslationAfterPipe, decorators: [{
@@ -1941,7 +1911,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
                     name: 'lxTranslationAfter',
                     standalone: true
                 }]
-        }], ctorParameters: () => [{ type: i1$2.TranslateService }] });
+        }], ctorParameters: () => [{ type: i1$1.TranslateService }] });
 
 function getTranslationBetween(translateService, translationKey, cutMarksAndParams) {
     translationKey = isArray(translationKey) ? translationKey.join('.') : translationKey;
@@ -1996,7 +1966,7 @@ class TranslationBetweenPipe {
     transform(translationKey, cutMarksAndParams) {
         return getTranslationBetween(this.translateService, translationKey, cutMarksAndParams);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: TranslationBetweenPipe, deps: [{ token: i1$2.TranslateService }], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: TranslationBetweenPipe, deps: [{ token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Pipe }); }
     static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.2.8", ngImport: i0, type: TranslationBetweenPipe, isStandalone: true, name: "lxTranslationBetween" }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: TranslationBetweenPipe, decorators: [{
@@ -2005,7 +1975,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
                     name: 'lxTranslationBetween',
                     standalone: true
                 }]
-        }], ctorParameters: () => [{ type: i1$2.TranslateService }] });
+        }], ctorParameters: () => [{ type: i1$1.TranslateService }] });
 
 class UnescapeCurlyBracesPipe {
     transform(input) {
@@ -2024,7 +1994,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
 
 class LxCoreUiModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: LxCoreUiModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.8", ngImport: i0, type: LxCoreUiModule, imports: [i1$2.TranslateModule, AfterViewInitDirective,
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.8", ngImport: i0, type: LxCoreUiModule, imports: [i1$1.TranslateModule, AfterViewInitDirective,
             AutocloseDirective,
             AutofocusDirective,
             CounterComponent,
@@ -2035,7 +2005,6 @@ class LxCoreUiModule {
             BrPipe,
             CardComponent,
             CollapsibleComponent,
-            ColoredLabelComponent,
             CustomDatePipe,
             EllipsisComponent,
             HighlightRangePipe,
@@ -2072,7 +2041,6 @@ class LxCoreUiModule {
             BrPipe,
             ButtonGroupComponent,
             CardComponent,
-            ColoredLabelComponent,
             CustomDatePipe,
             EllipsisComponent,
             HighlightRangePipe,
@@ -2124,7 +2092,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
                         BrPipe,
                         CardComponent,
                         CollapsibleComponent,
-                        ColoredLabelComponent,
                         CustomDatePipe,
                         EllipsisComponent,
                         HighlightRangePipe,
@@ -2164,7 +2131,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
                         BrPipe,
                         ButtonGroupComponent,
                         CardComponent,
-                        ColoredLabelComponent,
                         CustomDatePipe,
                         EllipsisComponent,
                         HighlightRangePipe,
@@ -2354,7 +2320,7 @@ class TokenizerComponent {
         this.changeDetectorRef.detectChanges();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: TokenizerComponent, deps: [{ token: i0.ElementRef }, { token: i0.DestroyRef }, { token: i0.ChangeDetectorRef }, { token: ResizeObserverService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: TokenizerComponent, isStandalone: true, selector: "lx-tokenizer", inputs: { active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { overflowPlaceholderClick: "overflowPlaceholderClick" }, queries: [{ propertyName: "items", predicate: TokenComponent }], viewQueries: [{ propertyName: "counter", first: true, predicate: ["counter"], descendants: true, read: ElementRef }, { propertyName: "tokensContainer", first: true, predicate: ["tokensContainer"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div #tokensContainer class=\"tokensContainer\">\n  <ng-content select=\"lx-token\" />\n  @if (showCounter()) {\n    <button\n      lx-button\n      class=\"counterButton\"\n      mode=\"ghost\"\n      (click)=\"onCounterClicked()\"\n      [attr.aria-label]=\"\n        NAME + (overflowItemCount() === 1 ? '.showMoreItem' : '.showMoreItems') | translate: { count: overflowItemCount() }\n      \"\n    >\n      <lx-counter #counter aria-hidden=\"true\" [content]=\"'+' + overflowItemCount()\" color=\"gray\" />\n    </button>\n  }\n</div>\n", styles: [":host{display:flex;align-items:center;white-space:nowrap}:host .counterButton{padding:0;display:flex;align-items:center;margin-left:4px}.tokensContainer{display:flex;align-items:center}\n"], dependencies: [{ kind: "component", type: CounterComponent, selector: "lx-counter", inputs: ["content", "size", "color"] }, { kind: "component", type: ButtonComponent, selector: "button[lx-button]", inputs: ["size", "color", "mode", "pressed", "selected", "square", "circle", "disabled", "showSpinner"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: TokenizerComponent, isStandalone: true, selector: "lx-tokenizer", inputs: { active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { overflowPlaceholderClick: "overflowPlaceholderClick" }, queries: [{ propertyName: "items", predicate: TokenComponent }], viewQueries: [{ propertyName: "counter", first: true, predicate: ["counter"], descendants: true, read: ElementRef }, { propertyName: "tokensContainer", first: true, predicate: ["tokensContainer"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div #tokensContainer class=\"tokensContainer\">\n  <ng-content select=\"lx-token\" />\n  @if (showCounter()) {\n    <button\n      lx-button\n      class=\"counterButton\"\n      mode=\"ghost\"\n      (click)=\"onCounterClicked()\"\n      [attr.aria-label]=\"\n        NAME + (overflowItemCount() === 1 ? '.showMoreItem' : '.showMoreItems') | translate: { count: overflowItemCount() }\n      \"\n    >\n      <lx-counter #counter aria-hidden=\"true\" [content]=\"'+' + overflowItemCount()\" color=\"gray\" />\n    </button>\n  }\n</div>\n", styles: [":host{display:flex;align-items:center;white-space:nowrap}:host .counterButton{padding:0;display:flex;align-items:center;margin-left:4px}.tokensContainer{display:flex;align-items:center}\n"], dependencies: [{ kind: "component", type: CounterComponent, selector: "lx-counter", inputs: ["content", "size", "color"] }, { kind: "component", type: ButtonComponent, selector: "button[lx-button]", inputs: ["size", "color", "mode", "pressed", "selected", "square", "circle", "disabled", "showSpinner"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: TokenizerComponent, decorators: [{
             type: Component,
@@ -2714,7 +2680,7 @@ class BasicDropdownComponent extends KeyboardSelectDirective {
         this.createNewOptionSelected.emit();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: BasicDropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: BasicDropdownComponent, isStandalone: true, selector: "lx-basic-dropdown", inputs: { options: "options", initiallySelectedIndex: "initiallySelectedIndex", labelKey: "labelKey", itemKey: "itemKey", placeholder: "placeholder", loading: "loading", newOptionLabel: "newOptionLabel", padding: "padding", showCreateNewOption: "showCreateNewOption", disabledOptions: "disabledOptions", overlayPositioning: "overlayPositioning", truncateOptions: "truncateOptions", noResultsText: "noResultsText" }, outputs: { onItemSelected: "onItemSelected", triggerRequestForMoreEntries: "triggerRequestForMoreEntries", newOptionLabelSelected: "newOptionLabelSelected", createNewOptionSelected: "createNewOptionSelected" }, providers: [{ provide: KeyboardSelectDirective, useExisting: forwardRef(() => BasicDropdownComponent) }], queries: [{ propertyName: "optionTemplateRef", first: true, predicate: ["optionTemplate"], descendants: true }, { propertyName: "createNewOptionTemplateRef", first: true, predicate: ["createNewOptionTemplate"], descendants: true }, { propertyName: "descriptionTemplateRef", first: true, predicate: ["descriptionTemplateRef"], descendants: true }], viewQueries: [{ propertyName: "selectOrigin", first: true, predicate: ["selectOrigin"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container [ngTemplateOutlet]=\"dropdown\" *ngIf=\"!overlayPositioning\" />\n<ng-container *ngIf=\"overlayPositioning\">\n  <div class=\"overlayOrigin\" cdkOverlayOrigin #selectOrigin=\"cdkOverlayOrigin\"></div>\n  <ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOrigin]=\"selectOrigin\"\n    [cdkConnectedOverlayOpen]=\"!!(cdkOverlayOpen$ | async)\"\n    [cdkConnectedOverlayWidth]=\"selectOrigin.elementRef.nativeElement.offsetWidth\"\n    (positionChange)=\"onPositionChange($event)\"\n  >\n    <div class=\"overlayDropdown\" [ngClass]=\"{ top: isTopDropdown }\">\n      <ng-container [ngTemplateOutlet]=\"dropdown\" />\n    </div>\n  </ng-template>\n</ng-container>\n\n<ng-template #dropdown>\n  <ul\n    class=\"options {{ padding }}Padding lxThinScrollbar\"\n    #keyboardSelectContainer\n    infinite-scroll\n    [scrollWindow]=\"false\"\n    [fromRoot]=\"true\"\n    [ngClass]=\"{ truncateOptions: truncateOptions }\"\n    (scrolled)=\"onScroll()\"\n  >\n    <li\n      *ngIf=\"newOptionLabel && isNewItem\"\n      tabindex=\"-1\"\n      lxSelectableItem\n      [scrollInContainer]=\"keyboardSelectContainer\"\n      #item\n      (click)=\"onNewItemSelected()\"\n      (select)=\"onNewItemSelected()\"\n      [class.selected]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n      class=\"option keyboardSelectable onTheFlyOption\"\n      [attr.aria-label]=\"newOptionLabel\"\n    >\n      <span class=\"newEntryContent\">\n        {{ newOptionLabel }}\n      </span>\n      <lx-counter class=\"lx-margin-left\" size=\"small\" [content]=\"'common.new' | translate | uppercase\" />\n    </li>\n    <li\n      *ngIf=\"showCreateNewOption\"\n      tabindex=\"-1\"\n      lxSelectableItem\n      [scrollInContainer]=\"keyboardSelectContainer\"\n      #item\n      (click)=\"onCreateNewOptionSelected()\"\n      (select)=\"onCreateNewOptionSelected()\"\n      [class.selected]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n      class=\"option keyboardSelectable newEntryOption\"\n    >\n      <span class=\"newEntryContent\">\n        <ng-container *ngIf=\"createNewOptionTemplateRef; else defaultNewOption\">\n          <ng-container *ngTemplateOutlet=\"createNewOptionTemplateRef\" />\n        </ng-container>\n        <ng-template #defaultNewOption>\n          <span>\n            {{ NAME + '.new' | translate }}\n          </span>\n        </ng-template>\n      </span>\n    </li>\n    <li\n      *ngIf=\"descriptionTemplateRef\"\n      tabindex=\"-1\"\n      lxSelectableItem\n      [scrollInContainer]=\"keyboardSelectContainer\"\n      #item\n      class=\"option description disabledItem\"\n    >\n      <span class=\"descriptionContent\">\n        <ng-container *ngTemplateOutlet=\"descriptionTemplateRef\" />\n      </span>\n    </li>\n    <li\n      *ngIf=\"options?.length === 0 && !newOptionLabel && !loading\"\n      tabindex=\"-1\"\n      lxSelectableItem\n      [scrollInContainer]=\"keyboardSelectContainer\"\n      #item\n      [class.selected]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n      class=\"option keyboardSelectable noOptionsAvailable\"\n      [attr.aria-label]=\"noResultsText ?? (NAME + '.noResults' | translate)\"\n    >\n      {{ noResultsText ?? (NAME + '.noResults' | translate) }}\n    </li>\n    <li\n      *ngIf=\"placeholder\"\n      tabindex=\"-1\"\n      class=\"option keyboardSelectable clearSelection\"\n      lxSelectableItem\n      [scrollInContainer]=\"keyboardSelectContainer\"\n      #item\n      (click)=\"selectOption(null)\"\n      (select)=\"selectOption(null)\"\n      [class.selected]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n      [attr.aria-label]=\"placeholder\"\n    >\n      {{ placeholder }}\n    </li>\n    <li\n      *ngFor=\"let option of options; let index = index; trackBy: trackByProp(itemKey)\"\n      tabindex=\"-1\"\n      lxSelectableItem\n      [scrollInContainer]=\"keyboardSelectContainer\"\n      #item\n      class=\"option keyboardSelectable\"\n      (click)=\"selectOption(option)\"\n      (select)=\"selectOption(option)\"\n      [class.selected]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n      [class.initiallySelected]=\"index === initiallySelectedIndex\"\n      [class.disabledItem]=\"(itemKey && !!disabledOptions[option[itemKey]]) || this.disabledOptions[option]\"\n      [attr.aria-label]=\"labelKey ? option[labelKey] : option\"\n    >\n      <ng-container *ngIf=\"optionTemplateRef; else simpleStringDisplay\">\n        <ng-container *ngTemplateOutlet=\"optionTemplateRef; context: { $implicit: option, index: index }\" />\n      </ng-container>\n      <ng-template #simpleStringDisplay>\n        <span>\n          {{ labelKey ? option[labelKey] : option }}\n        </span>\n      </ng-template>\n    </li>\n    <lx-spinner *ngIf=\"loading\" [fadeBackground]=\"true\" />\n  </ul>\n</ng-template>\n", styles: [":host(.noOptionPadding) .options .option{padding:0}.overlayDropdown{width:100%;background:#fff;border-radius:3px;border-left:solid 1px #e1e5eb;border-right:solid 1px #e1e5eb;margin:0 -1px;width:calc(100% + 2px)}.overlayDropdown:not(.top){box-shadow:0 6px 6px #21252933;border-top:0;border-bottom:solid 1px #e1e5eb;border-top-left-radius:0;border-top-right-radius:0}.overlayDropdown.top{box-shadow:0 -4px 6px #21252933;border-top:solid 1px #e1e5eb;border-bottom:0;border-bottom-left-radius:0;border-bottom-right-radius:0}.truncateOptions li{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.defaultPadding .newEntryOption,.defaultPadding .onTheFlyOption,.defaultPadding .noOptionsAvailable{padding:4px 12px!important}.narrowPadding .newEntryOption,.narrowPadding .onTheFlyOption,.narrowPadding .noOptionsAvailable{padding:4px!important}.options{list-style:none;margin:0;padding:0;overflow-y:auto;max-height:250px}.options.defaultPadding .option{padding:4px 12px}.options.narrowPadding .option{padding:4px}.optionSearch{padding:2px}.option{cursor:pointer;display:block}.option:hover:not(.disabledItem){background-color:#e1e5eb!important}.option.selected{background:#eaedf1}.option.initiallySelected{color:var(--lx-primarybutton-backgroundcolor)}.option.disabledItem{cursor:default;opacity:.5}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: InfiniteScrollModule }, { kind: "directive", type: i1$4.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { kind: "directive", type: SelectableItemDirective, selector: "[lxSelectableItem]", inputs: ["scrollInContainer", "lxSelectableItem"], outputs: ["select"] }, { kind: "component", type: CounterComponent, selector: "lx-counter", inputs: ["content", "size", "color"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: SpinnerComponent, selector: "lx-spinner", inputs: ["fadeBackground"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: UpperCasePipe, name: "uppercase" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: BasicDropdownComponent, isStandalone: true, selector: "lx-basic-dropdown", inputs: { options: "options", initiallySelectedIndex: "initiallySelectedIndex", labelKey: "labelKey", itemKey: "itemKey", placeholder: "placeholder", loading: "loading", newOptionLabel: "newOptionLabel", padding: "padding", showCreateNewOption: "showCreateNewOption", disabledOptions: "disabledOptions", overlayPositioning: "overlayPositioning", truncateOptions: "truncateOptions", noResultsText: "noResultsText" }, outputs: { onItemSelected: "onItemSelected", triggerRequestForMoreEntries: "triggerRequestForMoreEntries", newOptionLabelSelected: "newOptionLabelSelected", createNewOptionSelected: "createNewOptionSelected" }, providers: [{ provide: KeyboardSelectDirective, useExisting: forwardRef(() => BasicDropdownComponent) }], queries: [{ propertyName: "optionTemplateRef", first: true, predicate: ["optionTemplate"], descendants: true }, { propertyName: "createNewOptionTemplateRef", first: true, predicate: ["createNewOptionTemplate"], descendants: true }, { propertyName: "descriptionTemplateRef", first: true, predicate: ["descriptionTemplateRef"], descendants: true }], viewQueries: [{ propertyName: "selectOrigin", first: true, predicate: ["selectOrigin"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container [ngTemplateOutlet]=\"dropdown\" *ngIf=\"!overlayPositioning\" />\n<ng-container *ngIf=\"overlayPositioning\">\n  <div class=\"overlayOrigin\" cdkOverlayOrigin #selectOrigin=\"cdkOverlayOrigin\"></div>\n  <ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOrigin]=\"selectOrigin\"\n    [cdkConnectedOverlayOpen]=\"!!(cdkOverlayOpen$ | async)\"\n    [cdkConnectedOverlayWidth]=\"selectOrigin.elementRef.nativeElement.offsetWidth\"\n    (positionChange)=\"onPositionChange($event)\"\n  >\n    <div class=\"overlayDropdown\" [ngClass]=\"{ top: isTopDropdown }\">\n      <ng-container [ngTemplateOutlet]=\"dropdown\" />\n    </div>\n  </ng-template>\n</ng-container>\n\n<ng-template #dropdown>\n  <ul\n    class=\"options {{ padding }}Padding lxThinScrollbar\"\n    #keyboardSelectContainer\n    infinite-scroll\n    [scrollWindow]=\"false\"\n    [fromRoot]=\"true\"\n    [ngClass]=\"{ truncateOptions: truncateOptions }\"\n    (scrolled)=\"onScroll()\"\n  >\n    <li\n      *ngIf=\"newOptionLabel && isNewItem\"\n      tabindex=\"-1\"\n      lxSelectableItem\n      [scrollInContainer]=\"keyboardSelectContainer\"\n      #item\n      (click)=\"onNewItemSelected()\"\n      (select)=\"onNewItemSelected()\"\n      [class.selected]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n      class=\"option keyboardSelectable onTheFlyOption\"\n      [attr.aria-label]=\"newOptionLabel\"\n    >\n      <span class=\"newEntryContent\">\n        {{ newOptionLabel }}\n      </span>\n      <lx-counter class=\"lx-margin-left\" size=\"small\" [content]=\"'common.new' | translate | uppercase\" />\n    </li>\n    <li\n      *ngIf=\"showCreateNewOption\"\n      tabindex=\"-1\"\n      lxSelectableItem\n      [scrollInContainer]=\"keyboardSelectContainer\"\n      #item\n      (click)=\"onCreateNewOptionSelected()\"\n      (select)=\"onCreateNewOptionSelected()\"\n      [class.selected]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n      class=\"option keyboardSelectable newEntryOption\"\n    >\n      <span class=\"newEntryContent\">\n        <ng-container *ngIf=\"createNewOptionTemplateRef; else defaultNewOption\">\n          <ng-container *ngTemplateOutlet=\"createNewOptionTemplateRef\" />\n        </ng-container>\n        <ng-template #defaultNewOption>\n          <span>\n            {{ NAME + '.new' | translate }}\n          </span>\n        </ng-template>\n      </span>\n    </li>\n    <li\n      *ngIf=\"descriptionTemplateRef\"\n      tabindex=\"-1\"\n      lxSelectableItem\n      [scrollInContainer]=\"keyboardSelectContainer\"\n      #item\n      class=\"option description disabledItem\"\n    >\n      <span class=\"descriptionContent\">\n        <ng-container *ngTemplateOutlet=\"descriptionTemplateRef\" />\n      </span>\n    </li>\n    <li\n      *ngIf=\"options?.length === 0 && !newOptionLabel && !loading\"\n      tabindex=\"-1\"\n      lxSelectableItem\n      [scrollInContainer]=\"keyboardSelectContainer\"\n      #item\n      [class.selected]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n      class=\"option keyboardSelectable noOptionsAvailable\"\n      [attr.aria-label]=\"noResultsText ?? (NAME + '.noResults' | translate)\"\n    >\n      {{ noResultsText ?? (NAME + '.noResults' | translate) }}\n    </li>\n    <li\n      *ngIf=\"placeholder\"\n      tabindex=\"-1\"\n      class=\"option keyboardSelectable clearSelection\"\n      lxSelectableItem\n      [scrollInContainer]=\"keyboardSelectContainer\"\n      #item\n      (click)=\"selectOption(null)\"\n      (select)=\"selectOption(null)\"\n      [class.selected]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n      [attr.aria-label]=\"placeholder\"\n    >\n      {{ placeholder }}\n    </li>\n    <li\n      *ngFor=\"let option of options; let index = index; trackBy: trackByProp(itemKey)\"\n      tabindex=\"-1\"\n      lxSelectableItem\n      [scrollInContainer]=\"keyboardSelectContainer\"\n      #item\n      class=\"option keyboardSelectable\"\n      (click)=\"selectOption(option)\"\n      (select)=\"selectOption(option)\"\n      [class.selected]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n      [class.initiallySelected]=\"index === initiallySelectedIndex\"\n      [class.disabledItem]=\"(itemKey && !!disabledOptions[option[itemKey]]) || this.disabledOptions[option]\"\n      [attr.aria-label]=\"labelKey ? option[labelKey] : option\"\n    >\n      <ng-container *ngIf=\"optionTemplateRef; else simpleStringDisplay\">\n        <ng-container *ngTemplateOutlet=\"optionTemplateRef; context: { $implicit: option, index: index }\" />\n      </ng-container>\n      <ng-template #simpleStringDisplay>\n        <span>\n          {{ labelKey ? option[labelKey] : option }}\n        </span>\n      </ng-template>\n    </li>\n    <lx-spinner *ngIf=\"loading\" [fadeBackground]=\"true\" />\n  </ul>\n</ng-template>\n", styles: [":host(.noOptionPadding) .options .option{padding:0}.overlayDropdown{width:100%;background:#fff;border-radius:3px;border-left:solid 1px #e1e5eb;border-right:solid 1px #e1e5eb;margin:0 -1px;width:calc(100% + 2px)}.overlayDropdown:not(.top){box-shadow:0 6px 6px #21252933;border-top:0;border-bottom:solid 1px #e1e5eb;border-top-left-radius:0;border-top-right-radius:0}.overlayDropdown.top{box-shadow:0 -4px 6px #21252933;border-top:solid 1px #e1e5eb;border-bottom:0;border-bottom-left-radius:0;border-bottom-right-radius:0}.truncateOptions li{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.defaultPadding .newEntryOption,.defaultPadding .onTheFlyOption,.defaultPadding .noOptionsAvailable{padding:4px 12px!important}.narrowPadding .newEntryOption,.narrowPadding .onTheFlyOption,.narrowPadding .noOptionsAvailable{padding:4px!important}.options{list-style:none;margin:0;padding:0;overflow-y:auto;max-height:250px}.options.defaultPadding .option{padding:4px 12px}.options.narrowPadding .option{padding:4px}.optionSearch{padding:2px}.option{cursor:pointer;display:block}.option:hover:not(.disabledItem){background-color:#e1e5eb!important}.option.selected{background:#eaedf1}.option.initiallySelected{color:var(--lx-primarybutton-backgroundcolor)}.option.disabledItem{cursor:default;opacity:.5}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: InfiniteScrollModule }, { kind: "directive", type: i1$4.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { kind: "directive", type: SelectableItemDirective, selector: "[lxSelectableItem]", inputs: ["scrollInContainer", "lxSelectableItem"], outputs: ["select"] }, { kind: "component", type: CounterComponent, selector: "lx-counter", inputs: ["content", "size", "color"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: SpinnerComponent, selector: "lx-spinner", inputs: ["fadeBackground"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: UpperCasePipe, name: "uppercase" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: BasicDropdownComponent, decorators: [{
             type: Component,
@@ -5221,7 +5187,7 @@ class KeyboardSortableItemDirective {
             }
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: KeyboardSortableItemDirective, deps: [{ token: i1$6.CdkDrag }, { token: i1$1.OverlayPositionBuilder }, { token: i0.ElementRef }, { token: i1$1.Overlay }, { token: i2.AriaDescriber }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: KeyboardSortableItemDirective, deps: [{ token: i1$6.CdkDrag }, { token: i1$2.OverlayPositionBuilder }, { token: i0.ElementRef }, { token: i1$2.Overlay }, { token: i2.AriaDescriber }], target: i0.ɵɵFactoryTarget.Directive }); }
     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.8", type: KeyboardSortableItemDirective, isStandalone: true, selector: "[lxKeyboardSortableItem]", inputs: { allItemsData: ["lxKeyboardSortableItem", "allItemsData"], itemData: ["lxKeyboardItemData", "itemData"], isSortingByKeyboard: "isSortingByKeyboard", itemBeingSorted: ["lxKeyboardItemBeingSorted", "itemBeingSorted"] }, outputs: { isSortingByKeyboardChange: "isSortingByKeyboardChange", itemBeingSortedChange: "lxKeyboardItemBeingSortedChange", sortItemsWithKeyboard: "sortItemsWithKeyboard", focusWithKeyboard: "focusWithKeyboard" }, host: { listeners: { "keyup.tab": "focusViaKeyboard()", "keydown.enter": "enterSortingModeEnabledByKeyboard($event)", "keydown.space": "enterSortingModeEnabledByKeyboard($event)", "blur": "leaveSortingModeEnabledByKeyboard($event)", "keydown.esc": "leaveSortingModeEnabledByKeyboard($event)", "keydown.arrowUp": "sort($event)", "keydown.arrowDown": "sort($event)" }, properties: { "attr.lxTooltip": "this.tooltipDirective", "class.isBeingSortedByKeyboard": "this.isBeingSorted" } }, usesOnChanges: true, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: KeyboardSortableItemDirective, decorators: [{
@@ -5230,7 +5196,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
                     selector: '[lxKeyboardSortableItem]',
                     standalone: true
                 }]
-        }], ctorParameters: () => [{ type: i1$6.CdkDrag }, { type: i1$1.OverlayPositionBuilder }, { type: i0.ElementRef }, { type: i1$1.Overlay }, { type: i2.AriaDescriber }], propDecorators: { allItemsData: [{
+        }], ctorParameters: () => [{ type: i1$6.CdkDrag }, { type: i1$2.OverlayPositionBuilder }, { type: i0.ElementRef }, { type: i1$2.Overlay }, { type: i2.AriaDescriber }], propDecorators: { allItemsData: [{
                 type: Input,
                 args: ['lxKeyboardSortableItem']
             }], itemData: [{
@@ -5293,7 +5259,7 @@ class KeyboardSortableListDirective {
             item.tooltipDirective.show();
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: KeyboardSortableListDirective, deps: [{ token: i1$2.TranslateService }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: KeyboardSortableListDirective, deps: [{ token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Directive }); }
     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.8", type: KeyboardSortableListDirective, isStandalone: true, selector: "[lxKeyboardSortableList]", inputs: { keyboardSortableItems: "keyboardSortableItems" }, ngImport: i0 }); }
 }
 __decorate([
@@ -5305,7 +5271,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
                     selector: '[lxKeyboardSortableList]',
                     standalone: true
                 }]
-        }], ctorParameters: () => [{ type: i1$2.TranslateService }], propDecorators: { keyboardSortableItems$: [], keyboardSortableItems: [{
+        }], ctorParameters: () => [{ type: i1$1.TranslateService }], propDecorators: { keyboardSortableItems$: [], keyboardSortableItems: [{
                 type: Input
             }] } });
 
@@ -5367,7 +5333,7 @@ class DragAndDropListComponent {
         return item.item;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: DragAndDropListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: DragAndDropListComponent, isStandalone: true, selector: "lx-drag-and-drop-list", inputs: { label: "label", labelFontWeight: "labelFontWeight", color: "color", fontSize: "fontSize" }, outputs: { moveToIndex: "moveToIndex", moveItem: "moveItem" }, host: { properties: { "attr.color": "this.color", "attr.fontSize": "this.fontSize" } }, queries: [{ propertyName: "_items", predicate: DragAndDropListItemComponent }], viewQueries: [{ propertyName: "_keyboardSortableItems", predicate: KeyboardSortableItemDirective, descendants: true }], ngImport: i0, template: "<label *ngIf=\"label\" [style.font-weight]=\"labelFontWeight\">{{ label }}</label>\n<p class=\"sr-only\">{{ NAME + '.helpTooltip' | translate }}</p>\n<ul\n  cdkDropList\n  class=\"list\"\n  role=\"listbox\"\n  [attr.aria-label]=\"label\"\n  lxKeyboardSortableList\n  [keyboardSortableItems]=\"keyboardSortableItems$ | async\"\n  [cdkDropListData]=\"items$ | async\"\n  (cdkDropListDropped)=\"drop($event)\"\n>\n  <li\n    *ngFor=\"let itemComponent of items$ | async; trackBy: trackByItem\"\n    #listItemParent\n    class=\"item\"\n    cdkDrag\n    cdkDragLockAxis=\"y\"\n    [cdkDragData]=\"itemComponent.item\"\n    [cdkDragDisabled]=\"!itemComponent.draggable\"\n    [class.dark]=\"color === 'dark'\"\n    [class.big]=\"fontSize === 'big'\"\n    [tabIndex]=\"itemComponent.draggable === false ? -1 : 0\"\n    [lxKeyboardSortableItem]=\"allItemsData$ | async\"\n    [lxKeyboardItemData]=\"itemComponent.item\"\n    [(isSortingByKeyboard)]=\"isSortingByKeyboard\"\n    [(lxKeyboardItemBeingSorted)]=\"keyboardItemBeingSorted\"\n    (sortItemsWithKeyboard)=\"dropToIndexAfterArrowKey(itemComponent.item, $event.previousIndex, $event.currentIndex)\"\n  >\n    <lx-drag-and-drop-list-item\n      class=\"dragAndDropItem\"\n      [item]=\"itemComponent.item\"\n      [draggable]=\"itemComponent.draggable\"\n      [actions]=\"itemComponent.actions\"\n      (action)=\"emitContentChildAction($event)\"\n    >\n      <ng-template *ngIf=\"itemComponent.customTemplateRef\" #customTemplate>\n        <ng-container *ngTemplateOutlet=\"itemComponent.customTemplateRef\" />\n      </ng-template>\n    </lx-drag-and-drop-list-item>\n  </li>\n</ul>\n", styles: ["@keyframes subtleScaleUpKeyFrames{0%{transform:scale(.95);opacity:0}}:host{display:block}.list{list-style-type:none;width:100%;display:block;padding:0;color:#526179}.item.cdk-drag-disabled{background:#eaedf1;cursor:default}.item{position:relative;cursor:move;border:solid 1px #99a5bb;margin-bottom:4px;border-radius:3px}.item:focus{outline:1px auto #0070f2}.cdk-drag-preview{box-sizing:border-box;border-radius:3px;list-style:none;border:solid 1px #99a5bb!important;box-shadow:0 3px 4px #7474744d}.cdk-drag-placeholder{opacity:.5}.cdk-drag-placeholder i{opacity:0}.cdk-drag-animating{transition:transform .18s;transition-delay:0s;transition-timing-function:ease}.list.cdk-drop-list-dragging .item:not(.cdk-drag-placeholder){transition:transform .18s;transition-delay:0s;transition-timing-function:ease}:host[color=dark] lx-drag-and-drop-list-item{background-color:#f0f2f5;color:#526179;border-radius:3px}:host[color=dark] .list,:host[color=dark] .item{border:0}:host[color=dark] .item.cdk-drag-disabled lx-drag-and-drop-list-item{background:#fff;color:#99a5bb;border:1px solid #99a5bb}:host[fontSize=big] .item{text-transform:uppercase;font-weight:700}.cdk-drag-preview.dark{border:0!important}.cdk-drag-preview.dark lx-drag-and-drop-list-item{background-color:#f0f2f5;color:#526179;border-radius:3px}.cdk-drag-preview.big{text-transform:uppercase;font-weight:700}.isBeingSortedByKeyboard{box-shadow:0 6px 24px #b2bccc;z-index:1}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: KeyboardSortableListDirective, selector: "[lxKeyboardSortableList]", inputs: ["keyboardSortableItems"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: KeyboardSortableItemDirective, selector: "[lxKeyboardSortableItem]", inputs: ["lxKeyboardSortableItem", "lxKeyboardItemData", "isSortingByKeyboard", "lxKeyboardItemBeingSorted"], outputs: ["isSortingByKeyboardChange", "lxKeyboardItemBeingSortedChange", "sortItemsWithKeyboard", "focusWithKeyboard"] }, { kind: "component", type: DragAndDropListItemComponent, selector: "lx-drag-and-drop-list-item", inputs: ["item", "draggable", "actions"], outputs: ["action"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: DragDropModule }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: DragAndDropListComponent, isStandalone: true, selector: "lx-drag-and-drop-list", inputs: { label: "label", labelFontWeight: "labelFontWeight", color: "color", fontSize: "fontSize" }, outputs: { moveToIndex: "moveToIndex", moveItem: "moveItem" }, host: { properties: { "attr.color": "this.color", "attr.fontSize": "this.fontSize" } }, queries: [{ propertyName: "_items", predicate: DragAndDropListItemComponent }], viewQueries: [{ propertyName: "_keyboardSortableItems", predicate: KeyboardSortableItemDirective, descendants: true }], ngImport: i0, template: "<label *ngIf=\"label\" [style.font-weight]=\"labelFontWeight\">{{ label }}</label>\n<p class=\"sr-only\">{{ NAME + '.helpTooltip' | translate }}</p>\n<ul\n  cdkDropList\n  class=\"list\"\n  role=\"listbox\"\n  [attr.aria-label]=\"label\"\n  lxKeyboardSortableList\n  [keyboardSortableItems]=\"keyboardSortableItems$ | async\"\n  [cdkDropListData]=\"items$ | async\"\n  (cdkDropListDropped)=\"drop($event)\"\n>\n  <li\n    *ngFor=\"let itemComponent of items$ | async; trackBy: trackByItem\"\n    #listItemParent\n    class=\"item\"\n    cdkDrag\n    cdkDragLockAxis=\"y\"\n    [cdkDragData]=\"itemComponent.item\"\n    [cdkDragDisabled]=\"!itemComponent.draggable\"\n    [class.dark]=\"color === 'dark'\"\n    [class.big]=\"fontSize === 'big'\"\n    [tabIndex]=\"itemComponent.draggable === false ? -1 : 0\"\n    [lxKeyboardSortableItem]=\"allItemsData$ | async\"\n    [lxKeyboardItemData]=\"itemComponent.item\"\n    [(isSortingByKeyboard)]=\"isSortingByKeyboard\"\n    [(lxKeyboardItemBeingSorted)]=\"keyboardItemBeingSorted\"\n    (sortItemsWithKeyboard)=\"dropToIndexAfterArrowKey(itemComponent.item, $event.previousIndex, $event.currentIndex)\"\n  >\n    <lx-drag-and-drop-list-item\n      class=\"dragAndDropItem\"\n      [item]=\"itemComponent.item\"\n      [draggable]=\"itemComponent.draggable\"\n      [actions]=\"itemComponent.actions\"\n      (action)=\"emitContentChildAction($event)\"\n    >\n      <ng-template *ngIf=\"itemComponent.customTemplateRef\" #customTemplate>\n        <ng-container *ngTemplateOutlet=\"itemComponent.customTemplateRef\" />\n      </ng-template>\n    </lx-drag-and-drop-list-item>\n  </li>\n</ul>\n", styles: ["@keyframes subtleScaleUpKeyFrames{0%{transform:scale(.95);opacity:0}}:host{display:block}.list{list-style-type:none;width:100%;display:block;padding:0;color:#526179}.item.cdk-drag-disabled{background:#eaedf1;cursor:default}.item{position:relative;cursor:move;border:solid 1px #99a5bb;margin-bottom:4px;border-radius:3px}.item:focus{outline:1px auto #0070f2}.cdk-drag-preview{box-sizing:border-box;border-radius:3px;list-style:none;border:solid 1px #99a5bb!important;box-shadow:0 3px 4px #7474744d}.cdk-drag-placeholder{opacity:.5}.cdk-drag-placeholder i{opacity:0}.cdk-drag-animating{transition:transform .18s;transition-delay:0s;transition-timing-function:ease}.list.cdk-drop-list-dragging .item:not(.cdk-drag-placeholder){transition:transform .18s;transition-delay:0s;transition-timing-function:ease}:host[color=dark] lx-drag-and-drop-list-item{background-color:#f0f2f5;color:#526179;border-radius:3px}:host[color=dark] .list,:host[color=dark] .item{border:0}:host[color=dark] .item.cdk-drag-disabled lx-drag-and-drop-list-item{background:#fff;color:#99a5bb;border:1px solid #99a5bb}:host[fontSize=big] .item{text-transform:uppercase;font-weight:700}.cdk-drag-preview.dark{border:0!important}.cdk-drag-preview.dark lx-drag-and-drop-list-item{background-color:#f0f2f5;color:#526179;border-radius:3px}.cdk-drag-preview.big{text-transform:uppercase;font-weight:700}.isBeingSortedByKeyboard{box-shadow:0 6px 24px #b2bccc;z-index:1}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: KeyboardSortableListDirective, selector: "[lxKeyboardSortableList]", inputs: ["keyboardSortableItems"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: KeyboardSortableItemDirective, selector: "[lxKeyboardSortableItem]", inputs: ["lxKeyboardSortableItem", "lxKeyboardItemData", "isSortingByKeyboard", "lxKeyboardItemBeingSorted"], outputs: ["isSortingByKeyboardChange", "lxKeyboardItemBeingSortedChange", "sortItemsWithKeyboard", "focusWithKeyboard"] }, { kind: "component", type: DragAndDropListItemComponent, selector: "lx-drag-and-drop-list-item", inputs: ["item", "draggable", "actions"], outputs: ["action"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: DragDropModule }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: DragAndDropListComponent, decorators: [{
             type: Component,
@@ -5413,7 +5379,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
 class LxDragAndDropListModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: LxDragAndDropListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
     static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.8", ngImport: i0, type: LxDragAndDropListModule, imports: [CommonModule,
-            DragDropModule, i1$2.TranslateModule, KeyboardSortableItemDirective,
+            DragDropModule, i1$1.TranslateModule, KeyboardSortableItemDirective,
             KeyboardSortableListDirective,
             DragAndDropListComponent,
             DragAndDropListItemComponent], exports: [DragAndDropListComponent, DragAndDropListItemComponent] }); }
@@ -5460,7 +5426,7 @@ class ExpandedDropdownComponent extends KeyboardSelectDirective {
         this.onChooseItem = new EventEmitter();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ExpandedDropdownComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: ExpandedDropdownComponent, isStandalone: true, selector: "lx-expanded-dropdown", inputs: { options: "options" }, outputs: { onChooseItem: "onChooseItem" }, usesInheritance: true, ngImport: i0, template: "<ul class=\"options lxThinScrollbar\" #keyboardSelectContainer>\n  <li *ngIf=\"options?.length === 0\" tabindex=\"-1\" id=\"noOption\" class=\"option noOptionsAvailable\">\n    {{ NAME + '.noResults' | translate }}\n  </li>\n  <li\n    *ngFor=\"let option of options; let index = index\"\n    tabindex=\"-1\"\n    lxSelectableItem\n    [scrollInContainer]=\"keyboardSelectContainer\"\n    #item\n    class=\"option keyboardSelectable\"\n    (click)=\"onChooseItem.emit(option.id)\"\n    [class.selected]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n  >\n    <ng-container>\n      <ng-container *ngTemplateOutlet=\"simpleStringDisplay; context: { $implicit: option, index: index }\" />\n    </ng-container>\n    <ng-template #simpleStringDisplay>\n      <span [title]=\"option.name\">\n        {{ option.name }}\n      </span>\n    </ng-template>\n    <div class=\"iconContainer\">\n      <svg\n        width=\"32px\"\n        height=\"32px\"\n        viewBox=\"0 0 32 32\"\n        version=\"1.1\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n      >\n        <title>Button/Text/Primary/Medium</title>\n        <g id=\"choose-workspace-D\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n          <g id=\"choose-a-workspace-D\" transform=\"translate(-911.000000, -429.000000)\">\n            <g id=\"Group-3\" transform=\"translate(471.000000, 249.000000)\">\n              <g id=\"Button/Text/Primary/Medium\" transform=\"translate(440.000000, 180.000000)\">\n                <g id=\"UI/Shape/Rectangle-rounded-2px\" fill=\"#0070f2\">\n                  <circle id=\"\uD83C\uDFA8-Style\" cx=\"16\" cy=\"16\" r=\"16\" />\n                </g>\n                <g id=\"Icons/basic/refresh\" transform=\"translate(7.000000, 11.000000)\" fill=\"#FFFFFF\" fill-rule=\"nonzero\">\n                  <g id=\"arrow-right\" transform=\"translate(3.772240, 0.000000)\">\n                    <path\n                      d=\"M5.41769476,0.0873198725 L4.92588162,0.579133017 C4.80947996,0.695534673 4.80947996,0.88427129 4.92588162,1.00069779 L8.77935771,4.85414904 L0.298083627,4.85414904 C0.133466944,4.85414904 0,4.98761598 0,5.15223266 L0,5.84776113 C0,6.01237781 0.133466944,6.14584475 0.298083627,6.14584475 L8.77935771,6.14584475 L4.92588162,9.99932084 C4.80947996,10.1157225 4.80947996,10.3044591 4.92588162,10.4208856 L5.41769476,10.9126988 C5.53409642,11.0291004 5.72283304,11.0291004 5.83925953,10.9126988 L11.0411666,5.7107917 C11.1575682,5.59439004 11.1575682,5.40565343 11.0411666,5.28922693 L5.83923469,0.0873198725 C5.72283304,-0.0291066242 5.53409642,-0.0291066242 5.41769476,0.0873198725 Z\"\n                      id=\"Path\"\n                    />\n                  </g>\n                </g>\n              </g>\n            </g>\n          </g>\n        </g>\n      </svg>\n    </div>\n  </li>\n</ul>\n", styles: [".options{list-style:none;margin:0;padding:0;overflow-y:auto;max-height:200px}.options:hover .selected{background-color:#fff}.optionSearch{padding:2px}.option{display:flex;justify-content:space-between;font-size:15.5px;height:40px;align-items:center;padding:4px 12px;border-bottom:1px solid #e1e5eb}.option:hover{background-color:#e1e5eb!important}.option.selected{background:#eaedf1}.option span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.iconContainer{display:none}.option:hover .iconContainer{display:flex}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: SelectableItemDirective, selector: "[lxSelectableItem]", inputs: ["scrollInContainer", "lxSelectableItem"], outputs: ["select"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: ExpandedDropdownComponent, isStandalone: true, selector: "lx-expanded-dropdown", inputs: { options: "options" }, outputs: { onChooseItem: "onChooseItem" }, usesInheritance: true, ngImport: i0, template: "<ul class=\"options lxThinScrollbar\" #keyboardSelectContainer>\n  <li *ngIf=\"options?.length === 0\" tabindex=\"-1\" id=\"noOption\" class=\"option noOptionsAvailable\">\n    {{ NAME + '.noResults' | translate }}\n  </li>\n  <li\n    *ngFor=\"let option of options; let index = index\"\n    tabindex=\"-1\"\n    lxSelectableItem\n    [scrollInContainer]=\"keyboardSelectContainer\"\n    #item\n    class=\"option keyboardSelectable\"\n    (click)=\"onChooseItem.emit(option.id)\"\n    [class.selected]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n  >\n    <ng-container>\n      <ng-container *ngTemplateOutlet=\"simpleStringDisplay; context: { $implicit: option, index: index }\" />\n    </ng-container>\n    <ng-template #simpleStringDisplay>\n      <span [title]=\"option.name\">\n        {{ option.name }}\n      </span>\n    </ng-template>\n    <div class=\"iconContainer\">\n      <svg\n        width=\"32px\"\n        height=\"32px\"\n        viewBox=\"0 0 32 32\"\n        version=\"1.1\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n      >\n        <title>Button/Text/Primary/Medium</title>\n        <g id=\"choose-workspace-D\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n          <g id=\"choose-a-workspace-D\" transform=\"translate(-911.000000, -429.000000)\">\n            <g id=\"Group-3\" transform=\"translate(471.000000, 249.000000)\">\n              <g id=\"Button/Text/Primary/Medium\" transform=\"translate(440.000000, 180.000000)\">\n                <g id=\"UI/Shape/Rectangle-rounded-2px\" fill=\"#0070f2\">\n                  <circle id=\"\uD83C\uDFA8-Style\" cx=\"16\" cy=\"16\" r=\"16\" />\n                </g>\n                <g id=\"Icons/basic/refresh\" transform=\"translate(7.000000, 11.000000)\" fill=\"#FFFFFF\" fill-rule=\"nonzero\">\n                  <g id=\"arrow-right\" transform=\"translate(3.772240, 0.000000)\">\n                    <path\n                      d=\"M5.41769476,0.0873198725 L4.92588162,0.579133017 C4.80947996,0.695534673 4.80947996,0.88427129 4.92588162,1.00069779 L8.77935771,4.85414904 L0.298083627,4.85414904 C0.133466944,4.85414904 0,4.98761598 0,5.15223266 L0,5.84776113 C0,6.01237781 0.133466944,6.14584475 0.298083627,6.14584475 L8.77935771,6.14584475 L4.92588162,9.99932084 C4.80947996,10.1157225 4.80947996,10.3044591 4.92588162,10.4208856 L5.41769476,10.9126988 C5.53409642,11.0291004 5.72283304,11.0291004 5.83925953,10.9126988 L11.0411666,5.7107917 C11.1575682,5.59439004 11.1575682,5.40565343 11.0411666,5.28922693 L5.83923469,0.0873198725 C5.72283304,-0.0291066242 5.53409642,-0.0291066242 5.41769476,0.0873198725 Z\"\n                      id=\"Path\"\n                    />\n                  </g>\n                </g>\n              </g>\n            </g>\n          </g>\n        </g>\n      </svg>\n    </div>\n  </li>\n</ul>\n", styles: [".options{list-style:none;margin:0;padding:0;overflow-y:auto;max-height:200px}.options:hover .selected{background-color:#fff}.optionSearch{padding:2px}.option{display:flex;justify-content:space-between;font-size:15.5px;height:40px;align-items:center;padding:4px 12px;border-bottom:1px solid #e1e5eb}.option:hover{background-color:#e1e5eb!important}.option.selected{background:#eaedf1}.option span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.iconContainer{display:none}.option:hover .iconContainer{display:flex}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: SelectableItemDirective, selector: "[lxSelectableItem]", inputs: ["scrollInContainer", "lxSelectableItem"], outputs: ["select"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ExpandedDropdownComponent, decorators: [{
             type: Component,
@@ -5494,7 +5460,7 @@ class FormErrorComponent {
         return [];
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: FormErrorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: FormErrorComponent, isStandalone: true, selector: "lx-form-error", inputs: { namespace: "namespace", form: "form", controlName: "controlName" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"error\" *ngFor=\"let key of translationKeys\">\n  {{ key | translate }}\n</div>\n", styles: [".error{color:#f96464;padding:4px}\n"], dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: FormErrorComponent, isStandalone: true, selector: "lx-form-error", inputs: { namespace: "namespace", form: "form", controlName: "controlName" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"error\" *ngFor=\"let key of translationKeys\">\n  {{ key | translate }}\n</div>\n", styles: [".error{color:#f96464;padding:4px}\n"], dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: FormErrorComponent, decorators: [{
             type: Component,
@@ -6252,7 +6218,7 @@ class OptionGroupDropdownComponent extends KeyboardSelectDirective {
         this.isTopDropdown = event.connectionPair.originY === 'top';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: OptionGroupDropdownComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: OptionGroupDropdownComponent, isStandalone: true, selector: "lx-option-group-dropdown", inputs: { optionGroups: "optionGroups", newOptionLabel: "newOptionLabel", highlightTerm: "highlightTerm", showCreateNewOption: "showCreateNewOption", labelKey: "labelKey", loading: "loading", trackByProperty: "trackByProperty", showNoResultsIfGroupIsEmpty: "showNoResultsIfGroupIsEmpty", overlayPositioning: "overlayPositioning" }, outputs: { onItemSelected: "onItemSelected", containerScrolled: "containerScrolled", createNewOption: "createNewOption" }, providers: [{ provide: KeyboardSelectDirective, useExisting: forwardRef(() => OptionGroupDropdownComponent) }], queries: [{ propertyName: "optionTemplateRef", first: true, predicate: ["optionTemplate"], descendants: true }, { propertyName: "noResultsOptionTemplateRef", first: true, predicate: ["noResultsOptionTemplateRef"], descendants: true }], viewQueries: [{ propertyName: "selectOrigin", first: true, predicate: ["selectOrigin"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"overlayPositioning; else dropdown\">\n  <div class=\"overlayOrigin\" cdkOverlayOrigin #selectOrigin=\"cdkOverlayOrigin\"></div>\n  <ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOrigin]=\"selectOrigin\"\n    [cdkConnectedOverlayOpen]=\"!!(cdkOverlayOpen$ | async)\"\n    [cdkConnectedOverlayWidth]=\"selectOrigin.elementRef.nativeElement.offsetWidth\"\n    (positionChange)=\"onPositionChange($event)\"\n  >\n    <div class=\"overlayDropdown\" [ngClass]=\"{ top: isTopDropdown }\">\n      <ng-container [ngTemplateOutlet]=\"dropdown\" />\n    </div>\n  </ng-template>\n</ng-container>\n\n<ng-template #dropdown>\n  <div\n    #keyboardSelectContainer\n    class=\"scrollingPanel lxThinScrollbar\"\n    infinite-scroll\n    [scrollWindow]=\"false\"\n    [fromRoot]=\"true\"\n    (scrolled)=\"containerScrolled.emit()\"\n  >\n    <ul class=\"options\">\n      <li\n        *ngIf=\"showCreateNewOption && newOptionLabel && isNewItem\"\n        lxSelectableItem\n        [scrollInContainer]=\"keyboardSelectContainer\"\n        #item\n        (click)=\"onCreateNewOption()\"\n        (select)=\"onCreateNewOption()\"\n        [class.highlighted]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n        class=\"option\"\n      >\n        <span class=\"newEntryContent\">\n          {{ newOptionLabel }}\n        </span>\n        <lx-counter class=\"lx-margin-left\" size=\"small\" [content]=\"'common.new' | translate | uppercase\" />\n      </li>\n      <ng-container *ngFor=\"let optionGroup of optionGroups; let groupIndex = index; trackBy: trackByLabel\">\n        <li>\n          <div class=\"groupLabel\" *ngIf=\"optionGroup.label\">\n            <span>{{ optionGroup.label | uppercase }}</span>\n          </div>\n          <ul>\n            <ng-container *ngIf=\"showNoResultsIfGroupIsEmpty && optionGroup.options.length === 0; else options\">\n              <li class=\"noResult\">\n                <ng-container *ngIf=\"noResultsOptionTemplateRef; else defaultText\">\n                  <ng-container *ngTemplateOutlet=\"noResultsOptionTemplateRef; context: { group: optionGroup, groupIndex: groupIndex }\" />\n                </ng-container>\n                <ng-template #defaultText>\n                  <span>{{ NAME + '.noResults' | translate }}</span>\n                </ng-template>\n              </li>\n            </ng-container>\n            <ng-template #options>\n              <li\n                *ngFor=\"let option of optionGroup.options; let index = index; trackBy: trackByValue\"\n                lxSelectableItem\n                [scrollInContainer]=\"keyboardSelectContainer\"\n                #item\n                class=\"option\"\n                (click)=\"selectOption(option)\"\n                (select)=\"selectOption(option)\"\n                [class.highlighted]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n              >\n                <ng-container *ngIf=\"optionTemplateRef; else basicDropdownOption\">\n                  <ng-container\n                    *ngTemplateOutlet=\"optionTemplateRef; context: { $implicit: option, index: index, groupIndex: groupIndex }\"\n                  />\n                </ng-container>\n                <ng-template #basicDropdownOption>\n                  <lx-basic-dropdown-item [label]=\"option.label\" labelFontWeight=\"normal\" [highlightTerm]=\"highlightTerm\" />\n                </ng-template>\n              </li>\n            </ng-template>\n          </ul>\n        </li>\n      </ng-container>\n      <lx-spinner *ngIf=\"loading\" [fadeBackground]=\"true\" />\n    </ul>\n  </div>\n</ng-template>\n", styles: [":host{display:block}.overlayDropdown{width:100%;background:#fff;border-radius:3px;border-left:solid 1px #e1e5eb;border-right:solid 1px #e1e5eb;margin:0 -1px;width:calc(100% + 2px)}.overlayDropdown:not(.top){box-shadow:0 6px 6px #21252933;border-top:0;border-bottom:solid 1px #e1e5eb;border-top-left-radius:0;border-top-right-radius:0}.overlayDropdown.top{box-shadow:0 -4px 6px #21252933;border-top:solid 1px #e1e5eb;border-bottom:0;border-bottom-left-radius:0;border-bottom-right-radius:0}.scrollingPanel{overflow-y:auto;max-height:400px}.groupLabel{line-height:23px;padding:4px 12px;color:#61779d;letter-spacing:.5px;font-weight:700;text-transform:uppercase;cursor:default}ul{list-style:none;margin:0;padding:0}ul:not(:last-child){border-bottom:solid 1px #eaedf1}.noResult{display:block;padding:4px 12px}.option{cursor:pointer;display:block;padding:4px 12px}.option:hover{background-color:#e1e5eb!important}.option.highlighted{background:#eaedf1}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: InfiniteScrollModule }, { kind: "directive", type: i1$4.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { kind: "directive", type: SelectableItemDirective, selector: "[lxSelectableItem]", inputs: ["scrollInContainer", "lxSelectableItem"], outputs: ["select"] }, { kind: "component", type: CounterComponent, selector: "lx-counter", inputs: ["content", "size", "color"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: BasicDropdownItemComponent, selector: "lx-basic-dropdown-item", inputs: ["label", "description", "highlightTerm", "labelFontWeight", "descriptionFontStyle", "descriptionStyleOptions"] }, { kind: "component", type: SpinnerComponent, selector: "lx-spinner", inputs: ["fadeBackground"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: UpperCasePipe, name: "uppercase" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: OptionGroupDropdownComponent, isStandalone: true, selector: "lx-option-group-dropdown", inputs: { optionGroups: "optionGroups", newOptionLabel: "newOptionLabel", highlightTerm: "highlightTerm", showCreateNewOption: "showCreateNewOption", labelKey: "labelKey", loading: "loading", trackByProperty: "trackByProperty", showNoResultsIfGroupIsEmpty: "showNoResultsIfGroupIsEmpty", overlayPositioning: "overlayPositioning" }, outputs: { onItemSelected: "onItemSelected", containerScrolled: "containerScrolled", createNewOption: "createNewOption" }, providers: [{ provide: KeyboardSelectDirective, useExisting: forwardRef(() => OptionGroupDropdownComponent) }], queries: [{ propertyName: "optionTemplateRef", first: true, predicate: ["optionTemplate"], descendants: true }, { propertyName: "noResultsOptionTemplateRef", first: true, predicate: ["noResultsOptionTemplateRef"], descendants: true }], viewQueries: [{ propertyName: "selectOrigin", first: true, predicate: ["selectOrigin"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"overlayPositioning; else dropdown\">\n  <div class=\"overlayOrigin\" cdkOverlayOrigin #selectOrigin=\"cdkOverlayOrigin\"></div>\n  <ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOrigin]=\"selectOrigin\"\n    [cdkConnectedOverlayOpen]=\"!!(cdkOverlayOpen$ | async)\"\n    [cdkConnectedOverlayWidth]=\"selectOrigin.elementRef.nativeElement.offsetWidth\"\n    (positionChange)=\"onPositionChange($event)\"\n  >\n    <div class=\"overlayDropdown\" [ngClass]=\"{ top: isTopDropdown }\">\n      <ng-container [ngTemplateOutlet]=\"dropdown\" />\n    </div>\n  </ng-template>\n</ng-container>\n\n<ng-template #dropdown>\n  <div\n    #keyboardSelectContainer\n    class=\"scrollingPanel lxThinScrollbar\"\n    infinite-scroll\n    [scrollWindow]=\"false\"\n    [fromRoot]=\"true\"\n    (scrolled)=\"containerScrolled.emit()\"\n  >\n    <ul class=\"options\">\n      <li\n        *ngIf=\"showCreateNewOption && newOptionLabel && isNewItem\"\n        lxSelectableItem\n        [scrollInContainer]=\"keyboardSelectContainer\"\n        #item\n        (click)=\"onCreateNewOption()\"\n        (select)=\"onCreateNewOption()\"\n        [class.highlighted]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n        class=\"option\"\n      >\n        <span class=\"newEntryContent\">\n          {{ newOptionLabel }}\n        </span>\n        <lx-counter class=\"lx-margin-left\" size=\"small\" [content]=\"'common.new' | translate | uppercase\" />\n      </li>\n      <ng-container *ngFor=\"let optionGroup of optionGroups; let groupIndex = index; trackBy: trackByLabel\">\n        <li>\n          <div class=\"groupLabel\" *ngIf=\"optionGroup.label\">\n            <span>{{ optionGroup.label | uppercase }}</span>\n          </div>\n          <ul>\n            <ng-container *ngIf=\"showNoResultsIfGroupIsEmpty && optionGroup.options.length === 0; else options\">\n              <li class=\"noResult\">\n                <ng-container *ngIf=\"noResultsOptionTemplateRef; else defaultText\">\n                  <ng-container *ngTemplateOutlet=\"noResultsOptionTemplateRef; context: { group: optionGroup, groupIndex: groupIndex }\" />\n                </ng-container>\n                <ng-template #defaultText>\n                  <span>{{ NAME + '.noResults' | translate }}</span>\n                </ng-template>\n              </li>\n            </ng-container>\n            <ng-template #options>\n              <li\n                *ngFor=\"let option of optionGroup.options; let index = index; trackBy: trackByValue\"\n                lxSelectableItem\n                [scrollInContainer]=\"keyboardSelectContainer\"\n                #item\n                class=\"option\"\n                (click)=\"selectOption(option)\"\n                (select)=\"selectOption(option)\"\n                [class.highlighted]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n              >\n                <ng-container *ngIf=\"optionTemplateRef; else basicDropdownOption\">\n                  <ng-container\n                    *ngTemplateOutlet=\"optionTemplateRef; context: { $implicit: option, index: index, groupIndex: groupIndex }\"\n                  />\n                </ng-container>\n                <ng-template #basicDropdownOption>\n                  <lx-basic-dropdown-item [label]=\"option.label\" labelFontWeight=\"normal\" [highlightTerm]=\"highlightTerm\" />\n                </ng-template>\n              </li>\n            </ng-template>\n          </ul>\n        </li>\n      </ng-container>\n      <lx-spinner *ngIf=\"loading\" [fadeBackground]=\"true\" />\n    </ul>\n  </div>\n</ng-template>\n", styles: [":host{display:block}.overlayDropdown{width:100%;background:#fff;border-radius:3px;border-left:solid 1px #e1e5eb;border-right:solid 1px #e1e5eb;margin:0 -1px;width:calc(100% + 2px)}.overlayDropdown:not(.top){box-shadow:0 6px 6px #21252933;border-top:0;border-bottom:solid 1px #e1e5eb;border-top-left-radius:0;border-top-right-radius:0}.overlayDropdown.top{box-shadow:0 -4px 6px #21252933;border-top:solid 1px #e1e5eb;border-bottom:0;border-bottom-left-radius:0;border-bottom-right-radius:0}.scrollingPanel{overflow-y:auto;max-height:400px}.groupLabel{line-height:23px;padding:4px 12px;color:#61779d;letter-spacing:.5px;font-weight:700;text-transform:uppercase;cursor:default}ul{list-style:none;margin:0;padding:0}ul:not(:last-child){border-bottom:solid 1px #eaedf1}.noResult{display:block;padding:4px 12px}.option{cursor:pointer;display:block;padding:4px 12px}.option:hover{background-color:#e1e5eb!important}.option.highlighted{background:#eaedf1}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: InfiniteScrollModule }, { kind: "directive", type: i1$4.InfiniteScrollDirective, selector: "[infiniteScroll], [infinite-scroll], [data-infinite-scroll]", inputs: ["infiniteScrollDistance", "infiniteScrollUpDistance", "infiniteScrollThrottle", "infiniteScrollDisabled", "infiniteScrollContainer", "scrollWindow", "immediateCheck", "horizontal", "alwaysCallback", "fromRoot"], outputs: ["scrolled", "scrolledUp"] }, { kind: "directive", type: SelectableItemDirective, selector: "[lxSelectableItem]", inputs: ["scrollInContainer", "lxSelectableItem"], outputs: ["select"] }, { kind: "component", type: CounterComponent, selector: "lx-counter", inputs: ["content", "size", "color"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: BasicDropdownItemComponent, selector: "lx-basic-dropdown-item", inputs: ["label", "description", "highlightTerm", "labelFontWeight", "descriptionFontStyle", "descriptionStyleOptions"] }, { kind: "component", type: SpinnerComponent, selector: "lx-spinner", inputs: ["fadeBackground"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: UpperCasePipe, name: "uppercase" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: OptionGroupDropdownComponent, decorators: [{
             type: Component,
@@ -6538,13 +6504,13 @@ class OptionsDropdownComponent {
         const newEvent = new KeyboardEvent(event.type, newEventOptions);
         this.lxButton?.dispatchEvent(newEvent);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: OptionsDropdownComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.ScrollStrategyOptions }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: OptionsDropdownComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$2.ScrollStrategyOptions }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: OptionsDropdownComponent, isStandalone: true, selector: "lx-options-dropdown", inputs: { align: "align", closeOnScroll: "closeOnScroll", disabled: "disabled", maxHeight: "maxHeight", closeOnSelect: "closeOnSelect", overlayPositioning: "overlayPositioning", dropdownClass: "dropdownClass", isFlexEnabledTriggerContainer: "isFlexEnabledTriggerContainer" }, outputs: { opened: "opened", closed: "closed", closedWithoutSelection: "closedWithoutSelection" }, host: { properties: { "style.display": "this.displayStyle" } }, queries: [{ propertyName: "trigger", first: true, predicate: KeyboardActionSourceDirective, descendants: true }, { propertyName: "_options", predicate: OptionComponent, descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"!overlayPositioning\">\n  <div lxAutoclose (autoclose)=\"closeDropdown()\">\n    <div class=\"triggerContainer\" [ngClass]=\"{ flexDisplay: isFlexEnabledTriggerContainer }\" (click)=\"toggleOpen()\">\n      <ng-container [ngTemplateOutlet]=\"triggerTemplate\" />\n    </div>\n    <ng-container [ngTemplateOutlet]=\"dropdownTemplate\" />\n  </div>\n</ng-container>\n\n<ng-container *ngIf=\"overlayPositioning\">\n  <div class=\"overlayOrigin triggerContainer\" (click)=\"toggleOpen()\" cdkOverlayOrigin #selectOrigin=\"cdkOverlayOrigin\">\n    <ng-container [ngTemplateOutlet]=\"triggerTemplate\" />\n  </div>\n  <ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOrigin]=\"selectOrigin\"\n    [cdkConnectedOverlayScrollStrategy]=\"overlayScrollStrategy\"\n    [cdkConnectedOverlayOpen]=\"open\"\n    [cdkConnectedOverlayPositions]=\"overlayPositions\"\n    (overlayOutsideClick)=\"closeDropdown(); closedWithoutSelection.emit()\"\n  >\n    <div class=\"overlayDropdown\">\n      <ng-container [ngTemplateOutlet]=\"dropdownTemplate\" />\n    </div>\n  </ng-template>\n</ng-container>\n\n<ng-template #triggerTemplate>\n  <ng-content select=\"[lxKeyboardActionSource]\" />\n</ng-template>\n\n<ng-template #dropdownTemplate>\n  <ul\n    *ngIf=\"open\"\n    [id]=\"listboxId\"\n    [class]=\"dropdownClass\"\n    [class.left]=\"align === 'left'\"\n    [class.showScrollbar]=\"maxHeight !== 'none'\"\n    [style.max-height]=\"maxHeight\"\n    role=\"listbox\"\n    tabindex=\"-1\"\n    [attr.aria-owns]=\"optionIds.join(' ')\"\n  >\n    <ng-content />\n  </ul>\n</ng-template>\n", styles: [":host{position:relative}.overlayDropdown ul{position:static}ul{position:absolute;background-color:#fff;border-radius:3px;box-shadow:0 8px 12px 2px #00000026;border:solid 1px #e1e5eb;text-align:left;list-style:none;margin:0;padding-left:0;z-index:20;white-space:nowrap}ul::-webkit-scrollbar{width:.5em;height:.5em;background-color:transparent}ul::-webkit-scrollbar-thumb{background-color:#c2c9d6;border-radius:6px}ul::-webkit-scrollbar-track-piece{background-color:transparent}ul.left{right:0;padding-right:0}ul.showScrollbar{overflow-y:auto}.triggerContainer{display:inline-block}.flexDisplay{display:flex}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: AutocloseDirective, selector: "[lxAutoclose]", inputs: ["autocloseGroup"], outputs: ["autoclose"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: OptionsDropdownComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lx-options-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgIf, NgTemplateOutlet, NgClass, CdkOverlayOrigin, CdkConnectedOverlay, AutocloseDirective], template: "<ng-container *ngIf=\"!overlayPositioning\">\n  <div lxAutoclose (autoclose)=\"closeDropdown()\">\n    <div class=\"triggerContainer\" [ngClass]=\"{ flexDisplay: isFlexEnabledTriggerContainer }\" (click)=\"toggleOpen()\">\n      <ng-container [ngTemplateOutlet]=\"triggerTemplate\" />\n    </div>\n    <ng-container [ngTemplateOutlet]=\"dropdownTemplate\" />\n  </div>\n</ng-container>\n\n<ng-container *ngIf=\"overlayPositioning\">\n  <div class=\"overlayOrigin triggerContainer\" (click)=\"toggleOpen()\" cdkOverlayOrigin #selectOrigin=\"cdkOverlayOrigin\">\n    <ng-container [ngTemplateOutlet]=\"triggerTemplate\" />\n  </div>\n  <ng-template\n    cdkConnectedOverlay\n    [cdkConnectedOverlayOrigin]=\"selectOrigin\"\n    [cdkConnectedOverlayScrollStrategy]=\"overlayScrollStrategy\"\n    [cdkConnectedOverlayOpen]=\"open\"\n    [cdkConnectedOverlayPositions]=\"overlayPositions\"\n    (overlayOutsideClick)=\"closeDropdown(); closedWithoutSelection.emit()\"\n  >\n    <div class=\"overlayDropdown\">\n      <ng-container [ngTemplateOutlet]=\"dropdownTemplate\" />\n    </div>\n  </ng-template>\n</ng-container>\n\n<ng-template #triggerTemplate>\n  <ng-content select=\"[lxKeyboardActionSource]\" />\n</ng-template>\n\n<ng-template #dropdownTemplate>\n  <ul\n    *ngIf=\"open\"\n    [id]=\"listboxId\"\n    [class]=\"dropdownClass\"\n    [class.left]=\"align === 'left'\"\n    [class.showScrollbar]=\"maxHeight !== 'none'\"\n    [style.max-height]=\"maxHeight\"\n    role=\"listbox\"\n    tabindex=\"-1\"\n    [attr.aria-owns]=\"optionIds.join(' ')\"\n  >\n    <ng-content />\n  </ul>\n</ng-template>\n", styles: [":host{position:relative}.overlayDropdown ul{position:static}ul{position:absolute;background-color:#fff;border-radius:3px;box-shadow:0 8px 12px 2px #00000026;border:solid 1px #e1e5eb;text-align:left;list-style:none;margin:0;padding-left:0;z-index:20;white-space:nowrap}ul::-webkit-scrollbar{width:.5em;height:.5em;background-color:transparent}ul::-webkit-scrollbar-thumb{background-color:#c2c9d6;border-radius:6px}ul::-webkit-scrollbar-track-piece{background-color:transparent}ul.left{right:0;padding-right:0}ul.showScrollbar{overflow-y:auto}.triggerContainer{display:inline-block}.flexDisplay{display:flex}\n"] }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$1.ScrollStrategyOptions }, { type: i0.Renderer2 }], propDecorators: { align: [{
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$2.ScrollStrategyOptions }, { type: i0.Renderer2 }], propDecorators: { align: [{
                 type: Input
             }], closeOnScroll: [{
                 type: Input
@@ -6728,13 +6694,13 @@ class PickerOptionComponent {
     selectOption() {
         this.select.emit(this.value);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: PickerOptionComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$2.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: PickerOptionComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: PickerOptionComponent, isStandalone: true, selector: "li[lx-picker-option]", inputs: { optionId: "optionId", ariaLabel: "ariaLabel", value: "value", selected: "selected", isClearOption: "isClearOption" }, outputs: { select: "select" }, host: { listeners: { "click": "manageClickEvents()" }, properties: { "attr.role": "this.role", "attr.aria-selected": "this.ariaSelected", "attr.aria-label": "this.ariaLabelValue", "attr.title": "this.titleValue", "id": "this.id", "class.selected": "this.selected", "class.clearOption": "this.isClearOption", "class.highlighted": "this.highlighted" } }, ngImport: i0, template: "<lx-icon *ngIf=\"isClearOption\" name=\"slash\" color=\"#d8d8d8\" />\n<ng-content *ngIf=\"!isClearOption\" />\n", styles: [":host{display:inline-block;cursor:pointer;width:35px;height:35px;line-height:35px;text-align:center;border:1px solid transparent;border-radius:3px}:host.clearOption{border:1px solid #cfd5df}:host.highlighted,:host.selected{border:1px solid #b2bccc;cursor:default}:host:hover{border:1px solid #b2bccc}:host:focus{outline:0}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconComponent, selector: "lx-icon", inputs: ["name", "color", "fontAwsomeStyle", "size", "title"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: PickerOptionComponent, decorators: [{
             type: Component,
             args: [{ selector: 'li[lx-picker-option]', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgIf, IconComponent], template: "<lx-icon *ngIf=\"isClearOption\" name=\"slash\" color=\"#d8d8d8\" />\n<ng-content *ngIf=\"!isClearOption\" />\n", styles: [":host{display:inline-block;cursor:pointer;width:35px;height:35px;line-height:35px;text-align:center;border:1px solid transparent;border-radius:3px}:host.clearOption{border:1px solid #cfd5df}:host.highlighted,:host.selected{border:1px solid #b2bccc;cursor:default}:host:hover{border:1px solid #b2bccc}:host:focus{outline:0}\n"] }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$2.TranslateService }], propDecorators: { role: [{
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$1.TranslateService }], propDecorators: { role: [{
                 type: HostBinding,
                 args: ['attr.role']
             }], ariaSelected: [{
@@ -7667,7 +7633,7 @@ class SortingDropdownComponent {
         return `sorting.${key}.label`;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SortingDropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: SortingDropdownComponent, isStandalone: true, selector: "lx-sorting-dropdown", inputs: { currentSorting: "currentSorting", sortingOptions: "sortingOptions", showDirectionOptions: "showDirectionOptions" }, outputs: { apply: "apply" }, ngImport: i0, template: "<lx-options-dropdown *ngIf=\"currentSorting\">\n  <lx-sorting-dropdown-trigger\n    lxKeyboardActionSource\n    [label]=\"NAME + '.sortBy' | translate\"\n    [currentSortingLabel]=\"getSortLabel(currentSorting.key) | translate\"\n  />\n  <lx-option-group (select)=\"applySortingMode($event)\">\n    <lx-option *ngFor=\"let option of sortingOptions\" [value]=\"option\" [selected]=\"option.key === currentSorting.key\">\n      {{ option?.key ? (getSortLabel(option.key) | translate) : '' }}\n    </lx-option>\n  </lx-option-group>\n  <lx-option-group *ngIf=\"showDirectionOptions\" (select)=\"applySortingDirection($event)\">\n    <lx-option *ngFor=\"let sortDirection of sortingDirections\" [value]=\"sortDirection\" [selected]=\"sortDirection === currentSorting.order\">\n      {{ 'sorting.' + currentSorting.key + '.' + sortDirection | translate }}\n    </lx-option>\n  </lx-option-group>\n</lx-options-dropdown>\n", styles: [""], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: OptionsDropdownComponent, selector: "lx-options-dropdown", inputs: ["align", "closeOnScroll", "disabled", "maxHeight", "closeOnSelect", "overlayPositioning", "dropdownClass", "isFlexEnabledTriggerContainer"], outputs: ["opened", "closed", "closedWithoutSelection"] }, { kind: "component", type: SortingDropdownTriggerComponent, selector: "lx-sorting-dropdown-trigger", inputs: ["label", "currentSortingLabel", "disabled"] }, { kind: "directive", type: KeyboardActionSourceDirective, selector: "[lxKeyboardActionSource]", exportAs: ["keyboardActionSource"] }, { kind: "component", type: OptionGroupComponent, selector: "lx-option-group", inputs: ["hasSelectedState", "label"], outputs: ["select"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: OptionComponent, selector: "lx-option", inputs: ["selected", "isHighlighted", "disabled", "value", "hasSelectedState", "selectIcon"], outputs: ["select", "highlight", "selectedClick", "keyDownAction"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: SortingDropdownComponent, isStandalone: true, selector: "lx-sorting-dropdown", inputs: { currentSorting: "currentSorting", sortingOptions: "sortingOptions", showDirectionOptions: "showDirectionOptions" }, outputs: { apply: "apply" }, ngImport: i0, template: "<lx-options-dropdown *ngIf=\"currentSorting\">\n  <lx-sorting-dropdown-trigger\n    lxKeyboardActionSource\n    [label]=\"NAME + '.sortBy' | translate\"\n    [currentSortingLabel]=\"getSortLabel(currentSorting.key) | translate\"\n  />\n  <lx-option-group (select)=\"applySortingMode($event)\">\n    <lx-option *ngFor=\"let option of sortingOptions\" [value]=\"option\" [selected]=\"option.key === currentSorting.key\">\n      {{ option?.key ? (getSortLabel(option.key) | translate) : '' }}\n    </lx-option>\n  </lx-option-group>\n  <lx-option-group *ngIf=\"showDirectionOptions\" (select)=\"applySortingDirection($event)\">\n    <lx-option *ngFor=\"let sortDirection of sortingDirections\" [value]=\"sortDirection\" [selected]=\"sortDirection === currentSorting.order\">\n      {{ 'sorting.' + currentSorting.key + '.' + sortDirection | translate }}\n    </lx-option>\n  </lx-option-group>\n</lx-options-dropdown>\n", styles: [""], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: OptionsDropdownComponent, selector: "lx-options-dropdown", inputs: ["align", "closeOnScroll", "disabled", "maxHeight", "closeOnSelect", "overlayPositioning", "dropdownClass", "isFlexEnabledTriggerContainer"], outputs: ["opened", "closed", "closedWithoutSelection"] }, { kind: "component", type: SortingDropdownTriggerComponent, selector: "lx-sorting-dropdown-trigger", inputs: ["label", "currentSortingLabel", "disabled"] }, { kind: "directive", type: KeyboardActionSourceDirective, selector: "[lxKeyboardActionSource]", exportAs: ["keyboardActionSource"] }, { kind: "component", type: OptionGroupComponent, selector: "lx-option-group", inputs: ["hasSelectedState", "label"], outputs: ["select"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: OptionComponent, selector: "lx-option", inputs: ["selected", "isHighlighted", "disabled", "value", "hasSelectedState", "selectIcon"], outputs: ["select", "highlight", "selectedClick", "keyDownAction"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SortingDropdownComponent, decorators: [{
             type: Component,
@@ -7949,7 +7915,7 @@ class FormErrorDirective {
             this.ref.instance.dynamicErrorMessage.set('');
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: FormErrorDirective, deps: [{ token: i0.ViewContainerRef }, { token: i0.ComponentFactoryResolver }, { token: i1$2.TranslateService }, { token: i0.DestroyRef }, { token: i1$5.NgControl, optional: true, self: true }, { token: FormSubmitDirective, host: true, optional: true }, { token: FORM_CONTROL_ERROR_NAMESPACE, optional: true }, { token: FORM_CONTROL_ERROR_DISPLAY_STRATEGY, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: FormErrorDirective, deps: [{ token: i0.ViewContainerRef }, { token: i0.ComponentFactoryResolver }, { token: i1$1.TranslateService }, { token: i0.DestroyRef }, { token: i1$5.NgControl, optional: true, self: true }, { token: FormSubmitDirective, host: true, optional: true }, { token: FORM_CONTROL_ERROR_NAMESPACE, optional: true }, { token: FORM_CONTROL_ERROR_DISPLAY_STRATEGY, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
     static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.8", type: FormErrorDirective, isStandalone: true, selector: "[lxFormError]", inputs: { ctrl: ["lxFormError", "ctrl"], controlName: "controlName" }, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: FormErrorDirective, decorators: [{
@@ -7958,7 +7924,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
                     selector: '[lxFormError]',
                     standalone: true
                 }]
-        }], ctorParameters: () => [{ type: i0.ViewContainerRef }, { type: i0.ComponentFactoryResolver }, { type: i1$2.TranslateService }, { type: i0.DestroyRef }, { type: i1$5.NgControl, decorators: [{
+        }], ctorParameters: () => [{ type: i0.ViewContainerRef }, { type: i0.ComponentFactoryResolver }, { type: i1$1.TranslateService }, { type: i0.DestroyRef }, { type: i1$5.NgControl, decorators: [{
                     type: Optional
                 }, {
                     type: Self
@@ -8106,7 +8072,7 @@ class LxFormsModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: LxFormsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
     static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.8", ngImport: i0, type: LxFormsModule, imports: [CommonModule,
             FormsModule,
-            ReactiveFormsModule, i1$2.TranslateModule, DatepickerUiModule, InfiniteScrollModule,
+            ReactiveFormsModule, i1$1.TranslateModule, DatepickerUiModule, InfiniteScrollModule,
             ClipboardModule,
             OverlayModule,
             LxDragAndDropListModule,
@@ -8701,8 +8667,8 @@ class ModalComponent {
     trapFocusInModal(hostElement) {
         this.focusTrap.create(hostElement);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ModalComponent, deps: [{ token: i1$1.Overlay }, { token: i0.Renderer2 }, { token: MODAL_CLOSE, optional: true }, { token: i2.ConfigurableFocusTrapFactory }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: ModalComponent, isStandalone: true, selector: "lx-modal", inputs: { open: "open", showCloseButton: "showCloseButton", showBackButton: "showBackButton", verticalScroll: "verticalScroll", size: "size", minWidth: "minWidth", isFocusTrap: "isFocusTrap", canModalBeClosed: "canModalBeClosed" }, outputs: { close: "close", back: "back" }, host: { listeners: { "document:keydown.escape": "onEscape()" } }, queries: [{ propertyName: "header", first: true, predicate: ModalHeaderComponent, descendants: true }, { propertyName: "footer", first: true, predicate: ModalFooterComponent, descendants: true }, { propertyName: "explicitContent", first: true, predicate: ModalContentDirective, descendants: true, read: TemplateRef, static: true }], viewQueries: [{ propertyName: "cdkPortal", first: true, predicate: CdkPortal, descendants: true, static: true }, { propertyName: "implicitContent", first: true, predicate: ["implicitContent"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<ng-template cdkPortal>\n  <div\n    *ngIf=\"open\"\n    role=\"dialog\"\n    class=\"lxmodal\"\n    [class.lxmodal--fullscreen]=\"size === 'fullscreen'\"\n    [class.lxmodal--dialog]=\"size === 'dialog'\"\n    [class.lxmodal--dialog-large]=\"size === 'dialog-large'\"\n    [class.lxmodal--withFooter]=\"!!footer\"\n    [class.lxmodal--verticalScroll]=\"verticalScroll\"\n    @modal\n  >\n    <div\n      *ngIf=\"size === 'fullscreen' && showBackButton\"\n      (click)=\"emitBack()\"\n      (keyup.enter)=\"emitBack()\"\n      tabindex=\"0\"\n      role=\"button\"\n      class=\"fal fa-long-arrow-left\"\n    ></div>\n    <button\n      *ngIf=\"showCloseButton\"\n      (click)=\"closeModal(closeLocation.CloseButton)\"\n      [attr.aria-label]=\"NAME + '.close' | translate\"\n      class=\"fal fa-times closeButton\"\n    ></button>\n    <ng-content *ngIf=\"header\" select=\"lx-modal-header\" />\n    <div class=\"modalContentContainer\" [class.lxThinScrollbar]=\"verticalScroll\">\n      <ng-container *ngTemplateOutlet=\"content\" />\n    </div>\n    <ng-content *ngIf=\"footer\" select=\"lx-modal-footer\" />\n  </div>\n</ng-template>\n<ng-template #implicitContent>\n  <ng-content />\n</ng-template>\n", styles: ["@keyframes subtleScaleUpKeyFrames{0%{transform:scale(.95);opacity:0}}.lxmodal{background:#fff;width:100%}.lxmodal--withFooter.lxmodal--fullscreen.lxmodal--verticalScroll .modalContentContainer{overflow-y:auto;padding:16px}.lxmodal--withFooter.lxmodal--fullscreen:not(.lxmodal--verticalScroll) .modalContentContainer{bottom:70px;overflow:hidden}.lxmodal--verticalScroll .modalContentContainer{overflow-y:auto;padding:16px}.lxmodal--fullscreen{height:100%;display:flex;flex-direction:column}.lxmodal--fullscreen .closeButton{border:0;background:transparent;position:absolute;text-align:center;transition:color,background-color .18s;transition-delay:.1s;transition-timing-function:ease;border-radius:50%;color:#61779d;font-size:26px;width:48px;height:48px;line-height:48px;right:36px;top:12px;z-index:1}.lxmodal--fullscreen .closeButton:before{cursor:pointer}.lxmodal--fullscreen .closeButton:hover,.lxmodal--fullscreen .closeButton:focus{color:#526179;background-color:#eaedf1}.lxmodal--fullscreen .closeButton:focus{outline:0}.lxmodal--fullscreen .fa-long-arrow-left{border:0;background:transparent;position:absolute;text-align:center;transition:color,background-color .18s;transition-delay:.1s;transition-timing-function:ease;border-radius:50%;color:#61779d;font-size:26px;width:48px;height:48px;line-height:48px;left:36px;top:16px}.lxmodal--fullscreen .fa-long-arrow-left:before{cursor:pointer}.lxmodal--fullscreen .fa-long-arrow-left:hover,.lxmodal--fullscreen .fa-long-arrow-left:focus{color:#526179;background-color:#eaedf1}.lxmodal--fullscreen .fa-long-arrow-left:focus{outline:0}.lxmodal--dialog,.lxmodal--dialog-large{display:block;position:relative;border-radius:6px;box-shadow:0 8px 20px #0000003d}.lxmodal--dialog .modalContentContainer,.lxmodal--dialog-large .modalContentContainer{position:relative}.lxmodal--dialog .closeButton,.lxmodal--dialog-large .closeButton{border:0;background:transparent;position:absolute;text-align:center;transition:color,background-color .18s;transition-delay:.1s;transition-timing-function:ease;border-radius:50%;color:#61779d;font-size:26px;height:32px;width:32px;z-index:999;right:10px;top:20px}.lxmodal--dialog .closeButton:before,.lxmodal--dialog-large .closeButton:before{cursor:pointer}.lxmodal--dialog .closeButton:hover,.lxmodal--dialog .closeButton:focus,.lxmodal--dialog-large .closeButton:hover,.lxmodal--dialog-large .closeButton:focus{color:#526179;background-color:#eaedf1}.lxmodal--dialog .closeButton:focus,.lxmodal--dialog-large .closeButton:focus{outline:0}.lxmodal--dialog .modalContentContainer{padding:16px 16px 0}.lxmodal--dialog.lxmodal--verticalScroll .modalContentContainer{padding:16px;max-height:calc(84vh - 136px)}.lxmodal--dialog-large .modalContentContainer{padding:16px;height:calc(100% - 136px)}.modalContentContainer{flex:1}\n"], dependencies: [{ kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i3.CdkPortal, selector: "[cdkPortal]", exportAs: ["cdkPortal"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }], animations: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ModalComponent, deps: [{ token: i1$2.Overlay }, { token: i0.Renderer2 }, { token: MODAL_CLOSE, optional: true }, { token: i2.ConfigurableFocusTrapFactory }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: ModalComponent, isStandalone: true, selector: "lx-modal", inputs: { open: "open", showCloseButton: "showCloseButton", showBackButton: "showBackButton", verticalScroll: "verticalScroll", size: "size", minWidth: "minWidth", isFocusTrap: "isFocusTrap", canModalBeClosed: "canModalBeClosed" }, outputs: { close: "close", back: "back" }, host: { listeners: { "document:keydown.escape": "onEscape()" } }, queries: [{ propertyName: "header", first: true, predicate: ModalHeaderComponent, descendants: true }, { propertyName: "footer", first: true, predicate: ModalFooterComponent, descendants: true }, { propertyName: "explicitContent", first: true, predicate: ModalContentDirective, descendants: true, read: TemplateRef, static: true }], viewQueries: [{ propertyName: "cdkPortal", first: true, predicate: CdkPortal, descendants: true, static: true }, { propertyName: "implicitContent", first: true, predicate: ["implicitContent"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<ng-template cdkPortal>\n  <div\n    *ngIf=\"open\"\n    role=\"dialog\"\n    class=\"lxmodal\"\n    [class.lxmodal--fullscreen]=\"size === 'fullscreen'\"\n    [class.lxmodal--dialog]=\"size === 'dialog'\"\n    [class.lxmodal--dialog-large]=\"size === 'dialog-large'\"\n    [class.lxmodal--withFooter]=\"!!footer\"\n    [class.lxmodal--verticalScroll]=\"verticalScroll\"\n    @modal\n  >\n    <div\n      *ngIf=\"size === 'fullscreen' && showBackButton\"\n      (click)=\"emitBack()\"\n      (keyup.enter)=\"emitBack()\"\n      tabindex=\"0\"\n      role=\"button\"\n      class=\"fal fa-long-arrow-left\"\n    ></div>\n    <button\n      *ngIf=\"showCloseButton\"\n      (click)=\"closeModal(closeLocation.CloseButton)\"\n      [attr.aria-label]=\"NAME + '.close' | translate\"\n      class=\"fal fa-times closeButton\"\n    ></button>\n    <ng-content *ngIf=\"header\" select=\"lx-modal-header\" />\n    <div class=\"modalContentContainer\" [class.lxThinScrollbar]=\"verticalScroll\">\n      <ng-container *ngTemplateOutlet=\"content\" />\n    </div>\n    <ng-content *ngIf=\"footer\" select=\"lx-modal-footer\" />\n  </div>\n</ng-template>\n<ng-template #implicitContent>\n  <ng-content />\n</ng-template>\n", styles: ["@keyframes subtleScaleUpKeyFrames{0%{transform:scale(.95);opacity:0}}.lxmodal{background:#fff;width:100%}.lxmodal--withFooter.lxmodal--fullscreen.lxmodal--verticalScroll .modalContentContainer{overflow-y:auto;padding:16px}.lxmodal--withFooter.lxmodal--fullscreen:not(.lxmodal--verticalScroll) .modalContentContainer{bottom:70px;overflow:hidden}.lxmodal--verticalScroll .modalContentContainer{overflow-y:auto;padding:16px}.lxmodal--fullscreen{height:100%;display:flex;flex-direction:column}.lxmodal--fullscreen .closeButton{border:0;background:transparent;position:absolute;text-align:center;transition:color,background-color .18s;transition-delay:.1s;transition-timing-function:ease;border-radius:50%;color:#61779d;font-size:26px;width:48px;height:48px;line-height:48px;right:36px;top:12px;z-index:1}.lxmodal--fullscreen .closeButton:before{cursor:pointer}.lxmodal--fullscreen .closeButton:hover,.lxmodal--fullscreen .closeButton:focus{color:#526179;background-color:#eaedf1}.lxmodal--fullscreen .closeButton:focus{outline:0}.lxmodal--fullscreen .fa-long-arrow-left{border:0;background:transparent;position:absolute;text-align:center;transition:color,background-color .18s;transition-delay:.1s;transition-timing-function:ease;border-radius:50%;color:#61779d;font-size:26px;width:48px;height:48px;line-height:48px;left:36px;top:16px}.lxmodal--fullscreen .fa-long-arrow-left:before{cursor:pointer}.lxmodal--fullscreen .fa-long-arrow-left:hover,.lxmodal--fullscreen .fa-long-arrow-left:focus{color:#526179;background-color:#eaedf1}.lxmodal--fullscreen .fa-long-arrow-left:focus{outline:0}.lxmodal--dialog,.lxmodal--dialog-large{display:block;position:relative;border-radius:6px;box-shadow:0 8px 20px #0000003d}.lxmodal--dialog .modalContentContainer,.lxmodal--dialog-large .modalContentContainer{position:relative}.lxmodal--dialog .closeButton,.lxmodal--dialog-large .closeButton{border:0;background:transparent;position:absolute;text-align:center;transition:color,background-color .18s;transition-delay:.1s;transition-timing-function:ease;border-radius:50%;color:#61779d;font-size:26px;height:32px;width:32px;z-index:999;right:10px;top:20px}.lxmodal--dialog .closeButton:before,.lxmodal--dialog-large .closeButton:before{cursor:pointer}.lxmodal--dialog .closeButton:hover,.lxmodal--dialog .closeButton:focus,.lxmodal--dialog-large .closeButton:hover,.lxmodal--dialog-large .closeButton:focus{color:#526179;background-color:#eaedf1}.lxmodal--dialog .closeButton:focus,.lxmodal--dialog-large .closeButton:focus{outline:0}.lxmodal--dialog .modalContentContainer{padding:16px 16px 0}.lxmodal--dialog.lxmodal--verticalScroll .modalContentContainer{padding:16px;max-height:calc(84vh - 136px)}.lxmodal--dialog-large .modalContentContainer{padding:16px;height:calc(100% - 136px)}.modalContentContainer{flex:1}\n"], dependencies: [{ kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i3.CdkPortal, selector: "[cdkPortal]", exportAs: ["cdkPortal"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], animations: [
             trigger('modal', [
                 transition(':enter', [style({ opacity: 0 }), animate('0.15s', style({ opacity: 1 }))]),
                 transition(':leave', animate('0.15s', style({ opacity: 0 })))
@@ -8717,7 +8683,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
                             transition(':leave', animate('0.15s', style({ opacity: 0 })))
                         ])
                     ], standalone: true, imports: [PortalModule, NgIf, NgTemplateOutlet, TranslateModule], template: "<ng-template cdkPortal>\n  <div\n    *ngIf=\"open\"\n    role=\"dialog\"\n    class=\"lxmodal\"\n    [class.lxmodal--fullscreen]=\"size === 'fullscreen'\"\n    [class.lxmodal--dialog]=\"size === 'dialog'\"\n    [class.lxmodal--dialog-large]=\"size === 'dialog-large'\"\n    [class.lxmodal--withFooter]=\"!!footer\"\n    [class.lxmodal--verticalScroll]=\"verticalScroll\"\n    @modal\n  >\n    <div\n      *ngIf=\"size === 'fullscreen' && showBackButton\"\n      (click)=\"emitBack()\"\n      (keyup.enter)=\"emitBack()\"\n      tabindex=\"0\"\n      role=\"button\"\n      class=\"fal fa-long-arrow-left\"\n    ></div>\n    <button\n      *ngIf=\"showCloseButton\"\n      (click)=\"closeModal(closeLocation.CloseButton)\"\n      [attr.aria-label]=\"NAME + '.close' | translate\"\n      class=\"fal fa-times closeButton\"\n    ></button>\n    <ng-content *ngIf=\"header\" select=\"lx-modal-header\" />\n    <div class=\"modalContentContainer\" [class.lxThinScrollbar]=\"verticalScroll\">\n      <ng-container *ngTemplateOutlet=\"content\" />\n    </div>\n    <ng-content *ngIf=\"footer\" select=\"lx-modal-footer\" />\n  </div>\n</ng-template>\n<ng-template #implicitContent>\n  <ng-content />\n</ng-template>\n", styles: ["@keyframes subtleScaleUpKeyFrames{0%{transform:scale(.95);opacity:0}}.lxmodal{background:#fff;width:100%}.lxmodal--withFooter.lxmodal--fullscreen.lxmodal--verticalScroll .modalContentContainer{overflow-y:auto;padding:16px}.lxmodal--withFooter.lxmodal--fullscreen:not(.lxmodal--verticalScroll) .modalContentContainer{bottom:70px;overflow:hidden}.lxmodal--verticalScroll .modalContentContainer{overflow-y:auto;padding:16px}.lxmodal--fullscreen{height:100%;display:flex;flex-direction:column}.lxmodal--fullscreen .closeButton{border:0;background:transparent;position:absolute;text-align:center;transition:color,background-color .18s;transition-delay:.1s;transition-timing-function:ease;border-radius:50%;color:#61779d;font-size:26px;width:48px;height:48px;line-height:48px;right:36px;top:12px;z-index:1}.lxmodal--fullscreen .closeButton:before{cursor:pointer}.lxmodal--fullscreen .closeButton:hover,.lxmodal--fullscreen .closeButton:focus{color:#526179;background-color:#eaedf1}.lxmodal--fullscreen .closeButton:focus{outline:0}.lxmodal--fullscreen .fa-long-arrow-left{border:0;background:transparent;position:absolute;text-align:center;transition:color,background-color .18s;transition-delay:.1s;transition-timing-function:ease;border-radius:50%;color:#61779d;font-size:26px;width:48px;height:48px;line-height:48px;left:36px;top:16px}.lxmodal--fullscreen .fa-long-arrow-left:before{cursor:pointer}.lxmodal--fullscreen .fa-long-arrow-left:hover,.lxmodal--fullscreen .fa-long-arrow-left:focus{color:#526179;background-color:#eaedf1}.lxmodal--fullscreen .fa-long-arrow-left:focus{outline:0}.lxmodal--dialog,.lxmodal--dialog-large{display:block;position:relative;border-radius:6px;box-shadow:0 8px 20px #0000003d}.lxmodal--dialog .modalContentContainer,.lxmodal--dialog-large .modalContentContainer{position:relative}.lxmodal--dialog .closeButton,.lxmodal--dialog-large .closeButton{border:0;background:transparent;position:absolute;text-align:center;transition:color,background-color .18s;transition-delay:.1s;transition-timing-function:ease;border-radius:50%;color:#61779d;font-size:26px;height:32px;width:32px;z-index:999;right:10px;top:20px}.lxmodal--dialog .closeButton:before,.lxmodal--dialog-large .closeButton:before{cursor:pointer}.lxmodal--dialog .closeButton:hover,.lxmodal--dialog .closeButton:focus,.lxmodal--dialog-large .closeButton:hover,.lxmodal--dialog-large .closeButton:focus{color:#526179;background-color:#eaedf1}.lxmodal--dialog .closeButton:focus,.lxmodal--dialog-large .closeButton:focus{outline:0}.lxmodal--dialog .modalContentContainer{padding:16px 16px 0}.lxmodal--dialog.lxmodal--verticalScroll .modalContentContainer{padding:16px;max-height:calc(84vh - 136px)}.lxmodal--dialog-large .modalContentContainer{padding:16px;height:calc(100% - 136px)}.modalContentContainer{flex:1}\n"] }]
-        }], ctorParameters: () => [{ type: i1$1.Overlay }, { type: i0.Renderer2 }, { type: i5.Observable, decorators: [{
+        }], ctorParameters: () => [{ type: i1$2.Overlay }, { type: i0.Renderer2 }, { type: i5.Observable, decorators: [{
                     type: Optional
                 }, {
                     type: Inject,
@@ -8767,7 +8733,7 @@ class LxModalModule {
     static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.8", ngImport: i0, type: LxModalModule, imports: [CommonModule,
             PortalModule,
             OverlayModule,
-            A11yModule, i1$2.TranslateModule, ModalComponent,
+            A11yModule, i1$1.TranslateModule, ModalComponent,
             ModalHeaderComponent,
             ModalFooterComponent,
             ModalContentDirective], exports: [ModalComponent, ModalHeaderComponent, ModalFooterComponent, ModalContentDirective] }); }
@@ -9418,5 +9384,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { ARROW_DOWN, ARROW_LEFT, ARROW_RIGHT, ARROW_UP, AfterViewInitDirective, AutocloseDirective, AutocloseGroupService, AutofocusDirective, BACKSPACE, BadgeComponent, BannerComponent, BaseSelectDirective, BasicDropdownComponent, BasicDropdownItemComponent, BrPipe, BreadcrumbComponent, ButtonComponent, ButtonGroupComponent, CURRENCY_SYMBOL_MAP, CardComponent, CdkOptionsDropdownComponent, CdkOptionsSubDropdownComponent, CollapsibleComponent, ColoredLabelComponent, ContentPanelComponent, ContenteditableDirective, ContrastColorPipe, CounterComponent, CurrencyInputComponent, CurrencySymbolComponent, CustomDatePipe, DATEPICKER_CONTROL_VALUE_ACCESSOR, DATE_FN_LOCALE, DATE_FORMATS, DateFormatter, DateInputComponent, DatePickerComponent, DatepickerConfig, DatepickerUiModule, DragAndDropListComponent, DragAndDropListItemComponent, END, ENTER, ESCAPE, EllipsisComponent, EmptyStateComponent, ErrorMessageComponent, ExpandedDropdownComponent, FORM_CONTROL_ERROR_DISPLAY_STRATEGY, FORM_CONTROL_ERROR_NAMESPACE, FilterSelectionPipe, FilterTermPipe, FormErrorComponent, FormErrorDirective, FormSubmitDirective, FormatNumberPipe, GLOBAL_TRANSLATION_OPTIONS, HOME, HighlightRangePipe, HighlightTermPipe, IconComponent, IconScaleComponent, InputComponent, IntegrationLinkCardComponent, IntegrationLinkCardGroupComponent, KeyboardActionSourceDirective, KeyboardSelectAction, KeyboardSelectDirective, LOCALE_FN, LX_ELLIPSIS_DEBOUNCE_ON_RESIZE, LxCoreUiModule, LxDragAndDropListModule, LxFormsModule, LxIsUuidPipe, LxLinkifyPipe, LxModalModule, LxPopoverUiModule, LxTabUiModule, LxTimeAgo, LxTranslatePipe, LxUnlinkifyPipe, MODAL_CLOSE, MarkInvalidDirective, MarkdownPipe, MaxLengthCounterDirective, ModalCloseClickLocation, ModalComponent, ModalContentDirective, ModalFooterComponent, ModalHeaderComponent, MultiSelectComponent, NbspPipe, OptionComponent, OptionGroupComponent, OptionGroupDropdownComponent, OptionsDropdownComponent, OptionsSubDropdownComponent, PickerComponent, PickerOptionComponent, PickerTriggerDirective, PillItemComponent, PillListComponent, PopoverClickDirective, PopoverComponent, PopoverContentDirective, PopoverHoverDirective, RELEVANCE_SORTING_KEY, ResizeObserverService, ResponsiveInputComponent, SPACE, SelectDropdownDirective, SelectListComponent, SelectableItemDirective, SelectedOptionDirective, SingleSelectComponent, SkeletonComponent, SliderToggleComponent, SortPipe, Sorting, SortingDropdownComponent, SortingDropdownTriggerComponent, SpinnerComponent, StepperComponent, TAB, TabComponent, TabGroupComponent, TableComponent, TableHeaderComponent, TinySpinnerComponent, TokenComponent, TokenizerComponent, TooltipComponent, TooltipDirective, TranslationAfterPipe, TranslationBeforePipe, TranslationBetweenPipe, UnescapeCurlyBracesPipe, ValidateDateInForeseeableFuture, ValidateStringNotInArray, ValidateStringNotInArrayAsync, getContrastColor, getTranslationParts, highlightText, isValidHexColor, isValidX, isValidY, provideFormControlErrorDisplayStrategy, provideFormControlErrorNamespace, shorthandHexHandle };
+export { ARROW_DOWN, ARROW_LEFT, ARROW_RIGHT, ARROW_UP, AfterViewInitDirective, AutocloseDirective, AutocloseGroupService, AutofocusDirective, BACKSPACE, BadgeComponent, BannerComponent, BaseSelectDirective, BasicDropdownComponent, BasicDropdownItemComponent, BrPipe, BreadcrumbComponent, ButtonComponent, ButtonGroupComponent, CURRENCY_SYMBOL_MAP, CardComponent, CdkOptionsDropdownComponent, CdkOptionsSubDropdownComponent, CollapsibleComponent, ContentPanelComponent, ContenteditableDirective, ContrastColorPipe, CounterComponent, CurrencyInputComponent, CurrencySymbolComponent, CustomDatePipe, DATEPICKER_CONTROL_VALUE_ACCESSOR, DATE_FN_LOCALE, DATE_FORMATS, DateFormatter, DateInputComponent, DatePickerComponent, DatepickerConfig, DatepickerUiModule, DragAndDropListComponent, DragAndDropListItemComponent, END, ENTER, ESCAPE, EllipsisComponent, EmptyStateComponent, ErrorMessageComponent, ExpandedDropdownComponent, FORM_CONTROL_ERROR_DISPLAY_STRATEGY, FORM_CONTROL_ERROR_NAMESPACE, FilterSelectionPipe, FilterTermPipe, FormErrorComponent, FormErrorDirective, FormSubmitDirective, FormatNumberPipe, GLOBAL_TRANSLATION_OPTIONS, HOME, HighlightRangePipe, HighlightTermPipe, IconComponent, IconScaleComponent, InputComponent, IntegrationLinkCardComponent, IntegrationLinkCardGroupComponent, KeyboardActionSourceDirective, KeyboardSelectAction, KeyboardSelectDirective, LOCALE_FN, LX_ELLIPSIS_DEBOUNCE_ON_RESIZE, LxCoreUiModule, LxDragAndDropListModule, LxFormsModule, LxIsUuidPipe, LxLinkifyPipe, LxModalModule, LxPopoverUiModule, LxTabUiModule, LxTimeAgo, LxTranslatePipe, LxUnlinkifyPipe, MODAL_CLOSE, MarkInvalidDirective, MarkdownPipe, MaxLengthCounterDirective, ModalCloseClickLocation, ModalComponent, ModalContentDirective, ModalFooterComponent, ModalHeaderComponent, MultiSelectComponent, NbspPipe, OptionComponent, OptionGroupComponent, OptionGroupDropdownComponent, OptionsDropdownComponent, OptionsSubDropdownComponent, PickerComponent, PickerOptionComponent, PickerTriggerDirective, PillItemComponent, PillListComponent, PopoverClickDirective, PopoverComponent, PopoverContentDirective, PopoverHoverDirective, RELEVANCE_SORTING_KEY, ResizeObserverService, ResponsiveInputComponent, SPACE, SelectDropdownDirective, SelectListComponent, SelectableItemDirective, SelectedOptionDirective, SingleSelectComponent, SkeletonComponent, SliderToggleComponent, SortPipe, Sorting, SortingDropdownComponent, SortingDropdownTriggerComponent, SpinnerComponent, StepperComponent, TAB, TabComponent, TabGroupComponent, TableComponent, TableHeaderComponent, TinySpinnerComponent, TokenComponent, TokenizerComponent, TooltipComponent, TooltipDirective, TranslationAfterPipe, TranslationBeforePipe, TranslationBetweenPipe, UnescapeCurlyBracesPipe, ValidateDateInForeseeableFuture, ValidateStringNotInArray, ValidateStringNotInArrayAsync, getContrastColor, getTranslationParts, highlightText, isValidHexColor, isValidX, isValidY, provideFormControlErrorDisplayStrategy, provideFormControlErrorNamespace, shorthandHexHandle };
 //# sourceMappingURL=leanix-components.mjs.map