@biit-solutions/wizardry-theme 1.22.6 → 1.22.7

package/esm2020/inputs/biit-slider-option-vertical/biit-slider-option-vertical.component.mjs

@@ -69,7 +69,7 @@ BiitSliderOptionVerticalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion
             useExisting: forwardRef(() => BiitSliderOptionVerticalComponent),
             multi: true
         }
-    ], viewQueries: [{ propertyName: "slider", first: true, predicate: ["rangerVer"], descendants: true }, { propertyName: "tooltip", first: true, predicate: ["tooltip"], descendants: true }], ngImport: i0, template: "<div class=\"slider-vertical\">\n  <input #rangerVer type=\"range\"\n         orient=\"vertical\"\n         class=\"vertical\"\n         [class.inverted]=\"inverted\"\n         [ngModel]=\"index\"\n         (ngModelChange)=\"onChange(this.data[rangerVer.value].value);\"\n         [min]=\"0\"\n         [max]=\"data.length - 1\"\n         [step]=\"1\"\n         (input)=\"progressScript()\"\n         (pointerdown)=\"tooltipBoxVisible = true\"\n         (pointerup)=\"tooltipBoxVisible = false\"\n  >\n\n  <div class=\"ticks vertical\">\n    <div #tooltip class=\"tooltip-slider\" [style.opacity]=\"tooltipBoxVisible && showTooltip ? '100%' : '0%'\"></div>\n    <div *ngFor=\"let tick of $any(data); index as i; count as c\"\n         class=\"tick\"\n         [class.hide-tick]=\"!(!inverted ? data[i] : data[c-i-1]).label\"\n         >\n      <span></span>\n      <div class=\"label\" [class.show-desc]=\"showDescription\"\n           (click)=\"value = (!inverted ? data[i] : data[c-i-1]).value; onChange((!inverted ? data[i] : data[c-i-1]).value)\">\n        <span>\n          {{(!inverted ? data[i] : data[c-i-1]).label}}\n        </span>\n        <span class=\"description\" *ngIf=\"showDescription\">\n          {{(!inverted ? data[i] : data[c-i-1]).description}}\n        </span>\n        <biit-tooltip-icon *ngIf=\"(!inverted ? data[i] : data[c-i-1]).description && !showDescription\"\n                           [text]=\"(!inverted ? data[i] : data[c-i-1]).description\"\n        ></biit-tooltip-icon>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".slider-vertical{position:relative;flex:1;width:inherit;height:inherit;display:flex}.slider-vertical input[type=range]{font-size:1em;appearance:none;cursor:pointer;border:none;outline:none;background:var(--light-background);height:inherit;width:.3em;writing-mode:vertical-lr;direction:rtl}.slider-vertical input[type=range].inverted{direction:ltr}.slider-vertical input[type=range]::-webkit-slider-thumb{appearance:none;box-sizing:border-box;height:.9em;width:.9em;background-color:var(--light-background);border:.3em solid var(--component-color);-webkit-transition:.2s ease-in-out;transition:.2s ease-in-out}.slider-vertical input[type=range]::-webkit-slider-thumb:hover{background-color:var(--main-color)}.slider-vertical input[type=range]:active::-webkit-slider-thumb{background-color:var(--main-color)}.slider-vertical input[type=range]:focus::-webkit-slider-thumb{background-color:var(--main-color)}.slider-vertical input[type=range]::-moz-range-thumb{appearance:none;box-sizing:border-box;height:.9em;width:.9em;background-color:var(--light-background);border:.3em solid var(--component-color);border-radius:0;-moz-transition:.2s ease-in-out;transition:.2s ease-in-out}.slider-vertical input[type=range]::-moz-range-thumb:hover{background-color:var(--main-color)}.slider-vertical input[type=range]:active::-moz-range-thumb{background-color:var(--main-color)}.slider-vertical input[type=range]:focus::-moz-range-thumb{background-color:var(--main-color)}.slider-vertical .ticks{display:flex;justify-content:space-between;padding:0 0 0 3px;margin-top:5px;position:relative}.slider-vertical .ticks .tick{display:flex;flex:3.5;align-items:center;padding-left:5px;gap:3px}.slider-vertical .ticks .tick:nth-child(2){align-items:end;flex:2}.slider-vertical .ticks .tick:last-child{align-items:start;flex:2}.slider-vertical .ticks .tick.hide-tick{display:none}.slider-vertical .ticks .tick .label{display:flex;font-weight:500;flex:1;cursor:pointer;gap:.5em}.slider-vertical .ticks .tick .label.show-desc{flex-direction:column}.slider-vertical .ticks .tick .label span{line-height:120%}.slider-vertical .ticks .tick .label .description{font-size:.75em;color:gray;line-height:120%;font-style:italic;font-weight:400}.slider-vertical .ticks .tick>span{display:flex;justify-content:center;width:14px;height:16px;padding:7px 2px;background-color:#262626;font-weight:500;box-sizing:border-box;background-clip:content-box;font-size:1em}.slider-vertical .ticks .tick>span>span{position:absolute;top:1rem;-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-align:center;display:flex;justify-content:center;gap:5px}.slider-vertical .ticks .tick>span>span>span{-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-align:center}.slider-vertical .ticks .tick>span>span biit-tooltip-icon{margin:3px}.slider-vertical .ticks .tick>span:nth-child(2)>span{left:0;text-align:left;justify-content:start}.slider-vertical .ticks .tick>span:last-child>span{right:0;text-align:right;justify-content:end}.slider-vertical .ticks.vertical{flex-direction:column-reverse;flex:1;height:inherit;margin:2px;padding:0}.slider-vertical .ticks.vertical>span{width:20px;height:14px;padding:6px}.slider-vertical .tooltip-slider{position:absolute;bottom:4.7em;transition:opacity .2s ease-in-out;pointer-events:none}.slider-vertical .tooltip-slider ::ng-deep span{font-size:1em;background:white;padding:.1em .2em;border:1px solid #262626;display:block;position:relative;min-width:max-content}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.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: i2.RangeValueAccessor, selector: "input[type=range][formControlName],input[type=range][formControl],input[type=range][ngModel]" }, { 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: "component", type: i3.BiitTooltipIconComponent, selector: "biit-tooltip-icon", inputs: ["text", "inline"] }] });
+    ], viewQueries: [{ propertyName: "slider", first: true, predicate: ["rangerVer"], descendants: true }, { propertyName: "tooltip", first: true, predicate: ["tooltip"], descendants: true }], ngImport: i0, template: "<div class=\"slider-vertical\">\n  <input #rangerVer type=\"range\"\n         orient=\"vertical\"\n         class=\"vertical\"\n         [class.inverted]=\"inverted\"\n         [ngModel]=\"index\"\n         (ngModelChange)=\"onChange(this.data[rangerVer.value].value);\"\n         [min]=\"0\"\n         [max]=\"data.length - 1\"\n         [step]=\"1\"\n         (input)=\"progressScript()\"\n         (pointerdown)=\"tooltipBoxVisible = true\"\n         (pointerup)=\"tooltipBoxVisible = false\"\n  >\n\n  <div class=\"ticks vertical\">\n    <div #tooltip class=\"tooltip-slider\" [style.opacity]=\"tooltipBoxVisible && showTooltip ? '100%' : '0%'\"></div>\n    <div *ngFor=\"let tick of $any(data); index as i; count as c\"\n         class=\"tick\"\n         [class.hide-tick]=\"!(!inverted ? data[i] : data[c-i-1]).label\"\n         >\n      <span></span>\n      <div class=\"label\" [class.show-desc]=\"showDescription\"\n           (click)=\"value = (!inverted ? data[i] : data[c-i-1]).value; onChange((!inverted ? data[i] : data[c-i-1]).value)\">\n        <span>\n          {{(!inverted ? data[i] : data[c-i-1]).label}}\n        </span>\n        <span class=\"description\" *ngIf=\"showDescription\">\n          {{(!inverted ? data[i] : data[c-i-1]).description}}\n        </span>\n        <biit-tooltip-icon *ngIf=\"(!inverted ? data[i] : data[c-i-1]).description && !showDescription\"\n                           [text]=\"(!inverted ? data[i] : data[c-i-1]).description\"\n        ></biit-tooltip-icon>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".slider-vertical{position:relative;flex:1;width:inherit;height:inherit;display:flex}.slider-vertical input[type=range]{font-size:1em;appearance:none;cursor:pointer;border:none;outline:none;background:var(--light-background);height:inherit;width:.3em;writing-mode:vertical-lr;direction:rtl}.slider-vertical input[type=range].inverted{direction:ltr}.slider-vertical input[type=range]::-webkit-slider-thumb{appearance:none;box-sizing:border-box;height:.9em;width:.9em;background-color:var(--light-background);border:.3em solid var(--component-color);-webkit-transition:.2s ease-in-out;transition:.2s ease-in-out}.slider-vertical input[type=range]::-webkit-slider-thumb:hover{background-color:var(--main-color)}.slider-vertical input[type=range]:active::-webkit-slider-thumb{background-color:var(--main-color)}.slider-vertical input[type=range]:focus::-webkit-slider-thumb{background-color:var(--main-color)}.slider-vertical input[type=range]::-moz-range-thumb{appearance:none;box-sizing:border-box;height:.9em;width:.9em;background-color:var(--light-background);border:.3em solid var(--component-color);border-radius:0;-moz-transition:.2s ease-in-out;transition:.2s ease-in-out}.slider-vertical input[type=range]::-moz-range-thumb:hover{background-color:var(--main-color)}.slider-vertical input[type=range]:active::-moz-range-thumb{background-color:var(--main-color)}.slider-vertical input[type=range]:focus::-moz-range-thumb{background-color:var(--main-color)}.slider-vertical .ticks{display:flex;justify-content:space-between;padding:0 0 0 3px;margin-top:5px;position:relative}.slider-vertical .ticks .tick{display:flex;flex:3.5;align-items:center;padding-left:5px;gap:3px}.slider-vertical .ticks .tick:nth-child(2){align-items:end;flex:2}.slider-vertical .ticks .tick:last-child{align-items:start;flex:2}.slider-vertical .ticks .tick.hide-tick{display:none}.slider-vertical .ticks .tick .label{display:flex;font-weight:500;flex:1;cursor:pointer;gap:.5em}.slider-vertical .ticks .tick .label.show-desc{flex-direction:column}.slider-vertical .ticks .tick .label span{line-height:120%}.slider-vertical .ticks .tick .label .description{font-size:.75em;color:var(--secondary-color);line-height:120%;font-style:italic;font-weight:400}.slider-vertical .ticks .tick>span{display:flex;justify-content:center;width:14px;height:16px;padding:7px 2px;background-color:var(--component-color);font-weight:500;box-sizing:border-box;background-clip:content-box;font-size:1em}.slider-vertical .ticks .tick>span>span{position:absolute;top:1rem;-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-align:center;display:flex;justify-content:center;gap:5px}.slider-vertical .ticks .tick>span>span>span{-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-align:center}.slider-vertical .ticks .tick>span>span biit-tooltip-icon{margin:3px}.slider-vertical .ticks .tick>span:nth-child(2)>span{left:0;text-align:left;justify-content:start}.slider-vertical .ticks .tick>span:last-child>span{right:0;text-align:right;justify-content:end}.slider-vertical .ticks.vertical{flex-direction:column-reverse;flex:1;height:inherit;margin:2px;padding:0}.slider-vertical .ticks.vertical>span{width:20px;height:14px;padding:6px}.slider-vertical .tooltip-slider{position:absolute;bottom:4.7em;transition:opacity .2s ease-in-out;pointer-events:none}.slider-vertical .tooltip-slider ::ng-deep span{font-size:1em;background:white;padding:.1em .2em;border:1px solid var(--component-color);display:block;position:relative;min-width:max-content}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.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: i2.RangeValueAccessor, selector: "input[type=range][formControlName],input[type=range][formControl],input[type=range][ngModel]" }, { 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: "component", type: i3.BiitTooltipIconComponent, selector: "biit-tooltip-icon", inputs: ["text", "inline"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BiitSliderOptionVerticalComponent, decorators: [{
             type: Component,
             args: [{ selector: 'biit-slider-option-vertical', providers: [
@@ -78,7 +78,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                             useExisting: forwardRef(() => BiitSliderOptionVerticalComponent),
                             multi: true
                         }
-                    ], template: "<div class=\"slider-vertical\">\n  <input #rangerVer type=\"range\"\n         orient=\"vertical\"\n         class=\"vertical\"\n         [class.inverted]=\"inverted\"\n         [ngModel]=\"index\"\n         (ngModelChange)=\"onChange(this.data[rangerVer.value].value);\"\n         [min]=\"0\"\n         [max]=\"data.length - 1\"\n         [step]=\"1\"\n         (input)=\"progressScript()\"\n         (pointerdown)=\"tooltipBoxVisible = true\"\n         (pointerup)=\"tooltipBoxVisible = false\"\n  >\n\n  <div class=\"ticks vertical\">\n    <div #tooltip class=\"tooltip-slider\" [style.opacity]=\"tooltipBoxVisible && showTooltip ? '100%' : '0%'\"></div>\n    <div *ngFor=\"let tick of $any(data); index as i; count as c\"\n         class=\"tick\"\n         [class.hide-tick]=\"!(!inverted ? data[i] : data[c-i-1]).label\"\n         >\n      <span></span>\n      <div class=\"label\" [class.show-desc]=\"showDescription\"\n           (click)=\"value = (!inverted ? data[i] : data[c-i-1]).value; onChange((!inverted ? data[i] : data[c-i-1]).value)\">\n        <span>\n          {{(!inverted ? data[i] : data[c-i-1]).label}}\n        </span>\n        <span class=\"description\" *ngIf=\"showDescription\">\n          {{(!inverted ? data[i] : data[c-i-1]).description}}\n        </span>\n        <biit-tooltip-icon *ngIf=\"(!inverted ? data[i] : data[c-i-1]).description && !showDescription\"\n                           [text]=\"(!inverted ? data[i] : data[c-i-1]).description\"\n        ></biit-tooltip-icon>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".slider-vertical{position:relative;flex:1;width:inherit;height:inherit;display:flex}.slider-vertical input[type=range]{font-size:1em;appearance:none;cursor:pointer;border:none;outline:none;background:var(--light-background);height:inherit;width:.3em;writing-mode:vertical-lr;direction:rtl}.slider-vertical input[type=range].inverted{direction:ltr}.slider-vertical input[type=range]::-webkit-slider-thumb{appearance:none;box-sizing:border-box;height:.9em;width:.9em;background-color:var(--light-background);border:.3em solid var(--component-color);-webkit-transition:.2s ease-in-out;transition:.2s ease-in-out}.slider-vertical input[type=range]::-webkit-slider-thumb:hover{background-color:var(--main-color)}.slider-vertical input[type=range]:active::-webkit-slider-thumb{background-color:var(--main-color)}.slider-vertical input[type=range]:focus::-webkit-slider-thumb{background-color:var(--main-color)}.slider-vertical input[type=range]::-moz-range-thumb{appearance:none;box-sizing:border-box;height:.9em;width:.9em;background-color:var(--light-background);border:.3em solid var(--component-color);border-radius:0;-moz-transition:.2s ease-in-out;transition:.2s ease-in-out}.slider-vertical input[type=range]::-moz-range-thumb:hover{background-color:var(--main-color)}.slider-vertical input[type=range]:active::-moz-range-thumb{background-color:var(--main-color)}.slider-vertical input[type=range]:focus::-moz-range-thumb{background-color:var(--main-color)}.slider-vertical .ticks{display:flex;justify-content:space-between;padding:0 0 0 3px;margin-top:5px;position:relative}.slider-vertical .ticks .tick{display:flex;flex:3.5;align-items:center;padding-left:5px;gap:3px}.slider-vertical .ticks .tick:nth-child(2){align-items:end;flex:2}.slider-vertical .ticks .tick:last-child{align-items:start;flex:2}.slider-vertical .ticks .tick.hide-tick{display:none}.slider-vertical .ticks .tick .label{display:flex;font-weight:500;flex:1;cursor:pointer;gap:.5em}.slider-vertical .ticks .tick .label.show-desc{flex-direction:column}.slider-vertical .ticks .tick .label span{line-height:120%}.slider-vertical .ticks .tick .label .description{font-size:.75em;color:gray;line-height:120%;font-style:italic;font-weight:400}.slider-vertical .ticks .tick>span{display:flex;justify-content:center;width:14px;height:16px;padding:7px 2px;background-color:#262626;font-weight:500;box-sizing:border-box;background-clip:content-box;font-size:1em}.slider-vertical .ticks .tick>span>span{position:absolute;top:1rem;-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-align:center;display:flex;justify-content:center;gap:5px}.slider-vertical .ticks .tick>span>span>span{-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-align:center}.slider-vertical .ticks .tick>span>span biit-tooltip-icon{margin:3px}.slider-vertical .ticks .tick>span:nth-child(2)>span{left:0;text-align:left;justify-content:start}.slider-vertical .ticks .tick>span:last-child>span{right:0;text-align:right;justify-content:end}.slider-vertical .ticks.vertical{flex-direction:column-reverse;flex:1;height:inherit;margin:2px;padding:0}.slider-vertical .ticks.vertical>span{width:20px;height:14px;padding:6px}.slider-vertical .tooltip-slider{position:absolute;bottom:4.7em;transition:opacity .2s ease-in-out;pointer-events:none}.slider-vertical .tooltip-slider ::ng-deep span{font-size:1em;background:white;padding:.1em .2em;border:1px solid #262626;display:block;position:relative;min-width:max-content}\n"] }]
+                    ], template: "<div class=\"slider-vertical\">\n  <input #rangerVer type=\"range\"\n         orient=\"vertical\"\n         class=\"vertical\"\n         [class.inverted]=\"inverted\"\n         [ngModel]=\"index\"\n         (ngModelChange)=\"onChange(this.data[rangerVer.value].value);\"\n         [min]=\"0\"\n         [max]=\"data.length - 1\"\n         [step]=\"1\"\n         (input)=\"progressScript()\"\n         (pointerdown)=\"tooltipBoxVisible = true\"\n         (pointerup)=\"tooltipBoxVisible = false\"\n  >\n\n  <div class=\"ticks vertical\">\n    <div #tooltip class=\"tooltip-slider\" [style.opacity]=\"tooltipBoxVisible && showTooltip ? '100%' : '0%'\"></div>\n    <div *ngFor=\"let tick of $any(data); index as i; count as c\"\n         class=\"tick\"\n         [class.hide-tick]=\"!(!inverted ? data[i] : data[c-i-1]).label\"\n         >\n      <span></span>\n      <div class=\"label\" [class.show-desc]=\"showDescription\"\n           (click)=\"value = (!inverted ? data[i] : data[c-i-1]).value; onChange((!inverted ? data[i] : data[c-i-1]).value)\">\n        <span>\n          {{(!inverted ? data[i] : data[c-i-1]).label}}\n        </span>\n        <span class=\"description\" *ngIf=\"showDescription\">\n          {{(!inverted ? data[i] : data[c-i-1]).description}}\n        </span>\n        <biit-tooltip-icon *ngIf=\"(!inverted ? data[i] : data[c-i-1]).description && !showDescription\"\n                           [text]=\"(!inverted ? data[i] : data[c-i-1]).description\"\n        ></biit-tooltip-icon>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".slider-vertical{position:relative;flex:1;width:inherit;height:inherit;display:flex}.slider-vertical input[type=range]{font-size:1em;appearance:none;cursor:pointer;border:none;outline:none;background:var(--light-background);height:inherit;width:.3em;writing-mode:vertical-lr;direction:rtl}.slider-vertical input[type=range].inverted{direction:ltr}.slider-vertical input[type=range]::-webkit-slider-thumb{appearance:none;box-sizing:border-box;height:.9em;width:.9em;background-color:var(--light-background);border:.3em solid var(--component-color);-webkit-transition:.2s ease-in-out;transition:.2s ease-in-out}.slider-vertical input[type=range]::-webkit-slider-thumb:hover{background-color:var(--main-color)}.slider-vertical input[type=range]:active::-webkit-slider-thumb{background-color:var(--main-color)}.slider-vertical input[type=range]:focus::-webkit-slider-thumb{background-color:var(--main-color)}.slider-vertical input[type=range]::-moz-range-thumb{appearance:none;box-sizing:border-box;height:.9em;width:.9em;background-color:var(--light-background);border:.3em solid var(--component-color);border-radius:0;-moz-transition:.2s ease-in-out;transition:.2s ease-in-out}.slider-vertical input[type=range]::-moz-range-thumb:hover{background-color:var(--main-color)}.slider-vertical input[type=range]:active::-moz-range-thumb{background-color:var(--main-color)}.slider-vertical input[type=range]:focus::-moz-range-thumb{background-color:var(--main-color)}.slider-vertical .ticks{display:flex;justify-content:space-between;padding:0 0 0 3px;margin-top:5px;position:relative}.slider-vertical .ticks .tick{display:flex;flex:3.5;align-items:center;padding-left:5px;gap:3px}.slider-vertical .ticks .tick:nth-child(2){align-items:end;flex:2}.slider-vertical .ticks .tick:last-child{align-items:start;flex:2}.slider-vertical .ticks .tick.hide-tick{display:none}.slider-vertical .ticks .tick .label{display:flex;font-weight:500;flex:1;cursor:pointer;gap:.5em}.slider-vertical .ticks .tick .label.show-desc{flex-direction:column}.slider-vertical .ticks .tick .label span{line-height:120%}.slider-vertical .ticks .tick .label .description{font-size:.75em;color:var(--secondary-color);line-height:120%;font-style:italic;font-weight:400}.slider-vertical .ticks .tick>span{display:flex;justify-content:center;width:14px;height:16px;padding:7px 2px;background-color:var(--component-color);font-weight:500;box-sizing:border-box;background-clip:content-box;font-size:1em}.slider-vertical .ticks .tick>span>span{position:absolute;top:1rem;-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-align:center;display:flex;justify-content:center;gap:5px}.slider-vertical .ticks .tick>span>span>span{-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-align:center}.slider-vertical .ticks .tick>span>span biit-tooltip-icon{margin:3px}.slider-vertical .ticks .tick>span:nth-child(2)>span{left:0;text-align:left;justify-content:start}.slider-vertical .ticks .tick>span:last-child>span{right:0;text-align:right;justify-content:end}.slider-vertical .ticks.vertical{flex-direction:column-reverse;flex:1;height:inherit;margin:2px;padding:0}.slider-vertical .ticks.vertical>span{width:20px;height:14px;padding:6px}.slider-vertical .tooltip-slider{position:absolute;bottom:4.7em;transition:opacity .2s ease-in-out;pointer-events:none}.slider-vertical .tooltip-slider ::ng-deep span{font-size:1em;background:white;padding:.1em .2em;border:1px solid var(--component-color);display:block;position:relative;min-width:max-content}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { data: [{
                 type: Input
             }], inverted: [{

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

@@ -1,7 +1,8 @@
 import { Component, Input, forwardRef } from '@angular/core';
 import { NG_VALUE_ACCESSOR } from '@angular/forms';
 import * as i0 from "@angular/core";
-import * as i1 from "@angular/forms";
+import * as i1 from "@angular/common";
+import * as i2 from "@angular/forms";
 export class BiitToggleComponent {
     constructor() {
         this.disabled = false;
@@ -23,13 +24,13 @@ export class BiitToggleComponent {
     }
 }
 BiitToggleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BiitToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-BiitToggleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: BiitToggleComponent, selector: "biit-toggle", inputs: { disabled: "disabled" }, providers: [
+BiitToggleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: BiitToggleComponent, selector: "biit-toggle", inputs: { disabled: "disabled", description: "description" }, providers: [
         {
             provide: NG_VALUE_ACCESSOR,
             useExisting: forwardRef(() => BiitToggleComponent),
             multi: true
         }
-    ], ngImport: i0, template: "<label class=\"toggle-base\">\n  <input type=\"checkbox\" id=\"checkbox\"\n         [ngModel]=\"checked\"\n         (ngModelChange)=\"onToggle($event)\"\n         [disabled]=\"disabled\"/>\n  <div class=\"toggle-switch\" id=\"switch\">\n    <div class=\"toggle-trail\"></div>\n    <div class=\"toggle-box\"></div>\n  </div>\n  <a class=\"toggle-label\">\n    <ng-content></ng-content>\n  </a>\n</label>\n", styles: ["input[type=checkbox]{appearance:none;background-color:#fff;margin:0;display:flex;align-items:center;width:-moz-fit-content;width:fit-content;cursor:pointer;font-size:inherit}.toggle-base{display:flex;align-items:flex-start;width:-moz-fit-content;width:fit-content;min-height:1.2em;cursor:pointer;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-base:hover .toggle-box{transform:rotate(15deg) translate(.1em);border:.25em solid var(--main-color)}.toggle-base:has(input:checked) .toggle-trail{background:var(--selected-color)}.toggle-base:has(input:checked) .toggle-box{transform:translate(.7em) rotate(45deg);border:.25em solid var(--main-color);background:var(--main-color)}.toggle-base:has(input:disabled){pointer-events:none;cursor:default}.toggle-base:has(input:disabled) .toggle-trail{background:var(--trail-color)}.toggle-base:has(input:disabled) .toggle-box{border:.25em solid var(--main-background);background:none}.toggle-base:has(input:disabled) .toggle-label{color:var(--main-background)}.toggle-base:has(input:disabled):has(input:checked) .toggle-box{background:var(--main-background)}.toggle-switch{display:flex;align-items:center;position:relative;height:1.2em}.toggle-trail{display:inline-flex;width:1.4em;height:.25em;background:var(--trail-color);z-index:0;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-box{position:absolute;display:inline-flex;height:.7em;width:.7em;border:.25em solid var(--component-color);box-sizing:border-box;z-index:1;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-label{margin-left:.7em;cursor:inherit;line-height:1.2em;-webkit-user-select:none;user-select:none;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-label:empty{display:none}@-moz-document url-prefix(){input:checked~.toggle-switch .toggle-trail{background:var(--selected-color)}input:checked~.toggle-switch .toggle-box{transform:translate(.7em) rotate(45deg)!important;border:.25em solid var(--main-color);background:var(--main-color)}input:disabled~.toggle-switch{pointer-events:none;cursor:default}input:disabled~.toggle-switch .toggle-trail{background:var(--trail-color)}input:disabled~.toggle-switch .toggle-box{border:.25em solid var(--main-background);background:none}input:disabled~.toggle-switch .toggle-label{color:var(--main-background)}input:checked:disabled~.toggle-switch .toggle-box{background:var(--main-background)}}\n"], dependencies: [{ kind: "directive", type: i1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { 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"] }] });
+    ], ngImport: i0, template: "<label class=\"toggle-base\">\n  <input type=\"checkbox\" id=\"checkbox\"\n         [ngModel]=\"checked\"\n         (ngModelChange)=\"onToggle($event)\"\n         [disabled]=\"disabled\"/>\n  <div class=\"toggle-switch\" id=\"switch\">\n    <div class=\"toggle-trail\"></div>\n    <div class=\"toggle-box\"></div>\n  </div>\n  <a class=\"toggle-label\">\n    <ng-content></ng-content>\n  </a>\n  <span *ngIf=\"description\" id=\"description\" class=\"toggle-description\">\n      {{ description }}\n    </span>\n</label>\n", styles: ["input[type=checkbox]{appearance:none;background-color:#fff;margin:0;display:flex;align-items:center;width:-moz-fit-content;width:fit-content;cursor:pointer;font-size:inherit}.toggle-base{display:flex;align-items:flex-start;width:-moz-fit-content;width:fit-content;min-height:1.2em;cursor:pointer;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-base:hover .toggle-box{transform:rotate(15deg) translate(.1em);border:.25em solid var(--main-color)}.toggle-base:has(input:checked) .toggle-trail{background:var(--selected-color)}.toggle-base:has(input:checked) .toggle-box{transform:translate(.7em) rotate(45deg);border:.25em solid var(--main-color);background:var(--main-color)}.toggle-base:has(input:disabled){pointer-events:none;cursor:default}.toggle-base:has(input:disabled) .toggle-trail{background:var(--trail-color)}.toggle-base:has(input:disabled) .toggle-box{border:.25em solid var(--main-background);background:none}.toggle-base:has(input:disabled) .toggle-label{color:var(--main-background)}.toggle-base:has(input:disabled):has(input:checked) .toggle-box{background:var(--main-background)}.toggle-switch{display:flex;align-items:center;position:relative;height:1.2em}.toggle-trail{display:inline-flex;width:1.4em;height:.25em;background:var(--trail-color);z-index:0;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-box{position:absolute;display:inline-flex;height:.7em;width:.7em;border:.25em solid var(--component-color);box-sizing:border-box;z-index:1;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-label{margin-left:.7em;cursor:inherit;line-height:1.2em;-webkit-user-select:none;user-select:none;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-label:empty{display:none}.toggle-description{position:absolute;display:flex;align-items:center;font-size:.75em;color:gray;padding-top:1.4em;min-height:1.05em;line-height:120%;font-style:italic}.toggle-description a{display:block;line-height:1.1em}@-moz-document url-prefix(){input:checked~.toggle-switch .toggle-trail{background:var(--selected-color)}input:checked~.toggle-switch .toggle-box{transform:translate(.7em) rotate(45deg)!important;border:.25em solid var(--main-color);background:var(--main-color)}input:disabled~.toggle-switch{pointer-events:none;cursor:default}input:disabled~.toggle-switch .toggle-trail{background:var(--trail-color)}input:disabled~.toggle-switch .toggle-box{border:.25em solid var(--main-background);background:none}input:disabled~.toggle-switch .toggle-label{color:var(--main-background)}input:checked:disabled~.toggle-switch .toggle-box{background:var(--main-background)}}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { 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"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BiitToggleComponent, decorators: [{
             type: Component,
             args: [{ selector: 'biit-toggle', providers: [
@@ -38,8 +39,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                             useExisting: forwardRef(() => BiitToggleComponent),
                             multi: true
                         }
-                    ], template: "<label class=\"toggle-base\">\n  <input type=\"checkbox\" id=\"checkbox\"\n         [ngModel]=\"checked\"\n         (ngModelChange)=\"onToggle($event)\"\n         [disabled]=\"disabled\"/>\n  <div class=\"toggle-switch\" id=\"switch\">\n    <div class=\"toggle-trail\"></div>\n    <div class=\"toggle-box\"></div>\n  </div>\n  <a class=\"toggle-label\">\n    <ng-content></ng-content>\n  </a>\n</label>\n", styles: ["input[type=checkbox]{appearance:none;background-color:#fff;margin:0;display:flex;align-items:center;width:-moz-fit-content;width:fit-content;cursor:pointer;font-size:inherit}.toggle-base{display:flex;align-items:flex-start;width:-moz-fit-content;width:fit-content;min-height:1.2em;cursor:pointer;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-base:hover .toggle-box{transform:rotate(15deg) translate(.1em);border:.25em solid var(--main-color)}.toggle-base:has(input:checked) .toggle-trail{background:var(--selected-color)}.toggle-base:has(input:checked) .toggle-box{transform:translate(.7em) rotate(45deg);border:.25em solid var(--main-color);background:var(--main-color)}.toggle-base:has(input:disabled){pointer-events:none;cursor:default}.toggle-base:has(input:disabled) .toggle-trail{background:var(--trail-color)}.toggle-base:has(input:disabled) .toggle-box{border:.25em solid var(--main-background);background:none}.toggle-base:has(input:disabled) .toggle-label{color:var(--main-background)}.toggle-base:has(input:disabled):has(input:checked) .toggle-box{background:var(--main-background)}.toggle-switch{display:flex;align-items:center;position:relative;height:1.2em}.toggle-trail{display:inline-flex;width:1.4em;height:.25em;background:var(--trail-color);z-index:0;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-box{position:absolute;display:inline-flex;height:.7em;width:.7em;border:.25em solid var(--component-color);box-sizing:border-box;z-index:1;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-label{margin-left:.7em;cursor:inherit;line-height:1.2em;-webkit-user-select:none;user-select:none;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-label:empty{display:none}@-moz-document url-prefix(){input:checked~.toggle-switch .toggle-trail{background:var(--selected-color)}input:checked~.toggle-switch .toggle-box{transform:translate(.7em) rotate(45deg)!important;border:.25em solid var(--main-color);background:var(--main-color)}input:disabled~.toggle-switch{pointer-events:none;cursor:default}input:disabled~.toggle-switch .toggle-trail{background:var(--trail-color)}input:disabled~.toggle-switch .toggle-box{border:.25em solid var(--main-background);background:none}input:disabled~.toggle-switch .toggle-label{color:var(--main-background)}input:checked:disabled~.toggle-switch .toggle-box{background:var(--main-background)}}\n"] }]
+                    ], template: "<label class=\"toggle-base\">\n  <input type=\"checkbox\" id=\"checkbox\"\n         [ngModel]=\"checked\"\n         (ngModelChange)=\"onToggle($event)\"\n         [disabled]=\"disabled\"/>\n  <div class=\"toggle-switch\" id=\"switch\">\n    <div class=\"toggle-trail\"></div>\n    <div class=\"toggle-box\"></div>\n  </div>\n  <a class=\"toggle-label\">\n    <ng-content></ng-content>\n  </a>\n  <span *ngIf=\"description\" id=\"description\" class=\"toggle-description\">\n      {{ description }}\n    </span>\n</label>\n", styles: ["input[type=checkbox]{appearance:none;background-color:#fff;margin:0;display:flex;align-items:center;width:-moz-fit-content;width:fit-content;cursor:pointer;font-size:inherit}.toggle-base{display:flex;align-items:flex-start;width:-moz-fit-content;width:fit-content;min-height:1.2em;cursor:pointer;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-base:hover .toggle-box{transform:rotate(15deg) translate(.1em);border:.25em solid var(--main-color)}.toggle-base:has(input:checked) .toggle-trail{background:var(--selected-color)}.toggle-base:has(input:checked) .toggle-box{transform:translate(.7em) rotate(45deg);border:.25em solid var(--main-color);background:var(--main-color)}.toggle-base:has(input:disabled){pointer-events:none;cursor:default}.toggle-base:has(input:disabled) .toggle-trail{background:var(--trail-color)}.toggle-base:has(input:disabled) .toggle-box{border:.25em solid var(--main-background);background:none}.toggle-base:has(input:disabled) .toggle-label{color:var(--main-background)}.toggle-base:has(input:disabled):has(input:checked) .toggle-box{background:var(--main-background)}.toggle-switch{display:flex;align-items:center;position:relative;height:1.2em}.toggle-trail{display:inline-flex;width:1.4em;height:.25em;background:var(--trail-color);z-index:0;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-box{position:absolute;display:inline-flex;height:.7em;width:.7em;border:.25em solid var(--component-color);box-sizing:border-box;z-index:1;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-label{margin-left:.7em;cursor:inherit;line-height:1.2em;-webkit-user-select:none;user-select:none;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-label:empty{display:none}.toggle-description{position:absolute;display:flex;align-items:center;font-size:.75em;color:gray;padding-top:1.4em;min-height:1.05em;line-height:120%;font-style:italic}.toggle-description a{display:block;line-height:1.1em}@-moz-document url-prefix(){input:checked~.toggle-switch .toggle-trail{background:var(--selected-color)}input:checked~.toggle-switch .toggle-box{transform:translate(.7em) rotate(45deg)!important;border:.25em solid var(--main-color);background:var(--main-color)}input:disabled~.toggle-switch{pointer-events:none;cursor:default}input:disabled~.toggle-switch .toggle-trail{background:var(--trail-color)}input:disabled~.toggle-switch .toggle-box{border:.25em solid var(--main-background);background:none}input:disabled~.toggle-switch .toggle-label{color:var(--main-background)}input:checked:disabled~.toggle-switch .toggle-box{background:var(--main-background)}}\n"] }]
         }], propDecorators: { disabled: [{
                 type: Input
+            }], description: [{
+                type: Input
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmlpdC10b2dnbGUuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvd2l6YXJkcnktdGhlbWUvaW5wdXRzL3NyYy9iaWl0LXRvZ2dsZS9iaWl0LXRvZ2dsZS5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy93aXphcmRyeS10aGVtZS9pbnB1dHMvc3JjL2JpaXQtdG9nZ2xlL2JpaXQtdG9nZ2xlLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBQyxTQUFTLEVBQUUsS0FBSyxFQUFFLFVBQVUsRUFBQyxNQUFNLGVBQWUsQ0FBQztBQUMzRCxPQUFPLEVBQXVCLGlCQUFpQixFQUFDLE1BQU0sZ0JBQWdCLENBQUM7OztBQWN2RSxNQUFNLE9BQU8sbUJBQW1CO0lBWmhDO1FBYVcsYUFBUSxHQUFHLEtBQUssQ0FBQztRQUcxQixhQUFRLEdBQUcsQ0FBQyxLQUFVLEVBQUUsRUFBRSxHQUFFLENBQUMsQ0FBQztRQUM5QixjQUFTLEdBQUcsR0FBRyxFQUFFLEdBQUUsQ0FBQyxDQUFDO0tBa0J0QjtJQWhCQyxRQUFRLENBQUMsSUFBYTtRQUNwQixJQUFJLENBQUMsT0FBTyxHQUFHLElBQUksQ0FBQztRQUNwQixJQUFJLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsQ0FBQztJQUM5QixDQUFDO0lBRUQsZ0JBQWdCLENBQUMsRUFBTztRQUN0QixJQUFJLENBQUMsUUFBUSxHQUFHLEVBQUUsQ0FBQztJQUNyQixDQUFDO0lBRUQsaUJBQWlCLENBQUMsRUFBTztRQUN2QixJQUFJLENBQUMsU0FBUyxHQUFHLEVBQUUsQ0FBQztJQUN0QixDQUFDO0lBRUQsVUFBVSxDQUFDLEdBQVk7UUFDckIsSUFBSSxDQUFDLE9BQU8sR0FBRyxHQUFHLENBQUM7SUFDckIsQ0FBQzs7aUhBdEJVLG1CQUFtQjtxR0FBbkIsbUJBQW1CLHdFQVJuQjtRQUNUO1lBQ0UsT0FBTyxFQUFFLGlCQUFpQjtZQUMxQixXQUFXLEVBQUUsVUFBVSxDQUFDLEdBQUcsRUFBRSxDQUFDLG1CQUFtQixDQUFDO1lBQ2xELEtBQUssRUFBRSxJQUFJO1NBQ1o7S0FDRiwwQkNiSCxzWkFhQTs0RkRFYSxtQkFBbUI7a0JBWi9CLFNBQVM7K0JBQ0UsYUFBYSxhQUdaO3dCQUNUOzRCQUNFLE9BQU8sRUFBRSxpQkFBaUI7NEJBQzFCLFdBQVcsRUFBRSxVQUFVLENBQUMsR0FBRyxFQUFFLG9CQUFvQixDQUFDOzRCQUNsRCxLQUFLLEVBQUUsSUFBSTt5QkFDWjtxQkFDRjs4QkFHUSxRQUFRO3NCQUFoQixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtDb21wb25lbnQsIElucHV0LCBmb3J3YXJkUmVmfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7Q29udHJvbFZhbHVlQWNjZXNzb3IsIE5HX1ZBTFVFX0FDQ0VTU09SfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2JpaXQtdG9nZ2xlJyxcbiAgdGVtcGxhdGVVcmw6ICdiaWl0LXRvZ2dsZS5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWydiaWl0LXRvZ2dsZS5jb21wb25lbnQuc2NzcyddLFxuICBwcm92aWRlcnM6IFtcbiAgICB7XG4gICAgICBwcm92aWRlOiBOR19WQUxVRV9BQ0NFU1NPUixcbiAgICAgIHVzZUV4aXN0aW5nOiBmb3J3YXJkUmVmKCgpID0+IEJpaXRUb2dnbGVDb21wb25lbnQpLFxuICAgICAgbXVsdGk6IHRydWVcbiAgICB9XG4gIF1cbn0pXG5leHBvcnQgY2xhc3MgQmlpdFRvZ2dsZUNvbXBvbmVudCBpbXBsZW1lbnRzIENvbnRyb2xWYWx1ZUFjY2Vzc29yIHtcbiAgQElucHV0KCkgZGlzYWJsZWQgPSBmYWxzZTtcbiAgY2hlY2tlZDogYm9vbGVhbjtcblxuICBvbkNoYW5nZSA9ICh2YWx1ZTogYW55KSA9PiB7fTtcbiAgb25Ub3VjaGVkID0gKCkgPT4ge307XG5cbiAgb25Ub2dnbGUoaXRlbTogYm9vbGVhbikge1xuICAgIHRoaXMuY2hlY2tlZCA9IGl0ZW07XG4gICAgdGhpcy5vbkNoYW5nZSh0aGlzLmNoZWNrZWQpO1xuICB9XG5cbiAgcmVnaXN0ZXJPbkNoYW5nZShmbjogYW55KTogdm9pZCB7XG4gICAgdGhpcy5vbkNoYW5nZSA9IGZuO1xuICB9XG5cbiAgcmVnaXN0ZXJPblRvdWNoZWQoZm46IGFueSk6IHZvaWQge1xuICAgIHRoaXMub25Ub3VjaGVkID0gZm47XG4gIH1cblxuICB3cml0ZVZhbHVlKG9iajogYm9vbGVhbik6IHZvaWQge1xuICAgIHRoaXMuY2hlY2tlZCA9IG9iajtcbiAgfVxufVxuIiwiPGxhYmVsIGNsYXNzPVwidG9nZ2xlLWJhc2VcIj5cbiAgPGlucHV0IHR5cGU9XCJjaGVja2JveFwiIGlkPVwiY2hlY2tib3hcIlxuICAgICAgICAgW25nTW9kZWxdPVwiY2hlY2tlZFwiXG4gICAgICAgICAobmdNb2RlbENoYW5nZSk9XCJvblRvZ2dsZSgkZXZlbnQpXCJcbiAgICAgICAgIFtkaXNhYmxlZF09XCJkaXNhYmxlZFwiLz5cbiAgPGRpdiBjbGFzcz1cInRvZ2dsZS1zd2l0Y2hcIiBpZD1cInN3aXRjaFwiPlxuICAgIDxkaXYgY2xhc3M9XCJ0b2dnbGUtdHJhaWxcIj48L2Rpdj5cbiAgICA8ZGl2IGNsYXNzPVwidG9nZ2xlLWJveFwiPjwvZGl2PlxuICA8L2Rpdj5cbiAgPGEgY2xhc3M9XCJ0b2dnbGUtbGFiZWxcIj5cbiAgICA8bmctY29udGVudD48L25nLWNvbnRlbnQ+XG4gIDwvYT5cbjwvbGFiZWw+XG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmlpdC10b2dnbGUuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvd2l6YXJkcnktdGhlbWUvaW5wdXRzL3NyYy9iaWl0LXRvZ2dsZS9iaWl0LXRvZ2dsZS5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy93aXphcmRyeS10aGVtZS9pbnB1dHMvc3JjL2JpaXQtdG9nZ2xlL2JpaXQtdG9nZ2xlLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBQyxTQUFTLEVBQUUsS0FBSyxFQUFFLFVBQVUsRUFBQyxNQUFNLGVBQWUsQ0FBQztBQUMzRCxPQUFPLEVBQXVCLGlCQUFpQixFQUFDLE1BQU0sZ0JBQWdCLENBQUM7Ozs7QUFjdkUsTUFBTSxPQUFPLG1CQUFtQjtJQVpoQztRQWFXLGFBQVEsR0FBRyxLQUFLLENBQUM7UUFJMUIsYUFBUSxHQUFHLENBQUMsS0FBVSxFQUFFLEVBQUUsR0FBRSxDQUFDLENBQUM7UUFDOUIsY0FBUyxHQUFHLEdBQUcsRUFBRSxHQUFFLENBQUMsQ0FBQztLQWtCdEI7SUFoQkMsUUFBUSxDQUFDLElBQWE7UUFDcEIsSUFBSSxDQUFDLE9BQU8sR0FBRyxJQUFJLENBQUM7UUFDcEIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsT0FBTyxDQUFDLENBQUM7SUFDOUIsQ0FBQztJQUVELGdCQUFnQixDQUFDLEVBQU87UUFDdEIsSUFBSSxDQUFDLFFBQVEsR0FBRyxFQUFFLENBQUM7SUFDckIsQ0FBQztJQUVELGlCQUFpQixDQUFDLEVBQU87UUFDdkIsSUFBSSxDQUFDLFNBQVMsR0FBRyxFQUFFLENBQUM7SUFDdEIsQ0FBQztJQUVELFVBQVUsQ0FBQyxHQUFZO1FBQ3JCLElBQUksQ0FBQyxPQUFPLEdBQUcsR0FBRyxDQUFDO0lBQ3JCLENBQUM7O2lIQXZCVSxtQkFBbUI7cUdBQW5CLG1CQUFtQixvR0FSbkI7UUFDVDtZQUNFLE9BQU8sRUFBRSxpQkFBaUI7WUFDMUIsV0FBVyxFQUFFLFVBQVUsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxtQkFBbUIsQ0FBQztZQUNsRCxLQUFLLEVBQUUsSUFBSTtTQUNaO0tBQ0YsMEJDYkgsNGdCQWdCQTs0RkREYSxtQkFBbUI7a0JBWi9CLFNBQVM7K0JBQ0UsYUFBYSxhQUdaO3dCQUNUOzRCQUNFLE9BQU8sRUFBRSxpQkFBaUI7NEJBQzFCLFdBQVcsRUFBRSxVQUFVLENBQUMsR0FBRyxFQUFFLG9CQUFvQixDQUFDOzRCQUNsRCxLQUFLLEVBQUUsSUFBSTt5QkFDWjtxQkFDRjs4QkFHUSxRQUFRO3NCQUFoQixLQUFLO2dCQUNHLFdBQVc7c0JBQW5CLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge0NvbXBvbmVudCwgSW5wdXQsIGZvcndhcmRSZWZ9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHtDb250cm9sVmFsdWVBY2Nlc3NvciwgTkdfVkFMVUVfQUNDRVNTT1J9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnYmlpdC10b2dnbGUnLFxuICB0ZW1wbGF0ZVVybDogJ2JpaXQtdG9nZ2xlLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJ2JpaXQtdG9nZ2xlLmNvbXBvbmVudC5zY3NzJ10sXG4gIHByb3ZpZGVyczogW1xuICAgIHtcbiAgICAgIHByb3ZpZGU6IE5HX1ZBTFVFX0FDQ0VTU09SLFxuICAgICAgdXNlRXhpc3Rpbmc6IGZvcndhcmRSZWYoKCkgPT4gQmlpdFRvZ2dsZUNvbXBvbmVudCksXG4gICAgICBtdWx0aTogdHJ1ZVxuICAgIH1cbiAgXVxufSlcbmV4cG9ydCBjbGFzcyBCaWl0VG9nZ2xlQ29tcG9uZW50IGltcGxlbWVudHMgQ29udHJvbFZhbHVlQWNjZXNzb3Ige1xuICBASW5wdXQoKSBkaXNhYmxlZCA9IGZhbHNlO1xuICBASW5wdXQoKSBkZXNjcmlwdGlvbjogc3RyaW5nO1xuICBjaGVja2VkOiBib29sZWFuO1xuXG4gIG9uQ2hhbmdlID0gKHZhbHVlOiBhbnkpID0+IHt9O1xuICBvblRvdWNoZWQgPSAoKSA9PiB7fTtcblxuICBvblRvZ2dsZShpdGVtOiBib29sZWFuKSB7XG4gICAgdGhpcy5jaGVja2VkID0gaXRlbTtcbiAgICB0aGlzLm9uQ2hhbmdlKHRoaXMuY2hlY2tlZCk7XG4gIH1cblxuICByZWdpc3Rlck9uQ2hhbmdlKGZuOiBhbnkpOiB2b2lkIHtcbiAgICB0aGlzLm9uQ2hhbmdlID0gZm47XG4gIH1cblxuICByZWdpc3Rlck9uVG91Y2hlZChmbjogYW55KTogdm9pZCB7XG4gICAgdGhpcy5vblRvdWNoZWQgPSBmbjtcbiAgfVxuXG4gIHdyaXRlVmFsdWUob2JqOiBib29sZWFuKTogdm9pZCB7XG4gICAgdGhpcy5jaGVja2VkID0gb2JqO1xuICB9XG59XG4iLCI8bGFiZWwgY2xhc3M9XCJ0b2dnbGUtYmFzZVwiPlxuICA8aW5wdXQgdHlwZT1cImNoZWNrYm94XCIgaWQ9XCJjaGVja2JveFwiXG4gICAgICAgICBbbmdNb2RlbF09XCJjaGVja2VkXCJcbiAgICAgICAgIChuZ01vZGVsQ2hhbmdlKT1cIm9uVG9nZ2xlKCRldmVudClcIlxuICAgICAgICAgW2Rpc2FibGVkXT1cImRpc2FibGVkXCIvPlxuICA8ZGl2IGNsYXNzPVwidG9nZ2xlLXN3aXRjaFwiIGlkPVwic3dpdGNoXCI+XG4gICAgPGRpdiBjbGFzcz1cInRvZ2dsZS10cmFpbFwiPjwvZGl2PlxuICAgIDxkaXYgY2xhc3M9XCJ0b2dnbGUtYm94XCI+PC9kaXY+XG4gIDwvZGl2PlxuICA8YSBjbGFzcz1cInRvZ2dsZS1sYWJlbFwiPlxuICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cbiAgPC9hPlxuICA8c3BhbiAqbmdJZj1cImRlc2NyaXB0aW9uXCIgaWQ9XCJkZXNjcmlwdGlvblwiIGNsYXNzPVwidG9nZ2xlLWRlc2NyaXB0aW9uXCI+XG4gICAgICB7eyBkZXNjcmlwdGlvbiB9fVxuICAgIDwvc3Bhbj5cbjwvbGFiZWw+XG4iXX0=

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

@@ -197,7 +197,7 @@ BiitLoginComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ver
             provide: TRANSLOCO_SCOPE,
             useValue: { scope: 'wizardry-theme/login-welcome', alias: "login-welcome" },
             multi: true
-        }], ngImport: i0, template: "<biit-popup no-header *transloco=\"let t\">\n  <div id=\"login-tabs\"\n       *ngIf=\"allowSignUp && !resetView\"\n       class=\"tab-buttons\"\n  >\n    <div id=\"tab-login\"\n         [class.selected]=\"!signUpView\"\n         (click)=\"signUpView = false\"\n    >\n      {{ t('login.log_in') }}\n    </div>\n    <div id=\"tab-signup\"\n         [class.selected]=\"signUpView\"\n         (click)=\"signUpView = true\"\n    >\n      {{ t('login.sign_up') }}\n    </div>\n  </div>\n  <div class=\"login-container\" [class.allow-signup]=\"allowSignUp\">\n    <div class=\"login-column\">\n      <div class=\"login-icon-square\">\n        <div class=\"login-keyring\"></div>\n        <biit-icon [name]=\"$any('key_' + keyId)\" class=\"login-key-icon\"></biit-icon>\n      </div>\n    </div>\n    <ng-container *ngTemplateOutlet=\"resetView ? resetForm : signUpView ? signUpForm : loginForm\"></ng-container>\n  </div>\n</biit-popup>\n\n<ng-template #loginForm>\n  <div id=\"login-column\" class=\"login-column\" *transloco=\"let t\">\n    <biit-input-text id=\"login-username\" [(ngModel)]=\"login.username\" fieldName=\"username\" [type]=\"Type.TEXT\"\n                     [error]=\"this.loginErrors.get(LoginError.USERNAME)\"\n                     (keyup.enter)=\"performLogin()\"\n                     placeholder=\"{{t('login.username')}}\" class=\"login-input\"></biit-input-text>\n    <biit-input-text id=\"login-password\" [(ngModel)]=\"login.password\" fieldName=\"password\"\n                     [error]=\"this.loginErrors.get(LoginError.PASSWORD)\"\n                     (keyup.enter)=\"performLogin()\"\n                     placeholder=\"{{t('login.password')}}\" [type]=\"Type.PASSWORD\" class=\"login-input\"></biit-input-text>\n    <biit-toggle\n      class=\"margin-vertical-14\"\n      [(ngModel)]=\"login.remember\">\n      {{ t('login.remember') }}\n    </biit-toggle>\n    <div class=\"margin-top-18 centered\">\n      <button id=\"login-button\" biit-button primary\n              (click)=\"performLogin()\"\n      >\n        {{ t('login.take_me_in') }}\n      </button>\n    </div>\n    <div class=\"margin-top-18 centered\">\n      <button biit-button tertiary *ngIf=\"allowResetPassword\"\n              (click)=\"resetView = true\"\n              class=\"smaller-text\"\n      >\n        {{ t('login.forgot') }}\n      </button>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #resetForm>\n  <div class=\"login-column-expanded\" *transloco=\"let t\">\n    <span class=\"title\">\n      {{ t('login.reset_password_title') }}\n    </span>\n    <span class=\"subtitle\"\n          style=\"margin-top: 1em;\">\n      {{ t('login.reset_password_subtitle') }}\n    </span>\n    <span class=\"body\"\n          style=\"margin-top: 0.5em\">\n      {{ t('login.reset_password_body') }}\n    </span>\n    <biit-input-text [(ngModel)]=\"resetEmail\" fieldName=\"email\" [type]=\"Type.EMAIL\"\n                     [error]=\"this.loginErrors.get(LoginError.EMAIL)\"\n                     (keyup.enter)=\"performResetPassword()\" style=\"margin-top: 2em; margin-bottom: 2.5em\"\n                     placeholder=\"{{t('login.email')}}\" class=\"login-input\"></biit-input-text>\n    <div class=\"buttons\">\n      <button biit-button (click)=\"performResetPassword()\">\n        {{ t('login.reset') }}\n      </button>\n      <button biit-button tertiary (click)=\"restartView()\" class=\"smaller-text\">\n        {{ t('login.i_remember') }}\n      </button>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #signUpForm>\n  <div id=\"signup-column\" class=\"login-column\" *transloco=\"let t\">\n    <biit-input-text id=\"signup-username\" [(ngModel)]=\"signUpData.username\" fieldName=\"username\"\n                     *ngIf=\"!signUpGeneratedUsername\"\n                     [type]=\"Type.TEXT\"\n                     [error]=\"this.loginErrors.get(LoginError.USERNAME)\"\n                     (keyup.enter)=\"performLogin()\"\n                     (ngModelChange)=\"usernameSearch.next($event)\"\n                     placeholder=\"{{t('login.username')}}\" class=\"login-input\"></biit-input-text>\n    <biit-input-text id=\"signup-name\" [(ngModel)]=\"signUpData.name\" fieldName=\"name\" [type]=\"Type.TEXT\"\n                     [error]=\"this.loginErrors.get(LoginError.NAME)\"\n                     (keyup.enter)=\"performLogin()\"\n                     placeholder=\"{{t('login.name')}}\" class=\"login-input\"></biit-input-text>\n    <biit-input-text id=\"signup-lastname\" [(ngModel)]=\"signUpData.lastname\" fieldName=\"lastname\" [type]=\"Type.TEXT\"\n                     [error]=\"this.loginErrors.get(LoginError.LASTNAME)\"\n                     (keyup.enter)=\"performLogin()\"\n                     placeholder=\"{{t('login.lastname')}}\" class=\"login-input\"></biit-input-text>\n    <biit-input-text id=\"signup-email\" [(ngModel)]=\"signUpData.email\" fieldName=\"email\" [type]=\"Type.TEXT\"\n                     [error]=\"this.loginErrors.get(LoginError.EMAIL)\" [required]=\"true\"\n                     (keyup.enter)=\"performLogin()\"\n                     placeholder=\"{{t('login.email')}}\" class=\"login-input\"></biit-input-text>\n    <biit-dropdown\n      *ngIf=\"teams && teams.length\"\n      [(ngModel)]=\"dumbTeam\"\n      [required]=\"true\"\n      [data]=\"teams\"\n      value=\"key\"\n      label=\"label\"\n      title=\"{{t('login.team')}}\" class=\"login-input\"/>\n    <biit-input-text id=\"signup-password\" [(ngModel)]=\"signUpData.password\" fieldName=\"password\"\n                     [error]=\"this.loginErrors.get(LoginError.PASSWORD)\"\n                     (keyup.enter)=\"performLogin()\" *ngIf=\"!signUpGeneratedPassword\"\n                     placeholder=\"{{t('login.password')}}\" [type]=\"Type.PASSWORD\" class=\"login-input\"></biit-input-text>\n    <div class=\"margin-top-18 centered\">\n      <button id=\"signup-button\" biit-button primary\n              (click)=\"performSignUp()\"\n      >\n        {{ t('login.sign_me_up') }}\n      </button>\n    </div>\n  </div>\n  <div *transloco=\"let t\">\n    <biit-popup *ngIf=\"notification && showNotification\" id=\"warning-popup\"\n                [title]=\"t('login-welcome.warning_window.tittle')\"\n                closable\n                (onClosed)=\"showNotification = false\">\n      <div [innerHTML]=\"t('login-welcome.warning_window.content')\"></div>\n    </biit-popup>\n  </div>\n</ng-template>\n", styles: [".login-container{display:flex;font-size:inherit;column-gap:4.2rem}.login-container.allow-signup{padding:.5rem}.login-column{width:12.8em;display:inline-flex;flex-direction:column}.login-column-expanded{width:20em;display:inline-flex;flex-direction:column}.login-key-icon{position:absolute;margin-top:1em;rotate:90deg;height:12.8em;width:12.8em}.login-keyring{width:1.1em;background:var(--main-color);height:2.85em}.login-icon-square{display:inline-flex;border:solid .175em var(--component-color);width:12.8em;height:12.8em;box-sizing:border-box;flex-direction:column;align-items:center}.login-input{margin-top:1.05em;margin-bottom:1.05em}.margin-vertical-14{margin:.7em 0}.margin-top-18{margin-top:.9em}.centered{display:inline-flex;justify-content:center}.smaller-text{font-size:.9em}.title{font-size:1.5em;font-weight:700}.subtitle{font-size:1em;font-weight:700}.body{font-size:.85em}.buttons{display:flex;align-items:center;gap:2.5em}.tab-buttons{position:absolute;right:0;top:0;width:50%;height:calc(2rem + 3px);display:flex}.tab-buttons div{display:flex;flex-grow:1;flex-shrink:0;align-items:center;justify-content:center;cursor:pointer;background:transparent;color:var(--disabled-primary-color)}.tab-buttons div:hover{border-bottom:3px solid var(--disabled-primary-color)}.tab-buttons div.selected{background:transparent;color:#262626;border-bottom:3px solid var(--active-color)}@media (max-width: 600px){::ng-deep .popup-canvas{min-width:auto!important}::ng-deep .popup-canvas .login-container{flex-direction:column-reverse;gap:1.5rem}::ng-deep .popup-canvas .login-column-expanded{min-width:12.8em}.buttons{gap:1.5em;flex-wrap:wrap}.tab-buttons{width:100%}}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.BiitPopupComponent, selector: "biit-popup", inputs: ["title", "mouseEvent"], outputs: ["onClosed"] }, { kind: "directive", type: i3.BiitPopupNoHeaderDirective, selector: "[no-header]" }, { kind: "directive", type: i3.BiitPopupClosableDirective, selector: "[closable]" }, { kind: "component", type: i4.BiitIconComponent, selector: "biit-icon", inputs: ["name", "svgStyle", "pathStyle"] }, { kind: "component", type: i5.BiitInputTextComponent, selector: "biit-input-text", inputs: ["placeholder", "error", "description", "info", "type", "icon", "fieldName", "disabled", "required", "readonly", "min", "max", "minLength", "maxLength", "regEx"], outputs: ["onActionPerformed"] }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.BiitToggleComponent, selector: "biit-toggle", inputs: ["disabled"] }, { kind: "component", type: i7.BiitButtonComponent, selector: "button[biit-button]" }, { kind: "directive", type: i7.BiitButtonPrimaryDirective, selector: "[primary]" }, { kind: "directive", type: i7.BiitButtonTertiaryDirective, selector: "[tertiary]" }, { kind: "directive", type: i1.TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoLang", "translocoLoadingTpl"] }, { kind: "component", type: i5.BiitDropdownComponent, selector: "biit-dropdown", inputs: ["title", "label", "value", "descriptionLabel", "description", "data", "primitive", "compact", "disabled", "required", "sort-asc", "sort-desc", "icon"] }] });
+        }], ngImport: i0, template: "<biit-popup no-header *transloco=\"let t\">\n  <div id=\"login-tabs\"\n       *ngIf=\"allowSignUp && !resetView\"\n       class=\"tab-buttons\"\n  >\n    <div id=\"tab-login\"\n         [class.selected]=\"!signUpView\"\n         (click)=\"signUpView = false\"\n    >\n      {{ t('login.log_in') }}\n    </div>\n    <div id=\"tab-signup\"\n         [class.selected]=\"signUpView\"\n         (click)=\"signUpView = true\"\n    >\n      {{ t('login.sign_up') }}\n    </div>\n  </div>\n  <div class=\"login-container\" [class.allow-signup]=\"allowSignUp\">\n    <div class=\"login-column\">\n      <div class=\"login-icon-square\">\n        <div class=\"login-keyring\"></div>\n        <biit-icon [name]=\"$any('key_' + keyId)\" class=\"login-key-icon\"></biit-icon>\n      </div>\n    </div>\n    <ng-container *ngTemplateOutlet=\"resetView ? resetForm : signUpView ? signUpForm : loginForm\"></ng-container>\n  </div>\n</biit-popup>\n\n<ng-template #loginForm>\n  <div id=\"login-column\" class=\"login-column\" *transloco=\"let t\">\n    <biit-input-text id=\"login-username\" [(ngModel)]=\"login.username\" fieldName=\"username\" [type]=\"Type.TEXT\"\n                     [error]=\"this.loginErrors.get(LoginError.USERNAME)\"\n                     (keyup.enter)=\"performLogin()\"\n                     placeholder=\"{{t('login.username')}}\" class=\"login-input\"></biit-input-text>\n    <biit-input-text id=\"login-password\" [(ngModel)]=\"login.password\" fieldName=\"password\"\n                     [error]=\"this.loginErrors.get(LoginError.PASSWORD)\"\n                     (keyup.enter)=\"performLogin()\"\n                     placeholder=\"{{t('login.password')}}\" [type]=\"Type.PASSWORD\" class=\"login-input\"></biit-input-text>\n    <biit-toggle\n      class=\"margin-vertical-14\"\n      [(ngModel)]=\"login.remember\">\n      {{ t('login.remember') }}\n    </biit-toggle>\n    <div class=\"margin-top-18 centered\">\n      <button id=\"login-button\" biit-button primary\n              (click)=\"performLogin()\"\n      >\n        {{ t('login.take_me_in') }}\n      </button>\n    </div>\n    <div class=\"margin-top-18 centered\">\n      <button biit-button tertiary *ngIf=\"allowResetPassword\"\n              (click)=\"resetView = true\"\n              class=\"smaller-text\"\n      >\n        {{ t('login.forgot') }}\n      </button>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #resetForm>\n  <div class=\"login-column-expanded\" *transloco=\"let t\">\n    <span class=\"title\">\n      {{ t('login.reset_password_title') }}\n    </span>\n    <span class=\"subtitle\"\n          style=\"margin-top: 1em;\">\n      {{ t('login.reset_password_subtitle') }}\n    </span>\n    <span class=\"body\"\n          style=\"margin-top: 0.5em\">\n      {{ t('login.reset_password_body') }}\n    </span>\n    <biit-input-text [(ngModel)]=\"resetEmail\" fieldName=\"email\" [type]=\"Type.EMAIL\"\n                     [error]=\"this.loginErrors.get(LoginError.EMAIL)\"\n                     (keyup.enter)=\"performResetPassword()\" style=\"margin-top: 2em; margin-bottom: 2.5em\"\n                     placeholder=\"{{t('login.email')}}\" class=\"login-input\"></biit-input-text>\n    <div class=\"buttons\">\n      <button biit-button (click)=\"performResetPassword()\">\n        {{ t('login.reset') }}\n      </button>\n      <button biit-button tertiary (click)=\"restartView()\" class=\"smaller-text\">\n        {{ t('login.i_remember') }}\n      </button>\n    </div>\n  </div>\n</ng-template>\n\n<ng-template #signUpForm>\n  <div id=\"signup-column\" class=\"login-column\" *transloco=\"let t\">\n    <biit-input-text id=\"signup-username\" [(ngModel)]=\"signUpData.username\" fieldName=\"username\"\n                     *ngIf=\"!signUpGeneratedUsername\"\n                     [type]=\"Type.TEXT\"\n                     [error]=\"this.loginErrors.get(LoginError.USERNAME)\"\n                     (keyup.enter)=\"performLogin()\"\n                     (ngModelChange)=\"usernameSearch.next($event)\"\n                     placeholder=\"{{t('login.username')}}\" class=\"login-input\"></biit-input-text>\n    <biit-input-text id=\"signup-name\" [(ngModel)]=\"signUpData.name\" fieldName=\"name\" [type]=\"Type.TEXT\"\n                     [error]=\"this.loginErrors.get(LoginError.NAME)\"\n                     (keyup.enter)=\"performLogin()\"\n                     placeholder=\"{{t('login.name')}}\" class=\"login-input\"></biit-input-text>\n    <biit-input-text id=\"signup-lastname\" [(ngModel)]=\"signUpData.lastname\" fieldName=\"lastname\" [type]=\"Type.TEXT\"\n                     [error]=\"this.loginErrors.get(LoginError.LASTNAME)\"\n                     (keyup.enter)=\"performLogin()\"\n                     placeholder=\"{{t('login.lastname')}}\" class=\"login-input\"></biit-input-text>\n    <biit-input-text id=\"signup-email\" [(ngModel)]=\"signUpData.email\" fieldName=\"email\" [type]=\"Type.TEXT\"\n                     [error]=\"this.loginErrors.get(LoginError.EMAIL)\" [required]=\"true\"\n                     (keyup.enter)=\"performLogin()\"\n                     placeholder=\"{{t('login.email')}}\" class=\"login-input\"></biit-input-text>\n    <biit-dropdown\n      *ngIf=\"teams && teams.length\"\n      [(ngModel)]=\"dumbTeam\"\n      [required]=\"true\"\n      [data]=\"teams\"\n      value=\"key\"\n      label=\"label\"\n      title=\"{{t('login.team')}}\" class=\"login-input\"/>\n    <biit-input-text id=\"signup-password\" [(ngModel)]=\"signUpData.password\" fieldName=\"password\"\n                     [error]=\"this.loginErrors.get(LoginError.PASSWORD)\"\n                     (keyup.enter)=\"performLogin()\" *ngIf=\"!signUpGeneratedPassword\"\n                     placeholder=\"{{t('login.password')}}\" [type]=\"Type.PASSWORD\" class=\"login-input\"></biit-input-text>\n    <div class=\"margin-top-18 centered\">\n      <button id=\"signup-button\" biit-button primary\n              (click)=\"performSignUp()\"\n      >\n        {{ t('login.sign_me_up') }}\n      </button>\n    </div>\n  </div>\n  <div *transloco=\"let t\">\n    <biit-popup *ngIf=\"notification && showNotification\" id=\"warning-popup\"\n                [title]=\"t('login-welcome.warning_window.tittle')\"\n                closable\n                (onClosed)=\"showNotification = false\">\n      <div [innerHTML]=\"t('login-welcome.warning_window.content')\"></div>\n    </biit-popup>\n  </div>\n</ng-template>\n", styles: [".login-container{display:flex;font-size:inherit;column-gap:4.2rem}.login-container.allow-signup{padding:.5rem}.login-column{width:12.8em;display:inline-flex;flex-direction:column}.login-column-expanded{width:20em;display:inline-flex;flex-direction:column}.login-key-icon{position:absolute;margin-top:1em;rotate:90deg;height:12.8em;width:12.8em}.login-keyring{width:1.1em;background:var(--main-color);height:2.85em}.login-icon-square{display:inline-flex;border:solid .175em var(--component-color);width:12.8em;height:12.8em;box-sizing:border-box;flex-direction:column;align-items:center}.login-input{margin-top:1.05em;margin-bottom:1.05em}.margin-vertical-14{margin:.7em 0}.margin-top-18{margin-top:.9em}.centered{display:inline-flex;justify-content:center}.smaller-text{font-size:.9em}.title{font-size:1.5em;font-weight:700}.subtitle{font-size:1em;font-weight:700}.body{font-size:.85em}.buttons{display:flex;align-items:center;gap:2.5em}.tab-buttons{position:absolute;right:0;top:0;width:50%;height:calc(2rem + 3px);display:flex}.tab-buttons div{display:flex;flex-grow:1;flex-shrink:0;align-items:center;justify-content:center;cursor:pointer;background:transparent;color:var(--disabled-primary-color)}.tab-buttons div:hover{border-bottom:3px solid var(--disabled-primary-color)}.tab-buttons div.selected{background:transparent;color:#262626;border-bottom:3px solid var(--active-color)}@media (max-width: 600px){::ng-deep .popup-canvas{min-width:auto!important}::ng-deep .popup-canvas .login-container{flex-direction:column-reverse;gap:1.5rem}::ng-deep .popup-canvas .login-column-expanded{min-width:12.8em}.buttons{gap:1.5em;flex-wrap:wrap}.tab-buttons{width:100%}}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.BiitPopupComponent, selector: "biit-popup", inputs: ["title", "mouseEvent"], outputs: ["onClosed"] }, { kind: "directive", type: i3.BiitPopupNoHeaderDirective, selector: "[no-header]" }, { kind: "directive", type: i3.BiitPopupClosableDirective, selector: "[closable]" }, { kind: "component", type: i4.BiitIconComponent, selector: "biit-icon", inputs: ["name", "svgStyle", "pathStyle"] }, { kind: "component", type: i5.BiitInputTextComponent, selector: "biit-input-text", inputs: ["placeholder", "error", "description", "info", "type", "icon", "fieldName", "disabled", "required", "readonly", "min", "max", "minLength", "maxLength", "regEx"], outputs: ["onActionPerformed"] }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.BiitToggleComponent, selector: "biit-toggle", inputs: ["disabled", "description"] }, { kind: "component", type: i7.BiitButtonComponent, selector: "button[biit-button]" }, { kind: "directive", type: i7.BiitButtonPrimaryDirective, selector: "[primary]" }, { kind: "directive", type: i7.BiitButtonTertiaryDirective, selector: "[tertiary]" }, { kind: "directive", type: i1.TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoLang", "translocoLoadingTpl"] }, { kind: "component", type: i5.BiitDropdownComponent, selector: "biit-dropdown", inputs: ["title", "label", "value", "descriptionLabel", "description", "data", "primitive", "compact", "disabled", "required", "sort-asc", "sort-desc", "icon"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BiitLoginComponent, decorators: [{
             type: Component,
             args: [{ selector: 'biit-login', providers: [{

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

@@ -915,13 +915,13 @@ class BiitToggleComponent {
     }
 }
 BiitToggleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BiitToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-BiitToggleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: BiitToggleComponent, selector: "biit-toggle", inputs: { disabled: "disabled" }, providers: [
+BiitToggleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: BiitToggleComponent, selector: "biit-toggle", inputs: { disabled: "disabled", description: "description" }, providers: [
         {
             provide: NG_VALUE_ACCESSOR,
             useExisting: forwardRef(() => BiitToggleComponent),
             multi: true
         }
-    ], ngImport: i0, template: "<label class=\"toggle-base\">\n  <input type=\"checkbox\" id=\"checkbox\"\n         [ngModel]=\"checked\"\n         (ngModelChange)=\"onToggle($event)\"\n         [disabled]=\"disabled\"/>\n  <div class=\"toggle-switch\" id=\"switch\">\n    <div class=\"toggle-trail\"></div>\n    <div class=\"toggle-box\"></div>\n  </div>\n  <a class=\"toggle-label\">\n    <ng-content></ng-content>\n  </a>\n</label>\n", styles: ["input[type=checkbox]{appearance:none;background-color:#fff;margin:0;display:flex;align-items:center;width:-moz-fit-content;width:fit-content;cursor:pointer;font-size:inherit}.toggle-base{display:flex;align-items:flex-start;width:-moz-fit-content;width:fit-content;min-height:1.2em;cursor:pointer;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-base:hover .toggle-box{transform:rotate(15deg) translate(.1em);border:.25em solid var(--main-color)}.toggle-base:has(input:checked) .toggle-trail{background:var(--selected-color)}.toggle-base:has(input:checked) .toggle-box{transform:translate(.7em) rotate(45deg);border:.25em solid var(--main-color);background:var(--main-color)}.toggle-base:has(input:disabled){pointer-events:none;cursor:default}.toggle-base:has(input:disabled) .toggle-trail{background:var(--trail-color)}.toggle-base:has(input:disabled) .toggle-box{border:.25em solid var(--main-background);background:none}.toggle-base:has(input:disabled) .toggle-label{color:var(--main-background)}.toggle-base:has(input:disabled):has(input:checked) .toggle-box{background:var(--main-background)}.toggle-switch{display:flex;align-items:center;position:relative;height:1.2em}.toggle-trail{display:inline-flex;width:1.4em;height:.25em;background:var(--trail-color);z-index:0;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-box{position:absolute;display:inline-flex;height:.7em;width:.7em;border:.25em solid var(--component-color);box-sizing:border-box;z-index:1;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-label{margin-left:.7em;cursor:inherit;line-height:1.2em;-webkit-user-select:none;user-select:none;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-label:empty{display:none}@-moz-document url-prefix(){input:checked~.toggle-switch .toggle-trail{background:var(--selected-color)}input:checked~.toggle-switch .toggle-box{transform:translate(.7em) rotate(45deg)!important;border:.25em solid var(--main-color);background:var(--main-color)}input:disabled~.toggle-switch{pointer-events:none;cursor:default}input:disabled~.toggle-switch .toggle-trail{background:var(--trail-color)}input:disabled~.toggle-switch .toggle-box{border:.25em solid var(--main-background);background:none}input:disabled~.toggle-switch .toggle-label{color:var(--main-background)}input:checked:disabled~.toggle-switch .toggle-box{background:var(--main-background)}}\n"], dependencies: [{ kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { 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"] }] });
+    ], ngImport: i0, template: "<label class=\"toggle-base\">\n  <input type=\"checkbox\" id=\"checkbox\"\n         [ngModel]=\"checked\"\n         (ngModelChange)=\"onToggle($event)\"\n         [disabled]=\"disabled\"/>\n  <div class=\"toggle-switch\" id=\"switch\">\n    <div class=\"toggle-trail\"></div>\n    <div class=\"toggle-box\"></div>\n  </div>\n  <a class=\"toggle-label\">\n    <ng-content></ng-content>\n  </a>\n  <span *ngIf=\"description\" id=\"description\" class=\"toggle-description\">\n      {{ description }}\n    </span>\n</label>\n", styles: ["input[type=checkbox]{appearance:none;background-color:#fff;margin:0;display:flex;align-items:center;width:-moz-fit-content;width:fit-content;cursor:pointer;font-size:inherit}.toggle-base{display:flex;align-items:flex-start;width:-moz-fit-content;width:fit-content;min-height:1.2em;cursor:pointer;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-base:hover .toggle-box{transform:rotate(15deg) translate(.1em);border:.25em solid var(--main-color)}.toggle-base:has(input:checked) .toggle-trail{background:var(--selected-color)}.toggle-base:has(input:checked) .toggle-box{transform:translate(.7em) rotate(45deg);border:.25em solid var(--main-color);background:var(--main-color)}.toggle-base:has(input:disabled){pointer-events:none;cursor:default}.toggle-base:has(input:disabled) .toggle-trail{background:var(--trail-color)}.toggle-base:has(input:disabled) .toggle-box{border:.25em solid var(--main-background);background:none}.toggle-base:has(input:disabled) .toggle-label{color:var(--main-background)}.toggle-base:has(input:disabled):has(input:checked) .toggle-box{background:var(--main-background)}.toggle-switch{display:flex;align-items:center;position:relative;height:1.2em}.toggle-trail{display:inline-flex;width:1.4em;height:.25em;background:var(--trail-color);z-index:0;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-box{position:absolute;display:inline-flex;height:.7em;width:.7em;border:.25em solid var(--component-color);box-sizing:border-box;z-index:1;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-label{margin-left:.7em;cursor:inherit;line-height:1.2em;-webkit-user-select:none;user-select:none;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-label:empty{display:none}.toggle-description{position:absolute;display:flex;align-items:center;font-size:.75em;color:gray;padding-top:1.4em;min-height:1.05em;line-height:120%;font-style:italic}.toggle-description a{display:block;line-height:1.1em}@-moz-document url-prefix(){input:checked~.toggle-switch .toggle-trail{background:var(--selected-color)}input:checked~.toggle-switch .toggle-box{transform:translate(.7em) rotate(45deg)!important;border:.25em solid var(--main-color);background:var(--main-color)}input:disabled~.toggle-switch{pointer-events:none;cursor:default}input:disabled~.toggle-switch .toggle-trail{background:var(--trail-color)}input:disabled~.toggle-switch .toggle-box{border:.25em solid var(--main-background);background:none}input:disabled~.toggle-switch .toggle-label{color:var(--main-background)}input:checked:disabled~.toggle-switch .toggle-box{background:var(--main-background)}}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { 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"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BiitToggleComponent, decorators: [{
             type: Component,
             args: [{ selector: 'biit-toggle', providers: [
@@ -930,9 +930,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                             useExisting: forwardRef(() => BiitToggleComponent),
                             multi: true
                         }
-                    ], template: "<label class=\"toggle-base\">\n  <input type=\"checkbox\" id=\"checkbox\"\n         [ngModel]=\"checked\"\n         (ngModelChange)=\"onToggle($event)\"\n         [disabled]=\"disabled\"/>\n  <div class=\"toggle-switch\" id=\"switch\">\n    <div class=\"toggle-trail\"></div>\n    <div class=\"toggle-box\"></div>\n  </div>\n  <a class=\"toggle-label\">\n    <ng-content></ng-content>\n  </a>\n</label>\n", styles: ["input[type=checkbox]{appearance:none;background-color:#fff;margin:0;display:flex;align-items:center;width:-moz-fit-content;width:fit-content;cursor:pointer;font-size:inherit}.toggle-base{display:flex;align-items:flex-start;width:-moz-fit-content;width:fit-content;min-height:1.2em;cursor:pointer;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-base:hover .toggle-box{transform:rotate(15deg) translate(.1em);border:.25em solid var(--main-color)}.toggle-base:has(input:checked) .toggle-trail{background:var(--selected-color)}.toggle-base:has(input:checked) .toggle-box{transform:translate(.7em) rotate(45deg);border:.25em solid var(--main-color);background:var(--main-color)}.toggle-base:has(input:disabled){pointer-events:none;cursor:default}.toggle-base:has(input:disabled) .toggle-trail{background:var(--trail-color)}.toggle-base:has(input:disabled) .toggle-box{border:.25em solid var(--main-background);background:none}.toggle-base:has(input:disabled) .toggle-label{color:var(--main-background)}.toggle-base:has(input:disabled):has(input:checked) .toggle-box{background:var(--main-background)}.toggle-switch{display:flex;align-items:center;position:relative;height:1.2em}.toggle-trail{display:inline-flex;width:1.4em;height:.25em;background:var(--trail-color);z-index:0;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-box{position:absolute;display:inline-flex;height:.7em;width:.7em;border:.25em solid var(--component-color);box-sizing:border-box;z-index:1;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-label{margin-left:.7em;cursor:inherit;line-height:1.2em;-webkit-user-select:none;user-select:none;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-label:empty{display:none}@-moz-document url-prefix(){input:checked~.toggle-switch .toggle-trail{background:var(--selected-color)}input:checked~.toggle-switch .toggle-box{transform:translate(.7em) rotate(45deg)!important;border:.25em solid var(--main-color);background:var(--main-color)}input:disabled~.toggle-switch{pointer-events:none;cursor:default}input:disabled~.toggle-switch .toggle-trail{background:var(--trail-color)}input:disabled~.toggle-switch .toggle-box{border:.25em solid var(--main-background);background:none}input:disabled~.toggle-switch .toggle-label{color:var(--main-background)}input:checked:disabled~.toggle-switch .toggle-box{background:var(--main-background)}}\n"] }]
+                    ], template: "<label class=\"toggle-base\">\n  <input type=\"checkbox\" id=\"checkbox\"\n         [ngModel]=\"checked\"\n         (ngModelChange)=\"onToggle($event)\"\n         [disabled]=\"disabled\"/>\n  <div class=\"toggle-switch\" id=\"switch\">\n    <div class=\"toggle-trail\"></div>\n    <div class=\"toggle-box\"></div>\n  </div>\n  <a class=\"toggle-label\">\n    <ng-content></ng-content>\n  </a>\n  <span *ngIf=\"description\" id=\"description\" class=\"toggle-description\">\n      {{ description }}\n    </span>\n</label>\n", styles: ["input[type=checkbox]{appearance:none;background-color:#fff;margin:0;display:flex;align-items:center;width:-moz-fit-content;width:fit-content;cursor:pointer;font-size:inherit}.toggle-base{display:flex;align-items:flex-start;width:-moz-fit-content;width:fit-content;min-height:1.2em;cursor:pointer;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-base:hover .toggle-box{transform:rotate(15deg) translate(.1em);border:.25em solid var(--main-color)}.toggle-base:has(input:checked) .toggle-trail{background:var(--selected-color)}.toggle-base:has(input:checked) .toggle-box{transform:translate(.7em) rotate(45deg);border:.25em solid var(--main-color);background:var(--main-color)}.toggle-base:has(input:disabled){pointer-events:none;cursor:default}.toggle-base:has(input:disabled) .toggle-trail{background:var(--trail-color)}.toggle-base:has(input:disabled) .toggle-box{border:.25em solid var(--main-background);background:none}.toggle-base:has(input:disabled) .toggle-label{color:var(--main-background)}.toggle-base:has(input:disabled):has(input:checked) .toggle-box{background:var(--main-background)}.toggle-switch{display:flex;align-items:center;position:relative;height:1.2em}.toggle-trail{display:inline-flex;width:1.4em;height:.25em;background:var(--trail-color);z-index:0;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-box{position:absolute;display:inline-flex;height:.7em;width:.7em;border:.25em solid var(--component-color);box-sizing:border-box;z-index:1;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-label{margin-left:.7em;cursor:inherit;line-height:1.2em;-webkit-user-select:none;user-select:none;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.toggle-label:empty{display:none}.toggle-description{position:absolute;display:flex;align-items:center;font-size:.75em;color:gray;padding-top:1.4em;min-height:1.05em;line-height:120%;font-style:italic}.toggle-description a{display:block;line-height:1.1em}@-moz-document url-prefix(){input:checked~.toggle-switch .toggle-trail{background:var(--selected-color)}input:checked~.toggle-switch .toggle-box{transform:translate(.7em) rotate(45deg)!important;border:.25em solid var(--main-color);background:var(--main-color)}input:disabled~.toggle-switch{pointer-events:none;cursor:default}input:disabled~.toggle-switch .toggle-trail{background:var(--trail-color)}input:disabled~.toggle-switch .toggle-box{border:.25em solid var(--main-background);background:none}input:disabled~.toggle-switch .toggle-label{color:var(--main-background)}input:checked:disabled~.toggle-switch .toggle-box{background:var(--main-background)}}\n"] }]
         }], propDecorators: { disabled: [{
                 type: Input
+            }], description: [{
+                type: Input
             }] } });
 
 class BiitToggleModule {
@@ -2191,7 +2193,7 @@ BiitSliderOptionVerticalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion
             useExisting: forwardRef(() => BiitSliderOptionVerticalComponent),
             multi: true
         }
-    ], viewQueries: [{ propertyName: "slider", first: true, predicate: ["rangerVer"], descendants: true }, { propertyName: "tooltip", first: true, predicate: ["tooltip"], descendants: true }], ngImport: i0, template: "<div class=\"slider-vertical\">\n  <input #rangerVer type=\"range\"\n         orient=\"vertical\"\n         class=\"vertical\"\n         [class.inverted]=\"inverted\"\n         [ngModel]=\"index\"\n         (ngModelChange)=\"onChange(this.data[rangerVer.value].value);\"\n         [min]=\"0\"\n         [max]=\"data.length - 1\"\n         [step]=\"1\"\n         (input)=\"progressScript()\"\n         (pointerdown)=\"tooltipBoxVisible = true\"\n         (pointerup)=\"tooltipBoxVisible = false\"\n  >\n\n  <div class=\"ticks vertical\">\n    <div #tooltip class=\"tooltip-slider\" [style.opacity]=\"tooltipBoxVisible && showTooltip ? '100%' : '0%'\"></div>\n    <div *ngFor=\"let tick of $any(data); index as i; count as c\"\n         class=\"tick\"\n         [class.hide-tick]=\"!(!inverted ? data[i] : data[c-i-1]).label\"\n         >\n      <span></span>\n      <div class=\"label\" [class.show-desc]=\"showDescription\"\n           (click)=\"value = (!inverted ? data[i] : data[c-i-1]).value; onChange((!inverted ? data[i] : data[c-i-1]).value)\">\n        <span>\n          {{(!inverted ? data[i] : data[c-i-1]).label}}\n        </span>\n        <span class=\"description\" *ngIf=\"showDescription\">\n          {{(!inverted ? data[i] : data[c-i-1]).description}}\n        </span>\n        <biit-tooltip-icon *ngIf=\"(!inverted ? data[i] : data[c-i-1]).description && !showDescription\"\n                           [text]=\"(!inverted ? data[i] : data[c-i-1]).description\"\n        ></biit-tooltip-icon>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".slider-vertical{position:relative;flex:1;width:inherit;height:inherit;display:flex}.slider-vertical input[type=range]{font-size:1em;appearance:none;cursor:pointer;border:none;outline:none;background:var(--light-background);height:inherit;width:.3em;writing-mode:vertical-lr;direction:rtl}.slider-vertical input[type=range].inverted{direction:ltr}.slider-vertical input[type=range]::-webkit-slider-thumb{appearance:none;box-sizing:border-box;height:.9em;width:.9em;background-color:var(--light-background);border:.3em solid var(--component-color);-webkit-transition:.2s ease-in-out;transition:.2s ease-in-out}.slider-vertical input[type=range]::-webkit-slider-thumb:hover{background-color:var(--main-color)}.slider-vertical input[type=range]:active::-webkit-slider-thumb{background-color:var(--main-color)}.slider-vertical input[type=range]:focus::-webkit-slider-thumb{background-color:var(--main-color)}.slider-vertical input[type=range]::-moz-range-thumb{appearance:none;box-sizing:border-box;height:.9em;width:.9em;background-color:var(--light-background);border:.3em solid var(--component-color);border-radius:0;-moz-transition:.2s ease-in-out;transition:.2s ease-in-out}.slider-vertical input[type=range]::-moz-range-thumb:hover{background-color:var(--main-color)}.slider-vertical input[type=range]:active::-moz-range-thumb{background-color:var(--main-color)}.slider-vertical input[type=range]:focus::-moz-range-thumb{background-color:var(--main-color)}.slider-vertical .ticks{display:flex;justify-content:space-between;padding:0 0 0 3px;margin-top:5px;position:relative}.slider-vertical .ticks .tick{display:flex;flex:3.5;align-items:center;padding-left:5px;gap:3px}.slider-vertical .ticks .tick:nth-child(2){align-items:end;flex:2}.slider-vertical .ticks .tick:last-child{align-items:start;flex:2}.slider-vertical .ticks .tick.hide-tick{display:none}.slider-vertical .ticks .tick .label{display:flex;font-weight:500;flex:1;cursor:pointer;gap:.5em}.slider-vertical .ticks .tick .label.show-desc{flex-direction:column}.slider-vertical .ticks .tick .label span{line-height:120%}.slider-vertical .ticks .tick .label .description{font-size:.75em;color:gray;line-height:120%;font-style:italic;font-weight:400}.slider-vertical .ticks .tick>span{display:flex;justify-content:center;width:14px;height:16px;padding:7px 2px;background-color:#262626;font-weight:500;box-sizing:border-box;background-clip:content-box;font-size:1em}.slider-vertical .ticks .tick>span>span{position:absolute;top:1rem;-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-align:center;display:flex;justify-content:center;gap:5px}.slider-vertical .ticks .tick>span>span>span{-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-align:center}.slider-vertical .ticks .tick>span>span biit-tooltip-icon{margin:3px}.slider-vertical .ticks .tick>span:nth-child(2)>span{left:0;text-align:left;justify-content:start}.slider-vertical .ticks .tick>span:last-child>span{right:0;text-align:right;justify-content:end}.slider-vertical .ticks.vertical{flex-direction:column-reverse;flex:1;height:inherit;margin:2px;padding:0}.slider-vertical .ticks.vertical>span{width:20px;height:14px;padding:6px}.slider-vertical .tooltip-slider{position:absolute;bottom:4.7em;transition:opacity .2s ease-in-out;pointer-events:none}.slider-vertical .tooltip-slider ::ng-deep span{font-size:1em;background:white;padding:.1em .2em;border:1px solid #262626;display:block;position:relative;min-width:max-content}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.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: i2.RangeValueAccessor, selector: "input[type=range][formControlName],input[type=range][formControl],input[type=range][ngModel]" }, { 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: "component", type: i3$1.BiitTooltipIconComponent, selector: "biit-tooltip-icon", inputs: ["text", "inline"] }] });
+    ], viewQueries: [{ propertyName: "slider", first: true, predicate: ["rangerVer"], descendants: true }, { propertyName: "tooltip", first: true, predicate: ["tooltip"], descendants: true }], ngImport: i0, template: "<div class=\"slider-vertical\">\n  <input #rangerVer type=\"range\"\n         orient=\"vertical\"\n         class=\"vertical\"\n         [class.inverted]=\"inverted\"\n         [ngModel]=\"index\"\n         (ngModelChange)=\"onChange(this.data[rangerVer.value].value);\"\n         [min]=\"0\"\n         [max]=\"data.length - 1\"\n         [step]=\"1\"\n         (input)=\"progressScript()\"\n         (pointerdown)=\"tooltipBoxVisible = true\"\n         (pointerup)=\"tooltipBoxVisible = false\"\n  >\n\n  <div class=\"ticks vertical\">\n    <div #tooltip class=\"tooltip-slider\" [style.opacity]=\"tooltipBoxVisible && showTooltip ? '100%' : '0%'\"></div>\n    <div *ngFor=\"let tick of $any(data); index as i; count as c\"\n         class=\"tick\"\n         [class.hide-tick]=\"!(!inverted ? data[i] : data[c-i-1]).label\"\n         >\n      <span></span>\n      <div class=\"label\" [class.show-desc]=\"showDescription\"\n           (click)=\"value = (!inverted ? data[i] : data[c-i-1]).value; onChange((!inverted ? data[i] : data[c-i-1]).value)\">\n        <span>\n          {{(!inverted ? data[i] : data[c-i-1]).label}}\n        </span>\n        <span class=\"description\" *ngIf=\"showDescription\">\n          {{(!inverted ? data[i] : data[c-i-1]).description}}\n        </span>\n        <biit-tooltip-icon *ngIf=\"(!inverted ? data[i] : data[c-i-1]).description && !showDescription\"\n                           [text]=\"(!inverted ? data[i] : data[c-i-1]).description\"\n        ></biit-tooltip-icon>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".slider-vertical{position:relative;flex:1;width:inherit;height:inherit;display:flex}.slider-vertical input[type=range]{font-size:1em;appearance:none;cursor:pointer;border:none;outline:none;background:var(--light-background);height:inherit;width:.3em;writing-mode:vertical-lr;direction:rtl}.slider-vertical input[type=range].inverted{direction:ltr}.slider-vertical input[type=range]::-webkit-slider-thumb{appearance:none;box-sizing:border-box;height:.9em;width:.9em;background-color:var(--light-background);border:.3em solid var(--component-color);-webkit-transition:.2s ease-in-out;transition:.2s ease-in-out}.slider-vertical input[type=range]::-webkit-slider-thumb:hover{background-color:var(--main-color)}.slider-vertical input[type=range]:active::-webkit-slider-thumb{background-color:var(--main-color)}.slider-vertical input[type=range]:focus::-webkit-slider-thumb{background-color:var(--main-color)}.slider-vertical input[type=range]::-moz-range-thumb{appearance:none;box-sizing:border-box;height:.9em;width:.9em;background-color:var(--light-background);border:.3em solid var(--component-color);border-radius:0;-moz-transition:.2s ease-in-out;transition:.2s ease-in-out}.slider-vertical input[type=range]::-moz-range-thumb:hover{background-color:var(--main-color)}.slider-vertical input[type=range]:active::-moz-range-thumb{background-color:var(--main-color)}.slider-vertical input[type=range]:focus::-moz-range-thumb{background-color:var(--main-color)}.slider-vertical .ticks{display:flex;justify-content:space-between;padding:0 0 0 3px;margin-top:5px;position:relative}.slider-vertical .ticks .tick{display:flex;flex:3.5;align-items:center;padding-left:5px;gap:3px}.slider-vertical .ticks .tick:nth-child(2){align-items:end;flex:2}.slider-vertical .ticks .tick:last-child{align-items:start;flex:2}.slider-vertical .ticks .tick.hide-tick{display:none}.slider-vertical .ticks .tick .label{display:flex;font-weight:500;flex:1;cursor:pointer;gap:.5em}.slider-vertical .ticks .tick .label.show-desc{flex-direction:column}.slider-vertical .ticks .tick .label span{line-height:120%}.slider-vertical .ticks .tick .label .description{font-size:.75em;color:var(--secondary-color);line-height:120%;font-style:italic;font-weight:400}.slider-vertical .ticks .tick>span{display:flex;justify-content:center;width:14px;height:16px;padding:7px 2px;background-color:var(--component-color);font-weight:500;box-sizing:border-box;background-clip:content-box;font-size:1em}.slider-vertical .ticks .tick>span>span{position:absolute;top:1rem;-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-align:center;display:flex;justify-content:center;gap:5px}.slider-vertical .ticks .tick>span>span>span{-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-align:center}.slider-vertical .ticks .tick>span>span biit-tooltip-icon{margin:3px}.slider-vertical .ticks .tick>span:nth-child(2)>span{left:0;text-align:left;justify-content:start}.slider-vertical .ticks .tick>span:last-child>span{right:0;text-align:right;justify-content:end}.slider-vertical .ticks.vertical{flex-direction:column-reverse;flex:1;height:inherit;margin:2px;padding:0}.slider-vertical .ticks.vertical>span{width:20px;height:14px;padding:6px}.slider-vertical .tooltip-slider{position:absolute;bottom:4.7em;transition:opacity .2s ease-in-out;pointer-events:none}.slider-vertical .tooltip-slider ::ng-deep span{font-size:1em;background:white;padding:.1em .2em;border:1px solid var(--component-color);display:block;position:relative;min-width:max-content}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.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: i2.RangeValueAccessor, selector: "input[type=range][formControlName],input[type=range][formControl],input[type=range][ngModel]" }, { 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: "component", type: i3$1.BiitTooltipIconComponent, selector: "biit-tooltip-icon", inputs: ["text", "inline"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BiitSliderOptionVerticalComponent, decorators: [{
             type: Component,
             args: [{ selector: 'biit-slider-option-vertical', providers: [
@@ -2200,7 +2202,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                             useExisting: forwardRef(() => BiitSliderOptionVerticalComponent),
                             multi: true
                         }
-                    ], template: "<div class=\"slider-vertical\">\n  <input #rangerVer type=\"range\"\n         orient=\"vertical\"\n         class=\"vertical\"\n         [class.inverted]=\"inverted\"\n         [ngModel]=\"index\"\n         (ngModelChange)=\"onChange(this.data[rangerVer.value].value);\"\n         [min]=\"0\"\n         [max]=\"data.length - 1\"\n         [step]=\"1\"\n         (input)=\"progressScript()\"\n         (pointerdown)=\"tooltipBoxVisible = true\"\n         (pointerup)=\"tooltipBoxVisible = false\"\n  >\n\n  <div class=\"ticks vertical\">\n    <div #tooltip class=\"tooltip-slider\" [style.opacity]=\"tooltipBoxVisible && showTooltip ? '100%' : '0%'\"></div>\n    <div *ngFor=\"let tick of $any(data); index as i; count as c\"\n         class=\"tick\"\n         [class.hide-tick]=\"!(!inverted ? data[i] : data[c-i-1]).label\"\n         >\n      <span></span>\n      <div class=\"label\" [class.show-desc]=\"showDescription\"\n           (click)=\"value = (!inverted ? data[i] : data[c-i-1]).value; onChange((!inverted ? data[i] : data[c-i-1]).value)\">\n        <span>\n          {{(!inverted ? data[i] : data[c-i-1]).label}}\n        </span>\n        <span class=\"description\" *ngIf=\"showDescription\">\n          {{(!inverted ? data[i] : data[c-i-1]).description}}\n        </span>\n        <biit-tooltip-icon *ngIf=\"(!inverted ? data[i] : data[c-i-1]).description && !showDescription\"\n                           [text]=\"(!inverted ? data[i] : data[c-i-1]).description\"\n        ></biit-tooltip-icon>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".slider-vertical{position:relative;flex:1;width:inherit;height:inherit;display:flex}.slider-vertical input[type=range]{font-size:1em;appearance:none;cursor:pointer;border:none;outline:none;background:var(--light-background);height:inherit;width:.3em;writing-mode:vertical-lr;direction:rtl}.slider-vertical input[type=range].inverted{direction:ltr}.slider-vertical input[type=range]::-webkit-slider-thumb{appearance:none;box-sizing:border-box;height:.9em;width:.9em;background-color:var(--light-background);border:.3em solid var(--component-color);-webkit-transition:.2s ease-in-out;transition:.2s ease-in-out}.slider-vertical input[type=range]::-webkit-slider-thumb:hover{background-color:var(--main-color)}.slider-vertical input[type=range]:active::-webkit-slider-thumb{background-color:var(--main-color)}.slider-vertical input[type=range]:focus::-webkit-slider-thumb{background-color:var(--main-color)}.slider-vertical input[type=range]::-moz-range-thumb{appearance:none;box-sizing:border-box;height:.9em;width:.9em;background-color:var(--light-background);border:.3em solid var(--component-color);border-radius:0;-moz-transition:.2s ease-in-out;transition:.2s ease-in-out}.slider-vertical input[type=range]::-moz-range-thumb:hover{background-color:var(--main-color)}.slider-vertical input[type=range]:active::-moz-range-thumb{background-color:var(--main-color)}.slider-vertical input[type=range]:focus::-moz-range-thumb{background-color:var(--main-color)}.slider-vertical .ticks{display:flex;justify-content:space-between;padding:0 0 0 3px;margin-top:5px;position:relative}.slider-vertical .ticks .tick{display:flex;flex:3.5;align-items:center;padding-left:5px;gap:3px}.slider-vertical .ticks .tick:nth-child(2){align-items:end;flex:2}.slider-vertical .ticks .tick:last-child{align-items:start;flex:2}.slider-vertical .ticks .tick.hide-tick{display:none}.slider-vertical .ticks .tick .label{display:flex;font-weight:500;flex:1;cursor:pointer;gap:.5em}.slider-vertical .ticks .tick .label.show-desc{flex-direction:column}.slider-vertical .ticks .tick .label span{line-height:120%}.slider-vertical .ticks .tick .label .description{font-size:.75em;color:gray;line-height:120%;font-style:italic;font-weight:400}.slider-vertical .ticks .tick>span{display:flex;justify-content:center;width:14px;height:16px;padding:7px 2px;background-color:#262626;font-weight:500;box-sizing:border-box;background-clip:content-box;font-size:1em}.slider-vertical .ticks .tick>span>span{position:absolute;top:1rem;-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-align:center;display:flex;justify-content:center;gap:5px}.slider-vertical .ticks .tick>span>span>span{-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-align:center}.slider-vertical .ticks .tick>span>span biit-tooltip-icon{margin:3px}.slider-vertical .ticks .tick>span:nth-child(2)>span{left:0;text-align:left;justify-content:start}.slider-vertical .ticks .tick>span:last-child>span{right:0;text-align:right;justify-content:end}.slider-vertical .ticks.vertical{flex-direction:column-reverse;flex:1;height:inherit;margin:2px;padding:0}.slider-vertical .ticks.vertical>span{width:20px;height:14px;padding:6px}.slider-vertical .tooltip-slider{position:absolute;bottom:4.7em;transition:opacity .2s ease-in-out;pointer-events:none}.slider-vertical .tooltip-slider ::ng-deep span{font-size:1em;background:white;padding:.1em .2em;border:1px solid #262626;display:block;position:relative;min-width:max-content}\n"] }]
+                    ], template: "<div class=\"slider-vertical\">\n  <input #rangerVer type=\"range\"\n         orient=\"vertical\"\n         class=\"vertical\"\n         [class.inverted]=\"inverted\"\n         [ngModel]=\"index\"\n         (ngModelChange)=\"onChange(this.data[rangerVer.value].value);\"\n         [min]=\"0\"\n         [max]=\"data.length - 1\"\n         [step]=\"1\"\n         (input)=\"progressScript()\"\n         (pointerdown)=\"tooltipBoxVisible = true\"\n         (pointerup)=\"tooltipBoxVisible = false\"\n  >\n\n  <div class=\"ticks vertical\">\n    <div #tooltip class=\"tooltip-slider\" [style.opacity]=\"tooltipBoxVisible && showTooltip ? '100%' : '0%'\"></div>\n    <div *ngFor=\"let tick of $any(data); index as i; count as c\"\n         class=\"tick\"\n         [class.hide-tick]=\"!(!inverted ? data[i] : data[c-i-1]).label\"\n         >\n      <span></span>\n      <div class=\"label\" [class.show-desc]=\"showDescription\"\n           (click)=\"value = (!inverted ? data[i] : data[c-i-1]).value; onChange((!inverted ? data[i] : data[c-i-1]).value)\">\n        <span>\n          {{(!inverted ? data[i] : data[c-i-1]).label}}\n        </span>\n        <span class=\"description\" *ngIf=\"showDescription\">\n          {{(!inverted ? data[i] : data[c-i-1]).description}}\n        </span>\n        <biit-tooltip-icon *ngIf=\"(!inverted ? data[i] : data[c-i-1]).description && !showDescription\"\n                           [text]=\"(!inverted ? data[i] : data[c-i-1]).description\"\n        ></biit-tooltip-icon>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".slider-vertical{position:relative;flex:1;width:inherit;height:inherit;display:flex}.slider-vertical input[type=range]{font-size:1em;appearance:none;cursor:pointer;border:none;outline:none;background:var(--light-background);height:inherit;width:.3em;writing-mode:vertical-lr;direction:rtl}.slider-vertical input[type=range].inverted{direction:ltr}.slider-vertical input[type=range]::-webkit-slider-thumb{appearance:none;box-sizing:border-box;height:.9em;width:.9em;background-color:var(--light-background);border:.3em solid var(--component-color);-webkit-transition:.2s ease-in-out;transition:.2s ease-in-out}.slider-vertical input[type=range]::-webkit-slider-thumb:hover{background-color:var(--main-color)}.slider-vertical input[type=range]:active::-webkit-slider-thumb{background-color:var(--main-color)}.slider-vertical input[type=range]:focus::-webkit-slider-thumb{background-color:var(--main-color)}.slider-vertical input[type=range]::-moz-range-thumb{appearance:none;box-sizing:border-box;height:.9em;width:.9em;background-color:var(--light-background);border:.3em solid var(--component-color);border-radius:0;-moz-transition:.2s ease-in-out;transition:.2s ease-in-out}.slider-vertical input[type=range]::-moz-range-thumb:hover{background-color:var(--main-color)}.slider-vertical input[type=range]:active::-moz-range-thumb{background-color:var(--main-color)}.slider-vertical input[type=range]:focus::-moz-range-thumb{background-color:var(--main-color)}.slider-vertical .ticks{display:flex;justify-content:space-between;padding:0 0 0 3px;margin-top:5px;position:relative}.slider-vertical .ticks .tick{display:flex;flex:3.5;align-items:center;padding-left:5px;gap:3px}.slider-vertical .ticks .tick:nth-child(2){align-items:end;flex:2}.slider-vertical .ticks .tick:last-child{align-items:start;flex:2}.slider-vertical .ticks .tick.hide-tick{display:none}.slider-vertical .ticks .tick .label{display:flex;font-weight:500;flex:1;cursor:pointer;gap:.5em}.slider-vertical .ticks .tick .label.show-desc{flex-direction:column}.slider-vertical .ticks .tick .label span{line-height:120%}.slider-vertical .ticks .tick .label .description{font-size:.75em;color:var(--secondary-color);line-height:120%;font-style:italic;font-weight:400}.slider-vertical .ticks .tick>span{display:flex;justify-content:center;width:14px;height:16px;padding:7px 2px;background-color:var(--component-color);font-weight:500;box-sizing:border-box;background-clip:content-box;font-size:1em}.slider-vertical .ticks .tick>span>span{position:absolute;top:1rem;-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-align:center;display:flex;justify-content:center;gap:5px}.slider-vertical .ticks .tick>span>span>span{-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-align:center}.slider-vertical .ticks .tick>span>span biit-tooltip-icon{margin:3px}.slider-vertical .ticks .tick>span:nth-child(2)>span{left:0;text-align:left;justify-content:start}.slider-vertical .ticks .tick>span:last-child>span{right:0;text-align:right;justify-content:end}.slider-vertical .ticks.vertical{flex-direction:column-reverse;flex:1;height:inherit;margin:2px;padding:0}.slider-vertical .ticks.vertical>span{width:20px;height:14px;padding:6px}.slider-vertical .tooltip-slider{position:absolute;bottom:4.7em;transition:opacity .2s ease-in-out;pointer-events:none}.slider-vertical .tooltip-slider ::ng-deep span{font-size:1em;background:white;padding:.1em .2em;border:1px solid var(--component-color);display:block;position:relative;min-width:max-content}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { data: [{
                 type: Input
             }], inverted: [{