@biit-solutions/wizardry-theme 1.22.22 → 1.22.24

package/assets/styles/context-menu/base.scss

@@ -16,7 +16,7 @@
   --ngx-contextmenu-outline: 1px solid var(--nav-menu-border-color);
   --ngx-contextmenu-padding: 5px 0;
   --ngx-contextmenu-text-color: var(--nav-menu-font-color);
-  --ngx-contextmenu-text-disabled-color: #var(--nav-menu-font-disabled-color);
+  --ngx-contextmenu-text-disabled-color: var(--nav-menu-font-disabled-color);
   --ngx-contextmenu-max-height: 100vh;
 
   // Styling of context menu items

package/esm2020/button/biit-action-button/biit-action-button.component.mjs

@@ -51,10 +51,10 @@ export class BiitActionButtonComponent {
     }
 }
 BiitActionButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BiitActionButtonComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-BiitActionButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: BiitActionButtonComponent, selector: "biit-action-button", inputs: { position: "position", additionalX: "additionalX", additionalY: "additionalY" }, queries: [{ propertyName: "inputButtons", predicate: BiitIconButtonComponent }], ngImport: i0, template: "<div id=\"fab\" class=\"floating-action-button\" [ngStyle]=\"positionStyle()\" (pointerover)=\"hover = true;\" (pointerleave)=\"hover = false\">\n    <ng-content></ng-content>\n</div>\n", styles: [":root{--main-color: #F20D5E;--popup-background-color: rgba(0, 0, 0, .15);--main-background: #D9D9D9;--body-background: #EDEDED;--light-background: #D7D7D7;--error-color: #A1093F;--warning-color: var(--main-color);--floating-background: white;--main-font-color: white;--secondary-color: #808080;--secondary-text-color: #EDEDED;--secondary-background-color: #808080;--disabled-primary-color: #808080;--disabled-secondary-color: var(--main-color);--component-color: #262626;--active-color: var(--component-color);--hover-color: #EDEDED;--hover-primary-color: var(--main-color);--secondary-button-color: var(--component-color);--secondary-button-background-color: var(--main-font-color);--secondary-button-hover-background: var(--main-background);--secondary-button-active-background: var(--main-background);--quaternary-button-color: var(--main-font-color);--quaternary-button-background-color: var(--error-color);--quaternary-button-hover-background: var(--main-color);--quaternary-button-active-background: var(--main-color);--text-hover-color: #5A6473;--selected-color: #FBAEC9;--chart-background: #FFFFFF;--chart-component-color: var(--component-color);--icon-color: var(--main-color);--table-header-color: var(--component-color);--table-border-color: var(--table-header-color);--table-selected-row-color: var(--main-background);--table-text-color: var(--secondary-text-color);--scrollbar-color: var(--main-color);--menu-button-active: var(--main-color);--disabled-menu-color: #D9D9D9;--disabled-menu-color-hover: #FFFFFF;--nav-menu-hover-color: #70757e;--nav-menu-text-hover-color: var(--text-hover-color);--nav-menu-active-background: var(--hover-color);--nav-menu-disable-font: var(--hover-color);--nav-menu-separator-color: var(--secondary-color);--nav-menu-font-color: var(--nav-menu-hover-color);--nav-menu-font-disabled-color: #8a909a;--nav-menu-background-color: #FFFFFF;--nav-menu-active-color: var(--hover-color);--nav-menu-border-color: rgba(0, 0, 0, .18);--input-text-background: var(--main-background);--input-text-focus-background: var(--main-background);--input-text-hover-background: var(--main-background);--popup-color: var(--component-color);--popup-background: #FFFFFF;--popup-error-color: var(--error-color)}.floating-action-button{box-sizing:border-box;position:fixed;z-index:999;opacity:50%;background:white;border:3px solid var(--component-color);display:flex;flex-direction:column;justify-content:flex-end}.floating-action-button:hover{opacity:100%}.floating-action-button:hover ::ng-deep button:not(:first-child){display:flex}.floating-action-button ::ng-deep button:not(:first-child){display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
+BiitActionButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: BiitActionButtonComponent, selector: "biit-action-button", inputs: { position: "position", additionalX: "additionalX", additionalY: "additionalY" }, queries: [{ propertyName: "inputButtons", predicate: BiitIconButtonComponent }], ngImport: i0, template: "<div id=\"fab\" class=\"floating-action-button\" [ngStyle]=\"positionStyle()\" (pointerover)=\"hover = true;\" (pointerleave)=\"hover = false\">\n    <ng-content></ng-content>\n</div>\n", styles: [":root{--main-color: #F20D5E;--popup-background-color: rgba(0, 0, 0, .15);--main-background: #D9D9D9;--body-background: #EDEDED;--light-background: #D7D7D7;--error-color: #A1093F;--warning-color: var(--main-color);--floating-background: white;--main-font-color: white;--secondary-color: #808080;--secondary-text-color: #EDEDED;--secondary-background-color: #808080;--disabled-primary-color: #808080;--disabled-secondary-color: var(--main-color);--component-color: #262626;--active-color: var(--component-color);--hover-color: #EDEDED;--hover-primary-color: var(--main-color);--secondary-button-color: var(--component-color);--secondary-button-background-color: var(--main-font-color);--secondary-button-hover-background: var(--main-background);--secondary-button-active-background: var(--main-background);--quaternary-button-color: var(--main-font-color);--quaternary-button-background-color: var(--error-color);--quaternary-button-hover-background: var(--main-color);--quaternary-button-active-background: var(--main-color);--text-hover-color: #5A6473;--selected-color: #FBAEC9;--chart-background: #FFFFFF;--chart-component-color: var(--component-color);--icon-color: var(--main-color);--table-header-color: var(--component-color);--table-header-text: var(--main-background);--table-background-color: var(--chart-background);--table-hover-background-color: var(--chart-background);--table-border-color: var(--table-header-color);--table-selected-row-color: var(--main-background);--table-text-color: var(--secondary-text-color);--table-active-row-backgorund-color: var(--main-background);--scrollbar-color: var(--main-color);--menu-button-active: var(--main-color);--disabled-menu-color: #D9D9D9;--disabled-menu-color-hover: #FFFFFF;--nav-menu-hover-color: #70757e;--nav-menu-text-hover-color: var(--text-hover-color);--nav-menu-active-background: var(--hover-color);--nav-menu-disable-font: var(--hover-color);--nav-menu-separator-color: var(--secondary-color);--nav-menu-font-color: var(--nav-menu-hover-color);--nav-menu-font-disabled-color: #8a909a;--nav-menu-background-color: #FFFFFF;--nav-menu-active-color: var(--hover-color);--nav-menu-border-color: rgba(0, 0, 0, .18);--input-text-background: var(--main-background);--input-text-focus-background: var(--main-background);--input-text-hover-background: var(--main-background);--popup-color: var(--component-color);--popup-background: #FFFFFF;--popup-error-color: var(--error-color);--popup-close-button: var(--main-color)}.floating-action-button{box-sizing:border-box;position:fixed;z-index:999;opacity:50%;background:white;border:3px solid var(--component-color);display:flex;flex-direction:column;justify-content:flex-end}.floating-action-button:hover{opacity:100%}.floating-action-button:hover ::ng-deep button:not(:first-child){display:flex}.floating-action-button ::ng-deep button:not(:first-child){display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BiitActionButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'biit-action-button', template: "<div id=\"fab\" class=\"floating-action-button\" [ngStyle]=\"positionStyle()\" (pointerover)=\"hover = true;\" (pointerleave)=\"hover = false\">\n    <ng-content></ng-content>\n</div>\n", styles: [":root{--main-color: #F20D5E;--popup-background-color: rgba(0, 0, 0, .15);--main-background: #D9D9D9;--body-background: #EDEDED;--light-background: #D7D7D7;--error-color: #A1093F;--warning-color: var(--main-color);--floating-background: white;--main-font-color: white;--secondary-color: #808080;--secondary-text-color: #EDEDED;--secondary-background-color: #808080;--disabled-primary-color: #808080;--disabled-secondary-color: var(--main-color);--component-color: #262626;--active-color: var(--component-color);--hover-color: #EDEDED;--hover-primary-color: var(--main-color);--secondary-button-color: var(--component-color);--secondary-button-background-color: var(--main-font-color);--secondary-button-hover-background: var(--main-background);--secondary-button-active-background: var(--main-background);--quaternary-button-color: var(--main-font-color);--quaternary-button-background-color: var(--error-color);--quaternary-button-hover-background: var(--main-color);--quaternary-button-active-background: var(--main-color);--text-hover-color: #5A6473;--selected-color: #FBAEC9;--chart-background: #FFFFFF;--chart-component-color: var(--component-color);--icon-color: var(--main-color);--table-header-color: var(--component-color);--table-border-color: var(--table-header-color);--table-selected-row-color: var(--main-background);--table-text-color: var(--secondary-text-color);--scrollbar-color: var(--main-color);--menu-button-active: var(--main-color);--disabled-menu-color: #D9D9D9;--disabled-menu-color-hover: #FFFFFF;--nav-menu-hover-color: #70757e;--nav-menu-text-hover-color: var(--text-hover-color);--nav-menu-active-background: var(--hover-color);--nav-menu-disable-font: var(--hover-color);--nav-menu-separator-color: var(--secondary-color);--nav-menu-font-color: var(--nav-menu-hover-color);--nav-menu-font-disabled-color: #8a909a;--nav-menu-background-color: #FFFFFF;--nav-menu-active-color: var(--hover-color);--nav-menu-border-color: rgba(0, 0, 0, .18);--input-text-background: var(--main-background);--input-text-focus-background: var(--main-background);--input-text-hover-background: var(--main-background);--popup-color: var(--component-color);--popup-background: #FFFFFF;--popup-error-color: var(--error-color)}.floating-action-button{box-sizing:border-box;position:fixed;z-index:999;opacity:50%;background:white;border:3px solid var(--component-color);display:flex;flex-direction:column;justify-content:flex-end}.floating-action-button:hover{opacity:100%}.floating-action-button:hover ::ng-deep button:not(:first-child){display:flex}.floating-action-button ::ng-deep button:not(:first-child){display:none}\n"] }]
+            args: [{ selector: 'biit-action-button', template: "<div id=\"fab\" class=\"floating-action-button\" [ngStyle]=\"positionStyle()\" (pointerover)=\"hover = true;\" (pointerleave)=\"hover = false\">\n    <ng-content></ng-content>\n</div>\n", styles: [":root{--main-color: #F20D5E;--popup-background-color: rgba(0, 0, 0, .15);--main-background: #D9D9D9;--body-background: #EDEDED;--light-background: #D7D7D7;--error-color: #A1093F;--warning-color: var(--main-color);--floating-background: white;--main-font-color: white;--secondary-color: #808080;--secondary-text-color: #EDEDED;--secondary-background-color: #808080;--disabled-primary-color: #808080;--disabled-secondary-color: var(--main-color);--component-color: #262626;--active-color: var(--component-color);--hover-color: #EDEDED;--hover-primary-color: var(--main-color);--secondary-button-color: var(--component-color);--secondary-button-background-color: var(--main-font-color);--secondary-button-hover-background: var(--main-background);--secondary-button-active-background: var(--main-background);--quaternary-button-color: var(--main-font-color);--quaternary-button-background-color: var(--error-color);--quaternary-button-hover-background: var(--main-color);--quaternary-button-active-background: var(--main-color);--text-hover-color: #5A6473;--selected-color: #FBAEC9;--chart-background: #FFFFFF;--chart-component-color: var(--component-color);--icon-color: var(--main-color);--table-header-color: var(--component-color);--table-header-text: var(--main-background);--table-background-color: var(--chart-background);--table-hover-background-color: var(--chart-background);--table-border-color: var(--table-header-color);--table-selected-row-color: var(--main-background);--table-text-color: var(--secondary-text-color);--table-active-row-backgorund-color: var(--main-background);--scrollbar-color: var(--main-color);--menu-button-active: var(--main-color);--disabled-menu-color: #D9D9D9;--disabled-menu-color-hover: #FFFFFF;--nav-menu-hover-color: #70757e;--nav-menu-text-hover-color: var(--text-hover-color);--nav-menu-active-background: var(--hover-color);--nav-menu-disable-font: var(--hover-color);--nav-menu-separator-color: var(--secondary-color);--nav-menu-font-color: var(--nav-menu-hover-color);--nav-menu-font-disabled-color: #8a909a;--nav-menu-background-color: #FFFFFF;--nav-menu-active-color: var(--hover-color);--nav-menu-border-color: rgba(0, 0, 0, .18);--input-text-background: var(--main-background);--input-text-focus-background: var(--main-background);--input-text-hover-background: var(--main-background);--popup-color: var(--component-color);--popup-background: #FFFFFF;--popup-error-color: var(--error-color);--popup-close-button: var(--main-color)}.floating-action-button{box-sizing:border-box;position:fixed;z-index:999;opacity:50%;background:white;border:3px solid var(--component-color);display:flex;flex-direction:column;justify-content:flex-end}.floating-action-button:hover{opacity:100%}.floating-action-button:hover ::ng-deep button:not(:first-child){display:flex}.floating-action-button ::ng-deep button:not(:first-child){display:none}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { position: [{
                 type: Input
             }], additionalX: [{

package/esm2020/inputs/biit-multiselect/biit-multiselect.component.mjs

@@ -273,7 +273,7 @@ BiitMultiselectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0
             useExisting: forwardRef(() => BiitMultiselectComponent),
             multi: true
         }
-    ], ngImport: i0, template: "<!-- DEFAULT MODE -->\n<div *ngIf=\"type != 'icon'\"\n     class=\"biit-input\" aria-haspopup=\"listbox\"\n     [class.compact]=\"isCompact\"\n     [class.disabled]=\"isDisabled\"\n     (keydown)=\"!isDisabled && handleKeyboardEvents($event)\"\n     (keydown.enter)=\"!dropdownOpen && !isDisabled && openDropdown()\"\n     (keydown.space)=\"!dropdownOpen && !isDisabled && openDropdown()\"\n>\n  <div class=\"input-container\" #input>\n    <input [ngModel]=\"dropdownOpen ? filterText :\n                      currentValues && currentValues.length ? currentValues.length + ' selected' : ''\"\n           (ngModelChange)=\"filterText = $event; handleFilter()\"\n           (click)=\"!dropdownOpen && !isDisabled && openDropdown()\"\n           (keydown.enter)=\"filterText.length ? onCreate.emit(filterText) : false; clearFilter();\"\n           [placeholder]=\"dropdownOpen && currentValues && currentValues.length ? currentValues.length + ' selected' : ''\"\n           tabindex=\"0\"\n           class=\"input-object\"\n           [class.grey-bg]=\"dropdownOpen\"\n           [class.default-cursor]=\"dropdownOpen\"\n           [disabled]=\"isDisabled\"\n           [readonly]=\"!dropdownOpen\"/>\n    <div class=\"input-show-icon-container\" id=\"arrow\"\n         [class.passthrough]=\"!dropdownOpen\"\n         [class.rotate-90]=\"dropdownOpen\"\n         (click)=\"dropdownOpen && closeDropdown()\">\n      <biit-icon [name]=\"'right_arrow'\"\n                 class=\"input-show-icon\"\n                 [pathStyle]=\"{fill: isDisabled ? '#D9D9D9' : dropdownOpen ? 'var(--main-color)' : 'var(--component-color)'}\"\n      ></biit-icon>\n    </div>\n    <div id=\"dropdown-label\"\n         class=\"input-placeholder\"\n         [class.disabled]=\"isDisabled\"\n         [class.compact]=\"dropdownOpen || (currentValues?.length)\">\n      {{ title }}\n      <a *ngIf=\"isRequired\"\n         [style.color]=\"currentValues.length ? null : 'red'\">*</a>\n    </div>\n    <div class=\"bottom-line\"\n         [class.disabled]=\"isDisabled\"\n    ></div>\n    <span class=\"description\">{{ description }}</span>\n  </div>\n</div>\n\n<!-- ICON MODE -->\n<button biit-icon *ngIf=\"type == 'icon'\"\n        [icon]=\"icon\"\n        (click)=\"!dropdownOpen ? openDropdown() : closeDropdown()\"\n        [checked]=\"dropdownOpen\"\n        [disabled]=\"isDisabled\"\n></button>\n\n<!-- DROPDOWN -->\n<div style=\"position: relative; height: 0; width: 100%\">\n  <div #dropdown id=\"options\"\n       [class.disabled]=\"isDisabled\"\n       class=\"dropdown-list\"\n       role=\"listbox\"\n       aria-expanded=\"false\"\n       aria-labelledby=\"dropdown-label\"\n       [class.dropdown-open]=\"dropdownOpen\"\n       [class.compact]=\"isCompact\"\n       (keydown)=\"dropdownOpen && handleKeyboardEvents($event)\"\n  >\n    <biit-checkbox *ngFor=\"let item of filteredData; index as i\"\n                   [attr.id]=\"'option-' +   (isPrimitive ? item : item[label])\"\n                   class=\"dropdown-item\"\n                   [class.selected]=\"currentValues && currentValues.includes(item)\"\n                   [ngModel]=\"currentValues && currentValues.includes(item)\"\n                   [description]=\"descriptionField && item[descriptionField]\"\n                   (click)=\"onModelChange(item); $event.stopPropagation(); $event.preventDefault();\"\n                   (keydown.enter)=\"onModelChange(item)\"\n                   (keydown.space)=\"onModelChange(item)\"\n                   [tabindex]=\"!dropdownOpen || isDisabled ? -1 : 0\"\n                   role=\"option\"\n                   aria-selected=\"false\"\n                   [disabled]=\"false\">\n      {{ isPrimitive ? item : item[label] }}\n    </biit-checkbox>\n    <button *ngIf=\"!filteredData?.length\"\n            class=\"dropdown-item no-results\"\n            disabled\n    >\n      <a>No results found</a>\n    </button>\n  </div>\n</div>\n\n<div *ngIf=\"type == 'chips'\"\n     class=\"chips\">\n  <span\n    *ngFor=\"let item of currentValues\"\n    (click)=\"onModelChange(item)\"\n    class=\"chips-item\"\n  >\n    {{ item[label] }}\n    <biit-icon\n      [name]=\"'cross_wide'\"\n      [pathStyle]=\"{fill: '#ffffff'}\"\n    ></biit-icon>\n  </span>\n</div>\n", styles: ["*{box-sizing:border-box}input::selection{background-color:transparent}.biit-input{display:flex;min-width:12.8rem}.biit-input.compact{width:12.8rem}.input-container{position:relative;width:100%}.input-object{background-color:#fff;font-size:1rem;display:block;border:none;color:var(--component-color);padding:.7rem;height:2.1rem;width:100%;min-width:2.1rem;font-weight:400;cursor:pointer}.input-object:focus,.input-object:active,.input-object:hover{outline:none;background:var(--main-background)}.input-object:disabled{pointer-events:none;background-color:transparent;color:var(--main-background)}.default-cursor{cursor:auto}.input-placeholder{color:var(--component-color);font-size:1rem;font-weight:bolder;text-transform:uppercase;position:absolute;pointer-events:none;left:.7rem;top:.42rem;height:.7rem;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.input-placeholder.compact{top:-.95rem;font-size:.7rem;font-weight:400;color:var(--secondary-color)}.input-placeholder.disabled{color:var(--main-background)}.input-show-icon{width:1rem;height:1rem}.input-show-icon-container{top:0;right:0;position:absolute;width:2.1rem;height:2.1rem;align-content:center;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transform:rotate(90deg);transition:transform .5s ease}.input-show-icon-container:hover,.input-show-icon-container:focus,.input-show-icon-container:focus-visible{border:none;outline:none}.input-show-icon-container:hover~.input-object{background:var(--main-background)}.input-show-icon-container.rotate-90{transform:rotate(-90deg)}.bottom-line{position:relative;top:-3px;margin-bottom:-3px;width:auto;height:3px;background:var(--component-color)}.bottom-line.disabled{background:var(--main-background)}.dropdown-list{background:white;position:absolute;z-index:2;box-sizing:border-box;border:3px solid black;margin-top:-3px;min-width:100%;width:100%;cursor:pointer;transform-origin:top;opacity:0;display:none;pointer-events:none;transform:translateY(var(--origin));transition:opacity .5s ease,transform .5s ease;max-height:20rem;overflow-y:auto;overflow-x:hidden}.dropdown-list.dropdown-open{opacity:1;pointer-events:auto;transform:translate(0)}.dropdown-list.compact{width:12.8rem}.dropdown-list.disabled{visibility:hidden}.dropdown-item{background:none;color:inherit;border:none;font:inherit;width:100%;cursor:pointer;line-height:1rem;min-height:1.4rem;display:flex;align-items:center;padding:.2rem .7rem}.dropdown-item:not(.no-results):hover,.dropdown-item:not(.no-results):focus-visible{outline:none;background:var(--hover-color);width:calc(100% + 6px);margin-left:-3px;padding-left:calc(.7rem + 3px)}.dropdown-item.no-results{justify-content:center;padding:1rem;color:#d9d9d9}.dropdown-item ::ng-deep label{width:100%;height:100%;cursor:pointer}.dropdown-item ::ng-deep label input[type=checkbox]{cursor:pointer;pointer-events:none}.passthrough{pointer-events:none}.grey-bg{background:var(--main-background)}.onwards{--origin: 1rem}.downwards{--origin: -1rem}.description{position:absolute;display:flex;align-items:center;font-size:.75em;color:gray;padding-top:.2em;min-height:1.05em;line-height:120%;font-style:italic}.chips{display:flex;flex-wrap:wrap;gap:2px;margin-top:2px}.chips .chips-item{font-size:.75rem;color:#fff;background:var(--main-color);padding:.25rem .75rem;position:relative;cursor:pointer}.chips .chips-item biit-icon{display:none}.chips .chips-item:hover biit-icon{display:block;height:100%;width:5px;position:absolute;top:0;right:4px}\n"], dependencies: [{ kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.BiitIconComponent, selector: "biit-icon", inputs: ["name", "svgStyle", "pathStyle"] }, { kind: "component", type: i4.BiitCheckboxComponent, selector: "biit-checkbox", inputs: ["disabled", "description", "showAlwaysDescription"], outputs: ["onValueChange"] }, { kind: "component", type: i5.BiitIconButtonComponent, selector: "button[biit-icon]", inputs: ["icon", "checked"] }] });
+    ], ngImport: i0, template: "<!-- DEFAULT MODE -->\n<div *ngIf=\"type != 'icon'\"\n     class=\"biit-input\" aria-haspopup=\"listbox\"\n     [class.compact]=\"isCompact\"\n     [class.disabled]=\"isDisabled\"\n     (keydown)=\"!isDisabled && handleKeyboardEvents($event)\"\n     (keydown.enter)=\"!dropdownOpen && !isDisabled && openDropdown()\"\n     (keydown.space)=\"!dropdownOpen && !isDisabled && openDropdown()\"\n>\n  <div class=\"input-container\" #input>\n    <input [ngModel]=\"dropdownOpen ? filterText :\n                      currentValues && currentValues.length ? currentValues.length + ' selected' : ''\"\n           (ngModelChange)=\"filterText = $event; handleFilter()\"\n           (click)=\"!dropdownOpen && !isDisabled && openDropdown()\"\n           (keydown.enter)=\"filterText.length ? onCreate.emit(filterText) : false; clearFilter();\"\n           [placeholder]=\"dropdownOpen && currentValues && currentValues.length ? currentValues.length + ' selected' : ''\"\n           tabindex=\"0\"\n           class=\"input-object\"\n           [class.grey-bg]=\"dropdownOpen\"\n           [class.default-cursor]=\"dropdownOpen\"\n           [disabled]=\"isDisabled\"\n           [readonly]=\"!dropdownOpen\"/>\n    <div class=\"input-show-icon-container\" id=\"arrow\"\n         [class.passthrough]=\"!dropdownOpen\"\n         [class.rotate-90]=\"dropdownOpen\"\n         (click)=\"dropdownOpen && closeDropdown()\">\n      <biit-icon [name]=\"'right_arrow'\"\n                 class=\"input-show-icon\"\n                 [pathStyle]=\"{fill: isDisabled ? '#D9D9D9' : dropdownOpen ? 'var(--main-color)' : 'var(--component-color)'}\"\n      ></biit-icon>\n    </div>\n    <div id=\"dropdown-label\"\n         class=\"input-placeholder\"\n         [class.disabled]=\"isDisabled\"\n         [class.compact]=\"dropdownOpen || (currentValues?.length)\">\n      {{ title }}\n      <a *ngIf=\"isRequired\"\n         [style.color]=\"currentValues.length ? null : 'red'\">*</a>\n    </div>\n    <div class=\"bottom-line\"\n         [class.disabled]=\"isDisabled\"\n    ></div>\n    <span class=\"description\">{{ description }}</span>\n  </div>\n</div>\n\n<!-- ICON MODE -->\n<button biit-icon *ngIf=\"type == 'icon'\"\n        [icon]=\"icon\"\n        (click)=\"!dropdownOpen ? openDropdown() : closeDropdown()\"\n        [checked]=\"dropdownOpen\"\n        [disabled]=\"isDisabled\"\n></button>\n\n<!-- DROPDOWN -->\n<div style=\"position: relative; height: 0; width: 100%\">\n  <div #dropdown id=\"options\"\n       [class.disabled]=\"isDisabled\"\n       class=\"dropdown-list\"\n       role=\"listbox\"\n       aria-expanded=\"false\"\n       aria-labelledby=\"dropdown-label\"\n       [class.dropdown-open]=\"dropdownOpen\"\n       [class.compact]=\"isCompact\"\n       (keydown)=\"dropdownOpen && handleKeyboardEvents($event)\"\n  >\n    <biit-checkbox *ngFor=\"let item of filteredData; index as i\"\n                   [attr.id]=\"'option-' +   (isPrimitive ? item : item[label])\"\n                   class=\"dropdown-item\"\n                   [class.selected]=\"currentValues && currentValues.includes(item)\"\n                   [ngModel]=\"currentValues && currentValues.includes(item)\"\n                   [description]=\"descriptionField && item[descriptionField]\"\n                   (click)=\"onModelChange(item); $event.stopPropagation(); $event.preventDefault();\"\n                   (keydown.enter)=\"onModelChange(item)\"\n                   (keydown.space)=\"onModelChange(item)\"\n                   [tabindex]=\"!dropdownOpen || isDisabled ? -1 : 0\"\n                   role=\"option\"\n                   aria-selected=\"false\"\n                   [disabled]=\"false\">\n      {{ isPrimitive ? item : item[label] }}\n    </biit-checkbox>\n    <button *ngIf=\"!filteredData?.length\"\n            class=\"dropdown-item no-results\"\n            disabled\n    >\n      <a>No results found</a>\n    </button>\n  </div>\n</div>\n\n<div *ngIf=\"type == 'chips'\"\n     class=\"chips\">\n  <span\n    *ngFor=\"let item of currentValues\"\n    (click)=\"onModelChange(item)\"\n    class=\"chips-item\"\n  >\n    {{ item[label] }}\n    <biit-icon\n      [name]=\"'cross_wide'\"\n      [pathStyle]=\"{fill: '#ffffff'}\"\n    ></biit-icon>\n  </span>\n</div>\n", styles: ["*{box-sizing:border-box}input::selection{background-color:transparent}.biit-input{display:flex;min-width:12.8rem}.biit-input.compact{width:12.8rem}.input-container{position:relative;width:100%}.input-object{background-color:#fff;font-size:1rem;display:block;border:none;color:var(--component-color);padding:.7rem;height:2.1rem;width:100%;min-width:2.1rem;font-weight:400;cursor:pointer}.input-object:focus,.input-object:active,.input-object:hover{outline:none;background:var(--main-background)}.input-object:disabled{pointer-events:none;background-color:transparent;color:var(--main-background)}.default-cursor{cursor:auto}.input-placeholder{color:var(--component-color);font-size:1rem;font-weight:bolder;text-transform:uppercase;position:absolute;pointer-events:none;left:.7rem;top:.42rem;height:.7rem;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.input-placeholder.compact{top:-.95rem;font-size:.7rem;font-weight:400;color:var(--secondary-color)}.input-placeholder.disabled{color:var(--main-background)}.input-show-icon{width:1rem;height:1rem}.input-show-icon-container{top:0;right:0;position:absolute;width:2.1rem;height:2.1rem;align-content:center;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transform:rotate(90deg);transition:transform .5s ease}.input-show-icon-container:hover,.input-show-icon-container:focus,.input-show-icon-container:focus-visible{border:none;outline:none}.input-show-icon-container:hover~.input-object{background:var(--main-background)}.input-show-icon-container.rotate-90{transform:rotate(-90deg)}.bottom-line{position:relative;top:-3px;margin-bottom:-3px;width:auto;height:3px;background:var(--component-color)}.bottom-line.disabled{background:var(--main-background)}.dropdown-list{background:var(--main-background);position:absolute;z-index:2;box-sizing:border-box;border:3px solid var(--border-color);margin-top:-3px;min-width:100%;width:100%;cursor:pointer;transform-origin:top;opacity:0;display:none;pointer-events:none;transform:translateY(var(--origin));transition:opacity .5s ease,transform .5s ease;max-height:20rem;overflow-y:auto;overflow-x:hidden}.dropdown-list.dropdown-open{opacity:1;pointer-events:auto;transform:translate(0)}.dropdown-list.compact{width:12.8rem}.dropdown-list.disabled{visibility:hidden}.dropdown-item{background:none;color:inherit;border:none;font:inherit;width:100%;cursor:pointer;line-height:1rem;min-height:1.4rem;display:flex;align-items:center;padding:.2rem .7rem}.dropdown-item:not(.no-results):hover,.dropdown-item:not(.no-results):focus-visible{outline:none;background:var(--hover-color);width:calc(100% + 6px);margin-left:-3px;padding-left:calc(.7rem + 3px)}.dropdown-item.no-results{justify-content:center;padding:1rem;color:#d9d9d9}.dropdown-item ::ng-deep label{width:100%;height:100%;cursor:pointer}.dropdown-item ::ng-deep label input[type=checkbox]{cursor:pointer;pointer-events:none}.passthrough{pointer-events:none}.grey-bg{background:var(--main-background)}.onwards{--origin: 1rem}.downwards{--origin: -1rem}.description{position:absolute;display:flex;align-items:center;font-size:.75em;color:var(--secondary-color);padding-top:.2em;min-height:1.05em;line-height:120%;font-style:italic}.chips{display:flex;flex-wrap:wrap;gap:2px;margin-top:2px}.chips .chips-item{font-size:.75rem;color:#fff;background:var(--main-color);padding:.25rem .75rem;position:relative;cursor:pointer}.chips .chips-item biit-icon{display:none}.chips .chips-item:hover biit-icon{display:block;height:100%;width:5px;position:absolute;top:0;right:4px}\n"], dependencies: [{ kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.BiitIconComponent, selector: "biit-icon", inputs: ["name", "svgStyle", "pathStyle"] }, { kind: "component", type: i4.BiitCheckboxComponent, selector: "biit-checkbox", inputs: ["disabled", "description", "showAlwaysDescription"], outputs: ["onValueChange"] }, { kind: "component", type: i5.BiitIconButtonComponent, selector: "button[biit-icon]", inputs: ["icon", "checked"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BiitMultiselectComponent, decorators: [{
             type: Component,
             args: [{ selector: 'biit-multiselect', providers: [
@@ -284,7 +284,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                         }
                     ], host: {
                         '(document:pointerdown)': 'handleMouseEvents($event)'
-                    }, template: "<!-- DEFAULT MODE -->\n<div *ngIf=\"type != 'icon'\"\n     class=\"biit-input\" aria-haspopup=\"listbox\"\n     [class.compact]=\"isCompact\"\n     [class.disabled]=\"isDisabled\"\n     (keydown)=\"!isDisabled && handleKeyboardEvents($event)\"\n     (keydown.enter)=\"!dropdownOpen && !isDisabled && openDropdown()\"\n     (keydown.space)=\"!dropdownOpen && !isDisabled && openDropdown()\"\n>\n  <div class=\"input-container\" #input>\n    <input [ngModel]=\"dropdownOpen ? filterText :\n                      currentValues && currentValues.length ? currentValues.length + ' selected' : ''\"\n           (ngModelChange)=\"filterText = $event; handleFilter()\"\n           (click)=\"!dropdownOpen && !isDisabled && openDropdown()\"\n           (keydown.enter)=\"filterText.length ? onCreate.emit(filterText) : false; clearFilter();\"\n           [placeholder]=\"dropdownOpen && currentValues && currentValues.length ? currentValues.length + ' selected' : ''\"\n           tabindex=\"0\"\n           class=\"input-object\"\n           [class.grey-bg]=\"dropdownOpen\"\n           [class.default-cursor]=\"dropdownOpen\"\n           [disabled]=\"isDisabled\"\n           [readonly]=\"!dropdownOpen\"/>\n    <div class=\"input-show-icon-container\" id=\"arrow\"\n         [class.passthrough]=\"!dropdownOpen\"\n         [class.rotate-90]=\"dropdownOpen\"\n         (click)=\"dropdownOpen && closeDropdown()\">\n      <biit-icon [name]=\"'right_arrow'\"\n                 class=\"input-show-icon\"\n                 [pathStyle]=\"{fill: isDisabled ? '#D9D9D9' : dropdownOpen ? 'var(--main-color)' : 'var(--component-color)'}\"\n      ></biit-icon>\n    </div>\n    <div id=\"dropdown-label\"\n         class=\"input-placeholder\"\n         [class.disabled]=\"isDisabled\"\n         [class.compact]=\"dropdownOpen || (currentValues?.length)\">\n      {{ title }}\n      <a *ngIf=\"isRequired\"\n         [style.color]=\"currentValues.length ? null : 'red'\">*</a>\n    </div>\n    <div class=\"bottom-line\"\n         [class.disabled]=\"isDisabled\"\n    ></div>\n    <span class=\"description\">{{ description }}</span>\n  </div>\n</div>\n\n<!-- ICON MODE -->\n<button biit-icon *ngIf=\"type == 'icon'\"\n        [icon]=\"icon\"\n        (click)=\"!dropdownOpen ? openDropdown() : closeDropdown()\"\n        [checked]=\"dropdownOpen\"\n        [disabled]=\"isDisabled\"\n></button>\n\n<!-- DROPDOWN -->\n<div style=\"position: relative; height: 0; width: 100%\">\n  <div #dropdown id=\"options\"\n       [class.disabled]=\"isDisabled\"\n       class=\"dropdown-list\"\n       role=\"listbox\"\n       aria-expanded=\"false\"\n       aria-labelledby=\"dropdown-label\"\n       [class.dropdown-open]=\"dropdownOpen\"\n       [class.compact]=\"isCompact\"\n       (keydown)=\"dropdownOpen && handleKeyboardEvents($event)\"\n  >\n    <biit-checkbox *ngFor=\"let item of filteredData; index as i\"\n                   [attr.id]=\"'option-' +   (isPrimitive ? item : item[label])\"\n                   class=\"dropdown-item\"\n                   [class.selected]=\"currentValues && currentValues.includes(item)\"\n                   [ngModel]=\"currentValues && currentValues.includes(item)\"\n                   [description]=\"descriptionField && item[descriptionField]\"\n                   (click)=\"onModelChange(item); $event.stopPropagation(); $event.preventDefault();\"\n                   (keydown.enter)=\"onModelChange(item)\"\n                   (keydown.space)=\"onModelChange(item)\"\n                   [tabindex]=\"!dropdownOpen || isDisabled ? -1 : 0\"\n                   role=\"option\"\n                   aria-selected=\"false\"\n                   [disabled]=\"false\">\n      {{ isPrimitive ? item : item[label] }}\n    </biit-checkbox>\n    <button *ngIf=\"!filteredData?.length\"\n            class=\"dropdown-item no-results\"\n            disabled\n    >\n      <a>No results found</a>\n    </button>\n  </div>\n</div>\n\n<div *ngIf=\"type == 'chips'\"\n     class=\"chips\">\n  <span\n    *ngFor=\"let item of currentValues\"\n    (click)=\"onModelChange(item)\"\n    class=\"chips-item\"\n  >\n    {{ item[label] }}\n    <biit-icon\n      [name]=\"'cross_wide'\"\n      [pathStyle]=\"{fill: '#ffffff'}\"\n    ></biit-icon>\n  </span>\n</div>\n", styles: ["*{box-sizing:border-box}input::selection{background-color:transparent}.biit-input{display:flex;min-width:12.8rem}.biit-input.compact{width:12.8rem}.input-container{position:relative;width:100%}.input-object{background-color:#fff;font-size:1rem;display:block;border:none;color:var(--component-color);padding:.7rem;height:2.1rem;width:100%;min-width:2.1rem;font-weight:400;cursor:pointer}.input-object:focus,.input-object:active,.input-object:hover{outline:none;background:var(--main-background)}.input-object:disabled{pointer-events:none;background-color:transparent;color:var(--main-background)}.default-cursor{cursor:auto}.input-placeholder{color:var(--component-color);font-size:1rem;font-weight:bolder;text-transform:uppercase;position:absolute;pointer-events:none;left:.7rem;top:.42rem;height:.7rem;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.input-placeholder.compact{top:-.95rem;font-size:.7rem;font-weight:400;color:var(--secondary-color)}.input-placeholder.disabled{color:var(--main-background)}.input-show-icon{width:1rem;height:1rem}.input-show-icon-container{top:0;right:0;position:absolute;width:2.1rem;height:2.1rem;align-content:center;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transform:rotate(90deg);transition:transform .5s ease}.input-show-icon-container:hover,.input-show-icon-container:focus,.input-show-icon-container:focus-visible{border:none;outline:none}.input-show-icon-container:hover~.input-object{background:var(--main-background)}.input-show-icon-container.rotate-90{transform:rotate(-90deg)}.bottom-line{position:relative;top:-3px;margin-bottom:-3px;width:auto;height:3px;background:var(--component-color)}.bottom-line.disabled{background:var(--main-background)}.dropdown-list{background:white;position:absolute;z-index:2;box-sizing:border-box;border:3px solid black;margin-top:-3px;min-width:100%;width:100%;cursor:pointer;transform-origin:top;opacity:0;display:none;pointer-events:none;transform:translateY(var(--origin));transition:opacity .5s ease,transform .5s ease;max-height:20rem;overflow-y:auto;overflow-x:hidden}.dropdown-list.dropdown-open{opacity:1;pointer-events:auto;transform:translate(0)}.dropdown-list.compact{width:12.8rem}.dropdown-list.disabled{visibility:hidden}.dropdown-item{background:none;color:inherit;border:none;font:inherit;width:100%;cursor:pointer;line-height:1rem;min-height:1.4rem;display:flex;align-items:center;padding:.2rem .7rem}.dropdown-item:not(.no-results):hover,.dropdown-item:not(.no-results):focus-visible{outline:none;background:var(--hover-color);width:calc(100% + 6px);margin-left:-3px;padding-left:calc(.7rem + 3px)}.dropdown-item.no-results{justify-content:center;padding:1rem;color:#d9d9d9}.dropdown-item ::ng-deep label{width:100%;height:100%;cursor:pointer}.dropdown-item ::ng-deep label input[type=checkbox]{cursor:pointer;pointer-events:none}.passthrough{pointer-events:none}.grey-bg{background:var(--main-background)}.onwards{--origin: 1rem}.downwards{--origin: -1rem}.description{position:absolute;display:flex;align-items:center;font-size:.75em;color:gray;padding-top:.2em;min-height:1.05em;line-height:120%;font-style:italic}.chips{display:flex;flex-wrap:wrap;gap:2px;margin-top:2px}.chips .chips-item{font-size:.75rem;color:#fff;background:var(--main-color);padding:.25rem .75rem;position:relative;cursor:pointer}.chips .chips-item biit-icon{display:none}.chips .chips-item:hover biit-icon{display:block;height:100%;width:5px;position:absolute;top:0;right:4px}\n"] }]
+                    }, template: "<!-- DEFAULT MODE -->\n<div *ngIf=\"type != 'icon'\"\n     class=\"biit-input\" aria-haspopup=\"listbox\"\n     [class.compact]=\"isCompact\"\n     [class.disabled]=\"isDisabled\"\n     (keydown)=\"!isDisabled && handleKeyboardEvents($event)\"\n     (keydown.enter)=\"!dropdownOpen && !isDisabled && openDropdown()\"\n     (keydown.space)=\"!dropdownOpen && !isDisabled && openDropdown()\"\n>\n  <div class=\"input-container\" #input>\n    <input [ngModel]=\"dropdownOpen ? filterText :\n                      currentValues && currentValues.length ? currentValues.length + ' selected' : ''\"\n           (ngModelChange)=\"filterText = $event; handleFilter()\"\n           (click)=\"!dropdownOpen && !isDisabled && openDropdown()\"\n           (keydown.enter)=\"filterText.length ? onCreate.emit(filterText) : false; clearFilter();\"\n           [placeholder]=\"dropdownOpen && currentValues && currentValues.length ? currentValues.length + ' selected' : ''\"\n           tabindex=\"0\"\n           class=\"input-object\"\n           [class.grey-bg]=\"dropdownOpen\"\n           [class.default-cursor]=\"dropdownOpen\"\n           [disabled]=\"isDisabled\"\n           [readonly]=\"!dropdownOpen\"/>\n    <div class=\"input-show-icon-container\" id=\"arrow\"\n         [class.passthrough]=\"!dropdownOpen\"\n         [class.rotate-90]=\"dropdownOpen\"\n         (click)=\"dropdownOpen && closeDropdown()\">\n      <biit-icon [name]=\"'right_arrow'\"\n                 class=\"input-show-icon\"\n                 [pathStyle]=\"{fill: isDisabled ? '#D9D9D9' : dropdownOpen ? 'var(--main-color)' : 'var(--component-color)'}\"\n      ></biit-icon>\n    </div>\n    <div id=\"dropdown-label\"\n         class=\"input-placeholder\"\n         [class.disabled]=\"isDisabled\"\n         [class.compact]=\"dropdownOpen || (currentValues?.length)\">\n      {{ title }}\n      <a *ngIf=\"isRequired\"\n         [style.color]=\"currentValues.length ? null : 'red'\">*</a>\n    </div>\n    <div class=\"bottom-line\"\n         [class.disabled]=\"isDisabled\"\n    ></div>\n    <span class=\"description\">{{ description }}</span>\n  </div>\n</div>\n\n<!-- ICON MODE -->\n<button biit-icon *ngIf=\"type == 'icon'\"\n        [icon]=\"icon\"\n        (click)=\"!dropdownOpen ? openDropdown() : closeDropdown()\"\n        [checked]=\"dropdownOpen\"\n        [disabled]=\"isDisabled\"\n></button>\n\n<!-- DROPDOWN -->\n<div style=\"position: relative; height: 0; width: 100%\">\n  <div #dropdown id=\"options\"\n       [class.disabled]=\"isDisabled\"\n       class=\"dropdown-list\"\n       role=\"listbox\"\n       aria-expanded=\"false\"\n       aria-labelledby=\"dropdown-label\"\n       [class.dropdown-open]=\"dropdownOpen\"\n       [class.compact]=\"isCompact\"\n       (keydown)=\"dropdownOpen && handleKeyboardEvents($event)\"\n  >\n    <biit-checkbox *ngFor=\"let item of filteredData; index as i\"\n                   [attr.id]=\"'option-' +   (isPrimitive ? item : item[label])\"\n                   class=\"dropdown-item\"\n                   [class.selected]=\"currentValues && currentValues.includes(item)\"\n                   [ngModel]=\"currentValues && currentValues.includes(item)\"\n                   [description]=\"descriptionField && item[descriptionField]\"\n                   (click)=\"onModelChange(item); $event.stopPropagation(); $event.preventDefault();\"\n                   (keydown.enter)=\"onModelChange(item)\"\n                   (keydown.space)=\"onModelChange(item)\"\n                   [tabindex]=\"!dropdownOpen || isDisabled ? -1 : 0\"\n                   role=\"option\"\n                   aria-selected=\"false\"\n                   [disabled]=\"false\">\n      {{ isPrimitive ? item : item[label] }}\n    </biit-checkbox>\n    <button *ngIf=\"!filteredData?.length\"\n            class=\"dropdown-item no-results\"\n            disabled\n    >\n      <a>No results found</a>\n    </button>\n  </div>\n</div>\n\n<div *ngIf=\"type == 'chips'\"\n     class=\"chips\">\n  <span\n    *ngFor=\"let item of currentValues\"\n    (click)=\"onModelChange(item)\"\n    class=\"chips-item\"\n  >\n    {{ item[label] }}\n    <biit-icon\n      [name]=\"'cross_wide'\"\n      [pathStyle]=\"{fill: '#ffffff'}\"\n    ></biit-icon>\n  </span>\n</div>\n", styles: ["*{box-sizing:border-box}input::selection{background-color:transparent}.biit-input{display:flex;min-width:12.8rem}.biit-input.compact{width:12.8rem}.input-container{position:relative;width:100%}.input-object{background-color:#fff;font-size:1rem;display:block;border:none;color:var(--component-color);padding:.7rem;height:2.1rem;width:100%;min-width:2.1rem;font-weight:400;cursor:pointer}.input-object:focus,.input-object:active,.input-object:hover{outline:none;background:var(--main-background)}.input-object:disabled{pointer-events:none;background-color:transparent;color:var(--main-background)}.default-cursor{cursor:auto}.input-placeholder{color:var(--component-color);font-size:1rem;font-weight:bolder;text-transform:uppercase;position:absolute;pointer-events:none;left:.7rem;top:.42rem;height:.7rem;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.input-placeholder.compact{top:-.95rem;font-size:.7rem;font-weight:400;color:var(--secondary-color)}.input-placeholder.disabled{color:var(--main-background)}.input-show-icon{width:1rem;height:1rem}.input-show-icon-container{top:0;right:0;position:absolute;width:2.1rem;height:2.1rem;align-content:center;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transform:rotate(90deg);transition:transform .5s ease}.input-show-icon-container:hover,.input-show-icon-container:focus,.input-show-icon-container:focus-visible{border:none;outline:none}.input-show-icon-container:hover~.input-object{background:var(--main-background)}.input-show-icon-container.rotate-90{transform:rotate(-90deg)}.bottom-line{position:relative;top:-3px;margin-bottom:-3px;width:auto;height:3px;background:var(--component-color)}.bottom-line.disabled{background:var(--main-background)}.dropdown-list{background:var(--main-background);position:absolute;z-index:2;box-sizing:border-box;border:3px solid var(--border-color);margin-top:-3px;min-width:100%;width:100%;cursor:pointer;transform-origin:top;opacity:0;display:none;pointer-events:none;transform:translateY(var(--origin));transition:opacity .5s ease,transform .5s ease;max-height:20rem;overflow-y:auto;overflow-x:hidden}.dropdown-list.dropdown-open{opacity:1;pointer-events:auto;transform:translate(0)}.dropdown-list.compact{width:12.8rem}.dropdown-list.disabled{visibility:hidden}.dropdown-item{background:none;color:inherit;border:none;font:inherit;width:100%;cursor:pointer;line-height:1rem;min-height:1.4rem;display:flex;align-items:center;padding:.2rem .7rem}.dropdown-item:not(.no-results):hover,.dropdown-item:not(.no-results):focus-visible{outline:none;background:var(--hover-color);width:calc(100% + 6px);margin-left:-3px;padding-left:calc(.7rem + 3px)}.dropdown-item.no-results{justify-content:center;padding:1rem;color:#d9d9d9}.dropdown-item ::ng-deep label{width:100%;height:100%;cursor:pointer}.dropdown-item ::ng-deep label input[type=checkbox]{cursor:pointer;pointer-events:none}.passthrough{pointer-events:none}.grey-bg{background:var(--main-background)}.onwards{--origin: 1rem}.downwards{--origin: -1rem}.description{position:absolute;display:flex;align-items:center;font-size:.75em;color:var(--secondary-color);padding-top:.2em;min-height:1.05em;line-height:120%;font-style:italic}.chips{display:flex;flex-wrap:wrap;gap:2px;margin-top:2px}.chips .chips-item{font-size:.75rem;color:#fff;background:var(--main-color);padding:.25rem .75rem;position:relative;cursor:pointer}.chips .chips-item biit-icon{display:none}.chips .chips-item:hover biit-icon{display:block;height:100%;width:5px;position:absolute;top:0;right:4px}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.IterableDiffers }]; }, propDecorators: { title: [{
                 type: Input
             }], type: [{

package/esm2020/popup/biit-popup/biit-popup.component.mjs

@@ -130,10 +130,10 @@ export class BiitPopupComponent {
     }
 }
 BiitPopupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BiitPopupComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-BiitPopupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: BiitPopupComponent, selector: "biit-popup", inputs: { title: "title", mouseEvent: "mouseEvent" }, outputs: { onClosed: "onClosed" }, host: { listeners: { "document:keydown.escape": "onEscPress($event)" } }, viewQueries: [{ propertyName: "popup", first: true, predicate: ["popup"], descendants: true }], ngImport: i0, template: "<div *ngIf=\"type !== Type.INFO_BOX\" [class.dark-bg]=\"background\" class=\"popup-background\"\n     (click)=\"closableOutside ? onClosed.emit() : false\">\n</div>\n<div #popup id=\"biit-popup\"\n     [class.popup-canvas]=\"type == Type.DEFAULT\"\n     [class.sixty-canvas]=\"type == Type.SIXTY\"\n     [class.info-box-canvas]=\"type == Type.INFO_BOX\"\n     [ngStyle]=\"type == Type.INFO_BOX ? {top: coordinates.y, left: coordinates.x} : undefined\">\n  <div *ngIf=\"header\" id=\"header\"\n       class=\"header\">\n    <div class=\"title\">\n      <a>{{ title }}</a>\n    </div>\n    <div class=\"bar\"></div>\n    <biit-icon *ngIf=\"closable\" id=\"popup-x-button\"\n               class=\"close\"\n               [name]=\"'cross_wide'\"\n               [pathStyle]=\"{fill: '#000000'}\"\n               (click)=\"onClosed.emit()\"\n    ></biit-icon>\n  </div>\n  <div class=\"content\" id=\"content\">\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </div>\n</div>\n\n<ng-template #content>\n  <ng-content></ng-content>\n</ng-template>\n", styles: [".popup-background{position:fixed;top:0;left:0;width:100%;height:100%;z-index:10}.popup-background.dark-bg{background-color:var(--popup-background-color)}.popup-canvas{position:fixed;display:flex;flex-direction:column;row-gap:.7rem;top:50%;left:50%;transform:translate(-50%,-50%);min-width:30rem;background-color:var(--popup-background);z-index:12;border:3px solid var(--popup-color);box-sizing:border-box;padding:2.1rem}.popup-canvas>.content{display:inline-flex}@media screen and (max-width: 600px){.popup-canvas{top:0!important;left:0!important;transform:unset!important;height:100%!important;width:100%!important;text-align:center;min-width:unset!important}}@media screen and (max-width: 800px){.sixty-canvas{width:100vw!important;padding:1rem!important}}.sixty-canvas{position:fixed;display:flex;flex-direction:column;row-gap:.7rem;top:0;right:0;width:60vw;height:100vh;background-color:var(--popup-background);z-index:11;border:3px solid var(--popup-color);box-sizing:border-box;padding:2.1rem 2.1rem 3rem}.sixty-canvas>.content{display:inline-flex;width:100%;height:-moz-fit-content;height:fit-content;flex-grow:1;overflow-y:auto}.popup-canvas .header,.sixty-canvas .header{position:relative;display:flex;align-items:center;justify-content:flex-end;height:2.1rem;width:100%;flex-shrink:0}.popup-canvas .header .title,.sixty-canvas .header .title{display:inline-flex;flex-grow:1;max-width:90%;text-transform:uppercase;font-size:1.5rem;font-weight:bolder;position:absolute;left:0}.popup-canvas .header .title a,.sixty-canvas .header .title a{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.popup-canvas .header .bar,.sixty-canvas .header .bar{position:absolute;bottom:0;left:0;height:3px;width:60%;background:var(--popup-color)}.popup-canvas .header .close,.sixty-canvas .header .close{display:inline-flex;height:.9rem;width:.9rem;cursor:pointer}.info-box-canvas{position:fixed;width:23.5rem;display:flex;flex-direction:column;padding:1.5rem;background:var(--popup-background);border:3px solid var(--popup-color);gap:.75rem}.info-box-canvas .bar{display:none}.info-box-canvas .header{display:flex;align-items:start}.info-box-canvas .header .title{font-weight:700;text-transform:uppercase;flex-grow:1;padding-right:.5rem}.info-box-canvas .close{height:.8rem;width:1rem;flex-shrink:0;margin-top:.2rem;cursor:pointer}.info-box-canvas>.content{display:inline-flex}@media screen and (max-width: 600px){.popup-canvas>.content{justify-content:center}}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2.BiitIconComponent, selector: "biit-icon", inputs: ["name", "svgStyle", "pathStyle"] }] });
+BiitPopupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: BiitPopupComponent, selector: "biit-popup", inputs: { title: "title", mouseEvent: "mouseEvent" }, outputs: { onClosed: "onClosed" }, host: { listeners: { "document:keydown.escape": "onEscPress($event)" } }, viewQueries: [{ propertyName: "popup", first: true, predicate: ["popup"], descendants: true }], ngImport: i0, template: "<div *ngIf=\"type !== Type.INFO_BOX\" [class.dark-bg]=\"background\" class=\"popup-background\"\n     (click)=\"closableOutside ? onClosed.emit() : false\">\n</div>\n<div #popup id=\"biit-popup\"\n     [class.popup-canvas]=\"type == Type.DEFAULT\"\n     [class.sixty-canvas]=\"type == Type.SIXTY\"\n     [class.info-box-canvas]=\"type == Type.INFO_BOX\"\n     [ngStyle]=\"type == Type.INFO_BOX ? {top: coordinates.y, left: coordinates.x} : undefined\">\n  <div *ngIf=\"header\" id=\"header\"\n       class=\"header\">\n    <div class=\"title\">\n      <a>{{ title }}</a>\n    </div>\n    <div class=\"bar\"></div>\n    <biit-icon *ngIf=\"closable\" id=\"popup-x-button\"\n               class=\"close\"\n               [name]=\"'cross_wide'\"\n               [pathStyle]=\"{fill: 'var(--popup-close-button)'}\"\n               (click)=\"onClosed.emit()\"\n    ></biit-icon>\n  </div>\n  <div class=\"content\" id=\"content\">\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </div>\n</div>\n\n<ng-template #content>\n  <ng-content></ng-content>\n</ng-template>\n", styles: [".popup-background{position:fixed;top:0;left:0;width:100%;height:100%;z-index:10}.popup-background.dark-bg{background-color:var(--popup-background-color)}.popup-canvas{position:fixed;display:flex;flex-direction:column;row-gap:.7rem;top:50%;left:50%;transform:translate(-50%,-50%);min-width:30rem;background-color:var(--popup-background);z-index:12;border:3px solid var(--popup-color);box-sizing:border-box;padding:2.1rem}.popup-canvas>.content{display:inline-flex}@media screen and (max-width: 600px){.popup-canvas{top:0!important;left:0!important;transform:unset!important;height:100%!important;width:100%!important;text-align:center;min-width:unset!important}}@media screen and (max-width: 800px){.sixty-canvas{width:100vw!important;padding:1rem!important}}.sixty-canvas{position:fixed;display:flex;flex-direction:column;row-gap:.7rem;top:0;right:0;width:60vw;height:100vh;background-color:var(--popup-background);z-index:11;border:3px solid var(--popup-color);box-sizing:border-box;padding:2.1rem 2.1rem 3rem}.sixty-canvas>.content{display:inline-flex;width:100%;height:-moz-fit-content;height:fit-content;flex-grow:1;overflow-y:auto}.popup-canvas .header,.sixty-canvas .header{position:relative;display:flex;align-items:center;justify-content:flex-end;height:2.1rem;width:100%;flex-shrink:0}.popup-canvas .header .title,.sixty-canvas .header .title{display:inline-flex;flex-grow:1;max-width:90%;text-transform:uppercase;font-size:1.5rem;font-weight:bolder;position:absolute;left:0}.popup-canvas .header .title a,.sixty-canvas .header .title a{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.popup-canvas .header .bar,.sixty-canvas .header .bar{position:absolute;bottom:0;left:0;height:3px;width:60%;background:var(--popup-color)}.popup-canvas .header .close,.sixty-canvas .header .close{display:inline-flex;height:.9rem;width:.9rem;cursor:pointer}.info-box-canvas{position:fixed;width:23.5rem;display:flex;flex-direction:column;padding:1.5rem;background:var(--popup-background);border:3px solid var(--popup-color);gap:.75rem}.info-box-canvas .bar{display:none}.info-box-canvas .header{display:flex;align-items:start}.info-box-canvas .header .title{font-weight:700;text-transform:uppercase;flex-grow:1;padding-right:.5rem}.info-box-canvas .close{height:.8rem;width:1rem;flex-shrink:0;margin-top:.2rem;cursor:pointer}.info-box-canvas>.content{display:inline-flex}@media screen and (max-width: 600px){.popup-canvas>.content{justify-content:center}}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2.BiitIconComponent, selector: "biit-icon", inputs: ["name", "svgStyle", "pathStyle"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BiitPopupComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'biit-popup', template: "<div *ngIf=\"type !== Type.INFO_BOX\" [class.dark-bg]=\"background\" class=\"popup-background\"\n     (click)=\"closableOutside ? onClosed.emit() : false\">\n</div>\n<div #popup id=\"biit-popup\"\n     [class.popup-canvas]=\"type == Type.DEFAULT\"\n     [class.sixty-canvas]=\"type == Type.SIXTY\"\n     [class.info-box-canvas]=\"type == Type.INFO_BOX\"\n     [ngStyle]=\"type == Type.INFO_BOX ? {top: coordinates.y, left: coordinates.x} : undefined\">\n  <div *ngIf=\"header\" id=\"header\"\n       class=\"header\">\n    <div class=\"title\">\n      <a>{{ title }}</a>\n    </div>\n    <div class=\"bar\"></div>\n    <biit-icon *ngIf=\"closable\" id=\"popup-x-button\"\n               class=\"close\"\n               [name]=\"'cross_wide'\"\n               [pathStyle]=\"{fill: '#000000'}\"\n               (click)=\"onClosed.emit()\"\n    ></biit-icon>\n  </div>\n  <div class=\"content\" id=\"content\">\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </div>\n</div>\n\n<ng-template #content>\n  <ng-content></ng-content>\n</ng-template>\n", styles: [".popup-background{position:fixed;top:0;left:0;width:100%;height:100%;z-index:10}.popup-background.dark-bg{background-color:var(--popup-background-color)}.popup-canvas{position:fixed;display:flex;flex-direction:column;row-gap:.7rem;top:50%;left:50%;transform:translate(-50%,-50%);min-width:30rem;background-color:var(--popup-background);z-index:12;border:3px solid var(--popup-color);box-sizing:border-box;padding:2.1rem}.popup-canvas>.content{display:inline-flex}@media screen and (max-width: 600px){.popup-canvas{top:0!important;left:0!important;transform:unset!important;height:100%!important;width:100%!important;text-align:center;min-width:unset!important}}@media screen and (max-width: 800px){.sixty-canvas{width:100vw!important;padding:1rem!important}}.sixty-canvas{position:fixed;display:flex;flex-direction:column;row-gap:.7rem;top:0;right:0;width:60vw;height:100vh;background-color:var(--popup-background);z-index:11;border:3px solid var(--popup-color);box-sizing:border-box;padding:2.1rem 2.1rem 3rem}.sixty-canvas>.content{display:inline-flex;width:100%;height:-moz-fit-content;height:fit-content;flex-grow:1;overflow-y:auto}.popup-canvas .header,.sixty-canvas .header{position:relative;display:flex;align-items:center;justify-content:flex-end;height:2.1rem;width:100%;flex-shrink:0}.popup-canvas .header .title,.sixty-canvas .header .title{display:inline-flex;flex-grow:1;max-width:90%;text-transform:uppercase;font-size:1.5rem;font-weight:bolder;position:absolute;left:0}.popup-canvas .header .title a,.sixty-canvas .header .title a{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.popup-canvas .header .bar,.sixty-canvas .header .bar{position:absolute;bottom:0;left:0;height:3px;width:60%;background:var(--popup-color)}.popup-canvas .header .close,.sixty-canvas .header .close{display:inline-flex;height:.9rem;width:.9rem;cursor:pointer}.info-box-canvas{position:fixed;width:23.5rem;display:flex;flex-direction:column;padding:1.5rem;background:var(--popup-background);border:3px solid var(--popup-color);gap:.75rem}.info-box-canvas .bar{display:none}.info-box-canvas .header{display:flex;align-items:start}.info-box-canvas .header .title{font-weight:700;text-transform:uppercase;flex-grow:1;padding-right:.5rem}.info-box-canvas .close{height:.8rem;width:1rem;flex-shrink:0;margin-top:.2rem;cursor:pointer}.info-box-canvas>.content{display:inline-flex}@media screen and (max-width: 600px){.popup-canvas>.content{justify-content:center}}\n"] }]
+            args: [{ selector: 'biit-popup', template: "<div *ngIf=\"type !== Type.INFO_BOX\" [class.dark-bg]=\"background\" class=\"popup-background\"\n     (click)=\"closableOutside ? onClosed.emit() : false\">\n</div>\n<div #popup id=\"biit-popup\"\n     [class.popup-canvas]=\"type == Type.DEFAULT\"\n     [class.sixty-canvas]=\"type == Type.SIXTY\"\n     [class.info-box-canvas]=\"type == Type.INFO_BOX\"\n     [ngStyle]=\"type == Type.INFO_BOX ? {top: coordinates.y, left: coordinates.x} : undefined\">\n  <div *ngIf=\"header\" id=\"header\"\n       class=\"header\">\n    <div class=\"title\">\n      <a>{{ title }}</a>\n    </div>\n    <div class=\"bar\"></div>\n    <biit-icon *ngIf=\"closable\" id=\"popup-x-button\"\n               class=\"close\"\n               [name]=\"'cross_wide'\"\n               [pathStyle]=\"{fill: 'var(--popup-close-button)'}\"\n               (click)=\"onClosed.emit()\"\n    ></biit-icon>\n  </div>\n  <div class=\"content\" id=\"content\">\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n  </div>\n</div>\n\n<ng-template #content>\n  <ng-content></ng-content>\n</ng-template>\n", styles: [".popup-background{position:fixed;top:0;left:0;width:100%;height:100%;z-index:10}.popup-background.dark-bg{background-color:var(--popup-background-color)}.popup-canvas{position:fixed;display:flex;flex-direction:column;row-gap:.7rem;top:50%;left:50%;transform:translate(-50%,-50%);min-width:30rem;background-color:var(--popup-background);z-index:12;border:3px solid var(--popup-color);box-sizing:border-box;padding:2.1rem}.popup-canvas>.content{display:inline-flex}@media screen and (max-width: 600px){.popup-canvas{top:0!important;left:0!important;transform:unset!important;height:100%!important;width:100%!important;text-align:center;min-width:unset!important}}@media screen and (max-width: 800px){.sixty-canvas{width:100vw!important;padding:1rem!important}}.sixty-canvas{position:fixed;display:flex;flex-direction:column;row-gap:.7rem;top:0;right:0;width:60vw;height:100vh;background-color:var(--popup-background);z-index:11;border:3px solid var(--popup-color);box-sizing:border-box;padding:2.1rem 2.1rem 3rem}.sixty-canvas>.content{display:inline-flex;width:100%;height:-moz-fit-content;height:fit-content;flex-grow:1;overflow-y:auto}.popup-canvas .header,.sixty-canvas .header{position:relative;display:flex;align-items:center;justify-content:flex-end;height:2.1rem;width:100%;flex-shrink:0}.popup-canvas .header .title,.sixty-canvas .header .title{display:inline-flex;flex-grow:1;max-width:90%;text-transform:uppercase;font-size:1.5rem;font-weight:bolder;position:absolute;left:0}.popup-canvas .header .title a,.sixty-canvas .header .title a{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.popup-canvas .header .bar,.sixty-canvas .header .bar{position:absolute;bottom:0;left:0;height:3px;width:60%;background:var(--popup-color)}.popup-canvas .header .close,.sixty-canvas .header .close{display:inline-flex;height:.9rem;width:.9rem;cursor:pointer}.info-box-canvas{position:fixed;width:23.5rem;display:flex;flex-direction:column;padding:1.5rem;background:var(--popup-background);border:3px solid var(--popup-color);gap:.75rem}.info-box-canvas .bar{display:none}.info-box-canvas .header{display:flex;align-items:start}.info-box-canvas .header .title{font-weight:700;text-transform:uppercase;flex-grow:1;padding-right:.5rem}.info-box-canvas .close{height:.8rem;width:1rem;flex-shrink:0;margin-top:.2rem;cursor:pointer}.info-box-canvas>.content{display:inline-flex}@media screen and (max-width: 600px){.popup-canvas>.content{justify-content:center}}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { title: [{
                 type: Input
             }], mouseEvent: [{
@@ -153,4 +153,4 @@ var BiitPopupType;
     BiitPopupType["SIXTY"] = "sixty";
     BiitPopupType["INFO_BOX"] = "info-box";
 })(BiitPopupType || (BiitPopupType = {}));
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmlpdC1wb3B1cC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy93aXphcmRyeS10aGVtZS9wb3B1cC9zcmMvYmlpdC1wb3B1cC9iaWl0LXBvcHVwLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3dpemFyZHJ5LXRoZW1lL3BvcHVwL3NyYy9iaWl0LXBvcHVwL2JpaXQtcG9wdXAuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUdMLFNBQVMsRUFDVCxTQUFTLEVBRVQsWUFBWSxFQUFFLFlBQVksRUFDMUIsS0FBSyxFQUNMLE1BQU0sRUFDTixTQUFTLEVBQ1YsTUFBTSxlQUFlLENBQUM7Ozs7QUFLdkIsTUFBTSxPQUFPLDRCQUE0QjtJQUN2QyxZQUFvQixNQUEwQjtRQUExQixXQUFNLEdBQU4sTUFBTSxDQUFvQjtRQUM1QyxNQUFNLENBQUMsVUFBVSxHQUFHLEtBQUssQ0FBQztJQUM1QixDQUFDOzswSEFIVSw0QkFBNEI7OEdBQTVCLDRCQUE0Qjs0RkFBNUIsNEJBQTRCO2tCQUh4QyxTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSxZQUFZO2lCQUN2Qjs7QUFVRCxNQUFNLE9BQU8sMEJBQTBCO0lBQ3JDLFlBQW9CLE1BQTBCO1FBQTFCLFdBQU0sR0FBTixNQUFNLENBQW9CO1FBQzVDLE1BQU0sQ0FBQyxNQUFNLEdBQUcsS0FBSyxDQUFDO0lBQ3hCLENBQUM7O3dIQUhVLDBCQUEwQjs0R0FBMUIsMEJBQTBCOzRGQUExQiwwQkFBMEI7a0JBSHRDLFNBQVM7bUJBQUM7b0JBQ1QsUUFBUSxFQUFFLGFBQWE7aUJBQ3hCOztBQVVELE1BQU0sT0FBTywwQkFBMEI7SUFDckMsWUFBb0IsTUFBMEI7UUFBMUIsV0FBTSxHQUFOLE1BQU0sQ0FBb0I7UUFDNUMsTUFBTSxDQUFDLFFBQVEsR0FBRyxJQUFJLENBQUM7SUFDekIsQ0FBQzs7d0hBSFUsMEJBQTBCOzRHQUExQiwwQkFBMEI7NEZBQTFCLDBCQUEwQjtrQkFIdEMsU0FBUzttQkFBQztvQkFDVCxRQUFRLEVBQUUsWUFBWTtpQkFDdkI7O0FBVUQsTUFBTSxPQUFPLGlDQUFpQztJQUM1QyxZQUFvQixNQUEwQjtRQUExQixXQUFNLEdBQU4sTUFBTSxDQUFvQjtRQUM1QyxNQUFNLENBQUMsZUFBZSxHQUFHLElBQUksQ0FBQztJQUNoQyxDQUFDOzsrSEFIVSxpQ0FBaUM7bUhBQWpDLGlDQUFpQzs0RkFBakMsaUNBQWlDO2tCQUg3QyxTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSxvQkFBb0I7aUJBQy9COztBQVVELE1BQU0sT0FBTywyQkFBMkI7SUFDdEMsWUFBb0IsTUFBMEI7UUFBMUIsV0FBTSxHQUFOLE1BQU0sQ0FBb0I7UUFDNUMsTUFBTSxDQUFDLElBQUksR0FBRyxhQUFhLENBQUMsS0FBSyxDQUFDO0lBQ3BDLENBQUM7O3lIQUhVLDJCQUEyQjs2R0FBM0IsMkJBQTJCOzRGQUEzQiwyQkFBMkI7a0JBSHZDLFNBQVM7bUJBQUM7b0JBQ1QsUUFBUSxFQUFFLGNBQWM7aUJBQ3pCOztBQVVELE1BQU0sT0FBTyx5QkFBeUI7SUFDcEMsWUFBb0IsTUFBMEI7UUFBMUIsV0FBTSxHQUFOLE1BQU0sQ0FBb0I7UUFDNUMsTUFBTSxDQUFDLElBQUksR0FBRyxhQUFhLENBQUMsUUFBUSxDQUFDO0lBQ3ZDLENBQUM7O3VIQUhVLHlCQUF5QjsyR0FBekIseUJBQXlCOzRGQUF6Qix5QkFBeUI7a0JBSHJDLFNBQVM7bUJBQUM7b0JBQ1QsUUFBUSxFQUFFLFlBQVk7aUJBQ3ZCOztBQWNELE1BQU0sT0FBTyxrQkFBa0I7SUFld0IsVUFBVSxDQUFDLEtBQW9CO1FBQ2xGLElBQUksQ0FBQyxRQUFRLENBQUMsSUFBSSxFQUFFLENBQUM7SUFDdkIsQ0FBQztJQUVELFlBQW9CLEtBQXlCO1FBQXpCLFVBQUssR0FBTCxLQUFLLENBQW9CO1FBbEJwQyxVQUFLLEdBQVcsRUFBRSxDQUFDO1FBRWxCLGFBQVEsR0FBdUIsSUFBSSxZQUFZLEVBQVEsQ0FBQztRQUdsRSxlQUFVLEdBQVksSUFBSSxDQUFDO1FBQzNCLFdBQU0sR0FBWSxJQUFJLENBQUM7UUFDdkIsYUFBUSxHQUFZLEtBQUssQ0FBQztRQUMxQixvQkFBZSxHQUFZLEtBQUssQ0FBQztRQUNqQyxTQUFJLEdBQWtCLGFBQWEsQ0FBQyxPQUFPLENBQUM7UUFDNUMsZ0JBQVcsR0FBNkIsRUFBRSxDQUFDLEVBQUUsU0FBUyxFQUFFLENBQUMsRUFBRSxTQUFTLEVBQUUsQ0FBQztRQUVwRCxTQUFJLEdBQUcsYUFBYSxDQUFDO0lBT3hDLENBQUM7SUFFRCxlQUFlO1FBQ2IsSUFBSSxJQUFJLENBQUMsSUFBSSxJQUFJLGFBQWEsQ0FBQyxRQUFRLEVBQUU7WUFDdkMsTUFBTSxHQUFHLEdBQUcsVUFBVSxDQUFDLGdCQUFnQixDQUFDLFFBQVEsQ0FBQyxlQUFlLENBQUMsQ0FBQyxRQUFRLENBQUMsQ0FBQztZQUM1RSxNQUFNLFVBQVUsR0FBRyxHQUFHLEdBQUcsSUFBSSxHQUFHLENBQUMsQ0FBQztZQUVsQyxrQ0FBa0M7WUFDbEMsTUFBTSxVQUFVLEdBQUcsSUFBSSxDQUFDLFVBQVUsQ0FBQyxDQUFDLEdBQUcsSUFBSSxDQUFDLEtBQUssQ0FBQyxhQUFhLENBQUMsWUFBWSxHQUFHLEdBQUcsR0FBQyxHQUFHLEdBQUcsTUFBTSxDQUFDLFdBQVcsQ0FBQztZQUM1RyxNQUFNLFFBQVEsR0FBRyxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUMsR0FBRyxVQUFVLEdBQUMsQ0FBQyxHQUFHLENBQUMsQ0FBQztZQUN0RCxNQUFNLFNBQVMsR0FBRyxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUMsR0FBRyxVQUFVLEdBQUMsQ0FBQyxHQUFHLE1BQU0sQ0FBQyxVQUFVLENBQUM7WUFFdkUsSUFBSSxVQUFVLEVBQUU7Z0JBQ2QsSUFBSSxDQUFDLFdBQVcsQ0FBQyxDQUFDLEdBQUcsSUFBSSxDQUFDLFVBQVUsQ0FBQyxDQUFDLEdBQUcsR0FBRyxHQUFDLEdBQUcsR0FBRyxJQUFJLENBQUM7YUFDekQ7aUJBQU07Z0JBQ0wsSUFBSSxDQUFDLFdBQVcsQ0FBQyxDQUFDLEdBQUcsSUFBSSxDQUFDLFVBQVUsQ0FBQyxDQUFDLEdBQUcsSUFBSSxDQUFDLEtBQUssQ0FBQyxhQUFhLENBQUMsWUFBWSxHQUFHLElBQUksQ0FBQzthQUN2RjtZQUVELElBQUksQ0FBQyxRQUFRLEVBQUU7Z0JBQ2IsSUFBSSxDQUFDLFdBQVcsQ0FBQyxDQUFDLEdBQUcsS0FBSyxDQUFDO2FBQzVCO2lCQUFNLElBQUksQ0FBQyxTQUFTLEVBQUU7Z0JBQ3JCLElBQUksQ0FBQyxXQUFXLENBQUMsQ0FBQyxHQUFHLE1BQU0sQ0FBQyxVQUFVLEdBQUcsVUFBVSxHQUFHLElBQUksQ0FBQzthQUM1RDtpQkFBTTtnQkFDTCxJQUFJLENBQUMsV0FBVyxDQUFDLENBQUMsR0FBRyxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUMsR0FBRyxVQUFVLEdBQUMsQ0FBQyxHQUFHLElBQUksQ0FBQzthQUM5RDtZQUVELElBQUksQ0FBQyxLQUFLLENBQUMsYUFBYSxFQUFFLENBQUM7U0FDNUI7SUFDSCxDQUFDOztnSEFoRFUsa0JBQWtCO29HQUFsQixrQkFBa0IscVRDekUvQix5aUNBNkJBOzRGRDRDYSxrQkFBa0I7a0JBTDlCLFNBQVM7K0JBQ0UsWUFBWTt3R0FLYixLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csVUFBVTtzQkFBbEIsS0FBSztnQkFDSSxRQUFRO3NCQUFqQixNQUFNO2dCQUNhLEtBQUs7c0JBQXhCLFNBQVM7dUJBQUMsT0FBTztnQkFXbUMsVUFBVTtzQkFBOUQsWUFBWTt1QkFBQyx5QkFBeUIsRUFBRSxDQUFDLFFBQVEsQ0FBQzs7QUFvQ3JELElBQUssYUFJSjtBQUpELFdBQUssYUFBYTtJQUNoQixvQ0FBbUIsQ0FBQTtJQUNuQixnQ0FBZSxDQUFBO0lBQ2Ysc0NBQXFCLENBQUE7QUFDdkIsQ0FBQyxFQUpJLGFBQWEsS0FBYixhQUFhLFFBSWpCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgQWZ0ZXJWaWV3SW5pdCxcbiAgQ2hhbmdlRGV0ZWN0b3JSZWYsXG4gIENvbXBvbmVudCxcbiAgRGlyZWN0aXZlLFxuICBFbGVtZW50UmVmLFxuICBFdmVudEVtaXR0ZXIsIEhvc3RMaXN0ZW5lcixcbiAgSW5wdXQsXG4gIE91dHB1dCxcbiAgVmlld0NoaWxkXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5ARGlyZWN0aXZlKHtcbiAgc2VsZWN0b3I6ICdbY2xlYXItYmddJ1xufSlcbmV4cG9ydCBjbGFzcyBCaWl0UG9wdXBCYWNrZ3JvdW5kRGlyZWN0aXZlIHtcbiAgY29uc3RydWN0b3IocHJpdmF0ZSBwYXJlbnQ6IEJpaXRQb3B1cENvbXBvbmVudCkge1xuICAgIHBhcmVudC5iYWNrZ3JvdW5kID0gZmFsc2U7XG4gIH1cbn1cblxuQERpcmVjdGl2ZSh7XG4gIHNlbGVjdG9yOiAnW25vLWhlYWRlcl0nXG59KVxuZXhwb3J0IGNsYXNzIEJpaXRQb3B1cE5vSGVhZGVyRGlyZWN0aXZlIHtcbiAgY29uc3RydWN0b3IocHJpdmF0ZSBwYXJlbnQ6IEJpaXRQb3B1cENvbXBvbmVudCkge1xuICAgIHBhcmVudC5oZWFkZXIgPSBmYWxzZTtcbiAgfVxufVxuXG5ARGlyZWN0aXZlKHtcbiAgc2VsZWN0b3I6ICdbY2xvc2FibGVdJ1xufSlcbmV4cG9ydCBjbGFzcyBCaWl0UG9wdXBDbG9zYWJsZURpcmVjdGl2ZSB7XG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgcGFyZW50OiBCaWl0UG9wdXBDb21wb25lbnQpIHtcbiAgICBwYXJlbnQuY2xvc2FibGUgPSB0cnVlO1xuICB9XG59XG5cbkBEaXJlY3RpdmUoe1xuICBzZWxlY3RvcjogJ1tjbG9zYWJsZS1vdXRzaWRlXSdcbn0pXG5leHBvcnQgY2xhc3MgQmlpdFBvcHVwQ2xvc2FibGVPdXRzaWRlRGlyZWN0aXZlIHtcbiAgY29uc3RydWN0b3IocHJpdmF0ZSBwYXJlbnQ6IEJpaXRQb3B1cENvbXBvbmVudCkge1xuICAgIHBhcmVudC5jbG9zYWJsZU91dHNpZGUgPSB0cnVlO1xuICB9XG59XG5cbkBEaXJlY3RpdmUoe1xuICBzZWxlY3RvcjogJ1tzaXh0eS12aWV3XSdcbn0pXG5leHBvcnQgY2xhc3MgQmlpdFBvcHVwU2l4dHlWaWV3RGlyZWN0aXZlIHtcbiAgY29uc3RydWN0b3IocHJpdmF0ZSBwYXJlbnQ6IEJpaXRQb3B1cENvbXBvbmVudCkge1xuICAgIHBhcmVudC50eXBlID0gQmlpdFBvcHVwVHlwZS5TSVhUWTtcbiAgfVxufVxuXG5ARGlyZWN0aXZlKHtcbiAgc2VsZWN0b3I6ICdbaW5mby1ib3hdJ1xufSlcbmV4cG9ydCBjbGFzcyBCaWl0UG9wdXBJbmZvQm94RGlyZWN0aXZlIHtcbiAgY29uc3RydWN0b3IocHJpdmF0ZSBwYXJlbnQ6IEJpaXRQb3B1cENvbXBvbmVudCkge1xuICAgIHBhcmVudC50eXBlID0gQmlpdFBvcHVwVHlwZS5JTkZPX0JPWDtcbiAgfVxufVxuXG5cblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnYmlpdC1wb3B1cCcsXG4gIHRlbXBsYXRlVXJsOiAnLi9iaWl0LXBvcHVwLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vYmlpdC1wb3B1cC5jb21wb25lbnQuc2NzcyddXG59KVxuZXhwb3J0IGNsYXNzIEJpaXRQb3B1cENvbXBvbmVudCBpbXBsZW1lbnRzIEFmdGVyVmlld0luaXQge1xuICBASW5wdXQoKSB0aXRsZTogc3RyaW5nID0gJyc7XG4gIEBJbnB1dCgpIG1vdXNlRXZlbnQ6IE1vdXNlRXZlbnQ7XG4gIEBPdXRwdXQoKSBvbkNsb3NlZDogRXZlbnRFbWl0dGVyPHZvaWQ+ID0gbmV3IEV2ZW50RW1pdHRlcjx2b2lkPigpO1xuICBAVmlld0NoaWxkKCdwb3B1cCcpIHBvcHVwOiBFbGVtZW50UmVmO1xuXG4gIGJhY2tncm91bmQ6IGJvb2xlYW4gPSB0cnVlO1xuICBoZWFkZXI6IGJvb2xlYW4gPSB0cnVlO1xuICBjbG9zYWJsZTogYm9vbGVhbiA9IGZhbHNlO1xuICBjbG9zYWJsZU91dHNpZGU6IGJvb2xlYW4gPSBmYWxzZTtcbiAgdHlwZTogQmlpdFBvcHVwVHlwZSA9IEJpaXRQb3B1cFR5cGUuREVGQVVMVDtcbiAgY29vcmRpbmF0ZXM6IHsgeDogc3RyaW5nLCB5OiBzdHJpbmcgfSA9IHsgeDogdW5kZWZpbmVkLCB5OiB1bmRlZmluZWQgfTtcblxuICBwcm90ZWN0ZWQgcmVhZG9ubHkgVHlwZSA9IEJpaXRQb3B1cFR5cGU7XG5cbiAgQEhvc3RMaXN0ZW5lcignZG9jdW1lbnQ6a2V5ZG93bi5lc2NhcGUnLCBbJyRldmVudCddKSBvbkVzY1ByZXNzKGV2ZW50OiBLZXlib2FyZEV2ZW50KSB7XG4gICAgdGhpcy5vbkNsb3NlZC5lbWl0KCk7XG4gIH1cblxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIGNkUmVmIDogQ2hhbmdlRGV0ZWN0b3JSZWYpIHtcbiAgfVxuXG4gIG5nQWZ0ZXJWaWV3SW5pdCgpIHtcbiAgICBpZiAodGhpcy50eXBlID09IEJpaXRQb3B1cFR5cGUuSU5GT19CT1gpIHtcbiAgICAgIGNvbnN0IHJlbSA9IHBhcnNlRmxvYXQoZ2V0Q29tcHV0ZWRTdHlsZShkb2N1bWVudC5kb2N1bWVudEVsZW1lbnQpLmZvbnRTaXplKTtcbiAgICAgIGNvbnN0IHBvcHVwV2lkdGggPSByZW0gKiAyNi41ICsgNjtcblxuICAgICAgLy8gQ2hlY2tpbmcgYXZhaWxhYmxlIHNjcmVlbiBzcGFjZVxuICAgICAgY29uc3QgZml0c0JvdHRvbSA9IHRoaXMubW91c2VFdmVudC55ICsgdGhpcy5wb3B1cC5uYXRpdmVFbGVtZW50Lm9mZnNldEhlaWdodCArIDAuNSpyZW0gPCB3aW5kb3cuaW5uZXJIZWlnaHQ7XG4gICAgICBjb25zdCBmaXRzTGVmdCA9IHRoaXMubW91c2VFdmVudC54IC0gcG9wdXBXaWR0aC8yID4gMDtcbiAgICAgIGNvbnN0IGZpdHNSaWdodCA9IHRoaXMubW91c2VFdmVudC54ICsgcG9wdXBXaWR0aC8yIDwgd2luZG93LmlubmVyV2lkdGg7XG5cbiAgICAgIGlmIChmaXRzQm90dG9tKSB7XG4gICAgICAgIHRoaXMuY29vcmRpbmF0ZXMueSA9IHRoaXMubW91c2VFdmVudC55ICsgMC41KnJlbSArIFwicHhcIjtcbiAgICAgIH0gZWxzZSB7XG4gICAgICAgIHRoaXMuY29vcmRpbmF0ZXMueSA9IHRoaXMubW91c2VFdmVudC55IC0gdGhpcy5wb3B1cC5uYXRpdmVFbGVtZW50Lm9mZnNldEhlaWdodCArIFwicHhcIjtcbiAgICAgIH1cblxuICAgICAgaWYgKCFmaXRzTGVmdCkge1xuICAgICAgICB0aGlzLmNvb3JkaW5hdGVzLnggPSBcIjBweFwiO1xuICAgICAgfSBlbHNlIGlmICghZml0c1JpZ2h0KSB7XG4gICAgICAgIHRoaXMuY29vcmRpbmF0ZXMueCA9IHdpbmRvdy5pbm5lcldpZHRoIC0gcG9wdXBXaWR0aCArIFwicHhcIjtcbiAgICAgIH0gZWxzZSB7XG4gICAgICAgIHRoaXMuY29vcmRpbmF0ZXMueCA9IHRoaXMubW91c2VFdmVudC54IC0gcG9wdXBXaWR0aC8yICsgXCJweFwiO1xuICAgICAgfVxuXG4gICAgICB0aGlzLmNkUmVmLmRldGVjdENoYW5nZXMoKTtcbiAgICB9XG4gIH1cbn1cblxuZW51bSBCaWl0UG9wdXBUeXBlIHtcbiAgREVGQVVMVCA9ICdkZWZhdWx0JyxcbiAgU0lYVFkgPSAnc2l4dHknLFxuICBJTkZPX0JPWCA9ICdpbmZvLWJveCdcbn1cbiIsIjxkaXYgKm5nSWY9XCJ0eXBlICE9PSBUeXBlLklORk9fQk9YXCIgW2NsYXNzLmRhcmstYmddPVwiYmFja2dyb3VuZFwiIGNsYXNzPVwicG9wdXAtYmFja2dyb3VuZFwiXG4gICAgIChjbGljayk9XCJjbG9zYWJsZU91dHNpZGUgPyBvbkNsb3NlZC5lbWl0KCkgOiBmYWxzZVwiPlxuPC9kaXY+XG48ZGl2ICNwb3B1cCBpZD1cImJpaXQtcG9wdXBcIlxuICAgICBbY2xhc3MucG9wdXAtY2FudmFzXT1cInR5cGUgPT0gVHlwZS5ERUZBVUxUXCJcbiAgICAgW2NsYXNzLnNpeHR5LWNhbnZhc109XCJ0eXBlID09IFR5cGUuU0lYVFlcIlxuICAgICBbY2xhc3MuaW5mby1ib3gtY2FudmFzXT1cInR5cGUgPT0gVHlwZS5JTkZPX0JPWFwiXG4gICAgIFtuZ1N0eWxlXT1cInR5cGUgPT0gVHlwZS5JTkZPX0JPWCA/IHt0b3A6IGNvb3JkaW5hdGVzLnksIGxlZnQ6IGNvb3JkaW5hdGVzLnh9IDogdW5kZWZpbmVkXCI+XG4gIDxkaXYgKm5nSWY9XCJoZWFkZXJcIiBpZD1cImhlYWRlclwiXG4gICAgICAgY2xhc3M9XCJoZWFkZXJcIj5cbiAgICA8ZGl2IGNsYXNzPVwidGl0bGVcIj5cbiAgICAgIDxhPnt7IHRpdGxlIH19PC9hPlxuICAgIDwvZGl2PlxuICAgIDxkaXYgY2xhc3M9XCJiYXJcIj48L2Rpdj5cbiAgICA8YmlpdC1pY29uICpuZ0lmPVwiY2xvc2FibGVcIiBpZD1cInBvcHVwLXgtYnV0dG9uXCJcbiAgICAgICAgICAgICAgIGNsYXNzPVwiY2xvc2VcIlxuICAgICAgICAgICAgICAgW25hbWVdPVwiJ2Nyb3NzX3dpZGUnXCJcbiAgICAgICAgICAgICAgIFtwYXRoU3R5bGVdPVwie2ZpbGw6ICcjMDAwMDAwJ31cIlxuICAgICAgICAgICAgICAgKGNsaWNrKT1cIm9uQ2xvc2VkLmVtaXQoKVwiXG4gICAgPjwvYmlpdC1pY29uPlxuICA8L2Rpdj5cbiAgPGRpdiBjbGFzcz1cImNvbnRlbnRcIiBpZD1cImNvbnRlbnRcIj5cbiAgICA8bmctY29udGFpbmVyICpuZ1RlbXBsYXRlT3V0bGV0PVwiY29udGVudFwiPjwvbmctY29udGFpbmVyPlxuICA8L2Rpdj5cbjwvZGl2PlxuXG48bmctdGVtcGxhdGUgI2NvbnRlbnQ+XG4gIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cbjwvbmctdGVtcGxhdGU+XG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmlpdC1wb3B1cC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy93aXphcmRyeS10aGVtZS9wb3B1cC9zcmMvYmlpdC1wb3B1cC9iaWl0LXBvcHVwLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3dpemFyZHJ5LXRoZW1lL3BvcHVwL3NyYy9iaWl0LXBvcHVwL2JpaXQtcG9wdXAuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUdMLFNBQVMsRUFDVCxTQUFTLEVBRVQsWUFBWSxFQUFFLFlBQVksRUFDMUIsS0FBSyxFQUNMLE1BQU0sRUFDTixTQUFTLEVBQ1YsTUFBTSxlQUFlLENBQUM7Ozs7QUFLdkIsTUFBTSxPQUFPLDRCQUE0QjtJQUN2QyxZQUFvQixNQUEwQjtRQUExQixXQUFNLEdBQU4sTUFBTSxDQUFvQjtRQUM1QyxNQUFNLENBQUMsVUFBVSxHQUFHLEtBQUssQ0FBQztJQUM1QixDQUFDOzswSEFIVSw0QkFBNEI7OEdBQTVCLDRCQUE0Qjs0RkFBNUIsNEJBQTRCO2tCQUh4QyxTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSxZQUFZO2lCQUN2Qjs7QUFVRCxNQUFNLE9BQU8sMEJBQTBCO0lBQ3JDLFlBQW9CLE1BQTBCO1FBQTFCLFdBQU0sR0FBTixNQUFNLENBQW9CO1FBQzVDLE1BQU0sQ0FBQyxNQUFNLEdBQUcsS0FBSyxDQUFDO0lBQ3hCLENBQUM7O3dIQUhVLDBCQUEwQjs0R0FBMUIsMEJBQTBCOzRGQUExQiwwQkFBMEI7a0JBSHRDLFNBQVM7bUJBQUM7b0JBQ1QsUUFBUSxFQUFFLGFBQWE7aUJBQ3hCOztBQVVELE1BQU0sT0FBTywwQkFBMEI7SUFDckMsWUFBb0IsTUFBMEI7UUFBMUIsV0FBTSxHQUFOLE1BQU0sQ0FBb0I7UUFDNUMsTUFBTSxDQUFDLFFBQVEsR0FBRyxJQUFJLENBQUM7SUFDekIsQ0FBQzs7d0hBSFUsMEJBQTBCOzRHQUExQiwwQkFBMEI7NEZBQTFCLDBCQUEwQjtrQkFIdEMsU0FBUzttQkFBQztvQkFDVCxRQUFRLEVBQUUsWUFBWTtpQkFDdkI7O0FBVUQsTUFBTSxPQUFPLGlDQUFpQztJQUM1QyxZQUFvQixNQUEwQjtRQUExQixXQUFNLEdBQU4sTUFBTSxDQUFvQjtRQUM1QyxNQUFNLENBQUMsZUFBZSxHQUFHLElBQUksQ0FBQztJQUNoQyxDQUFDOzsrSEFIVSxpQ0FBaUM7bUhBQWpDLGlDQUFpQzs0RkFBakMsaUNBQWlDO2tCQUg3QyxTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSxvQkFBb0I7aUJBQy9COztBQVVELE1BQU0sT0FBTywyQkFBMkI7SUFDdEMsWUFBb0IsTUFBMEI7UUFBMUIsV0FBTSxHQUFOLE1BQU0sQ0FBb0I7UUFDNUMsTUFBTSxDQUFDLElBQUksR0FBRyxhQUFhLENBQUMsS0FBSyxDQUFDO0lBQ3BDLENBQUM7O3lIQUhVLDJCQUEyQjs2R0FBM0IsMkJBQTJCOzRGQUEzQiwyQkFBMkI7a0JBSHZDLFNBQVM7bUJBQUM7b0JBQ1QsUUFBUSxFQUFFLGNBQWM7aUJBQ3pCOztBQVVELE1BQU0sT0FBTyx5QkFBeUI7SUFDcEMsWUFBb0IsTUFBMEI7UUFBMUIsV0FBTSxHQUFOLE1BQU0sQ0FBb0I7UUFDNUMsTUFBTSxDQUFDLElBQUksR0FBRyxhQUFhLENBQUMsUUFBUSxDQUFDO0lBQ3ZDLENBQUM7O3VIQUhVLHlCQUF5QjsyR0FBekIseUJBQXlCOzRGQUF6Qix5QkFBeUI7a0JBSHJDLFNBQVM7bUJBQUM7b0JBQ1QsUUFBUSxFQUFFLFlBQVk7aUJBQ3ZCOztBQWNELE1BQU0sT0FBTyxrQkFBa0I7SUFld0IsVUFBVSxDQUFDLEtBQW9CO1FBQ2xGLElBQUksQ0FBQyxRQUFRLENBQUMsSUFBSSxFQUFFLENBQUM7SUFDdkIsQ0FBQztJQUVELFlBQW9CLEtBQXlCO1FBQXpCLFVBQUssR0FBTCxLQUFLLENBQW9CO1FBbEJwQyxVQUFLLEdBQVcsRUFBRSxDQUFDO1FBRWxCLGFBQVEsR0FBdUIsSUFBSSxZQUFZLEVBQVEsQ0FBQztRQUdsRSxlQUFVLEdBQVksSUFBSSxDQUFDO1FBQzNCLFdBQU0sR0FBWSxJQUFJLENBQUM7UUFDdkIsYUFBUSxHQUFZLEtBQUssQ0FBQztRQUMxQixvQkFBZSxHQUFZLEtBQUssQ0FBQztRQUNqQyxTQUFJLEdBQWtCLGFBQWEsQ0FBQyxPQUFPLENBQUM7UUFDNUMsZ0JBQVcsR0FBNkIsRUFBRSxDQUFDLEVBQUUsU0FBUyxFQUFFLENBQUMsRUFBRSxTQUFTLEVBQUUsQ0FBQztRQUVwRCxTQUFJLEdBQUcsYUFBYSxDQUFDO0lBT3hDLENBQUM7SUFFRCxlQUFlO1FBQ2IsSUFBSSxJQUFJLENBQUMsSUFBSSxJQUFJLGFBQWEsQ0FBQyxRQUFRLEVBQUU7WUFDdkMsTUFBTSxHQUFHLEdBQUcsVUFBVSxDQUFDLGdCQUFnQixDQUFDLFFBQVEsQ0FBQyxlQUFlLENBQUMsQ0FBQyxRQUFRLENBQUMsQ0FBQztZQUM1RSxNQUFNLFVBQVUsR0FBRyxHQUFHLEdBQUcsSUFBSSxHQUFHLENBQUMsQ0FBQztZQUVsQyxrQ0FBa0M7WUFDbEMsTUFBTSxVQUFVLEdBQUcsSUFBSSxDQUFDLFVBQVUsQ0FBQyxDQUFDLEdBQUcsSUFBSSxDQUFDLEtBQUssQ0FBQyxhQUFhLENBQUMsWUFBWSxHQUFHLEdBQUcsR0FBQyxHQUFHLEdBQUcsTUFBTSxDQUFDLFdBQVcsQ0FBQztZQUM1RyxNQUFNLFFBQVEsR0FBRyxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUMsR0FBRyxVQUFVLEdBQUMsQ0FBQyxHQUFHLENBQUMsQ0FBQztZQUN0RCxNQUFNLFNBQVMsR0FBRyxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUMsR0FBRyxVQUFVLEdBQUMsQ0FBQyxHQUFHLE1BQU0sQ0FBQyxVQUFVLENBQUM7WUFFdkUsSUFBSSxVQUFVLEVBQUU7Z0JBQ2QsSUFBSSxDQUFDLFdBQVcsQ0FBQyxDQUFDLEdBQUcsSUFBSSxDQUFDLFVBQVUsQ0FBQyxDQUFDLEdBQUcsR0FBRyxHQUFDLEdBQUcsR0FBRyxJQUFJLENBQUM7YUFDekQ7aUJBQU07Z0JBQ0wsSUFBSSxDQUFDLFdBQVcsQ0FBQyxDQUFDLEdBQUcsSUFBSSxDQUFDLFVBQVUsQ0FBQyxDQUFDLEdBQUcsSUFBSSxDQUFDLEtBQUssQ0FBQyxhQUFhLENBQUMsWUFBWSxHQUFHLElBQUksQ0FBQzthQUN2RjtZQUVELElBQUksQ0FBQyxRQUFRLEVBQUU7Z0JBQ2IsSUFBSSxDQUFDLFdBQVcsQ0FBQyxDQUFDLEdBQUcsS0FBSyxDQUFDO2FBQzVCO2lCQUFNLElBQUksQ0FBQyxTQUFTLEVBQUU7Z0JBQ3JCLElBQUksQ0FBQyxXQUFXLENBQUMsQ0FBQyxHQUFHLE1BQU0sQ0FBQyxVQUFVLEdBQUcsVUFBVSxHQUFHLElBQUksQ0FBQzthQUM1RDtpQkFBTTtnQkFDTCxJQUFJLENBQUMsV0FBVyxDQUFDLENBQUMsR0FBRyxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUMsR0FBRyxVQUFVLEdBQUMsQ0FBQyxHQUFHLElBQUksQ0FBQzthQUM5RDtZQUVELElBQUksQ0FBQyxLQUFLLENBQUMsYUFBYSxFQUFFLENBQUM7U0FDNUI7SUFDSCxDQUFDOztnSEFoRFUsa0JBQWtCO29HQUFsQixrQkFBa0IscVRDekUvQiwyakNBNkJBOzRGRDRDYSxrQkFBa0I7a0JBTDlCLFNBQVM7K0JBQ0UsWUFBWTt3R0FLYixLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csVUFBVTtzQkFBbEIsS0FBSztnQkFDSSxRQUFRO3NCQUFqQixNQUFNO2dCQUNhLEtBQUs7c0JBQXhCLFNBQVM7dUJBQUMsT0FBTztnQkFXbUMsVUFBVTtzQkFBOUQsWUFBWTt1QkFBQyx5QkFBeUIsRUFBRSxDQUFDLFFBQVEsQ0FBQzs7QUFvQ3JELElBQUssYUFJSjtBQUpELFdBQUssYUFBYTtJQUNoQixvQ0FBbUIsQ0FBQTtJQUNuQixnQ0FBZSxDQUFBO0lBQ2Ysc0NBQXFCLENBQUE7QUFDdkIsQ0FBQyxFQUpJLGFBQWEsS0FBYixhQUFhLFFBSWpCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgQWZ0ZXJWaWV3SW5pdCxcbiAgQ2hhbmdlRGV0ZWN0b3JSZWYsXG4gIENvbXBvbmVudCxcbiAgRGlyZWN0aXZlLFxuICBFbGVtZW50UmVmLFxuICBFdmVudEVtaXR0ZXIsIEhvc3RMaXN0ZW5lcixcbiAgSW5wdXQsXG4gIE91dHB1dCxcbiAgVmlld0NoaWxkXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5ARGlyZWN0aXZlKHtcbiAgc2VsZWN0b3I6ICdbY2xlYXItYmddJ1xufSlcbmV4cG9ydCBjbGFzcyBCaWl0UG9wdXBCYWNrZ3JvdW5kRGlyZWN0aXZlIHtcbiAgY29uc3RydWN0b3IocHJpdmF0ZSBwYXJlbnQ6IEJpaXRQb3B1cENvbXBvbmVudCkge1xuICAgIHBhcmVudC5iYWNrZ3JvdW5kID0gZmFsc2U7XG4gIH1cbn1cblxuQERpcmVjdGl2ZSh7XG4gIHNlbGVjdG9yOiAnW25vLWhlYWRlcl0nXG59KVxuZXhwb3J0IGNsYXNzIEJpaXRQb3B1cE5vSGVhZGVyRGlyZWN0aXZlIHtcbiAgY29uc3RydWN0b3IocHJpdmF0ZSBwYXJlbnQ6IEJpaXRQb3B1cENvbXBvbmVudCkge1xuICAgIHBhcmVudC5oZWFkZXIgPSBmYWxzZTtcbiAgfVxufVxuXG5ARGlyZWN0aXZlKHtcbiAgc2VsZWN0b3I6ICdbY2xvc2FibGVdJ1xufSlcbmV4cG9ydCBjbGFzcyBCaWl0UG9wdXBDbG9zYWJsZURpcmVjdGl2ZSB7XG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgcGFyZW50OiBCaWl0UG9wdXBDb21wb25lbnQpIHtcbiAgICBwYXJlbnQuY2xvc2FibGUgPSB0cnVlO1xuICB9XG59XG5cbkBEaXJlY3RpdmUoe1xuICBzZWxlY3RvcjogJ1tjbG9zYWJsZS1vdXRzaWRlXSdcbn0pXG5leHBvcnQgY2xhc3MgQmlpdFBvcHVwQ2xvc2FibGVPdXRzaWRlRGlyZWN0aXZlIHtcbiAgY29uc3RydWN0b3IocHJpdmF0ZSBwYXJlbnQ6IEJpaXRQb3B1cENvbXBvbmVudCkge1xuICAgIHBhcmVudC5jbG9zYWJsZU91dHNpZGUgPSB0cnVlO1xuICB9XG59XG5cbkBEaXJlY3RpdmUoe1xuICBzZWxlY3RvcjogJ1tzaXh0eS12aWV3XSdcbn0pXG5leHBvcnQgY2xhc3MgQmlpdFBvcHVwU2l4dHlWaWV3RGlyZWN0aXZlIHtcbiAgY29uc3RydWN0b3IocHJpdmF0ZSBwYXJlbnQ6IEJpaXRQb3B1cENvbXBvbmVudCkge1xuICAgIHBhcmVudC50eXBlID0gQmlpdFBvcHVwVHlwZS5TSVhUWTtcbiAgfVxufVxuXG5ARGlyZWN0aXZlKHtcbiAgc2VsZWN0b3I6ICdbaW5mby1ib3hdJ1xufSlcbmV4cG9ydCBjbGFzcyBCaWl0UG9wdXBJbmZvQm94RGlyZWN0aXZlIHtcbiAgY29uc3RydWN0b3IocHJpdmF0ZSBwYXJlbnQ6IEJpaXRQb3B1cENvbXBvbmVudCkge1xuICAgIHBhcmVudC50eXBlID0gQmlpdFBvcHVwVHlwZS5JTkZPX0JPWDtcbiAgfVxufVxuXG5cblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnYmlpdC1wb3B1cCcsXG4gIHRlbXBsYXRlVXJsOiAnLi9iaWl0LXBvcHVwLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vYmlpdC1wb3B1cC5jb21wb25lbnQuc2NzcyddXG59KVxuZXhwb3J0IGNsYXNzIEJpaXRQb3B1cENvbXBvbmVudCBpbXBsZW1lbnRzIEFmdGVyVmlld0luaXQge1xuICBASW5wdXQoKSB0aXRsZTogc3RyaW5nID0gJyc7XG4gIEBJbnB1dCgpIG1vdXNlRXZlbnQ6IE1vdXNlRXZlbnQ7XG4gIEBPdXRwdXQoKSBvbkNsb3NlZDogRXZlbnRFbWl0dGVyPHZvaWQ+ID0gbmV3IEV2ZW50RW1pdHRlcjx2b2lkPigpO1xuICBAVmlld0NoaWxkKCdwb3B1cCcpIHBvcHVwOiBFbGVtZW50UmVmO1xuXG4gIGJhY2tncm91bmQ6IGJvb2xlYW4gPSB0cnVlO1xuICBoZWFkZXI6IGJvb2xlYW4gPSB0cnVlO1xuICBjbG9zYWJsZTogYm9vbGVhbiA9IGZhbHNlO1xuICBjbG9zYWJsZU91dHNpZGU6IGJvb2xlYW4gPSBmYWxzZTtcbiAgdHlwZTogQmlpdFBvcHVwVHlwZSA9IEJpaXRQb3B1cFR5cGUuREVGQVVMVDtcbiAgY29vcmRpbmF0ZXM6IHsgeDogc3RyaW5nLCB5OiBzdHJpbmcgfSA9IHsgeDogdW5kZWZpbmVkLCB5OiB1bmRlZmluZWQgfTtcblxuICBwcm90ZWN0ZWQgcmVhZG9ubHkgVHlwZSA9IEJpaXRQb3B1cFR5cGU7XG5cbiAgQEhvc3RMaXN0ZW5lcignZG9jdW1lbnQ6a2V5ZG93bi5lc2NhcGUnLCBbJyRldmVudCddKSBvbkVzY1ByZXNzKGV2ZW50OiBLZXlib2FyZEV2ZW50KSB7XG4gICAgdGhpcy5vbkNsb3NlZC5lbWl0KCk7XG4gIH1cblxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIGNkUmVmIDogQ2hhbmdlRGV0ZWN0b3JSZWYpIHtcbiAgfVxuXG4gIG5nQWZ0ZXJWaWV3SW5pdCgpIHtcbiAgICBpZiAodGhpcy50eXBlID09IEJpaXRQb3B1cFR5cGUuSU5GT19CT1gpIHtcbiAgICAgIGNvbnN0IHJlbSA9IHBhcnNlRmxvYXQoZ2V0Q29tcHV0ZWRTdHlsZShkb2N1bWVudC5kb2N1bWVudEVsZW1lbnQpLmZvbnRTaXplKTtcbiAgICAgIGNvbnN0IHBvcHVwV2lkdGggPSByZW0gKiAyNi41ICsgNjtcblxuICAgICAgLy8gQ2hlY2tpbmcgYXZhaWxhYmxlIHNjcmVlbiBzcGFjZVxuICAgICAgY29uc3QgZml0c0JvdHRvbSA9IHRoaXMubW91c2VFdmVudC55ICsgdGhpcy5wb3B1cC5uYXRpdmVFbGVtZW50Lm9mZnNldEhlaWdodCArIDAuNSpyZW0gPCB3aW5kb3cuaW5uZXJIZWlnaHQ7XG4gICAgICBjb25zdCBmaXRzTGVmdCA9IHRoaXMubW91c2VFdmVudC54IC0gcG9wdXBXaWR0aC8yID4gMDtcbiAgICAgIGNvbnN0IGZpdHNSaWdodCA9IHRoaXMubW91c2VFdmVudC54ICsgcG9wdXBXaWR0aC8yIDwgd2luZG93LmlubmVyV2lkdGg7XG5cbiAgICAgIGlmIChmaXRzQm90dG9tKSB7XG4gICAgICAgIHRoaXMuY29vcmRpbmF0ZXMueSA9IHRoaXMubW91c2VFdmVudC55ICsgMC41KnJlbSArIFwicHhcIjtcbiAgICAgIH0gZWxzZSB7XG4gICAgICAgIHRoaXMuY29vcmRpbmF0ZXMueSA9IHRoaXMubW91c2VFdmVudC55IC0gdGhpcy5wb3B1cC5uYXRpdmVFbGVtZW50Lm9mZnNldEhlaWdodCArIFwicHhcIjtcbiAgICAgIH1cblxuICAgICAgaWYgKCFmaXRzTGVmdCkge1xuICAgICAgICB0aGlzLmNvb3JkaW5hdGVzLnggPSBcIjBweFwiO1xuICAgICAgfSBlbHNlIGlmICghZml0c1JpZ2h0KSB7XG4gICAgICAgIHRoaXMuY29vcmRpbmF0ZXMueCA9IHdpbmRvdy5pbm5lcldpZHRoIC0gcG9wdXBXaWR0aCArIFwicHhcIjtcbiAgICAgIH0gZWxzZSB7XG4gICAgICAgIHRoaXMuY29vcmRpbmF0ZXMueCA9IHRoaXMubW91c2VFdmVudC54IC0gcG9wdXBXaWR0aC8yICsgXCJweFwiO1xuICAgICAgfVxuXG4gICAgICB0aGlzLmNkUmVmLmRldGVjdENoYW5nZXMoKTtcbiAgICB9XG4gIH1cbn1cblxuZW51bSBCaWl0UG9wdXBUeXBlIHtcbiAgREVGQVVMVCA9ICdkZWZhdWx0JyxcbiAgU0lYVFkgPSAnc2l4dHknLFxuICBJTkZPX0JPWCA9ICdpbmZvLWJveCdcbn1cbiIsIjxkaXYgKm5nSWY9XCJ0eXBlICE9PSBUeXBlLklORk9fQk9YXCIgW2NsYXNzLmRhcmstYmddPVwiYmFja2dyb3VuZFwiIGNsYXNzPVwicG9wdXAtYmFja2dyb3VuZFwiXG4gICAgIChjbGljayk9XCJjbG9zYWJsZU91dHNpZGUgPyBvbkNsb3NlZC5lbWl0KCkgOiBmYWxzZVwiPlxuPC9kaXY+XG48ZGl2ICNwb3B1cCBpZD1cImJpaXQtcG9wdXBcIlxuICAgICBbY2xhc3MucG9wdXAtY2FudmFzXT1cInR5cGUgPT0gVHlwZS5ERUZBVUxUXCJcbiAgICAgW2NsYXNzLnNpeHR5LWNhbnZhc109XCJ0eXBlID09IFR5cGUuU0lYVFlcIlxuICAgICBbY2xhc3MuaW5mby1ib3gtY2FudmFzXT1cInR5cGUgPT0gVHlwZS5JTkZPX0JPWFwiXG4gICAgIFtuZ1N0eWxlXT1cInR5cGUgPT0gVHlwZS5JTkZPX0JPWCA/IHt0b3A6IGNvb3JkaW5hdGVzLnksIGxlZnQ6IGNvb3JkaW5hdGVzLnh9IDogdW5kZWZpbmVkXCI+XG4gIDxkaXYgKm5nSWY9XCJoZWFkZXJcIiBpZD1cImhlYWRlclwiXG4gICAgICAgY2xhc3M9XCJoZWFkZXJcIj5cbiAgICA8ZGl2IGNsYXNzPVwidGl0bGVcIj5cbiAgICAgIDxhPnt7IHRpdGxlIH19PC9hPlxuICAgIDwvZGl2PlxuICAgIDxkaXYgY2xhc3M9XCJiYXJcIj48L2Rpdj5cbiAgICA8YmlpdC1pY29uICpuZ0lmPVwiY2xvc2FibGVcIiBpZD1cInBvcHVwLXgtYnV0dG9uXCJcbiAgICAgICAgICAgICAgIGNsYXNzPVwiY2xvc2VcIlxuICAgICAgICAgICAgICAgW25hbWVdPVwiJ2Nyb3NzX3dpZGUnXCJcbiAgICAgICAgICAgICAgIFtwYXRoU3R5bGVdPVwie2ZpbGw6ICd2YXIoLS1wb3B1cC1jbG9zZS1idXR0b24pJ31cIlxuICAgICAgICAgICAgICAgKGNsaWNrKT1cIm9uQ2xvc2VkLmVtaXQoKVwiXG4gICAgPjwvYmlpdC1pY29uPlxuICA8L2Rpdj5cbiAgPGRpdiBjbGFzcz1cImNvbnRlbnRcIiBpZD1cImNvbnRlbnRcIj5cbiAgICA8bmctY29udGFpbmVyICpuZ1RlbXBsYXRlT3V0bGV0PVwiY29udGVudFwiPjwvbmctY29udGFpbmVyPlxuICA8L2Rpdj5cbjwvZGl2PlxuXG48bmctdGVtcGxhdGUgI2NvbnRlbnQ+XG4gIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cbjwvbmctdGVtcGxhdGU+XG4iXX0=

package/esm2020/table/biit-datatable/biit-datatable.component.mjs

@@ -96,10 +96,10 @@ export class BiitDatatableComponent {
     }
 }
 BiitDatatableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BiitDatatableComponent, deps: [{ token: i1.BiitIconService }], target: i0.ɵɵFactoryTarget.Component });
-BiitDatatableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: BiitDatatableComponent, selector: "biit-datatable", inputs: { data: "data", columns: "columns", pageSize: "pageSize", pageSizeList: "pageSizeList", loading: "loading", selectable: "selectable", singleSelection: "singleSelection", scrollbarH: "scrollbarH", hideHeader: "hideHeader", hideFooter: "hideFooter", serverSide: "serverSide", page: "page" }, outputs: { onSelection: "onSelection", onPageChange: "onPageChange" }, providers: [provideTranslocoScope({ scope: 'wizardry-theme/table', alias: 't' })], queries: [{ propertyName: "actionsTpl", first: true, predicate: ["actions"], descendants: true }], viewQueries: [{ propertyName: "table", first: true, predicate: ["table"], descendants: true }], ngImport: i0, template: "<div id=\"biit-table\" class=\"table-canvas\" *transloco=\"let t\">\n  <div class=\"top\" *ngIf=\"!hideHeader\">\n    <div id=\"menu\" class=\"action-bar\">\n      <biit-vertical-menu *ngIf=\"actionsTpl\" class=\"vertical-menu\">\n        <ng-container *ngTemplateOutlet=\"actionsTpl\"></ng-container>\n      </biit-vertical-menu>\n      <div *ngIf=\"actionsTpl\" class=\"horizontal-menu default-menu\">\n        <ng-container *ngTemplateOutlet=\"actionsTpl\"></ng-container>\n      </div>\n      <div class=\"default-menu\" *ngIf=\"!actionsTpl\">\n        <ng-content></ng-content>\n      </div>\n    </div>\n    <div id=\"options\" class=\"options\">\n      <biit-input-text id=\"search\" #searchInput\n                       [ngModel]=\"search\"\n                       (onActionPerformed)=\"\n                         onFilter($event, true);\n                       \"\n                       (ngModelChange)=\"onFilter($event)\"\n                       (focusout)=\"searchInput.value = search\"\n                       icon=\"search\"\n                       [placeholder]=\"t('t.search')\"\n      ></biit-input-text>\n      <biit-multiselect id=\"column-selector\" [ngModel]=\"_columns\"\n                        (ngModelChange)=\"setColumnVisibility($event)\"\n                        [data]=\"allColumns\"\n                        label=\"name\"\n                        value=\"visible\"\n                        [type]=\"BiitMultiselectType.ICON\"\n                        [title]=\"t('t.column-selector')\"\n                        [compact]=\"true\"\n      ></biit-multiselect>\n    </div>\n  </div>\n  <div id=\"content\" class=\"table\">\n    <biit-progress-bar *ngIf=\"loading\"></biit-progress-bar>\n    <ng-container *ngIf=\"!serverSide\">\n      <ngx-datatable #table\n                     [rows]=\"data\"\n                     [columns]=\"_columns\"\n                     [columnMode]=\"'force'\"\n                     [headerHeight]=\"42\"\n                     [footerHeight]=\"hideFooter ? 0 : 34\"\n                     [rowHeight]=\"'auto'\"\n                     [reorderable]=\"false\"\n                     [selectionType]=\"SelectionType.checkbox\"\n                     [selected]=\"selected\"\n                     (select)=\"onSelect($event)\"\n                     (activate)=\"onActivate($event)\"\n                     [virtualization]=\"false\"\n                     [scrollbarVDynamic]=\"true\"\n                     [limit]=\"pageSize\"\n                     [scrollbarH]=\"scrollbarH\"\n                     [messages]=\"{emptyMessage: t('t.empty-message')}\"\n      >\n        <ngx-datatable-column *ngIf=\"selectable && !singleSelection\"\n                              #chkbox\n                              [width]=\"42\"\n                              [sortable]=\"false\"\n                              [canAutoResize]=\"false\"\n                              [draggable]=\"false\"\n                              [resizeable]=\"false\"\n                              [name]=\"'chkbox'\"\n        >\n          <ng-template\n            ngx-datatable-header-template\n            let-value=\"value\"\n            let-allRowsSelected=\"allRowsSelected\"\n            let-selectFn=\"selectFn\"\n          >\n            <biit-checkbox [ngModel]=\"allRowsSelected\" (ngModelChange)=\"selectFn(!allRowsSelected)\"></biit-checkbox>\n          </ng-template>\n          <ng-template\n            ngx-datatable-cell-template\n            let-value=\"value\"\n            let-isSelected=\"isSelected\"\n            let-onCheckboxChangeFn=\"onCheckboxChangeFn\"\n          >\n            <biit-checkbox [ngModel]=\"isSelected\" (ngModelChange)=\"onCheckboxChangeFn($event)\"></biit-checkbox>\n          </ng-template>\n        </ngx-datatable-column>\n\n        <ngx-datatable-column *ngFor=\"let column of _columns\"\n                              [name]=\"column.name\"\n                              [prop]=\"column.prop\"\n                              [checkboxable]=\"column.checkboxable\"\n                              [frozenLeft]=\"column.frozenLeft\"\n                              [frozenRight]=\"column.frozenRight\"\n                              [flexGrow]=\"column.flexGrow\"\n                              [minWidth]=\"column.minWidth\"\n                              [maxWidth]=\"column.maxWidth\"\n                              [width]=\"column.width\"\n                              [resizeable]=\"column.resizeable\"\n                              [comparator]=\"column.comparator\"\n                              [pipe]=\"column.pipe\"\n                              [sortable]=\"column.sortable\"\n                              [draggable]=\"column.draggable\"\n                              [canAutoResize]=\"column.canAutoResize\"\n                              [cellTemplate]=\"column.cellTemplate\"\n                              [ghostCellTemplate]=\"column.ghostCellTemplate\"\n                              [treeToggleTemplate]=\"column.treeToggleTemplate\"\n                              [cellClass]=\"column.cellClass\"\n                              [headerTemplate]=\"column.headerTemplate\"\n                              [headerClass]=\"column.headerClass\"\n                              [headerCheckboxable]=\"column.headerCheckboxable\"\n                              [isTreeColumn]=\"column.isTreeColumn\"\n                              [treeLevelIndent]=\"column.treeLevelIndent\"\n                              [summaryFunc]=\"column.summaryFunc\"\n                              [summaryTemplate]=\"column.summaryTemplate\"\n        ></ngx-datatable-column>\n\n        <ngx-datatable-footer id=\"datatable-footer\">\n          <ng-template\n            ngx-datatable-footer-template\n            let-rowCount=\"rowCount\"\n            let-pageSizeCurrent=\"pageSize\"\n            let-selectedCount=\"selectedCount\"\n            let-curPage=\"curPage\"\n            let-offset=\"offset\"\n          >\n            <div class=\"label\">\n              <span>{{ t('t.total') }}: </span><span id=\"total-number-of-items\">{{rowCount}}</span>\n              <span *ngIf=\"selectedCount\">&nbsp;&nbsp;|&nbsp;&nbsp;{{ t('t.selected') }}: </span><span *ngIf=\"selectedCount\" id=\"number-of-items-selected\">{{selectedCount}}</span>\n            </div>\n            <div class=\"pagination\" [style.display]=\"!((rowCount / pageSize) > 1) ? 'none' : null\">\n              <biit-datatable-pager #pager\n                                    [page]=\"curPage\"\n                                    [size]=\"pageSizeCurrent\"\n                                    [count]=\"rowCount\"\n                                    [hidden]=\"!((rowCount / pageSize) > 1)\"\n                                    (change)=\"table.onFooterPage($event)\">\n              </biit-datatable-pager>\n            </div>\n            <div class=\"page-items\" *ngIf=\"pageSizeList\">\n              <div *ngIf=\"pageSizeList?.length\">\n                <span>{{ t('t.rows-per-page') }}:</span>\n                <select [(ngModel)]=\"pageSize\"\n                        (ngModelChange)=\"pager.size = $event\">\n                  <option *ngFor=\"let size of pageSizeList\"\n                          [ngValue]=\"size\"\n                  >\n                    {{size}}\n                  </option>\n                </select>\n              </div>\n            </div>\n          </ng-template>\n        </ngx-datatable-footer>\n      </ngx-datatable>\n    </ng-container>\n\n    <ng-container *ngIf=\"serverSide\">\n      <ngx-datatable #table\n                     [rows]=\"data\"\n                     [columns]=\"_columns\"\n                     [columnMode]=\"'force'\"\n                     [headerHeight]=\"42\"\n                     [footerHeight]=\"hideFooter ? 0 : 34\"\n                     [rowHeight]=\"'auto'\"\n                     [reorderable]=\"false\"\n                     [selectionType]=\"SelectionType.checkbox\"\n                     [selected]=\"selected\"\n                     (select)=\"onSelect($event)\"\n                     (activate)=\"onActivate($event)\"\n                     [virtualization]=\"false\"\n                     [scrollbarVDynamic]=\"true\"\n                     [scrollbarH]=\"scrollbarH\"\n                     [messages]=\"{emptyMessage: t('t.empty-message')}\"\n                     [externalPaging]=\"true\"\n                     [count]=\"page.totalElements\"\n                     [offset]=\"page.pageNumber\"\n                     [limit]=\"page.pageSize\"\n                     (page)=\"onFooterPageChange($event)\"\n      >\n        <ngx-datatable-column *ngIf=\"selectable && !singleSelection\"\n                              #chkbox\n                              [width]=\"42\"\n                              [sortable]=\"false\"\n                              [canAutoResize]=\"false\"\n                              [draggable]=\"false\"\n                              [resizeable]=\"false\"\n                              [name]=\"'chkbox'\"\n        >\n          <ng-template\n            ngx-datatable-header-template\n            let-value=\"value\"\n            let-allRowsSelected=\"allRowsSelected\"\n            let-selectFn=\"selectFn\"\n          >\n            <biit-checkbox [ngModel]=\"allRowsSelected\" (ngModelChange)=\"selectFn(!allRowsSelected)\"></biit-checkbox>\n          </ng-template>\n          <ng-template\n            ngx-datatable-cell-template\n            let-value=\"value\"\n            let-isSelected=\"isSelected\"\n            let-onCheckboxChangeFn=\"onCheckboxChangeFn\"\n          >\n            <biit-checkbox [ngModel]=\"isSelected\" (ngModelChange)=\"onCheckboxChangeFn($event)\"></biit-checkbox>\n          </ng-template>\n        </ngx-datatable-column>\n\n        <ngx-datatable-column *ngFor=\"let column of _columns\"\n                              [name]=\"column.name\"\n                              [prop]=\"column.prop\"\n                              [checkboxable]=\"column.checkboxable\"\n                              [frozenLeft]=\"column.frozenLeft\"\n                              [frozenRight]=\"column.frozenRight\"\n                              [flexGrow]=\"column.flexGrow\"\n                              [minWidth]=\"column.minWidth\"\n                              [maxWidth]=\"column.maxWidth\"\n                              [width]=\"column.width\"\n                              [resizeable]=\"column.resizeable\"\n                              [comparator]=\"column.comparator\"\n                              [pipe]=\"column.pipe\"\n                              [sortable]=\"column.sortable\"\n                              [draggable]=\"column.draggable\"\n                              [canAutoResize]=\"column.canAutoResize\"\n                              [cellTemplate]=\"column.cellTemplate\"\n                              [ghostCellTemplate]=\"column.ghostCellTemplate\"\n                              [treeToggleTemplate]=\"column.treeToggleTemplate\"\n                              [cellClass]=\"column.cellClass\"\n                              [headerTemplate]=\"column.headerTemplate\"\n                              [headerClass]=\"column.headerClass\"\n                              [headerCheckboxable]=\"column.headerCheckboxable\"\n                              [isTreeColumn]=\"column.isTreeColumn\"\n                              [treeLevelIndent]=\"column.treeLevelIndent\"\n                              [summaryFunc]=\"column.summaryFunc\"\n                              [summaryTemplate]=\"column.summaryTemplate\"\n        ></ngx-datatable-column>\n\n        <ngx-datatable-footer>\n          <ng-template\n            ngx-datatable-footer-template\n            let-rowCount=\"rowCount\"\n            let-pageSizeCurrent=\"pageSize\"\n            let-selectedCount=\"selectedCount\"\n            let-curPage=\"curPage\"\n            let-offset=\"offset\"\n          >\n            <div class=\"label\" id=\"total-elements\">\n              <span>{{ t('t.total') }}: {{rowCount}}</span>\n              <span *ngIf=\"selectedCount\">&nbsp;&nbsp;|&nbsp;&nbsp;{{ t('t.selected') }}: {{selectedCount}}</span>\n            </div>\n            <div class=\"pagination\" [style.display]=\"!((rowCount / pageSize) > 1) ? 'none' : null\">\n              <biit-datatable-pager #pager\n                                    [page]=\"curPage\"\n                                    [size]=\"pageSizeCurrent\"\n                                    [count]=\"rowCount\"\n                                    [hidden]=\"!((rowCount / pageSize) > 1)\"\n                                    (change)=\"table.onFooterPage($event)\">\n              </biit-datatable-pager>\n            </div>\n            <div class=\"page-items\" *ngIf=\"pageSizeList\">\n              <div *ngIf=\"pageSizeList?.length\">\n                <span>{{ t('t.rows-per-page') }}:</span>\n                <select [(ngModel)]=\"pageSize\"\n                        (ngModelChange)=\"pager.size = $event\">\n                  <option *ngFor=\"let size of pageSizeList\"\n                          [ngValue]=\"size\"\n                  >\n                    {{size}}\n                  </option>\n                </select>\n              </div>\n            </div>\n          </ng-template>\n        </ngx-datatable-footer>\n      </ngx-datatable>\n    </ng-container>\n  </div>\n</div>\n", styles: [".table-canvas{height:100%;display:flex;flex-direction:column;gap:14px;background:var(--chart-background);color:var(--table-text-color)}.table-canvas .top{display:flex;flex:0}.table-canvas .top .action-bar{display:flex;flex:1}.table-canvas .top .options{display:flex;flex:0}.table-canvas .table{position:relative;flex:1;min-height:0;min-width:0}.table-canvas .table biit-progress-bar{position:absolute;z-index:1;left:0;right:3px;top:42px}.table-canvas .table ::ng-deep ngx-datatable{height:100%;position:absolute;inset:0}.table-canvas .table ::ng-deep ngx-datatable>div{height:calc(100% - 42px)}.table-canvas .table ::ng-deep ngx-datatable>div>div{height:100%}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner{height:inherit}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap{height:100%!important;width:calc(100% - 3px);display:flex;align-items:center;justify-content:center;background:var(--table-header-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap span{color:var(--table-text-color);font-size:16px;line-height:100%;font-weight:700;text-transform:uppercase}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap .sort-btn{position:absolute;right:14px}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap:has(biit-checkbox){background:var(--chart-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-body{height:100%!important;overflow-y:auto!important}.table-canvas .table ::ng-deep ngx-datatable datatable-body .empty-row{height:100%;display:flex;align-items:center;justify-content:center}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row .datatable-body-cell-label{display:flex;align-items:center;min-height:42px;border-bottom:3px solid var(--table-header-color);width:calc(100% - 3px);padding:9px 14px;line-height:120%;height:100%}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row:hover .datatable-body-cell-label{background:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row.active .datatable-body-cell-label{background:var(--main-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer{position:absolute;bottom:0;background:var(--chart-background);z-index:10}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .label{flex:1 0}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .pagination{display:flex;margin:auto;flex:0;justify-content:center}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .pagination biit-datatable-pager{flex:none!important}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items{flex:1 0;display:flex;justify-content:flex-end;align-items:center;color:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select{appearance:none;border:none;height:34px;min-width:34px;padding:8px 14px;text-align:end;font-size:14px;font-family:Montserrat,serif;cursor:pointer;background:var(--chart-background);color:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select:focus-visible{outline:none;background:var(--main-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select:hover{background:var(--main-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select *{background:var(--chart-background);padding:5px}.table-canvas .table ::ng-deep ngx-datatable:has(datatable-footer) datatable-body{height:calc(100% - 48px)!important}::ng-deep ngx-datatable .auto-details-height .datatable-row-wrapper{height:unset!important}::ng-deep ngx-datatable .auto-details-height .datatable-row-wrapper .datatable-row-detail{height:unset!important}.default-menu{display:flex;flex-direction:row}@media screen and (max-width: 600px){.page-items,.page-size-selector,.horizontal-menu{display:none!important}}@media screen and (min-width: 601px){.vertical-menu{display:none!important}}\n"], dependencies: [{ kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i4.BiitCheckboxComponent, selector: "biit-checkbox", inputs: ["disabled", "description", "showAlwaysDescription"], outputs: ["onValueChange"] }, { kind: "component", type: i5.BiitDatatablePagerComponent, selector: "biit-datatable-pager" }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6.DatatableComponent, selector: "ngx-datatable", inputs: ["targetMarkerTemplate", "rows", "groupRowsBy", "groupedRows", "columns", "selected", "scrollbarV", "scrollbarVDynamic", "scrollbarH", "rowHeight", "columnMode", "headerHeight", "footerHeight", "externalPaging", "externalSorting", "limit", "count", "offset", "loadingIndicator", "ghostLoadingIndicator", "selectionType", "reorderable", "swapColumns", "sortType", "sorts", "cssClasses", "messages", "rowClass", "selectCheck", "displayCheck", "groupExpansionDefault", "trackByProp", "selectAllRowsOnPage", "virtualization", "treeFromRelation", "treeToRelation", "summaryRow", "summaryHeight", "summaryPosition", "disableRowCheck", "rowIdentity"], outputs: ["scroll", "activate", "select", "sort", "page", "reorder", "resize", "tableContextmenu", "treeAction"] }, { kind: "directive", type: i6.DataTableColumnDirective, selector: "ngx-datatable-column", inputs: ["name", "prop", "frozenLeft", "frozenRight", "flexGrow", "resizeable", "comparator", "pipe", "sortable", "draggable", "canAutoResize", "minWidth", "width", "maxWidth", "checkboxable", "headerCheckboxable", "headerClass", "cellClass", "isTreeColumn", "treeLevelIndent", "summaryFunc", "summaryTemplate", "cellTemplate", "headerTemplate", "treeToggleTemplate", "ghostCellTemplate"] }, { kind: "directive", type: i6.DataTableColumnHeaderDirective, selector: "[ngx-datatable-header-template]" }, { kind: "directive", type: i6.DataTableColumnCellDirective, selector: "[ngx-datatable-cell-template]" }, { kind: "directive", type: i6.DataTableFooterTemplateDirective, selector: "[ngx-datatable-footer-template]" }, { kind: "directive", type: i6.DatatableFooterDirective, selector: "ngx-datatable-footer", inputs: ["footerHeight", "totalMessage", "selectedMessage", "pagerLeftArrowIcon", "pagerRightArrowIcon", "pagerPreviousIcon", "pagerNextIcon", "template"] }, { kind: "component", type: i7.BiitProgressBarComponent, selector: "biit-progress-bar", inputs: ["type", "_value", "value"] }, { kind: "component", type: i4.BiitMultiselectComponent, selector: "biit-multiselect", inputs: ["title", "type", "icon", "label", "value", "descriptionField", "description", "data", "primitive", "compact", "disabled", "required", "sort-asc", "sort-desc"], outputs: ["onCreate"] }, { kind: "directive", type: i8.TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoLang", "translocoLoadingTpl"] }, { kind: "component", type: i4.BiitInputTextComponent, selector: "biit-input-text", inputs: ["placeholder", "error", "description", "info", "type", "icon", "fieldName", "disabled", "required", "readonly", "min", "max", "minLength", "maxLength", "regEx"], outputs: ["onActionPerformed"] }, { kind: "component", type: i9.BiitVerticalMenuComponent, selector: "biit-vertical-menu" }] });
+BiitDatatableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: BiitDatatableComponent, selector: "biit-datatable", inputs: { data: "data", columns: "columns", pageSize: "pageSize", pageSizeList: "pageSizeList", loading: "loading", selectable: "selectable", singleSelection: "singleSelection", scrollbarH: "scrollbarH", hideHeader: "hideHeader", hideFooter: "hideFooter", serverSide: "serverSide", page: "page" }, outputs: { onSelection: "onSelection", onPageChange: "onPageChange" }, providers: [provideTranslocoScope({ scope: 'wizardry-theme/table', alias: 't' })], queries: [{ propertyName: "actionsTpl", first: true, predicate: ["actions"], descendants: true }], viewQueries: [{ propertyName: "table", first: true, predicate: ["table"], descendants: true }], ngImport: i0, template: "<div id=\"biit-table\" class=\"table-canvas\" *transloco=\"let t\">\n  <div class=\"top\" *ngIf=\"!hideHeader\">\n    <div id=\"menu\" class=\"action-bar\">\n      <biit-vertical-menu *ngIf=\"actionsTpl\" class=\"vertical-menu\">\n        <ng-container *ngTemplateOutlet=\"actionsTpl\"></ng-container>\n      </biit-vertical-menu>\n      <div *ngIf=\"actionsTpl\" class=\"horizontal-menu default-menu\">\n        <ng-container *ngTemplateOutlet=\"actionsTpl\"></ng-container>\n      </div>\n      <div class=\"default-menu\" *ngIf=\"!actionsTpl\">\n        <ng-content></ng-content>\n      </div>\n    </div>\n    <div id=\"options\" class=\"options\">\n      <biit-input-text id=\"search\" #searchInput\n                       [ngModel]=\"search\"\n                       (onActionPerformed)=\"\n                         onFilter($event, true);\n                       \"\n                       (ngModelChange)=\"onFilter($event)\"\n                       (focusout)=\"searchInput.value = search\"\n                       icon=\"search\"\n                       [placeholder]=\"t('t.search')\"\n      ></biit-input-text>\n      <biit-multiselect id=\"column-selector\" [ngModel]=\"_columns\"\n                        (ngModelChange)=\"setColumnVisibility($event)\"\n                        [data]=\"allColumns\"\n                        label=\"name\"\n                        value=\"visible\"\n                        [type]=\"BiitMultiselectType.ICON\"\n                        [title]=\"t('t.column-selector')\"\n                        [compact]=\"true\"\n      ></biit-multiselect>\n    </div>\n  </div>\n  <div id=\"content\" class=\"table\">\n    <biit-progress-bar *ngIf=\"loading\"></biit-progress-bar>\n    <ng-container *ngIf=\"!serverSide\">\n      <ngx-datatable #table\n                     [rows]=\"data\"\n                     [columns]=\"_columns\"\n                     [columnMode]=\"'force'\"\n                     [headerHeight]=\"42\"\n                     [footerHeight]=\"hideFooter ? 0 : 34\"\n                     [rowHeight]=\"'auto'\"\n                     [reorderable]=\"false\"\n                     [selectionType]=\"SelectionType.checkbox\"\n                     [selected]=\"selected\"\n                     (select)=\"onSelect($event)\"\n                     (activate)=\"onActivate($event)\"\n                     [virtualization]=\"false\"\n                     [scrollbarVDynamic]=\"true\"\n                     [limit]=\"pageSize\"\n                     [scrollbarH]=\"scrollbarH\"\n                     [messages]=\"{emptyMessage: t('t.empty-message')}\"\n      >\n        <ngx-datatable-column *ngIf=\"selectable && !singleSelection\"\n                              #chkbox\n                              [width]=\"42\"\n                              [sortable]=\"false\"\n                              [canAutoResize]=\"false\"\n                              [draggable]=\"false\"\n                              [resizeable]=\"false\"\n                              [name]=\"'chkbox'\"\n        >\n          <ng-template\n            ngx-datatable-header-template\n            let-value=\"value\"\n            let-allRowsSelected=\"allRowsSelected\"\n            let-selectFn=\"selectFn\"\n          >\n            <biit-checkbox [ngModel]=\"allRowsSelected\" (ngModelChange)=\"selectFn(!allRowsSelected)\"></biit-checkbox>\n          </ng-template>\n          <ng-template\n            ngx-datatable-cell-template\n            let-value=\"value\"\n            let-isSelected=\"isSelected\"\n            let-onCheckboxChangeFn=\"onCheckboxChangeFn\"\n          >\n            <biit-checkbox [ngModel]=\"isSelected\" (ngModelChange)=\"onCheckboxChangeFn($event)\"></biit-checkbox>\n          </ng-template>\n        </ngx-datatable-column>\n\n        <ngx-datatable-column *ngFor=\"let column of _columns\"\n                              [name]=\"column.name\"\n                              [prop]=\"column.prop\"\n                              [checkboxable]=\"column.checkboxable\"\n                              [frozenLeft]=\"column.frozenLeft\"\n                              [frozenRight]=\"column.frozenRight\"\n                              [flexGrow]=\"column.flexGrow\"\n                              [minWidth]=\"column.minWidth\"\n                              [maxWidth]=\"column.maxWidth\"\n                              [width]=\"column.width\"\n                              [resizeable]=\"column.resizeable\"\n                              [comparator]=\"column.comparator\"\n                              [pipe]=\"column.pipe\"\n                              [sortable]=\"column.sortable\"\n                              [draggable]=\"column.draggable\"\n                              [canAutoResize]=\"column.canAutoResize\"\n                              [cellTemplate]=\"column.cellTemplate\"\n                              [ghostCellTemplate]=\"column.ghostCellTemplate\"\n                              [treeToggleTemplate]=\"column.treeToggleTemplate\"\n                              [cellClass]=\"column.cellClass\"\n                              [headerTemplate]=\"column.headerTemplate\"\n                              [headerClass]=\"column.headerClass\"\n                              [headerCheckboxable]=\"column.headerCheckboxable\"\n                              [isTreeColumn]=\"column.isTreeColumn\"\n                              [treeLevelIndent]=\"column.treeLevelIndent\"\n                              [summaryFunc]=\"column.summaryFunc\"\n                              [summaryTemplate]=\"column.summaryTemplate\"\n        ></ngx-datatable-column>\n\n        <ngx-datatable-footer id=\"datatable-footer\">\n          <ng-template\n            ngx-datatable-footer-template\n            let-rowCount=\"rowCount\"\n            let-pageSizeCurrent=\"pageSize\"\n            let-selectedCount=\"selectedCount\"\n            let-curPage=\"curPage\"\n            let-offset=\"offset\"\n          >\n            <div class=\"label\">\n              <span>{{ t('t.total') }}: </span><span id=\"total-number-of-items\">{{rowCount}}</span>\n              <span *ngIf=\"selectedCount\">&nbsp;&nbsp;|&nbsp;&nbsp;{{ t('t.selected') }}: </span><span *ngIf=\"selectedCount\" id=\"number-of-items-selected\">{{selectedCount}}</span>\n            </div>\n            <div class=\"pagination\" [style.display]=\"!((rowCount / pageSize) > 1) ? 'none' : null\">\n              <biit-datatable-pager #pager\n                                    [page]=\"curPage\"\n                                    [size]=\"pageSizeCurrent\"\n                                    [count]=\"rowCount\"\n                                    [hidden]=\"!((rowCount / pageSize) > 1)\"\n                                    (change)=\"table.onFooterPage($event)\">\n              </biit-datatable-pager>\n            </div>\n            <div class=\"page-items\" *ngIf=\"pageSizeList\">\n              <div *ngIf=\"pageSizeList?.length\">\n                <span>{{ t('t.rows-per-page') }}:</span>\n                <select [(ngModel)]=\"pageSize\"\n                        (ngModelChange)=\"pager.size = $event\">\n                  <option *ngFor=\"let size of pageSizeList\"\n                          [ngValue]=\"size\"\n                  >\n                    {{size}}\n                  </option>\n                </select>\n              </div>\n            </div>\n          </ng-template>\n        </ngx-datatable-footer>\n      </ngx-datatable>\n    </ng-container>\n\n    <ng-container *ngIf=\"serverSide\">\n      <ngx-datatable #table\n                     [rows]=\"data\"\n                     [columns]=\"_columns\"\n                     [columnMode]=\"'force'\"\n                     [headerHeight]=\"42\"\n                     [footerHeight]=\"hideFooter ? 0 : 34\"\n                     [rowHeight]=\"'auto'\"\n                     [reorderable]=\"false\"\n                     [selectionType]=\"SelectionType.checkbox\"\n                     [selected]=\"selected\"\n                     (select)=\"onSelect($event)\"\n                     (activate)=\"onActivate($event)\"\n                     [virtualization]=\"false\"\n                     [scrollbarVDynamic]=\"true\"\n                     [scrollbarH]=\"scrollbarH\"\n                     [messages]=\"{emptyMessage: t('t.empty-message')}\"\n                     [externalPaging]=\"true\"\n                     [count]=\"page.totalElements\"\n                     [offset]=\"page.pageNumber\"\n                     [limit]=\"page.pageSize\"\n                     (page)=\"onFooterPageChange($event)\"\n      >\n        <ngx-datatable-column *ngIf=\"selectable && !singleSelection\"\n                              #chkbox\n                              [width]=\"42\"\n                              [sortable]=\"false\"\n                              [canAutoResize]=\"false\"\n                              [draggable]=\"false\"\n                              [resizeable]=\"false\"\n                              [name]=\"'chkbox'\"\n        >\n          <ng-template\n            ngx-datatable-header-template\n            let-value=\"value\"\n            let-allRowsSelected=\"allRowsSelected\"\n            let-selectFn=\"selectFn\"\n          >\n            <biit-checkbox [ngModel]=\"allRowsSelected\" (ngModelChange)=\"selectFn(!allRowsSelected)\"></biit-checkbox>\n          </ng-template>\n          <ng-template\n            ngx-datatable-cell-template\n            let-value=\"value\"\n            let-isSelected=\"isSelected\"\n            let-onCheckboxChangeFn=\"onCheckboxChangeFn\"\n          >\n            <biit-checkbox [ngModel]=\"isSelected\" (ngModelChange)=\"onCheckboxChangeFn($event)\"></biit-checkbox>\n          </ng-template>\n        </ngx-datatable-column>\n\n        <ngx-datatable-column *ngFor=\"let column of _columns\"\n                              [name]=\"column.name\"\n                              [prop]=\"column.prop\"\n                              [checkboxable]=\"column.checkboxable\"\n                              [frozenLeft]=\"column.frozenLeft\"\n                              [frozenRight]=\"column.frozenRight\"\n                              [flexGrow]=\"column.flexGrow\"\n                              [minWidth]=\"column.minWidth\"\n                              [maxWidth]=\"column.maxWidth\"\n                              [width]=\"column.width\"\n                              [resizeable]=\"column.resizeable\"\n                              [comparator]=\"column.comparator\"\n                              [pipe]=\"column.pipe\"\n                              [sortable]=\"column.sortable\"\n                              [draggable]=\"column.draggable\"\n                              [canAutoResize]=\"column.canAutoResize\"\n                              [cellTemplate]=\"column.cellTemplate\"\n                              [ghostCellTemplate]=\"column.ghostCellTemplate\"\n                              [treeToggleTemplate]=\"column.treeToggleTemplate\"\n                              [cellClass]=\"column.cellClass\"\n                              [headerTemplate]=\"column.headerTemplate\"\n                              [headerClass]=\"column.headerClass\"\n                              [headerCheckboxable]=\"column.headerCheckboxable\"\n                              [isTreeColumn]=\"column.isTreeColumn\"\n                              [treeLevelIndent]=\"column.treeLevelIndent\"\n                              [summaryFunc]=\"column.summaryFunc\"\n                              [summaryTemplate]=\"column.summaryTemplate\"\n        ></ngx-datatable-column>\n\n        <ngx-datatable-footer>\n          <ng-template\n            ngx-datatable-footer-template\n            let-rowCount=\"rowCount\"\n            let-pageSizeCurrent=\"pageSize\"\n            let-selectedCount=\"selectedCount\"\n            let-curPage=\"curPage\"\n            let-offset=\"offset\"\n          >\n            <div class=\"label\" id=\"total-elements\">\n              <span>{{ t('t.total') }}: {{rowCount}}</span>\n              <span *ngIf=\"selectedCount\">&nbsp;&nbsp;|&nbsp;&nbsp;{{ t('t.selected') }}: {{selectedCount}}</span>\n            </div>\n            <div class=\"pagination\" [style.display]=\"!((rowCount / pageSize) > 1) ? 'none' : null\">\n              <biit-datatable-pager #pager\n                                    [page]=\"curPage\"\n                                    [size]=\"pageSizeCurrent\"\n                                    [count]=\"rowCount\"\n                                    [hidden]=\"!((rowCount / pageSize) > 1)\"\n                                    (change)=\"table.onFooterPage($event)\">\n              </biit-datatable-pager>\n            </div>\n            <div class=\"page-items\" *ngIf=\"pageSizeList\">\n              <div *ngIf=\"pageSizeList?.length\">\n                <span>{{ t('t.rows-per-page') }}:</span>\n                <select [(ngModel)]=\"pageSize\"\n                        (ngModelChange)=\"pager.size = $event\">\n                  <option *ngFor=\"let size of pageSizeList\"\n                          [ngValue]=\"size\"\n                  >\n                    {{size}}\n                  </option>\n                </select>\n              </div>\n            </div>\n          </ng-template>\n        </ngx-datatable-footer>\n      </ngx-datatable>\n    </ng-container>\n  </div>\n</div>\n", styles: [".table-canvas{height:100%;display:flex;flex-direction:column;gap:14px;background:var(--table-background-color);color:var(--table-text-color)}.table-canvas .top{display:flex;flex:0}.table-canvas .top .action-bar{display:flex;flex:1}.table-canvas .top .options{display:flex;flex:0}.table-canvas .table{position:relative;flex:1;min-height:0;min-width:0}.table-canvas .table biit-progress-bar{position:absolute;z-index:1;left:0;right:3px;top:42px}.table-canvas .table ::ng-deep ngx-datatable{height:100%;position:absolute;inset:0}.table-canvas .table ::ng-deep ngx-datatable>div{height:calc(100% - 42px)}.table-canvas .table ::ng-deep ngx-datatable>div>div{height:100%}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner{height:inherit}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap{height:100%!important;width:calc(100% - 3px);display:flex;align-items:center;justify-content:center;background:var(--table-header-color);color:var(--table-header-text)}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap span{color:var(--table-text-color);font-size:16px;line-height:100%;font-weight:700;text-transform:uppercase}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap .sort-btn{position:absolute;right:14px}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap:has(biit-checkbox){background:var(--table-background-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-body{height:100%!important;overflow-y:auto!important}.table-canvas .table ::ng-deep ngx-datatable datatable-body .empty-row{height:100%;display:flex;align-items:center;justify-content:center}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row .datatable-body-cell-label{display:flex;align-items:center;min-height:42px;border-bottom:3px solid var(--table-header-color);width:calc(100% - 3px);padding:9px 14px;line-height:120%;height:100%}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row:hover .datatable-body-cell-label{background:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row.active .datatable-body-cell-label{background:var(--table-active-row-backgorund-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer{position:absolute;bottom:0;background:var(--table-background-color);z-index:10}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .label{flex:1 0}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .pagination{display:flex;margin:auto;flex:0;justify-content:center}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .pagination biit-datatable-pager{flex:none!important}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items{flex:1 0;display:flex;justify-content:flex-end;align-items:center;color:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select{appearance:none;border:none;height:34px;min-width:34px;padding:8px 14px;text-align:end;font-size:14px;font-family:Montserrat,serif;cursor:pointer;background:var(--table-background-color);color:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select:focus-visible{outline:none;background:var(--table-active-row-backgorund-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select:hover{background:var(--table-active-row-backgorund-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select *{background:var(--table-background-color);padding:5px}.table-canvas .table ::ng-deep ngx-datatable:has(datatable-footer) datatable-body{height:calc(100% - 48px)!important}::ng-deep ngx-datatable .auto-details-height .datatable-row-wrapper{height:unset!important}::ng-deep ngx-datatable .auto-details-height .datatable-row-wrapper .datatable-row-detail{height:unset!important}.default-menu{display:flex;flex-direction:row}@media screen and (max-width: 600px){.page-items,.page-size-selector,.horizontal-menu{display:none!important}}@media screen and (min-width: 601px){.vertical-menu{display:none!important}}\n"], dependencies: [{ kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i4.BiitCheckboxComponent, selector: "biit-checkbox", inputs: ["disabled", "description", "showAlwaysDescription"], outputs: ["onValueChange"] }, { kind: "component", type: i5.BiitDatatablePagerComponent, selector: "biit-datatable-pager" }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6.DatatableComponent, selector: "ngx-datatable", inputs: ["targetMarkerTemplate", "rows", "groupRowsBy", "groupedRows", "columns", "selected", "scrollbarV", "scrollbarVDynamic", "scrollbarH", "rowHeight", "columnMode", "headerHeight", "footerHeight", "externalPaging", "externalSorting", "limit", "count", "offset", "loadingIndicator", "ghostLoadingIndicator", "selectionType", "reorderable", "swapColumns", "sortType", "sorts", "cssClasses", "messages", "rowClass", "selectCheck", "displayCheck", "groupExpansionDefault", "trackByProp", "selectAllRowsOnPage", "virtualization", "treeFromRelation", "treeToRelation", "summaryRow", "summaryHeight", "summaryPosition", "disableRowCheck", "rowIdentity"], outputs: ["scroll", "activate", "select", "sort", "page", "reorder", "resize", "tableContextmenu", "treeAction"] }, { kind: "directive", type: i6.DataTableColumnDirective, selector: "ngx-datatable-column", inputs: ["name", "prop", "frozenLeft", "frozenRight", "flexGrow", "resizeable", "comparator", "pipe", "sortable", "draggable", "canAutoResize", "minWidth", "width", "maxWidth", "checkboxable", "headerCheckboxable", "headerClass", "cellClass", "isTreeColumn", "treeLevelIndent", "summaryFunc", "summaryTemplate", "cellTemplate", "headerTemplate", "treeToggleTemplate", "ghostCellTemplate"] }, { kind: "directive", type: i6.DataTableColumnHeaderDirective, selector: "[ngx-datatable-header-template]" }, { kind: "directive", type: i6.DataTableColumnCellDirective, selector: "[ngx-datatable-cell-template]" }, { kind: "directive", type: i6.DataTableFooterTemplateDirective, selector: "[ngx-datatable-footer-template]" }, { kind: "directive", type: i6.DatatableFooterDirective, selector: "ngx-datatable-footer", inputs: ["footerHeight", "totalMessage", "selectedMessage", "pagerLeftArrowIcon", "pagerRightArrowIcon", "pagerPreviousIcon", "pagerNextIcon", "template"] }, { kind: "component", type: i7.BiitProgressBarComponent, selector: "biit-progress-bar", inputs: ["type", "_value", "value"] }, { kind: "component", type: i4.BiitMultiselectComponent, selector: "biit-multiselect", inputs: ["title", "type", "icon", "label", "value", "descriptionField", "description", "data", "primitive", "compact", "disabled", "required", "sort-asc", "sort-desc"], outputs: ["onCreate"] }, { kind: "directive", type: i8.TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoLang", "translocoLoadingTpl"] }, { kind: "component", type: i4.BiitInputTextComponent, selector: "biit-input-text", inputs: ["placeholder", "error", "description", "info", "type", "icon", "fieldName", "disabled", "required", "readonly", "min", "max", "minLength", "maxLength", "regEx"], outputs: ["onActionPerformed"] }, { kind: "component", type: i9.BiitVerticalMenuComponent, selector: "biit-vertical-menu" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BiitDatatableComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'biit-datatable', providers: [provideTranslocoScope({ scope: 'wizardry-theme/table', alias: 't' })], template: "<div id=\"biit-table\" class=\"table-canvas\" *transloco=\"let t\">\n  <div class=\"top\" *ngIf=\"!hideHeader\">\n    <div id=\"menu\" class=\"action-bar\">\n      <biit-vertical-menu *ngIf=\"actionsTpl\" class=\"vertical-menu\">\n        <ng-container *ngTemplateOutlet=\"actionsTpl\"></ng-container>\n      </biit-vertical-menu>\n      <div *ngIf=\"actionsTpl\" class=\"horizontal-menu default-menu\">\n        <ng-container *ngTemplateOutlet=\"actionsTpl\"></ng-container>\n      </div>\n      <div class=\"default-menu\" *ngIf=\"!actionsTpl\">\n        <ng-content></ng-content>\n      </div>\n    </div>\n    <div id=\"options\" class=\"options\">\n      <biit-input-text id=\"search\" #searchInput\n                       [ngModel]=\"search\"\n                       (onActionPerformed)=\"\n                         onFilter($event, true);\n                       \"\n                       (ngModelChange)=\"onFilter($event)\"\n                       (focusout)=\"searchInput.value = search\"\n                       icon=\"search\"\n                       [placeholder]=\"t('t.search')\"\n      ></biit-input-text>\n      <biit-multiselect id=\"column-selector\" [ngModel]=\"_columns\"\n                        (ngModelChange)=\"setColumnVisibility($event)\"\n                        [data]=\"allColumns\"\n                        label=\"name\"\n                        value=\"visible\"\n                        [type]=\"BiitMultiselectType.ICON\"\n                        [title]=\"t('t.column-selector')\"\n                        [compact]=\"true\"\n      ></biit-multiselect>\n    </div>\n  </div>\n  <div id=\"content\" class=\"table\">\n    <biit-progress-bar *ngIf=\"loading\"></biit-progress-bar>\n    <ng-container *ngIf=\"!serverSide\">\n      <ngx-datatable #table\n                     [rows]=\"data\"\n                     [columns]=\"_columns\"\n                     [columnMode]=\"'force'\"\n                     [headerHeight]=\"42\"\n                     [footerHeight]=\"hideFooter ? 0 : 34\"\n                     [rowHeight]=\"'auto'\"\n                     [reorderable]=\"false\"\n                     [selectionType]=\"SelectionType.checkbox\"\n                     [selected]=\"selected\"\n                     (select)=\"onSelect($event)\"\n                     (activate)=\"onActivate($event)\"\n                     [virtualization]=\"false\"\n                     [scrollbarVDynamic]=\"true\"\n                     [limit]=\"pageSize\"\n                     [scrollbarH]=\"scrollbarH\"\n                     [messages]=\"{emptyMessage: t('t.empty-message')}\"\n      >\n        <ngx-datatable-column *ngIf=\"selectable && !singleSelection\"\n                              #chkbox\n                              [width]=\"42\"\n                              [sortable]=\"false\"\n                              [canAutoResize]=\"false\"\n                              [draggable]=\"false\"\n                              [resizeable]=\"false\"\n                              [name]=\"'chkbox'\"\n        >\n          <ng-template\n            ngx-datatable-header-template\n            let-value=\"value\"\n            let-allRowsSelected=\"allRowsSelected\"\n            let-selectFn=\"selectFn\"\n          >\n            <biit-checkbox [ngModel]=\"allRowsSelected\" (ngModelChange)=\"selectFn(!allRowsSelected)\"></biit-checkbox>\n          </ng-template>\n          <ng-template\n            ngx-datatable-cell-template\n            let-value=\"value\"\n            let-isSelected=\"isSelected\"\n            let-onCheckboxChangeFn=\"onCheckboxChangeFn\"\n          >\n            <biit-checkbox [ngModel]=\"isSelected\" (ngModelChange)=\"onCheckboxChangeFn($event)\"></biit-checkbox>\n          </ng-template>\n        </ngx-datatable-column>\n\n        <ngx-datatable-column *ngFor=\"let column of _columns\"\n                              [name]=\"column.name\"\n                              [prop]=\"column.prop\"\n                              [checkboxable]=\"column.checkboxable\"\n                              [frozenLeft]=\"column.frozenLeft\"\n                              [frozenRight]=\"column.frozenRight\"\n                              [flexGrow]=\"column.flexGrow\"\n                              [minWidth]=\"column.minWidth\"\n                              [maxWidth]=\"column.maxWidth\"\n                              [width]=\"column.width\"\n                              [resizeable]=\"column.resizeable\"\n                              [comparator]=\"column.comparator\"\n                              [pipe]=\"column.pipe\"\n                              [sortable]=\"column.sortable\"\n                              [draggable]=\"column.draggable\"\n                              [canAutoResize]=\"column.canAutoResize\"\n                              [cellTemplate]=\"column.cellTemplate\"\n                              [ghostCellTemplate]=\"column.ghostCellTemplate\"\n                              [treeToggleTemplate]=\"column.treeToggleTemplate\"\n                              [cellClass]=\"column.cellClass\"\n                              [headerTemplate]=\"column.headerTemplate\"\n                              [headerClass]=\"column.headerClass\"\n                              [headerCheckboxable]=\"column.headerCheckboxable\"\n                              [isTreeColumn]=\"column.isTreeColumn\"\n                              [treeLevelIndent]=\"column.treeLevelIndent\"\n                              [summaryFunc]=\"column.summaryFunc\"\n                              [summaryTemplate]=\"column.summaryTemplate\"\n        ></ngx-datatable-column>\n\n        <ngx-datatable-footer id=\"datatable-footer\">\n          <ng-template\n            ngx-datatable-footer-template\n            let-rowCount=\"rowCount\"\n            let-pageSizeCurrent=\"pageSize\"\n            let-selectedCount=\"selectedCount\"\n            let-curPage=\"curPage\"\n            let-offset=\"offset\"\n          >\n            <div class=\"label\">\n              <span>{{ t('t.total') }}: </span><span id=\"total-number-of-items\">{{rowCount}}</span>\n              <span *ngIf=\"selectedCount\">&nbsp;&nbsp;|&nbsp;&nbsp;{{ t('t.selected') }}: </span><span *ngIf=\"selectedCount\" id=\"number-of-items-selected\">{{selectedCount}}</span>\n            </div>\n            <div class=\"pagination\" [style.display]=\"!((rowCount / pageSize) > 1) ? 'none' : null\">\n              <biit-datatable-pager #pager\n                                    [page]=\"curPage\"\n                                    [size]=\"pageSizeCurrent\"\n                                    [count]=\"rowCount\"\n                                    [hidden]=\"!((rowCount / pageSize) > 1)\"\n                                    (change)=\"table.onFooterPage($event)\">\n              </biit-datatable-pager>\n            </div>\n            <div class=\"page-items\" *ngIf=\"pageSizeList\">\n              <div *ngIf=\"pageSizeList?.length\">\n                <span>{{ t('t.rows-per-page') }}:</span>\n                <select [(ngModel)]=\"pageSize\"\n                        (ngModelChange)=\"pager.size = $event\">\n                  <option *ngFor=\"let size of pageSizeList\"\n                          [ngValue]=\"size\"\n                  >\n                    {{size}}\n                  </option>\n                </select>\n              </div>\n            </div>\n          </ng-template>\n        </ngx-datatable-footer>\n      </ngx-datatable>\n    </ng-container>\n\n    <ng-container *ngIf=\"serverSide\">\n      <ngx-datatable #table\n                     [rows]=\"data\"\n                     [columns]=\"_columns\"\n                     [columnMode]=\"'force'\"\n                     [headerHeight]=\"42\"\n                     [footerHeight]=\"hideFooter ? 0 : 34\"\n                     [rowHeight]=\"'auto'\"\n                     [reorderable]=\"false\"\n                     [selectionType]=\"SelectionType.checkbox\"\n                     [selected]=\"selected\"\n                     (select)=\"onSelect($event)\"\n                     (activate)=\"onActivate($event)\"\n                     [virtualization]=\"false\"\n                     [scrollbarVDynamic]=\"true\"\n                     [scrollbarH]=\"scrollbarH\"\n                     [messages]=\"{emptyMessage: t('t.empty-message')}\"\n                     [externalPaging]=\"true\"\n                     [count]=\"page.totalElements\"\n                     [offset]=\"page.pageNumber\"\n                     [limit]=\"page.pageSize\"\n                     (page)=\"onFooterPageChange($event)\"\n      >\n        <ngx-datatable-column *ngIf=\"selectable && !singleSelection\"\n                              #chkbox\n                              [width]=\"42\"\n                              [sortable]=\"false\"\n                              [canAutoResize]=\"false\"\n                              [draggable]=\"false\"\n                              [resizeable]=\"false\"\n                              [name]=\"'chkbox'\"\n        >\n          <ng-template\n            ngx-datatable-header-template\n            let-value=\"value\"\n            let-allRowsSelected=\"allRowsSelected\"\n            let-selectFn=\"selectFn\"\n          >\n            <biit-checkbox [ngModel]=\"allRowsSelected\" (ngModelChange)=\"selectFn(!allRowsSelected)\"></biit-checkbox>\n          </ng-template>\n          <ng-template\n            ngx-datatable-cell-template\n            let-value=\"value\"\n            let-isSelected=\"isSelected\"\n            let-onCheckboxChangeFn=\"onCheckboxChangeFn\"\n          >\n            <biit-checkbox [ngModel]=\"isSelected\" (ngModelChange)=\"onCheckboxChangeFn($event)\"></biit-checkbox>\n          </ng-template>\n        </ngx-datatable-column>\n\n        <ngx-datatable-column *ngFor=\"let column of _columns\"\n                              [name]=\"column.name\"\n                              [prop]=\"column.prop\"\n                              [checkboxable]=\"column.checkboxable\"\n                              [frozenLeft]=\"column.frozenLeft\"\n                              [frozenRight]=\"column.frozenRight\"\n                              [flexGrow]=\"column.flexGrow\"\n                              [minWidth]=\"column.minWidth\"\n                              [maxWidth]=\"column.maxWidth\"\n                              [width]=\"column.width\"\n                              [resizeable]=\"column.resizeable\"\n                              [comparator]=\"column.comparator\"\n                              [pipe]=\"column.pipe\"\n                              [sortable]=\"column.sortable\"\n                              [draggable]=\"column.draggable\"\n                              [canAutoResize]=\"column.canAutoResize\"\n                              [cellTemplate]=\"column.cellTemplate\"\n                              [ghostCellTemplate]=\"column.ghostCellTemplate\"\n                              [treeToggleTemplate]=\"column.treeToggleTemplate\"\n                              [cellClass]=\"column.cellClass\"\n                              [headerTemplate]=\"column.headerTemplate\"\n                              [headerClass]=\"column.headerClass\"\n                              [headerCheckboxable]=\"column.headerCheckboxable\"\n                              [isTreeColumn]=\"column.isTreeColumn\"\n                              [treeLevelIndent]=\"column.treeLevelIndent\"\n                              [summaryFunc]=\"column.summaryFunc\"\n                              [summaryTemplate]=\"column.summaryTemplate\"\n        ></ngx-datatable-column>\n\n        <ngx-datatable-footer>\n          <ng-template\n            ngx-datatable-footer-template\n            let-rowCount=\"rowCount\"\n            let-pageSizeCurrent=\"pageSize\"\n            let-selectedCount=\"selectedCount\"\n            let-curPage=\"curPage\"\n            let-offset=\"offset\"\n          >\n            <div class=\"label\" id=\"total-elements\">\n              <span>{{ t('t.total') }}: {{rowCount}}</span>\n              <span *ngIf=\"selectedCount\">&nbsp;&nbsp;|&nbsp;&nbsp;{{ t('t.selected') }}: {{selectedCount}}</span>\n            </div>\n            <div class=\"pagination\" [style.display]=\"!((rowCount / pageSize) > 1) ? 'none' : null\">\n              <biit-datatable-pager #pager\n                                    [page]=\"curPage\"\n                                    [size]=\"pageSizeCurrent\"\n                                    [count]=\"rowCount\"\n                                    [hidden]=\"!((rowCount / pageSize) > 1)\"\n                                    (change)=\"table.onFooterPage($event)\">\n              </biit-datatable-pager>\n            </div>\n            <div class=\"page-items\" *ngIf=\"pageSizeList\">\n              <div *ngIf=\"pageSizeList?.length\">\n                <span>{{ t('t.rows-per-page') }}:</span>\n                <select [(ngModel)]=\"pageSize\"\n                        (ngModelChange)=\"pager.size = $event\">\n                  <option *ngFor=\"let size of pageSizeList\"\n                          [ngValue]=\"size\"\n                  >\n                    {{size}}\n                  </option>\n                </select>\n              </div>\n            </div>\n          </ng-template>\n        </ngx-datatable-footer>\n      </ngx-datatable>\n    </ng-container>\n  </div>\n</div>\n", styles: [".table-canvas{height:100%;display:flex;flex-direction:column;gap:14px;background:var(--chart-background);color:var(--table-text-color)}.table-canvas .top{display:flex;flex:0}.table-canvas .top .action-bar{display:flex;flex:1}.table-canvas .top .options{display:flex;flex:0}.table-canvas .table{position:relative;flex:1;min-height:0;min-width:0}.table-canvas .table biit-progress-bar{position:absolute;z-index:1;left:0;right:3px;top:42px}.table-canvas .table ::ng-deep ngx-datatable{height:100%;position:absolute;inset:0}.table-canvas .table ::ng-deep ngx-datatable>div{height:calc(100% - 42px)}.table-canvas .table ::ng-deep ngx-datatable>div>div{height:100%}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner{height:inherit}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap{height:100%!important;width:calc(100% - 3px);display:flex;align-items:center;justify-content:center;background:var(--table-header-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap span{color:var(--table-text-color);font-size:16px;line-height:100%;font-weight:700;text-transform:uppercase}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap .sort-btn{position:absolute;right:14px}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap:has(biit-checkbox){background:var(--chart-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-body{height:100%!important;overflow-y:auto!important}.table-canvas .table ::ng-deep ngx-datatable datatable-body .empty-row{height:100%;display:flex;align-items:center;justify-content:center}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row .datatable-body-cell-label{display:flex;align-items:center;min-height:42px;border-bottom:3px solid var(--table-header-color);width:calc(100% - 3px);padding:9px 14px;line-height:120%;height:100%}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row:hover .datatable-body-cell-label{background:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row.active .datatable-body-cell-label{background:var(--main-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer{position:absolute;bottom:0;background:var(--chart-background);z-index:10}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .label{flex:1 0}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .pagination{display:flex;margin:auto;flex:0;justify-content:center}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .pagination biit-datatable-pager{flex:none!important}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items{flex:1 0;display:flex;justify-content:flex-end;align-items:center;color:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select{appearance:none;border:none;height:34px;min-width:34px;padding:8px 14px;text-align:end;font-size:14px;font-family:Montserrat,serif;cursor:pointer;background:var(--chart-background);color:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select:focus-visible{outline:none;background:var(--main-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select:hover{background:var(--main-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select *{background:var(--chart-background);padding:5px}.table-canvas .table ::ng-deep ngx-datatable:has(datatable-footer) datatable-body{height:calc(100% - 48px)!important}::ng-deep ngx-datatable .auto-details-height .datatable-row-wrapper{height:unset!important}::ng-deep ngx-datatable .auto-details-height .datatable-row-wrapper .datatable-row-detail{height:unset!important}.default-menu{display:flex;flex-direction:row}@media screen and (max-width: 600px){.page-items,.page-size-selector,.horizontal-menu{display:none!important}}@media screen and (min-width: 601px){.vertical-menu{display:none!important}}\n"] }]
+            args: [{ selector: 'biit-datatable', providers: [provideTranslocoScope({ scope: 'wizardry-theme/table', alias: 't' })], template: "<div id=\"biit-table\" class=\"table-canvas\" *transloco=\"let t\">\n  <div class=\"top\" *ngIf=\"!hideHeader\">\n    <div id=\"menu\" class=\"action-bar\">\n      <biit-vertical-menu *ngIf=\"actionsTpl\" class=\"vertical-menu\">\n        <ng-container *ngTemplateOutlet=\"actionsTpl\"></ng-container>\n      </biit-vertical-menu>\n      <div *ngIf=\"actionsTpl\" class=\"horizontal-menu default-menu\">\n        <ng-container *ngTemplateOutlet=\"actionsTpl\"></ng-container>\n      </div>\n      <div class=\"default-menu\" *ngIf=\"!actionsTpl\">\n        <ng-content></ng-content>\n      </div>\n    </div>\n    <div id=\"options\" class=\"options\">\n      <biit-input-text id=\"search\" #searchInput\n                       [ngModel]=\"search\"\n                       (onActionPerformed)=\"\n                         onFilter($event, true);\n                       \"\n                       (ngModelChange)=\"onFilter($event)\"\n                       (focusout)=\"searchInput.value = search\"\n                       icon=\"search\"\n                       [placeholder]=\"t('t.search')\"\n      ></biit-input-text>\n      <biit-multiselect id=\"column-selector\" [ngModel]=\"_columns\"\n                        (ngModelChange)=\"setColumnVisibility($event)\"\n                        [data]=\"allColumns\"\n                        label=\"name\"\n                        value=\"visible\"\n                        [type]=\"BiitMultiselectType.ICON\"\n                        [title]=\"t('t.column-selector')\"\n                        [compact]=\"true\"\n      ></biit-multiselect>\n    </div>\n  </div>\n  <div id=\"content\" class=\"table\">\n    <biit-progress-bar *ngIf=\"loading\"></biit-progress-bar>\n    <ng-container *ngIf=\"!serverSide\">\n      <ngx-datatable #table\n                     [rows]=\"data\"\n                     [columns]=\"_columns\"\n                     [columnMode]=\"'force'\"\n                     [headerHeight]=\"42\"\n                     [footerHeight]=\"hideFooter ? 0 : 34\"\n                     [rowHeight]=\"'auto'\"\n                     [reorderable]=\"false\"\n                     [selectionType]=\"SelectionType.checkbox\"\n                     [selected]=\"selected\"\n                     (select)=\"onSelect($event)\"\n                     (activate)=\"onActivate($event)\"\n                     [virtualization]=\"false\"\n                     [scrollbarVDynamic]=\"true\"\n                     [limit]=\"pageSize\"\n                     [scrollbarH]=\"scrollbarH\"\n                     [messages]=\"{emptyMessage: t('t.empty-message')}\"\n      >\n        <ngx-datatable-column *ngIf=\"selectable && !singleSelection\"\n                              #chkbox\n                              [width]=\"42\"\n                              [sortable]=\"false\"\n                              [canAutoResize]=\"false\"\n                              [draggable]=\"false\"\n                              [resizeable]=\"false\"\n                              [name]=\"'chkbox'\"\n        >\n          <ng-template\n            ngx-datatable-header-template\n            let-value=\"value\"\n            let-allRowsSelected=\"allRowsSelected\"\n            let-selectFn=\"selectFn\"\n          >\n            <biit-checkbox [ngModel]=\"allRowsSelected\" (ngModelChange)=\"selectFn(!allRowsSelected)\"></biit-checkbox>\n          </ng-template>\n          <ng-template\n            ngx-datatable-cell-template\n            let-value=\"value\"\n            let-isSelected=\"isSelected\"\n            let-onCheckboxChangeFn=\"onCheckboxChangeFn\"\n          >\n            <biit-checkbox [ngModel]=\"isSelected\" (ngModelChange)=\"onCheckboxChangeFn($event)\"></biit-checkbox>\n          </ng-template>\n        </ngx-datatable-column>\n\n        <ngx-datatable-column *ngFor=\"let column of _columns\"\n                              [name]=\"column.name\"\n                              [prop]=\"column.prop\"\n                              [checkboxable]=\"column.checkboxable\"\n                              [frozenLeft]=\"column.frozenLeft\"\n                              [frozenRight]=\"column.frozenRight\"\n                              [flexGrow]=\"column.flexGrow\"\n                              [minWidth]=\"column.minWidth\"\n                              [maxWidth]=\"column.maxWidth\"\n                              [width]=\"column.width\"\n                              [resizeable]=\"column.resizeable\"\n                              [comparator]=\"column.comparator\"\n                              [pipe]=\"column.pipe\"\n                              [sortable]=\"column.sortable\"\n                              [draggable]=\"column.draggable\"\n                              [canAutoResize]=\"column.canAutoResize\"\n                              [cellTemplate]=\"column.cellTemplate\"\n                              [ghostCellTemplate]=\"column.ghostCellTemplate\"\n                              [treeToggleTemplate]=\"column.treeToggleTemplate\"\n                              [cellClass]=\"column.cellClass\"\n                              [headerTemplate]=\"column.headerTemplate\"\n                              [headerClass]=\"column.headerClass\"\n                              [headerCheckboxable]=\"column.headerCheckboxable\"\n                              [isTreeColumn]=\"column.isTreeColumn\"\n                              [treeLevelIndent]=\"column.treeLevelIndent\"\n                              [summaryFunc]=\"column.summaryFunc\"\n                              [summaryTemplate]=\"column.summaryTemplate\"\n        ></ngx-datatable-column>\n\n        <ngx-datatable-footer id=\"datatable-footer\">\n          <ng-template\n            ngx-datatable-footer-template\n            let-rowCount=\"rowCount\"\n            let-pageSizeCurrent=\"pageSize\"\n            let-selectedCount=\"selectedCount\"\n            let-curPage=\"curPage\"\n            let-offset=\"offset\"\n          >\n            <div class=\"label\">\n              <span>{{ t('t.total') }}: </span><span id=\"total-number-of-items\">{{rowCount}}</span>\n              <span *ngIf=\"selectedCount\">&nbsp;&nbsp;|&nbsp;&nbsp;{{ t('t.selected') }}: </span><span *ngIf=\"selectedCount\" id=\"number-of-items-selected\">{{selectedCount}}</span>\n            </div>\n            <div class=\"pagination\" [style.display]=\"!((rowCount / pageSize) > 1) ? 'none' : null\">\n              <biit-datatable-pager #pager\n                                    [page]=\"curPage\"\n                                    [size]=\"pageSizeCurrent\"\n                                    [count]=\"rowCount\"\n                                    [hidden]=\"!((rowCount / pageSize) > 1)\"\n                                    (change)=\"table.onFooterPage($event)\">\n              </biit-datatable-pager>\n            </div>\n            <div class=\"page-items\" *ngIf=\"pageSizeList\">\n              <div *ngIf=\"pageSizeList?.length\">\n                <span>{{ t('t.rows-per-page') }}:</span>\n                <select [(ngModel)]=\"pageSize\"\n                        (ngModelChange)=\"pager.size = $event\">\n                  <option *ngFor=\"let size of pageSizeList\"\n                          [ngValue]=\"size\"\n                  >\n                    {{size}}\n                  </option>\n                </select>\n              </div>\n            </div>\n          </ng-template>\n        </ngx-datatable-footer>\n      </ngx-datatable>\n    </ng-container>\n\n    <ng-container *ngIf=\"serverSide\">\n      <ngx-datatable #table\n                     [rows]=\"data\"\n                     [columns]=\"_columns\"\n                     [columnMode]=\"'force'\"\n                     [headerHeight]=\"42\"\n                     [footerHeight]=\"hideFooter ? 0 : 34\"\n                     [rowHeight]=\"'auto'\"\n                     [reorderable]=\"false\"\n                     [selectionType]=\"SelectionType.checkbox\"\n                     [selected]=\"selected\"\n                     (select)=\"onSelect($event)\"\n                     (activate)=\"onActivate($event)\"\n                     [virtualization]=\"false\"\n                     [scrollbarVDynamic]=\"true\"\n                     [scrollbarH]=\"scrollbarH\"\n                     [messages]=\"{emptyMessage: t('t.empty-message')}\"\n                     [externalPaging]=\"true\"\n                     [count]=\"page.totalElements\"\n                     [offset]=\"page.pageNumber\"\n                     [limit]=\"page.pageSize\"\n                     (page)=\"onFooterPageChange($event)\"\n      >\n        <ngx-datatable-column *ngIf=\"selectable && !singleSelection\"\n                              #chkbox\n                              [width]=\"42\"\n                              [sortable]=\"false\"\n                              [canAutoResize]=\"false\"\n                              [draggable]=\"false\"\n                              [resizeable]=\"false\"\n                              [name]=\"'chkbox'\"\n        >\n          <ng-template\n            ngx-datatable-header-template\n            let-value=\"value\"\n            let-allRowsSelected=\"allRowsSelected\"\n            let-selectFn=\"selectFn\"\n          >\n            <biit-checkbox [ngModel]=\"allRowsSelected\" (ngModelChange)=\"selectFn(!allRowsSelected)\"></biit-checkbox>\n          </ng-template>\n          <ng-template\n            ngx-datatable-cell-template\n            let-value=\"value\"\n            let-isSelected=\"isSelected\"\n            let-onCheckboxChangeFn=\"onCheckboxChangeFn\"\n          >\n            <biit-checkbox [ngModel]=\"isSelected\" (ngModelChange)=\"onCheckboxChangeFn($event)\"></biit-checkbox>\n          </ng-template>\n        </ngx-datatable-column>\n\n        <ngx-datatable-column *ngFor=\"let column of _columns\"\n                              [name]=\"column.name\"\n                              [prop]=\"column.prop\"\n                              [checkboxable]=\"column.checkboxable\"\n                              [frozenLeft]=\"column.frozenLeft\"\n                              [frozenRight]=\"column.frozenRight\"\n                              [flexGrow]=\"column.flexGrow\"\n                              [minWidth]=\"column.minWidth\"\n                              [maxWidth]=\"column.maxWidth\"\n                              [width]=\"column.width\"\n                              [resizeable]=\"column.resizeable\"\n                              [comparator]=\"column.comparator\"\n                              [pipe]=\"column.pipe\"\n                              [sortable]=\"column.sortable\"\n                              [draggable]=\"column.draggable\"\n                              [canAutoResize]=\"column.canAutoResize\"\n                              [cellTemplate]=\"column.cellTemplate\"\n                              [ghostCellTemplate]=\"column.ghostCellTemplate\"\n                              [treeToggleTemplate]=\"column.treeToggleTemplate\"\n                              [cellClass]=\"column.cellClass\"\n                              [headerTemplate]=\"column.headerTemplate\"\n                              [headerClass]=\"column.headerClass\"\n                              [headerCheckboxable]=\"column.headerCheckboxable\"\n                              [isTreeColumn]=\"column.isTreeColumn\"\n                              [treeLevelIndent]=\"column.treeLevelIndent\"\n                              [summaryFunc]=\"column.summaryFunc\"\n                              [summaryTemplate]=\"column.summaryTemplate\"\n        ></ngx-datatable-column>\n\n        <ngx-datatable-footer>\n          <ng-template\n            ngx-datatable-footer-template\n            let-rowCount=\"rowCount\"\n            let-pageSizeCurrent=\"pageSize\"\n            let-selectedCount=\"selectedCount\"\n            let-curPage=\"curPage\"\n            let-offset=\"offset\"\n          >\n            <div class=\"label\" id=\"total-elements\">\n              <span>{{ t('t.total') }}: {{rowCount}}</span>\n              <span *ngIf=\"selectedCount\">&nbsp;&nbsp;|&nbsp;&nbsp;{{ t('t.selected') }}: {{selectedCount}}</span>\n            </div>\n            <div class=\"pagination\" [style.display]=\"!((rowCount / pageSize) > 1) ? 'none' : null\">\n              <biit-datatable-pager #pager\n                                    [page]=\"curPage\"\n                                    [size]=\"pageSizeCurrent\"\n                                    [count]=\"rowCount\"\n                                    [hidden]=\"!((rowCount / pageSize) > 1)\"\n                                    (change)=\"table.onFooterPage($event)\">\n              </biit-datatable-pager>\n            </div>\n            <div class=\"page-items\" *ngIf=\"pageSizeList\">\n              <div *ngIf=\"pageSizeList?.length\">\n                <span>{{ t('t.rows-per-page') }}:</span>\n                <select [(ngModel)]=\"pageSize\"\n                        (ngModelChange)=\"pager.size = $event\">\n                  <option *ngFor=\"let size of pageSizeList\"\n                          [ngValue]=\"size\"\n                  >\n                    {{size}}\n                  </option>\n                </select>\n              </div>\n            </div>\n          </ng-template>\n        </ngx-datatable-footer>\n      </ngx-datatable>\n    </ng-container>\n  </div>\n</div>\n", styles: [".table-canvas{height:100%;display:flex;flex-direction:column;gap:14px;background:var(--table-background-color);color:var(--table-text-color)}.table-canvas .top{display:flex;flex:0}.table-canvas .top .action-bar{display:flex;flex:1}.table-canvas .top .options{display:flex;flex:0}.table-canvas .table{position:relative;flex:1;min-height:0;min-width:0}.table-canvas .table biit-progress-bar{position:absolute;z-index:1;left:0;right:3px;top:42px}.table-canvas .table ::ng-deep ngx-datatable{height:100%;position:absolute;inset:0}.table-canvas .table ::ng-deep ngx-datatable>div{height:calc(100% - 42px)}.table-canvas .table ::ng-deep ngx-datatable>div>div{height:100%}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner{height:inherit}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap{height:100%!important;width:calc(100% - 3px);display:flex;align-items:center;justify-content:center;background:var(--table-header-color);color:var(--table-header-text)}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap span{color:var(--table-text-color);font-size:16px;line-height:100%;font-weight:700;text-transform:uppercase}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap .sort-btn{position:absolute;right:14px}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap:has(biit-checkbox){background:var(--table-background-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-body{height:100%!important;overflow-y:auto!important}.table-canvas .table ::ng-deep ngx-datatable datatable-body .empty-row{height:100%;display:flex;align-items:center;justify-content:center}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row .datatable-body-cell-label{display:flex;align-items:center;min-height:42px;border-bottom:3px solid var(--table-header-color);width:calc(100% - 3px);padding:9px 14px;line-height:120%;height:100%}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row:hover .datatable-body-cell-label{background:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row.active .datatable-body-cell-label{background:var(--table-active-row-backgorund-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer{position:absolute;bottom:0;background:var(--table-background-color);z-index:10}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .label{flex:1 0}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .pagination{display:flex;margin:auto;flex:0;justify-content:center}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .pagination biit-datatable-pager{flex:none!important}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items{flex:1 0;display:flex;justify-content:flex-end;align-items:center;color:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select{appearance:none;border:none;height:34px;min-width:34px;padding:8px 14px;text-align:end;font-size:14px;font-family:Montserrat,serif;cursor:pointer;background:var(--table-background-color);color:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select:focus-visible{outline:none;background:var(--table-active-row-backgorund-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select:hover{background:var(--table-active-row-backgorund-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select *{background:var(--table-background-color);padding:5px}.table-canvas .table ::ng-deep ngx-datatable:has(datatable-footer) datatable-body{height:calc(100% - 48px)!important}::ng-deep ngx-datatable .auto-details-height .datatable-row-wrapper{height:unset!important}::ng-deep ngx-datatable .auto-details-height .datatable-row-wrapper .datatable-row-detail{height:unset!important}.default-menu{display:flex;flex-direction:row}@media screen and (max-width: 600px){.page-items,.page-size-selector,.horizontal-menu{display:none!important}}@media screen and (min-width: 601px){.vertical-menu{display:none!important}}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.BiitIconService }]; }, propDecorators: { table: [{
                 type: ViewChild,
                 args: ['table']

package/fesm2015/biit-solutions-wizardry-theme-button.mjs

@@ -198,10 +198,10 @@ class BiitActionButtonComponent {
     }
 }
 BiitActionButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BiitActionButtonComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-BiitActionButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: BiitActionButtonComponent, selector: "biit-action-button", inputs: { position: "position", additionalX: "additionalX", additionalY: "additionalY" }, queries: [{ propertyName: "inputButtons", predicate: BiitIconButtonComponent }], ngImport: i0, template: "<div id=\"fab\" class=\"floating-action-button\" [ngStyle]=\"positionStyle()\" (pointerover)=\"hover = true;\" (pointerleave)=\"hover = false\">\n    <ng-content></ng-content>\n</div>\n", styles: [":root{--main-color: #F20D5E;--popup-background-color: rgba(0, 0, 0, .15);--main-background: #D9D9D9;--body-background: #EDEDED;--light-background: #D7D7D7;--error-color: #A1093F;--warning-color: var(--main-color);--floating-background: white;--main-font-color: white;--secondary-color: #808080;--secondary-text-color: #EDEDED;--secondary-background-color: #808080;--disabled-primary-color: #808080;--disabled-secondary-color: var(--main-color);--component-color: #262626;--active-color: var(--component-color);--hover-color: #EDEDED;--hover-primary-color: var(--main-color);--secondary-button-color: var(--component-color);--secondary-button-background-color: var(--main-font-color);--secondary-button-hover-background: var(--main-background);--secondary-button-active-background: var(--main-background);--quaternary-button-color: var(--main-font-color);--quaternary-button-background-color: var(--error-color);--quaternary-button-hover-background: var(--main-color);--quaternary-button-active-background: var(--main-color);--text-hover-color: #5A6473;--selected-color: #FBAEC9;--chart-background: #FFFFFF;--chart-component-color: var(--component-color);--icon-color: var(--main-color);--table-header-color: var(--component-color);--table-border-color: var(--table-header-color);--table-selected-row-color: var(--main-background);--table-text-color: var(--secondary-text-color);--scrollbar-color: var(--main-color);--menu-button-active: var(--main-color);--disabled-menu-color: #D9D9D9;--disabled-menu-color-hover: #FFFFFF;--nav-menu-hover-color: #70757e;--nav-menu-text-hover-color: var(--text-hover-color);--nav-menu-active-background: var(--hover-color);--nav-menu-disable-font: var(--hover-color);--nav-menu-separator-color: var(--secondary-color);--nav-menu-font-color: var(--nav-menu-hover-color);--nav-menu-font-disabled-color: #8a909a;--nav-menu-background-color: #FFFFFF;--nav-menu-active-color: var(--hover-color);--nav-menu-border-color: rgba(0, 0, 0, .18);--input-text-background: var(--main-background);--input-text-focus-background: var(--main-background);--input-text-hover-background: var(--main-background);--popup-color: var(--component-color);--popup-background: #FFFFFF;--popup-error-color: var(--error-color)}.floating-action-button{box-sizing:border-box;position:fixed;z-index:999;opacity:50%;background:white;border:3px solid var(--component-color);display:flex;flex-direction:column;justify-content:flex-end}.floating-action-button:hover{opacity:100%}.floating-action-button:hover ::ng-deep button:not(:first-child){display:flex}.floating-action-button ::ng-deep button:not(:first-child){display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
+BiitActionButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: BiitActionButtonComponent, selector: "biit-action-button", inputs: { position: "position", additionalX: "additionalX", additionalY: "additionalY" }, queries: [{ propertyName: "inputButtons", predicate: BiitIconButtonComponent }], ngImport: i0, template: "<div id=\"fab\" class=\"floating-action-button\" [ngStyle]=\"positionStyle()\" (pointerover)=\"hover = true;\" (pointerleave)=\"hover = false\">\n    <ng-content></ng-content>\n</div>\n", styles: [":root{--main-color: #F20D5E;--popup-background-color: rgba(0, 0, 0, .15);--main-background: #D9D9D9;--body-background: #EDEDED;--light-background: #D7D7D7;--error-color: #A1093F;--warning-color: var(--main-color);--floating-background: white;--main-font-color: white;--secondary-color: #808080;--secondary-text-color: #EDEDED;--secondary-background-color: #808080;--disabled-primary-color: #808080;--disabled-secondary-color: var(--main-color);--component-color: #262626;--active-color: var(--component-color);--hover-color: #EDEDED;--hover-primary-color: var(--main-color);--secondary-button-color: var(--component-color);--secondary-button-background-color: var(--main-font-color);--secondary-button-hover-background: var(--main-background);--secondary-button-active-background: var(--main-background);--quaternary-button-color: var(--main-font-color);--quaternary-button-background-color: var(--error-color);--quaternary-button-hover-background: var(--main-color);--quaternary-button-active-background: var(--main-color);--text-hover-color: #5A6473;--selected-color: #FBAEC9;--chart-background: #FFFFFF;--chart-component-color: var(--component-color);--icon-color: var(--main-color);--table-header-color: var(--component-color);--table-header-text: var(--main-background);--table-background-color: var(--chart-background);--table-hover-background-color: var(--chart-background);--table-border-color: var(--table-header-color);--table-selected-row-color: var(--main-background);--table-text-color: var(--secondary-text-color);--table-active-row-backgorund-color: var(--main-background);--scrollbar-color: var(--main-color);--menu-button-active: var(--main-color);--disabled-menu-color: #D9D9D9;--disabled-menu-color-hover: #FFFFFF;--nav-menu-hover-color: #70757e;--nav-menu-text-hover-color: var(--text-hover-color);--nav-menu-active-background: var(--hover-color);--nav-menu-disable-font: var(--hover-color);--nav-menu-separator-color: var(--secondary-color);--nav-menu-font-color: var(--nav-menu-hover-color);--nav-menu-font-disabled-color: #8a909a;--nav-menu-background-color: #FFFFFF;--nav-menu-active-color: var(--hover-color);--nav-menu-border-color: rgba(0, 0, 0, .18);--input-text-background: var(--main-background);--input-text-focus-background: var(--main-background);--input-text-hover-background: var(--main-background);--popup-color: var(--component-color);--popup-background: #FFFFFF;--popup-error-color: var(--error-color);--popup-close-button: var(--main-color)}.floating-action-button{box-sizing:border-box;position:fixed;z-index:999;opacity:50%;background:white;border:3px solid var(--component-color);display:flex;flex-direction:column;justify-content:flex-end}.floating-action-button:hover{opacity:100%}.floating-action-button:hover ::ng-deep button:not(:first-child){display:flex}.floating-action-button ::ng-deep button:not(:first-child){display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BiitActionButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'biit-action-button', template: "<div id=\"fab\" class=\"floating-action-button\" [ngStyle]=\"positionStyle()\" (pointerover)=\"hover = true;\" (pointerleave)=\"hover = false\">\n    <ng-content></ng-content>\n</div>\n", styles: [":root{--main-color: #F20D5E;--popup-background-color: rgba(0, 0, 0, .15);--main-background: #D9D9D9;--body-background: #EDEDED;--light-background: #D7D7D7;--error-color: #A1093F;--warning-color: var(--main-color);--floating-background: white;--main-font-color: white;--secondary-color: #808080;--secondary-text-color: #EDEDED;--secondary-background-color: #808080;--disabled-primary-color: #808080;--disabled-secondary-color: var(--main-color);--component-color: #262626;--active-color: var(--component-color);--hover-color: #EDEDED;--hover-primary-color: var(--main-color);--secondary-button-color: var(--component-color);--secondary-button-background-color: var(--main-font-color);--secondary-button-hover-background: var(--main-background);--secondary-button-active-background: var(--main-background);--quaternary-button-color: var(--main-font-color);--quaternary-button-background-color: var(--error-color);--quaternary-button-hover-background: var(--main-color);--quaternary-button-active-background: var(--main-color);--text-hover-color: #5A6473;--selected-color: #FBAEC9;--chart-background: #FFFFFF;--chart-component-color: var(--component-color);--icon-color: var(--main-color);--table-header-color: var(--component-color);--table-border-color: var(--table-header-color);--table-selected-row-color: var(--main-background);--table-text-color: var(--secondary-text-color);--scrollbar-color: var(--main-color);--menu-button-active: var(--main-color);--disabled-menu-color: #D9D9D9;--disabled-menu-color-hover: #FFFFFF;--nav-menu-hover-color: #70757e;--nav-menu-text-hover-color: var(--text-hover-color);--nav-menu-active-background: var(--hover-color);--nav-menu-disable-font: var(--hover-color);--nav-menu-separator-color: var(--secondary-color);--nav-menu-font-color: var(--nav-menu-hover-color);--nav-menu-font-disabled-color: #8a909a;--nav-menu-background-color: #FFFFFF;--nav-menu-active-color: var(--hover-color);--nav-menu-border-color: rgba(0, 0, 0, .18);--input-text-background: var(--main-background);--input-text-focus-background: var(--main-background);--input-text-hover-background: var(--main-background);--popup-color: var(--component-color);--popup-background: #FFFFFF;--popup-error-color: var(--error-color)}.floating-action-button{box-sizing:border-box;position:fixed;z-index:999;opacity:50%;background:white;border:3px solid var(--component-color);display:flex;flex-direction:column;justify-content:flex-end}.floating-action-button:hover{opacity:100%}.floating-action-button:hover ::ng-deep button:not(:first-child){display:flex}.floating-action-button ::ng-deep button:not(:first-child){display:none}\n"] }]
+            args: [{ selector: 'biit-action-button', template: "<div id=\"fab\" class=\"floating-action-button\" [ngStyle]=\"positionStyle()\" (pointerover)=\"hover = true;\" (pointerleave)=\"hover = false\">\n    <ng-content></ng-content>\n</div>\n", styles: [":root{--main-color: #F20D5E;--popup-background-color: rgba(0, 0, 0, .15);--main-background: #D9D9D9;--body-background: #EDEDED;--light-background: #D7D7D7;--error-color: #A1093F;--warning-color: var(--main-color);--floating-background: white;--main-font-color: white;--secondary-color: #808080;--secondary-text-color: #EDEDED;--secondary-background-color: #808080;--disabled-primary-color: #808080;--disabled-secondary-color: var(--main-color);--component-color: #262626;--active-color: var(--component-color);--hover-color: #EDEDED;--hover-primary-color: var(--main-color);--secondary-button-color: var(--component-color);--secondary-button-background-color: var(--main-font-color);--secondary-button-hover-background: var(--main-background);--secondary-button-active-background: var(--main-background);--quaternary-button-color: var(--main-font-color);--quaternary-button-background-color: var(--error-color);--quaternary-button-hover-background: var(--main-color);--quaternary-button-active-background: var(--main-color);--text-hover-color: #5A6473;--selected-color: #FBAEC9;--chart-background: #FFFFFF;--chart-component-color: var(--component-color);--icon-color: var(--main-color);--table-header-color: var(--component-color);--table-header-text: var(--main-background);--table-background-color: var(--chart-background);--table-hover-background-color: var(--chart-background);--table-border-color: var(--table-header-color);--table-selected-row-color: var(--main-background);--table-text-color: var(--secondary-text-color);--table-active-row-backgorund-color: var(--main-background);--scrollbar-color: var(--main-color);--menu-button-active: var(--main-color);--disabled-menu-color: #D9D9D9;--disabled-menu-color-hover: #FFFFFF;--nav-menu-hover-color: #70757e;--nav-menu-text-hover-color: var(--text-hover-color);--nav-menu-active-background: var(--hover-color);--nav-menu-disable-font: var(--hover-color);--nav-menu-separator-color: var(--secondary-color);--nav-menu-font-color: var(--nav-menu-hover-color);--nav-menu-font-disabled-color: #8a909a;--nav-menu-background-color: #FFFFFF;--nav-menu-active-color: var(--hover-color);--nav-menu-border-color: rgba(0, 0, 0, .18);--input-text-background: var(--main-background);--input-text-focus-background: var(--main-background);--input-text-hover-background: var(--main-background);--popup-color: var(--component-color);--popup-background: #FFFFFF;--popup-error-color: var(--error-color);--popup-close-button: var(--main-color)}.floating-action-button{box-sizing:border-box;position:fixed;z-index:999;opacity:50%;background:white;border:3px solid var(--component-color);display:flex;flex-direction:column;justify-content:flex-end}.floating-action-button:hover{opacity:100%}.floating-action-button:hover ::ng-deep button:not(:first-child){display:flex}.floating-action-button ::ng-deep button:not(:first-child){display:none}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { position: [{
                 type: Input
             }], additionalX: [{