@colijnit/corecomponents_v12 261.20.6 → 261.20.7

package/fesm2022/colijnit-corecomponents_v12.mjs

@@ -10,7 +10,7 @@ import { Subject, merge, fromEvent, BehaviorSubject } from 'rxjs';
 import * as i1$1 from '@angular/common';
 import { CommonModule, DatePipe } from '@angular/common';
 import { auditTime } from 'rxjs/operators';
-import { PlaneGeometry, Mesh, Vector2, Vector3, MeshPhongMaterial, SpotLight, PerspectiveCamera, Scene, Color, AmbientLight, Fog, WebGLRenderer, Box3 } from 'three';
+import { PlaneGeometry, Mesh, Vector2, Vector3, MeshPhongMaterial, SpotLight, PerspectiveCamera, Scene, Color as Color$1, AmbientLight, Fog, WebGLRenderer, Box3 } from 'three';
 import { CSS3DObject, CSS3DRenderer } from 'three/examples/jsm/renderers/CSS3DRenderer.js';
 import TWEEN from '@tweenjs/tween.js';
 import 'hammerjs';
@@ -2238,7 +2238,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
  */
 class BaseInputComponent {
     changeDetector;
-    componentFactoryResolver;
     overlayService;
     formUserChangeListener;
     ngZoneWrapper;
@@ -2549,9 +2548,8 @@ class BaseInputComponent {
     _canSaveOrCancel = false;
     _commitButtonsComponentRef;
     _validationComponentRef;
-    constructor(changeDetector, componentFactoryResolver, overlayService, formUserChangeListener, ngZoneWrapper, elementRef) {
+    constructor(changeDetector, overlayService, formUserChangeListener, ngZoneWrapper, elementRef) {
         this.changeDetector = changeDetector;
-        this.componentFactoryResolver = componentFactoryResolver;
         this.overlayService = overlayService;
         this.formUserChangeListener = formUserChangeListener;
         this.ngZoneWrapper = ngZoneWrapper;
@@ -2987,7 +2985,7 @@ class BaseInputComponent {
             }
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: BaseInputComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ComponentFactoryResolver }, { token: OverlayService }, { token: FormInputUserModelChangeListenerService, optional: true }, { token: NgZoneWrapperService, optional: true }, { token: i0.ElementRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: BaseInputComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: OverlayService }, { token: FormInputUserModelChangeListenerService, optional: true }, { token: NgZoneWrapperService, optional: true }, { token: i0.ElementRef, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
     static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.16", type: BaseInputComponent, isStandalone: true, inputs: { showSaveCancel: "showSaveCancel", model: "model", label: "label", noValidation: "noValidation", initFocus: "initFocus", noClickFocus: "noClickFocus", businessObjectId: "businessObjectId", disabled: "disabled", maxLength: "maxLength", defaultValue: "defaultValue", forcedMaxLength: "forcedMaxLength", readonly: "readonly", forceReadonly: "forceReadonly", required: "required", forceRequired: "forceRequired", validators: "validators", asyncValidators: "asyncValidators", hidden: "hidden", decimals: "decimals", icon: "icon", customCssClass: "customCssClass", redErrorBackground: "redErrorBackground", myFormInputInstance: "myFormInputInstance", commitOnBlur: "commitOnBlur", customWidth: "customWidth", customHeight: "customHeight", noTriangleGraphic: "noTriangleGraphic", keepFocussed: "keepFocussed", halfWidth: "halfWidth", fullWidth: "fullWidth", excludeUserModelChange: "excludeUserModelChange", noFormGroupControl: "noFormGroupControl" }, outputs: { nativeBlur: "nativeBlur", blur: "blur", enter: "enter", focus: "focus", keyDown: "keyDown", keyUp: "keyUp", modelChange: "modelChange", selectedValueChange: "selectedValueChange", userModelChange: "userModelChange", hiddenChange: "hiddenChange", cancelClicked: "cancelClicked" }, host: { listeners: { "click": "onClick($event)", "focusin": "onFocusIn()", "keydown": "handleKeyDown($event)" }, properties: { "class.hidden": "this.hidden", "class.cc-red-error-background": "this.redErrorBackground", "class.cc-input-focused": "this.focused", "class.form-input": "this.formInput", "class.custom-width": "this.customWidth", "class.custom-height": "this.customHeight", "class.half-width": "this.halfWidth", "class.full-width-important": "this.fullWidth", "class.form-submitted": "this.formSubmitted", "class.hasnolabel": "this.hasNoLabel", "class.hasvalue": "this.hasValue", "class.invalid": "this.invalid", "class.disabled": "this.isDisabled", "class.read-only": "this.isReadonly", "class.required": "this.isRequired", "class.cc-touched-invalid": "this.touchedInvalid", "class.valid": "this.valid", "class.no-validation": "this.validationDisabled" } }, viewQueries: [{ propertyName: "validationErrorContainer", first: true, predicate: ["validationError"], descendants: true, read: ViewContainerRef }, { propertyName: "_ngModel", first: true, predicate: NgModel, descendants: true, static: true }], ngImport: i0 });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: BaseInputComponent });
 }
@@ -3031,7 +3029,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
             type: Directive
         }, {
             type: Injectable
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ComponentFactoryResolver }, { type: OverlayService }, { type: FormInputUserModelChangeListenerService, decorators: [{
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: OverlayService }, { type: FormInputUserModelChangeListenerService, decorators: [{
                     type: Optional
                 }] }, { type: NgZoneWrapperService, decorators: [{
                     type: Optional
@@ -4929,7 +4927,7 @@ class Carousel3dComponent {
     _initScene() {
         this._sceneCss = new Scene();
         this._scene = new Scene();
-        this._scene.background = new Color(this._backgroundColor);
+        this._scene.background = new Color$1(this._backgroundColor);
         if (this._ambientLight) {
             const light = new AmbientLight(0xaaaaaa); // soft white light
             this._scene.add(light);
@@ -6624,10 +6622,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
 
 class InputCheckboxComponent extends BaseInputComponent {
     formComponent;
-    iconCacheService;
     changeDetector;
     overlayService;
-    componentFactoryResolver;
     formUserChangeListener;
     ngZoneWrapper;
     elementRef;
@@ -6640,13 +6636,11 @@ class InputCheckboxComponent extends BaseInputComponent {
     handleClick(event) {
         this.handleModelChange(event);
     }
-    constructor(formComponent, iconCacheService, changeDetector, overlayService, componentFactoryResolver, formUserChangeListener, ngZoneWrapper, elementRef) {
-        super(changeDetector, componentFactoryResolver, overlayService, formUserChangeListener, ngZoneWrapper, elementRef);
+    constructor(formComponent, changeDetector, overlayService, formUserChangeListener, ngZoneWrapper, elementRef) {
+        super(changeDetector, overlayService, formUserChangeListener, ngZoneWrapper, elementRef);
         this.formComponent = formComponent;
-        this.iconCacheService = iconCacheService;
         this.changeDetector = changeDetector;
         this.overlayService = overlayService;
-        this.componentFactoryResolver = componentFactoryResolver;
         this.formUserChangeListener = formUserChangeListener;
         this.ngZoneWrapper = ngZoneWrapper;
         this.elementRef = elementRef;
@@ -6658,7 +6652,7 @@ class InputCheckboxComponent extends BaseInputComponent {
             this.setModel(!this.model);
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: InputCheckboxComponent, deps: [{ token: FormComponent, optional: true }, { token: IconCacheService }, { token: i0.ChangeDetectorRef }, { token: OverlayService }, { token: i0.ComponentFactoryResolver }, { token: FormInputUserModelChangeListenerService }, { token: NgZoneWrapperService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: InputCheckboxComponent, deps: [{ token: FormComponent, optional: true }, { token: i0.ChangeDetectorRef }, { token: OverlayService }, { token: FormInputUserModelChangeListenerService }, { token: NgZoneWrapperService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: InputCheckboxComponent, isStandalone: false, selector: "co-input-checkbox", inputs: { cssClass: "cssClass", clickableLabel: "clickableLabel" }, outputs: { modelChange: "modelChange" }, host: { listeners: { "click": "handleClick($event)" }, properties: { "class.co-input-checkbox": "this.showClass" } }, providers: [
             OverlayService,
             {
@@ -6668,30 +6662,30 @@ class InputCheckboxComponent extends BaseInputComponent {
                 provide: BaseInputComponent,
                 useExisting: InputCheckboxComponent
             }
-        ], usesInheritance: true, ngImport: i0, template: `
-        <div class="checkbox" (click)="handleModelChange($event)" [class.checked]="model">
-          <div class="checkmark" [class.show]="model"></div>
-        </div>
-        @if (label) {
-          <div class="label" [class.clickable]="clickableLabel" [textContent]="label"
-          (click)="clickableLabel ? handleModelChange($event) : true"></div>
-        }
-        <input #input [ngModel]="model" [readonly]="readonly" [disabled]="disabled" type="hidden">
+        ], usesInheritance: true, ngImport: i0, template: `
+        <div class="checkbox" (click)="handleModelChange($event)" [class.checked]="model">
+          <div class="checkmark" [class.show]="model"></div>
+        </div>
+        @if (label) {
+          <div class="label" [class.clickable]="clickableLabel" [textContent]="label"
+          (click)="clickableLabel ? handleModelChange($event) : true"></div>
+        }
+        <input #input [ngModel]="model" [readonly]="readonly" [disabled]="disabled" type="hidden">
         `, isInline: true, dependencies: [{ kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: InputCheckboxComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'co-input-checkbox',
-                    template: `
-        <div class="checkbox" (click)="handleModelChange($event)" [class.checked]="model">
-          <div class="checkmark" [class.show]="model"></div>
-        </div>
-        @if (label) {
-          <div class="label" [class.clickable]="clickableLabel" [textContent]="label"
-          (click)="clickableLabel ? handleModelChange($event) : true"></div>
-        }
-        <input #input [ngModel]="model" [readonly]="readonly" [disabled]="disabled" type="hidden">
+                    template: `
+        <div class="checkbox" (click)="handleModelChange($event)" [class.checked]="model">
+          <div class="checkmark" [class.show]="model"></div>
+        </div>
+        @if (label) {
+          <div class="label" [class.clickable]="clickableLabel" [textContent]="label"
+          (click)="clickableLabel ? handleModelChange($event) : true"></div>
+        }
+        <input #input [ngModel]="model" [readonly]="readonly" [disabled]="disabled" type="hidden">
         `,
                     providers: [
                         OverlayService,
@@ -6709,7 +6703,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 }]
         }], ctorParameters: () => [{ type: FormComponent, decorators: [{
                     type: Optional
-                }] }, { type: IconCacheService }, { type: i0.ChangeDetectorRef }, { type: OverlayService }, { type: i0.ComponentFactoryResolver }, { type: FormInputUserModelChangeListenerService }, { type: NgZoneWrapperService }, { type: i0.ElementRef }], propDecorators: { cssClass: [{
+                }] }, { type: i0.ChangeDetectorRef }, { type: OverlayService }, { type: FormInputUserModelChangeListenerService }, { type: NgZoneWrapperService }, { type: i0.ElementRef }], propDecorators: { cssClass: [{
                 type: Input
             }], clickableLabel: [{
                 type: Input
@@ -7613,10 +7607,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
 
 class InputTextComponent extends BaseInputComponent {
     formComponent;
-    injector;
     changeDetector;
     overlayService;
-    componentFactoryResolver;
     formUserChangeListener;
     ngZoneWrapper;
     elementRef;
@@ -7705,13 +7697,11 @@ class InputTextComponent extends BaseInputComponent {
     isWeekInputMode = false;
     _isLeftIconMouseDown = false;
     _isRightIconMouseDown = false;
-    constructor(formComponent, injector, changeDetector, overlayService, componentFactoryResolver, formUserChangeListener, ngZoneWrapper, elementRef) {
-        super(changeDetector, componentFactoryResolver, overlayService, formUserChangeListener, ngZoneWrapper, elementRef);
+    constructor(formComponent, changeDetector, overlayService, formUserChangeListener, ngZoneWrapper, elementRef) {
+        super(changeDetector, overlayService, formUserChangeListener, ngZoneWrapper, elementRef);
         this.formComponent = formComponent;
-        this.injector = injector;
         this.changeDetector = changeDetector;
         this.overlayService = overlayService;
-        this.componentFactoryResolver = componentFactoryResolver;
         this.formUserChangeListener = formUserChangeListener;
         this.ngZoneWrapper = ngZoneWrapper;
         this.elementRef = elementRef;
@@ -7874,7 +7864,7 @@ class InputTextComponent extends BaseInputComponent {
         this.model = targetDate.toISOString().substring(0, 10);
         this.modelChange.emit(this.model);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: InputTextComponent, deps: [{ token: FormComponent, optional: true }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }, { token: OverlayService }, { token: i0.ComponentFactoryResolver }, { token: FormInputUserModelChangeListenerService }, { token: NgZoneWrapperService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: InputTextComponent, deps: [{ token: FormComponent, optional: true }, { token: i0.ChangeDetectorRef }, { token: OverlayService }, { token: FormInputUserModelChangeListenerService }, { token: NgZoneWrapperService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: InputTextComponent, isStandalone: false, selector: "co-input-text", inputs: { useContent: "useContent", placeholder: "placeholder", align: "align", type: "type", formatPipe: "formatPipe", min: "min", max: "max", pattern: "pattern", digitsOnly: "digitsOnly", excludePlusMinus: "excludePlusMinus", showClearButton: "showClearButton", keyDownWhiteList: "keyDownWhiteList", showPlaceholderOnFocus: "showPlaceholderOnFocus", leftIcon: "leftIcon", rightIcon: "rightIcon", leftIconData: "leftIconData", rightIconData: "rightIconData", selectOnFocus: "selectOnFocus", emptyPlace: "emptyPlace", firstDayOfWeek: "firstDayOfWeek", noStyle: "noStyle", hideArrowButtons: "hideArrowButtons", model: "model" }, outputs: { leftIconClick: "leftIconClick", leftIconMouseDown: "leftIconMouseDown", leftIconMouseUp: "leftIconMouseUp", rightIconClick: "rightIconClick", rightIconMouseDown: "rightIconMouseDown", rightIconMouseUp: "rightIconMouseUp", clearIconClick: "clearIconClick", isFocused: "isFocused" }, host: { listeners: { "document:pointerup": "handleDocumentPointerUp($event)", "document:pointercancel": "handleDocumentPointerUp($event)" }, properties: { "class.no-style": "this.noStyle", "class.hide-arrows": "this.hideArrowButtons", "class.isDate": "this.isDate", "class.co-input-text": "this.showClass", "class.has-left-icon": "this.hasLeftIcon", "class.has-right-icon": "this.hasRightIcon", "class.has-own-label": "this.hasOwnLabel" } }, providers: [
             OverlayService, {
                 provide: SCREEN_CONFIG_ADAPTER_COMPONENT_INTERFACE_NAME,
@@ -7883,152 +7873,152 @@ class InputTextComponent extends BaseInputComponent {
                 provide: BaseInputComponent,
                 useExisting: InputTextComponent
             }
-        ], usesInheritance: true, ngImport: i0, template: `
-    <div class="input-text-wrapper" overlayParent #parentForOverlay="overlayParent">
-      @if (leftIcon || leftIconData) {
-        <co-icon class="input-text-left-icon" [icon]="leftIcon" [iconData]="leftIconData"
-          (click)="handleLeftIconClick($event)" (mousedown)="handleLeftIconMouseDown($event)"
-        (mouseup)="handleLeftIconMouseUp($event)"></co-icon>
-      }
-      @if (leftIcon || leftIconData) {
-        <div class="spacer left-icon"></div>
-      }
-      <div class="input-wrapper">
-        @if (showPlaceholderOnFocus || (!showPlaceholderOnFocus && !hasValue && !focused)) {
-          <label
-          [textContent]="placeholder"></label>
-        }
-        @if (!focused && !useContent && formatPipe) {
-          <span class="input-text-formatted"
-            [class.show]="!focused && !useContent && formatPipe"
-            [ngClass]="align"
-            [textContent]="pipedModel"
-            (click)="handleDoFocus($event)"
-          ></span>
-        }
-        <input [class.show]="focused || !formatPipe" #input
-          [class.input-input-hidden]="useContent"
-          [ngClass]="align"
-          [type]="isWeekInputMode ? 'text' : (isFocusedOnDate || (hasValue && emptyPlace)) ? 'date' : (digitsOnly ? 'number' : (type === 'date' ? 'text' : type))"
-          [placeholder]="type === 'date' && !isFocusedOnDate ? '' : ''"
-          [pattern]="type === 'date' ? pattern : undefined"
-          [ngModel]="model"
-          [min]="(type === 'number' || type === 'date') && this.min ? this.min : undefined"
-          [max]="(type === 'number' || type === 'date') && this.max ? this.max : undefined"
-          [readonly]="readonly"
-          [required]="required"
-          (ngModelChange)="modelChange.emit($event)"
-          (keydown)="handleKeyDownInput($event)"
-          (keyup)="keyUp.emit($event)"
-          (focusin)="handleInputFocus($event)"
-          (focusout)="handleBlur($event)"
-          >
-          @if (useContent) {
-            <div class="input-content-wrapper">
-              <ng-content></ng-content>
-            </div>
-          }
-          <co-icon [class.show]="showClearButton && hasValue && !readonly" class="input-text-clear-button"
-          [icon]="icons.CrossSkinny" (click)="clearInput($event)"></co-icon>
-          <div class="required-indicator"></div>
-        </div>
-        @if (rightIcon || rightIconData) {
-          <div class="spacer right-icon"></div>
-        }
-        @if (rightIcon || rightIconData) {
-          <co-icon class="input-text-right-icon" [icon]="rightIcon"
-            [iconData]="rightIconData"
-            (click)="handleRightIconClick($event)"
-            (pointerdown)="handleRightIconPointerDown($event)"
-            (pointerup)="handleRightIconPointerUp($event)"
-          (pointercancel)="handleRightIconPointerUp($event)"></co-icon>
-        }
-      </div>
-      <!--
-      <co-commit-buttons *ngIf="showSaveCancel && focused && canSaveOrCancel"
-        [committing]="committing"
-        [commitFinished]="commitFinished"
-        (commitClick)="commitClick($event)"
-        (cancelClick)="cancelClick($event)"
-        >
-      </co-commit-buttons>
-      -->
+        ], usesInheritance: true, ngImport: i0, template: `
+    <div class="input-text-wrapper" overlayParent #parentForOverlay="overlayParent">
+      @if (leftIcon || leftIconData) {
+        <co-icon class="input-text-left-icon" [icon]="leftIcon" [iconData]="leftIconData"
+          (click)="handleLeftIconClick($event)" (mousedown)="handleLeftIconMouseDown($event)"
+        (mouseup)="handleLeftIconMouseUp($event)"></co-icon>
+      }
+      @if (leftIcon || leftIconData) {
+        <div class="spacer left-icon"></div>
+      }
+      <div class="input-wrapper">
+        @if (showPlaceholderOnFocus || (!showPlaceholderOnFocus && !hasValue && !focused)) {
+          <label
+          [textContent]="placeholder"></label>
+        }
+        @if (!focused && !useContent && formatPipe) {
+          <span class="input-text-formatted"
+            [class.show]="!focused && !useContent && formatPipe"
+            [ngClass]="align"
+            [textContent]="pipedModel"
+            (click)="handleDoFocus($event)"
+          ></span>
+        }
+        <input [class.show]="focused || !formatPipe" #input
+          [class.input-input-hidden]="useContent"
+          [ngClass]="align"
+          [type]="isWeekInputMode ? 'text' : (isFocusedOnDate || (hasValue && emptyPlace)) ? 'date' : (digitsOnly ? 'number' : (type === 'date' ? 'text' : type))"
+          [placeholder]="type === 'date' && !isFocusedOnDate ? '' : ''"
+          [pattern]="type === 'date' ? pattern : undefined"
+          [ngModel]="model"
+          [min]="(type === 'number' || type === 'date') && this.min ? this.min : undefined"
+          [max]="(type === 'number' || type === 'date') && this.max ? this.max : undefined"
+          [readonly]="readonly"
+          [required]="required"
+          (ngModelChange)="modelChange.emit($event)"
+          (keydown)="handleKeyDownInput($event)"
+          (keyup)="keyUp.emit($event)"
+          (focusin)="handleInputFocus($event)"
+          (focusout)="handleBlur($event)"
+          >
+          @if (useContent) {
+            <div class="input-content-wrapper">
+              <ng-content></ng-content>
+            </div>
+          }
+          <co-icon [class.show]="showClearButton && hasValue && !readonly" class="input-text-clear-button"
+          [icon]="icons.CrossSkinny" (click)="clearInput($event)"></co-icon>
+          <div class="required-indicator"></div>
+        </div>
+        @if (rightIcon || rightIconData) {
+          <div class="spacer right-icon"></div>
+        }
+        @if (rightIcon || rightIconData) {
+          <co-icon class="input-text-right-icon" [icon]="rightIcon"
+            [iconData]="rightIconData"
+            (click)="handleRightIconClick($event)"
+            (pointerdown)="handleRightIconPointerDown($event)"
+            (pointerup)="handleRightIconPointerUp($event)"
+          (pointercancel)="handleRightIconPointerUp($event)"></co-icon>
+        }
+      </div>
+      <!--
+      <co-commit-buttons *ngIf="showSaveCancel && focused && canSaveOrCancel"
+        [committing]="committing"
+        [commitFinished]="commitFinished"
+        (commitClick)="commitClick($event)"
+        (cancelClick)="cancelClick($event)"
+        >
+      </co-commit-buttons>
+      -->
     `, isInline: true, dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i5.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: IconComponent, selector: "co-icon", inputs: ["icon", "iconData"] }, { kind: "directive", type: OverlayParentDirective, selector: "[overlayParent]", exportAs: ["overlayParent"] }], encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: InputTextComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'co-input-text',
-                    template: `
-    <div class="input-text-wrapper" overlayParent #parentForOverlay="overlayParent">
-      @if (leftIcon || leftIconData) {
-        <co-icon class="input-text-left-icon" [icon]="leftIcon" [iconData]="leftIconData"
-          (click)="handleLeftIconClick($event)" (mousedown)="handleLeftIconMouseDown($event)"
-        (mouseup)="handleLeftIconMouseUp($event)"></co-icon>
-      }
-      @if (leftIcon || leftIconData) {
-        <div class="spacer left-icon"></div>
-      }
-      <div class="input-wrapper">
-        @if (showPlaceholderOnFocus || (!showPlaceholderOnFocus && !hasValue && !focused)) {
-          <label
-          [textContent]="placeholder"></label>
-        }
-        @if (!focused && !useContent && formatPipe) {
-          <span class="input-text-formatted"
-            [class.show]="!focused && !useContent && formatPipe"
-            [ngClass]="align"
-            [textContent]="pipedModel"
-            (click)="handleDoFocus($event)"
-          ></span>
-        }
-        <input [class.show]="focused || !formatPipe" #input
-          [class.input-input-hidden]="useContent"
-          [ngClass]="align"
-          [type]="isWeekInputMode ? 'text' : (isFocusedOnDate || (hasValue && emptyPlace)) ? 'date' : (digitsOnly ? 'number' : (type === 'date' ? 'text' : type))"
-          [placeholder]="type === 'date' && !isFocusedOnDate ? '' : ''"
-          [pattern]="type === 'date' ? pattern : undefined"
-          [ngModel]="model"
-          [min]="(type === 'number' || type === 'date') && this.min ? this.min : undefined"
-          [max]="(type === 'number' || type === 'date') && this.max ? this.max : undefined"
-          [readonly]="readonly"
-          [required]="required"
-          (ngModelChange)="modelChange.emit($event)"
-          (keydown)="handleKeyDownInput($event)"
-          (keyup)="keyUp.emit($event)"
-          (focusin)="handleInputFocus($event)"
-          (focusout)="handleBlur($event)"
-          >
-          @if (useContent) {
-            <div class="input-content-wrapper">
-              <ng-content></ng-content>
-            </div>
-          }
-          <co-icon [class.show]="showClearButton && hasValue && !readonly" class="input-text-clear-button"
-          [icon]="icons.CrossSkinny" (click)="clearInput($event)"></co-icon>
-          <div class="required-indicator"></div>
-        </div>
-        @if (rightIcon || rightIconData) {
-          <div class="spacer right-icon"></div>
-        }
-        @if (rightIcon || rightIconData) {
-          <co-icon class="input-text-right-icon" [icon]="rightIcon"
-            [iconData]="rightIconData"
-            (click)="handleRightIconClick($event)"
-            (pointerdown)="handleRightIconPointerDown($event)"
-            (pointerup)="handleRightIconPointerUp($event)"
-          (pointercancel)="handleRightIconPointerUp($event)"></co-icon>
-        }
-      </div>
-      <!--
-      <co-commit-buttons *ngIf="showSaveCancel && focused && canSaveOrCancel"
-        [committing]="committing"
-        [commitFinished]="commitFinished"
-        (commitClick)="commitClick($event)"
-        (cancelClick)="cancelClick($event)"
-        >
-      </co-commit-buttons>
-      -->
+                    template: `
+    <div class="input-text-wrapper" overlayParent #parentForOverlay="overlayParent">
+      @if (leftIcon || leftIconData) {
+        <co-icon class="input-text-left-icon" [icon]="leftIcon" [iconData]="leftIconData"
+          (click)="handleLeftIconClick($event)" (mousedown)="handleLeftIconMouseDown($event)"
+        (mouseup)="handleLeftIconMouseUp($event)"></co-icon>
+      }
+      @if (leftIcon || leftIconData) {
+        <div class="spacer left-icon"></div>
+      }
+      <div class="input-wrapper">
+        @if (showPlaceholderOnFocus || (!showPlaceholderOnFocus && !hasValue && !focused)) {
+          <label
+          [textContent]="placeholder"></label>
+        }
+        @if (!focused && !useContent && formatPipe) {
+          <span class="input-text-formatted"
+            [class.show]="!focused && !useContent && formatPipe"
+            [ngClass]="align"
+            [textContent]="pipedModel"
+            (click)="handleDoFocus($event)"
+          ></span>
+        }
+        <input [class.show]="focused || !formatPipe" #input
+          [class.input-input-hidden]="useContent"
+          [ngClass]="align"
+          [type]="isWeekInputMode ? 'text' : (isFocusedOnDate || (hasValue && emptyPlace)) ? 'date' : (digitsOnly ? 'number' : (type === 'date' ? 'text' : type))"
+          [placeholder]="type === 'date' && !isFocusedOnDate ? '' : ''"
+          [pattern]="type === 'date' ? pattern : undefined"
+          [ngModel]="model"
+          [min]="(type === 'number' || type === 'date') && this.min ? this.min : undefined"
+          [max]="(type === 'number' || type === 'date') && this.max ? this.max : undefined"
+          [readonly]="readonly"
+          [required]="required"
+          (ngModelChange)="modelChange.emit($event)"
+          (keydown)="handleKeyDownInput($event)"
+          (keyup)="keyUp.emit($event)"
+          (focusin)="handleInputFocus($event)"
+          (focusout)="handleBlur($event)"
+          >
+          @if (useContent) {
+            <div class="input-content-wrapper">
+              <ng-content></ng-content>
+            </div>
+          }
+          <co-icon [class.show]="showClearButton && hasValue && !readonly" class="input-text-clear-button"
+          [icon]="icons.CrossSkinny" (click)="clearInput($event)"></co-icon>
+          <div class="required-indicator"></div>
+        </div>
+        @if (rightIcon || rightIconData) {
+          <div class="spacer right-icon"></div>
+        }
+        @if (rightIcon || rightIconData) {
+          <co-icon class="input-text-right-icon" [icon]="rightIcon"
+            [iconData]="rightIconData"
+            (click)="handleRightIconClick($event)"
+            (pointerdown)="handleRightIconPointerDown($event)"
+            (pointerup)="handleRightIconPointerUp($event)"
+          (pointercancel)="handleRightIconPointerUp($event)"></co-icon>
+        }
+      </div>
+      <!--
+      <co-commit-buttons *ngIf="showSaveCancel && focused && canSaveOrCancel"
+        [committing]="committing"
+        [commitFinished]="commitFinished"
+        (commitClick)="commitClick($event)"
+        (cancelClick)="cancelClick($event)"
+        >
+      </co-commit-buttons>
+      -->
     `,
                     providers: [
                         OverlayService, {
@@ -8044,7 +8034,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 }]
         }], ctorParameters: () => [{ type: FormComponent, decorators: [{
                     type: Optional
-                }] }, { type: i0.Injector }, { type: i0.ChangeDetectorRef }, { type: OverlayService }, { type: i0.ComponentFactoryResolver }, { type: FormInputUserModelChangeListenerService }, { type: NgZoneWrapperService }, { type: i0.ElementRef }], propDecorators: { useContent: [{
+                }] }, { type: i0.ChangeDetectorRef }, { type: OverlayService }, { type: FormInputUserModelChangeListenerService }, { type: NgZoneWrapperService }, { type: i0.ElementRef }], propDecorators: { useContent: [{
                 type: Input
             }], placeholder: [{
                 type: Input
@@ -8139,7 +8129,6 @@ class InputDatePickerComponent extends BaseInputDatePickerDirective {
     formComponent;
     changeDetector;
     overlayService;
-    componentFactoryResolver;
     formUserChangeListener;
     ngZoneWrapper;
     elementRef;
@@ -8150,12 +8139,11 @@ class InputDatePickerComponent extends BaseInputDatePickerDirective {
     showClass() {
         return true;
     }
-    constructor(formComponent, changeDetector, overlayService, componentFactoryResolver, formUserChangeListener, ngZoneWrapper, elementRef) {
-        super(changeDetector, componentFactoryResolver, overlayService, formUserChangeListener, ngZoneWrapper, elementRef);
+    constructor(formComponent, changeDetector, overlayService, formUserChangeListener, ngZoneWrapper, elementRef) {
+        super(changeDetector, overlayService, formUserChangeListener, ngZoneWrapper, elementRef);
         this.formComponent = formComponent;
         this.changeDetector = changeDetector;
         this.overlayService = overlayService;
-        this.componentFactoryResolver = componentFactoryResolver;
         this.formUserChangeListener = formUserChangeListener;
         this.ngZoneWrapper = ngZoneWrapper;
         this.elementRef = elementRef;
@@ -8227,7 +8215,7 @@ class InputDatePickerComponent extends BaseInputDatePickerDirective {
     handleClearIconClicked() {
         this.setModel(undefined);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: InputDatePickerComponent, deps: [{ token: FormComponent, optional: true }, { token: i0.ChangeDetectorRef }, { token: OverlayService }, { token: i0.ComponentFactoryResolver }, { token: FormInputUserModelChangeListenerService }, { token: NgZoneWrapperService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: InputDatePickerComponent, deps: [{ token: FormComponent, optional: true }, { token: i0.ChangeDetectorRef }, { token: OverlayService }, { token: FormInputUserModelChangeListenerService }, { token: NgZoneWrapperService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: InputDatePickerComponent, isStandalone: false, selector: "co-input-date", inputs: { firstDayOfWeek: "firstDayOfWeek", showClearButton: "showClearButton" }, host: { properties: { "class.co-input-date": "this.showClass" } }, providers: [
             OverlayService, {
                 provide: SCREEN_CONFIG_ADAPTER_COMPONENT_INTERFACE_NAME, useExisting: forwardRef(() => InputDatePickerComponent)
@@ -8299,7 +8287,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 }]
         }], ctorParameters: () => [{ type: FormComponent, decorators: [{
                     type: Optional
-                }] }, { type: i0.ChangeDetectorRef }, { type: OverlayService }, { type: i0.ComponentFactoryResolver }, { type: FormInputUserModelChangeListenerService }, { type: NgZoneWrapperService }, { type: i0.ElementRef }], propDecorators: { firstDayOfWeek: [{
+                }] }, { type: i0.ChangeDetectorRef }, { type: OverlayService }, { type: FormInputUserModelChangeListenerService }, { type: NgZoneWrapperService }, { type: i0.ElementRef }], propDecorators: { firstDayOfWeek: [{
                 type: Input
             }], showClearButton: [{
                 type: Input
@@ -9475,7 +9463,6 @@ class InputNumberPickerComponent extends BaseInputComponent {
     iconCacheService;
     overlayService;
     _ngZone;
-    componentFactoryResolver;
     ngZoneWrapper;
     elementRef;
     // @override
@@ -9541,13 +9528,12 @@ class InputNumberPickerComponent extends BaseInputComponent {
     _autoCountTimeout;
     _stepIncrementTimeout;
     _startAutocountTimeout;
-    constructor(formComponent, iconCacheService, overlayService, _ngZone, componentFactoryResolver, changeDetector, formUserChangeListener, ngZoneWrapper, elementRef) {
-        super(changeDetector, componentFactoryResolver, overlayService, formUserChangeListener, ngZoneWrapper, elementRef);
+    constructor(formComponent, iconCacheService, overlayService, _ngZone, changeDetector, formUserChangeListener, ngZoneWrapper, elementRef) {
+        super(changeDetector, overlayService, formUserChangeListener, ngZoneWrapper, elementRef);
         this.formComponent = formComponent;
         this.iconCacheService = iconCacheService;
         this.overlayService = overlayService;
         this._ngZone = _ngZone;
-        this.componentFactoryResolver = componentFactoryResolver;
         this.ngZoneWrapper = ngZoneWrapper;
         this.elementRef = elementRef;
         this._numberLogicValueChangeSub = this.numberLogic.valueChange.subscribe((value) => {
@@ -9705,7 +9691,7 @@ class InputNumberPickerComponent extends BaseInputComponent {
                 break;
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: InputNumberPickerComponent, deps: [{ token: FormComponent, optional: true }, { token: IconCacheService }, { token: OverlayService }, { token: i0.NgZone }, { token: i0.ComponentFactoryResolver }, { token: i0.ChangeDetectorRef }, { token: FormInputUserModelChangeListenerService }, { token: NgZoneWrapperService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: InputNumberPickerComponent, deps: [{ token: FormComponent, optional: true }, { token: IconCacheService }, { token: OverlayService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: FormInputUserModelChangeListenerService }, { token: NgZoneWrapperService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: InputNumberPickerComponent, isStandalone: false, selector: "co-input-number-picker", inputs: { model: "model", modelChangeOnEnter: "modelChangeOnEnter", showPermanentLabel: "showPermanentLabel", leftIconData: "leftIconData", min: "min", step: "step", max: "max", ngModelOptions: "ngModelOptions", minusIcon: "minusIcon", plusIcon: "plusIcon", buttonShowMode: "buttonShowMode", noValidation: "noValidation", decimals: "decimals" }, outputs: { modelChange: "modelChange", iconClick: "iconClick" }, host: { properties: { "class.has-icon": "this.leftIconData", "class.show-buttons-on-focus-only": "this.showButtonsOnFocusOnly", "class.has-label": "this.hasLabel", "class.co-input-number-picker": "this.showClass" } }, providers: [
             OverlayService, {
                 provide: SCREEN_CONFIG_ADAPTER_COMPONENT_INTERFACE_NAME, useExisting: forwardRef(() => InputNumberPickerComponent)
@@ -9820,7 +9806,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 }] }, { type: IconCacheService, decorators: [{
                     type: Inject,
                     args: [IconCacheService]
-                }] }, { type: OverlayService }, { type: i0.NgZone }, { type: i0.ComponentFactoryResolver }, { type: i0.ChangeDetectorRef }, { type: FormInputUserModelChangeListenerService }, { type: NgZoneWrapperService }, { type: i0.ElementRef }], propDecorators: { model: [{
+                }] }, { type: OverlayService }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: FormInputUserModelChangeListenerService }, { type: NgZoneWrapperService }, { type: i0.ElementRef }], propDecorators: { model: [{
                 type: Input
             }], modelChangeOnEnter: [{
                 type: Input
@@ -9896,7 +9882,6 @@ class InputRadioButtonComponent extends BaseInputComponent {
     formComponent;
     changeDetector;
     overlayService;
-    componentFactoryResolver;
     formUserChangeListener;
     ngZoneWrapper;
     elementRef;
@@ -9920,18 +9905,17 @@ class InputRadioButtonComponent extends BaseInputComponent {
             }
         }
     }
-    constructor(formComponent, changeDetector, overlayService, componentFactoryResolver, formUserChangeListener, ngZoneWrapper, elementRef) {
-        super(changeDetector, componentFactoryResolver, overlayService, formUserChangeListener, ngZoneWrapper, elementRef);
+    constructor(formComponent, changeDetector, overlayService, formUserChangeListener, ngZoneWrapper, elementRef) {
+        super(changeDetector, overlayService, formUserChangeListener, ngZoneWrapper, elementRef);
         this.formComponent = formComponent;
         this.changeDetector = changeDetector;
         this.overlayService = overlayService;
-        this.componentFactoryResolver = componentFactoryResolver;
         this.formUserChangeListener = formUserChangeListener;
         this.ngZoneWrapper = ngZoneWrapper;
         this.elementRef = elementRef;
         super._markAsOnPush();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: InputRadioButtonComponent, deps: [{ token: FormComponent, optional: true }, { token: i0.ChangeDetectorRef }, { token: OverlayService }, { token: i0.ComponentFactoryResolver }, { token: FormInputUserModelChangeListenerService }, { token: NgZoneWrapperService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: InputRadioButtonComponent, deps: [{ token: FormComponent, optional: true }, { token: i0.ChangeDetectorRef }, { token: OverlayService }, { token: FormInputUserModelChangeListenerService }, { token: NgZoneWrapperService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: InputRadioButtonComponent, isStandalone: false, selector: "co-input-radio-button", host: { listeners: { "click": "handleClick($event)" }, properties: { "class.selected": "this.isModelSelected", "class.co-radio-button": "this.showClass" } }, providers: [
             OverlayService, {
                 provide: SCREEN_CONFIG_ADAPTER_COMPONENT_INTERFACE_NAME, useExisting: forwardRef(() => InputRadioButtonComponent)
@@ -9939,16 +9923,16 @@ class InputRadioButtonComponent extends BaseInputComponent {
                 provide: BaseInputComponent,
                 useExisting: InputRadioButtonComponent
             }
-        ], usesInheritance: true, ngImport: i0, template: `
-        <div class="outer-circle" [class.selected]="model">
-          @if (model) {
-            <div class="inner-circle" @showSelected></div>
-          }
-        </div>
-        @if (label) {
-          <div class="label" [textContent]="label"></div>
-        }
-        <input #input [ngModel]="model" type="hidden">
+        ], usesInheritance: true, ngImport: i0, template: `
+        <div class="outer-circle" [class.selected]="model">
+          @if (model) {
+            <div class="inner-circle" @showSelected></div>
+          }
+        </div>
+        @if (label) {
+          <div class="label" [textContent]="label"></div>
+        }
+        <input #input [ngModel]="model" type="hidden">
         `, isInline: true, dependencies: [{ kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], animations: [
             trigger('showSelected', [
                 state('void', style({ transform: 'scale(0)' })),
@@ -9961,16 +9945,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
             type: Component,
             args: [{
                     selector: 'co-input-radio-button',
-                    template: `
-        <div class="outer-circle" [class.selected]="model">
-          @if (model) {
-            <div class="inner-circle" @showSelected></div>
-          }
-        </div>
-        @if (label) {
-          <div class="label" [textContent]="label"></div>
-        }
-        <input #input [ngModel]="model" type="hidden">
+                    template: `
+        <div class="outer-circle" [class.selected]="model">
+          @if (model) {
+            <div class="inner-circle" @showSelected></div>
+          }
+        </div>
+        @if (label) {
+          <div class="label" [textContent]="label"></div>
+        }
+        <input #input [ngModel]="model" type="hidden">
         `,
                     providers: [
                         OverlayService, {
@@ -9992,7 +9976,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 }]
         }], ctorParameters: () => [{ type: FormComponent, decorators: [{
                     type: Optional
-                }] }, { type: i0.ChangeDetectorRef }, { type: OverlayService }, { type: i0.ComponentFactoryResolver }, { type: FormInputUserModelChangeListenerService }, { type: NgZoneWrapperService }, { type: i0.ElementRef }], propDecorators: { isModelSelected: [{
+                }] }, { type: i0.ChangeDetectorRef }, { type: OverlayService }, { type: FormInputUserModelChangeListenerService }, { type: NgZoneWrapperService }, { type: i0.ElementRef }], propDecorators: { isModelSelected: [{
                 type: HostBinding,
                 args: ['class.selected']
             }], showClass: [{
@@ -10177,7 +10161,6 @@ class InputTextareaComponent extends BaseInputComponent {
     formComponent;
     changeDetector;
     overlayService;
-    componentFactoryResolver;
     formUserChangeListener;
     ngZoneWrapper;
     elementRef;
@@ -10186,18 +10169,17 @@ class InputTextareaComponent extends BaseInputComponent {
         return true;
     }
     hasOwnLabel = true;
-    constructor(formComponent, changeDetector, overlayService, componentFactoryResolver, formUserChangeListener, ngZoneWrapper, elementRef) {
-        super(changeDetector, componentFactoryResolver, overlayService, formUserChangeListener, ngZoneWrapper, elementRef);
+    constructor(formComponent, changeDetector, overlayService, formUserChangeListener, ngZoneWrapper, elementRef) {
+        super(changeDetector, overlayService, formUserChangeListener, ngZoneWrapper, elementRef);
         this.formComponent = formComponent;
         this.changeDetector = changeDetector;
         this.overlayService = overlayService;
-        this.componentFactoryResolver = componentFactoryResolver;
         this.formUserChangeListener = formUserChangeListener;
         this.ngZoneWrapper = ngZoneWrapper;
         this.elementRef = elementRef;
         super._markAsOnPush();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: InputTextareaComponent, deps: [{ token: FormComponent, optional: true }, { token: i0.ChangeDetectorRef }, { token: OverlayService }, { token: i0.ComponentFactoryResolver }, { token: FormInputUserModelChangeListenerService }, { token: NgZoneWrapperService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: InputTextareaComponent, deps: [{ token: FormComponent, optional: true }, { token: i0.ChangeDetectorRef }, { token: OverlayService }, { token: FormInputUserModelChangeListenerService }, { token: NgZoneWrapperService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: InputTextareaComponent, isStandalone: false, selector: "co-input-textarea", inputs: { placeholder: "placeholder" }, host: { properties: { "class.co-input-textarea": "this.showClass", "class.custom-height": "this.showClass", "class.has-own-label": "this.hasOwnLabel" } }, providers: [
             OverlayService, {
                 provide: SCREEN_CONFIG_ADAPTER_COMPONENT_INTERFACE_NAME,
@@ -10271,7 +10253,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 }]
         }], ctorParameters: () => [{ type: FormComponent, decorators: [{
                     type: Optional
-                }] }, { type: i0.ChangeDetectorRef }, { type: OverlayService }, { type: i0.ComponentFactoryResolver }, { type: FormInputUserModelChangeListenerService }, { type: NgZoneWrapperService }, { type: i0.ElementRef }], propDecorators: { placeholder: [{
+                }] }, { type: i0.ChangeDetectorRef }, { type: OverlayService }, { type: FormInputUserModelChangeListenerService }, { type: NgZoneWrapperService }, { type: i0.ElementRef }], propDecorators: { placeholder: [{
                 type: Input
             }], showClass: [{
                 type: HostBinding,
@@ -14326,7 +14308,6 @@ class ListOfValuesComponent extends BaseInputComponent {
     iconCacheService;
     changeDetector;
     overlayService;
-    componentFactoryResolver;
     formUserChangeListener;
     ngZoneWrapper;
     elementRef;
@@ -14369,13 +14350,12 @@ class ListOfValuesComponent extends BaseInputComponent {
     _collection = [];
     debounceTimeout;
     _lovPopupComponentRef;
-    constructor(formComponent, iconCacheService, changeDetector, overlayService, componentFactoryResolver, formUserChangeListener, ngZoneWrapper, elementRef) {
-        super(changeDetector, componentFactoryResolver, overlayService, formUserChangeListener, ngZoneWrapper, elementRef);
+    constructor(formComponent, iconCacheService, changeDetector, overlayService, formUserChangeListener, ngZoneWrapper, elementRef) {
+        super(changeDetector, overlayService, formUserChangeListener, ngZoneWrapper, elementRef);
         this.formComponent = formComponent;
         this.iconCacheService = iconCacheService;
         this.changeDetector = changeDetector;
         this.overlayService = overlayService;
-        this.componentFactoryResolver = componentFactoryResolver;
         this.formUserChangeListener = formUserChangeListener;
         this.ngZoneWrapper = ngZoneWrapper;
         this.elementRef = elementRef;
@@ -14570,7 +14550,7 @@ class ListOfValuesComponent extends BaseInputComponent {
             }
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ListOfValuesComponent, deps: [{ token: FormComponent, optional: true }, { token: IconCacheService }, { token: i0.ChangeDetectorRef }, { token: OverlayService }, { token: i0.ComponentFactoryResolver }, { token: FormInputUserModelChangeListenerService }, { token: NgZoneWrapperService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ListOfValuesComponent, deps: [{ token: FormComponent, optional: true }, { token: IconCacheService }, { token: i0.ChangeDetectorRef }, { token: OverlayService }, { token: FormInputUserModelChangeListenerService }, { token: NgZoneWrapperService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: ListOfValuesComponent, isStandalone: false, selector: "co-list-of-values", inputs: { model: "model", multiselect: "multiselect", showToggleAll: "showToggleAll", largeCollection: "largeCollection", displayField: "displayField", optionIcon: "optionIcon", collection: "collection", collectionLoadFn: "collectionLoadFn", collectionLoadFnProp: "collectionLoadFnProp", leftIconData: "leftIconData", searchPlaceholder: "searchPlaceholder", searchDisabled: "searchDisabled", showChips: "showChips" }, host: { properties: { "class.custom-height": "this.multiselect", "class.multi-select": "this.multiselect", "class.co-list-of-values": "this.showClass" } }, providers: [
             OverlayService,
             {
@@ -14712,7 +14692,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 }]
         }], ctorParameters: () => [{ type: FormComponent, decorators: [{
                     type: Optional
-                }] }, { type: IconCacheService }, { type: i0.ChangeDetectorRef }, { type: OverlayService }, { type: i0.ComponentFactoryResolver }, { type: FormInputUserModelChangeListenerService }, { type: NgZoneWrapperService }, { type: i0.ElementRef }], propDecorators: { model: [{
+                }] }, { type: IconCacheService }, { type: i0.ChangeDetectorRef }, { type: OverlayService }, { type: FormInputUserModelChangeListenerService }, { type: NgZoneWrapperService }, { type: i0.ElementRef }], propDecorators: { model: [{
                 type: Input
             }], parentForOverlay: [{
                 type: ViewChild,
@@ -18855,8 +18835,354 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 }]
         }] });
 
+// Static utility functions holder related to CSS.
+// @dynamic
+class CssUtils {
+    /**
+     * Performs a horizontal size change animation on the given DOM element.
+     *
+     * @param nativeElement The DOM element
+     * @param transitionTime In seconds
+     * @param startWidth Pixel size string
+     * @param endWidth Defaults to elements true width, by calculation
+     * @returns A resolved promise after the transition was done.
+     */
+    static AnimateMaxWidthTransitionOn(nativeElement, transitionTime = 0.2, startWidth = "0px", endWidth) {
+        if (!nativeElement) {
+            return;
+        }
+        if (!endWidth) {
+            endWidth = CssUtils.FindOffsetWidthOfElementWithTransition(nativeElement);
+        }
+        const transitionStyle = `max-width ${transitionTime}s ease-out`;
+        if (!CssUtils.ElementHasStyle(nativeElement, "transition", transitionStyle)) {
+            CssUtils._AddTransitionStyleOn(nativeElement, transitionStyle);
+        }
+        nativeElement.style.maxWidth = startWidth;
+        CssUtils.PushCssChanges(nativeElement);
+        nativeElement.style.maxWidth = endWidth;
+        return CssUtils._returnPromise(transitionTime);
+    }
+    /**
+     * Performs a vertical size change animation on the given DOM element.
+     *
+     * @param nativeElement The DOM element
+     * @param transitionTime In seconds
+     * @param startHeight Pixel size string
+     * @param endHeight Defaults to elements true height, by calculation
+     * @returns A resolved promise after the transition was done.
+     */
+    static AnimateMaxHeightTransitionOn(nativeElement, transitionTime = 0.2, startHeight = "0px", endHeight) {
+        if (!nativeElement) {
+            return;
+        }
+        if (!endHeight) {
+            endHeight = CssUtils.FindOffsetHeightOfElementWithTransition(nativeElement);
+        }
+        const transitionStyle = `max-height ${transitionTime}s ease-out`;
+        if (!CssUtils.ElementHasStyle(nativeElement, "transition", transitionStyle)) {
+            CssUtils._AddTransitionStyleOn(nativeElement, transitionStyle);
+        }
+        nativeElement.style.maxHeight = startHeight;
+        CssUtils.PushCssChanges(nativeElement);
+        nativeElement.style.maxHeight = endHeight;
+        return CssUtils._returnPromise(transitionTime);
+    }
+    static AnimateMaxWidthToZeroOn(nativeElement, transitionTime = 0.2) {
+        return CssUtils.AnimateMaxWidthTransitionOn(nativeElement, transitionTime, CssUtils.GetTrueWidthOf(nativeElement) + "px", "0px");
+    }
+    static AnimateMaxHeightToZeroOn(nativeElement, transitionTime = 0.2) {
+        return CssUtils.AnimateMaxHeightTransitionOn(nativeElement, transitionTime, CssUtils.GetTrueHeightOf(nativeElement) + "px", "0px");
+    }
+    /**
+     * Returns the offsetwidth of given element as a pixel string. Uses trick to find true width of elements with a max-width of 0 and
+     * that have a transition style applied.
+     *
+     * @param nativeElement The DOM element
+     * @returns The width in pixels, e.g. "20px"
+     */
+    static FindOffsetWidthOfElementWithTransition(nativeElement) {
+        return CssUtils._FindOffsetHeightOrWidthOfElementWithTransition(nativeElement, false);
+    }
+    /**
+     * Returns the offsetheight of given element as a pixel string. Uses trick to find true width of elements with a max-height of 0 and
+     * that have a transition style applied.
+     *
+     * @param nativeElement The DOM element
+     * @returns The height in pixels, e.g. "20px"
+     */
+    static FindOffsetHeightOfElementWithTransition(nativeElement) {
+        return CssUtils._FindOffsetHeightOrWidthOfElementWithTransition(nativeElement, true);
+    }
+    // Returns the true height of the given element, in NUMBER of pixels. Includes margins.
+    static GetTrueHeightOf(nativeElement) {
+        const heightMargins = NumberUtils.ParseInt(document.defaultView.getComputedStyle(nativeElement, "").getPropertyValue('margin-top'))
+            + NumberUtils.ParseInt(document.defaultView.getComputedStyle(nativeElement, "").getPropertyValue('margin-bottom'));
+        return nativeElement.offsetHeight + heightMargins;
+    }
+    /**
+     *
+     * @param nativeElement
+     * @param styleName e.g. "margin-top"
+     * @returns
+     */
+    static GetComputedStyleVal(nativeElement, styleName) {
+        return document.defaultView.getComputedStyle(nativeElement, "").getPropertyValue("styleName");
+    }
+    // Returns the true width of the given element, in NUMBER of pixels. Includes margins.
+    static GetTrueWidthOf(nativeElement) {
+        const widthMargins = NumberUtils.ParseInt(document.defaultView.getComputedStyle(nativeElement, "").getPropertyValue('margin-left'))
+            + NumberUtils.ParseInt(document.defaultView.getComputedStyle(nativeElement, "").getPropertyValue('margin-right'));
+        return nativeElement.offsetWidth + widthMargins;
+    }
+    static ElementHasStyle(nativeElement, styleName, styleValue) {
+        if (!nativeElement || !styleName) {
+            return false;
+        }
+        return (nativeElement.style[styleName] === styleValue);
+    }
+    static SetStyleOnElement(nativeElement, styleName, styleValue, pushChanges = false) {
+        if (!nativeElement || !styleName) {
+            return;
+        }
+        nativeElement.style[styleName] = styleValue;
+        if (pushChanges) {
+            CssUtils.PushCssChanges(nativeElement);
+        }
+    }
+    static HideElement(nativeElement) {
+        if (nativeElement) {
+            CssUtils.SetStyleOnElement(nativeElement, "display", "none");
+        }
+    }
+    /**
+     * Returns the value of the given CSS style on the given native element.
+     * @param nativeElement
+     * @param styleName
+     * @returns
+     */
+    static GetStyleValue(nativeElement, styleName) {
+        if (!nativeElement || !styleName) {
+            return;
+        }
+        return nativeElement.style[styleName];
+    }
+    /**
+     * Returns a CSS-usable RGB string representation of given database-returned rgb color string.
+     * Database returns color strings like "0xFFFF00" or "0X0"
+     *
+     * @param dbRgbColorStr e.g. 0x990000, or 0xAB045F
+     * @returns The CSS HEX representation of given color
+     */
+    static DbRgbColorStringToCssRgbColor(dbRgbColorStr) {
+        if (!dbRgbColorStr || dbRgbColorStr.length === 0) {
+            return undefined;
+        }
+        // "0x" should become "#"
+        dbRgbColorStr = dbRgbColorStr.split("0x")[1];
+        if (!dbRgbColorStr) {
+            return undefined;
+        }
+        // database colors could contain errors, like too little or too many color characters: correct them here.
+        const strLen = dbRgbColorStr.length;
+        // make sure our length is 6 or 3
+        if (strLen > 6) {
+            dbRgbColorStr = dbRgbColorStr.slice(0, 6);
+        }
+        else if (strLen > 3 && strLen < 6) {
+            dbRgbColorStr = dbRgbColorStr.slice(0, 3);
+        }
+        else if (strLen === 1) {
+            // a strLen of 1 would be more common than 2 (eg black is '0'), so its else clause sits above the == 2 case here
+            dbRgbColorStr += dbRgbColorStr + dbRgbColorStr;
+        }
+        else if (strLen === 2) {
+            dbRgbColorStr += dbRgbColorStr[1];
+        }
+        // the final css-usable color
+        return "#" + dbRgbColorStr;
+    }
+    static PushCssChanges(nativeElement) {
+        /* tslint:disable */
+        // trick to wake renderer and push css changes, do not delete this line due to unused variable!
+        const notUnused = nativeElement.offsetHeight; //NOSONAR
+        /* tslint:enable */
+        return;
+    }
+    static TransparentColor(hexColor, opacity) {
+        const hex = hexColor.replace('#', '');
+        return `rgba(${Array.from({ length: 3 }, (v, i) => parseInt(hex.substring(i * 2, (i + 1) * 2), 16)).join(',')},${opacity})`;
+    }
+    static ElementHasClass(element, cssClass) {
+        return element && element.classList && element.classList.contains(cssClass);
+    }
+    // @param height True if you want height,fFalse if you want width
+    static _FindOffsetHeightOrWidthOfElementWithTransition(nativeElement, wantHeight) {
+        if (!nativeElement) {
+            return "0px";
+        }
+        /* Take transition off temporarily to allow element to grow to its true size,
+         then measure that size and reapply transition styling. */
+        const originalTransitionStyle = nativeElement.style.transition;
+        CssUtils._AddTransitionStyleOn(nativeElement, "none");
+        if (wantHeight) {
+            nativeElement.style.maxHeight = "";
+        }
+        else {
+            nativeElement.style.maxWidth = "";
+        }
+        let trueHeightOrWidth;
+        if (wantHeight) {
+            trueHeightOrWidth = nativeElement.offsetHeight;
+        }
+        else {
+            trueHeightOrWidth = nativeElement.offsetWidth;
+        }
+        trueHeightOrWidth += "px";
+        nativeElement.style.transition = originalTransitionStyle;
+        return trueHeightOrWidth;
+    }
+    /**
+     * Adds given transition style on given DOM element.
+     *
+     * @param nativeElement DOM element reference
+     * @param styleText The shorthand style string for the transition to set
+     */
+    static _AddTransitionStyleOn(nativeElement, styleText) {
+        if (!nativeElement || !styleText) {
+            return;
+        }
+        // if it already has a transition style: append new one with a comma
+        if (nativeElement.style.transition) {
+            styleText = ", " + styleText;
+        }
+        nativeElement.style.transition += styleText;
+        nativeElement.style.WebkitTransition += styleText;
+        nativeElement.style.MozTransition += styleText;
+    }
+    static _returnPromise(transitionTime) {
+        return new Promise((resolve) => {
+            setTimeout(() => {
+                resolve();
+            }, transitionTime * 1000);
+        });
+    }
+}
+
+// @BusinessObjectData({
+//     name: "Color",
+//     mapping: DataMapping.Simplebasedata
+// })
+class Color {
+    colorCode;
+    description;
+    rgbColor;
+    // This rgbColor of this color represented like '#abcdef', for direct use in CSS.
+    get cssColor() {
+        return CssUtils.DbRgbColorStringToCssRgbColor(this.rgbColor);
+    }
+    constructor() {
+    }
+    // @override
+    getId() {
+        return this.rgbColor;
+    }
+    getTransparentCssColor(opacity = 0.5) {
+        return CssUtils.TransparentColor(this.cssColor, opacity);
+    }
+}
+
+// @BusinessObjectData({
+//     name: "ColorSequence",
+//     mapping: DataMapping.Simplebasedata
+// })
+class ColorSequence {
+    colors = [];
+    name;
+    addColor(color) {
+        this.colors.push(color);
+    }
+    // CYCLES through the colors in this sequence and returns the color on given index.
+    getColor(index) {
+        if (!this.colors) {
+            return new Color();
+        }
+        return this.colors[index % this.colors.length];
+    }
+    getId() {
+        return this.name;
+    }
+    getRandomColor() {
+        if (!this.colors) {
+            return new Color();
+        }
+        return this.colors[NumberUtils.RandomInt(0, this.colors.length - 1)];
+    }
+}
+
+// Represents the enumeration of color sequence names; the different color sequences stored in db.
+var ColorSequenceName;
+(function (ColorSequenceName) {
+    ColorSequenceName["Regular"] = "REGULAR";
+    ColorSequenceName["Variant"] = "VARIANT";
+})(ColorSequenceName || (ColorSequenceName = {}));
+
 class ColorSequenceService {
     colors = new Map();
+    _colorSequences = [];
+    _regularColSeq = new ColorSequence();
+    _variantColSeq = new ColorSequence();
+    _regularColorsRgb = [
+        "0x009ee0",
+        "0x6b4e77",
+        "0xb10060",
+        "0x56ad4a",
+        "0x60091a",
+        "0xf29400",
+        "0x00878f",
+        "0xb84e8a",
+        "0x765c3d",
+        "0x9da5b2",
+        "0xe41f41",
+        "0x025122",
+        "0x995c57",
+        "0x014b50",
+        "0xd0a46c",
+        "0x3d6e8b",
+        "0x31363e",
+        "0xe52986",
+        "0x74b77f",
+        "0xe95d0f"
+    ];
+    _variantColorsRgb = [
+        "0x749b74",
+        "0xca2f3f",
+        "0x4fa9cb",
+        "0xea7f3d",
+        "0x9d6b9c",
+        "0x7a4c19",
+        "0x711240",
+        "0x56ad4a",
+        "0x024561",
+        "0xf8b442",
+        "0x58385d",
+        "0xea6ea3",
+        "0x9cc7e7",
+        "0x554636",
+        "0x9d5528",
+        "0xe85152",
+        "0x685d6d",
+        "0xaad3ac",
+        "0x97202d",
+        "0x634946"
+    ];
+    constructor() {
+        this._buildColorSequences();
+    }
+    // Retrieves ColorSequence that has the given name, if any.
+    getColorSequenceByName(sequenceName) {
+        return this._colorSequences.find(seq => seq.name === sequenceName);
+    }
     getRandomColor(id) {
         if (this.colors.has(id)) {
             return this.colors.get(id);
@@ -18892,6 +19218,22 @@ class ColorSequenceService {
     GetHSLAColor(h, s, l, a) {
         return `hsl(${h}, ${s}%, ${l}%, ${a})`;
     }
+    _buildColorSequences() {
+        this._regularColSeq.name = ColorSequenceName.Regular;
+        this._regularColorsRgb.forEach((color, index) => {
+            const newColor = new Color();
+            newColor.rgbColor = this._regularColorsRgb[index];
+            this._regularColSeq.addColor(newColor);
+        });
+        this._colorSequences.push(this._regularColSeq);
+        this._variantColSeq.name = ColorSequenceName.Variant;
+        this._variantColorsRgb.forEach((color, index) => {
+            const newColor = new Color();
+            newColor.rgbColor = this._variantColorsRgb[index];
+            this._variantColSeq.addColor(newColor);
+        });
+        this._colorSequences.push(this._variantColSeq);
+    }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ColorSequenceService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ColorSequenceService, providedIn: 'root' });
 }
@@ -18900,7 +19242,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
             args: [{
                     providedIn: 'root'
                 }]
-        }] });
+        }], ctorParameters: () => [] });
 
 class HourSchedulingTestObjectComponent {
     showClass() {