@openmrs/ngx-formentry 5.0.1-pre.380 → 5.0.1-pre.383

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,10 +1,10 @@
1
1
  import * as i0 from '@angular/core';
2
2
  import { Injectable, Pipe, EventEmitter, TemplateRef, Component, Input, Output, ViewChild, HostListener, Directive, forwardRef, HostBinding, InjectionToken, inject, LOCALE_ID, ChangeDetectionStrategy, Optional, Inject, SkipSelf, ContentChild, ContentChildren, NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
3
- import * as i1 from '@angular/common';
3
+ import * as i1$1 from '@angular/common';
4
4
  import { DOCUMENT, CommonModule } from '@angular/common';
5
5
  import * as i6 from '@angular/forms';
6
6
  import { AbstractControl, UntypedFormControl, UntypedFormGroup, UntypedFormArray, NG_VALUE_ACCESSOR, NG_VALIDATORS, Validators, FormsModule, ReactiveFormsModule, UntypedFormBuilder } from '@angular/forms';
7
- import * as i4 from '@ngx-translate/core';
7
+ import * as i1 from '@ngx-translate/core';
8
8
  import { TranslateModule } from '@ngx-translate/core';
9
9
  import { Subject, concat, of, BehaviorSubject, Subscription, defer, merge } from 'rxjs';
10
10
  import moment from 'moment';
@@ -15,21 +15,21 @@ import { NgSelectModule } from '@ng-select/ng-select';
15
15
  import { distinctUntilChanged, tap, switchMap, catchError, take, debounceTime, filter, startWith } from 'rxjs/operators';
16
16
  import * as i3 from '@openmrs/ngx-file-uploader';
17
17
  import { NgxFileUploaderModule } from '@openmrs/ngx-file-uploader';
18
- import * as i1$1 from '@angular/platform-browser';
18
+ import * as i1$2 from '@angular/platform-browser';
19
19
  import * as i2 from '@angular/cdk/portal';
20
20
  import { BasePortalOutlet, CdkPortalOutlet, ComponentPortal, PortalInjector, PortalModule } from '@angular/cdk/portal';
21
- import * as i1$2 from '@angular/cdk/overlay';
21
+ import * as i1$3 from '@angular/cdk/overlay';
22
22
  import { NoopScrollStrategy, Overlay, OverlayConfig, OverlayModule } from '@angular/cdk/overlay';
23
23
  import { ENTER, PAGE_DOWN, PAGE_UP, END, HOME, DOWN_ARROW, UP_ARROW, RIGHT_ARROW, LEFT_ARROW, SPACE, ESCAPE } from '@angular/cdk/keycodes';
24
24
  import { coerceNumberProperty, coerceBooleanProperty, coerceArray } from '@angular/cdk/coercion';
25
- import * as i4$1 from '@angular/cdk/a11y';
25
+ import * as i4 from '@angular/cdk/a11y';
26
26
  import { A11yModule } from '@angular/cdk/a11y';
27
- import * as i1$4 from '@angular/animations';
27
+ import * as i1$5 from '@angular/animations';
28
28
  import { trigger, state, style, transition, group, query, animateChild, animate, keyframes } from '@angular/animations';
29
- import * as i1$3 from '@angular-extensions/elements';
29
+ import * as i1$4 from '@angular-extensions/elements';
30
30
  import { LazyElementsModule } from '@angular-extensions/elements';
31
31
  import { WebcamModule } from 'ngx-webcam';
32
- import * as i1$5 from '@angular/cdk/platform';
32
+ import * as i1$6 from '@angular/cdk/platform';
33
33
  import { PlatformModule } from '@angular/cdk/platform';
34
34
 
35
35
  /*
@@ -149,7 +149,7 @@ class TimeAgoPipe {
149
149
  return 3600;
150
150
  }
151
151
  }
152
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TimeAgoPipe, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: i4.TranslateService }], target: i0.ɵɵFactoryTarget.Pipe }); }
152
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TimeAgoPipe, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: i1.TranslateService }], target: i0.ɵɵFactoryTarget.Pipe }); }
153
153
  static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: TimeAgoPipe, name: "timeAgo", pure: false }); }
154
154
  }
155
155
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TimeAgoPipe, decorators: [{
@@ -158,7 +158,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
158
158
  name: 'timeAgo',
159
159
  pure: false
160
160
  }]
161
- }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: i4.TranslateService }]; } });
161
+ }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: i1.TranslateService }]; } });
162
162
 
163
163
  class FormErrorsService {
164
164
  constructor() {
@@ -2132,12 +2132,12 @@ class ValidationFactory {
2132
2132
  }
2133
2133
  return messages;
2134
2134
  }
2135
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ValidationFactory, deps: [{ token: i4.TranslateService }], target: i0.ɵɵFactoryTarget.Injectable }); }
2135
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ValidationFactory, deps: [{ token: i1.TranslateService }], target: i0.ɵɵFactoryTarget.Injectable }); }
2136
2136
  static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ValidationFactory }); }
2137
2137
  }
2138
2138
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ValidationFactory, decorators: [{
2139
2139
  type: Injectable
2140
- }], ctorParameters: function () { return [{ type: i4.TranslateService }]; } });
2140
+ }], ctorParameters: function () { return [{ type: i1.TranslateService }]; } });
2141
2141
 
2142
2142
  class HidersDisablersFactory {
2143
2143
  constructor(expressionRunner, expressionHelper, _debugModeService) {
@@ -2486,7 +2486,7 @@ class SelectComponent {
2486
2486
  useExisting: SelectComponent,
2487
2487
  multi: true
2488
2488
  }
2489
- ], viewQueries: [{ propertyName: "select", first: true, predicate: ["select"], descendants: true }], ngImport: i0, template: "<div class=\"cds--form-item\">\n <ng-template [ngIf]=\"skeleton\">\n <div *ngIf=\"label\" class=\"cds--label cds--skeleton\"></div>\n <div class=\"cds--select cds--skeleton\"></div>\n </ng-template>\n <div\n *ngIf=\"!skeleton\"\n class=\"cds--select\"\n [ngClass]=\"{\n 'cds--select--inline': display === 'inline',\n 'cds--select--light': theme === 'light',\n 'cds--select--invalid': invalid,\n 'cds--select--warning': warn,\n 'cds--select--disabled': disabled\n }\"\n >\n <label *ngIf=\"label\" [for]=\"id\" class=\"cds--label\">\n <ng-container *ngIf=\"!isTemplate(label)\">{{ label }}</ng-container>\n <ng-template\n *ngIf=\"isTemplate(label)\"\n [ngTemplateOutlet]=\"label\"\n ></ng-template>\n </label>\n <div *ngIf=\"helperText\" class=\"cds--form__helper-text\">\n <ng-container *ngIf=\"!isTemplate(helperText)\">{{\n helperText\n }}</ng-container>\n <ng-template\n *ngIf=\"isTemplate(helperText)\"\n [ngTemplateOutlet]=\"helperText\"\n ></ng-template>\n </div>\n <div\n *ngIf=\"display === 'inline'; else noInline\"\n class=\"cds--select-input--inline__wrapper\"\n >\n <ng-container *ngTemplateOutlet=\"noInline\"></ng-container>\n </div>\n </div>\n</div>\n\n<!-- select element: dynamically projected based on 'display' variant -->\n<ng-template #noInline>\n <div\n class=\"cds--select-input__wrapper extend\"\n [attr.data-invalid]=\"invalid ? true : null\"\n >\n <select\n #select\n [attr.id]=\"id\"\n [attr.aria-label]=\"ariaLabel\"\n [disabled]=\"disabled\"\n (change)=\"onChange($event)\"\n [attr.aria-invalid]=\"invalid ? 'true' : null\"\n class=\"cds--select-input\"\n [ngClass]=\"{\n 'cds--select-input--xl': size === 'xl',\n 'cds--select-input--sm': size === 'sm'\n }\"\n >\n <ng-content></ng-content>\n </select>\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n style=\"will-change: transform\"\n xmlns=\"http://www.w3.org/2000/svg\"\n class=\"cds--select__arrow\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n aria-hidden=\"true\"\n >\n <path d=\"M8 11L3 6 3.7 5.3 8 9.6 12.3 5.3 13 6z\"></path>\n </svg>\n <svg\n *ngIf=\"invalid\"\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n style=\"will-change: transform\"\n xmlns=\"http://www.w3.org/2000/svg\"\n class=\"cds--text-input__invalid-icon\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M8,1C4.2,1,1,4.2,1,8s3.2,7,7,7s7-3.1,7-7S11.9,1,8,1z M7.5,4h1v5h-1C7.5,9,7.5,4,7.5,4z M8,12.2 c-0.4,0-0.8-0.4-0.8-0.8s0.3-0.8,0.8-0.8c0.4,0,0.8,0.4,0.8,0.8S8.4,12.2,8,12.2z\"\n ></path>\n <path\n d=\"M7.5,4h1v5h-1C7.5,9,7.5,4,7.5,4z M8,12.2c-0.4,0-0.8-0.4-0.8-0.8s0.3-0.8,0.8-0.8 c0.4,0,0.8,0.4,0.8,0.8S8.4,12.2,8,12.2z\"\n data-icon-path=\"inner-path\"\n opacity=\"0\"\n ></path>\n </svg>\n </div>\n <div\n *ngIf=\"invalid && invalidText && !warn\"\n role=\"alert\"\n class=\"cds--form-requirement\"\n aria-live=\"polite\"\n >\n <ng-container *ngIf=\"!isTemplate(invalidText)\">{{\n invalidText\n }}</ng-container>\n <ng-template\n *ngIf=\"isTemplate(invalidText)\"\n [ngTemplateOutlet]=\"invalidText\"\n ></ng-template>\n </div>\n <div *ngIf=\"!invalid && warn\" class=\"cds--form-requirement\">\n <ng-container *ngIf=\"!isTemplate(warnText)\">{{ warnText }}</ng-container>\n <ng-template\n *ngIf=\"isTemplate(warnText)\"\n [ngTemplateOutlet]=\"warnText\"\n ></ng-template>\n </div>\n</ng-template>\n", styles: [".cds--select--inline .cds--form__helper-text{order:4}.cds--select--inline:not(.cds--select--invalid) .cds--form__helper-text{margin-top:0}.cds--select-input__wrapper{min-width:16rem}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
2489
+ ], viewQueries: [{ propertyName: "select", first: true, predicate: ["select"], descendants: true }], ngImport: i0, template: "<div class=\"cds--form-item\">\n <ng-template [ngIf]=\"skeleton\">\n <div *ngIf=\"label\" class=\"cds--label cds--skeleton\"></div>\n <div class=\"cds--select cds--skeleton\"></div>\n </ng-template>\n <div\n *ngIf=\"!skeleton\"\n class=\"cds--select\"\n [ngClass]=\"{\n 'cds--select--inline': display === 'inline',\n 'cds--select--light': theme === 'light',\n 'cds--select--invalid': invalid,\n 'cds--select--warning': warn,\n 'cds--select--disabled': disabled\n }\"\n >\n <label *ngIf=\"label\" [for]=\"id\" class=\"cds--label\">\n <ng-container *ngIf=\"!isTemplate(label)\">{{ label }}</ng-container>\n <ng-template\n *ngIf=\"isTemplate(label)\"\n [ngTemplateOutlet]=\"label\"\n ></ng-template>\n </label>\n <div *ngIf=\"helperText\" class=\"cds--form__helper-text\">\n <ng-container *ngIf=\"!isTemplate(helperText)\">{{\n helperText\n }}</ng-container>\n <ng-template\n *ngIf=\"isTemplate(helperText)\"\n [ngTemplateOutlet]=\"helperText\"\n ></ng-template>\n </div>\n <div\n *ngIf=\"display === 'inline'; else noInline\"\n class=\"cds--select-input--inline__wrapper\"\n >\n <ng-container *ngTemplateOutlet=\"noInline\"></ng-container>\n </div>\n </div>\n</div>\n\n<!-- select element: dynamically projected based on 'display' variant -->\n<ng-template #noInline>\n <div\n class=\"cds--select-input__wrapper extend\"\n [attr.data-invalid]=\"invalid ? true : null\"\n >\n <select\n #select\n [attr.id]=\"id\"\n [attr.aria-label]=\"ariaLabel\"\n [disabled]=\"disabled\"\n (change)=\"onChange($event)\"\n [attr.aria-invalid]=\"invalid ? 'true' : null\"\n class=\"cds--select-input\"\n [ngClass]=\"{\n 'cds--select-input--xl': size === 'xl',\n 'cds--select-input--sm': size === 'sm'\n }\"\n >\n <ng-content></ng-content>\n </select>\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n style=\"will-change: transform\"\n xmlns=\"http://www.w3.org/2000/svg\"\n class=\"cds--select__arrow\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n aria-hidden=\"true\"\n >\n <path d=\"M8 11L3 6 3.7 5.3 8 9.6 12.3 5.3 13 6z\"></path>\n </svg>\n <svg\n *ngIf=\"invalid\"\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n style=\"will-change: transform\"\n xmlns=\"http://www.w3.org/2000/svg\"\n class=\"cds--text-input__invalid-icon\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M8,1C4.2,1,1,4.2,1,8s3.2,7,7,7s7-3.1,7-7S11.9,1,8,1z M7.5,4h1v5h-1C7.5,9,7.5,4,7.5,4z M8,12.2 c-0.4,0-0.8-0.4-0.8-0.8s0.3-0.8,0.8-0.8c0.4,0,0.8,0.4,0.8,0.8S8.4,12.2,8,12.2z\"\n ></path>\n <path\n d=\"M7.5,4h1v5h-1C7.5,9,7.5,4,7.5,4z M8,12.2c-0.4,0-0.8-0.4-0.8-0.8s0.3-0.8,0.8-0.8 c0.4,0,0.8,0.4,0.8,0.8S8.4,12.2,8,12.2z\"\n data-icon-path=\"inner-path\"\n opacity=\"0\"\n ></path>\n </svg>\n </div>\n <div\n *ngIf=\"invalid && invalidText && !warn\"\n role=\"alert\"\n class=\"cds--form-requirement\"\n aria-live=\"polite\"\n >\n <ng-container *ngIf=\"!isTemplate(invalidText)\">{{\n invalidText\n }}</ng-container>\n <ng-template\n *ngIf=\"isTemplate(invalidText)\"\n [ngTemplateOutlet]=\"invalidText\"\n ></ng-template>\n </div>\n <div *ngIf=\"!invalid && warn\" class=\"cds--form-requirement\">\n <ng-container *ngIf=\"!isTemplate(warnText)\">{{ warnText }}</ng-container>\n <ng-template\n *ngIf=\"isTemplate(warnText)\"\n [ngTemplateOutlet]=\"warnText\"\n ></ng-template>\n </div>\n</ng-template>\n", styles: [".cds--select--inline .cds--form__helper-text{order:4}.cds--select--inline:not(.cds--select--invalid) .cds--form__helper-text{margin-top:0}.cds--select-input__wrapper{min-width:16rem}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
2490
2490
  }
2491
2491
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SelectComponent, decorators: [{
2492
2492
  type: Component,
@@ -2602,6 +2602,10 @@ class NumberInputComponent {
2602
2602
  * The unique id for the number component.
2603
2603
  */
2604
2604
  this.id = `number-${NumberInputComponent.numberCount}`;
2605
+ /**
2606
+ * Sets the placeholder attribute on the `input` element.
2607
+ */
2608
+ this.placeholder = '';
2605
2609
  /**
2606
2610
  * Number input field render size
2607
2611
  */
@@ -2637,11 +2641,11 @@ class NumberInputComponent {
2637
2641
  /**
2638
2642
  * Sets the decrement label text
2639
2643
  */
2640
- this.decrementLabel = 'Decrease';
2644
+ this.decrementLabel = 'Decrement';
2641
2645
  /**
2642
2646
  * Sets the increment label text
2643
2647
  */
2644
- this.incrementLabel = 'Increase';
2648
+ this.incrementLabel = 'Increment';
2645
2649
  this._value = 0;
2646
2650
  /**
2647
2651
  * Called when number input is blurred. Needed to properly implement `ControlValueAccessor`.
@@ -2732,13 +2736,13 @@ class NumberInputComponent {
2732
2736
  return value instanceof TemplateRef;
2733
2737
  }
2734
2738
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NumberInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2735
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: NumberInputComponent, selector: "ofe-number-input", inputs: { theme: "theme", disabled: "disabled", skeleton: "skeleton", invalid: "invalid", id: "id", size: "size", required: "required", value: "value", min: "min", max: "max", maxlength: "maxlength", minlength: "minlength", label: "label", helperText: "helperText", invalidText: "invalidText", step: "step", precision: "precision", warn: "warn", warnText: "warnText", decrementLabel: "decrementLabel", incrementLabel: "incrementLabel" }, outputs: { numberChange: "numberChange" }, host: { listeners: { "focusout": "focusOut()" } }, providers: [
2739
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: NumberInputComponent, selector: "ofe-number-input", inputs: { theme: "theme", disabled: "disabled", skeleton: "skeleton", invalid: "invalid", id: "id", placeholder: "placeholder", size: "size", required: "required", value: "value", min: "min", max: "max", maxlength: "maxlength", minlength: "minlength", label: "label", helperText: "helperText", invalidText: "invalidText", step: "step", precision: "precision", warn: "warn", warnText: "warnText", decrementLabel: "decrementLabel", incrementLabel: "incrementLabel" }, outputs: { numberChange: "numberChange" }, host: { listeners: { "focusout": "focusOut()" } }, providers: [
2736
2740
  {
2737
2741
  provide: NG_VALUE_ACCESSOR,
2738
2742
  useExisting: forwardRef(() => NumberInputComponent),
2739
2743
  multi: true
2740
2744
  }
2741
- ], ngImport: i0, template: "<div\n data-numberinput\n [attr.data-invalid]=\"invalid ? true : null\"\n class=\"cds--number\"\n [ngClass]=\"{\n 'cds--number--light': theme === 'light',\n 'cds--number--nolabel': !label,\n 'cds--number--helpertext': helperText,\n 'cds--skeleton': skeleton,\n 'cds--number--sm': size === 'sm',\n 'cds--number--xl': size === 'xl'\n }\"\n>\n <div\n class=\"cds--number__input-wrapper\"\n [ngClass]=\"{\n 'cds--number__input-wrapper--warning': warn\n }\"\n >\n <input\n type=\"number\"\n [id]=\"id\"\n ofeNumberScroll\n [value]=\"value\"\n [attr.min]=\"min\"\n [attr.max]=\"max\"\n [attr.maxlength]=\"maxlength\"\n [attr.minlength]=\"minlength\"\n [attr.step]=\"step\"\n [disabled]=\"disabled\"\n [required]=\"required\"\n (input)=\"onNumberInputChange($event)\"\n />\n <div class=\"cds--number__controls\">\n <button\n type=\"button\"\n class=\"cds--number__control-btn down-icon\"\n (click)=\"onDecrement()\"\n title=\"Decrement number\"\n [attr.aria-label]=\"decrementLabel\"\n tabindex=\"-1\"\n >\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 32 32\"\n aria-hidden=\"true\"\n class=\"down-icon\"\n >\n <path d=\"M8 15H24V17H8z\"></path>\n </svg>\n </button>\n <div class=\"cds--number__rule-divider\"></div>\n <button\n type=\"button\"\n class=\"cds--number__control-btn up-icon\"\n (click)=\"onIncrement()\"\n title=\"Increment number\"\n [attr.aria-label]=\"incrementLabel\"\n tabindex=\"-1\"\n >\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 32 32\"\n aria-hidden=\"true\"\n class=\"up-icon\"\n >\n <path\n d=\"M17 15L17 8 15 8 15 15 8 15 8 17 15 17 15 24 17 24 17 17 24 17 24 15z\"\n ></path>\n </svg>\n </button>\n <div class=\"cds--number__rule-divider\"></div>\n </div>\n </div>\n <div *ngIf=\"helperText && !invalid && !warn\" class=\"cds--form__helper-text\">\n <ng-container *ngIf=\"!isTemplate(helperText)\">{{\n helperText\n }}</ng-container>\n <ng-template\n *ngIf=\"isTemplate(helperText)\"\n [ngTemplateOutlet]=\"helperText\"\n ></ng-template>\n </div>\n <div *ngIf=\"!warn && invalid\" class=\"cds--form-requirement\">\n <ng-container *ngIf=\"!isTemplate(invalidText)\">{{\n invalidText\n }}</ng-container>\n <ng-template\n *ngIf=\"isTemplate(invalidText)\"\n [ngTemplateOutlet]=\"invalidText\"\n ></ng-template>\n </div>\n <div *ngIf=\"!invalid && warn\" class=\"cds--form-requirement\">\n <ng-container *ngIf=\"!isTemplate(warnText)\">{{ warnText }}</ng-container>\n <ng-template\n *ngIf=\"isTemplate(warnText)\"\n [ngTemplateOutlet]=\"warnText\"\n ></ng-template>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NumberInputDirective, selector: "[ofeNumberScroll]" }] }); }
2745
+ ], ngImport: i0, template: "<div\n data-numberinput\n [attr.data-invalid]=\"invalid ? true : null\"\n class=\"cds--number\"\n [ngClass]=\"{\n 'cds--number--light': theme === 'light',\n 'cds--number--nolabel': !label,\n 'cds--number--helpertext': helperText,\n 'cds--skeleton': skeleton,\n 'cds--number--sm': size === 'sm',\n 'cds--number--md': size === 'md',\n 'cds--number--lg': size === 'lg'\n }\"\n>\n <div\n class=\"cds--number__input-wrapper\"\n [ngClass]=\"{\n 'cds--number__input-wrapper--warning': warn\n }\"\n >\n <input\n ofeNumberScroll\n type=\"number\"\n [id]=\"id\"\n [value]=\"value\"\n [attr.min]=\"min\"\n [attr.max]=\"max\"\n [attr.maxlength]=\"maxlength\"\n [attr.minlength]=\"minlength\"\n [attr.step]=\"step\"\n [disabled]=\"disabled\"\n [required]=\"required\"\n [attr.data-invalid]=\"invalid ? invalid : null\"\n [placeholder]=\"placeholder\"\n (input)=\"onNumberInputChange($event)\"\n />\n <svg\n *ngIf=\"!skeleton && !warn && invalid\"\n cdsIcon=\"warning--filled\"\n size=\"16\"\n class=\"cds--number__invalid\"\n ></svg>\n <svg\n *ngIf=\"!skeleton && !invalid && warn\"\n cdsIcon=\"warning--alt--filled\"\n size=\"16\"\n class=\"cds--number__invalid cds--number__invalid--warning\"\n ></svg>\n <div class=\"cds--number__controls\">\n <button\n type=\"button\"\n class=\"cds--number__control-btn down-icon\"\n (click)=\"onDecrement()\"\n title=\"Decrement number\"\n [attr.aria-label]=\"decrementLabel\"\n tabindex=\"-1\"\n >\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 32 32\"\n aria-hidden=\"true\"\n class=\"down-icon\"\n >\n <path d=\"M8 15H24V17H8z\"></path>\n </svg>\n </button>\n <div class=\"cds--number__rule-divider\"></div>\n <button\n type=\"button\"\n class=\"cds--number__control-btn up-icon\"\n (click)=\"onIncrement()\"\n title=\"Increment number\"\n [attr.aria-label]=\"incrementLabel\"\n tabindex=\"-1\"\n >\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 32 32\"\n aria-hidden=\"true\"\n class=\"up-icon\"\n >\n <path\n d=\"M17 15L17 8 15 8 15 15 8 15 8 17 15 17 15 24 17 24 17 17 24 17 24 15z\"\n ></path>\n </svg>\n </button>\n <div class=\"cds--number__rule-divider\"></div>\n </div>\n </div>\n <div *ngIf=\"helperText && !invalid && !warn\" class=\"cds--form__helper-text\">\n <ng-container *ngIf=\"!isTemplate(helperText)\">{{\n helperText\n }}</ng-container>\n <ng-template\n *ngIf=\"isTemplate(helperText)\"\n [ngTemplateOutlet]=\"helperText\"\n ></ng-template>\n </div>\n <div *ngIf=\"!warn && invalid\" class=\"cds--form-requirement\">\n <ng-container *ngIf=\"!isTemplate(invalidText)\">{{\n invalidText\n }}</ng-container>\n <ng-template\n *ngIf=\"isTemplate(invalidText)\"\n [ngTemplateOutlet]=\"invalidText\"\n ></ng-template>\n </div>\n <div *ngIf=\"!invalid && warn\" class=\"cds--form-requirement\">\n <ng-container *ngIf=\"!isTemplate(warnText)\">{{ warnText }}</ng-container>\n <ng-template\n *ngIf=\"isTemplate(warnText)\"\n [ngTemplateOutlet]=\"warnText\"\n ></ng-template>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NumberInputDirective, selector: "[ofeNumberScroll]" }] }); }
2742
2746
  }
2743
2747
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NumberInputComponent, decorators: [{
2744
2748
  type: Component,
@@ -2748,7 +2752,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
2748
2752
  useExisting: forwardRef(() => NumberInputComponent),
2749
2753
  multi: true
2750
2754
  }
2751
- ], template: "<div\n data-numberinput\n [attr.data-invalid]=\"invalid ? true : null\"\n class=\"cds--number\"\n [ngClass]=\"{\n 'cds--number--light': theme === 'light',\n 'cds--number--nolabel': !label,\n 'cds--number--helpertext': helperText,\n 'cds--skeleton': skeleton,\n 'cds--number--sm': size === 'sm',\n 'cds--number--xl': size === 'xl'\n }\"\n>\n <div\n class=\"cds--number__input-wrapper\"\n [ngClass]=\"{\n 'cds--number__input-wrapper--warning': warn\n }\"\n >\n <input\n type=\"number\"\n [id]=\"id\"\n ofeNumberScroll\n [value]=\"value\"\n [attr.min]=\"min\"\n [attr.max]=\"max\"\n [attr.maxlength]=\"maxlength\"\n [attr.minlength]=\"minlength\"\n [attr.step]=\"step\"\n [disabled]=\"disabled\"\n [required]=\"required\"\n (input)=\"onNumberInputChange($event)\"\n />\n <div class=\"cds--number__controls\">\n <button\n type=\"button\"\n class=\"cds--number__control-btn down-icon\"\n (click)=\"onDecrement()\"\n title=\"Decrement number\"\n [attr.aria-label]=\"decrementLabel\"\n tabindex=\"-1\"\n >\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 32 32\"\n aria-hidden=\"true\"\n class=\"down-icon\"\n >\n <path d=\"M8 15H24V17H8z\"></path>\n </svg>\n </button>\n <div class=\"cds--number__rule-divider\"></div>\n <button\n type=\"button\"\n class=\"cds--number__control-btn up-icon\"\n (click)=\"onIncrement()\"\n title=\"Increment number\"\n [attr.aria-label]=\"incrementLabel\"\n tabindex=\"-1\"\n >\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 32 32\"\n aria-hidden=\"true\"\n class=\"up-icon\"\n >\n <path\n d=\"M17 15L17 8 15 8 15 15 8 15 8 17 15 17 15 24 17 24 17 17 24 17 24 15z\"\n ></path>\n </svg>\n </button>\n <div class=\"cds--number__rule-divider\"></div>\n </div>\n </div>\n <div *ngIf=\"helperText && !invalid && !warn\" class=\"cds--form__helper-text\">\n <ng-container *ngIf=\"!isTemplate(helperText)\">{{\n helperText\n }}</ng-container>\n <ng-template\n *ngIf=\"isTemplate(helperText)\"\n [ngTemplateOutlet]=\"helperText\"\n ></ng-template>\n </div>\n <div *ngIf=\"!warn && invalid\" class=\"cds--form-requirement\">\n <ng-container *ngIf=\"!isTemplate(invalidText)\">{{\n invalidText\n }}</ng-container>\n <ng-template\n *ngIf=\"isTemplate(invalidText)\"\n [ngTemplateOutlet]=\"invalidText\"\n ></ng-template>\n </div>\n <div *ngIf=\"!invalid && warn\" class=\"cds--form-requirement\">\n <ng-container *ngIf=\"!isTemplate(warnText)\">{{ warnText }}</ng-container>\n <ng-template\n *ngIf=\"isTemplate(warnText)\"\n [ngTemplateOutlet]=\"warnText\"\n ></ng-template>\n </div>\n</div>\n" }]
2755
+ ], template: "<div\n data-numberinput\n [attr.data-invalid]=\"invalid ? true : null\"\n class=\"cds--number\"\n [ngClass]=\"{\n 'cds--number--light': theme === 'light',\n 'cds--number--nolabel': !label,\n 'cds--number--helpertext': helperText,\n 'cds--skeleton': skeleton,\n 'cds--number--sm': size === 'sm',\n 'cds--number--md': size === 'md',\n 'cds--number--lg': size === 'lg'\n }\"\n>\n <div\n class=\"cds--number__input-wrapper\"\n [ngClass]=\"{\n 'cds--number__input-wrapper--warning': warn\n }\"\n >\n <input\n ofeNumberScroll\n type=\"number\"\n [id]=\"id\"\n [value]=\"value\"\n [attr.min]=\"min\"\n [attr.max]=\"max\"\n [attr.maxlength]=\"maxlength\"\n [attr.minlength]=\"minlength\"\n [attr.step]=\"step\"\n [disabled]=\"disabled\"\n [required]=\"required\"\n [attr.data-invalid]=\"invalid ? invalid : null\"\n [placeholder]=\"placeholder\"\n (input)=\"onNumberInputChange($event)\"\n />\n <svg\n *ngIf=\"!skeleton && !warn && invalid\"\n cdsIcon=\"warning--filled\"\n size=\"16\"\n class=\"cds--number__invalid\"\n ></svg>\n <svg\n *ngIf=\"!skeleton && !invalid && warn\"\n cdsIcon=\"warning--alt--filled\"\n size=\"16\"\n class=\"cds--number__invalid cds--number__invalid--warning\"\n ></svg>\n <div class=\"cds--number__controls\">\n <button\n type=\"button\"\n class=\"cds--number__control-btn down-icon\"\n (click)=\"onDecrement()\"\n title=\"Decrement number\"\n [attr.aria-label]=\"decrementLabel\"\n tabindex=\"-1\"\n >\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 32 32\"\n aria-hidden=\"true\"\n class=\"down-icon\"\n >\n <path d=\"M8 15H24V17H8z\"></path>\n </svg>\n </button>\n <div class=\"cds--number__rule-divider\"></div>\n <button\n type=\"button\"\n class=\"cds--number__control-btn up-icon\"\n (click)=\"onIncrement()\"\n title=\"Increment number\"\n [attr.aria-label]=\"incrementLabel\"\n tabindex=\"-1\"\n >\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 32 32\"\n aria-hidden=\"true\"\n class=\"up-icon\"\n >\n <path\n d=\"M17 15L17 8 15 8 15 15 8 15 8 17 15 17 15 24 17 24 17 17 24 17 24 15z\"\n ></path>\n </svg>\n </button>\n <div class=\"cds--number__rule-divider\"></div>\n </div>\n </div>\n <div *ngIf=\"helperText && !invalid && !warn\" class=\"cds--form__helper-text\">\n <ng-container *ngIf=\"!isTemplate(helperText)\">{{\n helperText\n }}</ng-container>\n <ng-template\n *ngIf=\"isTemplate(helperText)\"\n [ngTemplateOutlet]=\"helperText\"\n ></ng-template>\n </div>\n <div *ngIf=\"!warn && invalid\" class=\"cds--form-requirement\">\n <ng-container *ngIf=\"!isTemplate(invalidText)\">{{\n invalidText\n }}</ng-container>\n <ng-template\n *ngIf=\"isTemplate(invalidText)\"\n [ngTemplateOutlet]=\"invalidText\"\n ></ng-template>\n </div>\n <div *ngIf=\"!invalid && warn\" class=\"cds--form-requirement\">\n <ng-container *ngIf=\"!isTemplate(warnText)\">{{ warnText }}</ng-container>\n <ng-template\n *ngIf=\"isTemplate(warnText)\"\n [ngTemplateOutlet]=\"warnText\"\n ></ng-template>\n </div>\n</div>\n" }]
2752
2756
  }], ctorParameters: function () { return []; }, propDecorators: { theme: [{
2753
2757
  type: Input
2754
2758
  }], disabled: [{
@@ -2759,6 +2763,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
2759
2763
  type: Input
2760
2764
  }], id: [{
2761
2765
  type: Input
2766
+ }], placeholder: [{
2767
+ type: Input
2762
2768
  }], size: [{
2763
2769
  type: Input
2764
2770
  }], required: [{
@@ -2940,18 +2946,20 @@ class RemoteSelectComponent {
2940
2946
  this.subscribeToDataSourceDataChanges();
2941
2947
  }
2942
2948
  }
2943
- constructor(renderer) {
2949
+ constructor(renderer, translate) {
2944
2950
  this.renderer = renderer;
2951
+ this.translate = translate;
2945
2952
  this.remoteOptionsLoading = false;
2946
2953
  this.remoteOptionInput$ = new Subject();
2947
2954
  this.items = [];
2948
2955
  this.value = [];
2949
2956
  this.loading = false;
2950
2957
  this.searchText = '';
2951
- this.notFoundMsg = 'match no found';
2952
- this.placeholder = 'Search...';
2958
+ this.notFoundMsg = this.translate.instant('matchNotFound');
2959
+ this.placeholder = this.translate.instant('search');
2953
2960
  this.disabled = false;
2954
2961
  this.theme = 'dark';
2962
+ this.invalid = 'false';
2955
2963
  this.done = new EventEmitter();
2956
2964
  this.compareItems = (item, selected) => {
2957
2965
  if (item.value && selected.value) {
@@ -2974,7 +2982,7 @@ class RemoteSelectComponent {
2974
2982
  this.notFoundMsg = '';
2975
2983
  }
2976
2984
  else {
2977
- this.notFoundMsg = 'Not found';
2985
+ this.notFoundMsg = 'Match not found';
2978
2986
  this.items = [];
2979
2987
  }
2980
2988
  });
@@ -3021,14 +3029,14 @@ class RemoteSelectComponent {
3021
3029
  }), switchMap((term) => this.dataSource.searchOptions(term).pipe(catchError(() => of([])), // empty list on error
3022
3030
  tap(() => (this.loading = false))))));
3023
3031
  }
3024
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RemoteSelectComponent, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
3025
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: RemoteSelectComponent, selector: "ofe-remote-select", inputs: { placeholder: "placeholder", componentID: "componentID", disabled: "disabled", theme: "theme", dataSource: "dataSource" }, outputs: { done: "done" }, providers: [
3032
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RemoteSelectComponent, deps: [{ token: i0.Renderer2 }, { token: i1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
3033
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: RemoteSelectComponent, selector: "ofe-remote-select", inputs: { placeholder: "placeholder", componentID: "componentID", disabled: "disabled", theme: "theme", invalid: "invalid", dataSource: "dataSource" }, outputs: { done: "done" }, providers: [
3026
3034
  {
3027
3035
  provide: NG_VALUE_ACCESSOR,
3028
3036
  useExisting: forwardRef(() => RemoteSelectComponent),
3029
3037
  multi: true
3030
3038
  }
3031
- ], ngImport: i0, template: "<div>\n <ng-select\n [ngClass]=\"{ 'afe-custom': theme === 'light' }\"\n [disabled]=\"disabled\"\n [items]=\"remoteOptions$ | async\"\n bindLabel=\"label\"\n bindValue=\"value\"\n [multiple]=\"false\"\n [hideSelected]=\"true\"\n [compareWith]=\"compareItems\"\n [trackByFn]=\"trackByFn\"\n [loading]=\"loading\"\n typeToSearchText=\"{{ 'enterMoreCharacters' | translate }}\"\n [typeahead]=\"remoteOptionInput$\"\n [(ngModel)]=\"selectedRemoteOptions\"\n [appendTo]=\"'form'\"\n (ngModelChange)=\"selected($event)\"\n >\n </ng-select>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i8.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] }); }
3039
+ ], ngImport: i0, template: "<ng-select\n [ngClass]=\"{\n 'afe-custom': theme === 'light',\n 'invalid': invalid ? true : null,\n }\"\n [disabled]=\"disabled\"\n [items]=\"remoteOptions$ | async\"\n bindLabel=\"label\"\n bindValue=\"value\"\n [multiple]=\"false\"\n [hideSelected]=\"true\"\n [compareWith]=\"compareItems\"\n [trackByFn]=\"trackByFn\"\n [loading]=\"loading\"\n typeToSearchText=\"{{ 'enterMoreCharacters' | translate }}\"\n [typeahead]=\"remoteOptionInput$\"\n [(ngModel)]=\"selectedRemoteOptions\"\n [appendTo]=\"'form'\"\n (ngModelChange)=\"selected($event)\"\n>\n</ng-select>\n", dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i8.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] }); }
3032
3040
  }
3033
3041
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RemoteSelectComponent, decorators: [{
3034
3042
  type: Component,
@@ -3038,8 +3046,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
3038
3046
  useExisting: forwardRef(() => RemoteSelectComponent),
3039
3047
  multi: true
3040
3048
  }
3041
- ], template: "<div>\n <ng-select\n [ngClass]=\"{ 'afe-custom': theme === 'light' }\"\n [disabled]=\"disabled\"\n [items]=\"remoteOptions$ | async\"\n bindLabel=\"label\"\n bindValue=\"value\"\n [multiple]=\"false\"\n [hideSelected]=\"true\"\n [compareWith]=\"compareItems\"\n [trackByFn]=\"trackByFn\"\n [loading]=\"loading\"\n typeToSearchText=\"{{ 'enterMoreCharacters' | translate }}\"\n [typeahead]=\"remoteOptionInput$\"\n [(ngModel)]=\"selectedRemoteOptions\"\n [appendTo]=\"'form'\"\n (ngModelChange)=\"selected($event)\"\n >\n </ng-select>\n</div>\n" }]
3042
- }], ctorParameters: function () { return [{ type: i0.Renderer2 }]; }, propDecorators: { placeholder: [{
3049
+ ], template: "<ng-select\n [ngClass]=\"{\n 'afe-custom': theme === 'light',\n 'invalid': invalid ? true : null,\n }\"\n [disabled]=\"disabled\"\n [items]=\"remoteOptions$ | async\"\n bindLabel=\"label\"\n bindValue=\"value\"\n [multiple]=\"false\"\n [hideSelected]=\"true\"\n [compareWith]=\"compareItems\"\n [trackByFn]=\"trackByFn\"\n [loading]=\"loading\"\n typeToSearchText=\"{{ 'enterMoreCharacters' | translate }}\"\n [typeahead]=\"remoteOptionInput$\"\n [(ngModel)]=\"selectedRemoteOptions\"\n [appendTo]=\"'form'\"\n (ngModelChange)=\"selected($event)\"\n>\n</ng-select>\n" }]
3050
+ }], ctorParameters: function () { return [{ type: i0.Renderer2 }, { type: i1.TranslateService }]; }, propDecorators: { placeholder: [{
3043
3051
  type: Input
3044
3052
  }], componentID: [{
3045
3053
  type: Input
@@ -3047,6 +3055,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
3047
3055
  type: Input
3048
3056
  }], theme: [{
3049
3057
  type: Input
3058
+ }], invalid: [{
3059
+ type: Input
3050
3060
  }], done: [{
3051
3061
  type: Output
3052
3062
  }], dataSource: [{
@@ -3138,7 +3148,7 @@ class SecurePipe {
3138
3148
  this._ref.markForCheck();
3139
3149
  }
3140
3150
  }
3141
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SecurePipe, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe }); }
3151
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SecurePipe, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$2.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe }); }
3142
3152
  static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: SecurePipe, name: "secure", pure: false }); }
3143
3153
  }
3144
3154
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SecurePipe, decorators: [{
@@ -3147,7 +3157,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
3147
3157
  name: 'secure',
3148
3158
  pure: false
3149
3159
  }]
3150
- }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1$1.DomSanitizer }]; } });
3160
+ }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1$2.DomSanitizer }]; } });
3151
3161
 
3152
3162
  class FileUploadComponent {
3153
3163
  get dataSource() {
@@ -3236,7 +3246,7 @@ class FileUploadComponent {
3236
3246
  useExisting: forwardRef(() => FileUploadComponent),
3237
3247
  multi: true
3238
3248
  }
3239
- ], ngImport: i0, template: "<lib-ngx-file-uploader\n [srcUrl]=\"pdfUrl\"\n [formEntry]=\"formEntryMode\"\n [(ngModel)]=\"fileUuid\"\n (_onClear)=\"clearValue()\"\n (uploadData)=\"onFileChange($event)\"\n>\n</lib-ngx-file-uploader>\n<div *ngIf=\"fileUuid\">\n <img\n *ngIf=\"!pdfUploaded\"\n class=\"img-responsive\"\n [src]=\"fileUuid | secure: this.dataSource.fetchFile\"\n alt=\"\"\n />\n</div>\n", styles: ["img{margin-left:auto;margin-right:auto;display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.NgxFileUploaderComponent, selector: "lib-ngx-file-uploader", inputs: ["singleFile", "formEntry", "srcUrl", "source"], outputs: ["fileChanged", "uploadData", "_onClear"] }, { kind: "pipe", type: SecurePipe, name: "secure" }] }); }
3249
+ ], ngImport: i0, template: "<lib-ngx-file-uploader\n [srcUrl]=\"pdfUrl\"\n [formEntry]=\"formEntryMode\"\n [(ngModel)]=\"fileUuid\"\n (_onClear)=\"clearValue()\"\n (uploadData)=\"onFileChange($event)\"\n>\n</lib-ngx-file-uploader>\n<div *ngIf=\"fileUuid\">\n <img\n *ngIf=\"!pdfUploaded\"\n class=\"img-responsive\"\n [src]=\"fileUuid | secure: this.dataSource.fetchFile\"\n alt=\"\"\n />\n</div>\n", styles: ["img{margin-left:auto;margin-right:auto;display:block}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.NgxFileUploaderComponent, selector: "lib-ngx-file-uploader", inputs: ["singleFile", "formEntry", "srcUrl", "source"], outputs: ["fileChanged", "uploadData", "_onClear"] }, { kind: "pipe", type: SecurePipe, name: "secure" }] }); }
3240
3250
  }
3241
3251
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FileUploadComponent, decorators: [{
3242
3252
  type: Component,
@@ -3338,7 +3348,7 @@ class CheckboxControlComponent {
3338
3348
  useExisting: forwardRef(() => CheckboxControlComponent),
3339
3349
  multi: true
3340
3350
  }
3341
- ], ngImport: i0, template: "<fieldset class=\"cds--fieldset\">\n <div\n class=\"cds--form-item cds--checkbox-wrapper\"\n *ngFor=\"let option of options; let i = index\"\n >\n <input\n type=\"checkbox\"\n class=\"cds--checkbox\"\n [id]=\"i + id\"\n [checked]=\"option.checked\"\n (change)=\"selectOpt(option, $event)\"\n [value]=\"option.value\"\n [disabled]=\"option.isDisabled\"\n />\n <label [for]=\"i + id\" class=\"cds--checkbox-label\">\n <span class=\"cds--checkbox-label-text\">{{ option.label }}</span>\n </label>\n </div>\n</fieldset>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] }); }
3351
+ ], ngImport: i0, template: "<fieldset class=\"cds--fieldset\">\n <div\n class=\"cds--form-item cds--checkbox-wrapper\"\n *ngFor=\"let option of options; let i = index\"\n >\n <input\n type=\"checkbox\"\n class=\"cds--checkbox\"\n [id]=\"i + id\"\n [checked]=\"option.checked\"\n (change)=\"selectOpt(option, $event)\"\n [value]=\"option.value\"\n [disabled]=\"option.isDisabled\"\n />\n <label [for]=\"i + id\" class=\"cds--checkbox-label\">\n <span class=\"cds--checkbox-label-text\">{{ option.label }}</span>\n </label>\n </div>\n</fieldset>\n", dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] }); }
3342
3352
  }
3343
3353
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CheckboxControlComponent, decorators: [{
3344
3354
  type: Component,
@@ -3426,7 +3436,7 @@ class RadioButtonControlComponent {
3426
3436
  useExisting: forwardRef(() => RadioButtonControlComponent),
3427
3437
  multi: true
3428
3438
  }
3429
- ], usesOnChanges: true, ngImport: i0, template: "<fieldset class=\"cds--fieldset\">\n <div\n *ngFor=\"let option of options; let i = index\"\n class=\"cds--form-item cds--radio-wrapper\"\n [ngClass]=\"{ inline: orientation === 'horizontal' }\"\n >\n <label class=\"form-control no-border\">\n <input\n type=\"radio\"\n [id]=\"id + '_' + i\"\n [name]=\"id\"\n [checked]=\"option.checked\"\n [value]=\"option.value\"\n (click)=\"handleClick(option)\"\n (change)=\"handleChange(option)\"\n />\n {{ option.label }}\n </label>\n </div>\n</fieldset>\n", styles: [".inline{display:inline-block;padding-right:.5rem}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] }); }
3439
+ ], usesOnChanges: true, ngImport: i0, template: "<fieldset class=\"cds--fieldset\">\n <div\n *ngFor=\"let option of options; let i = index\"\n class=\"cds--form-item cds--radio-wrapper\"\n [ngClass]=\"{ inline: orientation === 'horizontal' }\"\n >\n <label class=\"form-control no-border\">\n <input\n type=\"radio\"\n [id]=\"id + '_' + i\"\n [name]=\"id\"\n [checked]=\"option.checked\"\n [value]=\"option.value\"\n (click)=\"handleClick(option)\"\n (change)=\"handleChange(option)\"\n />\n {{ option.label }}\n </label>\n </div>\n</fieldset>\n", styles: [".inline{display:inline-block;padding-right:.5rem}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] }); }
3430
3440
  }
3431
3441
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: RadioButtonControlComponent, decorators: [{
3432
3442
  type: Component,
@@ -3455,7 +3465,7 @@ class WorkspaceLauncherComponent {
3455
3465
  window['_openmrs_esm_patient_common_lib'].launchPatientWorkspace(this.workspaceName);
3456
3466
  }
3457
3467
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: WorkspaceLauncherComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
3458
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: WorkspaceLauncherComponent, selector: "ofe-workspace-launcher", inputs: { id: "id", buttonLabel: "buttonLabel", buttonType: "buttonType", workspaceName: "workspaceName" }, ngImport: i0, template: "<fieldset class=\"cds--fieldset\">\n <div class=\"cds--form-item\">\n <button\n type=\"button\"\n class=\"cds--btn\"\n [ngClass]=\"'cds--btn--' + buttonType\"\n [id]=\"id\"\n (click)=\"handleClick()\"\n >\n {{ buttonLabel }}\n </button>\n </div>\n</fieldset>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
3468
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: WorkspaceLauncherComponent, selector: "ofe-workspace-launcher", inputs: { id: "id", buttonLabel: "buttonLabel", buttonType: "buttonType", workspaceName: "workspaceName" }, ngImport: i0, template: "<fieldset class=\"cds--fieldset\">\n <div class=\"cds--form-item\">\n <button\n type=\"button\"\n class=\"cds--btn\"\n [ngClass]=\"'cds--btn--' + buttonType\"\n [id]=\"id\"\n (click)=\"handleClick()\"\n >\n {{ buttonLabel }}\n </button>\n </div>\n</fieldset>\n", dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
3459
3469
  }
3460
3470
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: WorkspaceLauncherComponent, decorators: [{
3461
3471
  type: Component,
@@ -3634,13 +3644,13 @@ class OwlDateTimeIntl {
3634
3644
  /** A label for the hour12 button (PM) */
3635
3645
  this.hour12PMLabel = 'PM';
3636
3646
  }
3637
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OwlDateTimeIntl, deps: [{ token: i4.TranslateService }], target: i0.ɵɵFactoryTarget.Injectable }); }
3647
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OwlDateTimeIntl, deps: [{ token: i1.TranslateService }], target: i0.ɵɵFactoryTarget.Injectable }); }
3638
3648
  static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OwlDateTimeIntl, providedIn: 'root' }); }
3639
3649
  }
3640
3650
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OwlDateTimeIntl, decorators: [{
3641
3651
  type: Injectable,
3642
3652
  args: [{ providedIn: 'root' }]
3643
- }], ctorParameters: function () { return [{ type: i4.TranslateService }]; } });
3653
+ }], ctorParameters: function () { return [{ type: i1.TranslateService }]; } });
3644
3654
 
3645
3655
  /**
3646
3656
  * date-time-format.class
@@ -3760,7 +3770,7 @@ class OwlCalendarBodyComponent {
3760
3770
  });
3761
3771
  }
3762
3772
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OwlCalendarBodyComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
3763
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: OwlCalendarBodyComponent, selector: "[ofe-owl-date-time-calendar-body]", inputs: { activeCell: "activeCell", rows: "rows", numCols: "numCols", cellRatio: "cellRatio", todayValue: "todayValue", selectedValues: "selectedValues", selectMode: "selectMode" }, outputs: { cellSelected: "cellSelected" }, host: { properties: { "class.owl-dt-calendar-body": "this.owlDTCalendarBodyClass" } }, exportAs: ["owlDateTimeCalendarBody"], ngImport: i0, template: "<tr *ngFor=\"let row of rows; let rowIndex = index\" role=\"row\">\n <td\n *ngFor=\"let item of row; let colIndex = index\"\n class=\"owl-dt-calendar-cell {{ item.cellClass }}\"\n [tabindex]=\"isActiveCell(rowIndex, colIndex) ? 0 : -1\"\n [class.owl-dt-calendar-cell-active]=\"isActiveCell(rowIndex, colIndex)\"\n [class.owl-dt-calendar-cell-disabled]=\"!item.enabled\"\n [class.owl-dt-calendar-cell-in-range]=\"isInRange(item.value)\"\n [class.owl-dt-calendar-cell-range-from]=\"isRangeFrom(item.value)\"\n [class.owl-dt-calendar-cell-range-to]=\"isRangeTo(item.value)\"\n [attr.aria-label]=\"item.ariaLabel\"\n [attr.aria-disabled]=\"!item.enabled || null\"\n [style.width.%]=\"100 / numCols\"\n [style.paddingTop.%]=\"(50 * cellRatio) / numCols\"\n [style.paddingBottom.%]=\"(50 * cellRatio) / numCols\"\n (click)=\"selectCell(item)\"\n >\n <span\n class=\"owl-dt-calendar-cell-content\"\n [ngClass]=\"{\n 'owl-dt-calendar-cell-out': item.out,\n 'owl-dt-calendar-cell-today': item.value === todayValue,\n 'owl-dt-calendar-cell-selected': isSelected(item.value)\n }\"\n >\n {{ item.displayValue }}\n </span>\n </td>\n</tr>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
3773
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: OwlCalendarBodyComponent, selector: "[ofe-owl-date-time-calendar-body]", inputs: { activeCell: "activeCell", rows: "rows", numCols: "numCols", cellRatio: "cellRatio", todayValue: "todayValue", selectedValues: "selectedValues", selectMode: "selectMode" }, outputs: { cellSelected: "cellSelected" }, host: { properties: { "class.owl-dt-calendar-body": "this.owlDTCalendarBodyClass" } }, exportAs: ["owlDateTimeCalendarBody"], ngImport: i0, template: "<tr *ngFor=\"let row of rows; let rowIndex = index\" role=\"row\">\n <td\n *ngFor=\"let item of row; let colIndex = index\"\n class=\"owl-dt-calendar-cell {{ item.cellClass }}\"\n [tabindex]=\"isActiveCell(rowIndex, colIndex) ? 0 : -1\"\n [class.owl-dt-calendar-cell-active]=\"isActiveCell(rowIndex, colIndex)\"\n [class.owl-dt-calendar-cell-disabled]=\"!item.enabled\"\n [class.owl-dt-calendar-cell-in-range]=\"isInRange(item.value)\"\n [class.owl-dt-calendar-cell-range-from]=\"isRangeFrom(item.value)\"\n [class.owl-dt-calendar-cell-range-to]=\"isRangeTo(item.value)\"\n [attr.aria-label]=\"item.ariaLabel\"\n [attr.aria-disabled]=\"!item.enabled || null\"\n [style.width.%]=\"100 / numCols\"\n [style.paddingTop.%]=\"(50 * cellRatio) / numCols\"\n [style.paddingBottom.%]=\"(50 * cellRatio) / numCols\"\n (click)=\"selectCell(item)\"\n >\n <span\n class=\"owl-dt-calendar-cell-content\"\n [ngClass]=\"{\n 'owl-dt-calendar-cell-out': item.out,\n 'owl-dt-calendar-cell-today': item.value === todayValue,\n 'owl-dt-calendar-cell-selected': isSelected(item.value)\n }\"\n >\n {{ item.displayValue }}\n </span>\n </td>\n</tr>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
3764
3774
  }
3765
3775
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OwlCalendarBodyComponent, decorators: [{
3766
3776
  type: Component,
@@ -4892,7 +4902,7 @@ class OwlMonthViewComponent {
4892
4902
  this.calendarBodyElm.focusActiveCell();
4893
4903
  }
4894
4904
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OwlMonthViewComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: DateTimeAdapter, optional: true }, { token: OWL_DATE_TIME_FORMATS, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
4895
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: OwlMonthViewComponent, selector: "ofe-owl-date-time-month-view", inputs: { hideOtherMonths: "hideOtherMonths", firstDayOfWeek: "firstDayOfWeek", selectMode: "selectMode", selected: "selected", selecteds: "selecteds", pickerMoment: "pickerMoment", dateFilter: "dateFilter", minDate: "minDate", maxDate: "maxDate" }, outputs: { selectedChange: "selectedChange", userSelection: "userSelection", pickerMomentChange: "pickerMomentChange" }, host: { properties: { "class.owl-dt-calendar-view": "this.owlDTCalendarView" } }, viewQueries: [{ propertyName: "calendarBodyElm", first: true, predicate: OwlCalendarBodyComponent, descendants: true, static: true }], exportAs: ["owlYearView"], ngImport: i0, template: "<table\n class=\"owl-dt-calendar-table owl-dt-calendar-month-table\"\n [class.owl-dt-calendar-only-current-month]=\"hideOtherMonths\"\n>\n <thead class=\"owl-dt-calendar-header\">\n <tr class=\"owl-dt-weekdays\">\n <th\n *ngFor=\"let weekday of weekdays\"\n [attr.aria-label]=\"weekday.long\"\n class=\"owl-dt-weekday\"\n scope=\"col\"\n >\n <span>{{ weekday.short }}</span>\n </th>\n </tr>\n <tr>\n <th\n class=\"owl-dt-calendar-table-divider\"\n aria-hidden=\"true\"\n colspan=\"7\"\n ></th>\n </tr>\n </thead>\n <tbody\n ofe-owl-date-time-calendar-body\n role=\"grid\"\n [rows]=\"days\"\n [todayValue]=\"todayDate\"\n [selectedValues]=\"selectedDates\"\n [selectMode]=\"selectMode\"\n [activeCell]=\"activeCell\"\n (keydown)=\"handleCalendarKeydown($event)\"\n (cellSelected)=\"selectCalendarCell($event)\"\n ></tbody>\n</table>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: OwlCalendarBodyComponent, selector: "[ofe-owl-date-time-calendar-body]", inputs: ["activeCell", "rows", "numCols", "cellRatio", "todayValue", "selectedValues", "selectMode"], outputs: ["cellSelected"], exportAs: ["owlDateTimeCalendarBody"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
4905
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: OwlMonthViewComponent, selector: "ofe-owl-date-time-month-view", inputs: { hideOtherMonths: "hideOtherMonths", firstDayOfWeek: "firstDayOfWeek", selectMode: "selectMode", selected: "selected", selecteds: "selecteds", pickerMoment: "pickerMoment", dateFilter: "dateFilter", minDate: "minDate", maxDate: "maxDate" }, outputs: { selectedChange: "selectedChange", userSelection: "userSelection", pickerMomentChange: "pickerMomentChange" }, host: { properties: { "class.owl-dt-calendar-view": "this.owlDTCalendarView" } }, viewQueries: [{ propertyName: "calendarBodyElm", first: true, predicate: OwlCalendarBodyComponent, descendants: true, static: true }], exportAs: ["owlYearView"], ngImport: i0, template: "<table\n class=\"owl-dt-calendar-table owl-dt-calendar-month-table\"\n [class.owl-dt-calendar-only-current-month]=\"hideOtherMonths\"\n>\n <thead class=\"owl-dt-calendar-header\">\n <tr class=\"owl-dt-weekdays\">\n <th\n *ngFor=\"let weekday of weekdays\"\n [attr.aria-label]=\"weekday.long\"\n class=\"owl-dt-weekday\"\n scope=\"col\"\n >\n <span>{{ weekday.short }}</span>\n </th>\n </tr>\n <tr>\n <th\n class=\"owl-dt-calendar-table-divider\"\n aria-hidden=\"true\"\n colspan=\"7\"\n ></th>\n </tr>\n </thead>\n <tbody\n ofe-owl-date-time-calendar-body\n role=\"grid\"\n [rows]=\"days\"\n [todayValue]=\"todayDate\"\n [selectedValues]=\"selectedDates\"\n [selectMode]=\"selectMode\"\n [activeCell]=\"activeCell\"\n (keydown)=\"handleCalendarKeydown($event)\"\n (cellSelected)=\"selectCalendarCell($event)\"\n ></tbody>\n</table>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: OwlCalendarBodyComponent, selector: "[ofe-owl-date-time-calendar-body]", inputs: ["activeCell", "rows", "numCols", "cellRatio", "todayValue", "selectedValues", "selectMode"], outputs: ["cellSelected"], exportAs: ["owlDateTimeCalendarBody"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
4896
4906
  }
4897
4907
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OwlMonthViewComponent, decorators: [{
4898
4908
  type: Component,
@@ -5217,7 +5227,7 @@ class OwlCalendarComponent {
5217
5227
  : null;
5218
5228
  }
5219
5229
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OwlCalendarComponent, deps: [{ token: i0.ElementRef }, { token: OwlDateTimeIntl }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: DateTimeAdapter, optional: true }, { token: OWL_DATE_TIME_FORMATS, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
5220
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: OwlCalendarComponent, selector: "ofe-owl-date-time-calendar", inputs: { minDate: "minDate", maxDate: "maxDate", pickerMoment: "pickerMoment", selected: "selected", selecteds: "selecteds", dateFilter: "dateFilter", firstDayOfWeek: "firstDayOfWeek", selectMode: "selectMode", startView: "startView", hideOtherMonths: "hideOtherMonths" }, outputs: { pickerMomentChange: "pickerMomentChange", selectedChange: "selectedChange", userSelection: "userSelection", yearSelected: "yearSelected", monthSelected: "monthSelected" }, host: { properties: { "class.owl-dt-calendar": "this.owlDTCalendarClass" } }, exportAs: ["owlDateTimeCalendar"], ngImport: i0, template: "<div class=\"owl-dt-calendar-control\">\n <!-- focus when keyboard tab (http://kizu.ru/en/blog/keyboard-only-focus/#x) -->\n <button\n class=\"owl-dt-control owl-dt-control-button owl-dt-control-arrow-button\"\n type=\"button\"\n tabindex=\"0\"\n [style.visibility]=\"showControlArrows ? 'visible' : 'hidden'\"\n [disabled]=\"!prevButtonEnabled()\"\n [attr.aria-label]=\"prevButtonLabel\"\n (click)=\"previousClicked()\"\n >\n <span\n class=\"owl-dt-control-content owl-dt-control-button-content\"\n tabindex=\"-1\"\n >\n <!-- <editor-fold desc=\"SVG Arrow Left\"> -->\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n version=\"1.1\"\n x=\"0px\"\n y=\"0px\"\n viewBox=\"0 0 250.738 250.738\"\n style=\"enable-background: new 0 0 250.738 250.738\"\n xml:space=\"preserve\"\n width=\"100%\"\n height=\"100%\"\n >\n <path\n style=\"fill-rule: evenodd; clip-rule: evenodd\"\n d=\"M96.633,125.369l95.053-94.533c7.101-7.055,7.101-18.492,0-25.546 c-7.1-7.054-18.613-7.054-25.714,0L58.989,111.689c-3.784,3.759-5.487,8.759-5.238,13.68c-0.249,4.922,1.454,9.921,5.238,13.681 l106.983,106.398c7.101,7.055,18.613,7.055,25.714,0c7.101-7.054,7.101-18.491,0-25.544L96.633,125.369z\"\n />\n </svg>\n <!-- </editor-fold> -->\n </span>\n </button>\n <div class=\"owl-dt-calendar-control-content\">\n <button\n class=\"owl-dt-control owl-dt-control-button owl-dt-control-period-button\"\n type=\"button\"\n tabindex=\"0\"\n [attr.aria-label]=\"periodButtonLabel\"\n (click)=\"toggleViews()\"\n >\n <span\n class=\"owl-dt-control-content owl-dt-control-button-content\"\n tabindex=\"-1\"\n >\n {{ periodButtonText }}\n\n <span\n class=\"owl-dt-control-button-arrow\"\n [style.transform]=\"'rotate(' + (isMonthView ? 0 : 180) + 'deg)'\"\n >\n <!-- <editor-fold desc=\"SVG Arrow\"> -->\n <svg\n version=\"1.1\"\n xmlns=\"http://www.w3.org/2000/svg\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n x=\"0px\"\n y=\"0px\"\n width=\"50%\"\n height=\"50%\"\n viewBox=\"0 0 292.362 292.362\"\n style=\"enable-background: new 0 0 292.362 292.362\"\n xml:space=\"preserve\"\n >\n <g>\n <path\n d=\"M286.935,69.377c-3.614-3.617-7.898-5.424-12.848-5.424H18.274c-4.952,0-9.233,1.807-12.85,5.424\n C1.807,72.998,0,77.279,0,82.228c0,4.948,1.807,9.229,5.424,12.847l127.907,127.907c3.621,3.617,7.902,5.428,12.85,5.428\n s9.233-1.811,12.847-5.428L286.935,95.074c3.613-3.617,5.427-7.898,5.427-12.847C292.362,77.279,290.548,72.998,286.935,69.377z\"\n />\n </g>\n </svg>\n <!-- </editor-fold> -->\n </span>\n </span>\n </button>\n </div>\n <button\n class=\"owl-dt-control owl-dt-control-button owl-dt-control-arrow-button\"\n type=\"button\"\n tabindex=\"0\"\n [style.visibility]=\"showControlArrows ? 'visible' : 'hidden'\"\n [disabled]=\"!nextButtonEnabled()\"\n [attr.aria-label]=\"nextButtonLabel\"\n (click)=\"nextClicked()\"\n >\n <span\n class=\"owl-dt-control-content owl-dt-control-button-content\"\n tabindex=\"-1\"\n >\n <!-- <editor-fold desc=\"SVG Arrow Right\"> -->\n <svg\n version=\"1.1\"\n xmlns=\"http://www.w3.org/2000/svg\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n x=\"0px\"\n y=\"0px\"\n viewBox=\"0 0 250.738 250.738\"\n style=\"enable-background: new 0 0 250.738 250.738\"\n xml:space=\"preserve\"\n >\n <path\n style=\"fill-rule: evenodd; clip-rule: evenodd\"\n d=\"M191.75,111.689L84.766,5.291c-7.1-7.055-18.613-7.055-25.713,0\n c-7.101,7.054-7.101,18.49,0,25.544l95.053,94.534l-95.053,94.533c-7.101,7.054-7.101,18.491,0,25.545\n c7.1,7.054,18.613,7.054,25.713,0L191.75,139.05c3.784-3.759,5.487-8.759,5.238-13.681\n C197.237,120.447,195.534,115.448,191.75,111.689z\"\n />\n </svg>\n <!-- </editor-fold> -->\n </span>\n </button>\n</div>\n<div\n class=\"owl-dt-calendar-main\"\n cdkMonitorSubtreeFocus\n [ngSwitch]=\"currentView\"\n tabindex=\"-1\"\n>\n <ofe-owl-date-time-month-view\n *ngSwitchCase=\"'month'\"\n [pickerMoment]=\"pickerMoment\"\n [firstDayOfWeek]=\"firstDayOfWeek\"\n [selected]=\"selected\"\n [selecteds]=\"selecteds\"\n [selectMode]=\"selectMode\"\n [minDate]=\"minDate\"\n [maxDate]=\"maxDate\"\n [dateFilter]=\"dateFilter\"\n [hideOtherMonths]=\"hideOtherMonths\"\n (pickerMomentChange)=\"handlePickerMomentChange($event)\"\n (selectedChange)=\"dateSelected($event)\"\n (userSelection)=\"userSelected()\"\n ></ofe-owl-date-time-month-view>\n\n <ofe-owl-date-time-year-view\n *ngSwitchCase=\"'year'\"\n [pickerMoment]=\"pickerMoment\"\n [selected]=\"selected\"\n [selecteds]=\"selecteds\"\n [selectMode]=\"selectMode\"\n [minDate]=\"minDate\"\n [maxDate]=\"maxDate\"\n [dateFilter]=\"dateFilter\"\n (keyboardEnter)=\"focusActiveCell()\"\n (pickerMomentChange)=\"handlePickerMomentChange($event)\"\n (monthSelected)=\"selectMonthInYearView($event)\"\n (monthChange)=\"goToDateInView($event, 'month')\"\n ></ofe-owl-date-time-year-view>\n\n <ofe-owl-date-time-multi-year-view\n *ngSwitchCase=\"'multi-years'\"\n [pickerMoment]=\"pickerMoment\"\n [selected]=\"selected\"\n [selecteds]=\"selecteds\"\n [selectMode]=\"selectMode\"\n [minDate]=\"minDate\"\n [maxDate]=\"maxDate\"\n [dateFilter]=\"dateFilter\"\n (keyboardEnter)=\"focusActiveCell()\"\n (pickerMomentChange)=\"handlePickerMomentChange($event)\"\n (yearSelected)=\"selectYearInMultiYearView($event)\"\n (monthChange)=\"goToDateInView($event, 'year')\"\n ></ofe-owl-date-time-multi-year-view>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i4$1.CdkMonitorFocus, selector: "[cdkMonitorElementFocus], [cdkMonitorSubtreeFocus]", outputs: ["cdkFocusChange"], exportAs: ["cdkMonitorFocus"] }, { kind: "component", type: OwlMultiYearViewComponent, selector: "ofe-owl-date-time-multi-year-view", inputs: ["selectMode", "selected", "selecteds", "pickerMoment", "dateFilter", "minDate", "maxDate"], outputs: ["monthChange", "yearSelected", "pickerMomentChange", "keyboardEnter"] }, { kind: "component", type: OwlYearViewComponent, selector: "ofe-owl-date-time-year-view", inputs: ["selectMode", "selected", "selecteds", "pickerMoment", "dateFilter", "minDate", "maxDate"], outputs: ["monthChange", "monthSelected", "pickerMomentChange", "keyboardEnter"], exportAs: ["owlMonthView"] }, { kind: "component", type: OwlMonthViewComponent, selector: "ofe-owl-date-time-month-view", inputs: ["hideOtherMonths", "firstDayOfWeek", "selectMode", "selected", "selecteds", "pickerMoment", "dateFilter", "minDate", "maxDate"], outputs: ["selectedChange", "userSelection", "pickerMomentChange"], exportAs: ["owlYearView"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
5230
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: OwlCalendarComponent, selector: "ofe-owl-date-time-calendar", inputs: { minDate: "minDate", maxDate: "maxDate", pickerMoment: "pickerMoment", selected: "selected", selecteds: "selecteds", dateFilter: "dateFilter", firstDayOfWeek: "firstDayOfWeek", selectMode: "selectMode", startView: "startView", hideOtherMonths: "hideOtherMonths" }, outputs: { pickerMomentChange: "pickerMomentChange", selectedChange: "selectedChange", userSelection: "userSelection", yearSelected: "yearSelected", monthSelected: "monthSelected" }, host: { properties: { "class.owl-dt-calendar": "this.owlDTCalendarClass" } }, exportAs: ["owlDateTimeCalendar"], ngImport: i0, template: "<div class=\"owl-dt-calendar-control\">\n <!-- focus when keyboard tab (http://kizu.ru/en/blog/keyboard-only-focus/#x) -->\n <button\n class=\"owl-dt-control owl-dt-control-button owl-dt-control-arrow-button\"\n type=\"button\"\n tabindex=\"0\"\n [style.visibility]=\"showControlArrows ? 'visible' : 'hidden'\"\n [disabled]=\"!prevButtonEnabled()\"\n [attr.aria-label]=\"prevButtonLabel\"\n (click)=\"previousClicked()\"\n >\n <span\n class=\"owl-dt-control-content owl-dt-control-button-content\"\n tabindex=\"-1\"\n >\n <!-- <editor-fold desc=\"SVG Arrow Left\"> -->\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n version=\"1.1\"\n x=\"0px\"\n y=\"0px\"\n viewBox=\"0 0 250.738 250.738\"\n style=\"enable-background: new 0 0 250.738 250.738\"\n xml:space=\"preserve\"\n width=\"100%\"\n height=\"100%\"\n >\n <path\n style=\"fill-rule: evenodd; clip-rule: evenodd\"\n d=\"M96.633,125.369l95.053-94.533c7.101-7.055,7.101-18.492,0-25.546 c-7.1-7.054-18.613-7.054-25.714,0L58.989,111.689c-3.784,3.759-5.487,8.759-5.238,13.68c-0.249,4.922,1.454,9.921,5.238,13.681 l106.983,106.398c7.101,7.055,18.613,7.055,25.714,0c7.101-7.054,7.101-18.491,0-25.544L96.633,125.369z\"\n />\n </svg>\n <!-- </editor-fold> -->\n </span>\n </button>\n <div class=\"owl-dt-calendar-control-content\">\n <button\n class=\"owl-dt-control owl-dt-control-button owl-dt-control-period-button\"\n type=\"button\"\n tabindex=\"0\"\n [attr.aria-label]=\"periodButtonLabel\"\n (click)=\"toggleViews()\"\n >\n <span\n class=\"owl-dt-control-content owl-dt-control-button-content\"\n tabindex=\"-1\"\n >\n {{ periodButtonText }}\n\n <span\n class=\"owl-dt-control-button-arrow\"\n [style.transform]=\"'rotate(' + (isMonthView ? 0 : 180) + 'deg)'\"\n >\n <!-- <editor-fold desc=\"SVG Arrow\"> -->\n <svg\n version=\"1.1\"\n xmlns=\"http://www.w3.org/2000/svg\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n x=\"0px\"\n y=\"0px\"\n width=\"50%\"\n height=\"50%\"\n viewBox=\"0 0 292.362 292.362\"\n style=\"enable-background: new 0 0 292.362 292.362\"\n xml:space=\"preserve\"\n >\n <g>\n <path\n d=\"M286.935,69.377c-3.614-3.617-7.898-5.424-12.848-5.424H18.274c-4.952,0-9.233,1.807-12.85,5.424\n C1.807,72.998,0,77.279,0,82.228c0,4.948,1.807,9.229,5.424,12.847l127.907,127.907c3.621,3.617,7.902,5.428,12.85,5.428\n s9.233-1.811,12.847-5.428L286.935,95.074c3.613-3.617,5.427-7.898,5.427-12.847C292.362,77.279,290.548,72.998,286.935,69.377z\"\n />\n </g>\n </svg>\n <!-- </editor-fold> -->\n </span>\n </span>\n </button>\n </div>\n <button\n class=\"owl-dt-control owl-dt-control-button owl-dt-control-arrow-button\"\n type=\"button\"\n tabindex=\"0\"\n [style.visibility]=\"showControlArrows ? 'visible' : 'hidden'\"\n [disabled]=\"!nextButtonEnabled()\"\n [attr.aria-label]=\"nextButtonLabel\"\n (click)=\"nextClicked()\"\n >\n <span\n class=\"owl-dt-control-content owl-dt-control-button-content\"\n tabindex=\"-1\"\n >\n <!-- <editor-fold desc=\"SVG Arrow Right\"> -->\n <svg\n version=\"1.1\"\n xmlns=\"http://www.w3.org/2000/svg\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n x=\"0px\"\n y=\"0px\"\n viewBox=\"0 0 250.738 250.738\"\n style=\"enable-background: new 0 0 250.738 250.738\"\n xml:space=\"preserve\"\n >\n <path\n style=\"fill-rule: evenodd; clip-rule: evenodd\"\n d=\"M191.75,111.689L84.766,5.291c-7.1-7.055-18.613-7.055-25.713,0\n c-7.101,7.054-7.101,18.49,0,25.544l95.053,94.534l-95.053,94.533c-7.101,7.054-7.101,18.491,0,25.545\n c7.1,7.054,18.613,7.054,25.713,0L191.75,139.05c3.784-3.759,5.487-8.759,5.238-13.681\n C197.237,120.447,195.534,115.448,191.75,111.689z\"\n />\n </svg>\n <!-- </editor-fold> -->\n </span>\n </button>\n</div>\n<div\n class=\"owl-dt-calendar-main\"\n cdkMonitorSubtreeFocus\n [ngSwitch]=\"currentView\"\n tabindex=\"-1\"\n>\n <ofe-owl-date-time-month-view\n *ngSwitchCase=\"'month'\"\n [pickerMoment]=\"pickerMoment\"\n [firstDayOfWeek]=\"firstDayOfWeek\"\n [selected]=\"selected\"\n [selecteds]=\"selecteds\"\n [selectMode]=\"selectMode\"\n [minDate]=\"minDate\"\n [maxDate]=\"maxDate\"\n [dateFilter]=\"dateFilter\"\n [hideOtherMonths]=\"hideOtherMonths\"\n (pickerMomentChange)=\"handlePickerMomentChange($event)\"\n (selectedChange)=\"dateSelected($event)\"\n (userSelection)=\"userSelected()\"\n ></ofe-owl-date-time-month-view>\n\n <ofe-owl-date-time-year-view\n *ngSwitchCase=\"'year'\"\n [pickerMoment]=\"pickerMoment\"\n [selected]=\"selected\"\n [selecteds]=\"selecteds\"\n [selectMode]=\"selectMode\"\n [minDate]=\"minDate\"\n [maxDate]=\"maxDate\"\n [dateFilter]=\"dateFilter\"\n (keyboardEnter)=\"focusActiveCell()\"\n (pickerMomentChange)=\"handlePickerMomentChange($event)\"\n (monthSelected)=\"selectMonthInYearView($event)\"\n (monthChange)=\"goToDateInView($event, 'month')\"\n ></ofe-owl-date-time-year-view>\n\n <ofe-owl-date-time-multi-year-view\n *ngSwitchCase=\"'multi-years'\"\n [pickerMoment]=\"pickerMoment\"\n [selected]=\"selected\"\n [selecteds]=\"selecteds\"\n [selectMode]=\"selectMode\"\n [minDate]=\"minDate\"\n [maxDate]=\"maxDate\"\n [dateFilter]=\"dateFilter\"\n (keyboardEnter)=\"focusActiveCell()\"\n (pickerMomentChange)=\"handlePickerMomentChange($event)\"\n (yearSelected)=\"selectYearInMultiYearView($event)\"\n (monthChange)=\"goToDateInView($event, 'year')\"\n ></ofe-owl-date-time-multi-year-view>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i4.CdkMonitorFocus, selector: "[cdkMonitorElementFocus], [cdkMonitorSubtreeFocus]", outputs: ["cdkFocusChange"], exportAs: ["cdkMonitorFocus"] }, { kind: "component", type: OwlMultiYearViewComponent, selector: "ofe-owl-date-time-multi-year-view", inputs: ["selectMode", "selected", "selecteds", "pickerMoment", "dateFilter", "minDate", "maxDate"], outputs: ["monthChange", "yearSelected", "pickerMomentChange", "keyboardEnter"] }, { kind: "component", type: OwlYearViewComponent, selector: "ofe-owl-date-time-year-view", inputs: ["selectMode", "selected", "selecteds", "pickerMoment", "dateFilter", "minDate", "maxDate"], outputs: ["monthChange", "monthSelected", "pickerMomentChange", "keyboardEnter"], exportAs: ["owlMonthView"] }, { kind: "component", type: OwlMonthViewComponent, selector: "ofe-owl-date-time-month-view", inputs: ["hideOtherMonths", "firstDayOfWeek", "selectMode", "selected", "selecteds", "pickerMoment", "dateFilter", "minDate", "maxDate"], outputs: ["selectedChange", "userSelection", "pickerMomentChange"], exportAs: ["owlYearView"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
5221
5231
  }
5222
5232
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OwlCalendarComponent, decorators: [{
5223
5233
  type: Component,
@@ -5357,7 +5367,7 @@ class OwlTimerBoxComponent {
5357
5367
  this.inputChange.emit(value);
5358
5368
  }
5359
5369
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OwlTimerBoxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
5360
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: OwlTimerBoxComponent, selector: "ofe-owl-date-time-timer-box", inputs: { showDivider: "showDivider", upBtnAriaLabel: "upBtnAriaLabel", upBtnDisabled: "upBtnDisabled", downBtnAriaLabel: "downBtnAriaLabel", downBtnDisabled: "downBtnDisabled", boxValue: "boxValue", value: "value", min: "min", max: "max", step: "step", inputLabel: "inputLabel" }, outputs: { valueChange: "valueChange", inputChange: "inputChange" }, host: { properties: { "class.owl-dt-timer-box": "this.owlDTTimerBoxClass" } }, exportAs: ["owlDateTimeTimerBox"], ngImport: i0, template: "<div *ngIf=\"showDivider\" class=\"owl-dt-timer-divider\" aria-hidden=\"true\"></div>\n<button\n class=\"owl-dt-control-button owl-dt-control-arrow-button\"\n type=\"button\"\n tabindex=\"-1\"\n [disabled]=\"upBtnDisabled\"\n [attr.aria-label]=\"upBtnAriaLabel\"\n (click)=\"upBtnClicked()\"\n>\n <span class=\"owl-dt-control-button-content\" tabindex=\"-1\">\n <!-- <editor-fold desc=\"SVG Arrow Up\"> -->\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n version=\"1.1\"\n x=\"0px\"\n y=\"0px\"\n viewBox=\"0 0 451.847 451.846\"\n style=\"enable-background: new 0 0 451.847 451.846\"\n xml:space=\"preserve\"\n width=\"100%\"\n height=\"100%\"\n >\n <path\n d=\"M248.292,106.406l194.281,194.29c12.365,12.359,12.365,32.391,0,44.744c-12.354,12.354-32.391,12.354-44.744,0\n L225.923,173.529L54.018,345.44c-12.36,12.354-32.395,12.354-44.748,0c-12.359-12.354-12.359-32.391,0-44.75L203.554,106.4\n c6.18-6.174,14.271-9.259,22.369-9.259C234.018,97.141,242.115,100.232,248.292,106.406z\"\n />\n </svg>\n <!-- </editor-fold> -->\n </span>\n</button>\n<label class=\"owl-dt-timer-content\">\n <input\n class=\"owl-dt-timer-input\"\n maxlength=\"2\"\n [value]=\"displayValue | numberFixedLen: 2\"\n (input)=\"handleInputChange(valueInput.value)\"\n #valueInput\n />\n <span class=\"owl-hidden-accessible\">{{ inputLabel }}</span>\n</label>\n<button\n class=\"owl-dt-control-button owl-dt-control-arrow-button\"\n type=\"button\"\n tabindex=\"-1\"\n [disabled]=\"downBtnDisabled\"\n [attr.aria-label]=\"downBtnAriaLabel\"\n (click)=\"downBtnClicked()\"\n>\n <span class=\"owl-dt-control-button-content\" tabindex=\"-1\">\n <!-- <editor-fold desc=\"SVG Arrow Down\"> -->\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n version=\"1.1\"\n x=\"0px\"\n y=\"0px\"\n viewBox=\"0 0 451.847 451.846\"\n style=\"enable-background: new 0 0 451.847 451.846\"\n xml:space=\"preserve\"\n width=\"100%\"\n height=\"100%\"\n >\n <path\n d=\"M225.923,354.706c-8.098,0-16.195-3.092-22.369-9.263L9.27,151.157c-12.359-12.359-12.359-32.397,0-44.751\n c12.354-12.354,32.388-12.354,44.748,0l171.905,171.915l171.906-171.909c12.359-12.354,32.391-12.354,44.744,0\n c12.365,12.354,12.365,32.392,0,44.751L248.292,345.449C242.115,351.621,234.018,354.706,225.923,354.706z\"\n />\n </svg>\n <!-- </editor-fold> -->\n </span>\n</button>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: NumberFixedLenPipe, name: "numberFixedLen" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
5370
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: OwlTimerBoxComponent, selector: "ofe-owl-date-time-timer-box", inputs: { showDivider: "showDivider", upBtnAriaLabel: "upBtnAriaLabel", upBtnDisabled: "upBtnDisabled", downBtnAriaLabel: "downBtnAriaLabel", downBtnDisabled: "downBtnDisabled", boxValue: "boxValue", value: "value", min: "min", max: "max", step: "step", inputLabel: "inputLabel" }, outputs: { valueChange: "valueChange", inputChange: "inputChange" }, host: { properties: { "class.owl-dt-timer-box": "this.owlDTTimerBoxClass" } }, exportAs: ["owlDateTimeTimerBox"], ngImport: i0, template: "<div *ngIf=\"showDivider\" class=\"owl-dt-timer-divider\" aria-hidden=\"true\"></div>\n<button\n class=\"owl-dt-control-button owl-dt-control-arrow-button\"\n type=\"button\"\n tabindex=\"-1\"\n [disabled]=\"upBtnDisabled\"\n [attr.aria-label]=\"upBtnAriaLabel\"\n (click)=\"upBtnClicked()\"\n>\n <span class=\"owl-dt-control-button-content\" tabindex=\"-1\">\n <!-- <editor-fold desc=\"SVG Arrow Up\"> -->\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n version=\"1.1\"\n x=\"0px\"\n y=\"0px\"\n viewBox=\"0 0 451.847 451.846\"\n style=\"enable-background: new 0 0 451.847 451.846\"\n xml:space=\"preserve\"\n width=\"100%\"\n height=\"100%\"\n >\n <path\n d=\"M248.292,106.406l194.281,194.29c12.365,12.359,12.365,32.391,0,44.744c-12.354,12.354-32.391,12.354-44.744,0\n L225.923,173.529L54.018,345.44c-12.36,12.354-32.395,12.354-44.748,0c-12.359-12.354-12.359-32.391,0-44.75L203.554,106.4\n c6.18-6.174,14.271-9.259,22.369-9.259C234.018,97.141,242.115,100.232,248.292,106.406z\"\n />\n </svg>\n <!-- </editor-fold> -->\n </span>\n</button>\n<label class=\"owl-dt-timer-content\">\n <input\n class=\"owl-dt-timer-input\"\n maxlength=\"2\"\n [value]=\"displayValue | numberFixedLen: 2\"\n (input)=\"handleInputChange(valueInput.value)\"\n #valueInput\n />\n <span class=\"owl-hidden-accessible\">{{ inputLabel }}</span>\n</label>\n<button\n class=\"owl-dt-control-button owl-dt-control-arrow-button\"\n type=\"button\"\n tabindex=\"-1\"\n [disabled]=\"downBtnDisabled\"\n [attr.aria-label]=\"downBtnAriaLabel\"\n (click)=\"downBtnClicked()\"\n>\n <span class=\"owl-dt-control-button-content\" tabindex=\"-1\">\n <!-- <editor-fold desc=\"SVG Arrow Down\"> -->\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n version=\"1.1\"\n x=\"0px\"\n y=\"0px\"\n viewBox=\"0 0 451.847 451.846\"\n style=\"enable-background: new 0 0 451.847 451.846\"\n xml:space=\"preserve\"\n width=\"100%\"\n height=\"100%\"\n >\n <path\n d=\"M225.923,354.706c-8.098,0-16.195-3.092-22.369-9.263L9.27,151.157c-12.359-12.359-12.359-32.397,0-44.751\n c12.354-12.354,32.388-12.354,44.748,0l171.905,171.915l171.906-171.909c12.359-12.354,32.391-12.354,44.744,0\n c12.365,12.354,12.365,32.392,0,44.751L248.292,345.449C242.115,351.621,234.018,354.706,225.923,354.706z\"\n />\n </svg>\n <!-- </editor-fold> -->\n </span>\n</button>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: NumberFixedLenPipe, name: "numberFixedLen" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
5361
5371
  }
5362
5372
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OwlTimerBoxComponent, decorators: [{
5363
5373
  type: Component,
@@ -5643,7 +5653,7 @@ class OwlTimerComponent {
5643
5653
  : null;
5644
5654
  }
5645
5655
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OwlTimerComponent, deps: [{ token: i0.NgZone }, { token: i0.ElementRef }, { token: OwlDateTimeIntl }, { token: i0.ChangeDetectorRef }, { token: DateTimeAdapter, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
5646
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: OwlTimerComponent, selector: "ofe-owl-date-time-timer", inputs: { pickerMoment: "pickerMoment", minDateTime: "minDateTime", maxDateTime: "maxDateTime", showSecondsTimer: "showSecondsTimer", hour12Timer: "hour12Timer", stepHour: "stepHour", stepMinute: "stepMinute", stepSecond: "stepSecond" }, outputs: { selectedChange: "selectedChange" }, host: { properties: { "attr.tabindex": "this.owlDTTimeTabIndex", "class.owl-dt-timer": "this.owlDTTimerClass" } }, exportAs: ["owlDateTimeTimer"], ngImport: i0, template: "<ofe-owl-date-time-timer-box\n [upBtnAriaLabel]=\"upHourButtonLabel\"\n [downBtnAriaLabel]=\"downHourButtonLabel\"\n [upBtnDisabled]=\"!upHourEnabled()\"\n [downBtnDisabled]=\"!downHourEnabled()\"\n [boxValue]=\"hourBoxValue\"\n [value]=\"hourValue\"\n [min]=\"0\"\n [max]=\"23\"\n [step]=\"stepHour\"\n [inputLabel]=\"'Hour'\"\n (inputChange)=\"setHourValueViaInput($event)\"\n (valueChange)=\"setHourValue($event)\"\n></ofe-owl-date-time-timer-box>\n<ofe-owl-date-time-timer-box\n [showDivider]=\"true\"\n [upBtnAriaLabel]=\"upMinuteButtonLabel\"\n [downBtnAriaLabel]=\"downMinuteButtonLabel\"\n [upBtnDisabled]=\"!upMinuteEnabled()\"\n [downBtnDisabled]=\"!downMinuteEnabled()\"\n [value]=\"minuteValue\"\n [min]=\"0\"\n [max]=\"59\"\n [step]=\"stepMinute\"\n [inputLabel]=\"'Minute'\"\n (inputChange)=\"setMinuteValue($event)\"\n (valueChange)=\"setMinuteValue($event)\"\n></ofe-owl-date-time-timer-box>\n<ofe-owl-date-time-timer-box\n *ngIf=\"showSecondsTimer\"\n [showDivider]=\"true\"\n [upBtnAriaLabel]=\"upSecondButtonLabel\"\n [downBtnAriaLabel]=\"downSecondButtonLabel\"\n [upBtnDisabled]=\"!upSecondEnabled()\"\n [downBtnDisabled]=\"!downSecondEnabled()\"\n [value]=\"secondValue\"\n [min]=\"0\"\n [max]=\"59\"\n [step]=\"stepSecond\"\n [inputLabel]=\"'Second'\"\n (inputChange)=\"setSecondValue($event)\"\n (valueChange)=\"setSecondValue($event)\"\n></ofe-owl-date-time-timer-box>\n\n<div *ngIf=\"hour12Timer\" class=\"owl-dt-timer-hour12\">\n <button\n class=\"owl-dt-control-button owl-dt-timer-hour12-box\"\n type=\"button\"\n tabindex=\"0\"\n (click)=\"setMeridiem($event)\"\n >\n <span class=\"owl-dt-control-button-content\" tabindex=\"-1\">\n {{ hour12ButtonLabel }}\n </span>\n </button>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: OwlTimerBoxComponent, selector: "ofe-owl-date-time-timer-box", inputs: ["showDivider", "upBtnAriaLabel", "upBtnDisabled", "downBtnAriaLabel", "downBtnDisabled", "boxValue", "value", "min", "max", "step", "inputLabel"], outputs: ["valueChange", "inputChange"], exportAs: ["owlDateTimeTimerBox"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
5656
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: OwlTimerComponent, selector: "ofe-owl-date-time-timer", inputs: { pickerMoment: "pickerMoment", minDateTime: "minDateTime", maxDateTime: "maxDateTime", showSecondsTimer: "showSecondsTimer", hour12Timer: "hour12Timer", stepHour: "stepHour", stepMinute: "stepMinute", stepSecond: "stepSecond" }, outputs: { selectedChange: "selectedChange" }, host: { properties: { "attr.tabindex": "this.owlDTTimeTabIndex", "class.owl-dt-timer": "this.owlDTTimerClass" } }, exportAs: ["owlDateTimeTimer"], ngImport: i0, template: "<ofe-owl-date-time-timer-box\n [upBtnAriaLabel]=\"upHourButtonLabel\"\n [downBtnAriaLabel]=\"downHourButtonLabel\"\n [upBtnDisabled]=\"!upHourEnabled()\"\n [downBtnDisabled]=\"!downHourEnabled()\"\n [boxValue]=\"hourBoxValue\"\n [value]=\"hourValue\"\n [min]=\"0\"\n [max]=\"23\"\n [step]=\"stepHour\"\n [inputLabel]=\"'Hour'\"\n (inputChange)=\"setHourValueViaInput($event)\"\n (valueChange)=\"setHourValue($event)\"\n></ofe-owl-date-time-timer-box>\n<ofe-owl-date-time-timer-box\n [showDivider]=\"true\"\n [upBtnAriaLabel]=\"upMinuteButtonLabel\"\n [downBtnAriaLabel]=\"downMinuteButtonLabel\"\n [upBtnDisabled]=\"!upMinuteEnabled()\"\n [downBtnDisabled]=\"!downMinuteEnabled()\"\n [value]=\"minuteValue\"\n [min]=\"0\"\n [max]=\"59\"\n [step]=\"stepMinute\"\n [inputLabel]=\"'Minute'\"\n (inputChange)=\"setMinuteValue($event)\"\n (valueChange)=\"setMinuteValue($event)\"\n></ofe-owl-date-time-timer-box>\n<ofe-owl-date-time-timer-box\n *ngIf=\"showSecondsTimer\"\n [showDivider]=\"true\"\n [upBtnAriaLabel]=\"upSecondButtonLabel\"\n [downBtnAriaLabel]=\"downSecondButtonLabel\"\n [upBtnDisabled]=\"!upSecondEnabled()\"\n [downBtnDisabled]=\"!downSecondEnabled()\"\n [value]=\"secondValue\"\n [min]=\"0\"\n [max]=\"59\"\n [step]=\"stepSecond\"\n [inputLabel]=\"'Second'\"\n (inputChange)=\"setSecondValue($event)\"\n (valueChange)=\"setSecondValue($event)\"\n></ofe-owl-date-time-timer-box>\n\n<div *ngIf=\"hour12Timer\" class=\"owl-dt-timer-hour12\">\n <button\n class=\"owl-dt-control-button owl-dt-timer-hour12-box\"\n type=\"button\"\n tabindex=\"0\"\n (click)=\"setMeridiem($event)\"\n >\n <span class=\"owl-dt-control-button-content\" tabindex=\"-1\">\n {{ hour12ButtonLabel }}\n </span>\n </button>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: OwlTimerBoxComponent, selector: "ofe-owl-date-time-timer-box", inputs: ["showDivider", "upBtnAriaLabel", "upBtnDisabled", "downBtnAriaLabel", "downBtnDisabled", "boxValue", "value", "min", "max", "step", "inputLabel"], outputs: ["valueChange", "inputChange"], exportAs: ["owlDateTimeTimerBox"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
5647
5657
  }
5648
5658
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OwlTimerComponent, decorators: [{
5649
5659
  type: Component,
@@ -6008,7 +6018,7 @@ class OwlDateTimeContainerComponent {
6008
6018
  }
6009
6019
  }
6010
6020
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OwlDateTimeContainerComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: OwlDateTimeIntl }, { token: DateTimeAdapter, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
6011
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: OwlDateTimeContainerComponent, selector: "ofe-owl-date-time-container", host: { listeners: { "@transformPicker.done": "handleContainerAnimationDone($event)" }, properties: { "class.owl-dt-container": "this.owlDTContainerClass", "class.owl-dt-popup-container": "this.owlDTPopupContainerClass", "class.owl-dt-dialog-container": "this.owlDTDialogContainerClass", "class.owl-dt-inline-container": "this.owlDTInlineContainerClass", "class.owl-dt-container-disabled": "this.owlDTContainerDisabledClass", "attr.id": "this.owlDTContainerId", "@transformPicker": "this.owlDTContainerAnimation" } }, viewQueries: [{ propertyName: "calendar", first: true, predicate: OwlCalendarComponent, descendants: true }, { propertyName: "timer", first: true, predicate: OwlTimerComponent, descendants: true }], exportAs: ["owlDateTimeContainer"], ngImport: i0, template: "<div\n [cdkTrapFocus]=\"picker.pickerMode !== 'inline'\"\n [@fadeInPicker]=\"picker.pickerMode === 'inline' ? '' : 'enter'\"\n class=\"owl-dt-container-inner\"\n>\n <ofe-owl-date-time-calendar\n *ngIf=\"pickerType === 'both' || pickerType === 'calendar'\"\n class=\"owl-dt-container-row\"\n [firstDayOfWeek]=\"picker.firstDayOfWeek\"\n [(pickerMoment)]=\"pickerMoment\"\n [selected]=\"picker.selected\"\n [selecteds]=\"picker.selecteds\"\n [selectMode]=\"picker.selectMode\"\n [minDate]=\"picker.minDateTime\"\n [maxDate]=\"picker.maxDateTime\"\n [dateFilter]=\"picker.dateTimeFilter\"\n [startView]=\"picker.startView\"\n [hideOtherMonths]=\"picker.hideOtherMonths\"\n (yearSelected)=\"picker.selectYear($event)\"\n (monthSelected)=\"picker.selectMonth($event)\"\n (selectedChange)=\"dateSelected($event)\"\n ></ofe-owl-date-time-calendar>\n <ofe-owl-date-time-timer\n *ngIf=\"pickerType === 'both' || pickerType === 'timer'\"\n class=\"owl-dt-container-row\"\n [pickerMoment]=\"pickerMoment\"\n [minDateTime]=\"picker.minDateTime\"\n [maxDateTime]=\"picker.maxDateTime\"\n [showSecondsTimer]=\"picker.showSecondsTimer\"\n [hour12Timer]=\"picker.hour12Timer\"\n [stepHour]=\"picker.stepHour\"\n [stepMinute]=\"picker.stepMinute\"\n [stepSecond]=\"picker.stepSecond\"\n (selectedChange)=\"timeSelected($event)\"\n ></ofe-owl-date-time-timer>\n <div\n *ngIf=\"picker.isInRangeMode\"\n role=\"radiogroup\"\n class=\"owl-dt-container-info owl-dt-container-row\"\n >\n <div\n role=\"radio\"\n [tabindex]=\"activeSelectedIndex === 0 ? 0 : -1\"\n [attr.aria-checked]=\"activeSelectedIndex === 0\"\n class=\"owl-dt-control owl-dt-container-range owl-dt-container-from\"\n [ngClass]=\"{ 'owl-dt-container-info-active': activeSelectedIndex === 0 }\"\n (click)=\"handleClickOnInfoGroup($event, 0)\"\n (keydown)=\"handleKeydownOnInfoGroup($event, to, 0)\"\n #from\n >\n <span\n class=\"owl-dt-control-content owl-dt-container-range-content\"\n tabindex=\"-1\"\n >\n <span class=\"owl-dt-container-info-label\">{{ fromLabel }}:</span>\n <span class=\"owl-dt-container-info-value\">{{\n fromFormattedValue\n }}</span>\n </span>\n </div>\n <div\n role=\"radio\"\n [tabindex]=\"activeSelectedIndex === 1 ? 0 : -1\"\n [attr.aria-checked]=\"activeSelectedIndex === 1\"\n class=\"owl-dt-control owl-dt-container-range owl-dt-container-to\"\n [ngClass]=\"{ 'owl-dt-container-info-active': activeSelectedIndex === 1 }\"\n (click)=\"handleClickOnInfoGroup($event, 1)\"\n (keydown)=\"handleKeydownOnInfoGroup($event, from, 1)\"\n #to\n >\n <span\n class=\"owl-dt-control-content owl-dt-container-range-content\"\n tabindex=\"-1\"\n >\n <span class=\"owl-dt-container-info-label\">{{ toLabel }}:</span>\n <span class=\"owl-dt-container-info-value\">{{ toFormattedValue }}</span>\n </span>\n </div>\n </div>\n\n <div\n *ngIf=\"showControlButtons\"\n class=\"owl-dt-container-buttons owl-dt-container-row\"\n >\n <button\n class=\"owl-dt-control owl-dt-control-button owl-dt-container-control-button\"\n type=\"button\"\n tabindex=\"0\"\n (click)=\"onCancelClicked($event)\"\n >\n <span\n class=\"owl-dt-control-content owl-dt-control-button-content\"\n tabindex=\"-1\"\n >\n {{ cancelLabel }}\n </span>\n </button>\n <button\n class=\"owl-dt-control owl-dt-control-button owl-dt-container-control-button\"\n type=\"button\"\n tabindex=\"0\"\n (click)=\"onSetClicked($event)\"\n >\n <span\n class=\"owl-dt-control-content owl-dt-control-button-content\"\n tabindex=\"-1\"\n >\n {{ setLabel }}\n </span>\n </button>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4$1.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "component", type: OwlTimerComponent, selector: "ofe-owl-date-time-timer", inputs: ["pickerMoment", "minDateTime", "maxDateTime", "showSecondsTimer", "hour12Timer", "stepHour", "stepMinute", "stepSecond"], outputs: ["selectedChange"], exportAs: ["owlDateTimeTimer"] }, { kind: "component", type: OwlCalendarComponent, selector: "ofe-owl-date-time-calendar", inputs: ["minDate", "maxDate", "pickerMoment", "selected", "selecteds", "dateFilter", "firstDayOfWeek", "selectMode", "startView", "hideOtherMonths"], outputs: ["pickerMomentChange", "selectedChange", "userSelection", "yearSelected", "monthSelected"], exportAs: ["owlDateTimeCalendar"] }], animations: [
6021
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: OwlDateTimeContainerComponent, selector: "ofe-owl-date-time-container", host: { listeners: { "@transformPicker.done": "handleContainerAnimationDone($event)" }, properties: { "class.owl-dt-container": "this.owlDTContainerClass", "class.owl-dt-popup-container": "this.owlDTPopupContainerClass", "class.owl-dt-dialog-container": "this.owlDTDialogContainerClass", "class.owl-dt-inline-container": "this.owlDTInlineContainerClass", "class.owl-dt-container-disabled": "this.owlDTContainerDisabledClass", "attr.id": "this.owlDTContainerId", "@transformPicker": "this.owlDTContainerAnimation" } }, viewQueries: [{ propertyName: "calendar", first: true, predicate: OwlCalendarComponent, descendants: true }, { propertyName: "timer", first: true, predicate: OwlTimerComponent, descendants: true }], exportAs: ["owlDateTimeContainer"], ngImport: i0, template: "<div\n [cdkTrapFocus]=\"picker.pickerMode !== 'inline'\"\n [@fadeInPicker]=\"picker.pickerMode === 'inline' ? '' : 'enter'\"\n class=\"owl-dt-container-inner\"\n>\n <ofe-owl-date-time-calendar\n *ngIf=\"pickerType === 'both' || pickerType === 'calendar'\"\n class=\"owl-dt-container-row\"\n [firstDayOfWeek]=\"picker.firstDayOfWeek\"\n [(pickerMoment)]=\"pickerMoment\"\n [selected]=\"picker.selected\"\n [selecteds]=\"picker.selecteds\"\n [selectMode]=\"picker.selectMode\"\n [minDate]=\"picker.minDateTime\"\n [maxDate]=\"picker.maxDateTime\"\n [dateFilter]=\"picker.dateTimeFilter\"\n [startView]=\"picker.startView\"\n [hideOtherMonths]=\"picker.hideOtherMonths\"\n (yearSelected)=\"picker.selectYear($event)\"\n (monthSelected)=\"picker.selectMonth($event)\"\n (selectedChange)=\"dateSelected($event)\"\n ></ofe-owl-date-time-calendar>\n <ofe-owl-date-time-timer\n *ngIf=\"pickerType === 'both' || pickerType === 'timer'\"\n class=\"owl-dt-container-row\"\n [pickerMoment]=\"pickerMoment\"\n [minDateTime]=\"picker.minDateTime\"\n [maxDateTime]=\"picker.maxDateTime\"\n [showSecondsTimer]=\"picker.showSecondsTimer\"\n [hour12Timer]=\"picker.hour12Timer\"\n [stepHour]=\"picker.stepHour\"\n [stepMinute]=\"picker.stepMinute\"\n [stepSecond]=\"picker.stepSecond\"\n (selectedChange)=\"timeSelected($event)\"\n ></ofe-owl-date-time-timer>\n <div\n *ngIf=\"picker.isInRangeMode\"\n role=\"radiogroup\"\n class=\"owl-dt-container-info owl-dt-container-row\"\n >\n <div\n role=\"radio\"\n [tabindex]=\"activeSelectedIndex === 0 ? 0 : -1\"\n [attr.aria-checked]=\"activeSelectedIndex === 0\"\n class=\"owl-dt-control owl-dt-container-range owl-dt-container-from\"\n [ngClass]=\"{ 'owl-dt-container-info-active': activeSelectedIndex === 0 }\"\n (click)=\"handleClickOnInfoGroup($event, 0)\"\n (keydown)=\"handleKeydownOnInfoGroup($event, to, 0)\"\n #from\n >\n <span\n class=\"owl-dt-control-content owl-dt-container-range-content\"\n tabindex=\"-1\"\n >\n <span class=\"owl-dt-container-info-label\">{{ fromLabel }}:</span>\n <span class=\"owl-dt-container-info-value\">{{\n fromFormattedValue\n }}</span>\n </span>\n </div>\n <div\n role=\"radio\"\n [tabindex]=\"activeSelectedIndex === 1 ? 0 : -1\"\n [attr.aria-checked]=\"activeSelectedIndex === 1\"\n class=\"owl-dt-control owl-dt-container-range owl-dt-container-to\"\n [ngClass]=\"{ 'owl-dt-container-info-active': activeSelectedIndex === 1 }\"\n (click)=\"handleClickOnInfoGroup($event, 1)\"\n (keydown)=\"handleKeydownOnInfoGroup($event, from, 1)\"\n #to\n >\n <span\n class=\"owl-dt-control-content owl-dt-container-range-content\"\n tabindex=\"-1\"\n >\n <span class=\"owl-dt-container-info-label\">{{ toLabel }}:</span>\n <span class=\"owl-dt-container-info-value\">{{ toFormattedValue }}</span>\n </span>\n </div>\n </div>\n\n <div\n *ngIf=\"showControlButtons\"\n class=\"owl-dt-container-buttons owl-dt-container-row\"\n >\n <button\n class=\"owl-dt-control owl-dt-control-button owl-dt-container-control-button\"\n type=\"button\"\n tabindex=\"0\"\n (click)=\"onCancelClicked($event)\"\n >\n <span\n class=\"owl-dt-control-content owl-dt-control-button-content\"\n tabindex=\"-1\"\n >\n {{ cancelLabel }}\n </span>\n </button>\n <button\n class=\"owl-dt-control owl-dt-control-button owl-dt-container-control-button\"\n type=\"button\"\n tabindex=\"0\"\n (click)=\"onSetClicked($event)\"\n >\n <span\n class=\"owl-dt-control-content owl-dt-control-button-content\"\n tabindex=\"-1\"\n >\n {{ setLabel }}\n </span>\n </button>\n </div>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "component", type: OwlTimerComponent, selector: "ofe-owl-date-time-timer", inputs: ["pickerMoment", "minDateTime", "maxDateTime", "showSecondsTimer", "hour12Timer", "stepHour", "stepMinute", "stepSecond"], outputs: ["selectedChange"], exportAs: ["owlDateTimeTimer"] }, { kind: "component", type: OwlCalendarComponent, selector: "ofe-owl-date-time-calendar", inputs: ["minDate", "maxDate", "pickerMoment", "selected", "selecteds", "dateFilter", "firstDayOfWeek", "selectMode", "startView", "hideOtherMonths"], outputs: ["pickerMomentChange", "selectedChange", "userSelection", "yearSelected", "monthSelected"], exportAs: ["owlDateTimeCalendar"] }], animations: [
6012
6022
  owlDateTimePickerAnimations.transformPicker,
6013
6023
  owlDateTimePickerAnimations.fadeInPicker
6014
6024
  ], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
@@ -6530,7 +6540,7 @@ class OwlDialogContainerComponent extends BasePortalOutlet {
6530
6540
  this.focusTrap.destroy();
6531
6541
  }
6532
6542
  }
6533
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OwlDialogContainerComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i4$1.FocusTrapFactory }, { token: DOCUMENT, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
6543
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OwlDialogContainerComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i4.FocusTrapFactory }, { token: DOCUMENT, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
6534
6544
  static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: OwlDialogContainerComponent, selector: "ofe-owl-dialog-container", host: { listeners: { "@slideModal.start": "onAnimationStart($event)", "@slideModal.done": "onAnimationDone($event)" }, properties: { "attr.tabindex": "this.owlDialogContainerTabIndex", "class.owl-dialog-container": "this.owlDialogContainerClass", "attr.id": "this.owlDialogContainerId", "attr.role": "this.owlDialogContainerRole", "attr.aria-labelledby": "this.owlDialogContainerAriaLabelledby", "attr.aria-describedby": "this.owlDialogContainerAriaDescribedby", "@slideModal": "this.owlDialogContainerAnimation" } }, viewQueries: [{ propertyName: "portalOutlet", first: true, predicate: CdkPortalOutlet, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-template cdkPortalOutlet></ng-template>\n", dependencies: [{ kind: "directive", type: i2.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], animations: [
6535
6545
  trigger('slideModal', [
6536
6546
  transition('void => enter', [
@@ -6582,7 +6592,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
6582
6592
  transition('enter => exit', [animateChild(), animate(200, style(zoomFadeIn))], { params: { x: '0px', y: '0px', ox: '50%', oy: '50%' } })
6583
6593
  ])
6584
6594
  ], template: "<ng-template cdkPortalOutlet></ng-template>\n" }]
6585
- }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i4$1.FocusTrapFactory }, { type: undefined, decorators: [{
6595
+ }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i4.FocusTrapFactory }, { type: undefined, decorators: [{
6586
6596
  type: Optional
6587
6597
  }, {
6588
6598
  type: Inject,
@@ -6838,12 +6848,12 @@ class OwlDialogService {
6838
6848
  }
6839
6849
  }
6840
6850
  }
6841
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OwlDialogService, deps: [{ token: i1$2.Overlay }, { token: i0.Injector }, { token: i1.Location, optional: true }, { token: OWL_DIALOG_SCROLL_STRATEGY }, { token: OWL_DIALOG_DEFAULT_OPTIONS, optional: true }, { token: OwlDialogService, optional: true, skipSelf: true }, { token: i1$2.OverlayContainer }], target: i0.ɵɵFactoryTarget.Injectable }); }
6851
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OwlDialogService, deps: [{ token: i1$3.Overlay }, { token: i0.Injector }, { token: i1$1.Location, optional: true }, { token: OWL_DIALOG_SCROLL_STRATEGY }, { token: OWL_DIALOG_DEFAULT_OPTIONS, optional: true }, { token: OwlDialogService, optional: true, skipSelf: true }, { token: i1$3.OverlayContainer }], target: i0.ɵɵFactoryTarget.Injectable }); }
6842
6852
  static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OwlDialogService }); }
6843
6853
  }
6844
6854
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OwlDialogService, decorators: [{
6845
6855
  type: Injectable
6846
- }], ctorParameters: function () { return [{ type: i1$2.Overlay }, { type: i0.Injector }, { type: i1.Location, decorators: [{
6856
+ }], ctorParameters: function () { return [{ type: i1$3.Overlay }, { type: i0.Injector }, { type: i1$1.Location, decorators: [{
6847
6857
  type: Optional
6848
6858
  }] }, { type: undefined, decorators: [{
6849
6859
  type: Inject,
@@ -6857,7 +6867,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
6857
6867
  type: Optional
6858
6868
  }, {
6859
6869
  type: SkipSelf
6860
- }] }, { type: i1$2.OverlayContainer }]; } });
6870
+ }] }, { type: i1$3.OverlayContainer }]; } });
6861
6871
  /**
6862
6872
  * Applies default options to the dialog config.
6863
6873
  * @param config Config to be modified.
@@ -7326,13 +7336,13 @@ class OwlDateTimeComponent extends OwlDateTime {
7326
7336
  }
7327
7337
  ]);
7328
7338
  }
7329
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OwlDateTimeComponent, deps: [{ token: i1$2.Overlay }, { token: i0.ViewContainerRef }, { token: OwlDialogService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: DateTimeAdapter, optional: true }, { token: OWL_DTPICKER_SCROLL_STRATEGY }, { token: OWL_DATE_TIME_FORMATS, optional: true }, { token: DOCUMENT, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
7339
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OwlDateTimeComponent, deps: [{ token: i1$3.Overlay }, { token: i0.ViewContainerRef }, { token: OwlDialogService }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }, { token: DateTimeAdapter, optional: true }, { token: OWL_DTPICKER_SCROLL_STRATEGY }, { token: OWL_DATE_TIME_FORMATS, optional: true }, { token: DOCUMENT, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
7330
7340
  static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: OwlDateTimeComponent, selector: "ofe-owl-date-time", inputs: { backdropClass: "backdropClass", panelClass: "panelClass", startAt: "startAt", pickerType: "pickerType", pickerMode: "pickerMode", disabled: "disabled", opened: "opened", scrollStrategy: "scrollStrategy" }, outputs: { afterPickerClosed: "afterPickerClosed", afterPickerOpen: "afterPickerOpen", yearSelected: "yearSelected", monthSelected: "monthSelected" }, exportAs: ["owlDateTime"], usesInheritance: true, ngImport: i0, template: "", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
7331
7341
  }
7332
7342
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: OwlDateTimeComponent, decorators: [{
7333
7343
  type: Component,
7334
7344
  args: [{ selector: 'ofe-owl-date-time', exportAs: 'owlDateTime', changeDetection: ChangeDetectionStrategy.OnPush, template: "" }]
7335
- }], ctorParameters: function () { return [{ type: i1$2.Overlay }, { type: i0.ViewContainerRef }, { type: OwlDialogService }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: DateTimeAdapter, decorators: [{
7345
+ }], ctorParameters: function () { return [{ type: i1$3.Overlay }, { type: i0.ViewContainerRef }, { type: OwlDialogService }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }, { type: DateTimeAdapter, decorators: [{
7336
7346
  type: Optional
7337
7347
  }] }, { type: undefined, decorators: [{
7338
7348
  type: Inject,
@@ -8086,7 +8096,7 @@ class NgxDatetimeComponent {
8086
8096
  useExisting: forwardRef(() => NgxDatetimeComponent),
8087
8097
  multi: true
8088
8098
  }
8089
- ], ngImport: i0, template: "<div class=\"date-time-picker-container\">\n <div\n data-date-picker\n data-date-picker-type=\"single\"\n class=\"cds--date-picker cds--date-picker--single cds--date-picker--light\"\n [ngClass]=\"{\n 'cds--date-picker--light': theme === 'light'\n}\"\n >\n <div class=\"cds--date-picker-container fill\">\n <div class=\"cds--date-picker-input__wrapper\">\n <input\n [disabled]=\"isDisabled\"\n (dateTimeChange)=\"onInput($event)\"\n type=\"text\"\n class=\"cds--date-picker__input fill\"\n [id]=\"id\"\n [value]=\"value\"\n [owlDateTime]=\"dt1\"\n [ofeOwlDateTimeTrigger]=\"dt1\"\n placeholder=\"mm/dd/yyyy\"\n data-date-picker-input\n />\n <svg\n [ofeOwlDateTimeTrigger]=\"dt1\"\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n style=\"will-change: transform\"\n xmlns=\"http://www.w3.org/2000/svg\"\n data-date-picker-icon=\"true\"\n class=\"cds--date-picker__icon\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M13,2h-2V1h-1v1H6V1H5v1H3C2.4,2,2,2.4,2,3v10c0,0.6,0.4,1,1,1h10c0.6,0,1-0.4,1-1V3C14,2.4,13.6,2,13,2z M13,13H3V6h10V13z M13,5H3V3h2v1h1V3h4v1h1V3h2V5z\"\n ></path>\n </svg>\n </div>\n </div>\n </div>\n\n <div\n *ngIf=\"showWeeks\"\n class=\"cds--select some-class week-select-wrapper\"\n [ngClass]=\"{'cds--select--light': theme === 'light'}\"\n >\n <div class=\"cds--select-input__wrapper\">\n <select\n (change)=\"onWeeksSelected($event.target.value)\"\n id=\"select-1\"\n class=\"cds--select-input\"\n >\n <option\n class=\"cds--select-option\"\n value=\"placeholder-item\"\n disabled=\"\"\n hidden=\"\"\n selected=\"\"\n >\n {{ 'selectWeeks' | translate }}\n </option>\n <option\n class=\"cds--select-option\"\n [value]=\"week\"\n *ngFor=\"let week of weeks\"\n >\n {{week}} {{ 'weeks' | translate }}\n </option>\n </select>\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n aria-hidden=\"true\"\n class=\"cds--select__arrow\"\n >\n <path d=\"M8 11L3 6 3.7 5.3 8 9.6 12.3 5.3 13 6z\"></path>\n </svg>\n </div>\n </div>\n</div>\n<ofe-owl-date-time\n [pickerType]=\"datePickerFormat ? datePickerFormat : 'calendar'\"\n [disabled]=\"isDisabled\"\n #dt1\n></ofe-owl-date-time>\n", styles: [".date-time-picker-container{display:grid;row-gap:1rem}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: i6.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i6.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: OwlDateTimeTriggerDirective, selector: "[ofeOwlDateTimeTrigger]", inputs: ["ofeOwlDateTimeTrigger", "disabled"] }, { kind: "directive", type: OwlDateTimeInputDirective, selector: "input[owlDateTime]", inputs: ["owlDateTime", "owlDateTimeFilter", "min", "max", "selectMode", "value", "values", "_disabled", "rangeSeparator"], outputs: ["dateTimeChange", "dateTimeInput"], exportAs: ["owlDateTimeInput"] }, { kind: "component", type: OwlDateTimeComponent, selector: "ofe-owl-date-time", inputs: ["backdropClass", "panelClass", "startAt", "pickerType", "pickerMode", "disabled", "opened", "scrollStrategy"], outputs: ["afterPickerClosed", "afterPickerOpen", "yearSelected", "monthSelected"], exportAs: ["owlDateTime"] }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] }); }
8099
+ ], ngImport: i0, template: "<div class=\"date-time-picker-container\">\n <div\n data-date-picker\n data-date-picker-type=\"single\"\n class=\"cds--date-picker cds--date-picker--single cds--date-picker--light\"\n [ngClass]=\"{\n 'cds--date-picker--light': theme === 'light'\n}\"\n >\n <div class=\"cds--date-picker-container fill\">\n <div class=\"cds--date-picker-input__wrapper\">\n <input\n [disabled]=\"isDisabled\"\n (dateTimeChange)=\"onInput($event)\"\n type=\"text\"\n class=\"cds--date-picker__input fill\"\n [id]=\"id\"\n [value]=\"value\"\n [owlDateTime]=\"dt1\"\n [ofeOwlDateTimeTrigger]=\"dt1\"\n placeholder=\"mm/dd/yyyy\"\n data-date-picker-input\n />\n <svg\n [ofeOwlDateTimeTrigger]=\"dt1\"\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n style=\"will-change: transform\"\n xmlns=\"http://www.w3.org/2000/svg\"\n data-date-picker-icon=\"true\"\n class=\"cds--date-picker__icon\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M13,2h-2V1h-1v1H6V1H5v1H3C2.4,2,2,2.4,2,3v10c0,0.6,0.4,1,1,1h10c0.6,0,1-0.4,1-1V3C14,2.4,13.6,2,13,2z M13,13H3V6h10V13z M13,5H3V3h2v1h1V3h4v1h1V3h2V5z\"\n ></path>\n </svg>\n </div>\n </div>\n </div>\n\n <div\n *ngIf=\"showWeeks\"\n class=\"cds--select some-class week-select-wrapper\"\n [ngClass]=\"{'cds--select--light': theme === 'light'}\"\n >\n <div class=\"cds--select-input__wrapper\">\n <select\n (change)=\"onWeeksSelected($event.target.value)\"\n id=\"select-1\"\n class=\"cds--select-input\"\n >\n <option\n class=\"cds--select-option\"\n value=\"placeholder-item\"\n disabled=\"\"\n hidden=\"\"\n selected=\"\"\n >\n {{ 'selectWeeks' | translate }}\n </option>\n <option\n class=\"cds--select-option\"\n [value]=\"week\"\n *ngFor=\"let week of weeks\"\n >\n {{week}} {{ 'weeks' | translate }}\n </option>\n </select>\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n aria-hidden=\"true\"\n class=\"cds--select__arrow\"\n >\n <path d=\"M8 11L3 6 3.7 5.3 8 9.6 12.3 5.3 13 6z\"></path>\n </svg>\n </div>\n </div>\n</div>\n<ofe-owl-date-time\n [pickerType]=\"datePickerFormat ? datePickerFormat : 'calendar'\"\n [disabled]=\"isDisabled\"\n #dt1\n></ofe-owl-date-time>\n", styles: [".date-time-picker-container{display:grid;row-gap:1rem}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i6.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: OwlDateTimeTriggerDirective, selector: "[ofeOwlDateTimeTrigger]", inputs: ["ofeOwlDateTimeTrigger", "disabled"] }, { kind: "directive", type: OwlDateTimeInputDirective, selector: "input[owlDateTime]", inputs: ["owlDateTime", "owlDateTimeFilter", "min", "max", "selectMode", "value", "values", "_disabled", "rangeSeparator"], outputs: ["dateTimeChange", "dateTimeInput"], exportAs: ["owlDateTimeInput"] }, { kind: "component", type: OwlDateTimeComponent, selector: "ofe-owl-date-time", inputs: ["backdropClass", "panelClass", "startAt", "pickerType", "pickerMode", "disabled", "opened", "scrollStrategy"], outputs: ["afterPickerClosed", "afterPickerOpen", "yearSelected", "monthSelected"], exportAs: ["owlDateTime"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] }); }
8090
8100
  }
8091
8101
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NgxDatetimeComponent, decorators: [{
8092
8102
  type: Component,
@@ -8164,7 +8174,7 @@ class CustomControlWrapperComponent {
8164
8174
  multi: true,
8165
8175
  useExisting: forwardRef(() => CustomControlWrapperComponent)
8166
8176
  }
8167
- ], ngImport: i0, template: "<div>\n <ng-template #error>{{ 'componentLoadingFailed' | translate }}</ng-template>\n <ng-template #loading>{{ 'loadingComponent' | translate }}</ng-template>\n <ax-lazy-element\n *axLazyElementDynamic=\"\n customControlConfig.tag;\n url: customControlConfig.url;\n module: true;\n errorTemplate: error;\n loadingTemplate: loading\n \"\n [question]=\"question\"\n [value]=\"value\"\n [disabled]=\"disabled\"\n (on-change)=\"onValueChange($event)\"\n [config]=\"config\"\n >\n </ax-lazy-element>\n</div>\n", dependencies: [{ kind: "directive", type: i1$3.LazyElementDynamicDirective, selector: "[axLazyElementDynamic]", inputs: ["axLazyElementDynamic", "axLazyElementDynamicUrl", "axLazyElementDynamicLoadingTemplate", "axLazyElementDynamicErrorTemplate", "axLazyElementDynamicModule", "axLazyElementDynamicImportMap"] }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] }); }
8177
+ ], ngImport: i0, template: "<div>\n <ng-template #error>{{ 'componentLoadingFailed' | translate }}</ng-template>\n <ng-template #loading>{{ 'loadingComponent' | translate }}</ng-template>\n <ax-lazy-element\n *axLazyElementDynamic=\"\n customControlConfig.tag;\n url: customControlConfig.url;\n module: true;\n errorTemplate: error;\n loadingTemplate: loading\n \"\n [question]=\"question\"\n [value]=\"value\"\n [disabled]=\"disabled\"\n (on-change)=\"onValueChange($event)\"\n [config]=\"config\"\n >\n </ax-lazy-element>\n</div>\n", dependencies: [{ kind: "directive", type: i1$4.LazyElementDynamicDirective, selector: "[axLazyElementDynamic]", inputs: ["axLazyElementDynamic", "axLazyElementDynamicUrl", "axLazyElementDynamicLoadingTemplate", "axLazyElementDynamicErrorTemplate", "axLazyElementDynamicModule", "axLazyElementDynamicImportMap"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] }); }
8168
8178
  }
8169
8179
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CustomControlWrapperComponent, decorators: [{
8170
8180
  type: Component,
@@ -8184,7 +8194,7 @@ class CustomComponentWrapperComponent {
8184
8194
  this.dark = true;
8185
8195
  }
8186
8196
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CustomComponentWrapperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
8187
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CustomComponentWrapperComponent, selector: "ofe-custom-component-wrapper", inputs: { componentConfigs: "componentConfigs", dark: "dark" }, ngImport: i0, template: "<div>\n <ng-template #error>{{ 'componentLoadingFailed' | translate }}</ng-template>\n <ng-template #loading>{{ 'loadingComponent' | translate }}</ng-template>\n <div *ngFor=\"let componentConfig of componentConfigs\">\n <ax-lazy-element\n *axLazyElementDynamic=\"\n componentConfig.tag;\n url: componentConfig.url;\n module: true;\n errorTemplate: error;\n loadingTemplate: loading\n \"\n [config]=\"componentConfig\"\n [dark]=\"dark\"\n >\n </ax-lazy-element>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.LazyElementDynamicDirective, selector: "[axLazyElementDynamic]", inputs: ["axLazyElementDynamic", "axLazyElementDynamicUrl", "axLazyElementDynamicLoadingTemplate", "axLazyElementDynamicErrorTemplate", "axLazyElementDynamicModule", "axLazyElementDynamicImportMap"] }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] }); }
8197
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CustomComponentWrapperComponent, selector: "ofe-custom-component-wrapper", inputs: { componentConfigs: "componentConfigs", dark: "dark" }, ngImport: i0, template: "<div>\n <ng-template #error>{{ 'componentLoadingFailed' | translate }}</ng-template>\n <ng-template #loading>{{ 'loadingComponent' | translate }}</ng-template>\n <div *ngFor=\"let componentConfig of componentConfigs\">\n <ax-lazy-element\n *axLazyElementDynamic=\"\n componentConfig.tag;\n url: componentConfig.url;\n module: true;\n errorTemplate: error;\n loadingTemplate: loading\n \"\n [config]=\"componentConfig\"\n [dark]=\"dark\"\n >\n </ax-lazy-element>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$4.LazyElementDynamicDirective, selector: "[axLazyElementDynamic]", inputs: ["axLazyElementDynamic", "axLazyElementDynamicUrl", "axLazyElementDynamicLoadingTemplate", "axLazyElementDynamicErrorTemplate", "axLazyElementDynamicModule", "axLazyElementDynamicImportMap"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] }); }
8188
8198
  }
8189
8199
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CustomComponentWrapperComponent, decorators: [{
8190
8200
  type: Component,
@@ -8203,7 +8213,7 @@ class TabComponent {
8203
8213
  this.customPaneClass = '';
8204
8214
  }
8205
8215
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
8206
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TabComponent, selector: "ofe-tab", inputs: { tabTitle: "tabTitle", tabSubTitle: "tabSubTitle", active: "active", disabled: "disabled", bypassDOM: "bypassDOM", customPaneClass: "customPaneClass" }, queries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0, template: "<div *ngIf=\"active\" class=\"pane\" [ngClass]=\"customPaneClass\">\n <h4>{{ tabTitle }}</h4>\n <div *ngIf=\"bypassDOM\">\n <ng-container [ngTemplateOutlet]=\"template\"></ng-container>\n </div>\n <div *ngIf=\"!bypassDOM\">\n <ng-content></ng-content>\n </div>\n</div>\n", styles: ["h4{padding-left:1rem;margin-bottom:.5rem}h4:after{content:\"\";display:block;width:2rem;padding-top:.188rem;border-bottom:.375rem solid var(--brand-01)}.pane{background-color:#f4f4f4;margin:.5rem .125rem}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
8216
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TabComponent, selector: "ofe-tab", inputs: { tabTitle: "tabTitle", tabSubTitle: "tabSubTitle", active: "active", disabled: "disabled", bypassDOM: "bypassDOM", customPaneClass: "customPaneClass" }, queries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0, template: "<div *ngIf=\"active\" class=\"pane\" [ngClass]=\"customPaneClass\">\n <h4>{{ tabTitle }}</h4>\n <div *ngIf=\"bypassDOM\">\n <ng-container [ngTemplateOutlet]=\"template\"></ng-container>\n </div>\n <div *ngIf=\"!bypassDOM\">\n <ng-content></ng-content>\n </div>\n</div>\n", styles: ["h4{padding-left:1rem;margin-bottom:.5rem}h4:after{content:\"\";display:block;width:2rem;padding-top:.188rem;border-bottom:.375rem solid var(--brand-01)}.pane{background-color:#f4f4f4;margin:.5rem .125rem}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
8207
8217
  }
8208
8218
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TabComponent, decorators: [{
8209
8219
  type: Component,
@@ -8300,7 +8310,7 @@ class TabSetComponent {
8300
8310
  }
8301
8311
  }
8302
8312
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TabSetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
8303
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TabSetComponent, selector: "ofe-tab-set", inputs: { disableStyle: "disableStyle", customNavClass: "customNavClass", customTabsClass: "customTabsClass", selectedIndex: "selectedIndex", formSubmissionTemplate: "formSubmissionTemplate" }, outputs: { tabSelect: "tabSelect" }, queries: [{ propertyName: "tabs", predicate: TabComponent }], usesOnChanges: true, ngImport: i0, template: "<div class=\"tab-container\">\n <section>\n <div class=\"tab\">\n <button\n ofeHoverClass=\"hover\"\n class=\"tablinks completed\"\n *ngFor=\"let tab of tabs\"\n (click)=\"selectTab(tab)\"\n [class]=\"getStatusClasses(tab.active, tab.disabled)\"\n >\n <span>{{ tab.tabTitle }}</span>\n </button>\n <ng-container *ngTemplateOutlet=\"formSubmissionTemplate\"></ng-container>\n </div>\n </section>\n <section id=\"tab\" class=\"tab-content\">\n <ng-content></ng-content>\n </section>\n</div>\n", styles: [".tab{width:10rem;position:fixed}.tab button{font-family:inherit;display:block;background-color:inherit;width:100%;border:none;outline:none;text-align:left;transition:.3s;min-height:2rem;white-space:normal;word-wrap:break-word;margin:0 0 .063rem}.tab button :hover{cursor:pointer}@media screen and (max-width: 768px){.tab button{height:3rem;border-bottom:.0125rem solid var(--open-mrs-background-gray);width:10rem}}.tab button.active.hover,.tab button.enabled.hover{background-color:var(--gray-gray-10)}.tab button.completed{border-left:.5rem solid var(--inverse-support-02);background-color:var(--color-green-10);font-size:.875rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:1.43;letter-spacing:.16px;color:#161616}.tab button.active{background-color:#ededed;border-left:.5rem solid #009d9a;font-size:.875rem;font-weight:600;font-stretch:normal;font-style:normal;line-height:1.43;letter-spacing:.16px;color:#161616}.tab button.enabled{background-color:#fff;border-left:.5rem solid #9ef0f0;font-size:.875rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:1.43;letter-spacing:.16px;color:var(--color-gray-100)}.tab button.error{background-color:var(--color-red-10);border-left:.5rem solid var(--open-mrs-danger-red-60);font-size:.875rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:1.29;letter-spacing:.16px;color:#da1e28}.tab button.disabled{background-color:#fff;border-left:.5rem solid #dae0e0;font-size:.875rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:1.43;letter-spacing:.16px;color:var(--gray-gray-30)}.tab button.active.error{background-color:var(--color-red-20);border-left:.5rem solid var(--open-mrs-danger-red-60);font-size:.875rem;font-weight:600;font-stretch:normal;font-style:normal;line-height:1.29;letter-spacing:.16px;color:#da1e28}.tab-container{display:grid;grid-template-columns:179px auto}.tab-content{overflow-x:hidden}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: HoverClassDirective, selector: "[ofeHoverClass]", inputs: ["hoverClass"] }] }); }
8313
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TabSetComponent, selector: "ofe-tab-set", inputs: { disableStyle: "disableStyle", customNavClass: "customNavClass", customTabsClass: "customTabsClass", selectedIndex: "selectedIndex", formSubmissionTemplate: "formSubmissionTemplate" }, outputs: { tabSelect: "tabSelect" }, queries: [{ propertyName: "tabs", predicate: TabComponent }], usesOnChanges: true, ngImport: i0, template: "<div class=\"tab-container\">\n <section>\n <div class=\"tab\">\n <button\n ofeHoverClass=\"hover\"\n class=\"tablinks completed\"\n *ngFor=\"let tab of tabs\"\n (click)=\"selectTab(tab)\"\n [class]=\"getStatusClasses(tab.active, tab.disabled)\"\n >\n <span>{{ tab.tabTitle }}</span>\n </button>\n <ng-container *ngTemplateOutlet=\"formSubmissionTemplate\"></ng-container>\n </div>\n </section>\n <section id=\"tab\" class=\"tab-content\">\n <ng-content></ng-content>\n </section>\n</div>\n", styles: [".tab{width:10rem;position:fixed}.tab button{font-family:inherit;display:block;background-color:inherit;width:100%;border:none;outline:none;text-align:left;transition:.3s;min-height:2rem;white-space:normal;word-wrap:break-word;margin:0 0 .063rem}.tab button :hover{cursor:pointer}@media screen and (max-width: 768px){.tab button{height:3rem;border-bottom:.0125rem solid var(--open-mrs-background-gray);width:10rem}}.tab button.active.hover,.tab button.enabled.hover{background-color:var(--gray-gray-10)}.tab button.completed{border-left:.5rem solid var(--inverse-support-02);background-color:var(--color-green-10);font-size:.875rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:1.43;letter-spacing:.16px;color:#161616}.tab button.active{background-color:#ededed;border-left:.5rem solid #009d9a;font-size:.875rem;font-weight:600;font-stretch:normal;font-style:normal;line-height:1.43;letter-spacing:.16px;color:#161616}.tab button.enabled{background-color:#fff;border-left:.5rem solid #9ef0f0;font-size:.875rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:1.43;letter-spacing:.16px;color:var(--color-gray-100)}.tab button.error{background-color:var(--color-red-10);border-left:.5rem solid var(--open-mrs-danger-red-60);font-size:.875rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:1.29;letter-spacing:.16px;color:#da1e28}.tab button.disabled{background-color:#fff;border-left:.5rem solid #dae0e0;font-size:.875rem;font-weight:400;font-stretch:normal;font-style:normal;line-height:1.43;letter-spacing:.16px;color:var(--gray-gray-30)}.tab button.active.error{background-color:var(--color-red-20);border-left:.5rem solid var(--open-mrs-danger-red-60);font-size:.875rem;font-weight:600;font-stretch:normal;font-style:normal;line-height:1.29;letter-spacing:.16px;color:#da1e28}.tab-container{display:grid;grid-template-columns:179px auto}.tab-content{overflow-x:hidden}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: HoverClassDirective, selector: "[ofeHoverClass]", inputs: ["hoverClass"] }] }); }
8304
8314
  }
8305
8315
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TabSetComponent, decorators: [{
8306
8316
  type: Component,
@@ -8424,7 +8434,7 @@ class AppointmentsOverviewComponent {
8424
8434
  this.today = '';
8425
8435
  }
8426
8436
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AppointmentsOverviewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
8427
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: AppointmentsOverviewComponent, selector: "ofe-appointments-overview", inputs: { node: "node" }, usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"showAppointments\" class=\"container\">\n <div *ngIf=\"loadingAppointments\">\n <span *ngIf=\"!appointmentsLoaded && errorLoadingAppointments\"\n >Error checking appointments</span\n >\n <div\n *ngIf=\"loadingAppointments\"\n class=\"cds--inline-loading\"\n aria-live=\"assertive\"\n >\n <div class=\"cds--inline-loading__animation\">\n <div\n aria-atomic=\"true\"\n aria-labelledby=\"loading-id-2\"\n aria-live=\"assertive\"\n class=\"cds--loading cds--loading--small\"\n >\n <label id=\"loading-id-2\" class=\"cds--visually-hidden\"\n >Active loading indicator</label\n ><svg class=\"cds--loading__svg\" viewBox=\"0 0 100 100\">\n <title>Active loading indicator</title>\n <circle\n class=\"cds--loading__background\"\n cx=\"50%\"\n cy=\"50%\"\n r=\"44\"\n ></circle>\n <circle\n class=\"cds--loading__stroke\"\n cx=\"50%\"\n cy=\"50%\"\n r=\"44\"\n ></circle>\n </svg>\n </div>\n </div>\n <div class=\"cds--inline-loading__text\">Loading...</div>\n </div>\n </div>\n\n <div\n class=\"cds--data-table-content\"\n *ngIf=\"appointmentsLoaded && !errorLoadingAppointments\"\n >\n <table class=\"cds--data-table cds--data-table--no-border\">\n <thead>\n <tr>\n <th\n *ngFor=\"let appointment of appointments\"\n scope=\"col\"\n [ngClass]=\"{ active: appointment.date === today }\"\n >\n {{ appointment.date }}\n </th>\n </tr>\n </thead>\n <tbody aria-live=\"polite\">\n <tr>\n <td\n *ngFor=\"let appointment of appointments\"\n [ngClass]=\"{ active: appointment.date === today }\"\n >\n {{ appointment.count }}\n </td>\n </tr>\n </tbody>\n </table>\n </div>\n</div>\n", styles: [".container{margin-top:.625rem}.active{background-color:#e0e0e0;cursor:pointer}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
8437
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: AppointmentsOverviewComponent, selector: "ofe-appointments-overview", inputs: { node: "node" }, usesOnChanges: true, ngImport: i0, template: "<div *ngIf=\"showAppointments\" class=\"container\">\n <div *ngIf=\"loadingAppointments\">\n <span *ngIf=\"!appointmentsLoaded && errorLoadingAppointments\"\n >Error checking appointments</span\n >\n <div\n *ngIf=\"loadingAppointments\"\n class=\"cds--inline-loading\"\n aria-live=\"assertive\"\n >\n <div class=\"cds--inline-loading__animation\">\n <div\n aria-atomic=\"true\"\n aria-labelledby=\"loading-id-2\"\n aria-live=\"assertive\"\n class=\"cds--loading cds--loading--small\"\n >\n <label id=\"loading-id-2\" class=\"cds--visually-hidden\"\n >Active loading indicator</label\n ><svg class=\"cds--loading__svg\" viewBox=\"0 0 100 100\">\n <title>Active loading indicator</title>\n <circle\n class=\"cds--loading__background\"\n cx=\"50%\"\n cy=\"50%\"\n r=\"44\"\n ></circle>\n <circle\n class=\"cds--loading__stroke\"\n cx=\"50%\"\n cy=\"50%\"\n r=\"44\"\n ></circle>\n </svg>\n </div>\n </div>\n <div class=\"cds--inline-loading__text\">Loading...</div>\n </div>\n </div>\n\n <div\n class=\"cds--data-table-content\"\n *ngIf=\"appointmentsLoaded && !errorLoadingAppointments\"\n >\n <table class=\"cds--data-table cds--data-table--no-border\">\n <thead>\n <tr>\n <th\n *ngFor=\"let appointment of appointments\"\n scope=\"col\"\n [ngClass]=\"{ active: appointment.date === today }\"\n >\n {{ appointment.date }}\n </th>\n </tr>\n </thead>\n <tbody aria-live=\"polite\">\n <tr>\n <td\n *ngFor=\"let appointment of appointments\"\n [ngClass]=\"{ active: appointment.date === today }\"\n >\n {{ appointment.count }}\n </td>\n </tr>\n </tbody>\n </table>\n </div>\n</div>\n", styles: [".container{margin-top:.625rem}.active{background-color:#e0e0e0;cursor:pointer}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
8428
8438
  }
8429
8439
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AppointmentsOverviewComponent, decorators: [{
8430
8440
  type: Component,
@@ -8745,13 +8755,13 @@ class FormRendererComponent {
8745
8755
  .question;
8746
8756
  return questionGroup.questions.indexOf(node.question);
8747
8757
  }
8748
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormRendererComponent, deps: [{ token: ValidationFactory }, { token: DataSources }, { token: FormErrorsService }, { token: i4.TranslateService }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
8749
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormRendererComponent, selector: "ofe-form-renderer", inputs: { formSubmissionTemplate: "formSubmissionTemplate", parentComponent: "parentComponent", node: "node", parentGroup: "parentGroup", theme: "theme", labelMap: "labelMap", controlId: "controlId" }, usesOnChanges: true, ngImport: i0, template: "<!--CONTAINERS-->\n<div *ngIf=\"node.question.renderingType === 'form'\">\n <ofe-tab-set\n (tabSelect)=\"tabSelected($event)\"\n [selectedIndex]=\"activeTab\"\n [formSubmissionTemplate]=\"formSubmissionTemplate\"\n >\n <ofe-tab\n [tabTitle]=\"question.label | translate\"\n *ngFor=\"let question of node.question.questions; let i = index\"\n >\n <ofe-form-renderer\n [node]=\"node.children[question.key] | translate\"\n [parentComponent]=\"this\"\n [parentGroup]=\"node.control\"\n [labelMap]=\"labelMap\"\n >\n </ofe-form-renderer>\n\n <!-- Buttons for navigating between tabs -->\n <div class=\"cds--btn-set button-set\">\n <button\n class=\"cds--btn cds--btn--ghost nav-button\"\n [disabled]=\"i === 0\"\n type=\"button\"\n >\n <a *ngIf=\"i > 0\" (click)=\"tabSelected(i - 1)\" class=\"nav-link\">\n <label class=\"nav-label\">{{ 'previous' | translate }}</label>\n <span class=\"nav-link-text\">{{\n node.question.questions[i - 1].label\n }}</span>\n </a>\n </button>\n <button\n class=\"cds--btn cds--btn--ghost nav-button\"\n [disabled]=\"i === node.question.questions.length - 1\"\n type=\"button\"\n >\n <a\n *ngIf=\"i < node.question.questions.length - 1\"\n (click)=\"tabSelected(i + 1)\"\n class=\"nav-link\"\n >\n <label class=\"nav-label\">{{ 'next' | translate }}</label>\n <span class=\"nav-link-text\">{{\n node.question.questions[i + 1].label\n }}</span>\n </a>\n </button>\n </div>\n </ofe-tab>\n <div *ngIf=\"showErrors()\" class=\"container\">\n <div\n data-notification\n *ngFor=\"let errorNode of errorNodes\"\n class=\"cds--inline-notification cds--inline-notification--error cds--inline-notification--low-contrast pointer\"\n role=\"alert\"\n (click)=\"announceErrorField(errorNode)\"\n >\n <div class=\"cds--inline-notification__details\">\n <div class=\"cds--inline-notification__text-wrapper\">\n <p class=\"cds--inline-notification__title\">\n {{ errorNode.question.label | translate }}\n </p>\n <p class=\"cds--inline-notification__subtitle\">\n {{ getControlError(errorNode | translate) }}\n </p>\n </div>\n </div>\n <button\n tabindex=\"0\"\n class=\"cds--inline-notification__action-button cds--btn cds--btn--sm cds--btn--ghost\"\n type=\"button\"\n >\n {{ 'fix' | translate }}\n </button>\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n style=\"will-change: transform\"\n xmlns=\"http://www.w3.org/2000/svg\"\n class=\"cds--inline-notification__icon\"\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M10,1c-5,0-9,4-9,9s4,9,9,9s9-4,9-9S15,1,10,1z M13.5,14.5l-8-8l1-1l8,8L13.5,14.5z\"\n ></path>\n <path\n d=\"M13.5,14.5l-8-8l1-1l8,8L13.5,14.5z\"\n data-icon-path=\"inner-path\"\n opacity=\"0\"\n ></path>\n </svg>\n </div>\n </div>\n </ofe-tab-set>\n</div>\n<div *ngIf=\"node.question.renderingType === 'page'\">\n <!--Page Components-->\n <ofe-custom-component-wrapper\n [dark]=\"theme === 'light'\"\n [componentConfigs]=\"node.question.componentConfigs\"\n >\n </ofe-custom-component-wrapper>\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"parentGroup\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n</div>\n<div *ngIf=\"node.question.renderingType === 'section' && checkSection(node)\">\n <div class=\"cds--layout\">\n <ul class=\"cds--accordion cds--accordion--end\">\n <li\n class=\"cds--accordion__item accordion-content-override\"\n [ngClass]=\"{ 'cds--accordion__item--active': !isCollapsed }\"\n >\n <button\n type=\"button\"\n aria-controls=\"accordion-item-:r27:\"\n aria-expanded=\"false\"\n (click)=\"isCollapsed = !isCollapsed\"\n class=\"cds--accordion__heading\"\n >\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n aria-hidden=\"true\"\n class=\"cds--accordion__arrow\"\n >\n <path d=\"M11 8L6 13 5.3 12.3 9.6 8 5.3 3.7 6 3z\"></path>\n </svg>\n <div class=\"cds--accordion__title\">\n {{ node.question.label | translate }}\n </div>\n </button>\n <div id=\"accordion-item-:r27:\" class=\"cds--accordion__content\">\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"parentGroup\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n </div>\n </li>\n </ul>\n </div>\n</div>\n\n<!--CONTROLS-->\n\n<div\n *ngIf=\"node.question.controlType === 0\"\n [formGroup]=\"parentGroup\"\n [hidden]=\"node.control.hidden\"\n [ngClass]=\"{ disabled: node.control.disabled }\"\n>\n <ofe-custom-component-wrapper\n [dark]=\"!(theme === 'light')\"\n [componentConfigs]=\"node.question.componentConfigs\"\n >\n </ofe-custom-component-wrapper>\n <div class=\"cds--form-item\">\n <!--LEAF CONTROL-->\n <div class=\"question-area\">\n <a\n class=\"form-tooltip pull-right\"\n (click)=\"toggleInformation(node.question.extras.id)\"\n data-placement=\"right\"\n *ngIf=\"\n node.question &&\n node.question.extras.questionInfo &&\n node.question.extras.questionInfo !== '' &&\n node.question.extras.questionInfo !== ' '\n \"\n >\n <i class=\"glyphicon glyphicon-question-sign\" aria-hidden=\"true\"></i>\n </a>\n\n <label\n *ngIf=\"node.question.label\"\n [style.color]=\"hasErrors() ? 'red' : ''\"\n class=\"cds--label\"\n [attr.for]=\"node.question.key | translate\"\n >\n {{ node.question.required ? '*' : '' }}\n {{ node.question.prefix ? node.question.prefix + ' ' : '' }}\n {{ node.question.label | translate }}\n </label>\n\n <div\n *ngIf=\"\n node.question.extras.questionOptions.customControl;\n else nativeControls\n \"\n >\n <ofe-custom-control-wrapper\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [question]=\"node.question\"\n >\n </ofe-custom-control-wrapper>\n </div>\n\n <ng-template #nativeControls>\n <div class=\"afe-control\" [ngSwitch]=\"node.question.renderingType\">\n <ofe-select\n [theme]=\"theme\"\n *ngSwitchCase=\"'select'\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n >\n <option\n *ngFor=\"let option of node.question.options\"\n [value]=\"option.value\"\n >\n {{ option.label | translate }}\n </option>\n </ofe-select>\n\n <div *ngSwitchCase=\"'file'\">\n <ofe-file-upload\n [dataSource]=\"dataSource\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n (fileChanged)=\"upload($event)\"\n >\n </ofe-file-upload>\n </div>\n\n <textarea\n [theme]=\"theme\"\n ofeTextAreaInput\n [ngClass]=\"{\n 'cds--text-area--light': theme === 'light',\n 'cds--text-area--invalid': !node.control.valid\n }\"\n [placeholder]=\"node.question.placeholder | translate\"\n [rows]=\"node.question.rows\"\n class=\"cds--text-area\"\n *ngSwitchCase=\"'textarea'\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [readOnly]=\"node.question.extras.readOnly\"\n >\n </textarea>\n\n <ofe-remote-select\n [theme]=\"theme\"\n *ngSwitchCase=\"'remote-select'\"\n [placeholder]=\"node.question.placeholder | translate\"\n tabindex=\"0\"\n [dataSource]=\"dataSource\"\n [componentID]=\"node.question.key + 'id'\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n ></ofe-remote-select>\n\n <ofe-ngx-date-time-picker\n [weeks]=\"node.question.extras.questionOptions.weeksList\"\n [showWeeks]=\"node.question.showWeeksAdder\"\n [theme]=\"theme\"\n [id]=\"node.question.key + 'id'\"\n [formControlName]=\"node.question.key\"\n *ngSwitchCase=\"'date'\"\n [datePickerFormat]=\"node.question.datePickerFormat\"\n >\n </ofe-ngx-date-time-picker>\n <ng-select\n [ngClass]=\"{ 'afe-custom': theme === 'light' }\"\n [id]=\"node.question.key + 'id'\"\n *ngSwitchCase=\"'multi-select'\"\n [multiple]=\"true\"\n [appendTo]=\"'#' + node.question.key + 'id'\"\n placeholder=\"\"\n clearAllText=\"Clear\"\n [formControlName]=\"node.question.key\"\n >\n <ng-option\n *ngFor=\"let option of node.question.options\"\n [value]=\"option.value\"\n >\n {{ option.label | translate }}\n </ng-option>\n </ng-select>\n\n <ng-select\n [ngClass]=\"{ 'afe-custom': theme === 'light' }\"\n [id]=\"node.question.key + 'id'\"\n *ngSwitchCase=\"'single-select'\"\n placeholder=\"\"\n clearAllText=\"Clear\"\n [formControlName]=\"node.question.key\"\n >\n <ng-option\n *ngFor=\"let option of node.question.options\"\n [value]=\"option.value\"\n >\n {{ option.label | translate }}\n </ng-option>\n </ng-select>\n\n <ofe-number-input\n [theme]=\"theme\"\n *ngSwitchCase=\"'number'\"\n [id]=\"node.question.key + 'id'\"\n [min]=\"node.question.extras.questionOptions.min\"\n [max]=\"node.question.extras.questionOptions.max\"\n [maxlength]=\"node.question.extras.questionOptions.maxLength\"\n [minlength]=\"node.question.extras.questionOptions.minLength\"\n [formControlName]=\"node.question.key\"\n [attr.placeholder]=\"node.question.placeholder | translate\"\n >\n </ofe-number-input>\n\n <div *ngSwitchCase=\"'workspace-launcher'\">\n <ofe-workspace-launcher\n [id]=\"node.question.key + 'id'\"\n [buttonLabel]=\"node.question.extras.questionOptions.buttonLabel\"\n [buttonType]=\"node.question.extras.questionOptions.buttonType\"\n [workspaceName]=\"\n node.question.extras.questionOptions.workspaceName\n \"\n ></ofe-workspace-launcher>\n </div>\n\n <input\n [theme]=\"theme\"\n class=\"cds--text-input\"\n ofeTextInput\n *ngSwitchDefault\n [formControlName]=\"node.question.key\"\n [attr.placeholder]=\"node.question.placeholder | translate\"\n [type]=\"node.question.renderingType\"\n [id]=\"node.question.key + 'id'\"\n [readOnly]=\"node.question.extras.readOnly\"\n />\n\n <div *ngSwitchCase=\"'radio'\">\n <ofe-radio-button\n [id]=\"node.question.key + 'id' + controlId\"\n [formControlName]=\"node.question.key\"\n [options]=\"node.question.options\"\n [allowUnselect]=\"node.question.allowUnselect\"\n [selected]=\"node.control.value\"\n [orientation]=\"node.question.orientation\"\n ></ofe-radio-button>\n </div>\n\n <div *ngSwitchCase=\"'checkbox'\">\n <ofe-checkbox\n [id]=\"node.question.key + 'id' + controlId\"\n [formControlName]=\"node.question.key\"\n [options]=\"node.question.options\"\n [selected]=\"node.control.value\"\n ></ofe-checkbox>\n </div>\n\n <div\n *ngIf=\"\n node.question.enableHistoricalValue &&\n node.question.historicalDisplay\n \"\n style=\"margin-top: 2px\"\n >\n <div class=\"container-fluid\">\n <div class=\"use-value\">\n <div class=\"col-xs-9\">\n <span class=\"text-warning\"\n >{{ 'previousValue' | translate }}:\n </span>\n <strong>{{ node.question.historicalDisplay?.text }}</strong>\n <span *ngIf=\"node.question.showHistoricalValueDate\">\n <span> | </span>\n <strong class=\"text-primary\"\n >{{ node.question.historicalDisplay?._date | date }}\n </strong>\n <span\n class=\"text-primary\"\n *ngIf=\"\n node.question.historicalDisplay &&\n node.question.historicalDisplay._date\n \"\n >\n ({{\n node.question.historicalDisplay._date | timeAgo\n }})</span\n >\n </span>\n </div>\n <button\n type=\"button\"\n [name]=\"'historyValue'\"\n class=\"cds--btn cds--btn--primary cds--btn--sm col-xs-3\"\n >\n {{ 'useValue' | translate }}\n </button>\n </div>\n </div>\n </div>\n <ofe-appointments-overview [node]=\"node\"></ofe-appointments-overview>\n <div *ngIf=\"hasErrors()\">\n <div *ngFor=\"let e of errors()\">\n <span class=\"text-danger\">{{ e }}</span>\n </div>\n </div>\n </div>\n </ng-template>\n\n <div\n class=\"question-info col-md-12 col-lg-12 col-sm-12\"\n id=\"{{ node.question.extras.id }}\"\n *ngIf=\"\n node.question &&\n node.question.extras.questionInfo &&\n node.question.extras.questionInfo !== '' &&\n node.question.extras.questionInfo !== ' '\n \"\n >\n {{ node.question.extras.questionInfo | translate }}\n </div>\n </div>\n </div>\n</div>\n\n<!-- MESSAGES -->\n<label\n *ngIf=\"node.control && node.control.alert && node.control.alert !== ''\"\n class=\"cds--label text-warn\"\n style=\"display: flex; align-items: center; margin: 0.125rem 0\"\n>\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 32 32\"\n aria-hidden=\"true\"\n >\n <path\n fill=\"none\"\n d=\"M16,26a1.5,1.5,0,1,1,1.5-1.5A1.5,1.5,0,0,1,16,26Zm-1.125-5h2.25V12h-2.25Z\"\n data-icon-path=\"inner-path\"\n ></path>\n <path\n d=\"M16.002,6.1714h-.004L4.6487,27.9966,4.6506,28H27.3494l.0019-.0034ZM14.875,12h2.25v9h-2.25ZM16,26a1.5,1.5,0,1,1,1.5-1.5A1.5,1.5,0,0,1,16,26Z\"\n ></path>\n <path\n d=\"M29,30H3a1,1,0,0,1-.8872-1.4614l13-25a1,1,0,0,1,1.7744,0l13,25A1,1,0,0,1,29,30ZM4.6507,28H27.3493l.002-.0033L16.002,6.1714h-.004L4.6487,27.9967Z\"\n ></path>\n <title>Warning alt filled</title>\n </svg>\n {{ node.control.alert | translate }}\n</label>\n\n<div\n *ngIf=\"node.question.controlType === 1\"\n [hidden]=\"node.control.hidden\"\n [ngClass]=\"{ disabled: node.control.disabled }\"\n>\n <!--ARRAY CONTROL-->\n <div [ngSwitch]=\"node.question.renderingType\">\n <div class=\"well\" style=\"padding: 2px\" *ngSwitchCase=\"'repeating'\">\n <h4 style=\"margin: 2px; font-weight: bold\">\n {{ node.question.label | translate }}\n </h4>\n <div>\n <label\n class=\"cds--label\"\n *ngIf=\"node.question.extras.questionOptions.min\"\n style=\"margin-right: 2px\"\n >min: {{ node.question.extras.questionOptions.min }}</label\n >\n <label\n class=\"cds--label\"\n *ngIf=\"node.question.extras.questionOptions.max\"\n >max: {{ node.question.extras.questionOptions.max }}</label\n >\n </div>\n <hr\n style=\"\n margin-left: -2px;\n margin-right: -2px;\n margin-bottom: 4px;\n margin-top: 8px;\n border-width: 2px;\n \"\n />\n <div [ngSwitch]=\"node.question.extras.type\">\n <div *ngSwitchCase=\"'testOrder'\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n <div>{{ child.orderNumber }}</div>\n <div class=\"cds--layout\">\n <button\n type=\"button \"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n </div>\n <br />\n <hr\n style=\"\n margin-left: -2px;\n margin-right: -2px;\n margin-bottom: 4px;\n margin-top: 8px;\n border-width: 1px;\n \"\n />\n </div>\n </div>\n\n <div *ngSwitchCase=\"'diagnosis'\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n <button\n type=\"button \"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n <br />\n <hr\n style=\"\n margin-left: -2px;\n margin-right: -2px;\n margin-bottom: 4px;\n margin-top: 8px;\n border-width: 1px;\n \"\n />\n </div>\n </div>\n\n <div *ngSwitchCase=\"'obsGroup'\" style=\"margin-bottom: 20px\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n [controlId]=\"i\"\n ></ofe-form-renderer>\n <button\n type=\"button\"\n style=\"width: 100px\"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n <br />\n <hr\n style=\"\n margin-left: -2px;\n margin-right: -2px;\n margin-bottom: 4px;\n margin-top: 8px;\n border-width: 1px;\n \"\n />\n </div>\n </div>\n <div *ngSwitchCase=\"'diagnosisGroup'\" style=\"margin-bottom: 20px\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n [controlId]=\"i\"\n ></ofe-form-renderer>\n <button\n type=\"button\"\n style=\"width: 100px\"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n <br />\n <hr\n style=\"\n margin-left: -2px;\n margin-right: -2px;\n margin-bottom: 4px;\n margin-top: 8px;\n border-width: 1px;\n \"\n />\n </div>\n </div>\n </div>\n <button\n type=\"button\"\n class=\"cds--btn cds--btn--primary cds--btn--sm\"\n (click)=\"node.createChildNode()\"\n [ngClass]=\"{\n disabled:\n node.children.length >= node.question.extras.questionOptions.max\n }\"\n >\n {{ 'add' | translate }}\n </button>\n </div>\n </div>\n</div>\n<div\n *ngIf=\"node.question.controlType === 2\"\n [hidden]=\"node.control.hidden\"\n [ngClass]=\"{ disabled: node.control.disabled }\"\n>\n <!--GROUP-->\n <div [ngSwitch]=\"node.question.renderingType\">\n <div *ngSwitchCase=\"'group'\">\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"node.control\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n </div>\n <div\n *ngSwitchCase=\"'field-set'\"\n style=\"border: 1px solid #eeeeee; padding: 2px; margin: 2px\"\n >\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"node.control\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n </div>\n </div>\n</div>\n", styles: ["", ".button-set{margin-top:1rem}.nav-button{border-top:1px solid #dde1e6;height:5rem;max-width:50%;min-width:50%;padding-block:.25rem}.nav-link{min-width:100%;display:flex;align-content:flex-start;align-items:baseline;flex-direction:column}.nav-link-text{margin-top:.125rem;font-size:var(--cds-heading-03-font-size, 1.25rem);font-weight:var(--cds-heading-03-font-weight, 400);line-height:var(--cds-heading-03-line-height, 1.4);letter-spacing:var(--cds-heading-03-letter-spacing, 0)}.nav-label{font-size:var(--cds-label-01-font-size, .75rem);font-weight:var(--cds-label-01-font-weight, 400);line-height:var(--cds-label-01-line-height, 1.33333);letter-spacing:var(--cds-label-01-letter-spacing, .32px)}ul{list-style-type:none;margin:2px auto;position:relative}li{display:block;padding:10px 20px;transition:all .3s ease-in;border-bottom:4px solid transparent}li:hover{border-bottom:4px solid white;opacity:.7;cursor:pointer}.owl-theme .owl-controls .owl-nav{position:absolute;width:100%;top:0}.owl-theme .owl-controls .owl-nav [class*=owl-]{position:absolute;background:none;color:#000}.owl-theme .owl-controls .owl-nav [class*=owl-]:hover{background:none;color:#000}.owl-theme .owl-controls .owl-nav .owl-next{right:0;transform:translate(120%)}.owl-theme .owl-controls .owl-nav .owl-prev{left:0;transform:translate(-120%)}.disabled{opacity:.5;pointer-events:none}.select2-container{margin-top:-5px}.btn{padding:0 12px!important}.form-tooltip{color:#337ab7;display:inline-block}.question-info{opacity:0;height:0px;display:none;transition-duration:opacity 1s ease-out;transition-delay:.5s;padding-top:2px;padding-bottom:2px;color:#696969;border-style:ridge;border-width:1px;border-color:#337ab7;margin-top:2px}.hide-info{display:none;height:0px}.form-tooltip:hover~.question-info{display:block;opacity:1;height:auto}.form-tooltip .tooltipcontent:after{content:\" \";position:absolute;bottom:100%;right:0%;margin-left:-5px;border-width:5px;border-style:solid;border-top-color:transparent;border-right-color:transparent;border-bottom-color:#337ab7;border-left-color:transparent}ng-select.form-control{padding-top:0;height:auto;padding-bottom:0}.forms-dropdown-menu{max-height:450px;overflow-y:scroll}.no-border{border:0;box-shadow:none}.text-danger{color:var(--cds-support-01, #da1e28)}.text-warn{color:#eea616}.error{margin-bottom:3rem}.afe-control{margin-bottom:.125rem}[hidden]{display:none!important}.accordion-content-dark{background-color:#f4f4f4;padding-right:1rem}.accordion-content-override{box-sizing:content-box;border-bottom:none;padding:0;overflow-wrap:break-word}.accordion-content-override:hover{opacity:unset;border-bottom:none}.question-area{margin-bottom:.5rem;width:100%;min-width:18rem}.question-area>label{overflow-wrap:break-word}.in-line{display:inline-block;padding-right:.5rem}.use-value{overflow-wrap:break-word}.custom-text-area{width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i6.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i6.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i6.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: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i6.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i6.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i6.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i6.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: SelectComponent, selector: "ofe-select", inputs: ["display", "label", "helperText", "invalidText", "warn", "warnText", "id", "size", "disabled", "skeleton", "invalid", "theme", "ariaLabel", "value"], outputs: ["valueChange"] }, { kind: "component", type: i8.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "component", type: i8.NgOptionComponent, selector: "ng-option", inputs: ["value", "disabled"] }, { kind: "component", type: NumberInputComponent, selector: "ofe-number-input", inputs: ["theme", "disabled", "skeleton", "invalid", "id", "size", "required", "value", "min", "max", "maxlength", "minlength", "label", "helperText", "invalidText", "step", "precision", "warn", "warnText", "decrementLabel", "incrementLabel"], outputs: ["numberChange"] }, { kind: "directive", type: TextInputDirective, selector: "[ofeTextInput]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "directive", type: TextAreaDirective, selector: "[ofeTextAreaInput]", inputs: ["theme", "invalid", "skeleton"] }, { kind: "component", type: RemoteSelectComponent, selector: "ofe-remote-select", inputs: ["placeholder", "componentID", "disabled", "theme", "dataSource"], outputs: ["done"] }, { kind: "component", type: FileUploadComponent, selector: "ofe-file-upload", inputs: ["dataSource"] }, { kind: "component", type: CheckboxControlComponent, selector: "ofe-checkbox", inputs: ["id", "options", "selected"] }, { kind: "component", type: RadioButtonControlComponent, selector: "ofe-radio-button", inputs: ["id", "options", "selected", "allowUnselect", "orientation"] }, { kind: "component", type: WorkspaceLauncherComponent, selector: "ofe-workspace-launcher", inputs: ["id", "buttonLabel", "buttonType", "workspaceName"] }, { kind: "component", type: NgxDatetimeComponent, selector: "ofe-ngx-date-time-picker", inputs: ["id", "theme", "datePickerFormat", "showWeeks", "weeks"] }, { kind: "component", type: CustomControlWrapperComponent, selector: "ofe-custom-control-wrapper", inputs: ["question"] }, { kind: "component", type: CustomComponentWrapperComponent, selector: "ofe-custom-component-wrapper", inputs: ["componentConfigs", "dark"] }, { kind: "component", type: TabComponent, selector: "ofe-tab", inputs: ["tabTitle", "tabSubTitle", "active", "disabled", "bypassDOM", "customPaneClass"] }, { kind: "component", type: TabSetComponent, selector: "ofe-tab-set", inputs: ["disableStyle", "customNavClass", "customTabsClass", "selectedIndex", "formSubmissionTemplate"], outputs: ["tabSelect"] }, { kind: "component", type: FormRendererComponent, selector: "ofe-form-renderer", inputs: ["formSubmissionTemplate", "parentComponent", "node", "parentGroup", "theme", "labelMap", "controlId"] }, { kind: "component", type: AppointmentsOverviewComponent, selector: "ofe-appointments-overview", inputs: ["node"] }, { kind: "directive", type: HistoricalValueDirective, selector: "[node]", inputs: ["_node", "node"], outputs: ["_nodeChange"] }, { kind: "pipe", type: i1.DatePipe, name: "date" }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }, { kind: "pipe", type: TimeAgoPipe, name: "timeAgo" }] }); }
8758
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormRendererComponent, deps: [{ token: ValidationFactory }, { token: DataSources }, { token: FormErrorsService }, { token: i1.TranslateService }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
8759
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormRendererComponent, selector: "ofe-form-renderer", inputs: { formSubmissionTemplate: "formSubmissionTemplate", parentComponent: "parentComponent", node: "node", parentGroup: "parentGroup", theme: "theme", labelMap: "labelMap", controlId: "controlId" }, usesOnChanges: true, ngImport: i0, template: "<!--CONTAINERS-->\n<div *ngIf=\"node.question.renderingType === 'form'\">\n <ofe-tab-set\n (tabSelect)=\"tabSelected($event)\"\n [selectedIndex]=\"activeTab\"\n [formSubmissionTemplate]=\"formSubmissionTemplate\"\n >\n <ofe-tab\n [tabTitle]=\"question.label | translate\"\n *ngFor=\"let question of node.question.questions; let i = index\"\n >\n <ofe-form-renderer\n [node]=\"node.children[question.key] | translate\"\n [parentComponent]=\"this\"\n [parentGroup]=\"node.control\"\n [labelMap]=\"labelMap\"\n >\n </ofe-form-renderer>\n\n <!-- Buttons for navigating between tabs -->\n <div class=\"cds--btn-set button-set\">\n <button\n class=\"cds--btn cds--btn--ghost nav-button\"\n [disabled]=\"i === 0\"\n type=\"button\"\n >\n <a *ngIf=\"i > 0\" (click)=\"tabSelected(i - 1)\" class=\"nav-link\">\n <label class=\"nav-label\">{{ 'previous' | translate }}</label>\n <span class=\"nav-link-text\">{{\n node.question.questions[i - 1].label\n }}</span>\n </a>\n </button>\n <button\n class=\"cds--btn cds--btn--ghost nav-button\"\n [disabled]=\"i === node.question.questions.length - 1\"\n type=\"button\"\n >\n <a\n *ngIf=\"i < node.question.questions.length - 1\"\n (click)=\"tabSelected(i + 1)\"\n class=\"nav-link\"\n >\n <label class=\"nav-label\">{{ 'next' | translate }}</label>\n <span class=\"nav-link-text\">{{\n node.question.questions[i + 1].label\n }}</span>\n </a>\n </button>\n </div>\n </ofe-tab>\n\n <!-- TODO: Figure out why is this code doing the same thing as the ErrorRenderer component -->\n <div *ngIf=\"showErrors()\" class=\"container\">\n <div\n data-notification\n *ngFor=\"let errorNode of errorNodes\"\n class=\"cds--inline-notification cds--inline-notification--error cds--inline-notification--low-contrast pointer\"\n role=\"alert\"\n (click)=\"announceErrorField(errorNode)\"\n >\n <div class=\"cds--inline-notification__details\">\n <div class=\"cds--inline-notification__text-wrapper\">\n <p class=\"cds--inline-notification__title\">\n {{ errorNode.question.label | translate }}\n </p>\n <p class=\"cds--inline-notification__subtitle\">\n {{ getControlError(errorNode | translate) }}\n </p>\n </div>\n </div>\n <button\n tabindex=\"0\"\n class=\"cds--inline-notification__action-button cds--btn cds--btn--sm cds--btn--ghost\"\n type=\"button\"\n >\n {{ 'fix' | translate }}\n </button>\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n style=\"will-change: transform\"\n xmlns=\"http://www.w3.org/2000/svg\"\n class=\"cds--inline-notification__icon\"\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M10,1c-5,0-9,4-9,9s4,9,9,9s9-4,9-9S15,1,10,1z M13.5,14.5l-8-8l1-1l8,8L13.5,14.5z\"\n ></path>\n <path\n d=\"M13.5,14.5l-8-8l1-1l8,8L13.5,14.5z\"\n data-icon-path=\"inner-path\"\n opacity=\"0\"\n ></path>\n </svg>\n </div>\n </div>\n </ofe-tab-set>\n</div>\n\n<div *ngIf=\"node.question.renderingType === 'page'\">\n <!--Page Components-->\n <ofe-custom-component-wrapper\n [dark]=\"theme === 'light'\"\n [componentConfigs]=\"node.question.componentConfigs\"\n ></ofe-custom-component-wrapper>\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"parentGroup\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n</div>\n\n<div *ngIf=\"node.question.renderingType === 'section' && checkSection(node)\">\n <div class=\"cds--layout\">\n <ul class=\"cds--accordion cds--accordion--end\">\n <li\n class=\"cds--accordion__item accordion-content-override\"\n [ngClass]=\"{ 'cds--accordion__item--active': !isCollapsed }\"\n >\n <button\n type=\"button\"\n aria-controls=\"accordion-item-:r27:\"\n aria-expanded=\"false\"\n (click)=\"isCollapsed = !isCollapsed\"\n class=\"cds--accordion__heading\"\n >\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n aria-hidden=\"true\"\n class=\"cds--accordion__arrow\"\n >\n <path d=\"M11 8L6 13 5.3 12.3 9.6 8 5.3 3.7 6 3z\"></path>\n </svg>\n <div class=\"cds--accordion__title\">\n {{ node.question.label | translate }}\n </div>\n </button>\n <div id=\"accordion-item-:r27:\" class=\"cds--accordion__content\">\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"parentGroup\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n </div>\n </li>\n </ul>\n </div>\n</div>\n\n<!--CONTROLS-->\n\n<div\n *ngIf=\"node.question.controlType === 0\"\n [formGroup]=\"parentGroup\"\n [hidden]=\"node.control.hidden\"\n [ngClass]=\"{ disabled: node.control.disabled }\"\n>\n <ofe-custom-component-wrapper\n [dark]=\"!(theme === 'light')\"\n [componentConfigs]=\"node.question.componentConfigs\"\n ></ofe-custom-component-wrapper>\n <div class=\"cds--form-item\">\n <!--LEAF CONTROL-->\n <div class=\"question-area\">\n <a\n class=\"form-tooltip pull-right\"\n (click)=\"toggleInformation(node.question.extras.id)\"\n data-placement=\"right\"\n *ngIf=\"\n node.question &&\n node.question.extras.questionInfo &&\n node.question.extras.questionInfo !== '' &&\n node.question.extras.questionInfo !== ' '\n \"\n >\n <i class=\"glyphicon glyphicon-question-sign\" aria-hidden=\"true\"></i>\n </a>\n\n <label\n *ngIf=\"node.question.label\"\n [style.color]=\"hasErrors() ? 'red' : ''\"\n class=\"cds--label\"\n [attr.for]=\"node.question.key | translate\"\n >\n {{ node.question.required ? '*' : '' }}\n {{ node.question.prefix ? node.question.prefix + ' ' : '' }}\n {{ node.question.label | translate }}\n </label>\n\n <div\n *ngIf=\"\n node.question.extras.questionOptions.customControl;\n else nativeControls\n \"\n >\n <ofe-custom-control-wrapper\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [question]=\"node.question\"\n ></ofe-custom-control-wrapper>\n </div>\n\n <ng-template #nativeControls>\n <div class=\"afe-control\" [ngSwitch]=\"node.question.renderingType\">\n <ofe-select\n [theme]=\"theme\"\n *ngSwitchCase=\"'select'\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n >\n <option\n *ngFor=\"let option of node.question.options\"\n [value]=\"option.value\"\n >\n {{ option.label | translate }}\n </option>\n </ofe-select>\n\n <div *ngSwitchCase=\"'file'\">\n <ofe-file-upload\n [dataSource]=\"dataSource\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n (fileChanged)=\"upload($event)\"\n ></ofe-file-upload>\n </div>\n\n <textarea\n [theme]=\"theme\"\n ofeTextAreaInput\n [ngClass]=\"{\n 'cds--text-area--light': theme === 'light',\n 'cds--text-area--invalid': !node.control.valid\n }\"\n [placeholder]=\"node.question.placeholder | translate\"\n [rows]=\"node.question.rows\"\n class=\"cds--text-area\"\n *ngSwitchCase=\"'textarea'\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [readOnly]=\"node.question.extras.readOnly\"\n >\n </textarea>\n\n <ofe-remote-select\n [theme]=\"theme\"\n *ngSwitchCase=\"'remote-select'\"\n [placeholder]=\"node.question.placeholder | translate\"\n tabindex=\"0\"\n [dataSource]=\"dataSource\"\n [componentID]=\"node.question.key + 'id'\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n ></ofe-remote-select>\n\n <ofe-ngx-date-time-picker\n [weeks]=\"node.question.extras.questionOptions.weeksList\"\n [showWeeks]=\"node.question.showWeeksAdder\"\n [theme]=\"theme\"\n [id]=\"node.question.key + 'id'\"\n [formControlName]=\"node.question.key\"\n *ngSwitchCase=\"'date'\"\n [datePickerFormat]=\"node.question.datePickerFormat\"\n ></ofe-ngx-date-time-picker>\n\n <ng-select\n [ngClass]=\"{\n 'afe-custom': theme === 'light',\n invalid: node.control.touched && !node.control.valid ? true : null\n }\"\n [id]=\"node.question.key + 'id'\"\n *ngSwitchCase=\"'multi-select'\"\n [multiple]=\"true\"\n [appendTo]=\"'#' + node.question.key + 'id'\"\n placeholder=\"\"\n clearAllText=\"Clear\"\n [formControlName]=\"node.question.key\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n >\n <ng-option\n *ngFor=\"let option of node.question.options\"\n [value]=\"option.value\"\n >\n {{ option.label | translate }}\n </ng-option>\n </ng-select>\n\n <ng-select\n [ngClass]=\"{\n 'afe-custom': theme === 'light',\n invalid: node.control.touched && !node.control.valid ? true : null\n }\"\n [id]=\"node.question.key + 'id'\"\n *ngSwitchCase=\"'single-select'\"\n placeholder=\"\"\n clearAllText=\"Clear\"\n [formControlName]=\"node.question.key\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n >\n <ng-option\n *ngFor=\"let option of node.question.options\"\n [value]=\"option.value\"\n >\n {{ option.label | translate }}\n </ng-option>\n </ng-select>\n\n <ofe-number-input\n [theme]=\"theme\"\n *ngSwitchCase=\"'number'\"\n [id]=\"node.question.key + 'id'\"\n [min]=\"node.question.extras.questionOptions.min\"\n [max]=\"node.question.extras.questionOptions.max\"\n [maxlength]=\"node.question.extras.questionOptions.maxLength\"\n [minlength]=\"node.question.extras.questionOptions.minLength\"\n [formControlName]=\"node.question.key\"\n [attr.placeholder]=\"node.question.placeholder | translate\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n ></ofe-number-input>\n\n <div *ngSwitchCase=\"'workspace-launcher'\">\n <ofe-workspace-launcher\n [id]=\"node.question.key + 'id'\"\n [buttonLabel]=\"node.question.extras.questionOptions.buttonLabel\"\n [buttonType]=\"node.question.extras.questionOptions.buttonType\"\n [workspaceName]=\"\n node.question.extras.questionOptions.workspaceName\n \"\n ></ofe-workspace-launcher>\n </div>\n\n <input\n [theme]=\"theme\"\n class=\"cds--text-input\"\n ofeTextInput\n *ngSwitchDefault\n [formControlName]=\"node.question.key\"\n [attr.placeholder]=\"node.question.placeholder | translate\"\n [type]=\"node.question.renderingType\"\n [id]=\"node.question.key + 'id'\"\n [readOnly]=\"node.question.extras.readOnly\"\n />\n\n <div *ngSwitchCase=\"'radio'\">\n <ofe-radio-button\n [id]=\"node.question.key + 'id' + controlId\"\n [formControlName]=\"node.question.key\"\n [options]=\"node.question.options\"\n [allowUnselect]=\"node.question.allowUnselect\"\n [selected]=\"node.control.value\"\n [orientation]=\"node.question.orientation\"\n ></ofe-radio-button>\n </div>\n\n <div *ngSwitchCase=\"'checkbox'\">\n <ofe-checkbox\n [id]=\"node.question.key + 'id' + controlId\"\n [formControlName]=\"node.question.key\"\n [options]=\"node.question.options\"\n [selected]=\"node.control.value\"\n ></ofe-checkbox>\n </div>\n\n <div\n *ngIf=\"\n node.question.enableHistoricalValue &&\n node.question.historicalDisplay\n \"\n style=\"margin-top: 2px\"\n >\n <div class=\"container-fluid\">\n <div class=\"use-value\">\n <div class=\"col-xs-9\">\n <span class=\"text-warning\"\n >{{ 'previousValue' | translate }}:\n </span>\n <strong>{{ node.question.historicalDisplay?.text }}</strong>\n <span *ngIf=\"node.question.showHistoricalValueDate\">\n <span> | </span>\n <strong class=\"text-primary\"\n >{{ node.question.historicalDisplay?._date | date }}\n </strong>\n <span\n class=\"text-primary\"\n *ngIf=\"\n node.question.historicalDisplay &&\n node.question.historicalDisplay._date\n \"\n >\n ({{\n node.question.historicalDisplay._date | timeAgo\n }})</span\n >\n </span>\n </div>\n <button\n type=\"button\"\n [name]=\"'historyValue'\"\n class=\"cds--btn cds--btn--primary cds--btn--sm col-xs-3\"\n >\n {{ 'useValue' | translate }}\n </button>\n </div>\n </div>\n </div>\n <ofe-appointments-overview [node]=\"node\"></ofe-appointments-overview>\n <div class=\"error\" *ngIf=\"hasErrors()\">\n <div *ngFor=\"let e of errors()\">\n <span class=\"text-danger\">{{ e }}</span>\n </div>\n </div>\n </div>\n </ng-template>\n\n <div\n class=\"question-info col-md-12 col-lg-12 col-sm-12\"\n id=\"{{ node.question.extras.id }}\"\n *ngIf=\"\n node.question &&\n node.question.extras.questionInfo &&\n node.question.extras.questionInfo !== '' &&\n node.question.extras.questionInfo !== ' '\n \"\n >\n {{ node.question.extras.questionInfo | translate }}\n </div>\n </div>\n </div>\n</div>\n\n<!-- MESSAGES -->\n<label\n *ngIf=\"node.control && node.control.alert && node.control.alert !== ''\"\n class=\"cds--label text-warn warning\"\n>\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 32 32\"\n aria-hidden=\"true\"\n >\n <path\n fill=\"none\"\n d=\"M16,26a1.5,1.5,0,1,1,1.5-1.5A1.5,1.5,0,0,1,16,26Zm-1.125-5h2.25V12h-2.25Z\"\n data-icon-path=\"inner-path\"\n ></path>\n <path\n d=\"M16.002,6.1714h-.004L4.6487,27.9966,4.6506,28H27.3494l.0019-.0034ZM14.875,12h2.25v9h-2.25ZM16,26a1.5,1.5,0,1,1,1.5-1.5A1.5,1.5,0,0,1,16,26Z\"\n ></path>\n <path\n d=\"M29,30H3a1,1,0,0,1-.8872-1.4614l13-25a1,1,0,0,1,1.7744,0l13,25A1,1,0,0,1,29,30ZM4.6507,28H27.3493l.002-.0033L16.002,6.1714h-.004L4.6487,27.9967Z\"\n ></path>\n <title>Warning alt filled</title>\n </svg>\n {{ node.control.alert | translate }}\n</label>\n\n<div\n *ngIf=\"node.question.controlType === 1\"\n [hidden]=\"node.control.hidden\"\n [ngClass]=\"{ disabled: node.control.disabled }\"\n>\n <!--ARRAY CONTROL-->\n <div [ngSwitch]=\"node.question.renderingType\">\n <div class=\"well\" style=\"padding: 2px\" *ngSwitchCase=\"'repeating'\">\n <h4 style=\"margin: 2px; font-weight: bold\">\n {{ node.question.label | translate }}\n </h4>\n <div>\n <label\n class=\"cds--label\"\n *ngIf=\"node.question.extras.questionOptions.min\"\n style=\"margin-right: 2px\"\n >min: {{ node.question.extras.questionOptions.min }}</label\n >\n <label\n class=\"cds--label\"\n *ngIf=\"node.question.extras.questionOptions.max\"\n >max: {{ node.question.extras.questionOptions.max }}</label\n >\n </div>\n <hr\n style=\"\n margin-left: -2px;\n margin-right: -2px;\n margin-bottom: 4px;\n margin-top: 8px;\n border-width: 2px;\n \"\n />\n <div [ngSwitch]=\"node.question.extras.type\">\n <div *ngSwitchCase=\"'testOrder'\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n >\n </ofe-form-renderer>\n\n <div>{{ child.orderNumber }}</div>\n <div class=\"cds--layout\">\n <button\n type=\"button \"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n </div>\n <br />\n <hr\n style=\"\n margin-left: -2px;\n margin-right: -2px;\n margin-bottom: 4px;\n margin-top: 8px;\n border-width: 1px;\n \"\n />\n </div>\n </div>\n\n <div *ngSwitchCase=\"'diagnosis'\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n\n <button\n type=\"button \"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n <br />\n <hr\n style=\"\n margin-left: -2px;\n margin-right: -2px;\n margin-bottom: 4px;\n margin-top: 8px;\n border-width: 1px;\n \"\n />\n </div>\n </div>\n\n <div *ngSwitchCase=\"'obsGroup'\" style=\"margin-bottom: 20px\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n [controlId]=\"i\"\n ></ofe-form-renderer>\n\n <button\n type=\"button\"\n style=\"width: 100px\"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n <br />\n <hr\n style=\"\n margin-left: -2px;\n margin-right: -2px;\n margin-bottom: 4px;\n margin-top: 8px;\n border-width: 1px;\n \"\n />\n </div>\n </div>\n <div *ngSwitchCase=\"'diagnosisGroup'\" style=\"margin-bottom: 20px\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n [controlId]=\"i\"\n ></ofe-form-renderer>\n\n <button\n type=\"button\"\n style=\"width: 100px\"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n <br />\n <hr\n style=\"\n margin-left: -2px;\n margin-right: -2px;\n margin-bottom: 4px;\n margin-top: 8px;\n border-width: 1px;\n \"\n />\n </div>\n </div>\n </div>\n <button\n type=\"button\"\n class=\"cds--btn cds--btn--primary cds--btn--sm\"\n (click)=\"node.createChildNode()\"\n [ngClass]=\"{\n disabled:\n node.children.length >= node.question.extras.questionOptions.max\n }\"\n >\n {{ 'add' | translate }}\n </button>\n </div>\n </div>\n</div>\n\n<div\n *ngIf=\"node.question.controlType === 2\"\n [hidden]=\"node.control.hidden\"\n [ngClass]=\"{ disabled: node.control.disabled }\"\n>\n <!--GROUP-->\n <div [ngSwitch]=\"node.question.renderingType\">\n <div *ngSwitchCase=\"'group'\">\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"node.control\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n </div>\n <div\n *ngSwitchCase=\"'field-set'\"\n style=\"border: 1px solid #eeeeee; padding: 2px; margin: 2px\"\n >\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"node.control\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n </div>\n </div>\n</div>\n", styles: ["", ".button-set{margin-top:1rem}.nav-button{border-top:1px solid #dde1e6;height:5rem;max-width:50%;min-width:50%;padding-block:.25rem}.nav-link{min-width:100%;display:flex;align-content:flex-start;align-items:baseline;flex-direction:column}.nav-link-text{margin-top:.125rem;font-size:var(--cds-heading-03-font-size, 1.25rem);font-weight:var(--cds-heading-03-font-weight, 400);line-height:var(--cds-heading-03-line-height, 1.4);letter-spacing:var(--cds-heading-03-letter-spacing, 0)}.nav-label{font-size:var(--cds-label-01-font-size, .75rem);font-weight:var(--cds-label-01-font-weight, 400);line-height:var(--cds-label-01-line-height, 1.33333);letter-spacing:var(--cds-label-01-letter-spacing, .32px)}ul{list-style-type:none;margin:2px auto;position:relative}li{display:block;padding:10px 20px;transition:all .3s ease-in;border-bottom:4px solid transparent}li:hover{border-bottom:4px solid white;opacity:.7;cursor:pointer}.owl-theme .owl-controls .owl-nav{position:absolute;width:100%;top:0}.owl-theme .owl-controls .owl-nav [class*=owl-]{position:absolute;background:none;color:#000}.owl-theme .owl-controls .owl-nav [class*=owl-]:hover{background:none;color:#000}.owl-theme .owl-controls .owl-nav .owl-next{right:0;transform:translate(120%)}.owl-theme .owl-controls .owl-nav .owl-prev{left:0;transform:translate(-120%)}.disabled{opacity:.5;pointer-events:none}.select2-container{margin-top:-5px}.btn{padding:0 12px!important}.form-tooltip{color:#337ab7;display:inline-block}.question-info{opacity:0;height:0px;display:none;transition-duration:opacity 1s ease-out;transition-delay:.5s;padding-top:2px;padding-bottom:2px;color:#696969;border-style:ridge;border-width:1px;border-color:#337ab7;margin-top:.25rem}.hide-info{display:none;height:0px}.form-tooltip:hover~.question-info{display:block;opacity:1;height:auto}.form-tooltip .tooltipcontent:after{content:\" \";position:absolute;bottom:100%;right:0%;margin-left:-5px;border-width:5px;border-style:solid;border-top-color:transparent;border-right-color:transparent;border-bottom-color:#337ab7;border-left-color:transparent}ng-select.form-control{padding-top:0;height:auto;padding-bottom:0}.forms-dropdown-menu{max-height:450px;overflow-y:scroll}.no-border{border:0;box-shadow:none}.text-danger{color:var(--cds-support-01, #da1e28)}.text-warn{color:#eea616}.error{margin-top:.25rem}.warning{display:flex;align-items:center;margin:0 .25rem .75rem}.warning svg{margin-right:.25rem}.afe-control{margin-bottom:.125rem}[hidden]{display:none!important}.accordion-content-dark{background-color:#f4f4f4;padding-right:1rem}.accordion-content-override{box-sizing:content-box;border-bottom:none;padding:0;overflow-wrap:break-word}.accordion-content-override:hover{opacity:unset;border-bottom:none}.question-area{margin-bottom:.5rem;width:100%;min-width:18rem}.question-area>label{overflow-wrap:break-word}.in-line{display:inline-block;padding-right:.5rem}.use-value{overflow-wrap:break-word}.custom-text-area{width:100%}.container .cds--inline-notification--error{display:flex;align-items:center}.container .cds--inline-notification--error svg{margin-left:1rem;margin-block-start:0}.container .cds--inline-notification--low-contrast:before{border-width:1px 1px 0 0}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i6.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i6.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i6.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: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i6.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i6.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i6.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i6.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: SelectComponent, selector: "ofe-select", inputs: ["display", "label", "helperText", "invalidText", "warn", "warnText", "id", "size", "disabled", "skeleton", "invalid", "theme", "ariaLabel", "value"], outputs: ["valueChange"] }, { kind: "component", type: i8.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "component", type: i8.NgOptionComponent, selector: "ng-option", inputs: ["value", "disabled"] }, { kind: "component", type: NumberInputComponent, selector: "ofe-number-input", inputs: ["theme", "disabled", "skeleton", "invalid", "id", "placeholder", "size", "required", "value", "min", "max", "maxlength", "minlength", "label", "helperText", "invalidText", "step", "precision", "warn", "warnText", "decrementLabel", "incrementLabel"], outputs: ["numberChange"] }, { kind: "directive", type: TextInputDirective, selector: "[ofeTextInput]", inputs: ["theme", "size", "invalid", "warn", "skeleton"] }, { kind: "directive", type: TextAreaDirective, selector: "[ofeTextAreaInput]", inputs: ["theme", "invalid", "skeleton"] }, { kind: "component", type: RemoteSelectComponent, selector: "ofe-remote-select", inputs: ["placeholder", "componentID", "disabled", "theme", "invalid", "dataSource"], outputs: ["done"] }, { kind: "component", type: FileUploadComponent, selector: "ofe-file-upload", inputs: ["dataSource"] }, { kind: "component", type: CheckboxControlComponent, selector: "ofe-checkbox", inputs: ["id", "options", "selected"] }, { kind: "component", type: RadioButtonControlComponent, selector: "ofe-radio-button", inputs: ["id", "options", "selected", "allowUnselect", "orientation"] }, { kind: "component", type: WorkspaceLauncherComponent, selector: "ofe-workspace-launcher", inputs: ["id", "buttonLabel", "buttonType", "workspaceName"] }, { kind: "component", type: NgxDatetimeComponent, selector: "ofe-ngx-date-time-picker", inputs: ["id", "theme", "datePickerFormat", "showWeeks", "weeks"] }, { kind: "component", type: CustomControlWrapperComponent, selector: "ofe-custom-control-wrapper", inputs: ["question"] }, { kind: "component", type: CustomComponentWrapperComponent, selector: "ofe-custom-component-wrapper", inputs: ["componentConfigs", "dark"] }, { kind: "component", type: TabComponent, selector: "ofe-tab", inputs: ["tabTitle", "tabSubTitle", "active", "disabled", "bypassDOM", "customPaneClass"] }, { kind: "component", type: TabSetComponent, selector: "ofe-tab-set", inputs: ["disableStyle", "customNavClass", "customTabsClass", "selectedIndex", "formSubmissionTemplate"], outputs: ["tabSelect"] }, { kind: "component", type: FormRendererComponent, selector: "ofe-form-renderer", inputs: ["formSubmissionTemplate", "parentComponent", "node", "parentGroup", "theme", "labelMap", "controlId"] }, { kind: "component", type: AppointmentsOverviewComponent, selector: "ofe-appointments-overview", inputs: ["node"] }, { kind: "directive", type: HistoricalValueDirective, selector: "[node]", inputs: ["_node", "node"], outputs: ["_nodeChange"] }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "pipe", type: TimeAgoPipe, name: "timeAgo" }] }); }
8750
8760
  }
8751
8761
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormRendererComponent, decorators: [{
8752
8762
  type: Component,
8753
- args: [{ selector: 'ofe-form-renderer', template: "<!--CONTAINERS-->\n<div *ngIf=\"node.question.renderingType === 'form'\">\n <ofe-tab-set\n (tabSelect)=\"tabSelected($event)\"\n [selectedIndex]=\"activeTab\"\n [formSubmissionTemplate]=\"formSubmissionTemplate\"\n >\n <ofe-tab\n [tabTitle]=\"question.label | translate\"\n *ngFor=\"let question of node.question.questions; let i = index\"\n >\n <ofe-form-renderer\n [node]=\"node.children[question.key] | translate\"\n [parentComponent]=\"this\"\n [parentGroup]=\"node.control\"\n [labelMap]=\"labelMap\"\n >\n </ofe-form-renderer>\n\n <!-- Buttons for navigating between tabs -->\n <div class=\"cds--btn-set button-set\">\n <button\n class=\"cds--btn cds--btn--ghost nav-button\"\n [disabled]=\"i === 0\"\n type=\"button\"\n >\n <a *ngIf=\"i > 0\" (click)=\"tabSelected(i - 1)\" class=\"nav-link\">\n <label class=\"nav-label\">{{ 'previous' | translate }}</label>\n <span class=\"nav-link-text\">{{\n node.question.questions[i - 1].label\n }}</span>\n </a>\n </button>\n <button\n class=\"cds--btn cds--btn--ghost nav-button\"\n [disabled]=\"i === node.question.questions.length - 1\"\n type=\"button\"\n >\n <a\n *ngIf=\"i < node.question.questions.length - 1\"\n (click)=\"tabSelected(i + 1)\"\n class=\"nav-link\"\n >\n <label class=\"nav-label\">{{ 'next' | translate }}</label>\n <span class=\"nav-link-text\">{{\n node.question.questions[i + 1].label\n }}</span>\n </a>\n </button>\n </div>\n </ofe-tab>\n <div *ngIf=\"showErrors()\" class=\"container\">\n <div\n data-notification\n *ngFor=\"let errorNode of errorNodes\"\n class=\"cds--inline-notification cds--inline-notification--error cds--inline-notification--low-contrast pointer\"\n role=\"alert\"\n (click)=\"announceErrorField(errorNode)\"\n >\n <div class=\"cds--inline-notification__details\">\n <div class=\"cds--inline-notification__text-wrapper\">\n <p class=\"cds--inline-notification__title\">\n {{ errorNode.question.label | translate }}\n </p>\n <p class=\"cds--inline-notification__subtitle\">\n {{ getControlError(errorNode | translate) }}\n </p>\n </div>\n </div>\n <button\n tabindex=\"0\"\n class=\"cds--inline-notification__action-button cds--btn cds--btn--sm cds--btn--ghost\"\n type=\"button\"\n >\n {{ 'fix' | translate }}\n </button>\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n style=\"will-change: transform\"\n xmlns=\"http://www.w3.org/2000/svg\"\n class=\"cds--inline-notification__icon\"\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M10,1c-5,0-9,4-9,9s4,9,9,9s9-4,9-9S15,1,10,1z M13.5,14.5l-8-8l1-1l8,8L13.5,14.5z\"\n ></path>\n <path\n d=\"M13.5,14.5l-8-8l1-1l8,8L13.5,14.5z\"\n data-icon-path=\"inner-path\"\n opacity=\"0\"\n ></path>\n </svg>\n </div>\n </div>\n </ofe-tab-set>\n</div>\n<div *ngIf=\"node.question.renderingType === 'page'\">\n <!--Page Components-->\n <ofe-custom-component-wrapper\n [dark]=\"theme === 'light'\"\n [componentConfigs]=\"node.question.componentConfigs\"\n >\n </ofe-custom-component-wrapper>\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"parentGroup\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n</div>\n<div *ngIf=\"node.question.renderingType === 'section' && checkSection(node)\">\n <div class=\"cds--layout\">\n <ul class=\"cds--accordion cds--accordion--end\">\n <li\n class=\"cds--accordion__item accordion-content-override\"\n [ngClass]=\"{ 'cds--accordion__item--active': !isCollapsed }\"\n >\n <button\n type=\"button\"\n aria-controls=\"accordion-item-:r27:\"\n aria-expanded=\"false\"\n (click)=\"isCollapsed = !isCollapsed\"\n class=\"cds--accordion__heading\"\n >\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n aria-hidden=\"true\"\n class=\"cds--accordion__arrow\"\n >\n <path d=\"M11 8L6 13 5.3 12.3 9.6 8 5.3 3.7 6 3z\"></path>\n </svg>\n <div class=\"cds--accordion__title\">\n {{ node.question.label | translate }}\n </div>\n </button>\n <div id=\"accordion-item-:r27:\" class=\"cds--accordion__content\">\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"parentGroup\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n </div>\n </li>\n </ul>\n </div>\n</div>\n\n<!--CONTROLS-->\n\n<div\n *ngIf=\"node.question.controlType === 0\"\n [formGroup]=\"parentGroup\"\n [hidden]=\"node.control.hidden\"\n [ngClass]=\"{ disabled: node.control.disabled }\"\n>\n <ofe-custom-component-wrapper\n [dark]=\"!(theme === 'light')\"\n [componentConfigs]=\"node.question.componentConfigs\"\n >\n </ofe-custom-component-wrapper>\n <div class=\"cds--form-item\">\n <!--LEAF CONTROL-->\n <div class=\"question-area\">\n <a\n class=\"form-tooltip pull-right\"\n (click)=\"toggleInformation(node.question.extras.id)\"\n data-placement=\"right\"\n *ngIf=\"\n node.question &&\n node.question.extras.questionInfo &&\n node.question.extras.questionInfo !== '' &&\n node.question.extras.questionInfo !== ' '\n \"\n >\n <i class=\"glyphicon glyphicon-question-sign\" aria-hidden=\"true\"></i>\n </a>\n\n <label\n *ngIf=\"node.question.label\"\n [style.color]=\"hasErrors() ? 'red' : ''\"\n class=\"cds--label\"\n [attr.for]=\"node.question.key | translate\"\n >\n {{ node.question.required ? '*' : '' }}\n {{ node.question.prefix ? node.question.prefix + ' ' : '' }}\n {{ node.question.label | translate }}\n </label>\n\n <div\n *ngIf=\"\n node.question.extras.questionOptions.customControl;\n else nativeControls\n \"\n >\n <ofe-custom-control-wrapper\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [question]=\"node.question\"\n >\n </ofe-custom-control-wrapper>\n </div>\n\n <ng-template #nativeControls>\n <div class=\"afe-control\" [ngSwitch]=\"node.question.renderingType\">\n <ofe-select\n [theme]=\"theme\"\n *ngSwitchCase=\"'select'\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n >\n <option\n *ngFor=\"let option of node.question.options\"\n [value]=\"option.value\"\n >\n {{ option.label | translate }}\n </option>\n </ofe-select>\n\n <div *ngSwitchCase=\"'file'\">\n <ofe-file-upload\n [dataSource]=\"dataSource\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n (fileChanged)=\"upload($event)\"\n >\n </ofe-file-upload>\n </div>\n\n <textarea\n [theme]=\"theme\"\n ofeTextAreaInput\n [ngClass]=\"{\n 'cds--text-area--light': theme === 'light',\n 'cds--text-area--invalid': !node.control.valid\n }\"\n [placeholder]=\"node.question.placeholder | translate\"\n [rows]=\"node.question.rows\"\n class=\"cds--text-area\"\n *ngSwitchCase=\"'textarea'\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [readOnly]=\"node.question.extras.readOnly\"\n >\n </textarea>\n\n <ofe-remote-select\n [theme]=\"theme\"\n *ngSwitchCase=\"'remote-select'\"\n [placeholder]=\"node.question.placeholder | translate\"\n tabindex=\"0\"\n [dataSource]=\"dataSource\"\n [componentID]=\"node.question.key + 'id'\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n ></ofe-remote-select>\n\n <ofe-ngx-date-time-picker\n [weeks]=\"node.question.extras.questionOptions.weeksList\"\n [showWeeks]=\"node.question.showWeeksAdder\"\n [theme]=\"theme\"\n [id]=\"node.question.key + 'id'\"\n [formControlName]=\"node.question.key\"\n *ngSwitchCase=\"'date'\"\n [datePickerFormat]=\"node.question.datePickerFormat\"\n >\n </ofe-ngx-date-time-picker>\n <ng-select\n [ngClass]=\"{ 'afe-custom': theme === 'light' }\"\n [id]=\"node.question.key + 'id'\"\n *ngSwitchCase=\"'multi-select'\"\n [multiple]=\"true\"\n [appendTo]=\"'#' + node.question.key + 'id'\"\n placeholder=\"\"\n clearAllText=\"Clear\"\n [formControlName]=\"node.question.key\"\n >\n <ng-option\n *ngFor=\"let option of node.question.options\"\n [value]=\"option.value\"\n >\n {{ option.label | translate }}\n </ng-option>\n </ng-select>\n\n <ng-select\n [ngClass]=\"{ 'afe-custom': theme === 'light' }\"\n [id]=\"node.question.key + 'id'\"\n *ngSwitchCase=\"'single-select'\"\n placeholder=\"\"\n clearAllText=\"Clear\"\n [formControlName]=\"node.question.key\"\n >\n <ng-option\n *ngFor=\"let option of node.question.options\"\n [value]=\"option.value\"\n >\n {{ option.label | translate }}\n </ng-option>\n </ng-select>\n\n <ofe-number-input\n [theme]=\"theme\"\n *ngSwitchCase=\"'number'\"\n [id]=\"node.question.key + 'id'\"\n [min]=\"node.question.extras.questionOptions.min\"\n [max]=\"node.question.extras.questionOptions.max\"\n [maxlength]=\"node.question.extras.questionOptions.maxLength\"\n [minlength]=\"node.question.extras.questionOptions.minLength\"\n [formControlName]=\"node.question.key\"\n [attr.placeholder]=\"node.question.placeholder | translate\"\n >\n </ofe-number-input>\n\n <div *ngSwitchCase=\"'workspace-launcher'\">\n <ofe-workspace-launcher\n [id]=\"node.question.key + 'id'\"\n [buttonLabel]=\"node.question.extras.questionOptions.buttonLabel\"\n [buttonType]=\"node.question.extras.questionOptions.buttonType\"\n [workspaceName]=\"\n node.question.extras.questionOptions.workspaceName\n \"\n ></ofe-workspace-launcher>\n </div>\n\n <input\n [theme]=\"theme\"\n class=\"cds--text-input\"\n ofeTextInput\n *ngSwitchDefault\n [formControlName]=\"node.question.key\"\n [attr.placeholder]=\"node.question.placeholder | translate\"\n [type]=\"node.question.renderingType\"\n [id]=\"node.question.key + 'id'\"\n [readOnly]=\"node.question.extras.readOnly\"\n />\n\n <div *ngSwitchCase=\"'radio'\">\n <ofe-radio-button\n [id]=\"node.question.key + 'id' + controlId\"\n [formControlName]=\"node.question.key\"\n [options]=\"node.question.options\"\n [allowUnselect]=\"node.question.allowUnselect\"\n [selected]=\"node.control.value\"\n [orientation]=\"node.question.orientation\"\n ></ofe-radio-button>\n </div>\n\n <div *ngSwitchCase=\"'checkbox'\">\n <ofe-checkbox\n [id]=\"node.question.key + 'id' + controlId\"\n [formControlName]=\"node.question.key\"\n [options]=\"node.question.options\"\n [selected]=\"node.control.value\"\n ></ofe-checkbox>\n </div>\n\n <div\n *ngIf=\"\n node.question.enableHistoricalValue &&\n node.question.historicalDisplay\n \"\n style=\"margin-top: 2px\"\n >\n <div class=\"container-fluid\">\n <div class=\"use-value\">\n <div class=\"col-xs-9\">\n <span class=\"text-warning\"\n >{{ 'previousValue' | translate }}:\n </span>\n <strong>{{ node.question.historicalDisplay?.text }}</strong>\n <span *ngIf=\"node.question.showHistoricalValueDate\">\n <span> | </span>\n <strong class=\"text-primary\"\n >{{ node.question.historicalDisplay?._date | date }}\n </strong>\n <span\n class=\"text-primary\"\n *ngIf=\"\n node.question.historicalDisplay &&\n node.question.historicalDisplay._date\n \"\n >\n ({{\n node.question.historicalDisplay._date | timeAgo\n }})</span\n >\n </span>\n </div>\n <button\n type=\"button\"\n [name]=\"'historyValue'\"\n class=\"cds--btn cds--btn--primary cds--btn--sm col-xs-3\"\n >\n {{ 'useValue' | translate }}\n </button>\n </div>\n </div>\n </div>\n <ofe-appointments-overview [node]=\"node\"></ofe-appointments-overview>\n <div *ngIf=\"hasErrors()\">\n <div *ngFor=\"let e of errors()\">\n <span class=\"text-danger\">{{ e }}</span>\n </div>\n </div>\n </div>\n </ng-template>\n\n <div\n class=\"question-info col-md-12 col-lg-12 col-sm-12\"\n id=\"{{ node.question.extras.id }}\"\n *ngIf=\"\n node.question &&\n node.question.extras.questionInfo &&\n node.question.extras.questionInfo !== '' &&\n node.question.extras.questionInfo !== ' '\n \"\n >\n {{ node.question.extras.questionInfo | translate }}\n </div>\n </div>\n </div>\n</div>\n\n<!-- MESSAGES -->\n<label\n *ngIf=\"node.control && node.control.alert && node.control.alert !== ''\"\n class=\"cds--label text-warn\"\n style=\"display: flex; align-items: center; margin: 0.125rem 0\"\n>\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 32 32\"\n aria-hidden=\"true\"\n >\n <path\n fill=\"none\"\n d=\"M16,26a1.5,1.5,0,1,1,1.5-1.5A1.5,1.5,0,0,1,16,26Zm-1.125-5h2.25V12h-2.25Z\"\n data-icon-path=\"inner-path\"\n ></path>\n <path\n d=\"M16.002,6.1714h-.004L4.6487,27.9966,4.6506,28H27.3494l.0019-.0034ZM14.875,12h2.25v9h-2.25ZM16,26a1.5,1.5,0,1,1,1.5-1.5A1.5,1.5,0,0,1,16,26Z\"\n ></path>\n <path\n d=\"M29,30H3a1,1,0,0,1-.8872-1.4614l13-25a1,1,0,0,1,1.7744,0l13,25A1,1,0,0,1,29,30ZM4.6507,28H27.3493l.002-.0033L16.002,6.1714h-.004L4.6487,27.9967Z\"\n ></path>\n <title>Warning alt filled</title>\n </svg>\n {{ node.control.alert | translate }}\n</label>\n\n<div\n *ngIf=\"node.question.controlType === 1\"\n [hidden]=\"node.control.hidden\"\n [ngClass]=\"{ disabled: node.control.disabled }\"\n>\n <!--ARRAY CONTROL-->\n <div [ngSwitch]=\"node.question.renderingType\">\n <div class=\"well\" style=\"padding: 2px\" *ngSwitchCase=\"'repeating'\">\n <h4 style=\"margin: 2px; font-weight: bold\">\n {{ node.question.label | translate }}\n </h4>\n <div>\n <label\n class=\"cds--label\"\n *ngIf=\"node.question.extras.questionOptions.min\"\n style=\"margin-right: 2px\"\n >min: {{ node.question.extras.questionOptions.min }}</label\n >\n <label\n class=\"cds--label\"\n *ngIf=\"node.question.extras.questionOptions.max\"\n >max: {{ node.question.extras.questionOptions.max }}</label\n >\n </div>\n <hr\n style=\"\n margin-left: -2px;\n margin-right: -2px;\n margin-bottom: 4px;\n margin-top: 8px;\n border-width: 2px;\n \"\n />\n <div [ngSwitch]=\"node.question.extras.type\">\n <div *ngSwitchCase=\"'testOrder'\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n <div>{{ child.orderNumber }}</div>\n <div class=\"cds--layout\">\n <button\n type=\"button \"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n </div>\n <br />\n <hr\n style=\"\n margin-left: -2px;\n margin-right: -2px;\n margin-bottom: 4px;\n margin-top: 8px;\n border-width: 1px;\n \"\n />\n </div>\n </div>\n\n <div *ngSwitchCase=\"'diagnosis'\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n <button\n type=\"button \"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n <br />\n <hr\n style=\"\n margin-left: -2px;\n margin-right: -2px;\n margin-bottom: 4px;\n margin-top: 8px;\n border-width: 1px;\n \"\n />\n </div>\n </div>\n\n <div *ngSwitchCase=\"'obsGroup'\" style=\"margin-bottom: 20px\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n [controlId]=\"i\"\n ></ofe-form-renderer>\n <button\n type=\"button\"\n style=\"width: 100px\"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n <br />\n <hr\n style=\"\n margin-left: -2px;\n margin-right: -2px;\n margin-bottom: 4px;\n margin-top: 8px;\n border-width: 1px;\n \"\n />\n </div>\n </div>\n <div *ngSwitchCase=\"'diagnosisGroup'\" style=\"margin-bottom: 20px\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n [controlId]=\"i\"\n ></ofe-form-renderer>\n <button\n type=\"button\"\n style=\"width: 100px\"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n <br />\n <hr\n style=\"\n margin-left: -2px;\n margin-right: -2px;\n margin-bottom: 4px;\n margin-top: 8px;\n border-width: 1px;\n \"\n />\n </div>\n </div>\n </div>\n <button\n type=\"button\"\n class=\"cds--btn cds--btn--primary cds--btn--sm\"\n (click)=\"node.createChildNode()\"\n [ngClass]=\"{\n disabled:\n node.children.length >= node.question.extras.questionOptions.max\n }\"\n >\n {{ 'add' | translate }}\n </button>\n </div>\n </div>\n</div>\n<div\n *ngIf=\"node.question.controlType === 2\"\n [hidden]=\"node.control.hidden\"\n [ngClass]=\"{ disabled: node.control.disabled }\"\n>\n <!--GROUP-->\n <div [ngSwitch]=\"node.question.renderingType\">\n <div *ngSwitchCase=\"'group'\">\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"node.control\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n </div>\n <div\n *ngSwitchCase=\"'field-set'\"\n style=\"border: 1px solid #eeeeee; padding: 2px; margin: 2px\"\n >\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"node.control\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n </div>\n </div>\n</div>\n", styles: [".button-set{margin-top:1rem}.nav-button{border-top:1px solid #dde1e6;height:5rem;max-width:50%;min-width:50%;padding-block:.25rem}.nav-link{min-width:100%;display:flex;align-content:flex-start;align-items:baseline;flex-direction:column}.nav-link-text{margin-top:.125rem;font-size:var(--cds-heading-03-font-size, 1.25rem);font-weight:var(--cds-heading-03-font-weight, 400);line-height:var(--cds-heading-03-line-height, 1.4);letter-spacing:var(--cds-heading-03-letter-spacing, 0)}.nav-label{font-size:var(--cds-label-01-font-size, .75rem);font-weight:var(--cds-label-01-font-weight, 400);line-height:var(--cds-label-01-line-height, 1.33333);letter-spacing:var(--cds-label-01-letter-spacing, .32px)}ul{list-style-type:none;margin:2px auto;position:relative}li{display:block;padding:10px 20px;transition:all .3s ease-in;border-bottom:4px solid transparent}li:hover{border-bottom:4px solid white;opacity:.7;cursor:pointer}.owl-theme .owl-controls .owl-nav{position:absolute;width:100%;top:0}.owl-theme .owl-controls .owl-nav [class*=owl-]{position:absolute;background:none;color:#000}.owl-theme .owl-controls .owl-nav [class*=owl-]:hover{background:none;color:#000}.owl-theme .owl-controls .owl-nav .owl-next{right:0;transform:translate(120%)}.owl-theme .owl-controls .owl-nav .owl-prev{left:0;transform:translate(-120%)}.disabled{opacity:.5;pointer-events:none}.select2-container{margin-top:-5px}.btn{padding:0 12px!important}.form-tooltip{color:#337ab7;display:inline-block}.question-info{opacity:0;height:0px;display:none;transition-duration:opacity 1s ease-out;transition-delay:.5s;padding-top:2px;padding-bottom:2px;color:#696969;border-style:ridge;border-width:1px;border-color:#337ab7;margin-top:2px}.hide-info{display:none;height:0px}.form-tooltip:hover~.question-info{display:block;opacity:1;height:auto}.form-tooltip .tooltipcontent:after{content:\" \";position:absolute;bottom:100%;right:0%;margin-left:-5px;border-width:5px;border-style:solid;border-top-color:transparent;border-right-color:transparent;border-bottom-color:#337ab7;border-left-color:transparent}ng-select.form-control{padding-top:0;height:auto;padding-bottom:0}.forms-dropdown-menu{max-height:450px;overflow-y:scroll}.no-border{border:0;box-shadow:none}.text-danger{color:var(--cds-support-01, #da1e28)}.text-warn{color:#eea616}.error{margin-bottom:3rem}.afe-control{margin-bottom:.125rem}[hidden]{display:none!important}.accordion-content-dark{background-color:#f4f4f4;padding-right:1rem}.accordion-content-override{box-sizing:content-box;border-bottom:none;padding:0;overflow-wrap:break-word}.accordion-content-override:hover{opacity:unset;border-bottom:none}.question-area{margin-bottom:.5rem;width:100%;min-width:18rem}.question-area>label{overflow-wrap:break-word}.in-line{display:inline-block;padding-right:.5rem}.use-value{overflow-wrap:break-word}.custom-text-area{width:100%}\n"] }]
8754
- }], ctorParameters: function () { return [{ type: ValidationFactory }, { type: DataSources }, { type: FormErrorsService }, { type: i4.TranslateService }, { type: Document, decorators: [{
8763
+ args: [{ selector: 'ofe-form-renderer', template: "<!--CONTAINERS-->\n<div *ngIf=\"node.question.renderingType === 'form'\">\n <ofe-tab-set\n (tabSelect)=\"tabSelected($event)\"\n [selectedIndex]=\"activeTab\"\n [formSubmissionTemplate]=\"formSubmissionTemplate\"\n >\n <ofe-tab\n [tabTitle]=\"question.label | translate\"\n *ngFor=\"let question of node.question.questions; let i = index\"\n >\n <ofe-form-renderer\n [node]=\"node.children[question.key] | translate\"\n [parentComponent]=\"this\"\n [parentGroup]=\"node.control\"\n [labelMap]=\"labelMap\"\n >\n </ofe-form-renderer>\n\n <!-- Buttons for navigating between tabs -->\n <div class=\"cds--btn-set button-set\">\n <button\n class=\"cds--btn cds--btn--ghost nav-button\"\n [disabled]=\"i === 0\"\n type=\"button\"\n >\n <a *ngIf=\"i > 0\" (click)=\"tabSelected(i - 1)\" class=\"nav-link\">\n <label class=\"nav-label\">{{ 'previous' | translate }}</label>\n <span class=\"nav-link-text\">{{\n node.question.questions[i - 1].label\n }}</span>\n </a>\n </button>\n <button\n class=\"cds--btn cds--btn--ghost nav-button\"\n [disabled]=\"i === node.question.questions.length - 1\"\n type=\"button\"\n >\n <a\n *ngIf=\"i < node.question.questions.length - 1\"\n (click)=\"tabSelected(i + 1)\"\n class=\"nav-link\"\n >\n <label class=\"nav-label\">{{ 'next' | translate }}</label>\n <span class=\"nav-link-text\">{{\n node.question.questions[i + 1].label\n }}</span>\n </a>\n </button>\n </div>\n </ofe-tab>\n\n <!-- TODO: Figure out why is this code doing the same thing as the ErrorRenderer component -->\n <div *ngIf=\"showErrors()\" class=\"container\">\n <div\n data-notification\n *ngFor=\"let errorNode of errorNodes\"\n class=\"cds--inline-notification cds--inline-notification--error cds--inline-notification--low-contrast pointer\"\n role=\"alert\"\n (click)=\"announceErrorField(errorNode)\"\n >\n <div class=\"cds--inline-notification__details\">\n <div class=\"cds--inline-notification__text-wrapper\">\n <p class=\"cds--inline-notification__title\">\n {{ errorNode.question.label | translate }}\n </p>\n <p class=\"cds--inline-notification__subtitle\">\n {{ getControlError(errorNode | translate) }}\n </p>\n </div>\n </div>\n <button\n tabindex=\"0\"\n class=\"cds--inline-notification__action-button cds--btn cds--btn--sm cds--btn--ghost\"\n type=\"button\"\n >\n {{ 'fix' | translate }}\n </button>\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n style=\"will-change: transform\"\n xmlns=\"http://www.w3.org/2000/svg\"\n class=\"cds--inline-notification__icon\"\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M10,1c-5,0-9,4-9,9s4,9,9,9s9-4,9-9S15,1,10,1z M13.5,14.5l-8-8l1-1l8,8L13.5,14.5z\"\n ></path>\n <path\n d=\"M13.5,14.5l-8-8l1-1l8,8L13.5,14.5z\"\n data-icon-path=\"inner-path\"\n opacity=\"0\"\n ></path>\n </svg>\n </div>\n </div>\n </ofe-tab-set>\n</div>\n\n<div *ngIf=\"node.question.renderingType === 'page'\">\n <!--Page Components-->\n <ofe-custom-component-wrapper\n [dark]=\"theme === 'light'\"\n [componentConfigs]=\"node.question.componentConfigs\"\n ></ofe-custom-component-wrapper>\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"parentGroup\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n</div>\n\n<div *ngIf=\"node.question.renderingType === 'section' && checkSection(node)\">\n <div class=\"cds--layout\">\n <ul class=\"cds--accordion cds--accordion--end\">\n <li\n class=\"cds--accordion__item accordion-content-override\"\n [ngClass]=\"{ 'cds--accordion__item--active': !isCollapsed }\"\n >\n <button\n type=\"button\"\n aria-controls=\"accordion-item-:r27:\"\n aria-expanded=\"false\"\n (click)=\"isCollapsed = !isCollapsed\"\n class=\"cds--accordion__heading\"\n >\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n aria-hidden=\"true\"\n class=\"cds--accordion__arrow\"\n >\n <path d=\"M11 8L6 13 5.3 12.3 9.6 8 5.3 3.7 6 3z\"></path>\n </svg>\n <div class=\"cds--accordion__title\">\n {{ node.question.label | translate }}\n </div>\n </button>\n <div id=\"accordion-item-:r27:\" class=\"cds--accordion__content\">\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"parentGroup\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n </div>\n </li>\n </ul>\n </div>\n</div>\n\n<!--CONTROLS-->\n\n<div\n *ngIf=\"node.question.controlType === 0\"\n [formGroup]=\"parentGroup\"\n [hidden]=\"node.control.hidden\"\n [ngClass]=\"{ disabled: node.control.disabled }\"\n>\n <ofe-custom-component-wrapper\n [dark]=\"!(theme === 'light')\"\n [componentConfigs]=\"node.question.componentConfigs\"\n ></ofe-custom-component-wrapper>\n <div class=\"cds--form-item\">\n <!--LEAF CONTROL-->\n <div class=\"question-area\">\n <a\n class=\"form-tooltip pull-right\"\n (click)=\"toggleInformation(node.question.extras.id)\"\n data-placement=\"right\"\n *ngIf=\"\n node.question &&\n node.question.extras.questionInfo &&\n node.question.extras.questionInfo !== '' &&\n node.question.extras.questionInfo !== ' '\n \"\n >\n <i class=\"glyphicon glyphicon-question-sign\" aria-hidden=\"true\"></i>\n </a>\n\n <label\n *ngIf=\"node.question.label\"\n [style.color]=\"hasErrors() ? 'red' : ''\"\n class=\"cds--label\"\n [attr.for]=\"node.question.key | translate\"\n >\n {{ node.question.required ? '*' : '' }}\n {{ node.question.prefix ? node.question.prefix + ' ' : '' }}\n {{ node.question.label | translate }}\n </label>\n\n <div\n *ngIf=\"\n node.question.extras.questionOptions.customControl;\n else nativeControls\n \"\n >\n <ofe-custom-control-wrapper\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [question]=\"node.question\"\n ></ofe-custom-control-wrapper>\n </div>\n\n <ng-template #nativeControls>\n <div class=\"afe-control\" [ngSwitch]=\"node.question.renderingType\">\n <ofe-select\n [theme]=\"theme\"\n *ngSwitchCase=\"'select'\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n >\n <option\n *ngFor=\"let option of node.question.options\"\n [value]=\"option.value\"\n >\n {{ option.label | translate }}\n </option>\n </ofe-select>\n\n <div *ngSwitchCase=\"'file'\">\n <ofe-file-upload\n [dataSource]=\"dataSource\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n (fileChanged)=\"upload($event)\"\n ></ofe-file-upload>\n </div>\n\n <textarea\n [theme]=\"theme\"\n ofeTextAreaInput\n [ngClass]=\"{\n 'cds--text-area--light': theme === 'light',\n 'cds--text-area--invalid': !node.control.valid\n }\"\n [placeholder]=\"node.question.placeholder | translate\"\n [rows]=\"node.question.rows\"\n class=\"cds--text-area\"\n *ngSwitchCase=\"'textarea'\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [readOnly]=\"node.question.extras.readOnly\"\n >\n </textarea>\n\n <ofe-remote-select\n [theme]=\"theme\"\n *ngSwitchCase=\"'remote-select'\"\n [placeholder]=\"node.question.placeholder | translate\"\n tabindex=\"0\"\n [dataSource]=\"dataSource\"\n [componentID]=\"node.question.key + 'id'\"\n [formControlName]=\"node.question.key\"\n [id]=\"node.question.key + 'id'\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n ></ofe-remote-select>\n\n <ofe-ngx-date-time-picker\n [weeks]=\"node.question.extras.questionOptions.weeksList\"\n [showWeeks]=\"node.question.showWeeksAdder\"\n [theme]=\"theme\"\n [id]=\"node.question.key + 'id'\"\n [formControlName]=\"node.question.key\"\n *ngSwitchCase=\"'date'\"\n [datePickerFormat]=\"node.question.datePickerFormat\"\n ></ofe-ngx-date-time-picker>\n\n <ng-select\n [ngClass]=\"{\n 'afe-custom': theme === 'light',\n invalid: node.control.touched && !node.control.valid ? true : null\n }\"\n [id]=\"node.question.key + 'id'\"\n *ngSwitchCase=\"'multi-select'\"\n [multiple]=\"true\"\n [appendTo]=\"'#' + node.question.key + 'id'\"\n placeholder=\"\"\n clearAllText=\"Clear\"\n [formControlName]=\"node.question.key\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n >\n <ng-option\n *ngFor=\"let option of node.question.options\"\n [value]=\"option.value\"\n >\n {{ option.label | translate }}\n </ng-option>\n </ng-select>\n\n <ng-select\n [ngClass]=\"{\n 'afe-custom': theme === 'light',\n invalid: node.control.touched && !node.control.valid ? true : null\n }\"\n [id]=\"node.question.key + 'id'\"\n *ngSwitchCase=\"'single-select'\"\n placeholder=\"\"\n clearAllText=\"Clear\"\n [formControlName]=\"node.question.key\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n >\n <ng-option\n *ngFor=\"let option of node.question.options\"\n [value]=\"option.value\"\n >\n {{ option.label | translate }}\n </ng-option>\n </ng-select>\n\n <ofe-number-input\n [theme]=\"theme\"\n *ngSwitchCase=\"'number'\"\n [id]=\"node.question.key + 'id'\"\n [min]=\"node.question.extras.questionOptions.min\"\n [max]=\"node.question.extras.questionOptions.max\"\n [maxlength]=\"node.question.extras.questionOptions.maxLength\"\n [minlength]=\"node.question.extras.questionOptions.minLength\"\n [formControlName]=\"node.question.key\"\n [attr.placeholder]=\"node.question.placeholder | translate\"\n [invalid]=\"node.control.touched && !node.control.valid\"\n ></ofe-number-input>\n\n <div *ngSwitchCase=\"'workspace-launcher'\">\n <ofe-workspace-launcher\n [id]=\"node.question.key + 'id'\"\n [buttonLabel]=\"node.question.extras.questionOptions.buttonLabel\"\n [buttonType]=\"node.question.extras.questionOptions.buttonType\"\n [workspaceName]=\"\n node.question.extras.questionOptions.workspaceName\n \"\n ></ofe-workspace-launcher>\n </div>\n\n <input\n [theme]=\"theme\"\n class=\"cds--text-input\"\n ofeTextInput\n *ngSwitchDefault\n [formControlName]=\"node.question.key\"\n [attr.placeholder]=\"node.question.placeholder | translate\"\n [type]=\"node.question.renderingType\"\n [id]=\"node.question.key + 'id'\"\n [readOnly]=\"node.question.extras.readOnly\"\n />\n\n <div *ngSwitchCase=\"'radio'\">\n <ofe-radio-button\n [id]=\"node.question.key + 'id' + controlId\"\n [formControlName]=\"node.question.key\"\n [options]=\"node.question.options\"\n [allowUnselect]=\"node.question.allowUnselect\"\n [selected]=\"node.control.value\"\n [orientation]=\"node.question.orientation\"\n ></ofe-radio-button>\n </div>\n\n <div *ngSwitchCase=\"'checkbox'\">\n <ofe-checkbox\n [id]=\"node.question.key + 'id' + controlId\"\n [formControlName]=\"node.question.key\"\n [options]=\"node.question.options\"\n [selected]=\"node.control.value\"\n ></ofe-checkbox>\n </div>\n\n <div\n *ngIf=\"\n node.question.enableHistoricalValue &&\n node.question.historicalDisplay\n \"\n style=\"margin-top: 2px\"\n >\n <div class=\"container-fluid\">\n <div class=\"use-value\">\n <div class=\"col-xs-9\">\n <span class=\"text-warning\"\n >{{ 'previousValue' | translate }}:\n </span>\n <strong>{{ node.question.historicalDisplay?.text }}</strong>\n <span *ngIf=\"node.question.showHistoricalValueDate\">\n <span> | </span>\n <strong class=\"text-primary\"\n >{{ node.question.historicalDisplay?._date | date }}\n </strong>\n <span\n class=\"text-primary\"\n *ngIf=\"\n node.question.historicalDisplay &&\n node.question.historicalDisplay._date\n \"\n >\n ({{\n node.question.historicalDisplay._date | timeAgo\n }})</span\n >\n </span>\n </div>\n <button\n type=\"button\"\n [name]=\"'historyValue'\"\n class=\"cds--btn cds--btn--primary cds--btn--sm col-xs-3\"\n >\n {{ 'useValue' | translate }}\n </button>\n </div>\n </div>\n </div>\n <ofe-appointments-overview [node]=\"node\"></ofe-appointments-overview>\n <div class=\"error\" *ngIf=\"hasErrors()\">\n <div *ngFor=\"let e of errors()\">\n <span class=\"text-danger\">{{ e }}</span>\n </div>\n </div>\n </div>\n </ng-template>\n\n <div\n class=\"question-info col-md-12 col-lg-12 col-sm-12\"\n id=\"{{ node.question.extras.id }}\"\n *ngIf=\"\n node.question &&\n node.question.extras.questionInfo &&\n node.question.extras.questionInfo !== '' &&\n node.question.extras.questionInfo !== ' '\n \"\n >\n {{ node.question.extras.questionInfo | translate }}\n </div>\n </div>\n </div>\n</div>\n\n<!-- MESSAGES -->\n<label\n *ngIf=\"node.control && node.control.alert && node.control.alert !== ''\"\n class=\"cds--label text-warn warning\"\n>\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill=\"currentColor\"\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 32 32\"\n aria-hidden=\"true\"\n >\n <path\n fill=\"none\"\n d=\"M16,26a1.5,1.5,0,1,1,1.5-1.5A1.5,1.5,0,0,1,16,26Zm-1.125-5h2.25V12h-2.25Z\"\n data-icon-path=\"inner-path\"\n ></path>\n <path\n d=\"M16.002,6.1714h-.004L4.6487,27.9966,4.6506,28H27.3494l.0019-.0034ZM14.875,12h2.25v9h-2.25ZM16,26a1.5,1.5,0,1,1,1.5-1.5A1.5,1.5,0,0,1,16,26Z\"\n ></path>\n <path\n d=\"M29,30H3a1,1,0,0,1-.8872-1.4614l13-25a1,1,0,0,1,1.7744,0l13,25A1,1,0,0,1,29,30ZM4.6507,28H27.3493l.002-.0033L16.002,6.1714h-.004L4.6487,27.9967Z\"\n ></path>\n <title>Warning alt filled</title>\n </svg>\n {{ node.control.alert | translate }}\n</label>\n\n<div\n *ngIf=\"node.question.controlType === 1\"\n [hidden]=\"node.control.hidden\"\n [ngClass]=\"{ disabled: node.control.disabled }\"\n>\n <!--ARRAY CONTROL-->\n <div [ngSwitch]=\"node.question.renderingType\">\n <div class=\"well\" style=\"padding: 2px\" *ngSwitchCase=\"'repeating'\">\n <h4 style=\"margin: 2px; font-weight: bold\">\n {{ node.question.label | translate }}\n </h4>\n <div>\n <label\n class=\"cds--label\"\n *ngIf=\"node.question.extras.questionOptions.min\"\n style=\"margin-right: 2px\"\n >min: {{ node.question.extras.questionOptions.min }}</label\n >\n <label\n class=\"cds--label\"\n *ngIf=\"node.question.extras.questionOptions.max\"\n >max: {{ node.question.extras.questionOptions.max }}</label\n >\n </div>\n <hr\n style=\"\n margin-left: -2px;\n margin-right: -2px;\n margin-bottom: 4px;\n margin-top: 8px;\n border-width: 2px;\n \"\n />\n <div [ngSwitch]=\"node.question.extras.type\">\n <div *ngSwitchCase=\"'testOrder'\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n >\n </ofe-form-renderer>\n\n <div>{{ child.orderNumber }}</div>\n <div class=\"cds--layout\">\n <button\n type=\"button \"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n </div>\n <br />\n <hr\n style=\"\n margin-left: -2px;\n margin-right: -2px;\n margin-bottom: 4px;\n margin-top: 8px;\n border-width: 1px;\n \"\n />\n </div>\n </div>\n\n <div *ngSwitchCase=\"'diagnosis'\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n\n <button\n type=\"button \"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n <br />\n <hr\n style=\"\n margin-left: -2px;\n margin-right: -2px;\n margin-bottom: 4px;\n margin-top: 8px;\n border-width: 1px;\n \"\n />\n </div>\n </div>\n\n <div *ngSwitchCase=\"'obsGroup'\" style=\"margin-bottom: 20px\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n [controlId]=\"i\"\n ></ofe-form-renderer>\n\n <button\n type=\"button\"\n style=\"width: 100px\"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n <br />\n <hr\n style=\"\n margin-left: -2px;\n margin-right: -2px;\n margin-bottom: 4px;\n margin-top: 8px;\n border-width: 1px;\n \"\n />\n </div>\n </div>\n <div *ngSwitchCase=\"'diagnosisGroup'\" style=\"margin-bottom: 20px\">\n <div *ngFor=\"let child of node.children; let i = index\">\n <ofe-form-renderer\n *ngFor=\"let question of child.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"child.children[question.key]\"\n [parentGroup]=\"child.control\"\n [labelMap]=\"labelMap\"\n [controlId]=\"i\"\n ></ofe-form-renderer>\n\n <button\n type=\"button\"\n style=\"width: 100px\"\n class=\"cds--btn cds--btn--danger cds--btn--sm\"\n (click)=\"node.removeAt(i)\"\n >\n {{ 'remove' | translate }}\n </button>\n <br />\n <hr\n style=\"\n margin-left: -2px;\n margin-right: -2px;\n margin-bottom: 4px;\n margin-top: 8px;\n border-width: 1px;\n \"\n />\n </div>\n </div>\n </div>\n <button\n type=\"button\"\n class=\"cds--btn cds--btn--primary cds--btn--sm\"\n (click)=\"node.createChildNode()\"\n [ngClass]=\"{\n disabled:\n node.children.length >= node.question.extras.questionOptions.max\n }\"\n >\n {{ 'add' | translate }}\n </button>\n </div>\n </div>\n</div>\n\n<div\n *ngIf=\"node.question.controlType === 2\"\n [hidden]=\"node.control.hidden\"\n [ngClass]=\"{ disabled: node.control.disabled }\"\n>\n <!--GROUP-->\n <div [ngSwitch]=\"node.question.renderingType\">\n <div *ngSwitchCase=\"'group'\">\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"node.control\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n </div>\n <div\n *ngSwitchCase=\"'field-set'\"\n style=\"border: 1px solid #eeeeee; padding: 2px; margin: 2px\"\n >\n <ofe-form-renderer\n *ngFor=\"let question of node.question.questions\"\n [parentComponent]=\"this\"\n [node]=\"node.children[question.key]\"\n [parentGroup]=\"node.control\"\n [labelMap]=\"labelMap\"\n ></ofe-form-renderer>\n </div>\n </div>\n</div>\n", styles: [".button-set{margin-top:1rem}.nav-button{border-top:1px solid #dde1e6;height:5rem;max-width:50%;min-width:50%;padding-block:.25rem}.nav-link{min-width:100%;display:flex;align-content:flex-start;align-items:baseline;flex-direction:column}.nav-link-text{margin-top:.125rem;font-size:var(--cds-heading-03-font-size, 1.25rem);font-weight:var(--cds-heading-03-font-weight, 400);line-height:var(--cds-heading-03-line-height, 1.4);letter-spacing:var(--cds-heading-03-letter-spacing, 0)}.nav-label{font-size:var(--cds-label-01-font-size, .75rem);font-weight:var(--cds-label-01-font-weight, 400);line-height:var(--cds-label-01-line-height, 1.33333);letter-spacing:var(--cds-label-01-letter-spacing, .32px)}ul{list-style-type:none;margin:2px auto;position:relative}li{display:block;padding:10px 20px;transition:all .3s ease-in;border-bottom:4px solid transparent}li:hover{border-bottom:4px solid white;opacity:.7;cursor:pointer}.owl-theme .owl-controls .owl-nav{position:absolute;width:100%;top:0}.owl-theme .owl-controls .owl-nav [class*=owl-]{position:absolute;background:none;color:#000}.owl-theme .owl-controls .owl-nav [class*=owl-]:hover{background:none;color:#000}.owl-theme .owl-controls .owl-nav .owl-next{right:0;transform:translate(120%)}.owl-theme .owl-controls .owl-nav .owl-prev{left:0;transform:translate(-120%)}.disabled{opacity:.5;pointer-events:none}.select2-container{margin-top:-5px}.btn{padding:0 12px!important}.form-tooltip{color:#337ab7;display:inline-block}.question-info{opacity:0;height:0px;display:none;transition-duration:opacity 1s ease-out;transition-delay:.5s;padding-top:2px;padding-bottom:2px;color:#696969;border-style:ridge;border-width:1px;border-color:#337ab7;margin-top:.25rem}.hide-info{display:none;height:0px}.form-tooltip:hover~.question-info{display:block;opacity:1;height:auto}.form-tooltip .tooltipcontent:after{content:\" \";position:absolute;bottom:100%;right:0%;margin-left:-5px;border-width:5px;border-style:solid;border-top-color:transparent;border-right-color:transparent;border-bottom-color:#337ab7;border-left-color:transparent}ng-select.form-control{padding-top:0;height:auto;padding-bottom:0}.forms-dropdown-menu{max-height:450px;overflow-y:scroll}.no-border{border:0;box-shadow:none}.text-danger{color:var(--cds-support-01, #da1e28)}.text-warn{color:#eea616}.error{margin-top:.25rem}.warning{display:flex;align-items:center;margin:0 .25rem .75rem}.warning svg{margin-right:.25rem}.afe-control{margin-bottom:.125rem}[hidden]{display:none!important}.accordion-content-dark{background-color:#f4f4f4;padding-right:1rem}.accordion-content-override{box-sizing:content-box;border-bottom:none;padding:0;overflow-wrap:break-word}.accordion-content-override:hover{opacity:unset;border-bottom:none}.question-area{margin-bottom:.5rem;width:100%;min-width:18rem}.question-area>label{overflow-wrap:break-word}.in-line{display:inline-block;padding-right:.5rem}.use-value{overflow-wrap:break-word}.custom-text-area{width:100%}.container .cds--inline-notification--error{display:flex;align-items:center}.container .cds--inline-notification--error svg{margin-left:1rem;margin-block-start:0}.container .cds--inline-notification--low-contrast:before{border-width:1px 1px 0 0}\n"] }]
8764
+ }], ctorParameters: function () { return [{ type: ValidationFactory }, { type: DataSources }, { type: FormErrorsService }, { type: i1.TranslateService }, { type: Document, decorators: [{
8755
8765
  type: Inject,
8756
8766
  args: [DOCUMENT]
8757
8767
  }] }]; }, propDecorators: { formSubmissionTemplate: [{
@@ -8991,7 +9001,7 @@ class ErrorRendererComponent {
8991
9001
  return questionGroup.questions.indexOf(node.question);
8992
9002
  }
8993
9003
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ErrorRendererComponent, deps: [{ token: ValidationFactory }, { token: FormErrorsService }], target: i0.ɵɵFactoryTarget.Component }); }
8994
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ErrorRendererComponent, selector: "ofe-error-renderer", inputs: { form: "form" }, ngImport: i0, template: "<div *ngIf=\"showErrors()\" class=\"container\">\n <div\n data-notification\n *ngFor=\"let errorNode of errorNodes\"\n class=\"cds--inline-notification cds--inline-notification--error cds--inline-notification--low-contrast pointer\"\n role=\"alert\"\n (click)=\"announceErrorField(errorNode)\"\n >\n <div class=\"cds--inline-notification__details\">\n <div class=\"cds--inline-notification__text-wrapper\">\n <p class=\"cds--inline-notification__title\">\n {{ errorNode.question.label }}\n </p>\n <p class=\"cds--inline-notification__subtitle\">\n {{ getControlError(errorNode) }}\n </p>\n </div>\n </div>\n <button\n tabindex=\"0\"\n class=\"cds--inline-notification__action-button cds--btn cds--btn--sm cds--btn--ghost\"\n type=\"button\"\n >\n {{ 'fix' | translate }}\n </button>\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n style=\"will-change: transform\"\n xmlns=\"http://www.w3.org/2000/svg\"\n class=\"cds--inline-notification__icon\"\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M10,1c-5,0-9,4-9,9s4,9,9,9s9-4,9-9S15,1,10,1z M13.5,14.5l-8-8l1-1l8,8L13.5,14.5z\"\n ></path>\n <path\n d=\"M13.5,14.5l-8-8l1-1l8,8L13.5,14.5z\"\n data-icon-path=\"inner-path\"\n opacity=\"0\"\n ></path>\n </svg>\n </div>\n</div>\n", styles: ["ul{list-style:none}.list-group-item{padding:2px 15px;cursor:pointer}ul li:hover{background-color:#fff}h4{margin-top:7px;margin-bottom:7px}.pointer{cursor:pointer}\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: "pipe", type: i4.TranslatePipe, name: "translate" }] }); }
9004
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ErrorRendererComponent, selector: "ofe-error-renderer", inputs: { form: "form" }, ngImport: i0, template: "<div *ngIf=\"showErrors()\" class=\"container\">\n <div\n data-notification\n *ngFor=\"let errorNode of errorNodes\"\n class=\"cds--inline-notification cds--inline-notification--error cds--inline-notification--low-contrast pointer\"\n role=\"alert\"\n (click)=\"announceErrorField(errorNode)\"\n >\n <div class=\"cds--inline-notification__details\">\n <div class=\"cds--inline-notification__text-wrapper\">\n <p class=\"cds--inline-notification__title\">\n {{ errorNode.question.label }}\n </p>\n <p class=\"cds--inline-notification__subtitle\">\n {{ getControlError(errorNode) }}\n </p>\n </div>\n </div>\n <button\n tabindex=\"0\"\n class=\"cds--inline-notification__action-button cds--btn cds--btn--sm cds--btn--ghost\"\n type=\"button\"\n >\n {{ 'fix' | translate }}\n </button>\n <svg\n focusable=\"false\"\n preserveAspectRatio=\"xMidYMid meet\"\n style=\"will-change: transform\"\n xmlns=\"http://www.w3.org/2000/svg\"\n class=\"cds--inline-notification__icon\"\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 20 20\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M10,1c-5,0-9,4-9,9s4,9,9,9s9-4,9-9S15,1,10,1z M13.5,14.5l-8-8l1-1l8,8L13.5,14.5z\"\n ></path>\n <path\n d=\"M13.5,14.5l-8-8l1-1l8,8L13.5,14.5z\"\n data-icon-path=\"inner-path\"\n opacity=\"0\"\n ></path>\n </svg>\n </div>\n</div>\n", styles: ["ul{list-style:none}.list-group-item{padding:2px 15px;cursor:pointer}ul li:hover{background-color:#fff}h4{margin-top:7px;margin-bottom:7px}.pointer{cursor:pointer}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] }); }
8995
9005
  }
8996
9006
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ErrorRendererComponent, decorators: [{
8997
9007
  type: Component,
@@ -9134,7 +9144,7 @@ class CollapseDirective {
9134
9144
  this._player.play();
9135
9145
  return (callback) => this._player?.onDone(callback);
9136
9146
  }
9137
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CollapseDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1$4.AnimationBuilder }], target: i0.ɵɵFactoryTarget.Directive }); }
9147
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CollapseDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1$5.AnimationBuilder }], target: i0.ɵɵFactoryTarget.Directive }); }
9138
9148
  static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: CollapseDirective, selector: "[ofeCollapse]", inputs: { display: "display", isAnimated: "isAnimated", collapse: "collapse" }, outputs: { collapsed: "collapsed", collapses: "collapses", expanded: "expanded", expands: "expands" }, host: { properties: { "class.in": "this.isExpanded", "class.show": "this.isExpanded", "attr.aria-expanded": "this.isExpanded", "attr.aria-hidden": "this.isCollapsed", "class.collapse": "this.isCollapse", "class.collapsing": "this.isCollapsing" } }, exportAs: ["bs-collapse"], ngImport: i0 }); }
9139
9149
  }
9140
9150
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CollapseDirective, decorators: [{
@@ -9143,7 +9153,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
9143
9153
  selector: '[ofeCollapse]',
9144
9154
  exportAs: 'bs-collapse'
9145
9155
  }]
9146
- }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1$4.AnimationBuilder }]; }, propDecorators: { collapsed: [{
9156
+ }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1$5.AnimationBuilder }]; }, propDecorators: { collapsed: [{
9147
9157
  type: Output
9148
9158
  }], collapses: [{
9149
9159
  type: Output
@@ -9436,7 +9446,7 @@ class DatePickerComponent {
9436
9446
  }
9437
9447
  }
9438
9448
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DatePickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
9439
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DatePickerComponent, selector: "ofe-date-picker", inputs: { initDate: "initDate", locale: "locale", viewFormat: "viewFormat", returnObject: "returnObject" }, outputs: { datePickerCancel: "datePickerCancel", dateSelect: "dateSelect" }, ngImport: i0, template: "<ofe-picker-modal (overlayClick)=\"cancelDatePicker()\">\n <div class=\"picker-wrap\">\n <div class=\"picker-box\">\n <div class=\"picker-header\">\n <div class=\"picker-header-nav\">\n <span class=\"nav-prev\" (click)=\"prev()\"></span>\n </div>\n <div class=\"picker-header-content\">\n <div class=\"content\">\n <span (click)=\"showMonthSelection()\" class=\"month\">{{\n calendarDate | moment: 'MMMM'\n }}</span>\n <span class=\"seperator\">|</span>\n <span (click)=\"showYearSelection()\" class=\"year\">{{\n calendarDate | moment: 'YYYY'\n }}</span>\n </div>\n </div>\n <div class=\"picker-header-nav\">\n <span class=\"nav-next\" (click)=\"next()\"></span>\n </div>\n </div>\n <div class=\"picker-calendar\">\n <div\n class=\"picker-calendar-row\"\n *ngIf=\"!onDisplayMonths && !onDisplayYears\"\n >\n <span class=\"picker-weekday\" *ngFor=\"let day of dayNames\">{{\n day\n }}</span>\n </div>\n <div\n class=\"picker-calendar-row\"\n *ngIf=\"!onDisplayMonths && !onDisplayYears\"\n >\n <span\n class=\"picker-day\"\n (click)=\"selectDay(day)\"\n [ngClass]=\"{\n 'out-focus': day.month() !== calendarDate.month(),\n today: day.isSame(today),\n selected: day.isSame(selectedDate)\n }\"\n *ngFor=\"let day of calendarDays\"\n >\n {{ day | moment: 'D' }}\n </span>\n </div>\n <div class=\"picker-calendar-row\" *ngIf=\"onDisplayMonths\">\n <span\n class=\"picker-month\"\n *ngFor=\"let month of monthsShort\"\n (click)=\"selectMonth(month)\"\n [ngClass]=\"{\n selected: month === currentMonth\n }\"\n >\n {{ month }}\n </span>\n </div>\n <div class=\"picker-calendar-row\" *ngIf=\"onDisplayYears\">\n <span\n class=\"picker-year\"\n *ngFor=\"let year of displayYearRange\"\n (click)=\"selectYear(year)\"\n [ngClass]=\"{\n selected: year === currentYear\n }\"\n >\n {{ year }}\n </span>\n </div>\n </div>\n <div class=\"picker-footer\">\n <div class=\"picker-action action-today\" (click)=\"selectToday()\">\n <span class=\"text\">Today</span>\n </div>\n <div class=\"picker-action action-clear\" (click)=\"clearPickDate()\">\n <span class=\"text\">Clear</span>\n </div>\n <div class=\"picker-action action-close\" (click)=\"cancelDatePicker()\">\n <span class=\"text\">Close</span>\n </div>\n </div>\n </div>\n </div>\n</ofe-picker-modal>\n", styles: ["*,*:before,*:after{box-sizing:border-box}.picker-wrap{width:95vw;max-width:666px}.picker-box{font-family:Open Sans;min-width:400px!important;padding:.625rem 1rem;-webkit-user-select:none;user-select:none}.picker-header,.picker-footer{font-size:1.333rem;line-height:2.5rem;display:flex;height:2.5rem;width:100%}.picker-header-nav{position:relative;cursor:pointer;width:12.5%}.picker-header-nav>*{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%)}.picker-header-nav .nav-prev:before,.picker-header-nav .nav-next:before{content:\" \";border-top:.5em solid transparent;border-bottom:.5em solid transparent;border-right:.75em solid #000;width:0;height:0;display:block;margin:0 auto}.picker-header-nav .nav-next:before{border-right:0;border-left:.75em solid #000}.picker-header-content{width:75%;text-align:center}.picker-header-content .month{font-size:1.778rem;line-height:2.5rem;margin-right:.5rem;font-weight:700}.picker-header-content .year{font-style:italic;color:#999}.picker-calendar{width:100%}.picker-calendar .picker-calendar-row{display:flex;flex-wrap:wrap;width:100%;margin-bottom:.625rem}.picker-calendar .picker-weekday{font-weight:700;text-align:left;color:#999;width:calc(100% / 7)}.picker-calendar .picker-day,.picker-calendar .picker-month,.picker-calendar .picker-year{font-size:1.333rem;line-height:2.5rem;position:relative;height:2.5rem;text-align:center;cursor:pointer;width:calc(100% / 7)}.picker-calendar .picker-day:hover,.picker-calendar .picker-month:hover,.picker-calendar .picker-year:hover{background:#b1dcfb}.picker-calendar .out-focus{color:#ddd}.picker-calendar .out-focus:hover{color:#000}.picker-calendar .selected{background:#0089ec;color:#fff}.picker-calendar .selected:hover{background:#0089ec}.picker-calendar .today:before{content:\" \";position:absolute;top:2px;right:2px;width:0;height:0;border-top:.5em solid #0059bc;border-left:.5em solid transparent}.picker-footer{cursor:pointer}.picker-footer .picker-action{text-align:center;width:calc(100% / 3)}.picker-footer .picker-action:hover{background-color:#b1dcfb}.picker-footer .picker-action .text{padding-left:.8rem}.picker-footer .action-today:before,.picker-footer .action-clear:before,.picker-footer .action-close:before{content:\" \";position:relative;display:inline-block;height:0;width:0}.picker-footer .action-today:before{border-top:.66em solid #0059bc;border-left:.66em solid transparent}.picker-footer .action-clear:before{top:-.5rem;width:1rem;border-top:3px solid #e20}.picker-footer .action-close:before{width:1rem;height:1rem;background:linear-gradient(to bottom,transparent 35%,#777 35%,#777 65%,transparent 65%),linear-gradient(to right,transparent 35%,#777 35%,#777 65%,transparent 65%);transform:rotate(45deg)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ModalComponent, selector: "ofe-picker-modal", outputs: ["overlayClick"] }, { kind: "pipe", type: MomentPipe, name: "moment" }] }); }
9449
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DatePickerComponent, selector: "ofe-date-picker", inputs: { initDate: "initDate", locale: "locale", viewFormat: "viewFormat", returnObject: "returnObject" }, outputs: { datePickerCancel: "datePickerCancel", dateSelect: "dateSelect" }, ngImport: i0, template: "<ofe-picker-modal (overlayClick)=\"cancelDatePicker()\">\n <div class=\"picker-wrap\">\n <div class=\"picker-box\">\n <div class=\"picker-header\">\n <div class=\"picker-header-nav\">\n <span class=\"nav-prev\" (click)=\"prev()\"></span>\n </div>\n <div class=\"picker-header-content\">\n <div class=\"content\">\n <span (click)=\"showMonthSelection()\" class=\"month\">{{\n calendarDate | moment: 'MMMM'\n }}</span>\n <span class=\"seperator\">|</span>\n <span (click)=\"showYearSelection()\" class=\"year\">{{\n calendarDate | moment: 'YYYY'\n }}</span>\n </div>\n </div>\n <div class=\"picker-header-nav\">\n <span class=\"nav-next\" (click)=\"next()\"></span>\n </div>\n </div>\n <div class=\"picker-calendar\">\n <div\n class=\"picker-calendar-row\"\n *ngIf=\"!onDisplayMonths && !onDisplayYears\"\n >\n <span class=\"picker-weekday\" *ngFor=\"let day of dayNames\">{{\n day\n }}</span>\n </div>\n <div\n class=\"picker-calendar-row\"\n *ngIf=\"!onDisplayMonths && !onDisplayYears\"\n >\n <span\n class=\"picker-day\"\n (click)=\"selectDay(day)\"\n [ngClass]=\"{\n 'out-focus': day.month() !== calendarDate.month(),\n today: day.isSame(today),\n selected: day.isSame(selectedDate)\n }\"\n *ngFor=\"let day of calendarDays\"\n >\n {{ day | moment: 'D' }}\n </span>\n </div>\n <div class=\"picker-calendar-row\" *ngIf=\"onDisplayMonths\">\n <span\n class=\"picker-month\"\n *ngFor=\"let month of monthsShort\"\n (click)=\"selectMonth(month)\"\n [ngClass]=\"{\n selected: month === currentMonth\n }\"\n >\n {{ month }}\n </span>\n </div>\n <div class=\"picker-calendar-row\" *ngIf=\"onDisplayYears\">\n <span\n class=\"picker-year\"\n *ngFor=\"let year of displayYearRange\"\n (click)=\"selectYear(year)\"\n [ngClass]=\"{\n selected: year === currentYear\n }\"\n >\n {{ year }}\n </span>\n </div>\n </div>\n <div class=\"picker-footer\">\n <div class=\"picker-action action-today\" (click)=\"selectToday()\">\n <span class=\"text\">Today</span>\n </div>\n <div class=\"picker-action action-clear\" (click)=\"clearPickDate()\">\n <span class=\"text\">Clear</span>\n </div>\n <div class=\"picker-action action-close\" (click)=\"cancelDatePicker()\">\n <span class=\"text\">Close</span>\n </div>\n </div>\n </div>\n </div>\n</ofe-picker-modal>\n", styles: ["*,*:before,*:after{box-sizing:border-box}.picker-wrap{width:95vw;max-width:666px}.picker-box{font-family:Open Sans;min-width:400px!important;padding:.625rem 1rem;-webkit-user-select:none;user-select:none}.picker-header,.picker-footer{font-size:1.333rem;line-height:2.5rem;display:flex;height:2.5rem;width:100%}.picker-header-nav{position:relative;cursor:pointer;width:12.5%}.picker-header-nav>*{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%)}.picker-header-nav .nav-prev:before,.picker-header-nav .nav-next:before{content:\" \";border-top:.5em solid transparent;border-bottom:.5em solid transparent;border-right:.75em solid #000;width:0;height:0;display:block;margin:0 auto}.picker-header-nav .nav-next:before{border-right:0;border-left:.75em solid #000}.picker-header-content{width:75%;text-align:center}.picker-header-content .month{font-size:1.778rem;line-height:2.5rem;margin-right:.5rem;font-weight:700}.picker-header-content .year{font-style:italic;color:#999}.picker-calendar{width:100%}.picker-calendar .picker-calendar-row{display:flex;flex-wrap:wrap;width:100%;margin-bottom:.625rem}.picker-calendar .picker-weekday{font-weight:700;text-align:left;color:#999;width:calc(100% / 7)}.picker-calendar .picker-day,.picker-calendar .picker-month,.picker-calendar .picker-year{font-size:1.333rem;line-height:2.5rem;position:relative;height:2.5rem;text-align:center;cursor:pointer;width:calc(100% / 7)}.picker-calendar .picker-day:hover,.picker-calendar .picker-month:hover,.picker-calendar .picker-year:hover{background:#b1dcfb}.picker-calendar .out-focus{color:#ddd}.picker-calendar .out-focus:hover{color:#000}.picker-calendar .selected{background:#0089ec;color:#fff}.picker-calendar .selected:hover{background:#0089ec}.picker-calendar .today:before{content:\" \";position:absolute;top:2px;right:2px;width:0;height:0;border-top:.5em solid #0059bc;border-left:.5em solid transparent}.picker-footer{cursor:pointer}.picker-footer .picker-action{text-align:center;width:calc(100% / 3)}.picker-footer .picker-action:hover{background-color:#b1dcfb}.picker-footer .picker-action .text{padding-left:.8rem}.picker-footer .action-today:before,.picker-footer .action-clear:before,.picker-footer .action-close:before{content:\" \";position:relative;display:inline-block;height:0;width:0}.picker-footer .action-today:before{border-top:.66em solid #0059bc;border-left:.66em solid transparent}.picker-footer .action-clear:before{top:-.5rem;width:1rem;border-top:3px solid #e20}.picker-footer .action-close:before{width:1rem;height:1rem;background:linear-gradient(to bottom,transparent 35%,#777 35%,#777 65%,transparent 65%),linear-gradient(to right,transparent 35%,#777 35%,#777 65%,transparent 65%);transform:rotate(45deg)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ModalComponent, selector: "ofe-picker-modal", outputs: ["overlayClick"] }, { kind: "pipe", type: MomentPipe, name: "moment" }] }); }
9440
9450
  }
9441
9451
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DatePickerComponent, decorators: [{
9442
9452
  type: Component,
@@ -9549,7 +9559,7 @@ class TimePickerComponent {
9549
9559
  }
9550
9560
  }
9551
9561
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TimePickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
9552
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TimePickerComponent, selector: "ofe-time-picker", inputs: { initTime: "initTime", showSecond: "showSecond", viewFormat: "viewFormat", use12Hour: "use12Hour", returnObject: "returnObject" }, outputs: { timeSelect: "timeSelect", timePickerCancel: "timePickerCancel" }, ngImport: i0, template: "<ofe-picker-modal (overlayClick)=\"cancelTimePicker()\">\n <div class=\"picker-wrap\">\n <div class=\"picker-box\">\n <div class=\"picker-header\">Time Picker</div>\n <div class=\"picker-table\">\n <ul class=\"picker-table-time\">\n <li class=\"picker-table-number hour\">\n <span class=\"arrow up\" (click)=\"increaseHour()\"></span>\n {{ time | moment: hourFormat }}\n <span class=\"arrow down\" (click)=\"decreaseHour()\"></span>\n </li>\n <li class=\"picker-table-separator\">:</li>\n <li class=\"picker-table-number minute\">\n <span class=\"arrow up\" (click)=\"increaseMinute()\"></span>\n {{ time | moment: 'mm' }}\n <span class=\"arrow down\" (click)=\"decreaseMinute()\"></span>\n </li>\n <li *ngIf=\"showSecond\" class=\"picker-table-separator\">:</li>\n <li *ngIf=\"showSecond\" class=\"picker-table-number second\">\n <span class=\"arrow up\" (click)=\"increaseSecond()\"></span>\n {{ time | moment: 'ss' }}\n <span class=\"arrow down\" (click)=\"decreaseSecond()\"></span>\n </li>\n <li *ngIf=\"use12Hour\" class=\"picker-table-meridiem meridiem\">\n {{ time | moment: 'A' }}\n </li>\n </ul>\n </div>\n <div class=\"picker-footer\">\n <div class=\"picker-action action-now\" (click)=\"selectNow()\">\n <span class=\"text\">Now</span>\n </div>\n <div class=\"picker-action action-confirm\" (click)=\"selectTime()\">\n <span class=\"text\">Confirm</span>\n </div>\n <div class=\"picker-action action-clear\" (click)=\"clearTime()\">\n <span class=\"text\">Clear</span>\n </div>\n <div class=\"picker-action action-close\" (click)=\"cancelTimePicker()\">\n <span class=\"text\">Close</span>\n </div>\n </div>\n </div>\n </div>\n</ofe-picker-modal>\n", styles: ["*,*:before,*:after{box-sizing:border-box}.picker-wrap{width:95vw;max-width:40rem;font-family:Open Sans}.picker-box{width:100%;padding:.625rem 1rem;-webkit-user-select:none;user-select:none}.picker-header,.picker-footer{font-size:1.333rem;line-height:2.5rem;height:2.5rem;width:100%}.picker-header{text-align:center}.picker-table{width:100%;margin:2.5rem 0}.picker-table-time{font-size:2.37rem;line-height:2.5rem;list-style:none;margin:0;padding:0;display:flex;justify-content:center;width:100%;-webkit-user-select:none;user-select:none}.picker-table-number,.picker-table-meridiem,.picker-table-separator{text-align:center}.picker-table-number,.picker-table-meridiem{position:relative;width:20%}.arrow{position:absolute;left:50%;border:solid #777;border-width:0 .2rem .2rem 0;display:inline-block;padding:.25rem;cursor:pointer}.arrow.up{top:-1rem;transform:translate(-50%) rotate(-135deg)}.arrow.down{bottom:-1rem;transform:translate(-50%) rotate(45deg)}.arrow:hover{border-color:#1975d2}.picker-table-separator{width:calc(20% / 3)}.picker-footer{display:flex;justify-content:center;width:100%;cursor:pointer}.picker-footer .picker-action{width:25%;text-align:center}.picker-footer .picker-action:hover{background-color:#b1dcfb}.picker-footer .picker-action .text{padding-left:.8rem}.picker-footer .action-now:before,.picker-footer .action-confirm:before,.picker-footer .action-clear:before,.picker-footer .action-close:before{content:\" \";position:relative;display:inline-block;height:0;width:0}.picker-footer .action-now:before{border-top:.66em solid #0059bc;border-left:.66em solid transparent}.picker-footer .action-confirm:before{width:1rem;height:1rem;border-radius:100%;background-color:#00b5ad}.picker-footer .action-clear:before{top:-.5rem;width:1rem;border-top:3px solid #e20}.picker-footer .action-close:before{width:1rem;height:1rem;background:linear-gradient(to bottom,transparent 35%,#777 35%,#777 65%,transparent 65%),linear-gradient(to right,transparent 35%,#777 35%,#777 65%,transparent 65%);transform:rotate(45deg)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ModalComponent, selector: "ofe-picker-modal", outputs: ["overlayClick"] }, { kind: "pipe", type: MomentPipe, name: "moment" }] }); }
9562
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TimePickerComponent, selector: "ofe-time-picker", inputs: { initTime: "initTime", showSecond: "showSecond", viewFormat: "viewFormat", use12Hour: "use12Hour", returnObject: "returnObject" }, outputs: { timeSelect: "timeSelect", timePickerCancel: "timePickerCancel" }, ngImport: i0, template: "<ofe-picker-modal (overlayClick)=\"cancelTimePicker()\">\n <div class=\"picker-wrap\">\n <div class=\"picker-box\">\n <div class=\"picker-header\">Time Picker</div>\n <div class=\"picker-table\">\n <ul class=\"picker-table-time\">\n <li class=\"picker-table-number hour\">\n <span class=\"arrow up\" (click)=\"increaseHour()\"></span>\n {{ time | moment: hourFormat }}\n <span class=\"arrow down\" (click)=\"decreaseHour()\"></span>\n </li>\n <li class=\"picker-table-separator\">:</li>\n <li class=\"picker-table-number minute\">\n <span class=\"arrow up\" (click)=\"increaseMinute()\"></span>\n {{ time | moment: 'mm' }}\n <span class=\"arrow down\" (click)=\"decreaseMinute()\"></span>\n </li>\n <li *ngIf=\"showSecond\" class=\"picker-table-separator\">:</li>\n <li *ngIf=\"showSecond\" class=\"picker-table-number second\">\n <span class=\"arrow up\" (click)=\"increaseSecond()\"></span>\n {{ time | moment: 'ss' }}\n <span class=\"arrow down\" (click)=\"decreaseSecond()\"></span>\n </li>\n <li *ngIf=\"use12Hour\" class=\"picker-table-meridiem meridiem\">\n {{ time | moment: 'A' }}\n </li>\n </ul>\n </div>\n <div class=\"picker-footer\">\n <div class=\"picker-action action-now\" (click)=\"selectNow()\">\n <span class=\"text\">Now</span>\n </div>\n <div class=\"picker-action action-confirm\" (click)=\"selectTime()\">\n <span class=\"text\">Confirm</span>\n </div>\n <div class=\"picker-action action-clear\" (click)=\"clearTime()\">\n <span class=\"text\">Clear</span>\n </div>\n <div class=\"picker-action action-close\" (click)=\"cancelTimePicker()\">\n <span class=\"text\">Close</span>\n </div>\n </div>\n </div>\n </div>\n</ofe-picker-modal>\n", styles: ["*,*:before,*:after{box-sizing:border-box}.picker-wrap{width:95vw;max-width:40rem;font-family:Open Sans}.picker-box{width:100%;padding:.625rem 1rem;-webkit-user-select:none;user-select:none}.picker-header,.picker-footer{font-size:1.333rem;line-height:2.5rem;height:2.5rem;width:100%}.picker-header{text-align:center}.picker-table{width:100%;margin:2.5rem 0}.picker-table-time{font-size:2.37rem;line-height:2.5rem;list-style:none;margin:0;padding:0;display:flex;justify-content:center;width:100%;-webkit-user-select:none;user-select:none}.picker-table-number,.picker-table-meridiem,.picker-table-separator{text-align:center}.picker-table-number,.picker-table-meridiem{position:relative;width:20%}.arrow{position:absolute;left:50%;border:solid #777;border-width:0 .2rem .2rem 0;display:inline-block;padding:.25rem;cursor:pointer}.arrow.up{top:-1rem;transform:translate(-50%) rotate(-135deg)}.arrow.down{bottom:-1rem;transform:translate(-50%) rotate(45deg)}.arrow:hover{border-color:#1975d2}.picker-table-separator{width:calc(20% / 3)}.picker-footer{display:flex;justify-content:center;width:100%;cursor:pointer}.picker-footer .picker-action{width:25%;text-align:center}.picker-footer .picker-action:hover{background-color:#b1dcfb}.picker-footer .picker-action .text{padding-left:.8rem}.picker-footer .action-now:before,.picker-footer .action-confirm:before,.picker-footer .action-clear:before,.picker-footer .action-close:before{content:\" \";position:relative;display:inline-block;height:0;width:0}.picker-footer .action-now:before{border-top:.66em solid #0059bc;border-left:.66em solid transparent}.picker-footer .action-confirm:before{width:1rem;height:1rem;border-radius:100%;background-color:#00b5ad}.picker-footer .action-clear:before{top:-.5rem;width:1rem;border-top:3px solid #e20}.picker-footer .action-close:before{width:1rem;height:1rem;background:linear-gradient(to bottom,transparent 35%,#777 35%,#777 65%,transparent 65%),linear-gradient(to right,transparent 35%,#777 35%,#777 65%,transparent 65%);transform:rotate(45deg)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ModalComponent, selector: "ofe-picker-modal", outputs: ["overlayClick"] }, { kind: "pipe", type: MomentPipe, name: "moment" }] }); }
9553
9563
  }
9554
9564
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TimePickerComponent, decorators: [{
9555
9565
  type: Component,
@@ -9652,7 +9662,7 @@ class DateTimePickerComponent {
9652
9662
  useExisting: forwardRef(() => DateTimePickerComponent),
9653
9663
  multi: true
9654
9664
  }
9655
- ], ngImport: i0, template: "<div class=\"row\">\n <div *ngIf=\"!showTime\" class=\"col-xs-12 col-md-12\">\n <input\n *ngIf=\"!showWeeks\"\n type=\"text\"\n class=\"form-control\"\n [value]=\"value | date: 'mediumDate'\"\n (focus)=\"toggleDatePicker(true)\"\n readonly\n placeholder=\"Select Date\"\n />\n <div *ngIf=\"showWeeks\" class=\"input-group\">\n <input\n type=\"text\"\n class=\"form-control\"\n class=\"form-control\"\n [value]=\"value | date: 'mediumDate'\"\n (focus)=\"toggleDatePicker(true)\"\n readonly\n placeholder=\"Select Date\"\n />\n <div class=\"input-group-btn\">\n <button\n type=\"button\"\n class=\"btn btn-default dropdown-toggle\"\n data-toggle=\"dropdown\"\n aria-haspopup=\"true\"\n aria-expanded=\"false\"\n >\n {{ 'weeks' | translate }} <span class=\"caret\"></span>\n </button>\n <ul class=\"dropdown-menu up\">\n <li (click)=\"weeksSelected(count)\" *ngFor=\"let count of weeks\">\n <span> {{ count }} {{ 'weeks' | translate }}</span>\n </li>\n </ul>\n </div>\n </div>\n </div>\n <div *ngIf=\"showTime\" class=\"col-xs-8 col-md-8\">\n <input\n *ngIf=\"!showWeeks\"\n type=\"text\"\n class=\"form-control\"\n [value]=\"value | date: 'mediumDate'\"\n (focus)=\"toggleDatePicker(true)\"\n readonly\n placeholder=\"Select Date\"\n />\n <div *ngIf=\"showWeeks\" class=\"input-group\">\n <input\n type=\"text\"\n class=\"form-control\"\n class=\"form-control\"\n [value]=\"value | date: 'mediumDate'\"\n (focus)=\"toggleDatePicker(true)\"\n readonly\n placeholder=\"Select Date\"\n />\n <div class=\"input-group-btn\">\n <button\n type=\"button\"\n class=\"btn btn-default dropdown-toggle\"\n data-toggle=\"dropdown\"\n aria-haspopup=\"true\"\n aria-expanded=\"false\"\n >\n {{ 'weeks' | translate }} <span class=\"caret\"></span>\n </button>\n <ul class=\"dropdown-menu up\">\n <li (click)=\"weeksSelected(count)\" *ngFor=\"let count of weeks\">\n <span> {{ count }} {{ 'weeks' | translate }}</span>\n </li>\n </ul>\n </div>\n </div>\n </div>\n <div *ngIf=\"showTime\" class=\"col-xs-4 col-md-4\">\n <input\n type=\"text\"\n class=\"form-control\"\n [value]=\"value | date: 'shortTime'\"\n (focus)=\"toggleTimePicker(true)\"\n readonly\n placeholder=\"Select Time\"\n />\n </div>\n</div>\n<ofe-date-picker\n *ngIf=\"showDatePicker\"\n [initDate]=\"value\"\n (dateSelect)=\"setDate($event)\"\n (datePickerCancel)=\"toggleDatePicker($event)\"\n></ofe-date-picker>\n\n<ofe-time-picker\n *ngIf=\"showTimePicker\"\n [initTime]=\"value\"\n [use12Hour]=\"true\"\n (timeSelect)=\"setTime($event)\"\n (timePickerCancel)=\"toggleTimePicker($event)\"\n></ofe-time-picker>\n", styles: ["input[readonly]{background-color:#fff}.up{bottom:100%!important;top:auto!important}.glyphicon{top:1px}\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: "component", type: DatePickerComponent, selector: "ofe-date-picker", inputs: ["initDate", "locale", "viewFormat", "returnObject"], outputs: ["datePickerCancel", "dateSelect"] }, { kind: "component", type: TimePickerComponent, selector: "ofe-time-picker", inputs: ["initTime", "showSecond", "viewFormat", "use12Hour", "returnObject"], outputs: ["timeSelect", "timePickerCancel"] }, { kind: "pipe", type: i1.DatePipe, name: "date" }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] }); }
9665
+ ], ngImport: i0, template: "<div class=\"row\">\n <div *ngIf=\"!showTime\" class=\"col-xs-12 col-md-12\">\n <input\n *ngIf=\"!showWeeks\"\n type=\"text\"\n class=\"form-control\"\n [value]=\"value | date: 'mediumDate'\"\n (focus)=\"toggleDatePicker(true)\"\n readonly\n placeholder=\"Select Date\"\n />\n <div *ngIf=\"showWeeks\" class=\"input-group\">\n <input\n type=\"text\"\n class=\"form-control\"\n class=\"form-control\"\n [value]=\"value | date: 'mediumDate'\"\n (focus)=\"toggleDatePicker(true)\"\n readonly\n placeholder=\"Select Date\"\n />\n <div class=\"input-group-btn\">\n <button\n type=\"button\"\n class=\"btn btn-default dropdown-toggle\"\n data-toggle=\"dropdown\"\n aria-haspopup=\"true\"\n aria-expanded=\"false\"\n >\n {{ 'weeks' | translate }} <span class=\"caret\"></span>\n </button>\n <ul class=\"dropdown-menu up\">\n <li (click)=\"weeksSelected(count)\" *ngFor=\"let count of weeks\">\n <span> {{ count }} {{ 'weeks' | translate }}</span>\n </li>\n </ul>\n </div>\n </div>\n </div>\n <div *ngIf=\"showTime\" class=\"col-xs-8 col-md-8\">\n <input\n *ngIf=\"!showWeeks\"\n type=\"text\"\n class=\"form-control\"\n [value]=\"value | date: 'mediumDate'\"\n (focus)=\"toggleDatePicker(true)\"\n readonly\n placeholder=\"Select Date\"\n />\n <div *ngIf=\"showWeeks\" class=\"input-group\">\n <input\n type=\"text\"\n class=\"form-control\"\n class=\"form-control\"\n [value]=\"value | date: 'mediumDate'\"\n (focus)=\"toggleDatePicker(true)\"\n readonly\n placeholder=\"Select Date\"\n />\n <div class=\"input-group-btn\">\n <button\n type=\"button\"\n class=\"btn btn-default dropdown-toggle\"\n data-toggle=\"dropdown\"\n aria-haspopup=\"true\"\n aria-expanded=\"false\"\n >\n {{ 'weeks' | translate }} <span class=\"caret\"></span>\n </button>\n <ul class=\"dropdown-menu up\">\n <li (click)=\"weeksSelected(count)\" *ngFor=\"let count of weeks\">\n <span> {{ count }} {{ 'weeks' | translate }}</span>\n </li>\n </ul>\n </div>\n </div>\n </div>\n <div *ngIf=\"showTime\" class=\"col-xs-4 col-md-4\">\n <input\n type=\"text\"\n class=\"form-control\"\n [value]=\"value | date: 'shortTime'\"\n (focus)=\"toggleTimePicker(true)\"\n readonly\n placeholder=\"Select Time\"\n />\n </div>\n</div>\n<ofe-date-picker\n *ngIf=\"showDatePicker\"\n [initDate]=\"value\"\n (dateSelect)=\"setDate($event)\"\n (datePickerCancel)=\"toggleDatePicker($event)\"\n></ofe-date-picker>\n\n<ofe-time-picker\n *ngIf=\"showTimePicker\"\n [initTime]=\"value\"\n [use12Hour]=\"true\"\n (timeSelect)=\"setTime($event)\"\n (timePickerCancel)=\"toggleTimePicker($event)\"\n></ofe-time-picker>\n", styles: ["input[readonly]{background-color:#fff}.up{bottom:100%!important;top:auto!important}.glyphicon{top:1px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: DatePickerComponent, selector: "ofe-date-picker", inputs: ["initDate", "locale", "viewFormat", "returnObject"], outputs: ["datePickerCancel", "dateSelect"] }, { kind: "component", type: TimePickerComponent, selector: "ofe-time-picker", inputs: ["initTime", "showSecond", "viewFormat", "use12Hour", "returnObject"], outputs: ["timeSelect", "timePickerCancel"] }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] }); }
9656
9666
  }
9657
9667
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DateTimePickerComponent, decorators: [{
9658
9668
  type: Component,
@@ -10388,7 +10398,7 @@ class NativeDateTimeAdapter extends DateTimeAdapter {
10388
10398
  const d = new Date(Date.UTC(date.getFullYear(), date.getMonth(), date.getDate(), date.getHours(), date.getMinutes(), date.getSeconds(), date.getMilliseconds()));
10389
10399
  return dtf.format(d);
10390
10400
  }
10391
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NativeDateTimeAdapter, deps: [{ token: OWL_DATE_TIME_LOCALE, optional: true }, { token: i1$5.Platform }], target: i0.ɵɵFactoryTarget.Injectable }); }
10401
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NativeDateTimeAdapter, deps: [{ token: OWL_DATE_TIME_LOCALE, optional: true }, { token: i1$6.Platform }], target: i0.ɵɵFactoryTarget.Injectable }); }
10392
10402
  static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NativeDateTimeAdapter }); }
10393
10403
  }
10394
10404
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NativeDateTimeAdapter, decorators: [{
@@ -10398,7 +10408,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
10398
10408
  }, {
10399
10409
  type: Inject,
10400
10410
  args: [OWL_DATE_TIME_LOCALE]
10401
- }] }, { type: i1$5.Platform }]; } });
10411
+ }] }, { type: i1$6.Platform }]; } });
10402
10412
 
10403
10413
  const OWL_NATIVE_DATE_TIME_FORMATS = {
10404
10414
  parseInput: null,
@@ -12472,12 +12482,12 @@ class FormFactory {
12472
12482
  }
12473
12483
  }
12474
12484
  }
12475
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFactory, deps: [{ token: FormControlService }, { token: QuestionFactory }, { token: ControlRelationsFactory }, { token: i4.TranslateService }], target: i0.ɵɵFactoryTarget.Injectable }); }
12485
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFactory, deps: [{ token: FormControlService }, { token: QuestionFactory }, { token: ControlRelationsFactory }, { token: i1.TranslateService }], target: i0.ɵɵFactoryTarget.Injectable }); }
12476
12486
  static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFactory }); }
12477
12487
  }
12478
12488
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormFactory, decorators: [{
12479
12489
  type: Injectable
12480
- }], ctorParameters: function () { return [{ type: FormControlService }, { type: QuestionFactory }, { type: ControlRelationsFactory }, { type: i4.TranslateService }]; } });
12490
+ }], ctorParameters: function () { return [{ type: FormControlService }, { type: QuestionFactory }, { type: ControlRelationsFactory }, { type: i1.TranslateService }]; } });
12481
12491
 
12482
12492
  class ObsAdapterHelper {
12483
12493
  constructor() {
@@ -14513,7 +14523,7 @@ class LabelComponent {
14513
14523
  [ngTemplateOutlet]="warnText"
14514
14524
  ></ng-template>
14515
14525
  </div>
14516
- `, isInline: true, dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
14526
+ `, isInline: true, dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
14517
14527
  }
14518
14528
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LabelComponent, decorators: [{
14519
14529
  type: Component,