@mtna/web-form-angular 1.0.2 → 1.0.4-SNAPSHOT.1

package/fesm2015/mtna-web-form-angular.js

@@ -1,35 +1,35 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, Injectable, Optional, Inject, Component, Input, HostBinding, EventEmitter, Output, Pipe, NgModule, ChangeDetectionStrategy, ViewEncapsulation, ViewChild } from '@angular/core';
+import { Injectable, InjectionToken, Optional, Inject, Component, Input, HostBinding, EventEmitter, Output, Pipe, NgModule, ChangeDetectionStrategy, ViewEncapsulation, ViewChild } from '@angular/core';
 import * as i1 from '@angular/material/dialog';
 import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
 import { coerceBooleanProperty } from '@angular/cdk/coercion';
-import { isForm, I18N_SHORT_ANSWER_ITEM_ID, I18N_PARAGRAPH_ANSWER_ITEM_ID, SHORT_ANSWER_ITEM_ID, PARAGRAPH_ANSWER_ITEM_ID, WHOLE_NUMBER_ANSWER_ITEM_ID, isWholeNumberItem, DECIMAL_ANSWER_ITEM_ID, CHECKBOX_ITEM_ID, isRepeatableItem, isSection, isFormItemGroupImpl, isTableItem, isOffsetDateRangeItem, isYearQuarterRangeItem, isDataCubeItem, TITLE_ITEM_ID, TEXT_ITEM_ID, SECTION_ID, FORM_ITEM_GROUP_IMPL_ID, isConditionalItem, isOptionItemImpl, isOptionGroupItemImpl, isValueItem, MtnaWfFormItemChange, DROPDOWN_ITEM_ID, isInternationalizedParagraphAnswerItem, isDecimalAnswerItem, isParagraphAnswerItem } from '@mtna/web-form-ts';
+import { isForm, I18N_SHORT_ANSWER_ITEM_ID, I18N_PARAGRAPH_ANSWER_ITEM_ID, SHORT_ANSWER_ITEM_ID, PARAGRAPH_ANSWER_ITEM_ID, WHOLE_NUMBER_ANSWER_ITEM_ID, isWholeNumberItem, DECIMAL_ANSWER_ITEM_ID, CHECKBOX_ITEM_ID, isProgressiveForm, isRepeatableItem, isSection, isFormItemGroupImpl, isTableItem, isOffsetDateRangeItem, isYearQuarterRangeItem, isDataCubeItem, TITLE_ITEM_ID, TEXT_ITEM_ID, SECTION_ID, FORM_ITEM_GROUP_IMPL_ID, isConditionalItem, isOptionItemImpl, isOptionGroupItemImpl, isValueItem, MtnaWfFormItemChange, DROPDOWN_ITEM_ID, isInternationalizedParagraphAnswerItem, isDecimalAnswerItem, isParagraphAnswerItem, BOOLEAN_ITEM_ID, DATE_ITEM_ID, OFFSET_DATE_RANGE_ITEM_ID, FILE_UPLOAD_ITEM_ID, MULTIPLE_CHOICE_ITEM_ID, NUMBERED_LIST_ITEM_ID, REPEATABLE_ITEM_ID, RESOURCE_SEARCH_ITEM_ID, BULLETED_LIST_ITEM_ID, YEAR_QUARTER_RANGE_ITEM_ID } from '@mtna/web-form-ts';
 import { BehaviorSubject, Subject, Subscription, merge } from 'rxjs';
 import * as i6 from '@angular/forms';
 import { FormGroup, Validators, FormControl, FormArray, FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { isType, isKey, isNullOrUndefined, isPresent, isObject, toLetters } from '@mtna/core-ts';
+import { isKey, isNullOrUndefined, isPresent, isType, isObject, toLetters } from '@mtna/core-ts';
 import * as i3$3 from '@angular/material/core';
 import { ErrorStateMatcher, mixinColor, MatRippleModule } from '@angular/material/core';
 import { trigger, state, style, transition, animate } from '@angular/animations';
 import * as i2 from '@mtna/pojo-social-angular';
 import { MtnaAnnotationsIndicatorModule } from '@mtna/pojo-social-angular';
-import * as i4 from '@mtna/core-angular';
+import * as i1$1 from '@mtna/core-angular';
 import { mixinDestroyNotifier, MtnaComponentInjector, INJECTION_SERVICE, MtnaStatusCircleModule, MtnaHighlightModule, COMPLEX_STANDARD as COMPLEX_STANDARD$1, MtnaTrackByPropertyPipeModule, InjectedComponentProvider } from '@mtna/core-angular';
-import * as i1$6 from '@angular/material/radio';
+import * as i1$7 from '@angular/material/radio';
 import { MatRadioChange, MatRadioModule } from '@angular/material/radio';
 import * as i2$4 from '@angular/material/select';
 import { MatSelectChange, MatSelectModule } from '@angular/material/select';
 import * as i3 from '@angular/common';
 import { CommonModule } from '@angular/common';
-import * as i1$1 from '@angular/platform-browser';
+import * as i1$2 from '@angular/platform-browser';
 import * as i3$1 from '@angular/material/button';
 import { MatButtonModule } from '@angular/material/button';
 import { MatMomentDateModule } from '@angular/material-moment-adapter';
 import { skipWhile, take, takeUntil, distinctUntilChanged } from 'rxjs/operators';
-import * as i1$2 from '@angular/common/http';
-import * as i1$7 from '@mtna/search-manager-angular';
+import * as i1$3 from '@angular/common/http';
+import * as i1$8 from '@mtna/search-manager-angular';
 import { MtnaSearchSelectionService, MtnaSearchDialogComponent, MtnaSearchDialogData } from '@mtna/search-manager-angular';
-import * as i4$1 from '@angular/cdk/a11y';
+import * as i4 from '@angular/cdk/a11y';
 import { A11yModule } from '@angular/cdk/a11y';
 import { FlexLayoutModule } from '@angular/flex-layout';
 import * as i2$1 from '@angular/material/divider';
@@ -40,103 +40,28 @@ import * as i6$1 from '@angular/material/tooltip';
 import { MatTooltipModule } from '@angular/material/tooltip';
 import * as i3$2 from '@angular/flex-layout/flex';
 import * as i7 from '@angular/flex-layout/extended';
-import * as i1$3 from '@angular/material/card';
+import * as i1$4 from '@angular/material/card';
 import { MatCardModule } from '@angular/material/card';
 import * as i2$2 from '@angular/material/slide-toggle';
 import { MatSlideToggleModule } from '@angular/material/slide-toggle';
 import * as i2$3 from '@angular/material/checkbox';
 import { MatCheckboxModule } from '@angular/material/checkbox';
-import * as i1$4 from '@angular/material/form-field';
+import * as i1$5 from '@angular/material/form-field';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import * as i3$4 from '@angular/material/datepicker';
 import { MatDatepicker, MatDatepickerModule } from '@angular/material/datepicker';
 import * as i5$1 from '@angular/material/input';
 import { MatInputModule } from '@angular/material/input';
-import * as i4$2 from '@angular/material/list';
+import * as i4$1 from '@angular/material/list';
 import { MatListModule } from '@angular/material/list';
-import * as i1$5 from '@mtna/file-manager-angular';
+import * as i1$6 from '@mtna/file-manager-angular';
 import { MtnaFileDownloadModule, MtnaFileUploadModule } from '@mtna/file-manager-angular';
 import * as i5$2 from '@angular/material/progress-spinner';
 import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
 import { MtnaLocaleIds, mtnaToLanguageId, mtnaLanguageIdToDisplay } from '@mtna/core-i18n-angular';
-import * as i1$8 from '@angular/material/table';
+import * as i1$9 from '@angular/material/table';
 import { MatTableModule } from '@angular/material/table';
 
-class BaseFormStep {
-    constructor(instanceId) {
-        this.instanceId = instanceId;
-    }
-}
-
-class FormStepGroup extends BaseFormStep {
-    constructor(steps, instanceId, collapsed = false, label, num) {
-        super(instanceId);
-        this.steps = steps;
-        this.collapsed = collapsed;
-        this.label = label;
-        this.num = num;
-        this.className = 'FormStepGroup';
-    }
-}
-function isFormStepGroup(something) {
-    return isType(something, 'steps') && Array.isArray(something.steps);
-}
-function instanceOfFormStepGroup(something) {
-    return isType(something, 'className') && something.className === 'FormStepGroup';
-}
-
-class FormStep extends BaseFormStep {
-    constructor(num, label, instanceId, optional = false) {
-        super(instanceId);
-        this.num = num;
-        this.label = label;
-        this.optional = optional;
-        this.className = 'FormStep';
-        this.active = false;
-        this.status = 'INVALID';
-        this.disabled = false;
-    }
-}
-function instanceOfFormStep(something) {
-    return isType(something, 'className') && something.className === 'FormStep';
-}
-
-const PROGRESSIVE_FORM_ID = 'us.mtna.web.form.impl.ProgressiveFormImpl';
-function isProgressiveForm(something) {
-    return isType(something, 'itemId') && something.itemId === PROGRESSIVE_FORM_ID;
-}
-
-const PROGRESSIVE_FORM_SECTION_ID = 'us.mtna.web.form.impl.ProgressiveFormSectionImpl';
-function isProgressiveFormSection(something) {
-    return isType(something, 'itemId') && something.itemId === PROGRESSIVE_FORM_SECTION_ID;
-}
-
-const MTNA_WF_API_TOKEN = new InjectionToken('mtnaWfApiConfig');
-
-/**
- * Dialog data for a {@link MtnaWfFormItemDialogComponent}
- */
-class MtnaWfFormItemDialogData {
-    /**
-     * @param formItems The form items to render in the dialog
-     * @param title optional dialog title
-     */
-    constructor(formItems, title) {
-        this.formItems = formItems;
-        this.title = title;
-    }
-}
-
-const MTNA_WF_ITEM_WHITELIST = new InjectionToken('mtna-wf-item-whitelist', {
-    providedIn: 'root',
-    factory: MTNA_WF_ITEM_WHITELIST_FACTORY,
-});
-function MTNA_WF_ITEM_WHITELIST_FACTORY() {
-    return {
-        itemTypes: [],
-    };
-}
-
 const MTNA_WF_FORM_ITEM_VALIDATION_RESULT_ERROR_NAME = 'formItemValidationResult';
 /**
  * Valitator function that will check the root level {@link FormValidationResult} on
@@ -328,7 +253,6 @@ function determineSerializeFunctionToUse(formItem, managerService, customFormIte
         isProgressiveForm(formItem) ||
         isRepeatableItem(formItem) ||
         isSection(formItem) ||
-        isProgressiveFormSection(formItem) ||
         isFormItemGroupImpl(formItem)) {
         return serializeFormItems(formItem, managerService, customFormItemConditional, customControlGenerator);
     }
@@ -417,7 +341,7 @@ function insertTableItemValues(item, ngFormValue, disabledState, customFormItemC
  * @param parent Parent of the FormItem, used to pass to the customFormItemBuilder
  */
 function determineInsertFunctionToUse(formItem, ngFormValue, disabledState, customFormItemConditional = () => false, customFormItemBuilder, parent) {
-    if (isSection(formItem) || isProgressiveFormSection(formItem) || isFormItemGroupImpl(formItem) || isRepeatableItem(formItem)) {
+    if (isSection(formItem) || isFormItemGroupImpl(formItem) || isRepeatableItem(formItem)) {
         const items = insertFormItemValues(formItem, ngFormValue, disabledState, customFormItemConditional, customFormItemBuilder);
         return Object.assign(Object.assign({}, formItem), { items, disabled: _isDisabled(formItem, disabledState) });
     }
@@ -648,6 +572,71 @@ function findFormItem(instanceId, group) {
     return null;
 }
 
+class BaseFormStep {
+    constructor(instanceId) {
+        this.instanceId = instanceId;
+    }
+}
+
+class FormStepGroup extends BaseFormStep {
+    constructor(steps, instanceId, collapsed = false, label, num) {
+        super(instanceId);
+        this.steps = steps;
+        this.collapsed = collapsed;
+        this.label = label;
+        this.num = num;
+        this.className = 'FormStepGroup';
+    }
+}
+function isFormStepGroup(something) {
+    return isType(something, 'steps') && Array.isArray(something.steps);
+}
+function instanceOfFormStepGroup(something) {
+    return isType(something, 'className') && something.className === 'FormStepGroup';
+}
+
+class FormStep extends BaseFormStep {
+    constructor(num, label, instanceId, optional = false) {
+        super(instanceId);
+        this.num = num;
+        this.label = label;
+        this.optional = optional;
+        this.className = 'FormStep';
+        this.active = false;
+        this.status = 'INVALID';
+        this.disabled = false;
+    }
+}
+function instanceOfFormStep(something) {
+    return isType(something, 'className') && something.className === 'FormStep';
+}
+
+const MTNA_WF_API_TOKEN = new InjectionToken('mtnaWfApiConfig');
+
+/**
+ * Dialog data for a {@link MtnaWfFormItemDialogComponent}
+ */
+class MtnaWfFormItemDialogData {
+    /**
+     * @param formItems The form items to render in the dialog
+     * @param title optional dialog title
+     */
+    constructor(formItems, title) {
+        this.formItems = formItems;
+        this.title = title;
+    }
+}
+
+const MTNA_WF_ITEM_WHITELIST = new InjectionToken('mtna-wf-item-whitelist', {
+    providedIn: 'root',
+    factory: MTNA_WF_ITEM_WHITELIST_FACTORY,
+});
+function MTNA_WF_ITEM_WHITELIST_FACTORY() {
+    return {
+        itemTypes: [],
+    };
+}
+
 /**
  * Flattens formStepGroup.steps and combines all steps into single array
  * @param steps Array<FormStep | FormStepGroup>
@@ -704,7 +693,7 @@ function generateFormSteps(items, allSteps = false) {
         if (allSteps) {
             newArray.push(new FormStep(count + 1, item.name || 'No Title', item.instanceId, !item.required));
         }
-        else if (isSection(item) || isProgressiveFormSection(item)) {
+        else if (isSection(item)) {
             // If the item is a Section, add a step
             newArray.push(new FormStep(count + 1, item.title.value || 'No Title', item.instanceId, !item.required));
         }
@@ -712,7 +701,7 @@ function generateFormSteps(items, allSteps = false) {
             // If the item is a DataCubeItem, add a step and add a group step for the sub-sections
             newArray.push(new FormStep(count + 1, item.title.value || '', item.instanceId, !item.required));
             const subSectionSteps = item.items
-                .filter(isSection || isProgressiveFormSection)
+                .filter(isSection)
                 .map((item, index) => new FormStep(`${count + 1}${toLetters(index + 1)}`, item.title.value || '', item.instanceId, !item.required));
             newArray.push(new FormStepGroup(subSectionSteps, item.instanceId, false, item.name, count + 1));
         }
@@ -796,12 +785,16 @@ const DEFAULT_ERROR_MESSAGES = {
     email: $localize `This field must include a valid email format.`,
     max: (item) => !isPresent(item) || !isPresent(item === null || item === void 0 ? void 0 : item.maxValue)
         ? $localize `This field's value must be less.`
-        : isPresent(item === null || item === void 0 ? void 0 : item.minValue) ? $localize `Min value: ${item.minValue} - ` : '' + $localize `Max value: ${item.maxValue}`,
+        : isPresent(item === null || item === void 0 ? void 0 : item.minValue)
+            ? $localize `Min value: ${item.minValue} - `
+            : '' + $localize `Max value: ${item.maxValue}`,
     maxlength: $localize `This field has exceeded the allowed maximum.`,
     maxSelected: null,
     min: (item) => !isPresent(item) || !isPresent(item === null || item === void 0 ? void 0 : item.minValue)
         ? $localize `This field's value must be greater.`
-        : $localize `Min Value: ${item.minValue}` + isPresent(item === null || item === void 0 ? void 0 : item.maxValue) ? $localize ` - Max Value: ${item.maxValue}` : '',
+        : $localize `Min Value: ${item.minValue}` + isPresent(item === null || item === void 0 ? void 0 : item.maxValue)
+            ? $localize ` - Max Value: ${item.maxValue}`
+            : '',
     minlength: $localize `This field has not met the required minimum.`,
     minSelected: null,
     nonDigit: $localize `This field's value must be numeric.`,
@@ -1517,7 +1510,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                     selector: 'mtna-wf-item-injector',
                     template: ``,
                 }]
-        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ComponentFactoryResolver }, { type: i0.ViewContainerRef }, { type: i4.InjectionService, decorators: [{
+        }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i0.ComponentFactoryResolver }, { type: i0.ViewContainerRef }, { type: i1$1.InjectionService, decorators: [{
                     type: Inject,
                     args: [INJECTION_SERVICE]
                 }] }]; }, propDecorators: { color: [{
@@ -1555,14 +1548,14 @@ class MtnaWfSanitizeHtmlPipe {
         return this._sanitizer.bypassSecurityTrustHtml(v);
     }
 }
-MtnaWfSanitizeHtmlPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfSanitizeHtmlPipe, deps: [{ token: i1$1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe });
+MtnaWfSanitizeHtmlPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfSanitizeHtmlPipe, deps: [{ token: i1$2.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe });
 MtnaWfSanitizeHtmlPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfSanitizeHtmlPipe, name: "mtnaWfSanitizeHtml" });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfSanitizeHtmlPipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'mtnaWfSanitizeHtml',
                 }]
-        }], ctorParameters: function () { return [{ type: i1$1.DomSanitizer }]; } });
+        }], ctorParameters: function () { return [{ type: i1$2.DomSanitizer }]; } });
 class MtnaWfSanitizeHtmlPipeModule {
 }
 MtnaWfSanitizeHtmlPipeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfSanitizeHtmlPipeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
@@ -1805,7 +1798,7 @@ ChildStepActivePipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", versio
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ChildStepActivePipe, decorators: [{
             type: Pipe,
             args: [{
-                    name: 'childStepActive'
+                    name: 'childStepActive',
                 }]
         }] });
 class ChildStepActivePipeModule {
@@ -1817,7 +1810,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
             type: NgModule,
             args: [{
                     declarations: [ChildStepActivePipe],
-                    exports: [ChildStepActivePipe]
+                    exports: [ChildStepActivePipe],
                 }]
         }] });
 
@@ -2027,7 +2020,7 @@ CoerceFormStepPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CoerceFormStepPipe, decorators: [{
             type: Pipe,
             args: [{
-                    name: 'coerceFormStep'
+                    name: 'coerceFormStep',
                 }]
         }] });
 class CoerceFormStepPipeModule {
@@ -2096,6 +2089,53 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                 }]
         }] });
 
+/**
+ * There are certain form items that are hidden from the UI because they carry static values
+ * that are populated from the server. These items should not show up in the form but if they
+ * go through the injector there will be an empty mtna-wf-item placed into the form which can
+ * affect styling. This pipe will seek to identify form items that have no key registered in
+ * the injected component providers and log them and remove them from the list of items.
+ */
+class MtnaWfFilterHiddenItemsPipe {
+    constructor(injectionService) {
+        this.injectionService = injectionService;
+    }
+    transform(items) {
+        const filteredItems = [];
+        if (items) {
+            for (const item of items) {
+                if (this.injectionService.getInjectedComponent(item.itemId)) {
+                    filteredItems.push(item);
+                }
+            }
+        }
+        return filteredItems;
+    }
+}
+MtnaWfFilterHiddenItemsPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfFilterHiddenItemsPipe, deps: [{ token: INJECTION_SERVICE }], target: i0.ɵɵFactoryTarget.Pipe });
+MtnaWfFilterHiddenItemsPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfFilterHiddenItemsPipe, name: "mtnaWfFilterHiddenItems" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfFilterHiddenItemsPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'mtnaWfFilterHiddenItems',
+                }]
+        }], ctorParameters: function () { return [{ type: i1$1.InjectionService, decorators: [{
+                    type: Inject,
+                    args: [INJECTION_SERVICE]
+                }] }]; } });
+class MtnaWfFilterHiddenItemsPipeModule {
+}
+MtnaWfFilterHiddenItemsPipeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfFilterHiddenItemsPipeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+MtnaWfFilterHiddenItemsPipeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfFilterHiddenItemsPipeModule, declarations: [MtnaWfFilterHiddenItemsPipe], exports: [MtnaWfFilterHiddenItemsPipe] });
+MtnaWfFilterHiddenItemsPipeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfFilterHiddenItemsPipeModule });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfFilterHiddenItemsPipeModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [MtnaWfFilterHiddenItemsPipe],
+                    exports: [MtnaWfFilterHiddenItemsPipe],
+                }]
+        }] });
+
 /**
  * Pipe to determine if a FormStep is a FormStepGroup or a single step.
  */
@@ -2608,7 +2648,7 @@ class MtnaWfApiService {
         return this.http.get(this.TEMPLATE_DELETE_URL);
     }
 }
-MtnaWfApiService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfApiService, deps: [{ token: MTNA_WF_API_TOKEN }, { token: i1$2.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
+MtnaWfApiService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfApiService, deps: [{ token: MTNA_WF_API_TOKEN }, { token: i1$3.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
 MtnaWfApiService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfApiService, providedIn: 'root' });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfApiService, decorators: [{
             type: Injectable,
@@ -2616,7 +2656,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
         }], ctorParameters: function () { return [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [MTNA_WF_API_TOKEN]
-                }] }, { type: i1$2.HttpClient }]; } });
+                }] }, { type: i1$3.HttpClient }]; } });
 
 /**
  * A dialog that renders a form item.
@@ -3049,7 +3089,7 @@ class MtnaWfManagerService {
                 return item;
             }
         }
-        if (isForm(item) || isSection(item) || isProgressiveFormSection(item) || isFormItemGroupImpl(item) || isRepeatableItem(item)) {
+        if (isForm(item) || isSection(item) || isFormItemGroupImpl(item) || isRepeatableItem(item)) {
             const items = [...item.items];
             const indexToModify = item.items.findIndex((i) => i.instanceId === change.parentIds[0]);
             const itemToModify = item.items[indexToModify];
@@ -3596,7 +3636,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
 class MtnaWfFormComponent extends MtnaWfBaseFormComponent {
 }
 MtnaWfFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfFormComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MtnaWfFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfFormComponent, selector: "mtna-form", outputs: { status: "status", focusedSection: "focusedSection", mtnaFormChange: "mtnaFormChange" }, usesInheritance: true, ngImport: i0, template: "<form *ngIf=\"ngForm\" [formGroup]=\"ngForm\" [formDisabled]=\"readonly\">\n  <mtna-wf-item\n    *ngFor=\"let item of mtnaForm?.items; let index = index; trackBy: _trackByInstanceId\"\n    [item]=\"item\"\n    [control]=\"ngForm.controls[item.instanceId]\"\n    [readonly]=\"readonly\"\n    [parentIds]=\"componentIds\"\n    [step]=\"_steps?.[item.instanceId]\"\n    (focusedSection)=\"focusedSection.emit($event)\"\n  ></mtna-wf-item>\n</form>\n", styles: ["mtna-form form{display:block}mtna-form form .mtna-wf-section{display:block;margin:32px 0}mtna-form form fieldset[disabled] .mtna-wf-item .mtna-wf-date-item .mat-form-field.mat-form-field-appearance-outline .mat-form-field-flex:hover .mat-form-field-outline{opacity:0}mtna-form form fieldset[disabled] .mtna-wf-item .mtna-wf-date-item .mat-form-field.mat-form-field-appearance-outline .mat-form-field-flex:hover .mat-form-field-outline-thick{opacity:1}mtna-form form fieldset[disabled] .mtna-wf-item .mtna-wf-date-item .mat-form-field.mat-form-field-appearance-outline .mat-form-field-flex:hover .mat-form-field-outline-thick .mat-form-field-outline-end,mtna-form form fieldset[disabled] .mtna-wf-item .mtna-wf-date-item .mat-form-field.mat-form-field-appearance-outline .mat-form-field-flex:hover .mat-form-field-outline-thick .mat-form-field-outline-gap,mtna-form form fieldset[disabled] .mtna-wf-item .mtna-wf-date-item .mat-form-field.mat-form-field-appearance-outline .mat-form-field-flex:hover .mat-form-field-outline-thick .mat-form-field-outline-start{border-width:1px}mtna-form form fieldset[disabled] .mtna-wf-item .mtna-wf-date-item .mat-form-field.mat-form-field-appearance-outline .mat-form-field-suffix .mat-datepicker-toggle .mat-icon-button{cursor:default}mtna-form .mtna-wf-item,mtna-form .mtna-wf-title{margin-top:1rem}mtna-form .mtna-wf-text{margin:.5rem 0;font-size:.9rem}mtna-form .mtna-wf-title-item,mtna-form .mtna-wf-text-item{margin:0}\n"], components: [{ type: MtnaWfFormDisablerComponent, selector: "[formDisabled]", inputs: ["formDisabled"] }, { type: MtnaWfFormItemComponent, selector: "mtna-wf-item", inputs: ["color", "control", "header", "inList", "item", "parentIds", "readonly", "step"], outputs: ["focusedSection"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i6.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+MtnaWfFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfFormComponent, selector: "mtna-form", outputs: { status: "status", focusedSection: "focusedSection", mtnaFormChange: "mtnaFormChange" }, usesInheritance: true, ngImport: i0, template: "<form *ngIf=\"ngForm\" [formGroup]=\"ngForm\" [formDisabled]=\"readonly\">\n  <mtna-wf-item\n    *ngFor=\"let item of mtnaForm?.items | mtnaWfFilterHiddenItems; let index = index; trackBy: _trackByInstanceId\"\n    [item]=\"item\"\n    [control]=\"ngForm.controls[item.instanceId]\"\n    [readonly]=\"readonly\"\n    [parentIds]=\"componentIds\"\n    [step]=\"_steps?.[item.instanceId]\"\n    (focusedSection)=\"focusedSection.emit($event)\"\n  ></mtna-wf-item>\n</form>\n", styles: ["mtna-form form{display:block}mtna-form form mtna-wf-item:not(:first-of-type){display:block;margin:32px 0}mtna-form form fieldset[disabled] .mtna-wf-item .mtna-wf-date-item .mat-form-field.mat-form-field-appearance-outline .mat-form-field-flex:hover .mat-form-field-outline{opacity:0}mtna-form form fieldset[disabled] .mtna-wf-item .mtna-wf-date-item .mat-form-field.mat-form-field-appearance-outline .mat-form-field-flex:hover .mat-form-field-outline-thick{opacity:1}mtna-form form fieldset[disabled] .mtna-wf-item .mtna-wf-date-item .mat-form-field.mat-form-field-appearance-outline .mat-form-field-flex:hover .mat-form-field-outline-thick .mat-form-field-outline-end,mtna-form form fieldset[disabled] .mtna-wf-item .mtna-wf-date-item .mat-form-field.mat-form-field-appearance-outline .mat-form-field-flex:hover .mat-form-field-outline-thick .mat-form-field-outline-gap,mtna-form form fieldset[disabled] .mtna-wf-item .mtna-wf-date-item .mat-form-field.mat-form-field-appearance-outline .mat-form-field-flex:hover .mat-form-field-outline-thick .mat-form-field-outline-start{border-width:1px}mtna-form form fieldset[disabled] .mtna-wf-item .mtna-wf-date-item .mat-form-field.mat-form-field-appearance-outline .mat-form-field-suffix .mat-datepicker-toggle .mat-icon-button{cursor:default}mtna-form .mtna-wf-item,mtna-form .mtna-wf-title{margin-top:1rem}mtna-form .mtna-wf-text{margin:.5rem 0;font-size:.9rem}mtna-form .mtna-wf-title-item,mtna-form .mtna-wf-text-item{margin:0}\n"], components: [{ type: MtnaWfFormDisablerComponent, selector: "[formDisabled]", inputs: ["formDisabled"] }, { type: MtnaWfFormItemComponent, selector: "mtna-wf-item", inputs: ["color", "control", "header", "inList", "item", "parentIds", "readonly", "step"], outputs: ["focusedSection"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i6.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "mtnaWfFilterHiddenItems": MtnaWfFilterHiddenItemsPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfFormComponent, decorators: [{
             type: Component,
             args: [{
@@ -3666,7 +3706,7 @@ class MtnaWfFormStepComponent extends _FormStepMixinBase$1 {
     }
 }
 MtnaWfFormStepComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfFormStepComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-MtnaWfFormStepComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfFormStepComponent, selector: "mtna-wf-step", inputs: { color: "color", step: "step", clickable: "clickable", incompleteIcon: "incompleteIcon" }, host: { properties: { "class.disabled": "this.disabled", "class.clickable": "this.clickable" } }, usesInheritance: true, ngImport: i0, template: "<li\n  fxLayout=\"row\"\n  fxLayoutAlign=\"start center\"\n  matRipple\n  [matRippleDisabled]=\"!clickable\"\n  [class.active-step]=\"step.active\"\n  (click)=\"_haltClickEvent($event)\"\n>\n  <mtna-status-circle\n    [color]=\"color\"\n    [circleNumber]=\"step.num\"\n    [incompleteIcon]=\"incompleteIcon\"\n    [optional]=\"step.optional\"\n    [status]=\"step.status\"\n  ></mtna-status-circle>\n  <div fxLayout=\"column\" fxFlex=\"100\">\n    <p class=\"step-title\">{{ step.label }}</p>\n    <p *ngIf=\"step.optional && !disabled\" class=\"step-status\" i18n>Optional</p>\n    <p *ngIf=\"disabled\" class=\"step-status\">{{ step.disabledText || notApplicableText }}</p>\n  </div>\n</li>\n", styles: ["mtna-wf-step li{padding:8px 16px;position:relative;-webkit-user-select:none;-o-user-select:none;user-select:none;line-height:24px;font-size:14px;transition:background-color .15s cubic-bezier(0,0,.2,1)}mtna-wf-step li:after{content:\"\";display:block;position:absolute;top:0;right:0;bottom:0;width:5px;transition:transform .4s cubic-bezier(.25,.8,.25,1);transform-origin:bottom;transform:scaleY(0);z-index:1}mtna-wf-step li .step-title,mtna-wf-step li .step-status{margin:0}mtna-wf-step.disabled{font-style:italic}\n"], components: [{ type: i4.MtnaStatusCircleComponent, selector: "mtna-status-circle", inputs: ["color", "circleNumber", "incompleteIcon", "status", "validIcon", "optional"] }], directives: [{ type: i3$2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i3$2.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { type: i3$3.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleRadius", "matRippleDisabled", "matRippleTrigger", "matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleAnimation"], exportAs: ["matRipple"] }, { type: i3$2.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+MtnaWfFormStepComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfFormStepComponent, selector: "mtna-wf-step", inputs: { color: "color", step: "step", clickable: "clickable", incompleteIcon: "incompleteIcon" }, host: { properties: { "class.disabled": "this.disabled", "class.clickable": "this.clickable" } }, usesInheritance: true, ngImport: i0, template: "<li\n  fxLayout=\"row\"\n  fxLayoutAlign=\"start center\"\n  matRipple\n  [matRippleDisabled]=\"!clickable\"\n  [class.active-step]=\"step.active\"\n  (click)=\"_haltClickEvent($event)\"\n>\n  <mtna-status-circle\n    [color]=\"color\"\n    [circleNumber]=\"step.num\"\n    [incompleteIcon]=\"incompleteIcon\"\n    [optional]=\"step.optional\"\n    [status]=\"step.status\"\n  ></mtna-status-circle>\n  <div fxLayout=\"column\" fxFlex=\"100\">\n    <p class=\"step-title\">{{ step.label }}</p>\n    <p *ngIf=\"step.optional && !disabled\" class=\"step-status\" i18n>Optional</p>\n    <p *ngIf=\"disabled\" class=\"step-status\">{{ step.disabledText || notApplicableText }}</p>\n  </div>\n</li>\n", styles: ["mtna-wf-step li{padding:8px 16px;position:relative;-webkit-user-select:none;-o-user-select:none;user-select:none;line-height:24px;font-size:14px;transition:background-color .15s cubic-bezier(0,0,.2,1)}mtna-wf-step li:after{content:\"\";display:block;position:absolute;top:0;right:0;bottom:0;width:5px;transition:transform .4s cubic-bezier(.25,.8,.25,1);transform-origin:bottom;transform:scaleY(0);z-index:1}mtna-wf-step li .step-title,mtna-wf-step li .step-status{margin:0}mtna-wf-step.disabled{font-style:italic}\n"], components: [{ type: i1$1.MtnaStatusCircleComponent, selector: "mtna-status-circle", inputs: ["color", "circleNumber", "incompleteIcon", "status", "validIcon", "optional"] }], directives: [{ type: i3$2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i3$2.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { type: i3$3.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleRadius", "matRippleDisabled", "matRippleTrigger", "matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleAnimation"], exportAs: ["matRipple"] }, { type: i3$2.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfFormStepComponent, decorators: [{
             type: Component,
             args: [{
@@ -3802,7 +3842,7 @@ class MtnaWfFormStepperComponent extends _FormStepperMixinBase {
     }
 }
 MtnaWfFormStepperComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfFormStepperComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-MtnaWfFormStepperComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfFormStepperComponent, selector: "mtna-wf-stepper", inputs: { color: "color", incompleteIcon: "incompleteIcon", steps: "steps" }, outputs: { selected: "selected" }, usesInheritance: true, ngImport: i0, template: "<ol>\n  <ng-container *ngFor=\"let step of steps; let last = last; trackBy: _trackStep\">\n    <ng-container\n      [ngTemplateOutlet]=\"(step | mtnaWfStepGroupPipe) ? groupStep : singleStep\"\n      [ngTemplateOutletContext]=\"{ $implicit: step }\"\n    ></ng-container>\n  </ng-container>\n</ol>\n\n<ng-template #singleStep let-step>\n  <ng-container *ngIf=\"step | coerceFormStep as singleStep\">\n    <li\n      fxLayout=\"row\"\n      fxLayouAlign=\"start center\"\n      [ngClass]=\"{\n        'disabled-step': singleStep.status === 'DISABLED',\n        'active-step': singleStep.active,\n        'clickable': singleStep.status !== 'DISABLED' && singleStep.status !== 'PLACEHOLDER'\n      }\"\n    >\n      <ng-container [ngTemplateOutlet]=\"stepContent\" [ngTemplateOutletContext]=\"{ $implicit: singleStep }\"></ng-container>\n    </li>\n  </ng-container>\n</ng-template>\n\n<ng-template #groupStep let-step>\n  <ng-container *ngIf=\"step | coerceFormStepGroup as groupStepParent\">\n    <li fxLayout=\"column\" fxLayoutAlign=\"start start\" [class.child-step-active]=\"(groupStepParent.steps | childStepActive) && groupStepCollapsedMap[groupStepParent.instanceId]\">\n      <div fxFlex=\"100\" fxLayout=\"row\" fxLayoutAlign=\"start center\" class=\"mtna-wf-step-item-content\">\n        <button fxFlex mat-button class=\"step-button\" [attr.aria-label]=\"groupStepParent | getStepAriaLabel : groupStepCollapsedMap[groupStepParent.instanceId]\" (click)=\"toggleGroupStep(step)\">\n          <mtna-status-circle [color]=\"color\" [circleNumber]=\"groupStepParent.num\" [incompleteIcon]=\"incompleteIcon\"></mtna-status-circle>\n          <div fxLayout=\"row\" class=\"step-button-label-wrapper\" fxFlex=\"100\">\n            <p class=\"step-title\">{{ groupStepParent.label }}</p>\n          </div>\n          <mat-icon>{{ groupStepCollapsedMap[step.instanceId] ? 'expand_more' : 'expand_less' }}</mat-icon>\n        </button>\n      </div>\n      <ol class=\"group-step-list\">\n        <ng-container\n          *ngFor=\"let groupStep of step.steps | slice : 0 : (groupStepCollapsedMap[step.instanceId] ? 0 : step.steps.length); let last = last\"\n        >\n          <!-- All children in the steps property of FormStepGroup are FormStep(s). Only using coercion here to assist in defining properties we can use. -->\n          <li\n            *ngIf=\"groupStep | coerceFormStep as groupStepChild\"\n            fxLayout=\"row\"\n            fxLayouAlign=\"start center\"\n            [ngClass]=\"{\n              'disabled-step': groupStepChild.status === 'DISABLED',\n              'active-step': groupStepChild.active,\n              'clickable': groupStepChild.status !== 'DISABLED' && groupStepChild.status !== 'PLACEHOLDER',\n              'group-step': true\n            }\"\n          >\n            <ng-container [ngTemplateOutlet]=\"stepContent\" [ngTemplateOutletContext]=\"{ $implicit: groupStepChild, isChildStep: true }\"></ng-container>\n          </li>\n        </ng-container>\n      </ol>\n    </li>\n  </ng-container>\n</ng-template>\n\n<!-- The individual, stand-alone step template -->\n<ng-template #stepContent let-step let-isChildStep=\"isChildStep\">\n  <div fxFlex=\"100\" fxLayout=\"row\" fxLayoutAlign=\"start center\" class=\"mtna-wf-step-item-content\">\n    <mat-divider *ngIf=\"isChildStep\" [vertical]=\"true\"></mat-divider>\n    <button fxFlex mat-button class=\"step-button\" [attr.aria-label]=\"step | getStepAriaLabel\" [disabled]=\"step.status === 'DISABLED' || step.status === 'PLACEHOLDER'\" (click)=\"_haltClickEvent($event, step)\">\n      <mtna-status-circle\n        [color]=\"color\"\n        [circleNumber]=\"step.num\"\n        [incompleteIcon]=\"incompleteIcon\"\n        [optional]=\"step.optional\"\n        [status]=\"step.status\"\n      ></mtna-status-circle>\n      <div fxLayout=\"column\" class=\"step-button-label-wrapper\">\n        <p class=\"step-title\">{{ step.label }}</p>\n        <p *ngIf=\"step.optional && step.status !== 'DISABLED'\" class=\"step-status\" i18n>Optional</p>\n        <p *ngIf=\"step.status === 'DISABLED'\" class=\"step-status\">{{ step.disabledText || notApplicableText }}</p>\n      </div>\n    </button>\n  </div>\n</ng-template>\n", styles: ["mtna-wf-stepper{border-right-width:1px;border-right-style:solid;overflow-y:auto}mtna-wf-stepper li{padding:0 0 0 16px;position:relative;-webkit-user-select:none;-o-user-select:none;user-select:none;line-height:24px;font-size:14px;transition:background-color .15s cubic-bezier(0,0,.2,1)}mtna-wf-stepper li:after{content:\"\";display:block;position:absolute;top:0;right:0;bottom:0;width:5px;transition:transform .4s cubic-bezier(.25,.8,.25,1);transform-origin:bottom;transform:scaleY(0);z-index:1}mtna-wf-stepper li.disabled-step{font-style:italic}mtna-wf-stepper li.clickable{cursor:pointer}mtna-wf-stepper li.active-step:after,mtna-wf-stepper li.child-step-active:after{transform-origin:top;transform:scaleY(1)}mtna-wf-stepper li:not(.group-step){padding-left:0}mtna-wf-stepper li .mtna-wf-step-item-content{width:100%}mtna-wf-stepper li .mtna-wf-step-item-content mat-divider.mat-divider.mat-divider-vertical{height:100%}mtna-wf-stepper li .mtna-wf-step-item-content .mat-button.step-button{text-align:left;height:-moz-fit-content;height:fit-content;min-height:36px;line-height:20px;border:none;padding:4px 13px 4px 8px;font-weight:400;border-radius:0}mtna-wf-stepper li .mtna-wf-step-item-content .mat-button.step-button .mat-button-wrapper{align-items:center;display:flex;flex-direction:row}mtna-wf-stepper li .mtna-wf-step-item-content .mat-button.step-button .mat-button-wrapper .step-button-label-wrapper{width:calc(100% - 48px - 8px)}mtna-wf-stepper li .mtna-wf-step-item-content .mat-button.step-button .mat-button-wrapper .step-button-label-wrapper .step-title{margin:0;overflow:hidden;white-space:wrap}mtna-wf-stepper li .mtna-wf-step-item-content .mat-button.step-button .mat-button-wrapper .step-button-label-wrapper .step-status{margin:0}mtna-wf-stepper li.active-step .mtna-wf-step-item-content .mat-button.step-button{font-weight:500}mtna-wf-stepper li .step-title,mtna-wf-stepper li .step-status{margin:0}mtna-wf-stepper ol:not(.group-step-list){padding:0}mtna-wf-stepper ol.group-step-list{padding-left:16px;width:calc(100% - 16px)}mtna-wf-stepper ol li.group-step{padding-left:0;padding-right:0}\n"], components: [{ type: i3$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i4.MtnaStatusCircleComponent, selector: "mtna-status-circle", inputs: ["color", "circleNumber", "incompleteIcon", "status", "validIcon", "optional"] }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i2$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }], directives: [{ type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i7.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i3$2.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { type: i3$2.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }], pipes: { "mtnaWfStepGroupPipe": MtnaWfFormStepGroupPipe, "coerceFormStep": CoerceFormStepPipe, "coerceFormStepGroup": CoerceFormStepGroupPipe, "childStepActive": ChildStepActivePipe, "getStepAriaLabel": GetStepAriaLabel, "slice": i3.SlicePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+MtnaWfFormStepperComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfFormStepperComponent, selector: "mtna-wf-stepper", inputs: { color: "color", incompleteIcon: "incompleteIcon", steps: "steps" }, outputs: { selected: "selected" }, usesInheritance: true, ngImport: i0, template: "<ol>\n  <ng-container *ngFor=\"let step of steps; let last = last; trackBy: _trackStep\">\n    <ng-container\n      [ngTemplateOutlet]=\"(step | mtnaWfStepGroupPipe) ? groupStep : singleStep\"\n      [ngTemplateOutletContext]=\"{ $implicit: step }\"\n    ></ng-container>\n  </ng-container>\n</ol>\n\n<ng-template #singleStep let-step>\n  <ng-container *ngIf=\"step | coerceFormStep as singleStep\">\n    <li\n      fxLayout=\"row\"\n      fxLayouAlign=\"start center\"\n      [ngClass]=\"{\n        'disabled-step': singleStep.status === 'DISABLED',\n        'active-step': singleStep.active,\n        clickable: singleStep.status !== 'DISABLED' && singleStep.status !== 'PLACEHOLDER'\n      }\"\n    >\n      <ng-container [ngTemplateOutlet]=\"stepContent\" [ngTemplateOutletContext]=\"{ $implicit: singleStep }\"></ng-container>\n    </li>\n  </ng-container>\n</ng-template>\n\n<ng-template #groupStep let-step>\n  <ng-container *ngIf=\"step | coerceFormStepGroup as groupStepParent\">\n    <li\n      fxLayout=\"column\"\n      fxLayoutAlign=\"start start\"\n      [class.child-step-active]=\"(groupStepParent.steps | childStepActive) && groupStepCollapsedMap[groupStepParent.instanceId]\"\n    >\n      <div fxFlex=\"100\" fxLayout=\"row\" fxLayoutAlign=\"start center\" class=\"mtna-wf-step-item-content\">\n        <button\n          fxFlex\n          mat-button\n          class=\"step-button\"\n          [attr.aria-label]=\"groupStepParent | getStepAriaLabel : groupStepCollapsedMap[groupStepParent.instanceId]\"\n          (click)=\"toggleGroupStep(step)\"\n        >\n          <mtna-status-circle [color]=\"color\" [circleNumber]=\"groupStepParent.num\" [incompleteIcon]=\"incompleteIcon\"></mtna-status-circle>\n          <div fxLayout=\"row\" class=\"step-button-label-wrapper\" fxFlex=\"100\">\n            <p class=\"step-title\">{{ groupStepParent.label }}</p>\n          </div>\n          <mat-icon>{{ groupStepCollapsedMap[step.instanceId] ? 'expand_more' : 'expand_less' }}</mat-icon>\n        </button>\n      </div>\n      <ol class=\"group-step-list\">\n        <ng-container\n          *ngFor=\"\n            let groupStep of step.steps | slice : 0 : (groupStepCollapsedMap[step.instanceId] ? 0 : step.steps.length);\n            let last = last\n          \"\n        >\n          <!-- All children in the steps property of FormStepGroup are FormStep(s). Only using coercion here to assist in defining properties we can use. -->\n          <li\n            *ngIf=\"groupStep | coerceFormStep as groupStepChild\"\n            fxLayout=\"row\"\n            fxLayouAlign=\"start center\"\n            [ngClass]=\"{\n              'disabled-step': groupStepChild.status === 'DISABLED',\n              'active-step': groupStepChild.active,\n              clickable: groupStepChild.status !== 'DISABLED' && groupStepChild.status !== 'PLACEHOLDER',\n              'group-step': true\n            }\"\n          >\n            <ng-container\n              [ngTemplateOutlet]=\"stepContent\"\n              [ngTemplateOutletContext]=\"{ $implicit: groupStepChild, isChildStep: true }\"\n            ></ng-container>\n          </li>\n        </ng-container>\n      </ol>\n    </li>\n  </ng-container>\n</ng-template>\n\n<!-- The individual, stand-alone step template -->\n<ng-template #stepContent let-step let-isChildStep=\"isChildStep\">\n  <div fxFlex=\"100\" fxLayout=\"row\" fxLayoutAlign=\"start center\" class=\"mtna-wf-step-item-content\">\n    <mat-divider *ngIf=\"isChildStep\" [vertical]=\"true\"></mat-divider>\n    <button\n      fxFlex\n      mat-button\n      class=\"step-button\"\n      [attr.aria-label]=\"step | getStepAriaLabel\"\n      [disabled]=\"step.status === 'DISABLED' || step.status === 'PLACEHOLDER'\"\n      (click)=\"_haltClickEvent($event, step)\"\n    >\n      <mtna-status-circle\n        [color]=\"color\"\n        [circleNumber]=\"step.num\"\n        [incompleteIcon]=\"incompleteIcon\"\n        [optional]=\"step.optional\"\n        [status]=\"step.status\"\n      ></mtna-status-circle>\n      <div fxLayout=\"column\" class=\"step-button-label-wrapper\">\n        <p class=\"step-title\">{{ step.label }}</p>\n        <p *ngIf=\"step.optional && step.status !== 'DISABLED'\" class=\"step-status\" i18n>Optional</p>\n        <p *ngIf=\"step.status === 'DISABLED'\" class=\"step-status\">{{ step.disabledText || notApplicableText }}</p>\n      </div>\n    </button>\n  </div>\n</ng-template>\n", styles: ["mtna-wf-stepper{border-right-width:1px;border-right-style:solid;overflow-y:auto}mtna-wf-stepper li{padding:0 0 0 16px;position:relative;-webkit-user-select:none;-o-user-select:none;user-select:none;line-height:24px;font-size:14px;transition:background-color .15s cubic-bezier(0,0,.2,1)}mtna-wf-stepper li:after{content:\"\";display:block;position:absolute;top:0;right:0;bottom:0;width:5px;transition:transform .4s cubic-bezier(.25,.8,.25,1);transform-origin:bottom;transform:scaleY(0);z-index:1}mtna-wf-stepper li.disabled-step{font-style:italic}mtna-wf-stepper li.clickable{cursor:pointer}mtna-wf-stepper li.active-step:after,mtna-wf-stepper li.child-step-active:after{transform-origin:top;transform:scaleY(1)}mtna-wf-stepper li:not(.group-step){padding-left:0}mtna-wf-stepper li .mtna-wf-step-item-content{width:100%}mtna-wf-stepper li .mtna-wf-step-item-content mat-divider.mat-divider.mat-divider-vertical{height:100%}mtna-wf-stepper li .mtna-wf-step-item-content .mat-button.step-button{text-align:left;height:-moz-fit-content;height:fit-content;min-height:36px;line-height:20px;border:none;padding:4px 13px 4px 8px;font-weight:400;border-radius:0}mtna-wf-stepper li .mtna-wf-step-item-content .mat-button.step-button .mat-button-wrapper{align-items:center;display:flex;flex-direction:row}mtna-wf-stepper li .mtna-wf-step-item-content .mat-button.step-button .mat-button-wrapper .step-button-label-wrapper{width:calc(100% - 48px - 8px)}mtna-wf-stepper li .mtna-wf-step-item-content .mat-button.step-button .mat-button-wrapper .step-button-label-wrapper .step-title{margin:0;overflow:hidden;white-space:wrap}mtna-wf-stepper li .mtna-wf-step-item-content .mat-button.step-button .mat-button-wrapper .step-button-label-wrapper .step-status{margin:0}mtna-wf-stepper li.active-step .mtna-wf-step-item-content .mat-button.step-button{font-weight:500}mtna-wf-stepper li .step-title,mtna-wf-stepper li .step-status{margin:0}mtna-wf-stepper ol:not(.group-step-list){padding:0}mtna-wf-stepper ol.group-step-list{padding-left:16px;width:calc(100% - 16px)}mtna-wf-stepper ol li.group-step{padding-left:0;padding-right:0}\n"], components: [{ type: i3$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i1$1.MtnaStatusCircleComponent, selector: "mtna-status-circle", inputs: ["color", "circleNumber", "incompleteIcon", "status", "validIcon", "optional"] }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i2$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }], directives: [{ type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i7.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i3$2.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { type: i3$2.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }], pipes: { "mtnaWfStepGroupPipe": MtnaWfFormStepGroupPipe, "coerceFormStep": CoerceFormStepPipe, "coerceFormStepGroup": CoerceFormStepGroupPipe, "childStepActive": ChildStepActivePipe, "getStepAriaLabel": GetStepAriaLabel, "slice": i3.SlicePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfFormStepperComponent, decorators: [{
             type: Component,
             args: [{
@@ -3851,7 +3891,7 @@ MtnaWfFormStepperModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0",
             CoerceFormStepGroupPipeModule,
             CoerceFormStepPipeModule,
             ChildStepActivePipeModule,
-            GetStepAriaLabelModule
+            GetStepAriaLabelModule,
         ]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfFormStepperModule, decorators: [{
             type: NgModule,
@@ -3869,7 +3909,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                         CoerceFormStepGroupPipeModule,
                         CoerceFormStepPipeModule,
                         ChildStepActivePipeModule,
-                        GetStepAriaLabelModule
+                        GetStepAriaLabelModule,
                     ],
                     declarations: [MtnaWfFormStepComponent, MtnaWfFormStepGroupComponent, MtnaWfFormStepperComponent],
                     exports: [MtnaWfFormStepComponent, MtnaWfFormStepGroupComponent, MtnaWfFormStepperComponent],
@@ -3906,7 +3946,7 @@ class MtnaWfStepCardComponent extends _StepCardMixinBase {
     }
 }
 MtnaWfStepCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfStepCardComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-MtnaWfStepCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfStepCardComponent, selector: "mtna-wf-step-card", inputs: { color: "color", step: "step", subtitle: "subtitle" }, outputs: { focused: "focused" }, host: { properties: { "class.active": "this.active" } }, usesInheritance: true, ngImport: i0, template: "<mat-card cdkMonitorSubtreeFocus (cdkFocusChange)=\"handleFocusChange($event)\">\n  <mat-card-header>\n    <mtna-status-circle mat-card-avatar [circleNumber]=\"step?.num\" [optional]=\"step?.optional\" [status]=\"step?.status\"></mtna-status-circle>\n    <mat-card-title>{{ step?.label }}</mat-card-title>\n    <mat-card-subtitle [innerHTML]=\"subtitle | mtnaWfSanitizeHtml\"></mat-card-subtitle>\n    <p *ngIf=\"step?.optional\" class=\"optional mat-caption\" i18n>Optional</p>\n  </mat-card-header>\n\n  <mat-divider [inset]=\"true\"></mat-divider>\n\n  <mat-card-content>\n    <ng-content select=\"[cardContent]\"></ng-content>\n  </mat-card-content>\n\n  <mat-card-actions>\n    <ng-content select=\"[cardActions]\"></ng-content>\n  </mat-card-actions>\n</mat-card>\n", styles: ["mtna-wf-step-card{display:block;position:relative}mtna-wf-step-card.active:before{transform-origin:top;transform:scaleY(1)}mtna-wf-step-card:before{content:\"\";display:block;position:absolute;top:0;left:0;bottom:0;width:5px;transition:transform .4s cubic-bezier(.25,.8,.25,1);transform-origin:bottom;transform:scaleY(0);z-index:1;border-top-left-radius:2px;border-bottom-left-radius:2px}mtna-wf-step-card mat-card-header{position:relative}mtna-wf-step-card mat-card-header mat-card-title{line-height:24px;margin-right:100px}mtna-wf-step-card mat-card-header mtna-status-circle[mat-card-avatar]{width:24px;height:24px}mtna-wf-step-card mat-card-header>.optional:not(.mtna-status-circle){position:absolute;right:16px;top:0;margin:0;line-height:24px}mtna-wf-step-card mat-card-actions{padding:0;margin:0}mtna-wf-step-card mat-card-content{margin-top:16px}mtna-wf-step-card mat-card-content [cardcontent]>:first-child{margin-top:0}\n"], components: [{ type: i1$3.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { type: i1$3.MatCardHeader, selector: "mat-card-header" }, { type: i4.MtnaStatusCircleComponent, selector: "mtna-status-circle", inputs: ["color", "circleNumber", "incompleteIcon", "status", "validIcon", "optional"] }, { type: i2$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }], directives: [{ type: i4$1.CdkMonitorFocus, selector: "[cdkMonitorElementFocus], [cdkMonitorSubtreeFocus]", outputs: ["cdkFocusChange"] }, { type: i1$3.MatCardAvatar, selector: "[mat-card-avatar], [matCardAvatar]" }, { type: i1$3.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { type: i1$3.MatCardSubtitle, selector: "mat-card-subtitle, [mat-card-subtitle], [matCardSubtitle]" }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$3.MatCardContent, selector: "mat-card-content, [mat-card-content], [matCardContent]" }, { type: i1$3.MatCardActions, selector: "mat-card-actions", inputs: ["align"], exportAs: ["matCardActions"] }], pipes: { "mtnaWfSanitizeHtml": MtnaWfSanitizeHtmlPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+MtnaWfStepCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfStepCardComponent, selector: "mtna-wf-step-card", inputs: { color: "color", step: "step", subtitle: "subtitle" }, outputs: { focused: "focused" }, host: { properties: { "class.active": "this.active" } }, usesInheritance: true, ngImport: i0, template: "<mat-card cdkMonitorSubtreeFocus (cdkFocusChange)=\"handleFocusChange($event)\">\n  <mat-card-header>\n    <mtna-status-circle mat-card-avatar [circleNumber]=\"step?.num\" [optional]=\"step?.optional\" [status]=\"step?.status\"></mtna-status-circle>\n    <mat-card-title>{{ step?.label }}</mat-card-title>\n    <mat-card-subtitle [innerHTML]=\"subtitle | mtnaWfSanitizeHtml\"></mat-card-subtitle>\n    <p *ngIf=\"step?.optional\" class=\"optional mat-caption\" i18n>Optional</p>\n  </mat-card-header>\n\n  <mat-divider [inset]=\"true\"></mat-divider>\n\n  <mat-card-content>\n    <ng-content select=\"[cardContent]\"></ng-content>\n  </mat-card-content>\n\n  <mat-card-actions>\n    <ng-content select=\"[cardActions]\"></ng-content>\n  </mat-card-actions>\n</mat-card>\n", styles: ["mtna-wf-step-card{display:block;position:relative}mtna-wf-step-card.active:before{transform-origin:top;transform:scaleY(1)}mtna-wf-step-card:before{content:\"\";display:block;position:absolute;top:0;left:0;bottom:0;width:5px;transition:transform .4s cubic-bezier(.25,.8,.25,1);transform-origin:bottom;transform:scaleY(0);z-index:1;border-top-left-radius:2px;border-bottom-left-radius:2px}mtna-wf-step-card mat-card-header{position:relative}mtna-wf-step-card mat-card-header mat-card-title{line-height:24px;margin-right:100px}mtna-wf-step-card mat-card-header mtna-status-circle[mat-card-avatar]{width:24px;height:24px}mtna-wf-step-card mat-card-header>.optional:not(.mtna-status-circle){position:absolute;right:16px;top:0;margin:0;line-height:24px}mtna-wf-step-card mat-card-actions{padding:0;margin:0}mtna-wf-step-card mat-card-content{margin-top:16px}mtna-wf-step-card mat-card-content [cardcontent]>:first-child{margin-top:0}\n"], components: [{ type: i1$4.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { type: i1$4.MatCardHeader, selector: "mat-card-header" }, { type: i1$1.MtnaStatusCircleComponent, selector: "mtna-status-circle", inputs: ["color", "circleNumber", "incompleteIcon", "status", "validIcon", "optional"] }, { type: i2$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }], directives: [{ type: i4.CdkMonitorFocus, selector: "[cdkMonitorElementFocus], [cdkMonitorSubtreeFocus]", outputs: ["cdkFocusChange"] }, { type: i1$4.MatCardAvatar, selector: "[mat-card-avatar], [matCardAvatar]" }, { type: i1$4.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { type: i1$4.MatCardSubtitle, selector: "mat-card-subtitle, [mat-card-subtitle], [matCardSubtitle]" }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$4.MatCardContent, selector: "mat-card-content, [mat-card-content], [matCardContent]" }, { type: i1$4.MatCardActions, selector: "mat-card-actions", inputs: ["align"], exportAs: ["matCardActions"] }], pipes: { "mtnaWfSanitizeHtml": MtnaWfSanitizeHtmlPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfStepCardComponent, decorators: [{
             type: Component,
             args: [{
@@ -3975,6 +4015,7 @@ MtnaFormModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version:
         ReactiveFormsModule,
         MtnaWfFormDisablerModule,
         MatMomentDateModule,
+        MtnaWfFilterHiddenItemsPipeModule,
         MtnaWfFormStepperModule,
         MtnaWfStepCardModule], exports: [MtnaWfFormComponent] });
 MtnaFormModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaFormModule, providers: [{ provide: ErrorStateMatcher, useClass: MtnaWfInstantValidationResultErrorStateMatcher }], imports: [[
@@ -3986,6 +4027,7 @@ MtnaFormModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version:
             ReactiveFormsModule,
             MtnaWfFormDisablerModule,
             MatMomentDateModule,
+            MtnaWfFilterHiddenItemsPipeModule,
             MtnaWfFormStepperModule,
             MtnaWfStepCardModule,
         ]] });
@@ -4001,6 +4043,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                         ReactiveFormsModule,
                         MtnaWfFormDisablerModule,
                         MatMomentDateModule,
+                        MtnaWfFilterHiddenItemsPipeModule,
                         MtnaWfFormStepperModule,
                         MtnaWfStepCardModule,
                     ],
@@ -4023,7 +4066,7 @@ class MtnaWfBooleanComponent extends MtnaWfBaseParentValueItem {
     }
 }
 MtnaWfBooleanComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfBooleanComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: MtnaWfUIService }], target: i0.ɵɵFactoryTarget.Component });
-MtnaWfBooleanComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfBooleanComponent, selector: "mtna-wf-boolean-item", usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"header\"></ng-container>\n<mat-slide-toggle\n  *ngIf=\"control\"\n  [aria-label]=\"item.option.option.name\"\n  [formControl]=\"control\"\n  [disabled]=\"readonly\"\n  [mtnaHighlight]=\"indicatorStatus === 'ACTIVE'\"\n  (change)=\"toggleChange($event)\"\n  >{{ item.option.option.name }}</mat-slide-toggle\n>\n<ng-container *ngIf=\"!!item.optionItemMap\">\n  <mtna-wf-item\n    *ngFor=\"let f of item.optionItemMap | keyvalue; trackBy: _trackByInstanceId\"\n    [item]=\"f.value\"\n    [control]=\"!!controlWrapper && controlWrapper.controls ? controlWrapper.controls[f.value.instanceId] : undefined\"\n    [parentIds]=\"parentIds\"\n    [readonly]=\"readonly\"\n  ></mtna-wf-item>\n  <ng-container> </ng-container>\n</ng-container>\n", styles: ["mtna-annotations-indicator+mtna-wf-item-injector+mtna-wf-boolean-item{padding-right:24px}mtna-wf-boolean-item{display:block}mtna-wf-boolean-item.mtna-wf-control-item .mat-form-field{width:100%}mtna-wf-boolean-item.mtna-wf-control-item .mtna-wf-error-container{font-size:75%;line-height:1;min-height:1em;margin-top:-.75rem}mtna-wf-boolean-item.mtna-wf-control-item .control-item-content{padding:.35em .75em .625em}mtna-wf-boolean-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list){padding-left:.75em}mtna-wf-boolean-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list).mat-form-field{width:calc(100% - .75em)}mtna-wf-boolean-item .mat-slide-toggle{margin:4px 0}mtna-wf-boolean-item .mat-slide-toggle+mtna-wf-item{margin-top:0}mtna-wf-boolean-item .mat-slide-toggle~mtna-wf-item{padding-left:18px}mtna-wf-boolean-item.read-only .mat-slide-toggle.mat-disabled{opacity:.8}mtna-wf-boolean-item.read-only .mat-slide-toggle .mat-slide-toggle-label,mtna-wf-boolean-item.read-only .mat-slide-toggle .mat-slide-toggle-label .mat-slide-toggle-bar .mat-slide-toggle-thumb-container{cursor:default}mtna-wf-boolean-item .mat-slide-toggle{height:auto;min-height:24px;width:100%}mtna-wf-boolean-item .mat-slide-toggle>.mat-slide-toggle-label>.mat-slide-toggle-content{white-space:normal}\n"], components: [{ type: i2$2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex", "name", "id", "labelPosition", "aria-label", "aria-labelledby", "required", "checked", "aria-describedby"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { type: MtnaWfFormItemComponent, selector: "mtna-wf-item", inputs: ["color", "control", "header", "inList", "item", "parentIds", "readonly", "step"], outputs: ["focusedSection"] }], directives: [{ type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i4.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "keyvalue": i3.KeyValuePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+MtnaWfBooleanComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfBooleanComponent, selector: "mtna-wf-boolean-item", usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"header\"></ng-container>\n<mat-slide-toggle\n  *ngIf=\"control\"\n  [aria-label]=\"item.option.option.name\"\n  [formControl]=\"control\"\n  [disabled]=\"readonly\"\n  [mtnaHighlight]=\"indicatorStatus === 'ACTIVE'\"\n  (change)=\"toggleChange($event)\"\n  >{{ item.option.option.name }}</mat-slide-toggle\n>\n<ng-container *ngIf=\"!!item.optionItemMap\">\n  <mtna-wf-item\n    *ngFor=\"let f of item.optionItemMap | keyvalue; trackBy: _trackByInstanceId\"\n    [item]=\"f.value\"\n    [control]=\"!!controlWrapper && controlWrapper.controls ? controlWrapper.controls[f.value.instanceId] : undefined\"\n    [parentIds]=\"parentIds\"\n    [readonly]=\"readonly\"\n  ></mtna-wf-item>\n  <ng-container> </ng-container>\n</ng-container>\n", styles: ["mtna-annotations-indicator+mtna-wf-item-injector+mtna-wf-boolean-item{padding-right:24px}mtna-wf-boolean-item{display:block}mtna-wf-boolean-item.mtna-wf-control-item .mat-form-field{width:100%}mtna-wf-boolean-item.mtna-wf-control-item .mtna-wf-error-container{font-size:75%;line-height:1;min-height:1em;margin-top:-.75rem}mtna-wf-boolean-item.mtna-wf-control-item .control-item-content{padding:.35em .75em .625em}mtna-wf-boolean-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list){padding-left:.75em}mtna-wf-boolean-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list).mat-form-field{width:calc(100% - .75em)}mtna-wf-boolean-item .mat-slide-toggle{margin:4px 0}mtna-wf-boolean-item .mat-slide-toggle+mtna-wf-item{margin-top:0}mtna-wf-boolean-item .mat-slide-toggle~mtna-wf-item{padding-left:18px}mtna-wf-boolean-item.read-only .mat-slide-toggle.mat-disabled{opacity:.8}mtna-wf-boolean-item.read-only .mat-slide-toggle .mat-slide-toggle-label,mtna-wf-boolean-item.read-only .mat-slide-toggle .mat-slide-toggle-label .mat-slide-toggle-bar .mat-slide-toggle-thumb-container{cursor:default}mtna-wf-boolean-item .mat-slide-toggle{height:auto;min-height:24px;width:100%}mtna-wf-boolean-item .mat-slide-toggle>.mat-slide-toggle-label>.mat-slide-toggle-content{white-space:normal}\n"], components: [{ type: i2$2.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["disabled", "disableRipple", "color", "tabIndex", "name", "id", "labelPosition", "aria-label", "aria-labelledby", "required", "checked", "aria-describedby"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { type: MtnaWfFormItemComponent, selector: "mtna-wf-item", inputs: ["color", "control", "header", "inList", "item", "parentIds", "readonly", "step"], outputs: ["focusedSection"] }], directives: [{ type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i1$1.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "keyvalue": i3.KeyValuePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfBooleanComponent, decorators: [{
             type: Component,
             args: [{
@@ -4135,7 +4178,7 @@ class MtnaWfCheckboxComponent extends MtnaWfBaseParentValueItem {
     }
 }
 MtnaWfCheckboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfCheckboxComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: MtnaWfDialogService }], target: i0.ɵɵFactoryTarget.Component });
-MtnaWfCheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfCheckboxComponent, selector: "mtna-wf-checkbox-item", usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"header\"></ng-container>\n<div *ngIf=\"hasItemHeader\" class=\"mtna-wf-error-container\">\n  <ng-container *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n    <mat-error *ngFor=\"let error of control?.errors | keyvalue\">\n      {{ error | mtnaWfGetControlError : item }}\n    </mat-error>\n  </ng-container>\n</div>\n<fieldset\n  class=\"control-item-content\"\n  [class.single-option]=\"item.options.length === 1\"\n  [mtnaHighlight]=\"indicatorStatus === 'ACTIVE' && !hasItemHeader\"\n>\n  <ng-container *ngFor=\"let opt of item.options; let i = index; trackBy: _trackByOptionId\">\n    <div *ngIf=\"!!control && !!control.controls && !!control.controls[i]\" fxLayout=\"row\">\n      <mat-checkbox\n        [disableRipple]=\"readonly\"\n        [formControl]=\"$any(control.controls[i])\"\n        [color]=\"color\"\n        [disabled]=\"readonly\"\n        (change)=\"handleChange($event, i)\"\n        >{{ opt.option.name }}\n      </mat-checkbox>\n      <button\n        *ngIf=\"opt.acknowledgement && control.controls[i].value\"\n        mat-icon-button\n        class=\"acknowledge-verification-button\"\n        [attr.aria-label]=\"_acknowledgementText\"\n        [matTooltip]=\"_acknowledgementText\"\n        matTooltipShowDelay=\"800\"\n        (click)=\"showAcknowledgement($event, opt.acknowledgement)\"\n        (mousedown)=\"stopEventPropagation($event)\"\n        (touchstart)=\"stopEventPropagation($event)\"\n      >\n        <mat-icon>verified</mat-icon>\n      </button>\n    </div>\n    <ng-container *ngIf=\"item.optionItemMap[opt.option.id]\">\n      <mtna-wf-item\n        *ngIf=\"item.optionItemMap[opt.option.id] as subItem\"\n        [item]=\"subItem\"\n        [control]=\"!!controlWrapper && controlWrapper.controls ? controlWrapper.controls[subItem.instanceId] : undefined\"\n        [readonly]=\"readonly\"\n        [parentIds]=\"parentIds.concat(opt.option.id)\"\n      ></mtna-wf-item>\n    </ng-container>\n  </ng-container>\n</fieldset>\n", styles: ["mtna-wf-checkbox-item{display:flex;flex-direction:column;position:relative}mtna-wf-checkbox-item.mtna-wf-control-item .mat-form-field{width:100%}mtna-wf-checkbox-item.mtna-wf-control-item .mtna-wf-error-container{font-size:75%;line-height:1;min-height:1em;margin-top:-.75rem}mtna-wf-checkbox-item.mtna-wf-control-item .control-item-content{padding:.35em .75em .625em}mtna-wf-checkbox-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list){padding-left:.75em}mtna-wf-checkbox-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list).mat-form-field{width:calc(100% - .75em)}mtna-wf-checkbox-item .mat-checkbox{display:block}mtna-wf-checkbox-item .mat-checkbox>.mat-checkbox-layout{display:block}mtna-wf-checkbox-item .mat-checkbox>.mat-checkbox-layout>.mat-checkbox-label{white-space:normal}mtna-wf-checkbox-item .mat-checkbox .mat-checkbox-inner-container{bottom:1px}mtna-wf-checkbox-item .acknowledge-verification-button{vertical-align:top;width:18px;height:18px;line-height:18px;margin-left:4px}mtna-wf-checkbox-item .acknowledge-verification-button .mat-icon{width:18px;height:18px;line-height:18px;font-size:18px}mtna-wf-checkbox-item fieldset{border:none;margin:0}mtna-wf-checkbox-item fieldset.control-item-content.single-option{padding:0}mtna-wf-checkbox-item .mat-checkbox+mtna-wf-item{margin-top:0;padding-left:24px}mtna-wf-checkbox-item.read-only .mat-checkbox{cursor:default}\n"], components: [{ type: i2$3.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "id", "labelPosition", "name", "required", "checked", "disabled", "indeterminate", "aria-describedby", "value"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i3$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: MtnaWfFormItemComponent, selector: "mtna-wf-item", inputs: ["color", "control", "header", "inList", "item", "parentIds", "readonly", "step"], outputs: ["focusedSection"] }], directives: [{ type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$4.MatError, selector: "mat-error", inputs: ["id"] }, { type: i4.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i3$2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i6$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }], pipes: { "keyvalue": i3.KeyValuePipe, "mtnaWfGetControlError": MtnaWfGetFormControlErrorPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+MtnaWfCheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfCheckboxComponent, selector: "mtna-wf-checkbox-item", usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"header\"></ng-container>\n<div *ngIf=\"hasItemHeader\" class=\"mtna-wf-error-container\">\n  <ng-container *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\">\n    <mat-error *ngFor=\"let error of control?.errors | keyvalue\">\n      {{ error | mtnaWfGetControlError : item }}\n    </mat-error>\n  </ng-container>\n</div>\n<fieldset\n  class=\"control-item-content\"\n  [class.single-option]=\"item.options.length === 1\"\n  [mtnaHighlight]=\"indicatorStatus === 'ACTIVE' && !hasItemHeader\"\n>\n  <ng-container *ngFor=\"let opt of item.options; let i = index; trackBy: _trackByOptionId\">\n    <div *ngIf=\"!!control && !!control.controls && !!control.controls[i]\" fxLayout=\"row\">\n      <mat-checkbox\n        [disableRipple]=\"readonly\"\n        [formControl]=\"$any(control.controls[i])\"\n        [color]=\"color\"\n        [disabled]=\"readonly\"\n        (change)=\"handleChange($event, i)\"\n        >{{ opt.option.name }}\n      </mat-checkbox>\n      <button\n        *ngIf=\"opt.acknowledgement && control.controls[i].value\"\n        mat-icon-button\n        class=\"acknowledge-verification-button\"\n        [attr.aria-label]=\"_acknowledgementText\"\n        [matTooltip]=\"_acknowledgementText\"\n        matTooltipShowDelay=\"800\"\n        (click)=\"showAcknowledgement($event, opt.acknowledgement)\"\n        (mousedown)=\"stopEventPropagation($event)\"\n        (touchstart)=\"stopEventPropagation($event)\"\n      >\n        <mat-icon>verified</mat-icon>\n      </button>\n    </div>\n    <ng-container *ngIf=\"item.optionItemMap[opt.option.id]\">\n      <mtna-wf-item\n        *ngIf=\"item.optionItemMap[opt.option.id] as subItem\"\n        [item]=\"subItem\"\n        [control]=\"!!controlWrapper && controlWrapper.controls ? controlWrapper.controls[subItem.instanceId] : undefined\"\n        [readonly]=\"readonly\"\n        [parentIds]=\"parentIds.concat(opt.option.id)\"\n      ></mtna-wf-item>\n    </ng-container>\n  </ng-container>\n</fieldset>\n", styles: ["mtna-wf-checkbox-item{display:flex;flex-direction:column;position:relative}mtna-wf-checkbox-item.mtna-wf-control-item .mat-form-field{width:100%}mtna-wf-checkbox-item.mtna-wf-control-item .mtna-wf-error-container{font-size:75%;line-height:1;min-height:1em;margin-top:-.75rem}mtna-wf-checkbox-item.mtna-wf-control-item .control-item-content{padding:.35em .75em .625em}mtna-wf-checkbox-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list){padding-left:.75em}mtna-wf-checkbox-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list).mat-form-field{width:calc(100% - .75em)}mtna-wf-checkbox-item .mat-checkbox{display:block}mtna-wf-checkbox-item .mat-checkbox>.mat-checkbox-layout{display:block}mtna-wf-checkbox-item .mat-checkbox>.mat-checkbox-layout>.mat-checkbox-label{white-space:normal}mtna-wf-checkbox-item .mat-checkbox .mat-checkbox-inner-container{bottom:1px}mtna-wf-checkbox-item .acknowledge-verification-button{vertical-align:top;width:18px;height:18px;line-height:18px;margin-left:4px}mtna-wf-checkbox-item .acknowledge-verification-button .mat-icon{width:18px;height:18px;line-height:18px;font-size:18px}mtna-wf-checkbox-item fieldset{border:none;margin:0}mtna-wf-checkbox-item fieldset.control-item-content.single-option{padding:0}mtna-wf-checkbox-item .mat-checkbox+mtna-wf-item{margin-top:0;padding-left:24px}mtna-wf-checkbox-item.read-only .mat-checkbox{cursor:default}\n"], components: [{ type: i2$3.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "id", "labelPosition", "name", "required", "checked", "disabled", "indeterminate", "aria-describedby", "value"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i3$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: MtnaWfFormItemComponent, selector: "mtna-wf-item", inputs: ["color", "control", "header", "inList", "item", "parentIds", "readonly", "step"], outputs: ["focusedSection"] }], directives: [{ type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$5.MatError, selector: "mat-error", inputs: ["id"] }, { type: i1$1.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i3$2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i6$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }], pipes: { "keyvalue": i3.KeyValuePipe, "mtnaWfGetControlError": MtnaWfGetFormControlErrorPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfCheckboxComponent, decorators: [{
             type: Component,
             args: [{
@@ -4276,8 +4319,8 @@ class MtnaWfDateComponent extends MtnaWfBaseValueItem {
     }
 }
 MtnaWfDateComponent.dateFormItemComponentInstances = 0;
-MtnaWfDateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfDateComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i4.MtnaLogger }], target: i0.ɵɵFactoryTarget.Component });
-MtnaWfDateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfDateComponent, selector: "mtna-wf-date-item", inputs: { rangeLimits: "rangeLimits" }, host: { properties: { "class.mtna-wf-date-item": "this.dateItemClass" } }, viewQueries: [{ propertyName: "picker", first: true, predicate: MatDatepicker, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"header\"></ng-container>\n<mat-form-field *ngIf=\"control\" appearance=\"outline\" [mtnaHighlight]=\"indicatorStatus === 'ACTIVE' && !hasItemHeader\">\n  <mat-label>{{ item.label || _dateText }}</mat-label>\n  <input\n    matInput\n    [formControl]=\"control\"\n    [matDatepicker]=\"picker\"\n    [max]=\"rangeLimits?.end\"\n    [min]=\"rangeLimits?.start\"\n    placeholder=\"Choose a date\"\n    i18n-placeholder\n    [required]=\"item.required\"\n    [disabled]=\"readonly || control.disabled\"\n  />\n  <mat-datepicker-toggle matSuffix [for]=\"picker\" [disabled]=\"readonly || control.disabled\"></mat-datepicker-toggle>\n  <mat-datepicker #picker></mat-datepicker>\n  <mat-error *ngFor=\"let error of control.errors | keyvalue\">\n    {{ error | mtnaWfGetControlError : item }}\n  </mat-error>\n  <mat-hint>{{ item.format }}</mat-hint>\n</mat-form-field>\n", styles: ["mtna-wf-date-item.mtna-wf-control-item .mat-form-field{width:100%}mtna-wf-date-item.mtna-wf-control-item .mtna-wf-error-container{font-size:75%;line-height:1;min-height:1em;margin-top:-.75rem}mtna-wf-date-item.mtna-wf-control-item .control-item-content{padding:.35em .75em .625em}mtna-wf-date-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list){padding-left:.75em}mtna-wf-date-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list).mat-form-field{width:calc(100% - .75em)}\n"], components: [{ type: i1$4.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }, { type: i3$4.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["tabIndex", "disabled", "for", "aria-label", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { type: i3$4.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }], directives: [{ type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i1$4.MatLabel, selector: "mat-label" }, { type: i5$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["id", "disabled", "required", "type", "value", "readonly", "placeholder", "errorStateMatcher", "aria-describedby"], exportAs: ["matInput"] }, { 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]" }, { type: i3$4.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i6.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i1$4.MatSuffix, selector: "[matSuffix]" }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$4.MatError, selector: "mat-error", inputs: ["id"] }, { type: i1$4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }], pipes: { "keyvalue": i3.KeyValuePipe, "mtnaWfGetControlError": MtnaWfGetFormControlErrorPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+MtnaWfDateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfDateComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.MtnaLogger }], target: i0.ɵɵFactoryTarget.Component });
+MtnaWfDateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfDateComponent, selector: "mtna-wf-date-item", inputs: { rangeLimits: "rangeLimits" }, host: { properties: { "class.mtna-wf-date-item": "this.dateItemClass" } }, viewQueries: [{ propertyName: "picker", first: true, predicate: MatDatepicker, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"header\"></ng-container>\n<mat-form-field *ngIf=\"control\" appearance=\"outline\" [mtnaHighlight]=\"indicatorStatus === 'ACTIVE' && !hasItemHeader\">\n  <mat-label>{{ item.label || _dateText }}</mat-label>\n  <input\n    matInput\n    [formControl]=\"control\"\n    [matDatepicker]=\"picker\"\n    [max]=\"rangeLimits?.end\"\n    [min]=\"rangeLimits?.start\"\n    placeholder=\"Choose a date\"\n    i18n-placeholder\n    [required]=\"item.required\"\n    [disabled]=\"readonly || control.disabled\"\n  />\n  <mat-datepicker-toggle matSuffix [for]=\"picker\" [disabled]=\"readonly || control.disabled\"></mat-datepicker-toggle>\n  <mat-datepicker #picker></mat-datepicker>\n  <mat-error *ngFor=\"let error of control.errors | keyvalue\">\n    {{ error | mtnaWfGetControlError : item }}\n  </mat-error>\n  <mat-hint>{{ item.format }}</mat-hint>\n</mat-form-field>\n", styles: ["mtna-wf-date-item.mtna-wf-control-item .mat-form-field{width:100%}mtna-wf-date-item.mtna-wf-control-item .mtna-wf-error-container{font-size:75%;line-height:1;min-height:1em;margin-top:-.75rem}mtna-wf-date-item.mtna-wf-control-item .control-item-content{padding:.35em .75em .625em}mtna-wf-date-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list){padding-left:.75em}mtna-wf-date-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list).mat-form-field{width:calc(100% - .75em)}\n"], components: [{ type: i1$5.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }, { type: i3$4.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["tabIndex", "disabled", "for", "aria-label", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { type: i3$4.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }], directives: [{ type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$1.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i1$5.MatLabel, selector: "mat-label" }, { type: i5$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["id", "disabled", "required", "type", "value", "readonly", "placeholder", "errorStateMatcher", "aria-describedby"], exportAs: ["matInput"] }, { 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]" }, { type: i3$4.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i6.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i1$5.MatSuffix, selector: "[matSuffix]" }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$5.MatError, selector: "mat-error", inputs: ["id"] }, { type: i1$5.MatHint, selector: "mat-hint", inputs: ["align", "id"] }], pipes: { "keyvalue": i3.KeyValuePipe, "mtnaWfGetControlError": MtnaWfGetFormControlErrorPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfDateComponent, decorators: [{
             type: Component,
             args: [{
@@ -4287,7 +4330,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     encapsulation: ViewEncapsulation.None,
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i4.MtnaLogger }]; }, propDecorators: { dateItemClass: [{
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1$1.MtnaLogger }]; }, propDecorators: { dateItemClass: [{
                 type: HostBinding,
                 args: ['class.mtna-wf-date-item']
             }], rangeLimits: [{
@@ -4355,7 +4398,7 @@ class MtnaWfDateRangeComponent extends MtnaWfBaseValueItem {
     }
 }
 MtnaWfDateRangeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfDateRangeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MtnaWfDateRangeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfDateRangeComponent, selector: "mtna-wf-date-range", usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"header\"></ng-container>\n\n<div\n  *ngIf=\"control\"\n  class=\"range-item-container\"\n  fxLayout=\"row\"\n  fxLayoutAlign=\"start center\"\n  fxLayoutGap=\"8px\"\n  [mtnaHighlight]=\"indicatorStatus === 'ACTIVE' && !hasItemHeader\"\n>\n  <mtna-wf-date-item\n    [control]=\"control.controls['start'] | mtnaWfCoerceFormControl\"\n    [item]=\"_startItem\"\n    [rangeLimits]=\"item.rangeLimits\"\n    [readonly]=\"readonly\"\n  ></mtna-wf-date-item>\n  <span fxFlex=\"14px\"> {{toText}} </span>\n  <mtna-wf-date-item\n    [control]=\"control.controls['end'] | mtnaWfCoerceFormControl\"\n    [item]=\"_endItem\"\n    [rangeLimits]=\"item.rangeLimits\"\n    [readonly]=\"readonly\"\n  ></mtna-wf-date-item>\n</div>\n", components: [{ type: MtnaWfDateComponent, selector: "mtna-wf-date-item", inputs: ["rangeLimits"] }], directives: [{ type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i3$2.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { type: i3$2.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { type: i4.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i3$2.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }], pipes: { "mtnaWfCoerceFormControl": MtnaWfCoerceFormControlPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+MtnaWfDateRangeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfDateRangeComponent, selector: "mtna-wf-date-range", usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"header\"></ng-container>\n\n<div\n  *ngIf=\"control\"\n  class=\"range-item-container\"\n  fxLayout=\"row\"\n  fxLayoutAlign=\"start center\"\n  fxLayoutGap=\"8px\"\n  [mtnaHighlight]=\"indicatorStatus === 'ACTIVE' && !hasItemHeader\"\n>\n  <mtna-wf-date-item\n    [control]=\"control.controls['start'] | mtnaWfCoerceFormControl\"\n    [item]=\"_startItem\"\n    [rangeLimits]=\"item.rangeLimits\"\n    [readonly]=\"readonly\"\n  ></mtna-wf-date-item>\n  <span fxFlex=\"14px\"> {{ toText }} </span>\n  <mtna-wf-date-item\n    [control]=\"control.controls['end'] | mtnaWfCoerceFormControl\"\n    [item]=\"_endItem\"\n    [rangeLimits]=\"item.rangeLimits\"\n    [readonly]=\"readonly\"\n  ></mtna-wf-date-item>\n</div>\n", components: [{ type: MtnaWfDateComponent, selector: "mtna-wf-date-item", inputs: ["rangeLimits"] }], directives: [{ type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i3$2.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { type: i3$2.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { type: i1$1.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i3$2.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }], pipes: { "mtnaWfCoerceFormControl": MtnaWfCoerceFormControlPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfDateRangeComponent, decorators: [{
             type: Component,
             args: [{
@@ -4405,7 +4448,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
 class MtnaWfDropdownComponent extends MtnaWfBaseSingleSelectionParentValueItem {
 }
 MtnaWfDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfDropdownComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MtnaWfDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfDropdownComponent, selector: "mtna-wf-dropdown-item", usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"header; context: { $implicit: true }\"></ng-container>\n<mat-form-field\n  *ngIf=\"!readonly && !!control; else readOnly\"\n  appearance=\"outline\"\n  [mtnaHighlight]=\"indicatorStatus === 'ACTIVE' && !hasItemHeader\"\n>\n  <mat-label>{{ item.label }}</mat-label>\n  <mat-select [formControl]=\"control\" [panelClass]=\"'mtna-wf-dropdown-item__select-panel'\" [required]=\"item.required\" (selectionChange)=\"selectionChange($event)\">\n    <mat-option *ngIf=\"!item.required\" i18n>-- None --</mat-option>\n    <mat-option *ngFor=\"let opt of item.options\" [value]=\"opt.option.id\" [disabled]=\"control.value === opt.option.id\">{{\n      opt.option.name\n    }}</mat-option>\n  </mat-select>\n  <mat-error *ngFor=\"let error of control.errors | keyvalue\">\n    {{ error | mtnaWfGetControlError : item }}\n  </mat-error>\n</mat-form-field>\n\n<ng-template #readOnly>\n  <ng-container *ngIf=\"inList; else fullList\">\n    <mat-list-item *ngIf=\"item.required || !!item.value\">\n      <mat-icon *ngIf=\"item.label | mtnaWfGetListIcon as icon\" matListIcon>{{ icon }}</mat-icon>\n      <h4 matLine>{{ item.label }}</h4>\n      <p matLine>{{ item.value || control?.value | mtnaWfGetSelectedOptionName : item.options }}</p>\n    </mat-list-item>\n  </ng-container>\n\n  <ng-template #fullList>\n    <mat-list>\n      <mat-list-item *ngIf=\"item.required || !!item.value\">\n        <mat-icon *ngIf=\"item.label | mtnaWfGetListIcon as icon\" matListIcon>{{ icon }}</mat-icon>\n        <h4 matLine>{{ item.label }}</h4>\n        <p matLine>{{ item.value || control?.value | mtnaWfGetSelectedOptionName : item.options }}</p>\n      </mat-list-item>\n    </mat-list>\n  </ng-template>\n</ng-template>\n", styles: ["mtna-wf-dropdown-item.mtna-wf-control-item .mat-form-field{width:100%}mtna-wf-dropdown-item.mtna-wf-control-item .mtna-wf-error-container{font-size:75%;line-height:1;min-height:1em;margin-top:-.75rem}mtna-wf-dropdown-item.mtna-wf-control-item .control-item-content{padding:.35em .75em .625em}mtna-wf-dropdown-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list){padding-left:.75em}mtna-wf-dropdown-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list).mat-form-field{width:calc(100% - .75em)}\n"], components: [{ type: i1$4.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }, { type: i2$4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i3$3.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i4$2.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["disableRipple", "disabled"], exportAs: ["matListItem"] }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i4$2.MatList, selector: "mat-list, mat-action-list", inputs: ["disableRipple", "disabled"], exportAs: ["matList"] }], directives: [{ type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i1$4.MatLabel, selector: "mat-label" }, { type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i6.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$4.MatError, selector: "mat-error", inputs: ["id"] }, { type: i4$2.MatListIconCssMatStyler, selector: "[mat-list-icon], [matListIcon]" }, { type: i3$3.MatLine, selector: "[mat-line], [matLine]" }], pipes: { "keyvalue": i3.KeyValuePipe, "mtnaWfGetControlError": MtnaWfGetFormControlErrorPipe, "mtnaWfGetListIcon": MtnaWfGetListIconPipe, "mtnaWfGetSelectedOptionName": MtnaWfGetSelectedOptionNamePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+MtnaWfDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfDropdownComponent, selector: "mtna-wf-dropdown-item", usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"header; context: { $implicit: true }\"></ng-container>\n<mat-form-field\n  *ngIf=\"!readonly && !!control; else readOnly\"\n  appearance=\"outline\"\n  [mtnaHighlight]=\"indicatorStatus === 'ACTIVE' && !hasItemHeader\"\n>\n  <mat-label>{{ item.label }}</mat-label>\n  <mat-select\n    [formControl]=\"control\"\n    [panelClass]=\"'mtna-wf-dropdown-item__select-panel'\"\n    [required]=\"item.required\"\n    (selectionChange)=\"selectionChange($event)\"\n  >\n    <mat-option *ngIf=\"!item.required\" i18n>-- None --</mat-option>\n    <mat-option *ngFor=\"let opt of item.options\" [value]=\"opt.option.id\" [disabled]=\"control.value === opt.option.id\">{{\n      opt.option.name\n    }}</mat-option>\n  </mat-select>\n  <mat-error *ngFor=\"let error of control.errors | keyvalue\">\n    {{ error | mtnaWfGetControlError : item }}\n  </mat-error>\n</mat-form-field>\n\n<ng-template #readOnly>\n  <ng-container *ngIf=\"inList; else fullList\">\n    <mat-list-item *ngIf=\"item.required || !!item.value\">\n      <mat-icon *ngIf=\"item.label | mtnaWfGetListIcon as icon\" matListIcon>{{ icon }}</mat-icon>\n      <h4 matLine>{{ item.label }}</h4>\n      <p matLine>{{ item.value || control?.value | mtnaWfGetSelectedOptionName : item.options }}</p>\n    </mat-list-item>\n  </ng-container>\n\n  <ng-template #fullList>\n    <mat-list>\n      <mat-list-item *ngIf=\"item.required || !!item.value\">\n        <mat-icon *ngIf=\"item.label | mtnaWfGetListIcon as icon\" matListIcon>{{ icon }}</mat-icon>\n        <h4 matLine>{{ item.label }}</h4>\n        <p matLine>{{ item.value || control?.value | mtnaWfGetSelectedOptionName : item.options }}</p>\n      </mat-list-item>\n    </mat-list>\n  </ng-template>\n</ng-template>\n", styles: ["mtna-wf-dropdown-item.mtna-wf-control-item .mat-form-field{width:100%}mtna-wf-dropdown-item.mtna-wf-control-item .mtna-wf-error-container{font-size:75%;line-height:1;min-height:1em;margin-top:-.75rem}mtna-wf-dropdown-item.mtna-wf-control-item .control-item-content{padding:.35em .75em .625em}mtna-wf-dropdown-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list){padding-left:.75em}mtna-wf-dropdown-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list).mat-form-field{width:calc(100% - .75em)}\n"], components: [{ type: i1$5.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }, { type: i2$4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i3$3.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { type: i4$1.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["disableRipple", "disabled"], exportAs: ["matListItem"] }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i4$1.MatList, selector: "mat-list, mat-action-list", inputs: ["disableRipple", "disabled"], exportAs: ["matList"] }], directives: [{ type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$1.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i1$5.MatLabel, selector: "mat-label" }, { type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i6.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$5.MatError, selector: "mat-error", inputs: ["id"] }, { type: i4$1.MatListIconCssMatStyler, selector: "[mat-list-icon], [matListIcon]" }, { type: i3$3.MatLine, selector: "[mat-line], [matLine]" }], pipes: { "keyvalue": i3.KeyValuePipe, "mtnaWfGetControlError": MtnaWfGetFormControlErrorPipe, "mtnaWfGetListIcon": MtnaWfGetListIconPipe, "mtnaWfGetSelectedOptionName": MtnaWfGetSelectedOptionNamePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfDropdownComponent, decorators: [{
             type: Component,
             args: [{
@@ -4500,8 +4543,8 @@ class MtnaWfFileUploadComponent extends MtnaWfBaseFormItemControl {
         }
     }
 }
-MtnaWfFileUploadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfFileUploadComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$5.FileService }], target: i0.ɵɵFactoryTarget.Component });
-MtnaWfFileUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfFileUploadComponent, selector: "mtna-wf-file-upload-item", usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"header\"></ng-container>\n\n<div class=\"content\" [mtnaHighlight]=\"indicatorStatus === 'ACTIVE' && !item.questionText && !item.descriptiveText\">\n  <ng-container *ngIf=\"!readonly; else readOnly\">\n    <ng-container *ngIf=\"!loading; else loader\">\n      <mtna-file-download\n        *ngIf=\"!!fileInfo; else fileUpload\"\n        [fileInfo]=\"fileInfo\"\n        [canRemove]=\"true\"\n        color=\"primary\"\n        [canDownload]=\"true\"\n        (download)=\"handleDownload($event)\"\n        (remove)=\"removeFile()\"\n      ></mtna-file-download>\n\n      <ng-template #fileUpload>\n        <mtna-file-upload\n          [automaticUpload]=\"false\"\n          color=\"primary\"\n          [buttonText]=\"_fileUploadButtonText\"\n          (fileToUpload)=\"fileToUpload($event)\"\n        ></mtna-file-upload>\n      </ng-template>\n    </ng-container>\n  </ng-container>\n\n  <!-- READONLY -->\n  <ng-template #readOnly>\n    <!-- anchor being used, due to <fieldset disabled> blocking a <button>'s click event -->\n    <a\n      *ngIf=\"!!item && !!item.value; else unpopulated\"\n      class=\"single-icon-button\"\n      color=\"primary\"\n      mat-stroked-button\n      role=\"button\"\n      (click)=\"handleDownload(item.value)\"\n    >\n      <mat-icon color=\"primary\">file_download</mat-icon>\n      {{ (item!.value!.fileName ? item!.value!.fileName : '') | uppercase }}\n    </a>\n    <ng-template #unpopulated>\n      <mat-list>\n        <mat-list-item class=\"wrappable-list-item\">\n          <p mat-line class=\"wrap-line\" i18n>No File Provided</p>\n        </mat-list-item>\n      </mat-list>\n    </ng-template>\n  </ng-template>\n</div>\n\n<!-- PROGRESS SPINNER -->\n<ng-template #loader>\n  <mat-spinner diameter=\"125\" strokeWidth=\"10\" mode=\"indeterminate\"></mat-spinner>\n</ng-template>\n", styles: [":host{display:block;margin:1rem 0}mtna-file-download{margin:37px 0}mat-spinner{margin:0 87.5px}\n"], components: [{ type: i1$5.MtnaFileDownloadComponent, selector: "mtna-file-download", inputs: ["color", "canDownload", "canRemove", "fileInfo", "loading"], outputs: ["download", "remove"] }, { type: i1$5.MtnaFileUploadComponent, selector: "mtna-file-upload", inputs: ["automaticUpload", "buttonText", "buttonColor", "disabled", "fileUploadUrl", "isProd", "maxUploadSize", "uploading"], outputs: ["uploaded", "fileToUpload", "uploadStatus"] }, { type: i3$1.MatAnchor, selector: "a[mat-button], a[mat-raised-button], a[mat-icon-button], a[mat-fab],             a[mat-mini-fab], a[mat-stroked-button], a[mat-flat-button]", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matButton", "matAnchor"] }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i4$2.MatList, selector: "mat-list, mat-action-list", inputs: ["disableRipple", "disabled"], exportAs: ["matList"] }, { type: i4$2.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["disableRipple", "disabled"], exportAs: ["matListItem"] }, { type: i5$2.MatSpinner, selector: "mat-spinner", inputs: ["color"] }], directives: [{ type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i4.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$3.MatLine, selector: "[mat-line], [matLine]" }], pipes: { "uppercase": i3.UpperCasePipe } });
+MtnaWfFileUploadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfFileUploadComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$6.FileService }], target: i0.ɵɵFactoryTarget.Component });
+MtnaWfFileUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfFileUploadComponent, selector: "mtna-wf-file-upload-item", usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"header\"></ng-container>\n\n<div class=\"content\" [mtnaHighlight]=\"indicatorStatus === 'ACTIVE' && !item.questionText && !item.descriptiveText\">\n  <ng-container *ngIf=\"!readonly; else readOnly\">\n    <ng-container *ngIf=\"!loading; else loader\">\n      <mtna-file-download\n        *ngIf=\"!!fileInfo; else fileUpload\"\n        [fileInfo]=\"fileInfo\"\n        [canRemove]=\"true\"\n        color=\"primary\"\n        [canDownload]=\"true\"\n        (download)=\"handleDownload($event)\"\n        (remove)=\"removeFile()\"\n      ></mtna-file-download>\n\n      <ng-template #fileUpload>\n        <mtna-file-upload\n          [automaticUpload]=\"false\"\n          color=\"primary\"\n          [buttonText]=\"_fileUploadButtonText\"\n          (fileToUpload)=\"fileToUpload($event)\"\n        ></mtna-file-upload>\n      </ng-template>\n    </ng-container>\n  </ng-container>\n\n  <!-- READONLY -->\n  <ng-template #readOnly>\n    <!-- anchor being used, due to <fieldset disabled> blocking a <button>'s click event -->\n    <a\n      *ngIf=\"!!item && !!item.value; else unpopulated\"\n      class=\"single-icon-button\"\n      color=\"primary\"\n      mat-stroked-button\n      role=\"button\"\n      (click)=\"handleDownload(item.value)\"\n    >\n      <mat-icon color=\"primary\">file_download</mat-icon>\n      {{ (item!.value!.fileName ? item!.value!.fileName : '') | uppercase }}\n    </a>\n    <ng-template #unpopulated>\n      <mat-list>\n        <mat-list-item class=\"wrappable-list-item\">\n          <p mat-line class=\"wrap-line\" i18n>No File Provided</p>\n        </mat-list-item>\n      </mat-list>\n    </ng-template>\n  </ng-template>\n</div>\n\n<!-- PROGRESS SPINNER -->\n<ng-template #loader>\n  <mat-spinner diameter=\"125\" strokeWidth=\"10\" mode=\"indeterminate\"></mat-spinner>\n</ng-template>\n", styles: [":host{display:block;margin:1rem 0}mtna-file-download{margin:37px 0}mat-spinner{margin:0 87.5px}\n"], components: [{ type: i1$6.MtnaFileDownloadComponent, selector: "mtna-file-download", inputs: ["color", "canDownload", "canRemove", "fileInfo", "loading"], outputs: ["download", "remove"] }, { type: i1$6.MtnaFileUploadComponent, selector: "mtna-file-upload", inputs: ["automaticUpload", "buttonText", "buttonColor", "disabled", "fileUploadUrl", "isProd", "maxUploadSize", "uploading"], outputs: ["uploaded", "fileToUpload", "uploadStatus"] }, { type: i3$1.MatAnchor, selector: "a[mat-button], a[mat-raised-button], a[mat-icon-button], a[mat-fab],             a[mat-mini-fab], a[mat-stroked-button], a[mat-flat-button]", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matButton", "matAnchor"] }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i4$1.MatList, selector: "mat-list, mat-action-list", inputs: ["disableRipple", "disabled"], exportAs: ["matList"] }, { type: i4$1.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["disableRipple", "disabled"], exportAs: ["matListItem"] }, { type: i5$2.MatSpinner, selector: "mat-spinner", inputs: ["color"] }], directives: [{ type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i1$1.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$3.MatLine, selector: "[mat-line], [matLine]" }], pipes: { "uppercase": i3.UpperCasePipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfFileUploadComponent, decorators: [{
             type: Component,
             args: [{
@@ -4509,7 +4552,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                     templateUrl: './file-upload.component.html',
                     styleUrls: ['./file-upload.component.scss'],
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1$5.FileService }]; } });
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1$6.FileService }]; } });
 
 class MtnaWfFileUploadModule {
 }
@@ -4577,7 +4620,7 @@ class MtnaWfFormGroupComponent extends MtnaWfBaseGroupItem {
     }
 }
 MtnaWfFormGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfFormGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MtnaWfFormGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfFormGroupComponent, selector: "mtna-wf-group", usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"item && control\">\n  <mtna-wf-item-header\n    *ngIf=\"!!item.questionText || !!item.descriptiveText\"\n    [descriptiveText]=\"item.descriptiveText\"\n    [disabled]=\"control.disabled\"\n    [questionText]=\"item.questionText\"\n    [required]=\"item.required\"\n  ></mtna-wf-item-header>\n  <ng-template #fullLayout>\n    <div\n      class=\"item-group-container\"\n      [mtnaHighlight]=\"indicatorStatus === 'ACTIVE' && !item.questionText && !item.descriptiveText\"\n      [formGroup]=\"control\"\n      [ngClass]=\"item.layout\"\n    >\n      <mtna-wf-item\n        *ngFor=\"let subItem of item.items; trackBy: _trackByInstanceId\"\n        [class.row-item]=\"item.layout === 'ROW' && !fullWidth[subItem.itemId]\"\n        [ngClass.lt-md]=\"'width-100'\"\n        [item]=\"subItem\"\n        [control]=\"control.controls[subItem.instanceId]\"\n        [parentIds]=\"parentIds\"\n        [readonly]=\"readonly\"\n      ></mtna-wf-item>\n    </div>\n  </ng-template>\n\n  <!-- When readonly, && all child items should be displayed in a mat-list-->\n  <mat-list *ngIf=\"readonly && inList; else fullLayout\" [ngClass]=\"item.layout\">\n    <mtna-wf-item\n      *ngFor=\"let subItem of item.items | mtnaWfItemsWithValue; let index = index; trackBy: _trackByInstanceId\"\n      [class.row-item]=\"item.layout === 'ROW'\"\n      [ngClass.lt-md]=\"'width-100'\"\n      [item]=\"subItem\"\n      [inList]=\"true\"\n      [parentIds]=\"parentIds\"\n      [readonly]=\"true\"\n    ></mtna-wf-item>\n  </mat-list>\n</ng-container>\n", styles: ["mtna-annotations-indicator+mtna-wf-item-injector+mtna-wf-group .item-group-container{padding-top:24px}mtna-wf-group .mtna-wf-group-header{margin-top:1rem}mtna-wf-group .mtna-wf-group-description{margin-bottom:1rem}mtna-wf-group mat-list mat-list-item [mat-line]{letter-spacing:.5px}mtna-wf-group mtna-wf-multiple-choice-item{display:block}mtna-wf-group .item-group-container>.mtna-wf-group{margin-top:1rem}mtna-wf-group .item-group-container>mtna-wf-item.mtna-wf-title~mtna-wf-item:not(.mtna-wf-title):not(.row-item){padding-left:16px}mtna-wf-group .item-group-container>mtna-wf-item.mtna-wf-title~mtna-wf-item:not(.mtna-wf-title):not(.row-item).width-100{width:calc(100% - 16px)}mtna-wf-group .item-group-container>mtna-wf-item:first-of-type{margin-top:0}mtna-wf-group .item-group-container.ROW>mtna-wf-item{margin-top:0}mtna-wf-group .item-group-container.ROW>*{display:block}mtna-wf-group .item-group-container .row-item{width:calc(50% - 16px);display:inline-block;margin:0 8px}mtna-wf-group .item-group-container .width-100{width:100%}mtna-wf-group .item-group-container .width-100.row-item{width:calc(100% - 16px)}mtna-wf-group mtna-wf-item-header+.item-group-container{padding:.35em .75em .625em}mtna-wf-group mtna-wf-item-header+.item-group-container>mtna-wf-item{margin-top:0}\n"], components: [{ type: MtnaWfItemHeaderComponent, selector: "mtna-wf-item-header", inputs: ["descriptiveText", "disabled", "hideRequiredMarker", "invalid", "questionText", "required"] }, { type: MtnaWfFormItemComponent, selector: "mtna-wf-item", inputs: ["color", "control", "header", "inList", "item", "parentIds", "readonly", "step"], outputs: ["focusedSection"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i6.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i7.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "mtnaWfItemsWithValue": MtnaWfItemsWithValuePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+MtnaWfFormGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfFormGroupComponent, selector: "mtna-wf-group", usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"item && control\">\n  <mtna-wf-item-header\n    *ngIf=\"!!item.questionText || !!item.descriptiveText\"\n    [descriptiveText]=\"item.descriptiveText\"\n    [disabled]=\"control.disabled\"\n    [questionText]=\"item.questionText\"\n    [required]=\"item.required\"\n  ></mtna-wf-item-header>\n  <ng-template #fullLayout>\n    <div\n      class=\"item-group-container\"\n      [mtnaHighlight]=\"indicatorStatus === 'ACTIVE' && !item.questionText && !item.descriptiveText\"\n      [formGroup]=\"control\"\n      [ngClass]=\"item.layout\"\n    >\n      <mtna-wf-item\n        *ngFor=\"let subItem of item.items; trackBy: _trackByInstanceId\"\n        [class.row-item]=\"item.layout === 'ROW' && !fullWidth[subItem.itemId]\"\n        [ngClass.lt-md]=\"'width-100'\"\n        [item]=\"subItem\"\n        [control]=\"control.controls[subItem.instanceId]\"\n        [parentIds]=\"parentIds\"\n        [readonly]=\"readonly\"\n      ></mtna-wf-item>\n    </div>\n  </ng-template>\n\n  <!-- When readonly, && all child items should be displayed in a mat-list-->\n  <mat-list *ngIf=\"readonly && inList; else fullLayout\" [ngClass]=\"item.layout\">\n    <mtna-wf-item\n      *ngFor=\"let subItem of item.items | mtnaWfItemsWithValue; let index = index; trackBy: _trackByInstanceId\"\n      [class.row-item]=\"item.layout === 'ROW'\"\n      [ngClass.lt-md]=\"'width-100'\"\n      [item]=\"subItem\"\n      [inList]=\"true\"\n      [parentIds]=\"parentIds\"\n      [readonly]=\"true\"\n    ></mtna-wf-item>\n  </mat-list>\n</ng-container>\n", styles: ["mtna-annotations-indicator+mtna-wf-item-injector+mtna-wf-group .item-group-container{padding-top:24px}mtna-wf-group .mtna-wf-group-header{margin-top:1rem}mtna-wf-group .mtna-wf-group-description{margin-bottom:1rem}mtna-wf-group mat-list mat-list-item [mat-line]{letter-spacing:.5px}mtna-wf-group mtna-wf-multiple-choice-item{display:block}mtna-wf-group .item-group-container>.mtna-wf-group{margin-top:1rem}mtna-wf-group .item-group-container>mtna-wf-item.mtna-wf-title~mtna-wf-item:not(.mtna-wf-title):not(.row-item){padding-left:16px}mtna-wf-group .item-group-container>mtna-wf-item.mtna-wf-title~mtna-wf-item:not(.mtna-wf-title):not(.row-item).width-100{width:calc(100% - 16px)}mtna-wf-group .item-group-container>mtna-wf-item:first-of-type{margin-top:0}mtna-wf-group .item-group-container.ROW>mtna-wf-item{margin-top:0}mtna-wf-group .item-group-container.ROW>*{display:block}mtna-wf-group .item-group-container .row-item{width:calc(50% - 16px);display:inline-block;margin:0 8px}mtna-wf-group .item-group-container .width-100{width:100%}mtna-wf-group .item-group-container .width-100.row-item{width:calc(100% - 16px)}mtna-wf-group mtna-wf-item-header+.item-group-container{padding:.35em .75em .625em}mtna-wf-group mtna-wf-item-header+.item-group-container>mtna-wf-item{margin-top:0}\n"], components: [{ type: MtnaWfItemHeaderComponent, selector: "mtna-wf-item-header", inputs: ["descriptiveText", "disabled", "hideRequiredMarker", "invalid", "questionText", "required"] }, { type: MtnaWfFormItemComponent, selector: "mtna-wf-item", inputs: ["color", "control", "header", "inList", "item", "parentIds", "readonly", "step"], outputs: ["focusedSection"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$1.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i6.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i7.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "mtnaWfItemsWithValue": MtnaWfItemsWithValuePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfFormGroupComponent, decorators: [{
             type: Component,
             args: [{
@@ -4631,7 +4674,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
 class MtnaWfFormSectionComponent extends MtnaWfBaseSectionItem {
 }
 MtnaWfFormSectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfFormSectionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MtnaWfFormSectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfFormSectionComponent, selector: "mtna-wf-section", usesInheritance: true, ngImport: i0, template: "<mtna-wf-step-card\n  [step]=\"step\"\n  [subtitle]=\"item.descriptiveText\"\n  [mtnaHighlight]=\"indicatorStatus === 'ACTIVE'\"\n  (focused)=\"focused.emit($event)\"\n>\n  <div cardContent>\n    <ng-container *ngFor=\"let subItem of item.items; trackBy: _trackByInstanceId\">\n      <mat-divider\n        *ngIf=\"(subItem.itemId | mtnaWfGetObjectType) === 'formitemgroupimpl' && item.items.indexOf(subItem) !== 0\"\n        class=\"section-item-divider\"\n        [inset]=\"true\"\n      ></mat-divider>\n\n      <mtna-wf-item\n        [item]=\"subItem\"\n        [readonly]=\"readonly\"\n        [parentIds]=\"parentIds\"\n        [control]=\"!!control && !!control.controls ? control.controls[subItem.instanceId] : undefined\"\n        (focusedSection)=\"focused.emit($event)\"\n      ></mtna-wf-item>\n    </ng-container>\n  </div>\n</mtna-wf-step-card>\n", styles: [":host{display:block}mat-divider.mat-divider-horizontal.mat-divider-inset.section-item-divider{margin-top:8px;margin-bottom:8px}mtna-wf-section mtna-wf-title-item .mtna-wf-title-item{font-size:.875rem;line-height:28px;font-weight:500}\n"], components: [{ type: MtnaWfStepCardComponent, selector: "mtna-wf-step-card", inputs: ["color", "step", "subtitle"], outputs: ["focused"] }, { type: i2$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { type: MtnaWfFormItemComponent, selector: "mtna-wf-item", inputs: ["color", "control", "header", "inList", "item", "parentIds", "readonly", "step"], outputs: ["focusedSection"] }], directives: [{ type: i4.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "mtnaWfGetObjectType": MtnaWfGetObjectTypePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+MtnaWfFormSectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfFormSectionComponent, selector: "mtna-wf-section", usesInheritance: true, ngImport: i0, template: "<mtna-wf-step-card\n  [step]=\"step\"\n  [subtitle]=\"item.descriptiveText\"\n  [mtnaHighlight]=\"indicatorStatus === 'ACTIVE'\"\n  (focused)=\"focused.emit($event)\"\n>\n  <div cardContent>\n    <ng-container *ngFor=\"let subItem of item.items; trackBy: _trackByInstanceId\">\n      <mat-divider\n        *ngIf=\"(subItem.itemId | mtnaWfGetObjectType) === 'formitemgroupimpl' && item.items.indexOf(subItem) !== 0\"\n        class=\"section-item-divider\"\n        [inset]=\"true\"\n      ></mat-divider>\n\n      <mtna-wf-item\n        [item]=\"subItem\"\n        [readonly]=\"readonly\"\n        [parentIds]=\"parentIds\"\n        [control]=\"!!control && !!control.controls ? control.controls[subItem.instanceId] : undefined\"\n        (focusedSection)=\"focused.emit($event)\"\n      ></mtna-wf-item>\n    </ng-container>\n  </div>\n</mtna-wf-step-card>\n", styles: ["mtna-wf-section{display:block}mtna-wf-section mat-divider.mat-divider-horizontal.mat-divider-inset.section-item-divider{margin-top:8px;margin-bottom:8px}\n"], components: [{ type: MtnaWfStepCardComponent, selector: "mtna-wf-step-card", inputs: ["color", "step", "subtitle"], outputs: ["focused"] }, { type: i2$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { type: MtnaWfFormItemComponent, selector: "mtna-wf-item", inputs: ["color", "control", "header", "inList", "item", "parentIds", "readonly", "step"], outputs: ["focusedSection"] }], directives: [{ type: i1$1.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "mtnaWfGetObjectType": MtnaWfGetObjectTypePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfFormSectionComponent, decorators: [{
             type: Component,
             args: [{
@@ -4639,6 +4682,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                     templateUrl: './form-section.component.html',
                     styleUrls: ['./form-section.component.scss'],
                     changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
                 }]
         }] });
 
@@ -4686,7 +4730,7 @@ class MtnaWfI18nInputComponent extends MtnaWfBaseValueItem {
     }
 }
 MtnaWfI18nInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfI18nInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MtnaWfI18nInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfI18nInputComponent, selector: "mtna-wf-i18n-input-item", usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"header; context: { $implicit: true }\"></ng-container>\n<ng-container *ngIf=\"!readonly && !!control; else readOnly\">\n  <mat-form-field\n    *ngFor=\"let language of item.languageTags\"\n    appearance=\"outline\"\n    [mtnaHighlight]=\"indicatorStatus === 'ACTIVE' && !hasItemHeader\"\n  >\n    <mat-label>{{ item.label + ' - ' + getLanguageDisplay(language) }}</mat-label>\n    <ng-container *ngIf=\"isParagraph; else shortInput\">\n      <textarea\n        matInput\n        [formControl]=\"getFormControl(language)\"\n        [required]=\"item.required\"\n        [attr.autocomplete]=\"item.label || item.name | mtnaWfGetAutoComplete\"\n        cdkTextareaAutoSize\n        cdkAutosizeMinRows=\"3\"\n        cdkAutosizeMaxRows=\"5\"\n      ></textarea>\n    </ng-container>\n    <ng-template #shortInput>\n      <input\n        matInput\n        [formControl]=\"getFormControl(language)\"\n        [autocomplete]=\"item.label || item.name | mtnaWfGetAutoComplete\"\n        [required]=\"item.required\"\n      />\n    </ng-template>\n\n    <mat-error *ngFor=\"let error of control.errors | keyvalue | slice : 0 : 1\">\n      {{ error | mtnaWfGetControlError : item }}\n    </mat-error>\n  </mat-form-field>\n</ng-container>\n<!-- READONLY -->\n<ng-template #readOnly>\n  <ng-container *ngTemplateOutlet=\"inList ? listItem : fullList\"></ng-container>\n</ng-template>\n\n<ng-template #fullList>\n  <mat-list>\n    <ng-container *ngTemplateOutlet=\"listItem\"></ng-container>\n  </mat-list>\n</ng-template>\n\n<ng-template #listItem>\n  <mat-list-item *ngFor=\"let language of item.languageTags\" class=\"wrappable-list-item\">\n    <!-- <mat-icon *ngIf=\"item.label || item.header as label\" matListIcon>{{ label | mtnaWfGetListIcon }}</mat-icon> -->\n    <h4 *ngIf=\"!item.questionText && (item.label || item.name) as label\" mat-line>{{ label }}</h4>\n    <p mat-line class=\"wrap-line\">{{ item.value || _notInformationText + ' - ' + language }}</p>\n  </mat-list-item>\n</ng-template>\n", styles: ["mtna-wf-i18n-input-item.mtna-wf-control-item .mat-form-field{width:100%}mtna-wf-i18n-input-item.mtna-wf-control-item .mtna-wf-error-container{font-size:75%;line-height:1;min-height:1em;margin-top:-.75rem}mtna-wf-i18n-input-item.mtna-wf-control-item .control-item-content{padding:.35em .75em .625em}mtna-wf-i18n-input-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list){padding-left:.75em}mtna-wf-i18n-input-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list).mat-form-field{width:calc(100% - .75em)}mtna-wf-i18n-input-item .mat-list-base .mat-list-item,mtna-wf-i18n-input-item .mat-list-base .mat-list-item.mat-list-item-with-avatar{height:auto;padding:12px 0}mtna-wf-i18n-input-item .mat-list-base .mat-list-item.mat-2-line,mtna-wf-i18n-input-item .mat-list-base .mat-list-item.mat-2-line.mat-list-item-with-avatar{padding:18.5px 0}mtna-wf-i18n-input-item .mat-list-base .mat-list-item .mat-line{white-space:normal;overflow:unset;text-overflow:unset}\n"], components: [{ type: i1$4.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }, { type: i4$2.MatList, selector: "mat-list, mat-action-list", inputs: ["disableRipple", "disabled"], exportAs: ["matList"] }, { type: i4$2.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["disableRipple", "disabled"], exportAs: ["matListItem"] }], directives: [{ type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i1$4.MatLabel, selector: "mat-label" }, { type: i5$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["id", "disabled", "required", "type", "value", "readonly", "placeholder", "errorStateMatcher", "aria-describedby"], exportAs: ["matInput"] }, { 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]" }, { type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i6.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i1$4.MatError, selector: "mat-error", inputs: ["id"] }, { type: i3$3.MatLine, selector: "[mat-line], [matLine]" }], pipes: { "mtnaWfGetAutoComplete": MtnaWfGetAutoCompletePipe, "slice": i3.SlicePipe, "keyvalue": i3.KeyValuePipe, "mtnaWfGetControlError": MtnaWfGetFormControlErrorPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+MtnaWfI18nInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfI18nInputComponent, selector: "mtna-wf-i18n-input-item", usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"header; context: { $implicit: true }\"></ng-container>\n<ng-container *ngIf=\"!readonly && !!control; else readOnly\">\n  <mat-form-field\n    *ngFor=\"let language of item.languageTags\"\n    appearance=\"outline\"\n    [mtnaHighlight]=\"indicatorStatus === 'ACTIVE' && !hasItemHeader\"\n  >\n    <mat-label>{{ item.label + ' - ' + getLanguageDisplay(language) }}</mat-label>\n    <ng-container *ngIf=\"isParagraph; else shortInput\">\n      <textarea\n        matInput\n        [formControl]=\"getFormControl(language)\"\n        [required]=\"item.required\"\n        [attr.autocomplete]=\"item.label || item.name | mtnaWfGetAutoComplete\"\n        cdkTextareaAutoSize\n        cdkAutosizeMinRows=\"3\"\n        cdkAutosizeMaxRows=\"5\"\n      ></textarea>\n    </ng-container>\n    <ng-template #shortInput>\n      <input\n        matInput\n        [formControl]=\"getFormControl(language)\"\n        [autocomplete]=\"item.label || item.name | mtnaWfGetAutoComplete\"\n        [required]=\"item.required\"\n      />\n    </ng-template>\n\n    <mat-error *ngFor=\"let error of control.errors | keyvalue | slice : 0 : 1\">\n      {{ error | mtnaWfGetControlError : item }}\n    </mat-error>\n  </mat-form-field>\n</ng-container>\n<!-- READONLY -->\n<ng-template #readOnly>\n  <ng-container *ngTemplateOutlet=\"inList ? listItem : fullList\"></ng-container>\n</ng-template>\n\n<ng-template #fullList>\n  <mat-list>\n    <ng-container *ngTemplateOutlet=\"listItem\"></ng-container>\n  </mat-list>\n</ng-template>\n\n<ng-template #listItem>\n  <mat-list-item *ngFor=\"let language of item.languageTags\" class=\"wrappable-list-item\">\n    <!-- <mat-icon *ngIf=\"item.label || item.header as label\" matListIcon>{{ label | mtnaWfGetListIcon }}</mat-icon> -->\n    <h4 *ngIf=\"!item.questionText && (item.label || item.name) as label\" mat-line>{{ label }}</h4>\n    <p mat-line class=\"wrap-line\">{{ item.value || _notInformationText + ' - ' + language }}</p>\n  </mat-list-item>\n</ng-template>\n", styles: ["mtna-wf-i18n-input-item.mtna-wf-control-item .mat-form-field{width:100%}mtna-wf-i18n-input-item.mtna-wf-control-item .mtna-wf-error-container{font-size:75%;line-height:1;min-height:1em;margin-top:-.75rem}mtna-wf-i18n-input-item.mtna-wf-control-item .control-item-content{padding:.35em .75em .625em}mtna-wf-i18n-input-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list){padding-left:.75em}mtna-wf-i18n-input-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list).mat-form-field{width:calc(100% - .75em)}mtna-wf-i18n-input-item .mat-list-base .mat-list-item,mtna-wf-i18n-input-item .mat-list-base .mat-list-item.mat-list-item-with-avatar{height:auto;padding:12px 0}mtna-wf-i18n-input-item .mat-list-base .mat-list-item.mat-2-line,mtna-wf-i18n-input-item .mat-list-base .mat-list-item.mat-2-line.mat-list-item-with-avatar{padding:18.5px 0}mtna-wf-i18n-input-item .mat-list-base .mat-list-item .mat-line{white-space:normal;overflow:unset;text-overflow:unset}\n"], components: [{ type: i1$5.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }, { type: i4$1.MatList, selector: "mat-list, mat-action-list", inputs: ["disableRipple", "disabled"], exportAs: ["matList"] }, { type: i4$1.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["disableRipple", "disabled"], exportAs: ["matListItem"] }], directives: [{ type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$1.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i1$5.MatLabel, selector: "mat-label" }, { type: i5$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["id", "disabled", "required", "type", "value", "readonly", "placeholder", "errorStateMatcher", "aria-describedby"], exportAs: ["matInput"] }, { 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]" }, { type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i6.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i1$5.MatError, selector: "mat-error", inputs: ["id"] }, { type: i3$3.MatLine, selector: "[mat-line], [matLine]" }], pipes: { "mtnaWfGetAutoComplete": MtnaWfGetAutoCompletePipe, "slice": i3.SlicePipe, "keyvalue": i3.KeyValuePipe, "mtnaWfGetControlError": MtnaWfGetFormControlErrorPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfI18nInputComponent, decorators: [{
             type: Component,
             args: [{
@@ -4761,7 +4805,7 @@ class MtnaWfInputComponent extends MtnaWfBaseValueItem {
     }
 }
 MtnaWfInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MtnaWfInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfInputComponent, selector: "mtna-wf-input-item", usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"header; context: { $implicit: true }\"></ng-container>\n<mat-form-field\n  *ngIf=\"!readonly && !!control; else readOnly\"\n  appearance=\"outline\"\n  [mtnaHighlight]=\"indicatorStatus === 'ACTIVE' && !hasItemHeader\"\n>\n  <mat-label>{{ item.label }}</mat-label>\n  <textarea\n    *ngIf=\"isParagraph; else shortInput\"\n    matInput\n    [formControl]=\"control\"\n    [required]=\"item.required\"\n    [attr.autocomplete]=\"item.label || item.name | mtnaWfGetAutoComplete\"\n    cdkTextareaAutoSize\n    cdkAutosizeMinRows=\"3\"\n    cdkAutosizeMaxRows=\"5\"\n  ></textarea>\n\n  <ng-template #shortInput>\n    <input matInput [formControl]=\"control!\" [autocomplete]=\"item.label || item.name | mtnaWfGetAutoComplete\" [required]=\"item.required\" />\n  </ng-template>\n\n  <mat-error *ngFor=\"let error of control.errors | keyvalue | slice : 0 : 1\">\n    {{ error | mtnaWfGetControlError : item }}\n  </mat-error>\n</mat-form-field>\n\n<!-- READONLY -->\n<ng-template #readOnly>\n  <ng-container *ngTemplateOutlet=\"inList ? listItem : fullList\"></ng-container>\n</ng-template>\n\n<ng-template #fullList>\n  <mat-list>\n    <ng-container *ngTemplateOutlet=\"listItem\"></ng-container>\n  </mat-list>\n</ng-template>\n\n<ng-template #listItem>\n  <mat-list-item class=\"wrappable-list-item\">\n    <!-- <mat-icon *ngIf=\"item.label || item.header as label\" matListIcon>{{ label | mtnaWfGetListIcon }}</mat-icon> -->\n    <h4 *ngIf=\"!item.questionText && (item.label || item.name) as label\" mat-line>{{ label }}</h4>\n    <p mat-line class=\"wrap-line\">{{ item.value || _noInformationText }}</p>\n  </mat-list-item>\n</ng-template>\n", styles: ["mtna-wf-input-item.mtna-wf-control-item .mat-form-field{width:100%}mtna-wf-input-item.mtna-wf-control-item .mtna-wf-error-container{font-size:75%;line-height:1;min-height:1em;margin-top:-.75rem}mtna-wf-input-item.mtna-wf-control-item .control-item-content{padding:.35em .75em .625em}mtna-wf-input-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list){padding-left:.75em}mtna-wf-input-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list).mat-form-field{width:calc(100% - .75em)}mtna-wf-input-item .mat-list-base .mat-list-item,mtna-wf-input-item .mat-list-base .mat-list-item.mat-list-item-with-avatar{height:auto;padding:12px 0}mtna-wf-input-item .mat-list-base .mat-list-item.mat-2-line,mtna-wf-input-item .mat-list-base .mat-list-item.mat-2-line.mat-list-item-with-avatar{padding:18.5px 0}mtna-wf-input-item .mat-list-base .mat-list-item .mat-line{white-space:normal;overflow:unset;text-overflow:unset}\n"], components: [{ type: i1$4.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }, { type: i4$2.MatList, selector: "mat-list, mat-action-list", inputs: ["disableRipple", "disabled"], exportAs: ["matList"] }, { type: i4$2.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["disableRipple", "disabled"], exportAs: ["matListItem"] }], directives: [{ type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i1$4.MatLabel, selector: "mat-label" }, { type: i5$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["id", "disabled", "required", "type", "value", "readonly", "placeholder", "errorStateMatcher", "aria-describedby"], exportAs: ["matInput"] }, { 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]" }, { type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i6.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$4.MatError, selector: "mat-error", inputs: ["id"] }, { type: i3$3.MatLine, selector: "[mat-line], [matLine]" }], pipes: { "mtnaWfGetAutoComplete": MtnaWfGetAutoCompletePipe, "slice": i3.SlicePipe, "keyvalue": i3.KeyValuePipe, "mtnaWfGetControlError": MtnaWfGetFormControlErrorPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+MtnaWfInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfInputComponent, selector: "mtna-wf-input-item", usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"header; context: { $implicit: true }\"></ng-container>\n<mat-form-field\n  *ngIf=\"!readonly && !!control; else readOnly\"\n  appearance=\"outline\"\n  [mtnaHighlight]=\"indicatorStatus === 'ACTIVE' && !hasItemHeader\"\n>\n  <mat-label>{{ item.label }}</mat-label>\n  <textarea\n    *ngIf=\"isParagraph; else shortInput\"\n    matInput\n    [formControl]=\"control\"\n    [required]=\"item.required\"\n    [attr.autocomplete]=\"item.label || item.name | mtnaWfGetAutoComplete\"\n    cdkTextareaAutoSize\n    cdkAutosizeMinRows=\"3\"\n    cdkAutosizeMaxRows=\"5\"\n  ></textarea>\n\n  <ng-template #shortInput>\n    <input matInput [formControl]=\"control!\" [autocomplete]=\"item.label || item.name | mtnaWfGetAutoComplete\" [required]=\"item.required\" />\n  </ng-template>\n\n  <mat-error *ngFor=\"let error of control.errors | keyvalue | slice : 0 : 1\">\n    {{ error | mtnaWfGetControlError : item }}\n  </mat-error>\n</mat-form-field>\n\n<!-- READONLY -->\n<ng-template #readOnly>\n  <ng-container *ngTemplateOutlet=\"inList ? listItem : fullList\"></ng-container>\n</ng-template>\n\n<ng-template #fullList>\n  <mat-list>\n    <ng-container *ngTemplateOutlet=\"listItem\"></ng-container>\n  </mat-list>\n</ng-template>\n\n<ng-template #listItem>\n  <mat-list-item class=\"wrappable-list-item\">\n    <!-- <mat-icon *ngIf=\"item.label || item.header as label\" matListIcon>{{ label | mtnaWfGetListIcon }}</mat-icon> -->\n    <h4 *ngIf=\"!item.questionText && (item.label || item.name) as label\" mat-line>{{ label }}</h4>\n    <p mat-line class=\"wrap-line\">{{ item.value || _noInformationText }}</p>\n  </mat-list-item>\n</ng-template>\n", styles: ["mtna-wf-input-item.mtna-wf-control-item .mat-form-field{width:100%}mtna-wf-input-item.mtna-wf-control-item .mtna-wf-error-container{font-size:75%;line-height:1;min-height:1em;margin-top:-.75rem}mtna-wf-input-item.mtna-wf-control-item .control-item-content{padding:.35em .75em .625em}mtna-wf-input-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list){padding-left:.75em}mtna-wf-input-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list).mat-form-field{width:calc(100% - .75em)}mtna-wf-input-item .mat-list-base .mat-list-item,mtna-wf-input-item .mat-list-base .mat-list-item.mat-list-item-with-avatar{height:auto;padding:12px 0}mtna-wf-input-item .mat-list-base .mat-list-item.mat-2-line,mtna-wf-input-item .mat-list-base .mat-list-item.mat-2-line.mat-list-item-with-avatar{padding:18.5px 0}mtna-wf-input-item .mat-list-base .mat-list-item .mat-line{white-space:normal;overflow:unset;text-overflow:unset}\n"], components: [{ type: i1$5.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }, { type: i4$1.MatList, selector: "mat-list, mat-action-list", inputs: ["disableRipple", "disabled"], exportAs: ["matList"] }, { type: i4$1.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["disableRipple", "disabled"], exportAs: ["matListItem"] }], directives: [{ type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$1.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i1$5.MatLabel, selector: "mat-label" }, { type: i5$1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["id", "disabled", "required", "type", "value", "readonly", "placeholder", "errorStateMatcher", "aria-describedby"], exportAs: ["matInput"] }, { 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]" }, { type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i6.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$5.MatError, selector: "mat-error", inputs: ["id"] }, { type: i3$3.MatLine, selector: "[mat-line], [matLine]" }], pipes: { "mtnaWfGetAutoComplete": MtnaWfGetAutoCompletePipe, "slice": i3.SlicePipe, "keyvalue": i3.KeyValuePipe, "mtnaWfGetControlError": MtnaWfGetFormControlErrorPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfInputComponent, decorators: [{
             type: Component,
             args: [{
@@ -4818,7 +4862,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
 class MtnaWfMultipleChoiceComponent extends MtnaWfBaseSingleSelectionParentValueItem {
 }
 MtnaWfMultipleChoiceComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfMultipleChoiceComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MtnaWfMultipleChoiceComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfMultipleChoiceComponent, selector: "mtna-wf-multiple-choice-item", usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"header\"></ng-container>\n<div *ngIf=\"control\" [mtnaHighlight]=\"indicatorStatus === 'ACTIVE'\">\n  <div class=\"mtna-wf-error-container\">\n    <ng-container *ngIf=\"control.invalid && (control.dirty || control.touched)\">\n      <mat-error *ngFor=\"let error of control.errors | keyvalue\">\n        {{ error | mtnaWfGetControlError : item }}\n      </mat-error>\n    </ng-container>\n  </div>\n  <mat-radio-group class=\"control-item-content\" [formControl]=\"control\" (change)=\"selectionChange($event)\">\n    <ng-container *ngFor=\"let opt of item.options; trackBy: _trackByOptionId\">\n      <mat-radio-button [disableRipple]=\"readonly\" [disabled]=\"readonly || control.disabled\" [value]=\"opt.option.id\">{{ opt.option.name }}</mat-radio-button>\n      <mtna-wf-item\n        *ngIf=\"item.optionItemMap[opt.option.id] as subItem\"\n        [item]=\"subItem\"\n        [control]=\"!!controlWrapper && !!controlWrapper.controls ? controlWrapper.controls[subItem.instanceId] : undefined\"\n        [parentIds]=\"parentIds.concat(opt.option.id)\"\n        [readonly]=\"readonly\"\n      ></mtna-wf-item>\n    </ng-container>\n  </mat-radio-group>\n</div>\n", styles: ["mtna-wf-multiple-choice-item.mtna-wf-control-item .mat-form-field{width:100%}mtna-wf-multiple-choice-item.mtna-wf-control-item .mtna-wf-error-container{font-size:75%;line-height:1;min-height:1em;margin-top:-.75rem}mtna-wf-multiple-choice-item.mtna-wf-control-item .control-item-content{padding:.35em .75em .625em}mtna-wf-multiple-choice-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list){padding-left:.75em}mtna-wf-multiple-choice-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list).mat-form-field{width:calc(100% - .75em)}mtna-wf-multiple-choice-item .mat-radio-group{display:inline-block;max-width:100%;width:100%}mtna-wf-multiple-choice-item .mat-radio-button{display:block;max-width:100%}mtna-wf-multiple-choice-item .mat-radio-button:not(:last-of-type){margin-bottom:4px}mtna-wf-multiple-choice-item .mat-radio-button .mat-radio-label{white-space:normal}mtna-wf-multiple-choice-item .mat-radio-button+mtna-wf-item{padding-left:28px;margin-top:0}mtna-wf-multiple-choice-item.read-only .mat-radio-button .mat-radio-label{cursor:default}\n"], components: [{ type: i1$6.MatRadioButton, selector: "mat-radio-button", inputs: ["disableRipple", "tabIndex"], exportAs: ["matRadioButton"] }, { type: MtnaWfFormItemComponent, selector: "mtna-wf-item", inputs: ["color", "control", "header", "inList", "item", "parentIds", "readonly", "step"], outputs: ["focusedSection"] }], directives: [{ type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$4.MatError, selector: "mat-error", inputs: ["id"] }, { type: i1$6.MatRadioGroup, selector: "mat-radio-group", exportAs: ["matRadioGroup"] }, { type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], pipes: { "keyvalue": i3.KeyValuePipe, "mtnaWfGetControlError": MtnaWfGetFormControlErrorPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+MtnaWfMultipleChoiceComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfMultipleChoiceComponent, selector: "mtna-wf-multiple-choice-item", usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"header\"></ng-container>\n<div *ngIf=\"control\" [mtnaHighlight]=\"indicatorStatus === 'ACTIVE'\">\n  <div class=\"mtna-wf-error-container\">\n    <ng-container *ngIf=\"control.invalid && (control.dirty || control.touched)\">\n      <mat-error *ngFor=\"let error of control.errors | keyvalue\">\n        {{ error | mtnaWfGetControlError : item }}\n      </mat-error>\n    </ng-container>\n  </div>\n  <mat-radio-group class=\"control-item-content\" [formControl]=\"control\" (change)=\"selectionChange($event)\">\n    <ng-container *ngFor=\"let opt of item.options; trackBy: _trackByOptionId\">\n      <mat-radio-button [disableRipple]=\"readonly\" [disabled]=\"readonly || control.disabled\" [value]=\"opt.option.id\">{{\n        opt.option.name\n      }}</mat-radio-button>\n      <mtna-wf-item\n        *ngIf=\"item.optionItemMap[opt.option.id] as subItem\"\n        [item]=\"subItem\"\n        [control]=\"!!controlWrapper && !!controlWrapper.controls ? controlWrapper.controls[subItem.instanceId] : undefined\"\n        [parentIds]=\"parentIds.concat(opt.option.id)\"\n        [readonly]=\"readonly\"\n      ></mtna-wf-item>\n    </ng-container>\n  </mat-radio-group>\n</div>\n", styles: ["mtna-wf-multiple-choice-item.mtna-wf-control-item .mat-form-field{width:100%}mtna-wf-multiple-choice-item.mtna-wf-control-item .mtna-wf-error-container{font-size:75%;line-height:1;min-height:1em;margin-top:-.75rem}mtna-wf-multiple-choice-item.mtna-wf-control-item .control-item-content{padding:.35em .75em .625em}mtna-wf-multiple-choice-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list){padding-left:.75em}mtna-wf-multiple-choice-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list).mat-form-field{width:calc(100% - .75em)}mtna-wf-multiple-choice-item .mat-radio-group{display:inline-block;max-width:100%;width:100%}mtna-wf-multiple-choice-item .mat-radio-button{display:block;max-width:100%}mtna-wf-multiple-choice-item .mat-radio-button:not(:last-of-type){margin-bottom:4px}mtna-wf-multiple-choice-item .mat-radio-button .mat-radio-label{white-space:normal}mtna-wf-multiple-choice-item .mat-radio-button+mtna-wf-item{padding-left:28px;margin-top:0}mtna-wf-multiple-choice-item.read-only .mat-radio-button .mat-radio-label{cursor:default}\n"], components: [{ type: i1$7.MatRadioButton, selector: "mat-radio-button", inputs: ["disableRipple", "tabIndex"], exportAs: ["matRadioButton"] }, { type: MtnaWfFormItemComponent, selector: "mtna-wf-item", inputs: ["color", "control", "header", "inList", "item", "parentIds", "readonly", "step"], outputs: ["focusedSection"] }], directives: [{ type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$1.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$5.MatError, selector: "mat-error", inputs: ["id"] }, { type: i1$7.MatRadioGroup, selector: "mat-radio-group", exportAs: ["matRadioGroup"] }, { type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], pipes: { "keyvalue": i3.KeyValuePipe, "mtnaWfGetControlError": MtnaWfGetFormControlErrorPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfMultipleChoiceComponent, decorators: [{
             type: Component,
             args: [{
@@ -4872,7 +4916,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
 class MtnaWfOrderedListItemComponent extends MtnaWfBaseFormItem {
 }
 MtnaWfOrderedListItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfOrderedListItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MtnaWfOrderedListItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfOrderedListItemComponent, selector: "mtna-wf-ordered-list-item", usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"header\"></ng-container>\n<ol [mtnaHighlight]=\"indicatorStatus === 'ACTIVE' && !item.questionText && !item.descriptiveText\">\n  <li *ngFor=\"let item of item.value\" [innerHTML]=\"item | mtnaWfSanitizeHtml\"></li>\n</ol>\n", styles: ["mtna-wf-ordered-list-item>ol{list-style:decimal outside;padding-left:1rem}mtna-annotations-indicator+mtna-wf-item-injector+mtna-wf-ordered-list-item>ol{padding-right:24px}\n"], directives: [{ type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i4.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "mtnaWfSanitizeHtml": MtnaWfSanitizeHtmlPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+MtnaWfOrderedListItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfOrderedListItemComponent, selector: "mtna-wf-ordered-list-item", usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"header\"></ng-container>\n<ol [mtnaHighlight]=\"indicatorStatus === 'ACTIVE' && !item.questionText && !item.descriptiveText\">\n  <li *ngFor=\"let item of item.value\" [innerHTML]=\"item | mtnaWfSanitizeHtml\"></li>\n</ol>\n", styles: ["mtna-wf-ordered-list-item>ol{list-style:decimal outside;padding-left:1rem}mtna-annotations-indicator+mtna-wf-item-injector+mtna-wf-ordered-list-item>ol{padding-right:24px}\n"], directives: [{ type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i1$1.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "mtnaWfSanitizeHtml": MtnaWfSanitizeHtmlPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfOrderedListItemComponent, decorators: [{
             type: Component,
             args: [{
@@ -4948,7 +4992,7 @@ class MtnaWfRepeatableItemContainerComponent extends MtnaWfBaseParentValueItem {
     }
 }
 MtnaWfRepeatableItemContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfRepeatableItemContainerComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: MtnaWfManagerService }], target: i0.ɵɵFactoryTarget.Component });
-MtnaWfRepeatableItemContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfRepeatableItemContainerComponent, selector: "mtna-wf-repeatable-item-container", usesInheritance: true, ngImport: i0, template: "<mtna-wf-item-header\n  *ngIf=\"!!item.questionText || !!item.descriptiveText\"\n  [descriptiveText]=\"item.descriptiveText\"\n  [disabled]=\"control?.disabled || false\"\n  [questionText]=\"item.questionText\"\n  [required]=\"item.required\"\n></mtna-wf-item-header>\n<section [mtnaHighlight]=\"indicatorStatus === 'ACTIVE' && !item.questionText && !item.descriptiveText\">\n  <mtna-wf-repeatable-item\n    @repeatItemExpandCollapse\n    *ngFor=\"let subitem of item.items; let first = first; trackBy: 'instanceId' | mtnaTrackByProperty\"\n  >\n    <ng-container *ngIf=\"subitem | coerceFormItem as coercedSubItem\">\n      <button\n        *ngIf=\"!readonly && item.items.length > item.minOccurrences\"\n        mat-icon-button\n        class=\"item-remove-button\"\n        color=\"warn\"\n        (click)=\"removeItem(coercedSubItem)\"\n        matTooltip=\"Remove Item\"\n        i18n-matTooltip\n      >\n        <mat-icon>remove_circle</mat-icon>\n      </button>\n      <mtna-wf-item\n        [item]=\"coercedSubItem\"\n        [control]=\"!!control && !!control.controls ? control.controls[coercedSubItem.instanceId] : undefined\"\n        [readonly]=\"readonly\"\n        [parentIds]=\"parentIds\"\n      ></mtna-wf-item>\n    </ng-container>\n  </mtna-wf-repeatable-item>\n</section>\n<button *ngIf=\"!readonly\" mat-raised-button (click)=\"addItem()\" class=\"new-item-button\" color=\"primary\">\n  {{ item.additionalText || _addText | uppercase }}\n</button>\n", styles: ["mtna-wf-repeatable-item-container{display:block}mtna-wf-repeatable-item-container>section>mtna-wf-repeatable-item{position:relative;padding:16px;border-style:dashed;border-width:4px;border-radius:4px;display:inline-block;margin:8px;max-width:100%}mtna-wf-repeatable-item-container>section>mtna-wf-repeatable-item .item-remove-button{position:absolute;top:-22px;left:-22px}mtna-wf-repeatable-item-container>section>mtna-wf-repeatable-item>mtna-wf-item:first-child{margin-top:0}mtna-wf-repeatable-item-container .new-item-button{margin-left:.75em}mtna-wf-repeatable-item-container>section{padding-left:.75em}mtna-wf-repeatable-item-container>section,mtna-wf-repeatable-item-container .new-item-button{margin-top:16px}\n"], components: [{ type: MtnaWfItemHeaderComponent, selector: "mtna-wf-item-header", inputs: ["descriptiveText", "disabled", "hideRequiredMarker", "invalid", "questionText", "required"] }, { type: MtnaWfRepeatableItemComponent, selector: "mtna-wf-repeatable-item" }, { type: i3$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: MtnaWfFormItemComponent, selector: "mtna-wf-item", inputs: ["color", "control", "header", "inList", "item", "parentIds", "readonly", "step"], outputs: ["focusedSection"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }], pipes: { "mtnaTrackByProperty": i4.MtnaTrackByPropertyPipe, "coerceFormItem": MtnaWfCoerceFormItemPipe, "uppercase": i3.UpperCasePipe }, animations: [
+MtnaWfRepeatableItemContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfRepeatableItemContainerComponent, selector: "mtna-wf-repeatable-item-container", usesInheritance: true, ngImport: i0, template: "<mtna-wf-item-header\n  *ngIf=\"!!item.questionText || !!item.descriptiveText\"\n  [descriptiveText]=\"item.descriptiveText\"\n  [disabled]=\"control?.disabled || false\"\n  [questionText]=\"item.questionText\"\n  [required]=\"item.required\"\n></mtna-wf-item-header>\n<section [mtnaHighlight]=\"indicatorStatus === 'ACTIVE' && !item.questionText && !item.descriptiveText\">\n  <mtna-wf-repeatable-item\n    @repeatItemExpandCollapse\n    *ngFor=\"let subitem of item.items; let first = first; trackBy: 'instanceId' | mtnaTrackByProperty\"\n  >\n    <ng-container *ngIf=\"subitem | coerceFormItem as coercedSubItem\">\n      <button\n        *ngIf=\"!readonly && item.items.length > item.minOccurrences\"\n        mat-icon-button\n        class=\"item-remove-button\"\n        color=\"warn\"\n        (click)=\"removeItem(coercedSubItem)\"\n        matTooltip=\"Remove Item\"\n        i18n-matTooltip\n      >\n        <mat-icon>remove_circle</mat-icon>\n      </button>\n      <mtna-wf-item\n        [item]=\"coercedSubItem\"\n        [control]=\"!!control && !!control.controls ? control.controls[coercedSubItem.instanceId] : undefined\"\n        [readonly]=\"readonly\"\n        [parentIds]=\"parentIds\"\n      ></mtna-wf-item>\n    </ng-container>\n  </mtna-wf-repeatable-item>\n</section>\n<button *ngIf=\"!readonly\" mat-raised-button (click)=\"addItem()\" class=\"new-item-button\" color=\"primary\">\n  {{ item.additionalText || _addText | uppercase }}\n</button>\n", styles: ["mtna-wf-repeatable-item-container{display:block}mtna-wf-repeatable-item-container>section>mtna-wf-repeatable-item{position:relative;padding:16px;border-style:dashed;border-width:4px;border-radius:4px;display:inline-block;margin:8px;max-width:100%}mtna-wf-repeatable-item-container>section>mtna-wf-repeatable-item .item-remove-button{position:absolute;top:-22px;left:-22px}mtna-wf-repeatable-item-container>section>mtna-wf-repeatable-item>mtna-wf-item:first-child{margin-top:0}mtna-wf-repeatable-item-container .new-item-button{margin-left:.75em}mtna-wf-repeatable-item-container>section{padding-left:.75em}mtna-wf-repeatable-item-container>section,mtna-wf-repeatable-item-container .new-item-button{margin-top:16px}\n"], components: [{ type: MtnaWfItemHeaderComponent, selector: "mtna-wf-item-header", inputs: ["descriptiveText", "disabled", "hideRequiredMarker", "invalid", "questionText", "required"] }, { type: MtnaWfRepeatableItemComponent, selector: "mtna-wf-repeatable-item" }, { type: i3$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: MtnaWfFormItemComponent, selector: "mtna-wf-item", inputs: ["color", "control", "header", "inList", "item", "parentIds", "readonly", "step"], outputs: ["focusedSection"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$1.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }], pipes: { "mtnaTrackByProperty": i1$1.MtnaTrackByPropertyPipe, "coerceFormItem": MtnaWfCoerceFormItemPipe, "uppercase": i3.UpperCasePipe }, animations: [
         trigger('repeatItemExpandCollapse', [
             state('in', style({ height: '*', margin: '*', opacity: 1 })),
             state('void', style({ height: 0, margin: 0, opacity: 0, visibility: 'hidden' })),
@@ -5051,7 +5095,7 @@ class MtnaWfResourceSearchComponent extends MtnaWfBaseValueItem {
         });
     }
 }
-MtnaWfResourceSearchComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfResourceSearchComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$7.MtnaInMemorySearchFacade }, { token: i1.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
+MtnaWfResourceSearchComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfResourceSearchComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$8.MtnaInMemorySearchFacade }, { token: i1.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
 MtnaWfResourceSearchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfResourceSearchComponent, selector: "mtna-wf-resource-search-item", usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"header\"></ng-container>\n<div class=\"label-container\" fxLayout=\"row\" fxLayoutAlign=\"start center\">\n  <div class=\"label-text\">\n    {{ item.label }}\n  </div>\n  <mat-divider fxFlex></mat-divider>\n</div>\n<div class=\"values-container\">\n  <!--  <aria-ui-reference-list-table\n            [path]=\"path\"\n            [referenceConfiguration]=\"referenceConfiguration\"\n            [references]=\"references\"\n            [termReference]=\"termReference\"\n            (openDetails)=\"openDetails.emit($event)\"\n            (referenceSelected)=\"addButtonDisabled = !!$event\"\n            (updateValues)=\"updateValues.emit($event)\"\n    >\n    </aria-ui-reference-list-table>\n    -->\n  <button mat-flat-button class=\"add-button\" color=\"primary\" [disabled]=\"readonly\" (click)=\"openDialog()\" i18n>\n    Add Resource<mat-icon>add_circle_outline</mat-icon>\n  </button>\n</div>\n", styles: ["mtna-wf-resource-search-item .label-container .label-text{margin:0 8px 0 0}mtna-wf-resource-search-item .label-container .mat-divider.mat-divider-horizontal{position:unset;width:unset}mtna-wf-resource-search-item .values-container{margin-left:1em;border-width:1px;border-style:solid;border-radius:4px;border-color:#0000001f;padding:8px}mtna-wf-resource-search-item .values-container .paginator-and-order-controls{margin-bottom:8px}mtna-wf-resource-search-item .values-container .add-button .mat-icon{margin-left:4px}\n"], components: [{ type: i2$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { type: i3$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3$2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i3$2.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { type: i3$2.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfResourceSearchComponent, decorators: [{
             type: Component,
@@ -5062,7 +5106,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                     encapsulation: ViewEncapsulation.None,
                     changeDetection: ChangeDetectionStrategy.OnPush,
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1$7.MtnaInMemorySearchFacade }, { type: i1.MatDialog }]; } });
+        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1$8.MtnaInMemorySearchFacade }, { type: i1.MatDialog }]; } });
 
 class MtnaWfResourceSearchModule {
 }
@@ -5087,7 +5131,7 @@ class MtnaWfTableFormItemComponent extends MtnaWfBaseParentValueItem {
     }
 }
 MtnaWfTableFormItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfTableFormItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MtnaWfTableFormItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfTableFormItemComponent, selector: "mtna-wf-table-item", usesInheritance: true, ngImport: i0, template: "<table mat-table [dataSource]=\"item.tableRows\" [trackBy]=\"_trackByTableRow\">\n  <ng-container *ngFor=\"let header of item.headers; let index = index\" [matColumnDef]=\"header\">\n    <th mat-header-cell *matHeaderCellDef>{{ header }}</th>\n\n    <td mat-cell *matCellDef=\"let rowItem\">\n      <mtna-wf-item\n        *ngIf=\"!!rowItem.items[index]\"\n        [control]=\"!!control && !!control.controls ? control.controls[rowItem.items[index].instanceId] : undefined\"\n        [item]=\"rowItem.items[index]\"\n        [readonly]=\"readonly\"\n        [parentIds]=\"parentIds\"\n      ></mtna-wf-item>\n    </td>\n  </ng-container>\n\n  <tr mat-header-row *matHeaderRowDef=\"item.headers\"></tr>\n  <tr mat-row *matRowDef=\"let row; columns: item.headers\"></tr>\n</table>\n", styles: ["mtna-wf-table-item .mat-table{width:100%}mtna-wf-table-item .mat-table tbody tr td.mat-cell{padding:8px;vertical-align:top}mtna-wf-table-item .mat-table tbody tr td mtna-wf-group>.group{flex-direction:column;place-content:start start;align-items:start;justify-content:start}mtna-wf-table-item .mat-table tbody tr td mtna-wf-group>.group *{margin-top:0;margin-bottom:0}mtna-wf-table-item .mat-table tbody tr td mtna-wf-boolean-item>.mat-slide-toggle{margin-bottom:8px;margin-top:8px}mtna-wf-table-item .mat-table tbody tr td mtna-wf-repeatable-item-container .repeat-item-container:not(:first-of-type){margin-top:8px}mtna-wf-table-item .mat-table tbody tr td mtna-wf-repeatable-item-container .new-item-button{margin:8px 0}\n"], components: [{ type: i1$8.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { type: MtnaWfFormItemComponent, selector: "mtna-wf-item", inputs: ["color", "control", "header", "inList", "item", "parentIds", "readonly", "step"], outputs: ["focusedSection"] }, { type: i1$8.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { type: i1$8.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }], directives: [{ type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$8.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { type: i1$8.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { type: i1$8.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { type: i1$8.MatCellDef, selector: "[matCellDef]" }, { type: i1$8.MatCell, selector: "mat-cell, td[mat-cell]" }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$8.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { type: i1$8.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+MtnaWfTableFormItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfTableFormItemComponent, selector: "mtna-wf-table-item", usesInheritance: true, ngImport: i0, template: "<table mat-table [dataSource]=\"item.tableRows\" [trackBy]=\"_trackByTableRow\">\n  <ng-container *ngFor=\"let header of item.headers; let index = index\" [matColumnDef]=\"header\">\n    <th mat-header-cell *matHeaderCellDef>{{ header }}</th>\n\n    <td mat-cell *matCellDef=\"let rowItem\">\n      <mtna-wf-item\n        *ngIf=\"!!rowItem.items[index]\"\n        [control]=\"!!control && !!control.controls ? control.controls[rowItem.items[index].instanceId] : undefined\"\n        [item]=\"rowItem.items[index]\"\n        [readonly]=\"readonly\"\n        [parentIds]=\"parentIds\"\n      ></mtna-wf-item>\n    </td>\n  </ng-container>\n\n  <tr mat-header-row *matHeaderRowDef=\"item.headers\"></tr>\n  <tr mat-row *matRowDef=\"let row; columns: item.headers\"></tr>\n</table>\n", styles: ["mtna-wf-table-item .mat-table{width:100%}mtna-wf-table-item .mat-table tbody tr td.mat-cell{padding:8px;vertical-align:top}mtna-wf-table-item .mat-table tbody tr td mtna-wf-group>.group{flex-direction:column;place-content:start start;align-items:start;justify-content:start}mtna-wf-table-item .mat-table tbody tr td mtna-wf-group>.group *{margin-top:0;margin-bottom:0}mtna-wf-table-item .mat-table tbody tr td mtna-wf-boolean-item>.mat-slide-toggle{margin-bottom:8px;margin-top:8px}mtna-wf-table-item .mat-table tbody tr td mtna-wf-repeatable-item-container .repeat-item-container:not(:first-of-type){margin-top:8px}mtna-wf-table-item .mat-table tbody tr td mtna-wf-repeatable-item-container .new-item-button{margin:8px 0}\n"], components: [{ type: i1$9.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { type: MtnaWfFormItemComponent, selector: "mtna-wf-item", inputs: ["color", "control", "header", "inList", "item", "parentIds", "readonly", "step"], outputs: ["focusedSection"] }, { type: i1$9.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { type: i1$9.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }], directives: [{ type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$9.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { type: i1$9.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { type: i1$9.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { type: i1$9.MatCellDef, selector: "[matCellDef]" }, { type: i1$9.MatCell, selector: "mat-cell, td[mat-cell]" }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$9.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { type: i1$9.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfTableFormItemComponent, decorators: [{
             type: Component,
             args: [{
@@ -5116,7 +5160,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
 class MtnaWfTextItemComponent extends MtnaWfBaseFormItem {
 }
 MtnaWfTextItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfTextItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MtnaWfTextItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfTextItemComponent, selector: "mtna-wf-text-item", usesInheritance: true, ngImport: i0, template: "<p [innerHTML]=\"$any(item.value) | mtnaWfSanitizeHtml\" class=\"mtna-wf-text-item\" [mtnaHighlight]=\"indicatorStatus === 'ACTIVE'\"></p>\n", styles: ["mtna-annotations-indicator+mtna-wf-item-injector+mtna-wf-text-item .mtna-wf-text-item{padding-right:24px}\n"], directives: [{ type: i4.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }], pipes: { "mtnaWfSanitizeHtml": MtnaWfSanitizeHtmlPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+MtnaWfTextItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfTextItemComponent, selector: "mtna-wf-text-item", usesInheritance: true, ngImport: i0, template: "<p [innerHTML]=\"$any(item.value) | mtnaWfSanitizeHtml\" class=\"mtna-wf-text-item\" [mtnaHighlight]=\"indicatorStatus === 'ACTIVE'\"></p>\n", styles: ["mtna-annotations-indicator+mtna-wf-item-injector+mtna-wf-text-item .mtna-wf-text-item{padding-right:24px}\n"], directives: [{ type: i1$1.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }], pipes: { "mtnaWfSanitizeHtml": MtnaWfSanitizeHtmlPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfTextItemComponent, decorators: [{
             type: Component,
             args: [{
@@ -5145,7 +5189,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
 class MtnaWfTitleItemComponent extends MtnaWfBaseFormItem {
 }
 MtnaWfTitleItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfTitleItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MtnaWfTitleItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfTitleItemComponent, selector: "mtna-wf-title-item", usesInheritance: true, ngImport: i0, template: "<h3 class=\"mtna-wf-title-item\" [mtnaHighlight]=\"indicatorStatus === 'ACTIVE'\">{{ item.value }}</h3>\n", styles: ["mtna-annotations-indicator+mtna-wf-item-injector+mtna-wf-title-item .mtna-wf-title-item{padding-right:24px}mtna-wf-title-item .mtna-wf-title-item{font-size:1rem;font-weight:400;letter-spacing:1px;line-height:32px;text-transform:uppercase}\n"], directives: [{ type: i4.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+MtnaWfTitleItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfTitleItemComponent, selector: "mtna-wf-title-item", usesInheritance: true, ngImport: i0, template: "<h3 class=\"mtna-wf-title-item\" [mtnaHighlight]=\"indicatorStatus === 'ACTIVE'\">{{ item.value }}</h3>\n", styles: ["mtna-annotations-indicator+mtna-wf-item-injector+mtna-wf-title-item .mtna-wf-title-item{padding-right:24px}mtna-wf-title-item .mtna-wf-title-item{font-size:1rem;font-weight:400;letter-spacing:1px;line-height:32px;text-transform:uppercase}\n"], directives: [{ type: i1$1.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfTitleItemComponent, decorators: [{
             type: Component,
             args: [{
@@ -5174,7 +5218,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
 class MtnaWfUnorderedListItemComponent extends MtnaWfBaseFormItem {
 }
 MtnaWfUnorderedListItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfUnorderedListItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MtnaWfUnorderedListItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfUnorderedListItemComponent, selector: "mtna-wf-unordered-list-item", usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"header\"></ng-container>\n<ul [mtnaHighlight]=\"indicatorStatus === 'ACTIVE' && !item.questionText && !item.descriptiveText\">\n  <li *ngFor=\"let item of item.value\" [innerHTML]=\"item | mtnaWfSanitizeHtml\"></li>\n</ul>\n", styles: ["mtna-wf-unordered-list-item>ul{list-style:disc outside;padding-left:1rem}mtna-annotations-indicator+mtna-wf-item-injector+mtna-wf-unordered-list-item>ul{padding-right:24px}\n"], directives: [{ type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i4.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "mtnaWfSanitizeHtml": MtnaWfSanitizeHtmlPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+MtnaWfUnorderedListItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfUnorderedListItemComponent, selector: "mtna-wf-unordered-list-item", usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"header\"></ng-container>\n<ul [mtnaHighlight]=\"indicatorStatus === 'ACTIVE' && !item.questionText && !item.descriptiveText\">\n  <li *ngFor=\"let item of item.value\" [innerHTML]=\"item | mtnaWfSanitizeHtml\"></li>\n</ul>\n", styles: ["mtna-wf-unordered-list-item>ul{list-style:disc outside;padding-left:1rem}mtna-annotations-indicator+mtna-wf-item-injector+mtna-wf-unordered-list-item>ul{padding-right:24px}\n"], directives: [{ type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i1$1.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "mtnaWfSanitizeHtml": MtnaWfSanitizeHtmlPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfUnorderedListItemComponent, decorators: [{
             type: Component,
             args: [{
@@ -5328,7 +5372,7 @@ class MtnaWfYearQuarterComponent extends MtnaWfBaseValueItem {
     }
 }
 MtnaWfYearQuarterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfYearQuarterComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: MTNA_WF_DEFAULT_YEAR_RANGE, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-MtnaWfYearQuarterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfYearQuarterComponent, selector: "mtna-wf-year-quarter-item", host: { properties: { "class.mtna-wf-year-quarter-item": "this.yearQuarterItemClass" } }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"header\"></ng-container>\n<div\n  *ngIf=\"control\"\n  class=\"year-quarter-container\"\n  fxLayout=\"row\"\n  fxLayoutGap=\"8px\"\n  [mtnaHighlight]=\"indicatorStatus === 'ACTIVE' && !hasItemHeader\"\n>\n  <mat-form-field>\n    <mat-select [formControl]=\"_yearControl\" aria-label=\"Year Selection\" i18n-aria-label>\n      <mat-option *ngFor=\"let year of _yearSelection\" [value]=\"year\">{{ year }}</mat-option>\n    </mat-select>\n    <mat-error *ngFor=\"let error of control.errors | keyvalue\">\n      {{ error | mtnaWfGetControlError : item }}\n    </mat-error>\n  </mat-form-field>\n\n  <mat-form-field>\n    <mat-select [formControl]=\"_quarterControl\" aria-label=\"Quarter Selection\" i18n-aria-label>\n      <mat-option i18n>None</mat-option>\n      <mat-option *ngFor=\"let quarter of _yearControl.value | mtnaWfGetQuarters : componentRangeLimits\" [value]=\"quarter\">{{\n        $any(quarter) | mtnaWfDateQuarter : 'short'\n      }}</mat-option>\n    </mat-select>\n    <mat-error *ngFor=\"let error of control.errors | keyvalue\">\n      {{ error | mtnaWfGetControlError : item }}\n    </mat-error>\n  </mat-form-field>\n</div>\n", styles: ["mtna-wf-year-quarter-item.mtna-wf-control-item .mat-form-field{width:100%}mtna-wf-year-quarter-item.mtna-wf-control-item .mtna-wf-error-container{font-size:75%;line-height:1;min-height:1em;margin-top:-.75rem}mtna-wf-year-quarter-item.mtna-wf-control-item .control-item-content{padding:.35em .75em .625em}mtna-wf-year-quarter-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list){padding-left:.75em}mtna-wf-year-quarter-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list).mat-form-field{width:calc(100% - .75em)}mtna-wf-year-quarter-item.mtna-wf-year-quarter-item .year-quarter-container>.mat-form-field{max-width:75px}mtna-wf-year-quarter-item.mtna-wf-year-quarter-item .year-quarter-container>.mat-form-field:first-of-type{margin-right:8px}\n"], components: [{ type: i1$4.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }, { type: i2$4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i3$3.MatOption, selector: "mat-option", exportAs: ["matOption"] }], directives: [{ type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i3$2.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { type: i4.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$4.MatError, selector: "mat-error", inputs: ["id"] }], pipes: { "keyvalue": i3.KeyValuePipe, "mtnaWfGetControlError": MtnaWfGetFormControlErrorPipe, "mtnaWfGetQuarters": MtnaWfGetAvailableQuartersPipe, "mtnaWfDateQuarter": MtnaWfDateQuarterPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+MtnaWfYearQuarterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfYearQuarterComponent, selector: "mtna-wf-year-quarter-item", host: { properties: { "class.mtna-wf-year-quarter-item": "this.yearQuarterItemClass" } }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"header\"></ng-container>\n<div\n  *ngIf=\"control\"\n  class=\"year-quarter-container\"\n  fxLayout=\"row\"\n  fxLayoutGap=\"8px\"\n  [mtnaHighlight]=\"indicatorStatus === 'ACTIVE' && !hasItemHeader\"\n>\n  <mat-form-field>\n    <mat-select [formControl]=\"_yearControl\" aria-label=\"Year Selection\" i18n-aria-label>\n      <mat-option *ngFor=\"let year of _yearSelection\" [value]=\"year\">{{ year }}</mat-option>\n    </mat-select>\n    <mat-error *ngFor=\"let error of control.errors | keyvalue\">\n      {{ error | mtnaWfGetControlError : item }}\n    </mat-error>\n  </mat-form-field>\n\n  <mat-form-field>\n    <mat-select [formControl]=\"_quarterControl\" aria-label=\"Quarter Selection\" i18n-aria-label>\n      <mat-option i18n>None</mat-option>\n      <mat-option *ngFor=\"let quarter of _yearControl.value | mtnaWfGetQuarters : componentRangeLimits\" [value]=\"quarter\">{{\n        $any(quarter) | mtnaWfDateQuarter : 'short'\n      }}</mat-option>\n    </mat-select>\n    <mat-error *ngFor=\"let error of control.errors | keyvalue\">\n      {{ error | mtnaWfGetControlError : item }}\n    </mat-error>\n  </mat-form-field>\n</div>\n", styles: ["mtna-wf-year-quarter-item.mtna-wf-control-item .mat-form-field{width:100%}mtna-wf-year-quarter-item.mtna-wf-control-item .mtna-wf-error-container{font-size:75%;line-height:1;min-height:1em;margin-top:-.75rem}mtna-wf-year-quarter-item.mtna-wf-control-item .control-item-content{padding:.35em .75em .625em}mtna-wf-year-quarter-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list){padding-left:.75em}mtna-wf-year-quarter-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list).mat-form-field{width:calc(100% - .75em)}mtna-wf-year-quarter-item.mtna-wf-year-quarter-item .year-quarter-container>.mat-form-field{max-width:75px}mtna-wf-year-quarter-item.mtna-wf-year-quarter-item .year-quarter-container>.mat-form-field:first-of-type{margin-right:8px}\n"], components: [{ type: i1$5.MatFormField, selector: "mat-form-field", inputs: ["color", "floatLabel", "appearance", "hideRequiredMarker", "hintLabel"], exportAs: ["matFormField"] }, { type: i2$4.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { type: i3$3.MatOption, selector: "mat-option", exportAs: ["matOption"] }], directives: [{ type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i3$2.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { type: i1$1.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i6.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$5.MatError, selector: "mat-error", inputs: ["id"] }], pipes: { "keyvalue": i3.KeyValuePipe, "mtnaWfGetControlError": MtnaWfGetFormControlErrorPipe, "mtnaWfGetQuarters": MtnaWfGetAvailableQuartersPipe, "mtnaWfDateQuarter": MtnaWfDateQuarterPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfYearQuarterComponent, decorators: [{
             type: Component,
             args: [{
@@ -5409,7 +5453,7 @@ class MtnaWfYearQuarterRangeComponent extends MtnaWfBaseValueItem {
     }
 }
 MtnaWfYearQuarterRangeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfYearQuarterRangeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MtnaWfYearQuarterRangeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfYearQuarterRangeComponent, selector: "mtna-wf-year-quarter-range-item", host: { properties: { "class.mtna-wf-year-quarter-range-item": "this.yearQuarterRangeClass" } }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"header\"></ng-container>\n\n<div\n  *ngIf=\"control\"\n  class=\"range-item-container\"\n  fxLayout=\"row\"\n  fxLayoutAlign=\"start center\"\n  fxLayoutGap=\"8px\"\n  [mtnaHighlight]=\"indicatorStatus === 'ACTIVE' && !hasItemHeader\"\n>\n  <mtna-wf-year-quarter-item\n    [item]=\"_startItem\"\n    [control]=\"control.controls['start'] | mtnaWfCoerceFormControl\"\n    [readonly]=\"readonly\"\n  ></mtna-wf-year-quarter-item>\n  <span fxFlex=\"14px\">to</span>\n  <mtna-wf-year-quarter-item\n    [item]=\"_endItem\"\n    [control]=\"control.controls['end'] | mtnaWfCoerceFormControl\"\n    [readonly]=\"readonly\"\n  ></mtna-wf-year-quarter-item>\n</div>\n", styles: ["mtna-wf-year-quarter-range-item.mtna-wf-control-item .mat-form-field{width:100%}mtna-wf-year-quarter-range-item.mtna-wf-control-item .mtna-wf-error-container{font-size:75%;line-height:1;min-height:1em;margin-top:-.75rem}mtna-wf-year-quarter-range-item.mtna-wf-control-item .control-item-content{padding:.35em .75em .625em}mtna-wf-year-quarter-range-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list){padding-left:.75em}mtna-wf-year-quarter-range-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list).mat-form-field{width:calc(100% - .75em)}\n"], components: [{ type: MtnaWfYearQuarterComponent, selector: "mtna-wf-year-quarter-item" }], directives: [{ type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i3$2.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { type: i3$2.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { type: i4.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i3$2.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }], pipes: { "mtnaWfCoerceFormControl": MtnaWfCoerceFormControlPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+MtnaWfYearQuarterRangeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfYearQuarterRangeComponent, selector: "mtna-wf-year-quarter-range-item", host: { properties: { "class.mtna-wf-year-quarter-range-item": "this.yearQuarterRangeClass" } }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"header\"></ng-container>\n\n<div\n  *ngIf=\"control\"\n  class=\"range-item-container\"\n  fxLayout=\"row\"\n  fxLayoutAlign=\"start center\"\n  fxLayoutGap=\"8px\"\n  [mtnaHighlight]=\"indicatorStatus === 'ACTIVE' && !hasItemHeader\"\n>\n  <mtna-wf-year-quarter-item\n    [item]=\"_startItem\"\n    [control]=\"control.controls['start'] | mtnaWfCoerceFormControl\"\n    [readonly]=\"readonly\"\n  ></mtna-wf-year-quarter-item>\n  <span fxFlex=\"14px\">to</span>\n  <mtna-wf-year-quarter-item\n    [item]=\"_endItem\"\n    [control]=\"control.controls['end'] | mtnaWfCoerceFormControl\"\n    [readonly]=\"readonly\"\n  ></mtna-wf-year-quarter-item>\n</div>\n", styles: ["mtna-wf-year-quarter-range-item.mtna-wf-control-item .mat-form-field{width:100%}mtna-wf-year-quarter-range-item.mtna-wf-control-item .mtna-wf-error-container{font-size:75%;line-height:1;min-height:1em;margin-top:-.75rem}mtna-wf-year-quarter-range-item.mtna-wf-control-item .control-item-content{padding:.35em .75em .625em}mtna-wf-year-quarter-range-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list){padding-left:.75em}mtna-wf-year-quarter-range-item.mtna-wf-control-item .mtna-wf-item-header~:not(.mtna-wf-error-container):not(.mat-list).mat-form-field{width:calc(100% - .75em)}\n"], components: [{ type: MtnaWfYearQuarterComponent, selector: "mtna-wf-year-quarter-item" }], directives: [{ type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i3$2.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { type: i3$2.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { type: i1$1.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i3$2.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }], pipes: { "mtnaWfCoerceFormControl": MtnaWfCoerceFormControlPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfYearQuarterRangeComponent, decorators: [{
             type: Component,
             args: [{
@@ -5438,114 +5482,91 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                 }]
         }] });
 
-class MtnaWfProgressiveFormSectionComponent extends MtnaWfBaseSectionItem {
-    constructor(cdr) {
-        super(cdr);
-    }
-}
-MtnaWfProgressiveFormSectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfProgressiveFormSectionComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-MtnaWfProgressiveFormSectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfProgressiveFormSectionComponent, selector: "mtna-wf-progressive-form-section", usesInheritance: true, ngImport: i0, template: "<mtna-wf-step-card [step]=\"step\" [subtitle]=\"item.descriptiveText\" [mtnaHighlight]=\"indicatorStatus === 'ACTIVE'\">\n  <div cardContent>\n    <ng-container *ngFor=\"let subItem of item.items; trackBy: _trackByInstanceId\">\n      <mat-divider\n        *ngIf=\"(subItem.itemId | mtnaWfGetObjectType) === 'formitemgroupimpl' && item.items.indexOf(subItem) !== 0\"\n        class=\"section-item-divider\"\n        [inset]=\"true\"\n      ></mat-divider>\n\n      <mtna-wf-item\n        [item]=\"subItem\"\n        [readonly]=\"readonly\"\n        [parentIds]=\"parentIds\"\n        [control]=\"!!control && !!control.controls ? control.controls[subItem.instanceId] : undefined\"\n        (focusedSection)=\"focused.emit($event)\"\n      ></mtna-wf-item>\n    </ng-container>\n  </div>\n</mtna-wf-step-card>\n", styles: ["mtna-wf-progressive-form-section mat-divider.mat-divider-horizontal.progressive-form-section-actions-divider{position:relative;left:unset;padding-bottom:8px}mtna-wf-progressive-form-section .progressive-form-section-actions-wrapper .mat-raised-button{margin:0}\n"], components: [{ type: MtnaWfStepCardComponent, selector: "mtna-wf-step-card", inputs: ["color", "step", "subtitle"], outputs: ["focused"] }, { type: i2$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { type: MtnaWfFormItemComponent, selector: "mtna-wf-item", inputs: ["color", "control", "header", "inList", "item", "parentIds", "readonly", "step"], outputs: ["focusedSection"] }], directives: [{ type: i4.MtnaHighlightDirective, selector: "[mtnaHighlight]", inputs: ["mtnaHighlight", "mtnaHighlightColor"], exportAs: ["mtnaHighlight"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "mtnaWfGetObjectType": MtnaWfGetObjectTypePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfProgressiveFormSectionComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'mtna-wf-progressive-form-section',
-                    templateUrl: './progressive-form-section.component.html',
-                    styleUrls: ['./progressive-form-section.component.scss'],
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    encapsulation: ViewEncapsulation.None,
-                }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; } });
-
 const MTNA_WF_ITEM_INJECTED_COMPONENTS = [
     // Boolean Item Component
     {
-        key: 'us.mtna.web.form.item.impl.BooleanItem',
+        key: BOOLEAN_ITEM_ID,
         component: MtnaWfBooleanComponent,
     },
     // Checkbox Item Component
     {
-        key: 'us.mtna.web.form.item.impl.CheckboxItem',
+        key: CHECKBOX_ITEM_ID,
         component: MtnaWfCheckboxComponent,
     },
     // Date Item Component
     {
-        key: 'us.mtna.web.form.item.impl.DateItem',
+        key: DATE_ITEM_ID,
         component: MtnaWfDateComponent,
     },
     // Date Range Item Component
     {
-        key: 'us.mtna.web.form.item.impl.date.OffsetDateRangeItem',
+        key: OFFSET_DATE_RANGE_ITEM_ID,
         component: MtnaWfDateRangeComponent,
     },
     // Dropdown Item Component
     {
-        key: 'us.mtna.web.form.item.impl.DropdownItem',
+        key: DROPDOWN_ITEM_ID,
         component: MtnaWfDropdownComponent,
     },
     // File Upload Item Component
     {
-        key: 'us.mtna.web.form.item.impl.FileUploadItem',
+        key: FILE_UPLOAD_ITEM_ID,
         component: MtnaWfFileUploadComponent,
     },
     // Form Item Group Component
     {
-        key: 'us.mtna.web.form.item.impl.FormItemGroupImpl',
+        key: FORM_ITEM_GROUP_IMPL_ID,
         component: MtnaWfFormGroupComponent,
     },
     // Form Section Component
     {
-        key: 'us.mtna.web.form.impl.SectionImpl',
+        key: SECTION_ID,
         component: MtnaWfFormSectionComponent,
     },
-    // Progressive Form Section Component
-    {
-        key: 'us.mtna.web.form.impl.ProgressiveFormSectionImpl',
-        component: MtnaWfProgressiveFormSectionComponent,
-    },
     // I18n Input Item Components
     {
-        key: 'us.mtna.web.form.item.impl.InternationalizedParagraphAnswerItem',
+        key: I18N_PARAGRAPH_ANSWER_ITEM_ID,
         component: MtnaWfI18nInputComponent,
     },
     {
-        key: 'us.mtna.web.form.item.impl.InternationalizedShortAnswerItem',
+        key: I18N_SHORT_ANSWER_ITEM_ID,
         component: MtnaWfI18nInputComponent,
     },
     // Input Item Components
     {
-        key: 'us.mtna.web.form.item.impl.DecimalAnswerItem',
+        key: DECIMAL_ANSWER_ITEM_ID,
         component: MtnaWfInputComponent,
     },
     {
-        key: 'us.mtna.web.form.item.impl.ParagraphAnswerItem',
+        key: PARAGRAPH_ANSWER_ITEM_ID,
         component: MtnaWfInputComponent,
     },
     {
-        key: 'us.mtna.web.form.item.impl.ShortAnswerItem',
+        key: SHORT_ANSWER_ITEM_ID,
         component: MtnaWfInputComponent,
     },
     {
-        key: 'us.mtna.web.form.item.impl.WholeNumberAnswerItem',
+        key: WHOLE_NUMBER_ANSWER_ITEM_ID,
         component: MtnaWfInputComponent,
     },
     // Mutliple Choice Item Component
     {
-        key: 'us.mtna.web.form.item.impl.MultipleChoiceItem',
+        key: MULTIPLE_CHOICE_ITEM_ID,
         component: MtnaWfMultipleChoiceComponent,
     },
     // Orderd List Item Component
     {
-        key: 'us.mtna.web.form.item.impl.NumberedListItem',
+        key: NUMBERED_LIST_ITEM_ID,
         component: MtnaWfOrderedListItemComponent,
     },
     // Repeatable Item Container Component
     {
-        key: 'us.mtna.web.form.item.RepeatableItem',
+        key: REPEATABLE_ITEM_ID,
         component: MtnaWfRepeatableItemContainerComponent,
     },
     // Resource Search Item Component
     {
-        key: 'us.mtna.web.form.item.impl.search.ResourceSearchItem',
+        key: RESOURCE_SEARCH_ITEM_ID,
         component: MtnaWfResourceSearchComponent,
     },
     // Table Item Component - NOTE: NOT USED
@@ -5555,17 +5576,17 @@ const MTNA_WF_ITEM_INJECTED_COMPONENTS = [
     // },
     // Text Item Component
     {
-        key: 'us.mtna.web.form.item.impl.TextItem',
+        key: TEXT_ITEM_ID,
         component: MtnaWfTextItemComponent,
     },
     // Title Item Component
     {
-        key: 'us.mtna.web.form.item.impl.TitleItem',
+        key: TITLE_ITEM_ID,
         component: MtnaWfTitleItemComponent,
     },
     // Unordered List Item Component
     {
-        key: 'us.mtna.web.form.item.impl.BulletedListItem',
+        key: BULLETED_LIST_ITEM_ID,
         component: MtnaWfUnorderedListItemComponent,
     },
     // Year Quarter Item Component
@@ -5575,7 +5596,7 @@ const MTNA_WF_ITEM_INJECTED_COMPONENTS = [
     },
     // Year Quarter Range Item Component
     {
-        key: 'us.mtna.web.form.item.impl.date.YearQuarterRangeItem',
+        key: YEAR_QUARTER_RANGE_ITEM_ID,
         component: MtnaWfYearQuarterRangeComponent,
     },
 ];
@@ -5836,8 +5857,8 @@ class MtnaWfProgressiveFormComponent extends MtnaWfBaseFormComponent {
         return formStep.instanceId;
     }
 }
-MtnaWfProgressiveFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfProgressiveFormComponent, deps: [{ token: MtnaWfManagerService }, { token: MtnaWfNgFormService }, { token: MtnaWfUIService }, { token: i0.ChangeDetectorRef }, { token: i4.MtnaScrollService }], target: i0.ɵɵFactoryTarget.Component });
-MtnaWfProgressiveFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfProgressiveFormComponent, selector: "mtna-wf-progressive-form", inputs: { loading: "loading" }, outputs: { status: "status", focusedSection: "focusedSection", mtnaFormChange: "mtnaFormChange", nextStepSelected: "nextStepSelected", previousStepSelected: "previousStepSelected", showSelectedStepId: "showSelectedStepId" }, usesInheritance: true, ngImport: i0, template: "<div fxLayout=\"row\" class=\"mtna-wf-progressive-form__container\">\n  <mtna-wf-stepper\n    *ngIf=\"stepArray$ | async as steps\"\n    fxFlex=\"200px\"\n    [steps]=\"steps\"\n    (selected)=\"showSelectedStep($event)\"\n  ></mtna-wf-stepper>\n  <div fxFlex class=\"mtna-wf-progressive-form__form-container\">\n    <form *ngIf=\"ngForm\" [formGroup]=\"ngForm\" [formDisabled]=\"readonly\">\n      <ng-container *ngFor=\"let item of mtnaForm?.items\">\n        <ng-container *ngIf=\"activeStepId$ | async as activeStepId\">\n          <mtna-wf-item\n            *ngIf=\"item.instanceId === activeStepId\"\n            [item]=\"item\"\n            [control]=\"ngForm.controls[item.instanceId]\"\n            [readonly]=\"readonly\"\n            [parentIds]=\"componentIds\"\n            [step]=\"_steps?.[item.instanceId]\"\n            (focusedSection)=\"focusedSection.emit($event)\"\n          ></mtna-wf-item>\n        </ng-container>\n      </ng-container>\n    </form>\n    <div *ngIf=\"!loading\" class=\"mtna-wf-progressive-form__stepper-actions\" fxLayout=\"row\" fxLayoutAlign=\"center center\" fxLayoutGap=\"26px\">\n      <button *ngIf=\"showPreviousButton\" mat-stroked-button color=\"primary\" (click)=\"showDirectionalStep('previous')\" i18n>\n        Previous Step\n      </button>\n      <ng-container *ngIf=\"!lastStepActive; else parentActions\">\n        <button mat-raised-button color=\"primary\" (click)=\"showDirectionalStep('next')\" i18n>Next Step</button>\n      </ng-container>\n    </div>\n  </div>\n</div>\n\n<ng-template #parentActions>\n  <ng-content></ng-content>\n</ng-template>\n", styles: ["mtna-wf-progressive-form{display:flex;flex:1}mtna-wf-progressive-form .mtna-wf-progressive-form__container{width:100%}mtna-wf-progressive-form mtna-wf-progressive-form-section mtna-wf-step-card{margin:24px}mtna-wf-progressive-form .mtna-wf-progressive-form__stepper-actions{margin:0 24px 24px}mtna-wf-progressive-form .mtna-wf-progressive-form__stepper-actions .mtna-wf-progressive-form__next-button{margin-left:auto}\n"], components: [{ type: MtnaWfFormStepperComponent, selector: "mtna-wf-stepper", inputs: ["color", "incompleteIcon", "steps"], outputs: ["selected"] }, { type: MtnaWfFormDisablerComponent, selector: "[formDisabled]", inputs: ["formDisabled"] }, { type: MtnaWfFormItemComponent, selector: "mtna-wf-item", inputs: ["color", "control", "header", "inList", "item", "parentIds", "readonly", "step"], outputs: ["focusedSection"] }, { type: i3$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i3$2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$2.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { type: i6.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i6.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3$2.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { type: i3$2.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }], pipes: { "async": i3.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+MtnaWfProgressiveFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfProgressiveFormComponent, deps: [{ token: MtnaWfManagerService }, { token: MtnaWfNgFormService }, { token: MtnaWfUIService }, { token: i0.ChangeDetectorRef }, { token: i1$1.MtnaScrollService }], target: i0.ɵɵFactoryTarget.Component });
+MtnaWfProgressiveFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MtnaWfProgressiveFormComponent, selector: "mtna-wf-progressive-form", inputs: { loading: "loading" }, outputs: { status: "status", focusedSection: "focusedSection", mtnaFormChange: "mtnaFormChange", nextStepSelected: "nextStepSelected", previousStepSelected: "previousStepSelected", showSelectedStepId: "showSelectedStepId" }, usesInheritance: true, ngImport: i0, template: "<div fxLayout=\"row\" class=\"mtna-wf-progressive-form__container\">\n  <mtna-wf-stepper\n    *ngIf=\"stepArray$ | async as steps\"\n    fxFlex=\"200px\"\n    [steps]=\"steps\"\n    (selected)=\"showSelectedStep($event)\"\n  ></mtna-wf-stepper>\n  <div fxFlex class=\"mtna-wf-progressive-form__form-container\">\n    <form *ngIf=\"ngForm\" [formGroup]=\"ngForm\" [formDisabled]=\"readonly\">\n      <ng-container *ngFor=\"let item of mtnaForm?.items | mtnaWfFilterHiddenItems\">\n        <ng-container *ngIf=\"activeStepId$ | async as activeStepId\">\n          <mtna-wf-item\n            *ngIf=\"item.instanceId === activeStepId\"\n            [item]=\"item\"\n            [control]=\"ngForm.controls[item.instanceId]\"\n            [readonly]=\"readonly\"\n            [parentIds]=\"componentIds\"\n            [step]=\"_steps?.[item.instanceId]\"\n            (focusedSection)=\"focusedSection.emit($event)\"\n          ></mtna-wf-item>\n        </ng-container>\n      </ng-container>\n    </form>\n    <div *ngIf=\"!loading\" class=\"mtna-wf-progressive-form__stepper-actions\" fxLayout=\"row\" fxLayoutAlign=\"center center\" fxLayoutGap=\"26px\">\n      <button *ngIf=\"showPreviousButton\" mat-stroked-button color=\"primary\" (click)=\"showDirectionalStep('previous')\" i18n>\n        Previous Step\n      </button>\n      <ng-container *ngIf=\"!lastStepActive; else parentActions\">\n        <button mat-raised-button color=\"primary\" (click)=\"showDirectionalStep('next')\" i18n>Next Step</button>\n      </ng-container>\n    </div>\n  </div>\n</div>\n\n<ng-template #parentActions>\n  <ng-content></ng-content>\n</ng-template>\n", styles: ["mtna-wf-progressive-form{display:flex;flex:1}mtna-wf-progressive-form .mtna-wf-progressive-form__container{width:100%}mtna-wf-progressive-form mtna-wf-section mtna-wf-step-card{margin:24px}mtna-wf-progressive-form .mtna-wf-progressive-form__stepper-actions{margin:0 24px 24px}mtna-wf-progressive-form .mtna-wf-progressive-form__stepper-actions .mtna-wf-progressive-form__next-button{margin-left:auto}\n"], components: [{ type: MtnaWfFormStepperComponent, selector: "mtna-wf-stepper", inputs: ["color", "incompleteIcon", "steps"], outputs: ["selected"] }, { type: MtnaWfFormDisablerComponent, selector: "[formDisabled]", inputs: ["formDisabled"] }, { type: MtnaWfFormItemComponent, selector: "mtna-wf-item", inputs: ["color", "control", "header", "inList", "item", "parentIds", "readonly", "step"], outputs: ["focusedSection"] }, { type: i3$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i3$2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$2.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { type: i6.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i6.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3$2.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { type: i3$2.DefaultLayoutGapDirective, selector: "  [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md],  [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md],  [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm],  [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }], pipes: { "async": i3.AsyncPipe, "mtnaWfFilterHiddenItems": MtnaWfFilterHiddenItemsPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfProgressiveFormComponent, decorators: [{
             type: Component,
             args: [{
@@ -5848,7 +5869,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                     encapsulation: ViewEncapsulation.None,
                     outputs: ['status', 'focusedSection', 'mtnaFormChange'],
                 }]
-        }], ctorParameters: function () { return [{ type: MtnaWfManagerService }, { type: MtnaWfNgFormService }, { type: MtnaWfUIService }, { type: i0.ChangeDetectorRef }, { type: i4.MtnaScrollService }]; }, propDecorators: { loading: [{
+        }], ctorParameters: function () { return [{ type: MtnaWfManagerService }, { type: MtnaWfNgFormService }, { type: MtnaWfUIService }, { type: i0.ChangeDetectorRef }, { type: i1$1.MtnaScrollService }]; }, propDecorators: { loading: [{
                 type: Input
             }], nextStepSelected: [{
                 type: Output
@@ -5858,48 +5879,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                 type: Output
             }] } });
 
-class MtnaWfProgressiveFormSectionModule {
-}
-MtnaWfProgressiveFormSectionModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfProgressiveFormSectionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-MtnaWfProgressiveFormSectionModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfProgressiveFormSectionModule, declarations: [MtnaWfProgressiveFormSectionComponent], imports: [CommonModule,
-        FlexLayoutModule,
-        MtnaWfStepCardModule,
-        MtnaHighlightModule,
-        MatDividerModule,
-        MtnaWfGetObjectTypePipeModule,
-        MtnaWfFormItemModule,
-        MatButtonModule,
-        MatIconModule], exports: [MtnaWfProgressiveFormSectionComponent] });
-MtnaWfProgressiveFormSectionModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfProgressiveFormSectionModule, imports: [[
-            CommonModule,
-            FlexLayoutModule,
-            MtnaWfStepCardModule,
-            MtnaHighlightModule,
-            MatDividerModule,
-            MtnaWfGetObjectTypePipeModule,
-            MtnaWfFormItemModule,
-            MatButtonModule,
-            MatIconModule,
-        ]] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfProgressiveFormSectionModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [
-                        CommonModule,
-                        FlexLayoutModule,
-                        MtnaWfStepCardModule,
-                        MtnaHighlightModule,
-                        MatDividerModule,
-                        MtnaWfGetObjectTypePipeModule,
-                        MtnaWfFormItemModule,
-                        MatButtonModule,
-                        MatIconModule,
-                    ],
-                    declarations: [MtnaWfProgressiveFormSectionComponent],
-                    exports: [MtnaWfProgressiveFormSectionComponent],
-                }]
-        }] });
-
 class MtnaWfProgressiveFormModule {
 }
 MtnaWfProgressiveFormModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfProgressiveFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
@@ -5911,11 +5890,12 @@ MtnaWfProgressiveFormModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0
         MatIconModule,
         MtnaWfFormDisablerModule,
         MtnaWfFormItemModule,
-        MtnaWfProgressiveFormSectionModule,
         ReactiveFormsModule,
+        MtnaWfFilterHiddenItemsPipeModule,
         MtnaWfFormStepperModule,
         GetProgressiveFormItemPipeModule,
-        GetActiveFormStepItemPipeModule], exports: [MtnaWfProgressiveFormComponent] });
+        GetActiveFormStepItemPipeModule,
+        MtnaWfFilterHiddenItemsPipeModule], exports: [MtnaWfProgressiveFormComponent] });
 MtnaWfProgressiveFormModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfProgressiveFormModule, imports: [[
             A11yModule,
             CommonModule,
@@ -5925,11 +5905,12 @@ MtnaWfProgressiveFormModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0
             MatIconModule,
             MtnaWfFormDisablerModule,
             MtnaWfFormItemModule,
-            MtnaWfProgressiveFormSectionModule,
             ReactiveFormsModule,
+            MtnaWfFilterHiddenItemsPipeModule,
             MtnaWfFormStepperModule,
             GetProgressiveFormItemPipeModule,
             GetActiveFormStepItemPipeModule,
+            MtnaWfFilterHiddenItemsPipeModule,
         ]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MtnaWfProgressiveFormModule, decorators: [{
             type: NgModule,
@@ -5943,11 +5924,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                         MatIconModule,
                         MtnaWfFormDisablerModule,
                         MtnaWfFormItemModule,
-                        MtnaWfProgressiveFormSectionModule,
                         ReactiveFormsModule,
+                        MtnaWfFilterHiddenItemsPipeModule,
                         MtnaWfFormStepperModule,
                         GetProgressiveFormItemPipeModule,
                         GetActiveFormStepItemPipeModule,
+                        MtnaWfFilterHiddenItemsPipeModule,
                     ],
                     declarations: [MtnaWfProgressiveFormComponent],
                     exports: [MtnaWfProgressiveFormComponent],
@@ -5958,5 +5940,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { BaseFormStep, COMPLEX_STANDARD, ChildStepActivePipe, ChildStepActivePipeModule, CoerceFormStepGroupPipe, CoerceFormStepGroupPipeModule, CoerceFormStepPipe, CoerceFormStepPipeModule, DEFAULT_ERROR_MESSAGES, FormStep, FormStepGroup, GetActiveFormStepItemPipe, GetActiveFormStepItemPipeModule, GetProgressiveFormItemPipe, GetProgressiveFormItemPipeModule, GetStepAriaLabel, GetStepAriaLabelModule, MTNA_WF_API_TOKEN, MTNA_WF_DEFAULT_YEAR_RANGE, MTNA_WF_EXPAND_COLLAPSE, MTNA_WF_FORM_ITEM_VALIDATION_RESULT_ERROR_NAME, MTNA_WF_ITEM_INJECTED_COMPONENTS, MTNA_WF_ITEM_WHITELIST, MTNA_WF_ITEM_WHITELIST_FACTORY, MtnaFormModule, MtnaWfAcknowledgeDialogComponent, MtnaWfAcknowledgeDialogModule, MtnaWfApiService, MtnaWfBaseFormItemControl, MtnaWfBaseGroupItem, MtnaWfBaseParentValueItem, MtnaWfBaseSectionItem, MtnaWfBaseSingleSelectionParentValueItem, MtnaWfBaseValueItem, MtnaWfBooleanComponent, MtnaWfBooleanModule, MtnaWfCheckboxComponent, MtnaWfCheckboxModule, MtnaWfCoerceDateItemPipe, MtnaWfCoerceDateItemPipeModule, MtnaWfCoerceFormControlPipe, MtnaWfCoerceFormControlPipeModule, MtnaWfCoerceFormGroupPipe, MtnaWfCoerceFormGroupPipeModule, MtnaWfCoerceFormItemPipe, MtnaWfCoerceFormItemPipeModule, MtnaWfDateComponent, MtnaWfDateModule, MtnaWfDateQuarterPipe, MtnaWfDateQuarterPipeModule, MtnaWfDateRangeComponent, MtnaWfDateRangeModule, MtnaWfDialogService, MtnaWfDropdownComponent, MtnaWfDropdownModule, MtnaWfFileUploadComponent, MtnaWfFileUploadModule, MtnaWfFormComponent, MtnaWfFormDisablerComponent, MtnaWfFormDisablerModule, MtnaWfFormGroupComponent, MtnaWfFormGroupModule, MtnaWfFormItemComponent, MtnaWfFormItemDialogComponent, MtnaWfFormItemDialogData, MtnaWfFormItemDialogModule, MtnaWfFormItemModule, MtnaWfFormSectionComponent, MtnaWfFormSectionModule, MtnaWfFormStepComponent, MtnaWfFormStepGroupComponent, MtnaWfFormStepGroupPipe, MtnaWfFormStepGroupPipeModule, MtnaWfFormStepperComponent, MtnaWfFormStepperModule, MtnaWfGetAutoCompletePipe, MtnaWfGetAutoCompletePipeModule, MtnaWfGetAvailableQuartersPipe, MtnaWfGetAvailableQuartersPipeModule, MtnaWfGetFormControlErrorPipe, MtnaWfGetFormControlErrorPipeModule, MtnaWfGetListIconPipe, MtnaWfGetListIconPipeModule, MtnaWfGetObjectTypePipe, MtnaWfGetObjectTypePipeModule, MtnaWfGetSelectedOptionNamePipe, MtnaWfGetSelectedOptionNamePipeModule, MtnaWfI18nInputComponent, MtnaWfI18nInputModule, MtnaWfInputComponent, MtnaWfInputModule, MtnaWfInstantValidationResultErrorStateMatcher, MtnaWfItemComponentProvider, MtnaWfItemHeaderComponent, MtnaWfItemHeaderModule, MtnaWfItemInjector, MtnaWfItemInjectorModule, MtnaWfItemsWithValuePipe, MtnaWfItemsWithValuePipeModule, MtnaWfManagerService, MtnaWfMultipleChoiceComponent, MtnaWfMultipleChoiceModule, MtnaWfNgFormService, MtnaWfOrderedListItemComponent, MtnaWfOrderedListItemModule, MtnaWfProgressiveFormComponent, MtnaWfProgressiveFormModule, MtnaWfProgressiveFormSectionComponent, MtnaWfProgressiveFormSectionModule, MtnaWfRepeatableItemComponent, MtnaWfRepeatableItemContainerComponent, MtnaWfRepeatableItemContainerModule, MtnaWfRepeatableItemModule, MtnaWfResourceSearchComponent, MtnaWfResourceSearchModule, MtnaWfResourceSearchSelectionService, MtnaWfSanitizeHtmlPipe, MtnaWfSanitizeHtmlPipeModule, serializerUtil as MtnaWfSerializer, MtnaWfStepCardComponent, MtnaWfStepCardModule, MtnaWfTableFormItemComponent, MtnaWfTableFormItemModule, MtnaWfTextItemComponent, MtnaWfTextItemModule, MtnaWfTitleItemComponent, MtnaWfTitleItemModule, MtnaWfUIService, MtnaWfUnorderedListItemComponent, MtnaWfUnorderedListItemModule, MtnaWfYearQuarterComponent, MtnaWfYearQuarterModule, MtnaWfYearQuarterRangeComponent, MtnaWfYearQuarterRangeModule, PROGRESSIVE_FORM_ID, PROGRESSIVE_FORM_SECTION_ID, WEB_FORM_CUSTOM_ERRORS, everyStepStatus, findFormControl, findFormItem, flattenSteps, generateFormSteps, generateFormStepsFromOutline, getItemClassSuffix, instanceOfFormStep, instanceOfFormStepGroup, isFormControl, isFormGroup, isFormStepGroup, isProgressiveForm, isProgressiveFormSection, updateStepStatus, validationResultValidator };
+export { BaseFormStep, COMPLEX_STANDARD, ChildStepActivePipe, ChildStepActivePipeModule, CoerceFormStepGroupPipe, CoerceFormStepGroupPipeModule, CoerceFormStepPipe, CoerceFormStepPipeModule, DEFAULT_ERROR_MESSAGES, FormStep, FormStepGroup, GetActiveFormStepItemPipe, GetActiveFormStepItemPipeModule, GetProgressiveFormItemPipe, GetProgressiveFormItemPipeModule, GetStepAriaLabel, GetStepAriaLabelModule, MTNA_WF_API_TOKEN, MTNA_WF_DEFAULT_YEAR_RANGE, MTNA_WF_EXPAND_COLLAPSE, MTNA_WF_FORM_ITEM_VALIDATION_RESULT_ERROR_NAME, MTNA_WF_ITEM_INJECTED_COMPONENTS, MTNA_WF_ITEM_WHITELIST, MTNA_WF_ITEM_WHITELIST_FACTORY, MtnaFormModule, MtnaWfAcknowledgeDialogComponent, MtnaWfAcknowledgeDialogModule, MtnaWfApiService, MtnaWfBaseFormItemControl, MtnaWfBaseGroupItem, MtnaWfBaseParentValueItem, MtnaWfBaseSectionItem, MtnaWfBaseSingleSelectionParentValueItem, MtnaWfBaseValueItem, MtnaWfBooleanComponent, MtnaWfBooleanModule, MtnaWfCheckboxComponent, MtnaWfCheckboxModule, MtnaWfCoerceDateItemPipe, MtnaWfCoerceDateItemPipeModule, MtnaWfCoerceFormControlPipe, MtnaWfCoerceFormControlPipeModule, MtnaWfCoerceFormGroupPipe, MtnaWfCoerceFormGroupPipeModule, MtnaWfCoerceFormItemPipe, MtnaWfCoerceFormItemPipeModule, MtnaWfDateComponent, MtnaWfDateModule, MtnaWfDateQuarterPipe, MtnaWfDateQuarterPipeModule, MtnaWfDateRangeComponent, MtnaWfDateRangeModule, MtnaWfDialogService, MtnaWfDropdownComponent, MtnaWfDropdownModule, MtnaWfFileUploadComponent, MtnaWfFileUploadModule, MtnaWfFilterHiddenItemsPipe, MtnaWfFilterHiddenItemsPipeModule, MtnaWfFormComponent, MtnaWfFormDisablerComponent, MtnaWfFormDisablerModule, MtnaWfFormGroupComponent, MtnaWfFormGroupModule, MtnaWfFormItemComponent, MtnaWfFormItemDialogComponent, MtnaWfFormItemDialogData, MtnaWfFormItemDialogModule, MtnaWfFormItemModule, MtnaWfFormSectionComponent, MtnaWfFormSectionModule, MtnaWfFormStepComponent, MtnaWfFormStepGroupComponent, MtnaWfFormStepGroupPipe, MtnaWfFormStepGroupPipeModule, MtnaWfFormStepperComponent, MtnaWfFormStepperModule, MtnaWfGetAutoCompletePipe, MtnaWfGetAutoCompletePipeModule, MtnaWfGetAvailableQuartersPipe, MtnaWfGetAvailableQuartersPipeModule, MtnaWfGetFormControlErrorPipe, MtnaWfGetFormControlErrorPipeModule, MtnaWfGetListIconPipe, MtnaWfGetListIconPipeModule, MtnaWfGetObjectTypePipe, MtnaWfGetObjectTypePipeModule, MtnaWfGetSelectedOptionNamePipe, MtnaWfGetSelectedOptionNamePipeModule, MtnaWfI18nInputComponent, MtnaWfI18nInputModule, MtnaWfInputComponent, MtnaWfInputModule, MtnaWfInstantValidationResultErrorStateMatcher, MtnaWfItemComponentProvider, MtnaWfItemHeaderComponent, MtnaWfItemHeaderModule, MtnaWfItemInjector, MtnaWfItemInjectorModule, MtnaWfItemsWithValuePipe, MtnaWfItemsWithValuePipeModule, MtnaWfManagerService, MtnaWfMultipleChoiceComponent, MtnaWfMultipleChoiceModule, MtnaWfNgFormService, MtnaWfOrderedListItemComponent, MtnaWfOrderedListItemModule, MtnaWfProgressiveFormComponent, MtnaWfProgressiveFormModule, MtnaWfRepeatableItemComponent, MtnaWfRepeatableItemContainerComponent, MtnaWfRepeatableItemContainerModule, MtnaWfRepeatableItemModule, MtnaWfResourceSearchComponent, MtnaWfResourceSearchModule, MtnaWfResourceSearchSelectionService, MtnaWfSanitizeHtmlPipe, MtnaWfSanitizeHtmlPipeModule, serializerUtil as MtnaWfSerializer, MtnaWfStepCardComponent, MtnaWfStepCardModule, MtnaWfTableFormItemComponent, MtnaWfTableFormItemModule, MtnaWfTextItemComponent, MtnaWfTextItemModule, MtnaWfTitleItemComponent, MtnaWfTitleItemModule, MtnaWfUIService, MtnaWfUnorderedListItemComponent, MtnaWfUnorderedListItemModule, MtnaWfYearQuarterComponent, MtnaWfYearQuarterModule, MtnaWfYearQuarterRangeComponent, MtnaWfYearQuarterRangeModule, WEB_FORM_CUSTOM_ERRORS, everyStepStatus, findFormControl, findFormItem, flattenSteps, generateFormSteps, generateFormStepsFromOutline, getItemClassSuffix, instanceOfFormStep, instanceOfFormStepGroup, isFormControl, isFormGroup, isFormStepGroup, updateStepStatus, validationResultValidator };
 //# sourceMappingURL=mtna-web-form-angular.js.map