novo-elements 7.6.0 → 7.7.0-next.2

package/fesm2015/novo-elements.mjs

@@ -1,6 +1,6 @@
 import * as i0 from '@angular/core';
 import { TemplateRef, forwardRef, EventEmitter, Component, Input, Output, NgModule, Pipe, Injectable, ChangeDetectionStrategy, HostBinding, Directive, HostListener, LOCALE_ID, Inject, ViewChildren, InjectionToken, Injector, isDevMode, Optional, ContentChild, ViewEncapsulation, ContentChildren, Host, ViewChild, ViewContainerRef, SkipSelf, Attribute, Self, QueryList, ElementRef, PLATFORM_ID } from '@angular/core';
-import * as i5 from '@angular/forms';
+import * as i4 from '@angular/forms';
 import { NG_VALUE_ACCESSOR, Validators, FormControl, FormGroup, FormsModule, COMPOSITION_BUFFER_MODE, ReactiveFormsModule } from '@angular/forms';
 import 'brace/index';
 import 'brace/mode/javascript';
@@ -49,7 +49,7 @@ import { CdkHeaderCell, CdkCell, DataSource, CdkHeaderRow, CDK_ROW_TEMPLATE, Cdk
 import { createAutoCorrectedDatePipe } from 'text-mask-addons';
 import dragula from '@bullhorn/dragula';
 import { CdkAccordion, CdkAccordionItem, CdkAccordionModule } from '@angular/cdk/accordion';
-import * as i4 from '@angular/common/http';
+import * as i4$1 from '@angular/common/http';
 import { HttpClientModule } from '@angular/common/http';
 import { DragDropModule } from '@angular/cdk/drag-drop';
 import * as i1$a from '@angular/cdk/stepper';
@@ -23697,6 +23697,7 @@ class NovoLabelService {
         this.after = 'After';
         this.between = 'Between';
         this.within = 'Within';
+        this.isEmpty = 'Is Empty?';
         this.refreshPagination = 'Refresh Pagination';
     }
     maxlengthMetWithField(field, maxlength) {
@@ -29154,7 +29155,7 @@ GroupedMultiPickerResults.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
         </div>
       </div>
     </div>
-  `, isInline: true, components: [{ type: NovoListElement, selector: "novo-list", inputs: ["theme", "direction"] }, { type: NovoListItemElement, selector: "novo-list-item, a[list-item], button[list-item]" }, { type: NovoItemContentElement, selector: "item-content, novo-item-content", inputs: ["direction"] }, { type: NovoItemEndElement, selector: "item-end, novo-item-end" }, { type: NovoSwitchElement, selector: "novo-switch", inputs: ["theme", "icons", "disabled"], outputs: ["onChange"] }, { type: NovoLoadingElement, selector: "novo-loading", inputs: ["theme", "color", "size"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: ThemeColorDirective, selector: "[theme]", inputs: ["theme"] }] });
+  `, isInline: true, components: [{ type: NovoListElement, selector: "novo-list", inputs: ["theme", "direction"] }, { type: NovoListItemElement, selector: "novo-list-item, a[list-item], button[list-item]" }, { type: NovoItemContentElement, selector: "item-content, novo-item-content", inputs: ["direction"] }, { type: NovoItemEndElement, selector: "item-end, novo-item-end" }, { type: NovoSwitchElement, selector: "novo-switch", inputs: ["theme", "icons", "disabled"], outputs: ["onChange"] }, { type: NovoLoadingElement, selector: "novo-loading", inputs: ["theme", "color", "size"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i4.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: ThemeColorDirective, selector: "[theme]", inputs: ["theme"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GroupedMultiPickerResults, decorators: [{
             type: Component,
             args: [{
@@ -29469,7 +29470,7 @@ MixedMultiPickerResults.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0"
           <novo-loading theme="line"></novo-loading>
         </div>
       </div>
-    </div>`, isInline: true, components: [{ type: NovoListElement, selector: "novo-list", inputs: ["theme", "direction"] }, { type: NovoListItemElement, selector: "novo-list-item, a[list-item], button[list-item]" }, { type: NovoItemContentElement, selector: "item-content, novo-item-content", inputs: ["direction"] }, { type: NovoItemEndElement, selector: "item-end, novo-item-end" }, { type: NovoLoadingElement, selector: "novo-loading", inputs: ["theme", "color", "size"] }], directives: [{ type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: ThemeColorDirective, selector: "[theme]", inputs: ["theme"] }] });
+    </div>`, isInline: true, components: [{ type: NovoListElement, selector: "novo-list", inputs: ["theme", "direction"] }, { type: NovoListItemElement, selector: "novo-list-item, a[list-item], button[list-item]" }, { type: NovoItemContentElement, selector: "item-content, novo-item-content", inputs: ["direction"] }, { type: NovoItemEndElement, selector: "item-end, novo-item-end" }, { type: NovoLoadingElement, selector: "novo-loading", inputs: ["theme", "color", "size"] }], directives: [{ type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: ThemeColorDirective, selector: "[theme]", inputs: ["theme"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: MixedMultiPickerResults, decorators: [{
             type: Component,
             args: [{
@@ -30117,7 +30118,7 @@ NovoPickerElement.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", vers
       <span #results></span>
       <ng-content></ng-content>
     </novo-overlay-template>
-  `, isInline: true, components: [{ type: NovoOverlayTemplateComponent, selector: "novo-overlay-template", inputs: ["position", "scrollStrategy", "width", "height", "closeOnSelect", "hasBackdrop", "parent"], outputs: ["select", "opening", "closing"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
+  `, isInline: true, components: [{ type: NovoOverlayTemplateComponent, selector: "novo-overlay-template", inputs: ["position", "scrollStrategy", "width", "height", "closeOnSelect", "hasBackdrop", "parent"], outputs: ["select", "opening", "closing"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoPickerElement, decorators: [{
             type: Component,
             args: [{
@@ -32256,7 +32257,7 @@ NovoCheckListElement.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
         <span>{{ option.label }}</span>
       </label>
     </div>
-  `, isInline: true, styles: [":host{display:flex;flex-flow:row wrap;gap:1rem}:host.hasLabel [class*=-group]{margin-right:15px}:host .novo-checkbox-group{cursor:pointer;position:relative}:host .novo-checkbox-group:hover label i:before{box-shadow:0 0 15px 3px #4a89dc40}:host .novo-checkbox-group:hover label i.bhi-checkbox-empty,:host .novo-checkbox-group:hover label i.bhi-radio-empty{color:#4a89dc}:host .novo-checkbox-group.checked label{color:var(--text-main)}:host .novo-checkbox-group.checked label i{-webkit-animation:iconEnter .16s ease-in-out;animation:iconEnter .16s ease-in-out}:host .novo-checkbox-group.disabled{pointer-events:none}:host .novo-checkbox-group.disabled label>i{opacity:.7}:host .novo-checkbox-group input[type=checkbox]{-webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important;height:0!important;border:none!important;position:absolute}:host .novo-checkbox-group input[type=checkbox]:focus+label i:before{text-shadow:0px 0px 20px rgba(74,137,220,.5)}:host .novo-checkbox-group input[type=checkbox]:focus+label i.bhi-checkbox-empty,:host .novo-checkbox-group input[type=checkbox]:focus+label i.bhi-checkbox-filled{color:#4a89dc}:host .novo-checkbox-group label{color:#868686;margin-left:0;cursor:pointer;transition:all .2s ease-in-out;display:flex;align-items:baseline}:host .novo-checkbox-group label i{margin-right:5px;transition:all .2s ease-in-out}:host .novo-checkbox-group label i.bhi-checkbox-empty,:host .novo-checkbox-group label i.bhi-radio-empty,:host .novo-checkbox-group label i.bhi-circle-o{color:#d2d2d2}:host .novo-checkbox-group label i.bhi-check{background:#d2d2d2;color:#fff;padding:.15em 0 0 .3em;font-size:1em;width:20px;height:20px;border-radius:50%}:host .novo-checkbox-group label i.bhi-checkbox-filled,:host .novo-checkbox-group label i.bhi-radio-filled{color:#4a89dc}:host .novo-checkbox-group label span{display:inline-block}\n"], directives: [{ type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
+  `, isInline: true, styles: [":host{display:flex;flex-flow:row wrap;gap:1rem}:host.hasLabel [class*=-group]{margin-right:15px}:host .novo-checkbox-group{cursor:pointer;position:relative}:host .novo-checkbox-group:hover label i:before{box-shadow:0 0 15px 3px #4a89dc40}:host .novo-checkbox-group:hover label i.bhi-checkbox-empty,:host .novo-checkbox-group:hover label i.bhi-radio-empty{color:#4a89dc}:host .novo-checkbox-group.checked label{color:var(--text-main)}:host .novo-checkbox-group.checked label i{-webkit-animation:iconEnter .16s ease-in-out;animation:iconEnter .16s ease-in-out}:host .novo-checkbox-group.disabled{pointer-events:none}:host .novo-checkbox-group.disabled label>i{opacity:.7}:host .novo-checkbox-group input[type=checkbox]{-webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important;height:0!important;border:none!important;position:absolute}:host .novo-checkbox-group input[type=checkbox]:focus+label i:before{text-shadow:0px 0px 20px rgba(74,137,220,.5)}:host .novo-checkbox-group input[type=checkbox]:focus+label i.bhi-checkbox-empty,:host .novo-checkbox-group input[type=checkbox]:focus+label i.bhi-checkbox-filled{color:#4a89dc}:host .novo-checkbox-group label{color:#868686;margin-left:0;cursor:pointer;transition:all .2s ease-in-out;display:flex;align-items:baseline}:host .novo-checkbox-group label i{margin-right:5px;transition:all .2s ease-in-out}:host .novo-checkbox-group label i.bhi-checkbox-empty,:host .novo-checkbox-group label i.bhi-radio-empty,:host .novo-checkbox-group label i.bhi-circle-o{color:#d2d2d2}:host .novo-checkbox-group label i.bhi-check{background:#d2d2d2;color:#fff;padding:.15em 0 0 .3em;font-size:1em;width:20px;height:20px;border-radius:50%}:host .novo-checkbox-group label i.bhi-checkbox-filled,:host .novo-checkbox-group label i.bhi-radio-filled{color:#4a89dc}:host .novo-checkbox-group label span{display:inline-block}\n"], directives: [{ type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoCheckListElement, decorators: [{
             type: Component,
             args: [{ selector: 'novo-check-list', providers: [CHECKLIST_VALUE_ACCESSOR], template: `
@@ -32756,6 +32757,7 @@ class NovoFieldElement {
         return this._inputContainerRef || this._elementRef;
     }
     ngAfterContentInit() {
+        var _a;
         this._validateControlChild();
         const control = this._control;
         if (control.controlType) {
@@ -32765,6 +32767,9 @@ class NovoFieldElement {
         if (control.id) {
             this._elementRef.nativeElement.setAttribute('data-control-id', control.id);
         }
+        if ((_a = control.ngControl) === null || _a === void 0 ? void 0 : _a.name) {
+            this._elementRef.nativeElement.setAttribute('data-control-key', control.ngControl.name);
+        }
         // Subscribe to changes in the child control state in order to update the form field UI.
         // tslint:disable-next-line:deprecation
         control.stateChanges.pipe(startWith(null)).subscribe(() => {
@@ -33512,6 +33517,253 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                 type: Input
             }] } });
 
+const DATETIMEFORMAT_VALUE_ACCESSOR = {
+    provide: NG_VALUE_ACCESSOR,
+    useExisting: forwardRef(() => NovoDateTimeFormatDirective),
+    multi: true,
+};
+class NovoDateTimeFormatDirective extends IMaskDirective {
+    constructor(_element, _renderer, _factory, _compositionMode, labels) {
+        super(_element, _renderer, _factory, _compositionMode);
+        this._element = _element;
+        this.labels = labels;
+        this.valueChange = new EventEmitter();
+        this.military = false;
+        this.dateTimeFormat = DATE_FORMATS.DATE;
+        this.initFormatOptions();
+    }
+    initFormatOptions() {
+        const amFormat = this.labels.timeFormatAM.toUpperCase();
+        const pmFormat = this.labels.timeFormatPM.toUpperCase();
+        this.unmask = 'typed';
+        this.imask = {
+            mask: Date,
+            pattern: this.military ? 'm{/}`d{/}`Y, HH:mm' : 'm{/}`d{/}`Y, HH:mm aa',
+            overwrite: true,
+            autofix: true,
+            lazy: false,
+            min: new Date(1900, 0, 1),
+            max: new Date(2030, 0, 1),
+            prepare: (str) => str.toUpperCase(),
+            format: (date) => {
+                const test1 = this.formatValue(date);
+                return test1;
+            },
+            parse: (str) => {
+                const test = parse(str);
+                return test;
+            },
+            blocks: {
+                d: {
+                    mask: IMask.MaskedRange,
+                    placeholderChar: 'D',
+                    from: 1,
+                    to: 31,
+                    maxLength: 2,
+                },
+                m: {
+                    mask: IMask.MaskedRange,
+                    placeholderChar: 'M',
+                    from: 1,
+                    to: 12,
+                    maxLength: 2,
+                },
+                Y: {
+                    mask: IMask.MaskedRange,
+                    placeholderChar: 'Y',
+                    from: 1900,
+                    to: 9999,
+                },
+                HH: {
+                    mask: IMask.MaskedRange,
+                    placeholderChar: '-',
+                    maxLength: 2,
+                    from: 0,
+                    to: 23,
+                },
+                hh: {
+                    mask: IMask.MaskedRange,
+                    placeholderChar: '-',
+                    maxLength: 2,
+                    from: 1,
+                    to: 12,
+                },
+                mm: {
+                    mask: IMask.MaskedRange,
+                    placeholderChar: '-',
+                    maxLength: 2,
+                    from: 0,
+                    to: 59,
+                },
+                ss: {
+                    mask: IMask.MaskedRange,
+                    placeholderChar: '-',
+                    maxLength: 2,
+                    from: 0,
+                    to: 59,
+                },
+                aa: {
+                    mask: IMask.MaskedEnum,
+                    placeholderChar: '-',
+                    enum: ['AM', 'PM', 'am', 'pm', amFormat, pmFormat],
+                },
+            },
+        };
+    }
+    ngOnChanges(changes) {
+        if (Object.keys(changes).some((key) => ['military', 'dateFormat'].includes(key))) {
+            this.initFormatOptions();
+        }
+    }
+    _checkInput(event) {
+        if (document.activeElement === event.target) {
+            const text = event.target.value;
+            const dateTime = text.split(', ');
+            const hour = dateTime[1].slice(0, 2);
+            if ((this.military && Number(dateTime[1][0]) > 2) || (!this.military && Number(dateTime[1][0]) > 1)) {
+                event.preventDefault();
+                const value = `0${dateTime[1]}`;
+                event.target.value = value;
+                // this.onChange(value);
+            }
+            if (!this.military) {
+                const input = dateTime[1].substr(5, 4).replace(/\-/g, '').trim().slice(0, 2);
+                const timePeriod = this.imask.blocks.aa.enum.find((it) => it[0] === input[0]);
+                if (timePeriod) {
+                    event.target.value = `${dateTime[0]}, ${dateTime[1].slice(0, 5)} ${timePeriod}`;
+                }
+                if (event.target.selectionStart >= 3 && this.hourOneFormatRequired(hour)) {
+                    event.target.value = `${dateTime[0]}, 01:${event.target.value.slice(3, event.target.value.length)}`;
+                }
+            }
+        }
+    }
+    _handleBlur(event) {
+        const text = event.target.value;
+        const dateTime = text.split(', ');
+        const hour = dateTime[1].slice(0, 2);
+        if (!this.military) {
+            const input = dateTime[1].substr(17, 4).replace(/\-/g, '').trim().slice(0, 2);
+            const timePeriod = this.imask.blocks.aa.enum.find((it) => it[0] === input[0]);
+            if (this.hourOneFormatRequired(hour)) {
+                event.target.value = `${dateTime[0]}, 01:${dateTime[1].slice(3, dateTime[1].length)}`;
+            }
+            if (!timePeriod) {
+                event.target.value = `${dateTime[0]}, ${dateTime[1].slice(0, 5)} --`;
+            }
+        }
+    }
+    _handleKeydown(event) {
+        const input = event.target;
+        const dateTime = input.value.split(', ');
+        const hour = dateTime[1].slice(0, 2);
+        if (event.key === "Backspace" /* Backspace */ && input.selectionStart === dateTime[1].length) {
+            event.target.value = `${dateTime[1].slice(0, 5)} --`;
+        }
+        else if (event.key === "Tab" /* Tab */ && input.selectionStart <= 2 && this.hourOneFormatRequired(hour)) {
+            event.preventDefault();
+            event.stopPropagation();
+            event.stopImmediatePropagation();
+            input.value = `${dateTime[0]}, 01:${dateTime[1].slice(3, dateTime[1].length)}`;
+            input.setSelectionRange(15, 15);
+        }
+        else if (event.key === "ArrowRight" /* ArrowRight */ && input.selectionStart >= 2 && this.hourOneFormatRequired(hour)) {
+            input.value = `${dateTime[0]}, 01:${dateTime[1].slice(3, dateTime[1].length)}`;
+            input.setSelectionRange(14, 14);
+        }
+    }
+    normalize(value) {
+        const pattern = this.labels.dateFormat.toUpperCase();
+        return format(parse(value), pattern);
+    }
+    formatAsIso(date) {
+        if (date && isValid(date)) {
+            return date.toISOString();
+        }
+        return null;
+    }
+    convertTime12to24(time12h) {
+        const pmFormat = this.labels.timeFormatPM.toUpperCase();
+        const [time, meridian] = time12h.split(' ');
+        let [hours, minutes] = time.split(':');
+        if (hours === '12') {
+            hours = '00';
+        }
+        if (['PM', pmFormat].includes(meridian)) {
+            hours = `${parseInt(hours, 10) + 12}`.padStart(2, '0');
+        }
+        return `${hours}:${minutes}`;
+    }
+    convertTime24to12(time24h) {
+        if (time24h.length === 5) {
+            const date = parse(`2020-01-01T${time24h}`);
+            return format(date, 'hh:mm A');
+        }
+        return time24h;
+    }
+    formatValue(value) {
+        if (value == null)
+            return '';
+        // Use `parse` because it keeps dates in locale
+        const date = parse(value);
+        if (isValid(date)) {
+            const dateFormat = `${this.labels.dateFormat.toUpperCase()}, ${this.military ? 'HH:mm' : 'hh:mm A'}`;
+            return format(date, dateFormat);
+        }
+        return this.normalize(value);
+    }
+    writeValue(value) {
+        super.writeValue(this.formatValue(value));
+    }
+    registerOnChange(fn) {
+        this.onChange = (date) => {
+            let formatted = date;
+            switch (this.dateTimeFormat) {
+                case DATE_FORMATS.ISO8601:
+                    formatted = this.formatAsIso(date);
+                    break;
+                case DATE_FORMATS.STRING:
+                    formatted = this.formatValue(date);
+                    break;
+                default:
+                    formatted = date;
+                    break;
+            }
+            this.valueChange.emit(date);
+            fn(formatted);
+        };
+    }
+    hourOneFormatRequired(hourInput) {
+        return hourInput === '-1' || hourInput === '1-';
+    }
+}
+NovoDateTimeFormatDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoDateTimeFormatDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1$7.IMaskFactory }, { token: COMPOSITION_BUFFER_MODE, optional: true }, { token: NovoLabelService }], target: i0.ɵɵFactoryTarget.Directive });
+NovoDateTimeFormatDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.11", type: NovoDateTimeFormatDirective, selector: "input[dateTimeFormat]", inputs: { military: "military", dateTimeFormat: "dateTimeFormat" }, host: { listeners: { "input": "_checkInput($event)", "blur": "_handleBlur($event)", "keydown": "_handleKeydown($event)" }, classAttribute: "novo-date-time-format" }, providers: [DATETIMEFORMAT_VALUE_ACCESSOR, { provide: NOVO_INPUT_FORMAT, useExisting: NovoDateTimeFormatDirective }], usesInheritance: true, usesOnChanges: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoDateTimeFormatDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'input[dateTimeFormat]',
+                    host: {
+                        class: 'novo-date-time-format',
+                        '(input)': '_checkInput($event)',
+                        '(blur)': '_handleBlur($event)',
+                        '(keydown)': '_handleKeydown($event)',
+                    },
+                    providers: [DATETIMEFORMAT_VALUE_ACCESSOR, { provide: NOVO_INPUT_FORMAT, useExisting: NovoDateTimeFormatDirective }],
+                }]
+        }], ctorParameters: function () {
+        return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1$7.IMaskFactory }, { type: undefined, decorators: [{
+                        type: Optional
+                    }, {
+                        type: Inject,
+                        args: [COMPOSITION_BUFFER_MODE]
+                    }] }, { type: NovoLabelService }];
+    }, propDecorators: { military: [{
+                type: Input
+            }], dateTimeFormat: [{
+                type: Input
+            }] } });
+
 const TIMEFORMAT_VALUE_ACCESSOR = {
     provide: NG_VALUE_ACCESSOR,
     useExisting: forwardRef(() => NovoTimeFormatDirective),
@@ -34033,7 +34285,7 @@ class NovoInput extends NovoInputBase {
         }
     }
 }
-NovoInput.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoInput, deps: [{ token: i0.ElementRef }, { token: i1$6.Platform }, { token: i5.NgControl, optional: true, self: true }, { token: i5.NgForm, optional: true }, { token: i5.FormGroupDirective, optional: true }, { token: NOVO_INPUT_VALUE_ACCESSOR, optional: true, self: true }, { token: i3.AutofillMonitor }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
+NovoInput.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoInput, deps: [{ token: i0.ElementRef }, { token: i1$6.Platform }, { token: i4.NgControl, optional: true, self: true }, { token: i4.NgForm, optional: true }, { token: i4.FormGroupDirective, optional: true }, { token: NOVO_INPUT_VALUE_ACCESSOR, optional: true, self: true }, { token: i3.AutofillMonitor }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Directive });
 NovoInput.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.11", type: NovoInput, selector: "input[novoInput], textarea[novoInput], select[novoInput]", inputs: { disabled: "disabled", id: "id", placeholder: "placeholder", required: "required", type: "type", value: "value", readonly: "readonly" }, host: { listeners: { "focus": "_focusChanged(true)", "blur": "_focusChanged(false)", "input": "_onInput($event)" }, properties: { "attr.id": "id", "attr.placeholder": "placeholder", "disabled": "disabled", "required": "required", "attr.readonly": "readonly && !_isNativeSelect || null", "attr.aria-invalid": "errorState", "attr.aria-required": "required.toString()", "attr.autocomplete": "'off'", "attr.aria-describedby": "this._ariaDescribedby" }, classAttribute: "novo-input-element" }, providers: [{ provide: NovoFieldControl, useExisting: NovoInput }], usesInheritance: true, usesOnChanges: true, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoInput, decorators: [{
             type: Directive,
@@ -34053,13 +34305,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                     providers: [{ provide: NovoFieldControl, useExisting: NovoInput }],
                 }]
         }], ctorParameters: function () {
-        return [{ type: i0.ElementRef }, { type: i1$6.Platform }, { type: i5.NgControl, decorators: [{
+        return [{ type: i0.ElementRef }, { type: i1$6.Platform }, { type: i4.NgControl, decorators: [{
                         type: Optional
                     }, {
                         type: Self
-                    }] }, { type: i5.NgForm, decorators: [{
+                    }] }, { type: i4.NgForm, decorators: [{
                         type: Optional
-                    }] }, { type: i5.FormGroupDirective, decorators: [{
+                    }] }, { type: i4.FormGroupDirective, decorators: [{
                         type: Optional
                     }] }, { type: undefined, decorators: [{
                         type: Optional
@@ -34297,6 +34549,7 @@ NovoFieldModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version
         NovoFieldsElement,
         NovoTimeFormatDirective,
         NovoDateFormatDirective,
+        NovoDateTimeFormatDirective,
         NovoDateRangeFormatDirective,
         NovoPickerToggleElement,
         NovoPickerDirective,
@@ -34311,6 +34564,7 @@ NovoFieldModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version
         NovoTimeFormatDirective,
         NovoDateFormatDirective,
         NovoDateRangeFormatDirective,
+        NovoDateTimeFormatDirective,
         NovoPickerToggleElement,
         NovoPickerDirective,
         NovoAutocompleteElement] });
@@ -34330,6 +34584,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                         NovoFieldsElement,
                         NovoTimeFormatDirective,
                         NovoDateFormatDirective,
+                        NovoDateTimeFormatDirective,
                         NovoDateRangeFormatDirective,
                         NovoPickerToggleElement,
                         NovoPickerDirective,
@@ -34347,6 +34602,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                         NovoTimeFormatDirective,
                         NovoDateFormatDirective,
                         NovoDateRangeFormatDirective,
+                        NovoDateTimeFormatDirective,
                         NovoPickerToggleElement,
                         NovoPickerDirective,
                         NovoAutocompleteElement,
@@ -34991,7 +35247,7 @@ class NovoChipList extends _NovoChipListMixinBase {
         }
     }
 }
-NovoChipList.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoChipList, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1$8.Directionality, optional: true }, { token: i5.NgForm, optional: true }, { token: i5.FormGroupDirective, optional: true }, { token: ErrorStateMatcher }, { token: i5.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
+NovoChipList.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoChipList, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1$8.Directionality, optional: true }, { token: i4.NgForm, optional: true }, { token: i4.FormGroupDirective, optional: true }, { token: ErrorStateMatcher }, { token: i4.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
 NovoChipList.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NovoChipList, selector: "novo-chip-list", inputs: { errorStateMatcher: "errorStateMatcher", multiple: "multiple", stacked: "stacked", compareWith: "compareWith", value: "value", required: "required", placeholder: "placeholder", disabled: "disabled", ariaOrientation: ["aria-orientation", "ariaOrientation"], selectable: "selectable", tabIndex: "tabIndex" }, outputs: { change: "change", valueChange: "valueChange" }, host: { listeners: { "focus": "focus()", "blur": "_blur()", "keydown": "_keydown($event)" }, properties: { "attr.tabindex": "disabled ? null : _tabIndex", "attr.aria-describedby": "_ariaDescribedby || null", "attr.aria-required": "role ? required : null", "attr.aria-disabled": "disabled.toString()", "attr.aria-invalid": "errorState", "attr.aria-multiselectable": "multiple", "attr.role": "role", "class.novo-chip-list-empty": "empty", "class.novo-chip-list-has-value": "!empty", "class.novo-chip-list-stacked": "stacked", "class.novo-chip-list-focused": "focused", "class.novo-chip-list-disabled": "disabled", "class.novo-chip-list-invalid": "errorState", "class.novo-chip-list-required": "required", "attr.aria-orientation": "ariaOrientation", "id": "_uid" }, classAttribute: "novo-chip-list" }, providers: [
         { provide: NovoFieldControl, useExisting: NovoChipList },
         { provide: NOVO_OPTION_PARENT_COMPONENT, useExisting: NovoChipList },
@@ -35035,11 +35291,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
         }], ctorParameters: function () {
         return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1$8.Directionality, decorators: [{
                         type: Optional
-                    }] }, { type: i5.NgForm, decorators: [{
+                    }] }, { type: i4.NgForm, decorators: [{
                         type: Optional
-                    }] }, { type: i5.FormGroupDirective, decorators: [{
+                    }] }, { type: i4.FormGroupDirective, decorators: [{
                         type: Optional
-                    }] }, { type: ErrorStateMatcher }, { type: i5.NgControl, decorators: [{
+                    }] }, { type: ErrorStateMatcher }, { type: i4.NgControl, decorators: [{
                         type: Optional
                     }, {
                         type: Self
@@ -35190,7 +35446,7 @@ class NovoChipInput {
         return !hasModifierKey(event) && new Set(this.separatorKeyCodes).has(event.key);
     }
 }
-NovoChipInput.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoChipInput, deps: [{ token: i0.ElementRef }, { token: NOVO_CHIPS_DEFAULT_OPTIONS }, { token: forwardRef(() => NovoChipList) }, { token: i5.NgControl }], target: i0.ɵɵFactoryTarget.Directive });
+NovoChipInput.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoChipInput, deps: [{ token: i0.ElementRef }, { token: NOVO_CHIPS_DEFAULT_OPTIONS }, { token: forwardRef(() => NovoChipList) }, { token: i4.NgControl }], target: i0.ɵɵFactoryTarget.Directive });
 NovoChipInput.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.11", type: NovoChipInput, selector: "input[novoChipInput]", inputs: { addOnBlur: ["novoChipInputAddOnBlur", "addOnBlur"], separatorKeyCodes: ["novoChipInputSeparatorKeyCodes", "separatorKeyCodes"], placeholder: "placeholder", id: "id", disabled: "disabled" }, outputs: { chipEnd: "novoChipInputTokenEnd" }, host: { listeners: { "keydown": "_keydown($event)", "blur": "_blur()", "focus": "_focus()", "input": "_onInput()" }, properties: { "id": "id", "attr.disabled": "disabled || null", "attr.placeholder": "placeholder || null", "attr.aria-invalid": "_chipList && _chipList.ngControl ? _chipList.ngControl.invalid : null", "attr.aria-required": "_chipList && _chipList.required || null" }, classAttribute: "novo-chip-input novo-input-element" }, exportAs: ["novoChipInput", "novoChipInputFor"], usesOnChanges: true, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoChipInput, decorators: [{
             type: Directive,
@@ -35217,7 +35473,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                     }] }, { type: NovoChipList, decorators: [{
                         type: Inject,
                         args: [forwardRef(() => NovoChipList)]
-                    }] }, { type: i5.NgControl }];
+                    }] }, { type: i4.NgControl }];
     }, propDecorators: { addOnBlur: [{
                 type: Input,
                 args: ['novoChipInputAddOnBlur']
@@ -35513,7 +35769,7 @@ NovoChipsElement.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versi
     <label class="clear-all" *ngIf="items.length && !disablePickerInput" (click)="clearValue()"
       >{{ labels.clearAll }} <i class="bhi-times"></i
     ></label>
-  `, isInline: true, components: [{ type: NovoChipElement, selector: "novo-chip, [novo-chip]", inputs: ["color", "tabIndex", "size", "type", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"] }, { type: NovoIconComponent, selector: "novo-icon", inputs: ["raised", "theme", "shape", "color", "size", "smaller", "larger", "alt", "name"] }, { type: NovoPickerElement, selector: "novo-picker", inputs: ["config", "placeholder", "clearValueOnSelect", "closeOnSelect", "selected", "appendToBody", "parentScrollSelector", "parentScrollAction", "containerClass", "side", "autoSelectFirstOption", "overrideElement", "disablePickerInput"], outputs: ["changed", "select", "focus", "blur", "typing"] }], directives: [{ type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: NovoChipAvatar, selector: "novo-chip-avatar, [novoChipAvatar]" }, { type: NovoChipRemove, selector: "[novoChipRemove]" }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "async": i1.AsyncPipe } });
+  `, isInline: true, components: [{ type: NovoChipElement, selector: "novo-chip, [novo-chip]", inputs: ["color", "tabIndex", "size", "type", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"] }, { type: NovoIconComponent, selector: "novo-icon", inputs: ["raised", "theme", "shape", "color", "size", "smaller", "larger", "alt", "name"] }, { type: NovoPickerElement, selector: "novo-picker", inputs: ["config", "placeholder", "clearValueOnSelect", "closeOnSelect", "selected", "appendToBody", "parentScrollSelector", "parentScrollAction", "containerClass", "side", "autoSelectFirstOption", "overrideElement", "disablePickerInput"], outputs: ["changed", "select", "focus", "blur", "typing"] }], directives: [{ type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: NovoChipAvatar, selector: "novo-chip-avatar, [novoChipAvatar]" }, { type: NovoChipRemove, selector: "[novoChipRemove]" }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "async": i1.AsyncPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoChipsElement, decorators: [{
             type: Component,
             args: [{
@@ -35700,7 +35956,7 @@ NovoRowChipsElement.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ve
     <div class="preview-container">
       <span #preview></span>
     </div>
-  `, isInline: true, components: [{ type: NovoRowChipElement, selector: "novo-row-chip" }, { type: NovoFieldElement, selector: "novo-field", inputs: ["layout", "appearance", "width"], outputs: ["valueChanges", "stateChanges"] }, { type: NovoPickerElement, selector: "novo-picker", inputs: ["config", "placeholder", "clearValueOnSelect", "closeOnSelect", "selected", "appendToBody", "parentScrollSelector", "parentScrollAction", "containerClass", "side", "autoSelectFirstOption", "overrideElement", "disablePickerInput"], outputs: ["changed", "select", "focus", "blur", "typing"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: NovoInput, selector: "input[novoInput], textarea[novoInput], select[novoInput]", inputs: ["disabled", "id", "placeholder", "required", "type", "value", "readonly"] }, { type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "async": i1.AsyncPipe } });
+  `, isInline: true, components: [{ type: NovoRowChipElement, selector: "novo-row-chip" }, { type: NovoFieldElement, selector: "novo-field", inputs: ["layout", "appearance", "width"], outputs: ["valueChanges", "stateChanges"] }, { type: NovoPickerElement, selector: "novo-picker", inputs: ["config", "placeholder", "clearValueOnSelect", "closeOnSelect", "selected", "appendToBody", "parentScrollSelector", "parentScrollAction", "containerClass", "side", "autoSelectFirstOption", "overrideElement", "disablePickerInput"], outputs: ["changed", "select", "focus", "blur", "typing"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: NovoInput, selector: "input[novoInput], textarea[novoInput], select[novoInput]", inputs: ["disabled", "id", "placeholder", "required", "type", "value", "readonly"] }, { type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "async": i1.AsyncPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoRowChipsElement, decorators: [{
             type: Component,
             args: [{
@@ -36707,7 +36963,7 @@ NovoColorInputElement.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0",
     <novo-overlay-template [parent]="element" position="above-below">
       <novo-color-picker [(color)]="value" (onChange)="setValueAndClose($event)"></novo-color-picker>
     </novo-overlay-template>
-  `, isInline: true, components: [{ type: NovoFieldElement, selector: "novo-field", inputs: ["layout", "appearance", "width"], outputs: ["valueChanges", "stateChanges"] }, { type: NovoIconComponent, selector: "novo-icon", inputs: ["raised", "theme", "shape", "color", "size", "smaller", "larger", "alt", "name"] }, { type: NovoOverlayTemplateComponent, selector: "novo-overlay-template", inputs: ["position", "scrollStrategy", "width", "height", "closeOnSelect", "hasBackdrop", "parent"], outputs: ["select", "opening", "closing"] }, { type: NovoColorPickerComponent, selector: "novo-color-picker", inputs: ["width", "colors", "color"], outputs: ["onChange", "onChangeComplete", "onSwatchHover"] }], directives: [{ type: NovoInput, selector: "input[novoInput], textarea[novoInput], select[novoInput]", inputs: ["disabled", "id", "placeholder", "required", "type", "value", "readonly"] }, { type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+  `, isInline: true, components: [{ type: NovoFieldElement, selector: "novo-field", inputs: ["layout", "appearance", "width"], outputs: ["valueChanges", "stateChanges"] }, { type: NovoIconComponent, selector: "novo-icon", inputs: ["raised", "theme", "shape", "color", "size", "smaller", "larger", "alt", "name"] }, { type: NovoOverlayTemplateComponent, selector: "novo-overlay-template", inputs: ["position", "scrollStrategy", "width", "height", "closeOnSelect", "hasBackdrop", "parent"], outputs: ["select", "opening", "closing"] }, { type: NovoColorPickerComponent, selector: "novo-color-picker", inputs: ["width", "colors", "color"], outputs: ["onChange", "onChangeComplete", "onSwatchHover"] }], directives: [{ type: NovoInput, selector: "input[novoInput], textarea[novoInput], select[novoInput]", inputs: ["disabled", "id", "placeholder", "required", "type", "value", "readonly"] }, { type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoColorInputElement, decorators: [{
             type: Component,
             args: [{
@@ -37242,8 +37498,8 @@ var SortDirection;
     SortDirection["NONE"] = "none";
 })(SortDirection || (SortDirection = {}));
 
-const activeStyle = { opacity: 1, pointerEvents: 'all', top: 0 };
-const inactiveStyle = { opacity: 0, pointerEvents: 'none' };
+const activeStyle = { opacity: 1, top: 0 };
+const inactiveStyle = { opacity: 0 };
 /** Animation that moves the sort indicator. */
 const sortAscAnim = trigger('sortAsc', [
     // ...
@@ -37487,10 +37743,10 @@ class NovoDataTableSortButton {
     }
 }
 NovoDataTableSortButton.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoDataTableSortButton, deps: [{ token: DataTableState }, { token: i0.ChangeDetectorRef }, { token: NovoLabelService }], target: i0.ɵɵFactoryTarget.Component });
-NovoDataTableSortButton.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NovoDataTableSortButton, selector: "novo-sort-button", inputs: { value: "value" }, outputs: { sortChange: "sortChange" }, ngImport: i0, template: "<novo-icon\n  class=\"novo-sort-asc-icon\"\n  [class.sort-active]=\"isActive\"\n  [@sortAsc]=\"value\"\n  (click)=\"changeSort(SortDirection.DESC)\">arrow-up</novo-icon>\n<novo-icon\n  class=\"novo-sort-desc-icon\"\n  [class.sort-active]=\"isActive\"\n  [@sortDesc]=\"value\"\n  (click)=\"changeSort(SortDirection.NONE)\">arrow-down</novo-icon>\n<novo-icon\n  class=\"novo-sortable-icon\"\n  [class.sort-active]=\"isActive\"\n  [@sortNone]=\"value\"\n  (click)=\"changeSort(SortDirection.ASC)\">sortable</novo-icon>", styles: [":host{display:inline-flex;position:relative;width:1.6rem;height:1.6rem;cursor:pointer}:host novo-icon{position:absolute;opacity:0;color:var(--text-muted)}:host novo-icon:hover{color:var(--selection)}:host .novo-sort-asc-icon{top:10px;color:var(--selection)}:host .novo-sort-desc-icon{top:-10px;color:var(--selection)}\n"], components: [{ type: NovoIconComponent, selector: "novo-icon", inputs: ["raised", "theme", "shape", "color", "size", "smaller", "larger", "alt", "name"] }], animations: [sortAscAnim, sortDescAnim, sortNoneAnim], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+NovoDataTableSortButton.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NovoDataTableSortButton, selector: "novo-sort-button", inputs: { value: "value" }, outputs: { sortChange: "sortChange" }, ngImport: i0, template: "<novo-icon\n  class=\"novo-sort-asc-icon\"\n  [class.sort-active]=\"isActive\"\n  [class.sort-hidden]=\"value !== SortDirection.ASC\"\n  [@sortAsc]=\"value\"\n  (click)=\"changeSort(SortDirection.DESC)\">arrow-up</novo-icon>\n<novo-icon\n  class=\"novo-sort-desc-icon\"\n  [class.sort-active]=\"isActive\"\n  [class.sort-hidden]=\"value !== SortDirection.DESC\"\n  [@sortDesc]=\"value\"\n  (click)=\"changeSort(SortDirection.NONE)\">arrow-down</novo-icon>\n<novo-icon\n  class=\"novo-sortable-icon\"\n  [class.sort-active]=\"isActive\"\n  [class.sort-hidden]=\"value !== SortDirection.NONE\"\n  [@sortNone]=\"value\"\n  (click)=\"changeSort(SortDirection.ASC)\">sortable</novo-icon>", styles: [":host{display:inline-flex;position:relative;width:1.6rem;height:1.6rem;cursor:pointer}:host novo-icon{position:absolute;opacity:0;color:var(--text-muted)}:host novo-icon:hover{color:var(--selection)}:host novo-icon.sort-hidden{pointer-events:none}:host .novo-sort-asc-icon{top:10px;color:var(--selection)}:host .novo-sort-desc-icon{top:-10px;color:var(--selection)}\n"], components: [{ type: NovoIconComponent, selector: "novo-icon", inputs: ["raised", "theme", "shape", "color", "size", "smaller", "larger", "alt", "name"] }], animations: [sortAscAnim, sortDescAnim, sortNoneAnim], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoDataTableSortButton, decorators: [{
             type: Component,
-            args: [{ selector: 'novo-sort-button', changeDetection: ChangeDetectionStrategy.OnPush, animations: [sortAscAnim, sortDescAnim, sortNoneAnim], template: "<novo-icon\n  class=\"novo-sort-asc-icon\"\n  [class.sort-active]=\"isActive\"\n  [@sortAsc]=\"value\"\n  (click)=\"changeSort(SortDirection.DESC)\">arrow-up</novo-icon>\n<novo-icon\n  class=\"novo-sort-desc-icon\"\n  [class.sort-active]=\"isActive\"\n  [@sortDesc]=\"value\"\n  (click)=\"changeSort(SortDirection.NONE)\">arrow-down</novo-icon>\n<novo-icon\n  class=\"novo-sortable-icon\"\n  [class.sort-active]=\"isActive\"\n  [@sortNone]=\"value\"\n  (click)=\"changeSort(SortDirection.ASC)\">sortable</novo-icon>", styles: [":host{display:inline-flex;position:relative;width:1.6rem;height:1.6rem;cursor:pointer}:host novo-icon{position:absolute;opacity:0;color:var(--text-muted)}:host novo-icon:hover{color:var(--selection)}:host .novo-sort-asc-icon{top:10px;color:var(--selection)}:host .novo-sort-desc-icon{top:-10px;color:var(--selection)}\n"] }]
+            args: [{ selector: 'novo-sort-button', changeDetection: ChangeDetectionStrategy.OnPush, animations: [sortAscAnim, sortDescAnim, sortNoneAnim], template: "<novo-icon\n  class=\"novo-sort-asc-icon\"\n  [class.sort-active]=\"isActive\"\n  [class.sort-hidden]=\"value !== SortDirection.ASC\"\n  [@sortAsc]=\"value\"\n  (click)=\"changeSort(SortDirection.DESC)\">arrow-up</novo-icon>\n<novo-icon\n  class=\"novo-sort-desc-icon\"\n  [class.sort-active]=\"isActive\"\n  [class.sort-hidden]=\"value !== SortDirection.DESC\"\n  [@sortDesc]=\"value\"\n  (click)=\"changeSort(SortDirection.NONE)\">arrow-down</novo-icon>\n<novo-icon\n  class=\"novo-sortable-icon\"\n  [class.sort-active]=\"isActive\"\n  [class.sort-hidden]=\"value !== SortDirection.NONE\"\n  [@sortNone]=\"value\"\n  (click)=\"changeSort(SortDirection.ASC)\">sortable</novo-icon>", styles: [":host{display:inline-flex;position:relative;width:1.6rem;height:1.6rem;cursor:pointer}:host novo-icon{position:absolute;opacity:0;color:var(--text-muted)}:host novo-icon:hover{color:var(--selection)}:host novo-icon.sort-hidden{pointer-events:none}:host .novo-sort-asc-icon{top:10px;color:var(--selection)}:host .novo-sort-desc-icon{top:-10px;color:var(--selection)}\n"] }]
         }], ctorParameters: function () { return [{ type: DataTableState }, { type: i0.ChangeDetectorRef }, { type: NovoLabelService }]; }, propDecorators: { sortChange: [{
                 type: Output
             }], value: [{
@@ -38558,7 +38814,7 @@ NovoDataTableCellHeader.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0"
     </div>
     <div class="spacer"></div>
     <div class="data-table-header-resizable" *ngIf="config.resizable"><span (mousedown)="startResize($event)">&nbsp;</span></div>
-  `, isInline: true, components: [{ type: NovoDataTableSortButton, selector: "novo-sort-button", inputs: ["value"], outputs: ["sortChange"] }, { type: NovoDropdownElement, selector: "novo-dropdown", inputs: ["parentScrollSelector", "parentScrollAction", "containerClass", "side", "scrollStrategy", "keepOpen", "height", "width", "appendToBody", "multiple"], outputs: ["toggled"] }, { type: NovoIconComponent, selector: "novo-icon", inputs: ["raised", "theme", "shape", "color", "size", "smaller", "larger", "alt", "name"] }, { type: NovoLabel, selector: "novo-label,[novo-label]" }, { type: NovoButtonElement, selector: "novo-button,button[theme]", inputs: ["color", "side", "size", "theme", "loading", "icon", "disabled"] }, { type: NovoOptgroup, selector: "novo-optgroup", inputs: ["disabled", "label"], exportAs: ["novoOptgroup"] }, { type: NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }, { type: NovoStackElement, selector: "novo-stack,novo-column", inputs: ["direction", "align"] }, { type: NovoDatePickerElement, selector: "novo-date-picker", inputs: ["minYear", "maxYear", "start", "end", "inline", "weekStart", "preselected", "hideOverflowDays", "hideFooter", "disabledDateMessage", "numberOfMonths", "mode", "range", "weekRangeSelect"], outputs: ["onSelect"] }, { type: NovoFieldElement, selector: "novo-field", inputs: ["layout", "appearance", "width"], outputs: ["valueChanges", "stateChanges"] }, { type: NovoErrorElement, selector: "novo-error" }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: TooltipDirective, selector: "[tooltip]", inputs: ["tooltip", "tooltipPosition", "tooltipType", "tooltipSize", "tooltipBounce", "tooltipNoAnimate", "tooltipRounded", "tooltipAlways", "tooltipActive", "tooltipPreline", "removeTooltipArrow", "tooltipAutoPosition", "tooltipIsHTML"] }, { type: NovoDropDownTrigger, selector: "[dropdownTrigger]" }, { type: ThemeColorDirective, selector: "[theme]", inputs: ["theme"] }, { type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: NovoFieldSuffixDirective, selector: "[novoSuffix]" }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: FlexDirective, selector: "[flex]", inputs: ["flex"] }, { type: NovoInput, selector: "input[novoInput], textarea[novoInput], select[novoInput]", inputs: ["disabled", "id", "placeholder", "required", "type", "value", "readonly"] }, { type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+  `, isInline: true, components: [{ type: NovoDataTableSortButton, selector: "novo-sort-button", inputs: ["value"], outputs: ["sortChange"] }, { type: NovoDropdownElement, selector: "novo-dropdown", inputs: ["parentScrollSelector", "parentScrollAction", "containerClass", "side", "scrollStrategy", "keepOpen", "height", "width", "appendToBody", "multiple"], outputs: ["toggled"] }, { type: NovoIconComponent, selector: "novo-icon", inputs: ["raised", "theme", "shape", "color", "size", "smaller", "larger", "alt", "name"] }, { type: NovoLabel, selector: "novo-label,[novo-label]" }, { type: NovoButtonElement, selector: "novo-button,button[theme]", inputs: ["color", "side", "size", "theme", "loading", "icon", "disabled"] }, { type: NovoOptgroup, selector: "novo-optgroup", inputs: ["disabled", "label"], exportAs: ["novoOptgroup"] }, { type: NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }, { type: NovoStackElement, selector: "novo-stack,novo-column", inputs: ["direction", "align"] }, { type: NovoDatePickerElement, selector: "novo-date-picker", inputs: ["minYear", "maxYear", "start", "end", "inline", "weekStart", "preselected", "hideOverflowDays", "hideFooter", "disabledDateMessage", "numberOfMonths", "mode", "range", "weekRangeSelect"], outputs: ["onSelect"] }, { type: NovoFieldElement, selector: "novo-field", inputs: ["layout", "appearance", "width"], outputs: ["valueChanges", "stateChanges"] }, { type: NovoErrorElement, selector: "novo-error" }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: TooltipDirective, selector: "[tooltip]", inputs: ["tooltip", "tooltipPosition", "tooltipType", "tooltipSize", "tooltipBounce", "tooltipNoAnimate", "tooltipRounded", "tooltipAlways", "tooltipActive", "tooltipPreline", "removeTooltipArrow", "tooltipAutoPosition", "tooltipIsHTML"] }, { type: NovoDropDownTrigger, selector: "[dropdownTrigger]" }, { type: ThemeColorDirective, selector: "[theme]", inputs: ["theme"] }, { type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: NovoFieldSuffixDirective, selector: "[novoSuffix]" }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: FlexDirective, selector: "[flex]", inputs: ["flex"] }, { type: NovoInput, selector: "input[novoInput], textarea[novoInput], select[novoInput]", inputs: ["disabled", "id", "placeholder", "required", "type", "value", "readonly"] }, { type: i4.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: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoDataTableCellHeader, decorators: [{
             type: Component,
             args: [{
@@ -40074,7 +40330,7 @@ class NovoSelectElement extends NovoSelectMixins {
         return null;
     }
 }
-NovoSelectElement.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoSelectElement, deps: [{ token: i0.ElementRef }, { token: NovoLabelService }, { token: i0.ChangeDetectorRef }, { token: i1$5.FocusMonitor }, { token: i0.NgZone }, { token: ErrorStateMatcher }, { token: i5.NgControl, optional: true, self: true }, { token: i5.NgForm, optional: true }, { token: i5.FormGroupDirective, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+NovoSelectElement.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoSelectElement, deps: [{ token: i0.ElementRef }, { token: NovoLabelService }, { token: i0.ChangeDetectorRef }, { token: i1$5.FocusMonitor }, { token: i0.NgZone }, { token: ErrorStateMatcher }, { token: i4.NgControl, optional: true, self: true }, { token: i4.NgForm, optional: true }, { token: i4.FormGroupDirective, optional: true }], target: i0.ɵɵFactoryTarget.Component });
 NovoSelectElement.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NovoSelectElement, selector: "novo-select", inputs: { disabled: "disabled", required: "required", tabIndex: "tabIndex", id: "id", name: "name", options: "options", placeholder: "placeholder", readonly: "readonly", headerConfig: "headerConfig", position: "position", overlayWidth: "overlayWidth", overlayHeight: "overlayHeight", displayWith: "displayWith", compareWith: "compareWith", value: "value", multiple: "multiple" }, outputs: { onSelect: "onSelect", selectionChange: "selectionChange", valueChange: "valueChange", openedChange: "openedChange", _openedStream: "opened", _closedStream: "closed" }, host: { attributes: { "role": "combobox", "aria-autocomplete": "none", "aria-haspopup": "true" }, listeners: { "keydown": "_handleKeydown($event)" }, properties: { "attr.id": "id", "attr.aria-controls": "panelOpen ? id + \"-panel\" : null", "attr.aria-expanded": "panelOpen", "attr.aria-required": "required.toString()", "attr.aria-disabled": "disabled.toString()", "attr.aria-invalid": "errorState", "attr.aria-describedby": "_ariaDescribedby || null", "attr.aria-activedescendant": "_getAriaActiveDescendant()", "class.novo-select-disabled": "disabled", "class.novo-select-invalid": "errorState", "class.novo-select-required": "required", "class.novo-select-empty": "empty", "class.novo-select-multiple": "multiple" }, classAttribute: "novo-select" }, providers: [
         { provide: NovoFieldControl, useExisting: NovoSelectElement },
         { provide: NOVO_OPTION_PARENT_COMPONENT, useExisting: NovoSelectElement },
@@ -40226,13 +40482,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                     },
                 }]
         }], ctorParameters: function () {
-        return [{ type: i0.ElementRef }, { type: NovoLabelService }, { type: i0.ChangeDetectorRef }, { type: i1$5.FocusMonitor }, { type: i0.NgZone }, { type: ErrorStateMatcher }, { type: i5.NgControl, decorators: [{
+        return [{ type: i0.ElementRef }, { type: NovoLabelService }, { type: i0.ChangeDetectorRef }, { type: i1$5.FocusMonitor }, { type: i0.NgZone }, { type: ErrorStateMatcher }, { type: i4.NgControl, decorators: [{
                         type: Optional
                     }, {
                         type: Self
-                    }] }, { type: i5.NgForm, decorators: [{
+                    }] }, { type: i4.NgForm, decorators: [{
                         type: Optional
-                    }] }, { type: i5.FormGroupDirective, decorators: [{
+                    }] }, { type: i4.FormGroupDirective, decorators: [{
                         type: Optional
                     }] }];
     }, propDecorators: { id: [{
@@ -40552,7 +40808,7 @@ NovoDataTablePagination.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0"
               icon="refresh"
               (click)="paginationRefreshSubject.next()">{{ labels.refreshPagination }}</button>
     </ng-container>
-  `, isInline: true, components: [{ type: NovoTilesElement, selector: "novo-tiles", inputs: ["name", "options", "required", "controlDisabled"], outputs: ["onChange", "onSelectedOptionClick", "onDisabledOptionClick"] }, { type: NovoButtonElement, selector: "novo-button,button[theme]", inputs: ["color", "side", "size", "theme", "loading", "icon", "disabled"] }, { type: NovoSelectElement, selector: "novo-select", inputs: ["disabled", "required", "tabIndex", "id", "name", "options", "placeholder", "readonly", "headerConfig", "position", "overlayWidth", "overlayHeight", "displayWith", "compareWith", "value", "multiple"], outputs: ["onSelect", "selectionChange", "valueChange", "openedChange", "opened", "closed"] }, { type: NovoLoadingElement, selector: "novo-loading", inputs: ["theme", "color", "size"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: ThemeColorDirective, selector: "[theme]", inputs: ["theme"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+  `, isInline: true, components: [{ type: NovoTilesElement, selector: "novo-tiles", inputs: ["name", "options", "required", "controlDisabled"], outputs: ["onChange", "onSelectedOptionClick", "onDisabledOptionClick"] }, { type: NovoButtonElement, selector: "novo-button,button[theme]", inputs: ["color", "side", "size", "theme", "loading", "icon", "disabled"] }, { type: NovoSelectElement, selector: "novo-select", inputs: ["disabled", "required", "tabIndex", "id", "name", "options", "placeholder", "readonly", "headerConfig", "position", "overlayWidth", "overlayHeight", "displayWith", "compareWith", "value", "multiple"], outputs: ["onSelect", "selectionChange", "valueChange", "openedChange", "opened", "closed"] }, { type: NovoLoadingElement, selector: "novo-loading", inputs: ["theme", "color", "size"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: ThemeColorDirective, selector: "[theme]", inputs: ["theme"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoDataTablePagination, decorators: [{
             type: Component,
             args: [{
@@ -41535,7 +41791,7 @@ NovoDataTable.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version:
     </ng-template>
     <!-- CUSTOM CELLS PASSED IN -->
     <ng-content></ng-content>
-  `, isInline: true, components: [{ type: NovoSearchBoxElement, selector: "novo-search", inputs: ["name", "icon", "position", "placeholder", "alwaysOpen", "theme", "color", "closeOnSelect", "displayField", "displayValue", "hint", "keepOpen", "hasBackdrop", "allowPropagation"], outputs: ["searchChanged", "applySearch"] }, { type: NovoDataTablePagination, selector: "novo-data-table-pagination", inputs: ["theme", "page", "pageSize", "dataFeatureId", "pageSizeOptions", "canSelectAll", "allMatchingSelected", "loading", "errorLoading", "paginationRefreshSubject", "length"], outputs: ["pageChange"] }, { type: NovoLoadingElement, selector: "novo-loading", inputs: ["theme", "color", "size"] }, { type: i1$9.CdkTable, selector: "cdk-table, table[cdk-table]", inputs: ["trackBy", "dataSource", "multiTemplateDataRows", "fixedLayout"], outputs: ["contentChanged"], exportAs: ["cdkTable"] }, { type: NovoDataTableCheckboxHeaderCell, selector: "novo-data-table-checkbox-header-cell", inputs: ["maxSelected"] }, { type: NovoDataTableCheckboxCell, selector: "novo-data-table-checkbox-cell", inputs: ["row", "maxSelected"] }, { type: NovoDataTableExpandHeaderCell, selector: "novo-data-table-expand-header-cell" }, { type: NovoDataTableExpandCell, selector: "novo-data-table-expand-cell", inputs: ["row"] }, { type: NovoDataTableCellHeader, selector: "[novo-data-table-cell-config]", inputs: ["defaultSort", "allowMultipleFilters", "resized", "filterTemplate", "novo-data-table-cell-config"] }, { type: NovoDataTableCell, selector: "novo-data-table-cell", inputs: ["row", "template", "column", "resized"] }, { type: NovoDataTableHeaderRow, selector: "novo-data-table-header-row", inputs: ["fixedHeader"] }, { type: NovoDataTableRow, selector: "novo-data-table-row", inputs: ["id", "dataAutomationId"] }, { type: NovoButtonElement, selector: "novo-button,button[theme]", inputs: ["color", "side", "size", "theme", "loading", "icon", "disabled"] }, { type: NovoIconComponent, selector: "novo-icon", inputs: ["raised", "theme", "shape", "color", "size", "smaller", "larger", "alt", "name"] }, { type: NovoDropdownElement, selector: "novo-dropdown", inputs: ["parentScrollSelector", "parentScrollAction", "containerClass", "side", "scrollStrategy", "keepOpen", "height", "width", "appendToBody", "multiple"], outputs: ["toggled"] }, { type: NovoOptgroup, selector: "novo-optgroup", inputs: ["disabled", "label"], exportAs: ["novoOptgroup"] }, { type: NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: ThemeColorDirective, selector: "[theme]", inputs: ["theme"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: NovoDataTableSortFilter, selector: "[novoDataTableSortFilter]" }, { type: i1$9.CdkColumnDef, selector: "[cdkColumnDef]", inputs: ["sticky", "cdkColumnDef", "stickyEnd"] }, { type: i1$9.CdkHeaderCellDef, selector: "[cdkHeaderCellDef]" }, { type: i1$9.CdkCellDef, selector: "[cdkCellDef]" }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: NovoDataTableHeaderCell, selector: "novo-data-table-header-cell", inputs: ["column"] }, { type: i1$9.CdkHeaderRowDef, selector: "[cdkHeaderRowDef]", inputs: ["cdkHeaderRowDef", "cdkHeaderRowDefSticky"] }, { type: i1$9.CdkRowDef, selector: "[cdkRowDef]", inputs: ["cdkRowDefColumns", "cdkRowDefWhen"] }, { type: NovoDataTableExpandDirective, selector: "[novoDataTableExpand]", inputs: ["row", "novoDataTableExpand"] }, { type: NovoTemplate, selector: "[novoTemplate]", inputs: ["type", "novoTemplate"] }, { type: TooltipDirective, selector: "[tooltip]", inputs: ["tooltip", "tooltipPosition", "tooltipType", "tooltipSize", "tooltipBounce", "tooltipNoAnimate", "tooltipRounded", "tooltipAlways", "tooltipActive", "tooltipPreline", "removeTooltipArrow", "tooltipAutoPosition", "tooltipIsHTML"] }], pipes: { "dataTableInterpolate": DataTableInterpolatePipe, "dataTableDateRenderer": DateTableDateRendererPipe, "dataTableDateTimeRenderer": DateTableDateTimeRendererPipe, "dataTableTimeRenderer": DateTableTimeRendererPipe, "dataTableCurrencyRenderer": DateTableCurrencyRendererPipe, "dataTableBigDecimalRenderer": DataTableBigDecimalRendererPipe, "dataTableNumberRenderer": DateTableNumberRendererPipe }, animations: [
+  `, isInline: true, components: [{ type: NovoSearchBoxElement, selector: "novo-search", inputs: ["name", "icon", "position", "placeholder", "alwaysOpen", "theme", "color", "closeOnSelect", "displayField", "displayValue", "hint", "keepOpen", "hasBackdrop", "allowPropagation"], outputs: ["searchChanged", "applySearch"] }, { type: NovoDataTablePagination, selector: "novo-data-table-pagination", inputs: ["theme", "page", "pageSize", "dataFeatureId", "pageSizeOptions", "canSelectAll", "allMatchingSelected", "loading", "errorLoading", "paginationRefreshSubject", "length"], outputs: ["pageChange"] }, { type: NovoLoadingElement, selector: "novo-loading", inputs: ["theme", "color", "size"] }, { type: i1$9.CdkTable, selector: "cdk-table, table[cdk-table]", inputs: ["trackBy", "dataSource", "multiTemplateDataRows", "fixedLayout"], outputs: ["contentChanged"], exportAs: ["cdkTable"] }, { type: NovoDataTableCheckboxHeaderCell, selector: "novo-data-table-checkbox-header-cell", inputs: ["maxSelected"] }, { type: NovoDataTableCheckboxCell, selector: "novo-data-table-checkbox-cell", inputs: ["row", "maxSelected"] }, { type: NovoDataTableExpandHeaderCell, selector: "novo-data-table-expand-header-cell" }, { type: NovoDataTableExpandCell, selector: "novo-data-table-expand-cell", inputs: ["row"] }, { type: NovoDataTableCellHeader, selector: "[novo-data-table-cell-config]", inputs: ["defaultSort", "allowMultipleFilters", "resized", "filterTemplate", "novo-data-table-cell-config"] }, { type: NovoDataTableCell, selector: "novo-data-table-cell", inputs: ["row", "template", "column", "resized"] }, { type: NovoDataTableHeaderRow, selector: "novo-data-table-header-row", inputs: ["fixedHeader"] }, { type: NovoDataTableRow, selector: "novo-data-table-row", inputs: ["id", "dataAutomationId"] }, { type: NovoButtonElement, selector: "novo-button,button[theme]", inputs: ["color", "side", "size", "theme", "loading", "icon", "disabled"] }, { type: NovoIconComponent, selector: "novo-icon", inputs: ["raised", "theme", "shape", "color", "size", "smaller", "larger", "alt", "name"] }, { type: NovoDropdownElement, selector: "novo-dropdown", inputs: ["parentScrollSelector", "parentScrollAction", "containerClass", "side", "scrollStrategy", "keepOpen", "height", "width", "appendToBody", "multiple"], outputs: ["toggled"] }, { type: NovoOptgroup, selector: "novo-optgroup", inputs: ["disabled", "label"], exportAs: ["novoOptgroup"] }, { type: NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: ThemeColorDirective, selector: "[theme]", inputs: ["theme"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: NovoDataTableSortFilter, selector: "[novoDataTableSortFilter]" }, { type: i1$9.CdkColumnDef, selector: "[cdkColumnDef]", inputs: ["sticky", "cdkColumnDef", "stickyEnd"] }, { type: i1$9.CdkHeaderCellDef, selector: "[cdkHeaderCellDef]" }, { type: i1$9.CdkCellDef, selector: "[cdkCellDef]" }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: NovoDataTableHeaderCell, selector: "novo-data-table-header-cell", inputs: ["column"] }, { type: i1$9.CdkHeaderRowDef, selector: "[cdkHeaderRowDef]", inputs: ["cdkHeaderRowDef", "cdkHeaderRowDefSticky"] }, { type: i1$9.CdkRowDef, selector: "[cdkRowDef]", inputs: ["cdkRowDefColumns", "cdkRowDefWhen"] }, { type: NovoDataTableExpandDirective, selector: "[novoDataTableExpand]", inputs: ["row", "novoDataTableExpand"] }, { type: NovoTemplate, selector: "[novoTemplate]", inputs: ["type", "novoTemplate"] }, { type: TooltipDirective, selector: "[tooltip]", inputs: ["tooltip", "tooltipPosition", "tooltipType", "tooltipSize", "tooltipBounce", "tooltipNoAnimate", "tooltipRounded", "tooltipAlways", "tooltipActive", "tooltipPreline", "removeTooltipArrow", "tooltipAutoPosition", "tooltipIsHTML"] }], pipes: { "dataTableInterpolate": DataTableInterpolatePipe, "dataTableDateRenderer": DateTableDateRendererPipe, "dataTableDateTimeRenderer": DateTableDateTimeRendererPipe, "dataTableTimeRenderer": DateTableTimeRendererPipe, "dataTableCurrencyRenderer": DateTableCurrencyRendererPipe, "dataTableBigDecimalRenderer": DataTableBigDecimalRendererPipe, "dataTableNumberRenderer": DateTableNumberRendererPipe }, animations: [
         trigger('expand', [
             state('void', style({ height: '0px', minHeight: '0', visibility: 'hidden' })),
             state('*', style({ height: '*', visibility: 'visible' })),
@@ -42318,7 +42574,7 @@ NovoDatePickerInputElement.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0
         [weekStart]="weekStart"
       ></novo-date-picker>
     </novo-overlay-template>
-  `, isInline: true, components: [{ type: NovoOverlayTemplateComponent, selector: "novo-overlay-template", inputs: ["position", "scrollStrategy", "width", "height", "closeOnSelect", "hasBackdrop", "parent"], outputs: ["select", "opening", "closing"] }, { type: NovoDatePickerElement, selector: "novo-date-picker", inputs: ["minYear", "maxYear", "start", "end", "inline", "weekStart", "preselected", "hideOverflowDays", "hideFooter", "disabledDateMessage", "numberOfMonths", "mode", "range", "weekRangeSelect"], outputs: ["onSelect"] }], directives: [{ type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i6.MaskedInputDirective, selector: "[textMask]", inputs: ["textMask"], exportAs: ["textMask"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+  `, isInline: true, components: [{ type: NovoOverlayTemplateComponent, selector: "novo-overlay-template", inputs: ["position", "scrollStrategy", "width", "height", "closeOnSelect", "hasBackdrop", "parent"], outputs: ["select", "opening", "closing"] }, { type: NovoDatePickerElement, selector: "novo-date-picker", inputs: ["minYear", "maxYear", "start", "end", "inline", "weekStart", "preselected", "hideOverflowDays", "hideFooter", "disabledDateMessage", "numberOfMonths", "mode", "range", "weekRangeSelect"], outputs: ["onSelect"] }], directives: [{ type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i6.MaskedInputDirective, selector: "[textMask]", inputs: ["textMask"], exportAs: ["textMask"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoDatePickerInputElement, decorators: [{
             type: Component,
             args: [{
@@ -42655,7 +42911,7 @@ NovoDateRangeInputElement.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
         [weekStart]="weekStart"
       ></novo-date-picker>
     </novo-overlay-template>
-  `, isInline: true, components: [{ type: NovoIconComponent, selector: "novo-icon", inputs: ["raised", "theme", "shape", "color", "size", "smaller", "larger", "alt", "name"] }, { type: NovoOverlayTemplateComponent, selector: "novo-overlay-template", inputs: ["position", "scrollStrategy", "width", "height", "closeOnSelect", "hasBackdrop", "parent"], outputs: ["select", "opening", "closing"] }, { type: NovoDatePickerElement, selector: "novo-date-picker", inputs: ["minYear", "maxYear", "start", "end", "inline", "weekStart", "preselected", "hideOverflowDays", "hideFooter", "disabledDateMessage", "numberOfMonths", "mode", "range", "weekRangeSelect"], outputs: ["onSelect"] }], directives: [{ type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i6.MaskedInputDirective, selector: "[textMask]", inputs: ["textMask"], exportAs: ["textMask"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+  `, isInline: true, components: [{ type: NovoIconComponent, selector: "novo-icon", inputs: ["raised", "theme", "shape", "color", "size", "smaller", "larger", "alt", "name"] }, { type: NovoOverlayTemplateComponent, selector: "novo-overlay-template", inputs: ["position", "scrollStrategy", "width", "height", "closeOnSelect", "hasBackdrop", "parent"], outputs: ["select", "opening", "closing"] }, { type: NovoDatePickerElement, selector: "novo-date-picker", inputs: ["minYear", "maxYear", "start", "end", "inline", "weekStart", "preselected", "hideOverflowDays", "hideFooter", "disabledDateMessage", "numberOfMonths", "mode", "range", "weekRangeSelect"], outputs: ["onSelect"] }], directives: [{ type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i6.MaskedInputDirective, selector: "[textMask]", inputs: ["textMask"], exportAs: ["textMask"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoDateRangeInputElement, decorators: [{
             type: Component,
             args: [{
@@ -42929,7 +43185,7 @@ NovoMultiDateInputElement.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
         [weekStart]="weekStart"
       ></novo-date-picker>
     </novo-overlay-template>
-  `, isInline: true, components: [{ type: NovoChipList, selector: "novo-chip-list", inputs: ["errorStateMatcher", "multiple", "stacked", "compareWith", "value", "required", "placeholder", "disabled", "aria-orientation", "selectable", "tabIndex"], outputs: ["change", "valueChange"], exportAs: ["novoChipList"] }, { type: NovoChipElement, selector: "novo-chip, [novo-chip]", inputs: ["color", "tabIndex", "size", "type", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"] }, { type: NovoIconComponent, selector: "novo-icon", inputs: ["raised", "theme", "shape", "color", "size", "smaller", "larger", "alt", "name"] }, { type: NovoOverlayTemplateComponent, selector: "novo-overlay-template", inputs: ["position", "scrollStrategy", "width", "height", "closeOnSelect", "hasBackdrop", "parent"], outputs: ["select", "opening", "closing"] }, { type: NovoDatePickerElement, selector: "novo-date-picker", inputs: ["minYear", "maxYear", "start", "end", "inline", "weekStart", "preselected", "hideOverflowDays", "hideFooter", "disabledDateMessage", "numberOfMonths", "mode", "range", "weekRangeSelect"], outputs: ["onSelect"] }], directives: [{ type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: NovoChipRemove, selector: "[novoChipRemove]" }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "default": DefaultPipe, "date": i1.DatePipe } });
+  `, isInline: true, components: [{ type: NovoChipList, selector: "novo-chip-list", inputs: ["errorStateMatcher", "multiple", "stacked", "compareWith", "value", "required", "placeholder", "disabled", "aria-orientation", "selectable", "tabIndex"], outputs: ["change", "valueChange"], exportAs: ["novoChipList"] }, { type: NovoChipElement, selector: "novo-chip, [novo-chip]", inputs: ["color", "tabIndex", "size", "type", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"] }, { type: NovoIconComponent, selector: "novo-icon", inputs: ["raised", "theme", "shape", "color", "size", "smaller", "larger", "alt", "name"] }, { type: NovoOverlayTemplateComponent, selector: "novo-overlay-template", inputs: ["position", "scrollStrategy", "width", "height", "closeOnSelect", "hasBackdrop", "parent"], outputs: ["select", "opening", "closing"] }, { type: NovoDatePickerElement, selector: "novo-date-picker", inputs: ["minYear", "maxYear", "start", "end", "inline", "weekStart", "preselected", "hideOverflowDays", "hideFooter", "disabledDateMessage", "numberOfMonths", "mode", "range", "weekRangeSelect"], outputs: ["onSelect"] }], directives: [{ type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: NovoChipRemove, selector: "[novoChipRemove]" }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "default": DefaultPipe, "date": i1.DatePipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoMultiDateInputElement, decorators: [{
             type: Component,
             args: [{
@@ -43901,7 +44157,7 @@ NovoAddressElement.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ver
         [disablePickerInput]="disabled.countryID"
       ></novo-picker>
     </span>
-  `, isInline: true, components: [{ type: NovoPickerElement, selector: "novo-picker", inputs: ["config", "placeholder", "clearValueOnSelect", "closeOnSelect", "selected", "appendToBody", "parentScrollSelector", "parentScrollAction", "containerClass", "side", "autoSelectFirstOption", "overrideElement", "disablePickerInput"], outputs: ["changed", "select", "focus", "blur", "typing"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i5.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: TooltipDirective, selector: "[tooltip]", inputs: ["tooltip", "tooltipPosition", "tooltipType", "tooltipSize", "tooltipBounce", "tooltipNoAnimate", "tooltipRounded", "tooltipAlways", "tooltipActive", "tooltipPreline", "removeTooltipArrow", "tooltipAutoPosition", "tooltipIsHTML"] }] });
+  `, isInline: true, components: [{ type: NovoPickerElement, selector: "novo-picker", inputs: ["config", "placeholder", "clearValueOnSelect", "closeOnSelect", "selected", "appendToBody", "parentScrollSelector", "parentScrollAction", "containerClass", "side", "autoSelectFirstOption", "overrideElement", "disablePickerInput"], outputs: ["changed", "select", "focus", "blur", "typing"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4.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: i4.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: TooltipDirective, selector: "[tooltip]", inputs: ["tooltip", "tooltipPosition", "tooltipType", "tooltipSize", "tooltipBounce", "tooltipNoAnimate", "tooltipRounded", "tooltipAlways", "tooltipActive", "tooltipPreline", "removeTooltipArrow", "tooltipAutoPosition", "tooltipIsHTML"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoAddressElement, decorators: [{
             type: Component,
             args: [{
@@ -44379,7 +44635,7 @@ class NovoFileInputElement extends NovoFileInputMixins {
         // TODO
     }
 }
-NovoFileInputElement.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoFileInputElement, deps: [{ token: i0.ElementRef }, { token: NovoLabelService }, { token: NovoDragulaService }, { token: ErrorStateMatcher }, { token: i5.NgForm, optional: true }, { token: i5.FormGroupDirective, optional: true }, { token: i5.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
+NovoFileInputElement.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoFileInputElement, deps: [{ token: i0.ElementRef }, { token: NovoLabelService }, { token: NovoDragulaService }, { token: ErrorStateMatcher }, { token: i4.NgForm, optional: true }, { token: i4.FormGroupDirective, optional: true }, { token: i4.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
 NovoFileInputElement.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NovoFileInputElement, selector: "novo-file-input", inputs: { id: "id", tabindex: "tabindex", errorStateMatcher: "errorStateMatcher", multiple: "multiple", layoutOptions: "layoutOptions", value: "value", dataFeatureId: "dataFeatureId", name: "name", disabled: "disabled", required: "required", placeholder: "placeholder" }, outputs: { edit: "edit", save: "save", delete: "delete", upload: "upload" }, host: { properties: { "class.disabled": "this.disabled" } }, providers: [{ provide: NovoFieldControl, useExisting: NovoFileInputElement }], viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true, static: true }, { propertyName: "fileOutput", first: true, predicate: ["fileOutput"], descendants: true, static: true }, { propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef, static: true }, { propertyName: "inputElement", first: true, predicate: ["inputElement"], descendants: true }], usesInheritance: true, ngImport: i0, template: `
     <div #container></div>
     <ng-template #fileInput>
@@ -44603,11 +44859,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
 `,
                 }]
         }], ctorParameters: function () {
-        return [{ type: i0.ElementRef }, { type: NovoLabelService }, { type: NovoDragulaService }, { type: ErrorStateMatcher }, { type: i5.NgForm, decorators: [{
+        return [{ type: i0.ElementRef }, { type: NovoLabelService }, { type: NovoDragulaService }, { type: ErrorStateMatcher }, { type: i4.NgForm, decorators: [{
                         type: Optional
-                    }] }, { type: i5.FormGroupDirective, decorators: [{
+                    }] }, { type: i4.FormGroupDirective, decorators: [{
                         type: Optional
-                    }] }, { type: i5.NgControl, decorators: [{
+                    }] }, { type: i4.NgControl, decorators: [{
                         type: Optional
                     }, {
                         type: Self
@@ -45781,6 +46037,9 @@ class NovoDateTimePickerElement {
     toggleView(tab) {
         this.componentTabState = tab;
     }
+    onModelChange(event) {
+        this.model = this.createFullDateValue(this.datePickerValue, event);
+    }
     setDateLabels(value) {
         this.selectedLabel = this.labels.formatDateWithFormat(value, {
             month: 'short',
@@ -45884,11 +46143,11 @@ NovoDateTimePickerElement.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
           ></novo-date-picker>
         </div>
         <div class="time-picker">
-          <novo-time-picker (onSelect)="onTimeSelected($event)" [(ngModel)]="model" [military]="military" inline="true"></novo-time-picker>
+          <novo-time-picker (onSelect)="onTimeSelected($event)" [(ngModel)]="model" (ngModelChange)="onModelChange($event)" [military]="military" inline="true"></novo-time-picker>
         </div>
       </div>
     </div>
-  `, isInline: true, components: [{ type: NovoDatePickerElement, selector: "novo-date-picker", inputs: ["minYear", "maxYear", "start", "end", "inline", "weekStart", "preselected", "hideOverflowDays", "hideFooter", "disabledDateMessage", "numberOfMonths", "mode", "range", "weekRangeSelect"], outputs: ["onSelect"] }, { type: NovoTimePickerElement, selector: "novo-time-picker", inputs: ["military", "analog", "inline", "step"], outputs: ["onSelect"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], animations: [
+  `, isInline: true, components: [{ type: NovoDatePickerElement, selector: "novo-date-picker", inputs: ["minYear", "maxYear", "start", "end", "inline", "weekStart", "preselected", "hideOverflowDays", "hideFooter", "disabledDateMessage", "numberOfMonths", "mode", "range", "weekRangeSelect"], outputs: ["onSelect"] }, { type: NovoTimePickerElement, selector: "novo-time-picker", inputs: ["military", "analog", "inline", "step"], outputs: ["onSelect"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], animations: [
         trigger('dateTextState', [
             state('date', style({
                 opacity: '1.0',
@@ -46006,7 +46265,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
           ></novo-date-picker>
         </div>
         <div class="time-picker">
-          <novo-time-picker (onSelect)="onTimeSelected($event)" [(ngModel)]="model" [military]="military" inline="true"></novo-time-picker>
+          <novo-time-picker (onSelect)="onTimeSelected($event)" [(ngModel)]="model" (ngModelChange)="onModelChange($event)" [military]="military" inline="true"></novo-time-picker>
         </div>
       </div>
     </div>
@@ -46309,7 +46568,7 @@ NovoTimePickerInputElement.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0
         [military]="military"
       ></novo-time-picker>
     </novo-overlay-template>
-  `, isInline: true, components: [{ type: NovoOverlayTemplateComponent, selector: "novo-overlay-template", inputs: ["position", "scrollStrategy", "width", "height", "closeOnSelect", "hasBackdrop", "parent"], outputs: ["select", "opening", "closing"] }, { type: NovoTimePickerElement, selector: "novo-time-picker", inputs: ["military", "analog", "inline", "step"], outputs: ["onSelect"] }], directives: [{ type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1$7.IMaskDirective, selector: "[imask]", inputs: ["imaskElement", "imask", "unmask"], outputs: ["accept", "complete"], exportAs: ["imask"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+  `, isInline: true, components: [{ type: NovoOverlayTemplateComponent, selector: "novo-overlay-template", inputs: ["position", "scrollStrategy", "width", "height", "closeOnSelect", "hasBackdrop", "parent"], outputs: ["select", "opening", "closing"] }, { type: NovoTimePickerElement, selector: "novo-time-picker", inputs: ["military", "analog", "inline", "step"], outputs: ["onSelect"] }], directives: [{ type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1$7.IMaskDirective, selector: "[imask]", inputs: ["imaskElement", "imask", "unmask"], outputs: ["accept", "complete"], exportAs: ["imask"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoTimePickerInputElement, decorators: [{
             type: Component,
             args: [{
@@ -46506,7 +46765,7 @@ NovoDateTimePickerInputElement.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
       (focusEvent)="handleFocus($event)"
       [disabled]="disabled"
     ></novo-time-picker-input>
-  `, isInline: true, components: [{ type: NovoDatePickerInputElement, selector: "novo-date-picker-input", inputs: ["name", "start", "end", "placeholder", "maskOptions", "format", "textMaskEnabled", "allowInvalidDate", "disabled", "disabledDateMessage", "weekStart"], outputs: ["blurEvent", "focusEvent", "changeEvent"] }, { type: NovoTimePickerInputElement, selector: "novo-time-picker-input", inputs: ["name", "placeholder", "military", "maskOptions", "disabled", "analog"], outputs: ["blurEvent", "focusEvent"] }], directives: [{ type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
+  `, isInline: true, components: [{ type: NovoDatePickerInputElement, selector: "novo-date-picker-input", inputs: ["name", "start", "end", "placeholder", "maskOptions", "format", "textMaskEnabled", "allowInvalidDate", "disabled", "disabledDateMessage", "weekStart"], outputs: ["blurEvent", "focusEvent", "changeEvent"] }, { type: NovoTimePickerInputElement, selector: "novo-time-picker-input", inputs: ["name", "placeholder", "military", "maskOptions", "disabled", "analog"], outputs: ["blurEvent", "focusEvent"] }], directives: [{ type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoDateTimePickerInputElement, decorators: [{
             type: Component,
             args: [{
@@ -47991,11 +48250,11 @@ FieldInteractionApi.FIELD_POSITIONS = {
     TOP_OF_FORM: 'TOP_OF_FORM',
     BOTTOM_OF_FORM: 'BOTTOM_OF_FORM',
 };
-FieldInteractionApi.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: FieldInteractionApi, deps: [{ token: NovoToastService }, { token: NovoModalService }, { token: FormUtils }, { token: i4.HttpClient }, { token: NovoLabelService }], target: i0.ɵɵFactoryTarget.Injectable });
+FieldInteractionApi.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: FieldInteractionApi, deps: [{ token: NovoToastService }, { token: NovoModalService }, { token: FormUtils }, { token: i4$1.HttpClient }, { token: NovoLabelService }], target: i0.ɵɵFactoryTarget.Injectable });
 FieldInteractionApi.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: FieldInteractionApi });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: FieldInteractionApi, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: NovoToastService }, { type: NovoModalService }, { type: FormUtils }, { type: i4.HttpClient }, { type: NovoLabelService }]; } });
+        }], ctorParameters: function () { return [{ type: NovoToastService }, { type: NovoModalService }, { type: FormUtils }, { type: i4$1.HttpClient }, { type: NovoLabelService }]; } });
 
 // NG2
 class NovoTipWellElement {
@@ -49295,7 +49554,7 @@ class NovoControlGroup {
         this.ref.markForCheck();
     }
 }
-NovoControlGroup.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoControlGroup, deps: [{ token: FormUtils }, { token: i5.FormBuilder }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+NovoControlGroup.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoControlGroup, deps: [{ token: FormUtils }, { token: i4.FormBuilder }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
 NovoControlGroup.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NovoControlGroup, selector: "novo-control-group", inputs: { appearance: "appearance", vertical: "vertical", stacked: "stacked", add: "add", remove: "remove", edit: "edit", collapsible: "collapsible", form: "form", controls: "controls", key: "key", label: "label", description: "description", emptyMessage: "emptyMessage", icon: "icon", editIcon: "editIcon", removeIcon: "removeIcon", initialValue: "initialValue", canEdit: "canEdit", canRemove: "canRemove", shouldRemove: "shouldRemove", rowTemplate: "rowTemplate", columnLabelTemplate: "columnLabelTemplate" }, outputs: { onRemove: "onRemove", onEdit: "onEdit", onAdd: "onAdd", change: "change" }, host: { properties: { "class.novo-control-group-appearance-card": "appearance=='card'", "class.novo-control-group-appearance-none": "appearance=='none'" } }, usesOnChanges: true, ngImport: i0, template: "<h6 class=\"novo-section-header\" *ngIf=\"label\">\n  <span (click)=\"toggle($event)\" [class.clickable]=\"collapsible\">\n    <i *ngIf=\"icon && !collapsible\" [ngClass]=\"icon\" [attr.data-automation-id]=\"'novo-control-group-icon-' + key\"></i>\n    <i *ngIf=\"collapsible\" class=\"bhi-next\" [class.toggled]=\"toggled\"\n      [attr.data-automation-id]=\"'novo-control-group-collapse-' + key\"></i>\n    <span [attr.data-automation-id]=\"'novo-control-group-label-' + key\">{{ label }}</span>\n  </span>\n  <label class=\"novo-control-group-description\" *ngIf=\"description\"\n    [attr.data-automation-id]=\"'novo-control-group-description-' + key\">{{ description }}</label>\n</h6>\n<div class=\"novo-control-group-controls\" [class.vertical]=\"vertical\" [class.horizontal]=\"!vertical\"\n  [class.hidden]=\"collapsible && !toggled\">\n\n  <ng-template #defaultTemplate let-index=\"index\" let-form=\"form\" let-key=\"key\">\n    <div class=\"novo-control-group-control\">\n      <div *ngFor=\"let c of controls\" class=\"novo-control-container {{c.key}}\"\n        [class.is-label]=\"c.controlType === 'read-only'\" [style.max-width.px]=\"c.width\">\n        <novo-control (change)=\"onChange()\" [form]=\"(form?.controls)[key]['controls'][index]\" [control]=\"c\"\n          [condensed]=\"!vertical || c.controlType === 'read-only'\"></novo-control>\n      </div>\n      <div class=\"novo-control-container edit last\" *ngIf=\"edit && !vertical\">\n        <novo-button class=\"control-group-action\" [disabled]=\"!disabledArray[index].edit\" type=\"button\"\n          *ngIf=\"edit && !vertical\" theme=\"icon\" [icon]=\"editIcon\"\n          (click)=\"editControl(index)\" [attr.data-automation-id]=\"'novo-control-group-edit-' + key\" index=\"-1\">\n        </novo-button>\n      </div>\n      <div class=\"novo-control-container remove last\" *ngIf=\"remove && !vertical\">\n        <novo-button class=\"control-group-action\" [disabled]=\"!disabledArray[index].remove\" type=\"button\"\n          *ngIf=\"remove && !vertical\" theme=\"icon\"\n          [icon]=\"removeIcon\" (click)=\"removeControl(index)\"\n          [attr.data-automation-id]=\"'novo-control-group-delete-' + key\"\n          index=\"-1\">\n        </novo-button>\n      </div>\n    </div>\n    <novo-button class=\"control-group-action\" [disabled]=\"!disabledArray[index].edit\" type=\"button\"\n      *ngIf=\"edit && vertical\"\n      theme=\"icon\" [icon]=\"editIcon\"\n      (click)=\"editControl(index)\" [attr.data-automation-id]=\"'novo-control-group-edit-' + key\" index=\"-1\">\n    </novo-button>\n    <novo-button class=\"control-group-action\" [disabled]=\"!disabledArray[index].remove\" type=\"button\"\n      *ngIf=\"remove && vertical\" theme=\"icon\"\n      [icon]=\"removeIcon\" (click)=\"removeControl(index)\"\n      [attr.data-automation-id]=\"'novo-control-group-delete-' + key\"\n      index=\"-1\">\n    </novo-button>\n  </ng-template>\n\n  <ng-template #defaultColumnLabelTemplate let-form=\"form\" let-key=\"key\">\n    <div *ngFor=\"let label of controlLabels\"\n      class=\"novo-control-group-control-label {{ label.key }}\"\n      [class.novo-control-group-control-hidden]=\"label.hidden\"\n      [style.max-width.px]=\"label.width\" [class.column-required]=\"label.required\">\n      <span [attr.data-automation-id]=\"'novo-control-group-label-' + label.value\">{{ label.value }}</span>\n    </div>\n    <div class=\"novo-control-group-control-label edit last\" *ngIf=\"edit\"\n      [attr.data-automation-id]=\"'novo-control-group-edit-' + key\"></div>\n    <div class=\"novo-control-group-control-label remove last\" *ngIf=\"remove\"\n      [attr.data-automation-id]=\"'novo-control-group-delete-' + key\"></div>\n  </ng-template>\n\n  <ng-container *ngIf=\"!vertical && (form?.controls)[key] && (form?.controls)[key]['controls'].length !== 0\">\n    <div class=\"novo-control-group-labels\"\n      *ngIf=\"!vertical && (form?.controls)[key] && (form?.controls)[key]['controls'].length !== 0\">\n      <ng-template [ngTemplateOutlet]=\"columnLabelTemplate || defaultColumnLabelTemplate\"\n        [ngTemplateOutletContext]=\"{ form: form, key: key, controlLabels: controlLabels }\">\n      </ng-template>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"(form?.controls)[key]\">\n    <div class=\"novo-control-group-row\"\n      *ngFor=\"let control of (form?.controls)[key]['controls']; let index = index\">\n      <ng-template [ngTemplateOutlet]=\"rowTemplate || defaultTemplate\"\n        [ngTemplateOutletContext]=\"{ form: form, formGroup: control, index: index, key: key, controls: controls }\">\n      </ng-template>\n    </div>\n  </ng-container>\n\n  <div class=\"novo-control-group-empty\"\n    *ngIf=\"(form?.controls)[key] && (form?.controls)[key]['controls'].length === 0\"\n    [attr.data-automation-id]=\"'novo-control-group-empty-' + key\">\n    {{ emptyMessage }}\n  </div>\n\n  <div *ngIf=\"add\" class=\"novo-control-group-footer\">\n    <novo-button type=\"button\" theme=\"dialogue\" icon=\"add-thin\" side=\"left\" (click)=\"onClickAdd()\"\n      [attr.data-automation-id]=\"'novo-control-group-bottom-add-' + key\" index=\"-1\">\n      {{ add?.label }}\n    </novo-button>\n    <!-- <novo-button *ngIf=\"editState==='editing'\" type=\"button\" theme=\"dialogue\" icon=\"close\" side=\"left\"\n                  (click)=\"onClickCancel()\" [attr.data-automation-id]=\"'novo-control-group-bottom-cancel-' + key\"\n                  index=\"-1\">\n                {{ 'cancel' }}\n                </novo-button>\n                  <novo-button *ngIf=\"editState==='editing'\" type=\"button\" theme=\"dialogue\" icon=\"check\" side=\"left\"\n                  (click)=\"onClickSave()\" [attr.data-automation-id]=\"'novo-control-group-bottom-save-' + key\"\n                  index=\"-1\">\n                {{ add?.label }}\n                </novo-button> -->\n  </div>\n</div>\n", components: [{ type: NovoControlElement, selector: "novo-control", inputs: ["control", "form", "condensed", "autoFocus"], outputs: ["change", "edit", "save", "delete", "upload", "blur", "focus"] }, { type: NovoButtonElement, selector: "novo-button,button[theme]", inputs: ["color", "side", "size", "theme", "loading", "icon", "disabled"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: ThemeColorDirective, selector: "[theme]", inputs: ["theme"] }, { type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoControlGroup, decorators: [{
             type: Component,
@@ -49303,7 +49562,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                         '[class.novo-control-group-appearance-card]': "appearance=='card'",
                         '[class.novo-control-group-appearance-none]': "appearance=='none'",
                     }, template: "<h6 class=\"novo-section-header\" *ngIf=\"label\">\n  <span (click)=\"toggle($event)\" [class.clickable]=\"collapsible\">\n    <i *ngIf=\"icon && !collapsible\" [ngClass]=\"icon\" [attr.data-automation-id]=\"'novo-control-group-icon-' + key\"></i>\n    <i *ngIf=\"collapsible\" class=\"bhi-next\" [class.toggled]=\"toggled\"\n      [attr.data-automation-id]=\"'novo-control-group-collapse-' + key\"></i>\n    <span [attr.data-automation-id]=\"'novo-control-group-label-' + key\">{{ label }}</span>\n  </span>\n  <label class=\"novo-control-group-description\" *ngIf=\"description\"\n    [attr.data-automation-id]=\"'novo-control-group-description-' + key\">{{ description }}</label>\n</h6>\n<div class=\"novo-control-group-controls\" [class.vertical]=\"vertical\" [class.horizontal]=\"!vertical\"\n  [class.hidden]=\"collapsible && !toggled\">\n\n  <ng-template #defaultTemplate let-index=\"index\" let-form=\"form\" let-key=\"key\">\n    <div class=\"novo-control-group-control\">\n      <div *ngFor=\"let c of controls\" class=\"novo-control-container {{c.key}}\"\n        [class.is-label]=\"c.controlType === 'read-only'\" [style.max-width.px]=\"c.width\">\n        <novo-control (change)=\"onChange()\" [form]=\"(form?.controls)[key]['controls'][index]\" [control]=\"c\"\n          [condensed]=\"!vertical || c.controlType === 'read-only'\"></novo-control>\n      </div>\n      <div class=\"novo-control-container edit last\" *ngIf=\"edit && !vertical\">\n        <novo-button class=\"control-group-action\" [disabled]=\"!disabledArray[index].edit\" type=\"button\"\n          *ngIf=\"edit && !vertical\" theme=\"icon\" [icon]=\"editIcon\"\n          (click)=\"editControl(index)\" [attr.data-automation-id]=\"'novo-control-group-edit-' + key\" index=\"-1\">\n        </novo-button>\n      </div>\n      <div class=\"novo-control-container remove last\" *ngIf=\"remove && !vertical\">\n        <novo-button class=\"control-group-action\" [disabled]=\"!disabledArray[index].remove\" type=\"button\"\n          *ngIf=\"remove && !vertical\" theme=\"icon\"\n          [icon]=\"removeIcon\" (click)=\"removeControl(index)\"\n          [attr.data-automation-id]=\"'novo-control-group-delete-' + key\"\n          index=\"-1\">\n        </novo-button>\n      </div>\n    </div>\n    <novo-button class=\"control-group-action\" [disabled]=\"!disabledArray[index].edit\" type=\"button\"\n      *ngIf=\"edit && vertical\"\n      theme=\"icon\" [icon]=\"editIcon\"\n      (click)=\"editControl(index)\" [attr.data-automation-id]=\"'novo-control-group-edit-' + key\" index=\"-1\">\n    </novo-button>\n    <novo-button class=\"control-group-action\" [disabled]=\"!disabledArray[index].remove\" type=\"button\"\n      *ngIf=\"remove && vertical\" theme=\"icon\"\n      [icon]=\"removeIcon\" (click)=\"removeControl(index)\"\n      [attr.data-automation-id]=\"'novo-control-group-delete-' + key\"\n      index=\"-1\">\n    </novo-button>\n  </ng-template>\n\n  <ng-template #defaultColumnLabelTemplate let-form=\"form\" let-key=\"key\">\n    <div *ngFor=\"let label of controlLabels\"\n      class=\"novo-control-group-control-label {{ label.key }}\"\n      [class.novo-control-group-control-hidden]=\"label.hidden\"\n      [style.max-width.px]=\"label.width\" [class.column-required]=\"label.required\">\n      <span [attr.data-automation-id]=\"'novo-control-group-label-' + label.value\">{{ label.value }}</span>\n    </div>\n    <div class=\"novo-control-group-control-label edit last\" *ngIf=\"edit\"\n      [attr.data-automation-id]=\"'novo-control-group-edit-' + key\"></div>\n    <div class=\"novo-control-group-control-label remove last\" *ngIf=\"remove\"\n      [attr.data-automation-id]=\"'novo-control-group-delete-' + key\"></div>\n  </ng-template>\n\n  <ng-container *ngIf=\"!vertical && (form?.controls)[key] && (form?.controls)[key]['controls'].length !== 0\">\n    <div class=\"novo-control-group-labels\"\n      *ngIf=\"!vertical && (form?.controls)[key] && (form?.controls)[key]['controls'].length !== 0\">\n      <ng-template [ngTemplateOutlet]=\"columnLabelTemplate || defaultColumnLabelTemplate\"\n        [ngTemplateOutletContext]=\"{ form: form, key: key, controlLabels: controlLabels }\">\n      </ng-template>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"(form?.controls)[key]\">\n    <div class=\"novo-control-group-row\"\n      *ngFor=\"let control of (form?.controls)[key]['controls']; let index = index\">\n      <ng-template [ngTemplateOutlet]=\"rowTemplate || defaultTemplate\"\n        [ngTemplateOutletContext]=\"{ form: form, formGroup: control, index: index, key: key, controls: controls }\">\n      </ng-template>\n    </div>\n  </ng-container>\n\n  <div class=\"novo-control-group-empty\"\n    *ngIf=\"(form?.controls)[key] && (form?.controls)[key]['controls'].length === 0\"\n    [attr.data-automation-id]=\"'novo-control-group-empty-' + key\">\n    {{ emptyMessage }}\n  </div>\n\n  <div *ngIf=\"add\" class=\"novo-control-group-footer\">\n    <novo-button type=\"button\" theme=\"dialogue\" icon=\"add-thin\" side=\"left\" (click)=\"onClickAdd()\"\n      [attr.data-automation-id]=\"'novo-control-group-bottom-add-' + key\" index=\"-1\">\n      {{ add?.label }}\n    </novo-button>\n    <!-- <novo-button *ngIf=\"editState==='editing'\" type=\"button\" theme=\"dialogue\" icon=\"close\" side=\"left\"\n                  (click)=\"onClickCancel()\" [attr.data-automation-id]=\"'novo-control-group-bottom-cancel-' + key\"\n                  index=\"-1\">\n                {{ 'cancel' }}\n                </novo-button>\n                  <novo-button *ngIf=\"editState==='editing'\" type=\"button\" theme=\"dialogue\" icon=\"check\" side=\"left\"\n                  (click)=\"onClickSave()\" [attr.data-automation-id]=\"'novo-control-group-bottom-save-' + key\"\n                  index=\"-1\">\n                {{ add?.label }}\n                </novo-button> -->\n  </div>\n</div>\n" }]
-        }], ctorParameters: function () { return [{ type: FormUtils }, { type: i5.FormBuilder }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { appearance: [{
+        }], ctorParameters: function () { return [{ type: FormUtils }, { type: i4.FormBuilder }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { appearance: [{
                 type: Input
             }], vertical: [{
                 type: Input
@@ -51034,7 +51293,7 @@ NovoControlTemplates.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
         ></novo-quick-note>
       </div>
     </ng-template>
-  `, isInline: true, components: [{ type: NovoCKEditorElement, selector: "novo-editor", inputs: ["config", "debounce", "name", "minimal", "startupFocus", "fileBrowserImageUploadUrl", "disabled", "value"], outputs: ["change", "ready", "blur", "focus", "paste", "loaded"] }, { type: NovoAceEditor, selector: "novo-ace-editor", inputs: ["theme", "options", "mode", "name"], outputs: ["blur", "focus"] }, { type: NovoFileInputElement, selector: "novo-file-input", inputs: ["id", "tabindex", "errorStateMatcher", "multiple", "layoutOptions", "value", "dataFeatureId", "name", "disabled", "required", "placeholder"], outputs: ["edit", "save", "delete", "upload"] }, { type: NovoTilesElement, selector: "novo-tiles", inputs: ["name", "options", "required", "controlDisabled"], outputs: ["onChange", "onSelectedOptionClick", "onDisabledOptionClick"] }, { type: NovoPickerElement, selector: "novo-picker", inputs: ["config", "placeholder", "clearValueOnSelect", "closeOnSelect", "selected", "appendToBody", "parentScrollSelector", "parentScrollAction", "containerClass", "side", "autoSelectFirstOption", "overrideElement", "disablePickerInput"], outputs: ["changed", "select", "focus", "blur", "typing"] }, { type: NovoChipsElement, selector: "chips,novo-chips", inputs: ["closeOnSelect", "placeholder", "source", "maxlength", "type", "disablePickerInput", "value"], outputs: ["changed", "focus", "blur", "typing"] }, { type: NovoRowChipsElement, selector: "novo-row-chips", inputs: ["closeOnSelect"] }, { type: NovoSelectElement, selector: "novo-select", inputs: ["disabled", "required", "tabIndex", "id", "name", "options", "placeholder", "readonly", "headerConfig", "position", "overlayWidth", "overlayHeight", "displayWith", "compareWith", "value", "multiple"], outputs: ["onSelect", "selectionChange", "valueChange", "openedChange", "opened", "closed"] }, { type: NovoRadioGroup, selector: "novo-radio-group", inputs: ["id", "tabindex", "errorStateMatcher", "appearance", "value", "name", "disabled", "required", "placeholder"], outputs: ["change", "blur"] }, { type: NovoRadioElement, selector: "novo-radio", inputs: ["id", "name", "tabindex", "vertical", "label", "button", "theme", "size", "icon", "color", "checked", "value", "disabled"], outputs: ["change", "blur", "focus"] }, { type: NovoTimePickerInputElement, selector: "novo-time-picker-input", inputs: ["name", "placeholder", "military", "maskOptions", "disabled", "analog"], outputs: ["blurEvent", "focusEvent"] }, { type: NovoDatePickerInputElement, selector: "novo-date-picker-input", inputs: ["name", "start", "end", "placeholder", "maskOptions", "format", "textMaskEnabled", "allowInvalidDate", "disabled", "disabledDateMessage", "weekStart"], outputs: ["blurEvent", "focusEvent", "changeEvent"] }, { type: NovoDateTimePickerInputElement, selector: "novo-date-time-picker-input", inputs: ["name", "start", "end", "placeholder", "maskOptions", "military", "disabled", "format", "weekStart", "disabledDateMessage"], outputs: ["blurEvent", "focusEvent", "changeEvent"] }, { type: NovoAddressElement, selector: "novo-address", inputs: ["config", "readOnly"], outputs: ["change", "focus", "blur", "validityChange"] }, { type: NovoCheckboxElement, selector: "novo-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "name", "label", "disabled", "layoutOptions", "color", "value", "tabIndex", "required", "checked", "indeterminate"], outputs: ["change", "indeterminateChange", "onSelect"] }, { type: NovoSwitchElement, selector: "novo-switch", inputs: ["theme", "icons", "disabled"], outputs: ["onChange"] }, { type: NovoCheckListElement, selector: "novo-check-list", inputs: ["name", "options", "disabled"], outputs: ["onSelect"] }, { type: QuickNoteElement, selector: "novo-quick-note", inputs: ["config", "startupFocus", "placeholder"], outputs: ["focus", "blur", "change"] }], directives: [{ type: NovoTemplate, selector: "[novoTemplate]", inputs: ["type", "novoTemplate"] }, { type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: TooltipDirective, selector: "[tooltip]", inputs: ["tooltip", "tooltipPosition", "tooltipType", "tooltipSize", "tooltipBounce", "tooltipNoAnimate", "tooltipRounded", "tooltipAlways", "tooltipActive", "tooltipPreline", "removeTooltipArrow", "tooltipAutoPosition", "tooltipIsHTML"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i6.MaskedInputDirective, selector: "[textMask]", inputs: ["textMask"], exportAs: ["textMask"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i5.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { type: NovoAutoSize, selector: "textarea[autosize]" }, { type: i5.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i5.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i5.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: ThemeColorDirective, selector: "[theme]", inputs: ["theme"] }] });
+  `, isInline: true, components: [{ type: NovoCKEditorElement, selector: "novo-editor", inputs: ["config", "debounce", "name", "minimal", "startupFocus", "fileBrowserImageUploadUrl", "disabled", "value"], outputs: ["change", "ready", "blur", "focus", "paste", "loaded"] }, { type: NovoAceEditor, selector: "novo-ace-editor", inputs: ["theme", "options", "mode", "name"], outputs: ["blur", "focus"] }, { type: NovoFileInputElement, selector: "novo-file-input", inputs: ["id", "tabindex", "errorStateMatcher", "multiple", "layoutOptions", "value", "dataFeatureId", "name", "disabled", "required", "placeholder"], outputs: ["edit", "save", "delete", "upload"] }, { type: NovoTilesElement, selector: "novo-tiles", inputs: ["name", "options", "required", "controlDisabled"], outputs: ["onChange", "onSelectedOptionClick", "onDisabledOptionClick"] }, { type: NovoPickerElement, selector: "novo-picker", inputs: ["config", "placeholder", "clearValueOnSelect", "closeOnSelect", "selected", "appendToBody", "parentScrollSelector", "parentScrollAction", "containerClass", "side", "autoSelectFirstOption", "overrideElement", "disablePickerInput"], outputs: ["changed", "select", "focus", "blur", "typing"] }, { type: NovoChipsElement, selector: "chips,novo-chips", inputs: ["closeOnSelect", "placeholder", "source", "maxlength", "type", "disablePickerInput", "value"], outputs: ["changed", "focus", "blur", "typing"] }, { type: NovoRowChipsElement, selector: "novo-row-chips", inputs: ["closeOnSelect"] }, { type: NovoSelectElement, selector: "novo-select", inputs: ["disabled", "required", "tabIndex", "id", "name", "options", "placeholder", "readonly", "headerConfig", "position", "overlayWidth", "overlayHeight", "displayWith", "compareWith", "value", "multiple"], outputs: ["onSelect", "selectionChange", "valueChange", "openedChange", "opened", "closed"] }, { type: NovoRadioGroup, selector: "novo-radio-group", inputs: ["id", "tabindex", "errorStateMatcher", "appearance", "value", "name", "disabled", "required", "placeholder"], outputs: ["change", "blur"] }, { type: NovoRadioElement, selector: "novo-radio", inputs: ["id", "name", "tabindex", "vertical", "label", "button", "theme", "size", "icon", "color", "checked", "value", "disabled"], outputs: ["change", "blur", "focus"] }, { type: NovoTimePickerInputElement, selector: "novo-time-picker-input", inputs: ["name", "placeholder", "military", "maskOptions", "disabled", "analog"], outputs: ["blurEvent", "focusEvent"] }, { type: NovoDatePickerInputElement, selector: "novo-date-picker-input", inputs: ["name", "start", "end", "placeholder", "maskOptions", "format", "textMaskEnabled", "allowInvalidDate", "disabled", "disabledDateMessage", "weekStart"], outputs: ["blurEvent", "focusEvent", "changeEvent"] }, { type: NovoDateTimePickerInputElement, selector: "novo-date-time-picker-input", inputs: ["name", "start", "end", "placeholder", "maskOptions", "military", "disabled", "format", "weekStart", "disabledDateMessage"], outputs: ["blurEvent", "focusEvent", "changeEvent"] }, { type: NovoAddressElement, selector: "novo-address", inputs: ["config", "readOnly"], outputs: ["change", "focus", "blur", "validityChange"] }, { type: NovoCheckboxElement, selector: "novo-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "name", "label", "disabled", "layoutOptions", "color", "value", "tabIndex", "required", "checked", "indeterminate"], outputs: ["change", "indeterminateChange", "onSelect"] }, { type: NovoSwitchElement, selector: "novo-switch", inputs: ["theme", "icons", "disabled"], outputs: ["onChange"] }, { type: NovoCheckListElement, selector: "novo-check-list", inputs: ["name", "options", "disabled"], outputs: ["onSelect"] }, { type: QuickNoteElement, selector: "novo-quick-note", inputs: ["config", "startupFocus", "placeholder"], outputs: ["focus", "blur", "change"] }], directives: [{ type: NovoTemplate, selector: "[novoTemplate]", inputs: ["type", "novoTemplate"] }, { type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: TooltipDirective, selector: "[tooltip]", inputs: ["tooltip", "tooltipPosition", "tooltipType", "tooltipSize", "tooltipBounce", "tooltipNoAnimate", "tooltipRounded", "tooltipAlways", "tooltipActive", "tooltipPreline", "removeTooltipArrow", "tooltipAutoPosition", "tooltipIsHTML"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.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.MaskedInputDirective, selector: "[textMask]", inputs: ["textMask"], exportAs: ["textMask"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i4.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { type: NovoAutoSize, selector: "textarea[autosize]" }, { type: i4.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: ThemeColorDirective, selector: "[theme]", inputs: ["theme"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoControlTemplates, decorators: [{
             type: Component,
             args: [{
@@ -51819,7 +52078,7 @@ NovoDynamicFormElement.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0",
         </ng-container>
       </form>
     </div>
-  `, isInline: true, components: [{ type: NovoControlTemplates, selector: "novo-control-templates" }, { type: NovoFieldsetElement, selector: "novo-fieldset", inputs: ["controls", "form", "title", "icon", "index", "autoFocus", "isEmbedded", "isInlineEmbedded", "hidden"] }], directives: [{ type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+  `, isInline: true, components: [{ type: NovoControlTemplates, selector: "novo-control-templates" }, { type: NovoFieldsetElement, selector: "novo-fieldset", inputs: ["controls", "form", "title", "icon", "index", "autoFocus", "isEmbedded", "isInlineEmbedded", "hidden"] }], directives: [{ type: i4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoDynamicFormElement, decorators: [{
             type: Component,
             args: [{
@@ -51940,7 +52199,7 @@ NovoFormElement.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versio
         <ng-content></ng-content>
       </form>
     </div>
-  `, isInline: true, components: [{ type: NovoControlTemplates, selector: "novo-control-templates" }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] });
+  `, isInline: true, components: [{ type: NovoControlTemplates, selector: "novo-control-templates" }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoFormElement, decorators: [{
             type: Component,
             args: [{
@@ -52245,6 +52504,7 @@ NovoFormModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version:
         NovoChipsModule,
         NovoDatePickerModule,
         NovoTimePickerModule,
+        NovoDateTimePickerModule,
         NovoNovoCKEditorModule,
         NovoFormExtrasModule,
         NovoQuickNoteModule,
@@ -52280,6 +52540,7 @@ NovoFormModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version:
             NovoChipsModule,
             NovoDatePickerModule,
             NovoTimePickerModule,
+            NovoDateTimePickerModule,
             NovoNovoCKEditorModule,
             NovoFormExtrasModule,
             NovoQuickNoteModule,
@@ -52313,6 +52574,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                         NovoChipsModule,
                         NovoDatePickerModule,
                         NovoTimePickerModule,
+                        NovoDateTimePickerModule,
                         NovoNovoCKEditorModule,
                         NovoFormExtrasModule,
                         NovoQuickNoteModule,
@@ -54807,12 +55069,12 @@ class GooglePlacesService {
         });
     }
 }
-GooglePlacesService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GooglePlacesService, deps: [{ token: i4.HttpClient }, { token: PLATFORM_ID }, { token: GlobalRef }, { token: LocalStorageService }], target: i0.ɵɵFactoryTarget.Injectable });
+GooglePlacesService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GooglePlacesService, deps: [{ token: i4$1.HttpClient }, { token: PLATFORM_ID }, { token: GlobalRef }, { token: LocalStorageService }], target: i0.ɵɵFactoryTarget.Injectable });
 GooglePlacesService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GooglePlacesService });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: GooglePlacesService, decorators: [{
             type: Injectable
         }], ctorParameters: function () {
-        return [{ type: i4.HttpClient }, { type: Object, decorators: [{
+        return [{ type: i4$1.HttpClient }, { type: Object, decorators: [{
                         type: Inject,
                         args: [PLATFORM_ID]
                     }] }, { type: GlobalRef }, { type: LocalStorageService }];
@@ -56510,7 +56772,7 @@ NovoSelectSearchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
             useExisting: forwardRef(() => NovoSelectSearchComponent),
             multi: true,
         },
-    ], queries: [{ propertyName: "clearIcon", first: true, predicate: NovoSelectSearchClearDirective, descendants: true }], viewQueries: [{ propertyName: "searchSelectInput", first: true, predicate: ["searchSelectInput"], descendants: true, read: ElementRef, static: true }, { propertyName: "innerSelectSearch", first: true, predicate: ["innerSelectSearch"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<novo-field\n  #innerSelectSearch\n  class=\"novo-select-search-inner\"\n  [ngClass]=\"{'novo-select-search-inner-multiple': novoSelect.multiple, 'novo-select-search-inner-toggle-all': _isToggleAllCheckboxVisible() }\">\n\n  <novo-checkbox *ngIf=\"_isToggleAllCheckboxVisible()\"\n    novoPrefix\n    [color]=\"'primary'\"\n    class=\"novo-select-search-toggle-all-checkbox\"\n    [checked]=\"toggleAllCheckboxChecked\"\n    [indeterminate]=\"toggleAllCheckboxIndeterminate\"\n    [tooltip]=\"toggleAllCheckboxTooltipMessage\"\n    tooltipClass=\"ngx-novo-select-search-toggle-all-tooltip\"\n    [tooltipPosition]=\"toogleAllCheckboxTooltipPosition\"\n    (change)=\"_emitSelectAllBooleanToParent($event.checked)\"></novo-checkbox>\n\n  <novo-icon\n    novoPrefix\n    class=\"novo-select-search-icon\">search</novo-icon>\n\n  <input class=\"novo-select-search-input\"\n    #searchSelectInput\n    novoInput\n    [name]=\"name\"\n    autocomplete=\"off\"\n    [type]=\"type\"\n    [formControl]=\"_formControl\"\n    (keydown)=\"_handleKeydown($event)\"\n    (keyup)=\"_handleKeyup($event)\"\n    (blur)=\"onBlur()\"\n    [placeholder]=\"placeholderLabel\"\n    [attr.aria-label]=\"ariaLabel\" />\n\n  <novo-spinner *ngIf=\"searching\"\n    novoSuffix\n    class=\"novo-select-search-spinner\"\n    diameter=\"16\"></novo-spinner>\n\n  <novo-button\n    novoSuffix\n    *ngIf=\"!hideClearSearchButton && value && !searching\"\n    aria-label=\"Clear\"\n    (click)=\"_reset(true)\"\n    theme=\"icon\"\n    size=\"small\"\n    class=\"novo-select-search-clear\">\n    <ng-content *ngIf=\"clearIcon; else defaultIcon\" select=\"[novoSelectSearchClear]\"></ng-content>\n    <ng-template #defaultIcon>\n      <novo-icon>close</novo-icon>\n    </ng-template>\n  </novo-button>\n\n  <ng-content select=\".novo-select-search-custom-header-content\"></ng-content>\n\n</novo-field>\n\n<div *ngIf=\"_showNoEntriesFound$ | async\"\n  class=\"novo-select-search-no-entries-found\">\n  {{noEntriesFoundLabel}}\n</div>", styles: [":host{display:block;width:100%}.novo-select-search-hidden{visibility:hidden}.novo-select-search-inner{width:100%;background-color:var(--background-bright);-webkit-transform:translate3d(0,0,0)}.novo-select-search-inner.novo-select-search-inner-multiple{width:100%}.novo-select-search-inner.novo-select-search-inner-multiple.novo-select-search-inner-toggle-all{display:flex;align-items:center}.novo-select-search-icon{padding:var(--spacing-md)}::ng-deep .novo-select-search-panel{transform:none!important;overflow-x:hidden}.novo-select-search-no-entries-found{padding:16px}:host.novo-select-search-inside-novo-option .novo-select-search-input{padding-top:0;padding-bottom:0;height:3.6rem;line-height:3.6rem}:host.novo-select-search-inside-novo-option .novo-select-search-clear{top:6px}:host.novo-select-search-inside-novo-option .novo-select-search-icon-prefix{left:16px;top:7px}::ng-deep .novo-option.contains-novo-select-search{padding:0!important;border:none}::ng-deep .novo-option.contains-novo-select-search .novo-icon{margin-right:0;margin-left:0}::ng-deep .novo-option.contains-novo-select-search .novo-option-pseudo-checkbox{display:none}.novo-select-search-toggle-all-checkbox{padding-left:16px;padding-bottom:2px}:host-context([dir=rtl]) .novo-select-search-toggle-all-checkbox{padding-left:0;padding-right:16px}\n"], components: [{ type: NovoFieldElement, selector: "novo-field", inputs: ["layout", "appearance", "width"], outputs: ["valueChanges", "stateChanges"] }, { type: NovoCheckboxElement, selector: "novo-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "name", "label", "disabled", "layoutOptions", "color", "value", "tabIndex", "required", "checked", "indeterminate"], outputs: ["change", "indeterminateChange", "onSelect"] }, { type: NovoIconComponent, selector: "novo-icon", inputs: ["raised", "theme", "shape", "color", "size", "smaller", "larger", "alt", "name"] }, { type: NovoSpinnerElement, selector: "novo-spinner", inputs: ["theme", "color", "size", "inverse"] }, { type: NovoButtonElement, selector: "novo-button,button[theme]", inputs: ["color", "side", "size", "theme", "loading", "icon", "disabled"] }], directives: [{ type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: NovoFieldPrefixDirective, selector: "[novoPrefix]" }, { type: TooltipDirective, selector: "[tooltip]", inputs: ["tooltip", "tooltipPosition", "tooltipType", "tooltipSize", "tooltipBounce", "tooltipNoAnimate", "tooltipRounded", "tooltipAlways", "tooltipActive", "tooltipPreline", "removeTooltipArrow", "tooltipAutoPosition", "tooltipIsHTML"] }, { type: NovoInput, selector: "input[novoInput], textarea[novoInput], select[novoInput]", inputs: ["disabled", "id", "placeholder", "required", "type", "value", "readonly"] }, { type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: NovoFieldSuffixDirective, selector: "[novoSuffix]" }, { type: ThemeColorDirective, selector: "[theme]", inputs: ["theme"] }], pipes: { "async": i1.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    ], queries: [{ propertyName: "clearIcon", first: true, predicate: NovoSelectSearchClearDirective, descendants: true }], viewQueries: [{ propertyName: "searchSelectInput", first: true, predicate: ["searchSelectInput"], descendants: true, read: ElementRef, static: true }, { propertyName: "innerSelectSearch", first: true, predicate: ["innerSelectSearch"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<novo-field\n  #innerSelectSearch\n  class=\"novo-select-search-inner\"\n  [ngClass]=\"{'novo-select-search-inner-multiple': novoSelect.multiple, 'novo-select-search-inner-toggle-all': _isToggleAllCheckboxVisible() }\">\n\n  <novo-checkbox *ngIf=\"_isToggleAllCheckboxVisible()\"\n    novoPrefix\n    [color]=\"'primary'\"\n    class=\"novo-select-search-toggle-all-checkbox\"\n    [checked]=\"toggleAllCheckboxChecked\"\n    [indeterminate]=\"toggleAllCheckboxIndeterminate\"\n    [tooltip]=\"toggleAllCheckboxTooltipMessage\"\n    tooltipClass=\"ngx-novo-select-search-toggle-all-tooltip\"\n    [tooltipPosition]=\"toogleAllCheckboxTooltipPosition\"\n    (change)=\"_emitSelectAllBooleanToParent($event.checked)\"></novo-checkbox>\n\n  <novo-icon\n    novoPrefix\n    class=\"novo-select-search-icon\">search</novo-icon>\n\n  <input class=\"novo-select-search-input\"\n    #searchSelectInput\n    novoInput\n    [name]=\"name\"\n    autocomplete=\"off\"\n    [type]=\"type\"\n    [formControl]=\"_formControl\"\n    (keydown)=\"_handleKeydown($event)\"\n    (keyup)=\"_handleKeyup($event)\"\n    (blur)=\"onBlur()\"\n    [placeholder]=\"placeholderLabel\"\n    [attr.aria-label]=\"ariaLabel\" />\n\n  <novo-spinner *ngIf=\"searching\"\n    novoSuffix\n    class=\"novo-select-search-spinner\"\n    diameter=\"16\"></novo-spinner>\n\n  <novo-button\n    novoSuffix\n    *ngIf=\"!hideClearSearchButton && value && !searching\"\n    aria-label=\"Clear\"\n    (click)=\"_reset(true)\"\n    theme=\"icon\"\n    size=\"small\"\n    class=\"novo-select-search-clear\">\n    <ng-content *ngIf=\"clearIcon; else defaultIcon\" select=\"[novoSelectSearchClear]\"></ng-content>\n    <ng-template #defaultIcon>\n      <novo-icon>close</novo-icon>\n    </ng-template>\n  </novo-button>\n\n  <ng-content select=\".novo-select-search-custom-header-content\"></ng-content>\n\n</novo-field>\n\n<div *ngIf=\"_showNoEntriesFound$ | async\"\n  class=\"novo-select-search-no-entries-found\">\n  {{noEntriesFoundLabel}}\n</div>", styles: [":host{display:block;width:100%}.novo-select-search-hidden{visibility:hidden}.novo-select-search-inner{width:100%;background-color:var(--background-bright);-webkit-transform:translate3d(0,0,0)}.novo-select-search-inner.novo-select-search-inner-multiple{width:100%}.novo-select-search-inner.novo-select-search-inner-multiple.novo-select-search-inner-toggle-all{display:flex;align-items:center}.novo-select-search-icon{padding:var(--spacing-md)}::ng-deep .novo-select-search-panel{transform:none!important;overflow-x:hidden}.novo-select-search-no-entries-found{padding:16px}:host.novo-select-search-inside-novo-option .novo-select-search-input{padding-top:0;padding-bottom:0;height:3.6rem;line-height:3.6rem}:host.novo-select-search-inside-novo-option .novo-select-search-clear{top:6px}:host.novo-select-search-inside-novo-option .novo-select-search-icon-prefix{left:16px;top:7px}::ng-deep .novo-option.contains-novo-select-search{padding:0!important;border:none}::ng-deep .novo-option.contains-novo-select-search .novo-icon{margin-right:0;margin-left:0}::ng-deep .novo-option.contains-novo-select-search .novo-option-pseudo-checkbox{display:none}.novo-select-search-toggle-all-checkbox{padding-left:16px;padding-bottom:2px}:host-context([dir=rtl]) .novo-select-search-toggle-all-checkbox{padding-left:0;padding-right:16px}\n"], components: [{ type: NovoFieldElement, selector: "novo-field", inputs: ["layout", "appearance", "width"], outputs: ["valueChanges", "stateChanges"] }, { type: NovoCheckboxElement, selector: "novo-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "name", "label", "disabled", "layoutOptions", "color", "value", "tabIndex", "required", "checked", "indeterminate"], outputs: ["change", "indeterminateChange", "onSelect"] }, { type: NovoIconComponent, selector: "novo-icon", inputs: ["raised", "theme", "shape", "color", "size", "smaller", "larger", "alt", "name"] }, { type: NovoSpinnerElement, selector: "novo-spinner", inputs: ["theme", "color", "size", "inverse"] }, { type: NovoButtonElement, selector: "novo-button,button[theme]", inputs: ["color", "side", "size", "theme", "loading", "icon", "disabled"] }], directives: [{ type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: NovoFieldPrefixDirective, selector: "[novoPrefix]" }, { type: TooltipDirective, selector: "[tooltip]", inputs: ["tooltip", "tooltipPosition", "tooltipType", "tooltipSize", "tooltipBounce", "tooltipNoAnimate", "tooltipRounded", "tooltipAlways", "tooltipActive", "tooltipPreline", "removeTooltipArrow", "tooltipAutoPosition", "tooltipIsHTML"] }, { type: NovoInput, selector: "input[novoInput], textarea[novoInput], select[novoInput]", inputs: ["disabled", "id", "placeholder", "required", "type", "value", "readonly"] }, { type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: NovoFieldSuffixDirective, selector: "[novoSuffix]" }, { type: ThemeColorDirective, selector: "[theme]", inputs: ["theme"] }], pipes: { "async": i1.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoSelectSearchComponent, decorators: [{
             type: Component,
             args: [{ selector: 'novo-select-search', providers: [
@@ -56741,12 +57003,12 @@ class ConditionBuilderComponent {
         this.cdr.markForCheck();
     }
 }
-ConditionBuilderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ConditionBuilderComponent, deps: [{ token: NovoLabelService }, { token: i0.ChangeDetectorRef }, { token: QueryBuilderService }, { token: i5.ControlContainer }], target: i0.ɵɵFactoryTarget.Component });
-ConditionBuilderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: ConditionBuilderComponent, selector: "novo-condition-builder", inputs: { label: "label", isFirst: "isFirst", andIndex: "andIndex", groupIndex: "groupIndex" }, providers: [{ provide: NOVO_CONDITION_BUILDER, useExisting: ConditionBuilderComponent }], viewQueries: [{ propertyName: "_operatorOutlet", first: true, predicate: ConditionOperatorOutlet, descendants: true, static: true }, { propertyName: "_inputOutlet", first: true, predicate: ConditionInputOutlet, descendants: true, static: true }], ngImport: i0, template: "<form [formGroup]=\"parentForm\">\n  <novo-grid gap=\"1rem\" [columns]=\"isFirst ? '20rem 13rem 1fr' : '16rem 13rem 1fr'\" align=\"end\">\n    <novo-field class=\"condition-field\">\n      <novo-select\n        [placeholder]=\"labels.chooseAField\"\n        formControlName=\"field\"\n        (onSelect)=\"onFieldSelect()\"\n        overlayWidth=\"24rem\"\n        overlayHeight=\"20rem\"\n        [displayWith]=\"fieldDisplayWith\"\n        [style.minWidth.px]=\"160\"\n        [style.maxWidth.px]=\"isFirst ? 200 : 160\">\n        <novo-optgroup class=\"filter-search-results\">\n          <novo-option>\n            <novo-select-search [formControl]=\"searchTerm\" [clearSearchInput]=\"false\"></novo-select-search>\n          </novo-option>\n          <ng-container *ngIf=\"results$ | async as results; else loading\">\n            <ng-container *ngIf=\"results.length\">\n              <novo-option *ngFor=\"let field of results\" value=\"{{ field.name }}\"\n                [attr.data-automation-id]=\"field.name\">\n                {{ field.label || field.name }}\n              </novo-option>\n            </ng-container>\n          </ng-container>\n        </novo-optgroup>\n      </novo-select>\n    </novo-field>\n\n    <div class=\"condition-operator\">\n      <ng-container conditionOperatorOutlet></ng-container>\n    </div>\n\n    <div class=\"condition-input\">\n      <ng-container conditionInputOutlet></ng-container>\n    </div>\n  </novo-grid>\n  <ng-content></ng-content>\n</form>\n\n<!-- EMPTY STATE TEMPLATE -->\n<!-- <ng-template #empty>\n  <novo-non-ideal-state>\n    <novo-icon size=\"xl\" color=\"grapefruit\">search</novo-icon>\n    <novo-title>No results found.</novo-title>\n    <novo-text>Your search didn't find anything. Try searching for something else.</novo-text>\n  </novo-non-ideal-state>\n</ng-template> -->\n\n<!-- LOADING TEMPLATE -->\n<ng-template #loading>\n  <novo-loading></novo-loading>\n</ng-template>", styles: [":host{position:relative;display:block;width:100%}:host .condition-field{grid-template-columns:minmax(-webkit-fit-content,1fr);grid-template-columns:minmax(fit-content,1fr);width:100%;width:-webkit-fill-available}:host .condition-operator::ng-deep .novo-select{min-width:13rem}:host .condition-input::ng-deep novo-field.novo-field-layout-vertical{grid-template-columns:minmax(-webkit-fit-content,1fr);grid-template-columns:minmax(fit-content,1fr);width:-webkit-fill-available}:host .condition-input::ng-deep novo-field.novo-field-layout-vertical .novo-input-element{width:100%}:host .condition-input::ng-deep novo-field{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:host .condition-input::ng-deep .novo-field-infix{white-space:nowrap;overflow:hidden}:host .condition-input::ng-deep novo-chips{border-bottom:none!important}:host .condition-input::ng-deep novo-chips input{padding-left:0!important}:host .and-or-filter-button{box-sizing:border-box;background:#fff;border:1px solid #ddd;color:#5691f5;display:inline-block;position:relative;cursor:pointer;margin:.4rem auto;align-items:center;text-align:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;outline:none;white-space:nowrap;text-transform:uppercase;overflow:hidden;transition:box-shadow .4s cubic-bezier(.25,.8,.25,1),background-color .4s cubic-bezier(.25,.8,.25,1)}\n"], components: [{ type: NovoGridElement, selector: "novo-grid", inputs: ["direction", "align", "justify", "columns"] }, { type: NovoFieldElement, selector: "novo-field", inputs: ["layout", "appearance", "width"], outputs: ["valueChanges", "stateChanges"] }, { type: NovoSelectElement, selector: "novo-select", inputs: ["disabled", "required", "tabIndex", "id", "name", "options", "placeholder", "readonly", "headerConfig", "position", "overlayWidth", "overlayHeight", "displayWith", "compareWith", "value", "multiple"], outputs: ["onSelect", "selectionChange", "valueChange", "openedChange", "opened", "closed"] }, { type: NovoOptgroup, selector: "novo-optgroup", inputs: ["disabled", "label"], exportAs: ["novoOptgroup"] }, { type: NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }, { type: NovoSelectSearchComponent, selector: "novo-select-search", inputs: ["name", "placeholderLabel", "type", "noEntriesFoundLabel", "indexAndLengthScreenReaderText", "clearSearchInput", "searching", "disableInitialFocus", "enableClearOnEscapePressed", "preventHomeEndKeyPropagation", "disableScrollToActiveOnOptionsChanged", "ariaLabel", "showToggleAllCheckbox", "toggleAllCheckboxChecked", "toggleAllCheckboxIndeterminate", "toggleAllCheckboxTooltipMessage", "toogleAllCheckboxTooltipPosition", "hideClearSearchButton", "alwaysRestoreSelectedOptionsMulti"], outputs: ["toggleAll"] }, { type: NovoLoadingElement, selector: "novo-loading", inputs: ["theme", "color", "size"] }], directives: [{ type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: GapDirective, selector: "[gap]", inputs: ["gap"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: ConditionOperatorOutlet, selector: "[conditionOperatorOutlet]" }, { type: ConditionInputOutlet, selector: "[conditionInputOutlet]" }], pipes: { "async": i1.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+ConditionBuilderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ConditionBuilderComponent, deps: [{ token: NovoLabelService }, { token: i0.ChangeDetectorRef }, { token: QueryBuilderService }, { token: i4.ControlContainer }], target: i0.ɵɵFactoryTarget.Component });
+ConditionBuilderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: ConditionBuilderComponent, selector: "novo-condition-builder", inputs: { label: "label", isFirst: "isFirst", andIndex: "andIndex", groupIndex: "groupIndex" }, providers: [{ provide: NOVO_CONDITION_BUILDER, useExisting: ConditionBuilderComponent }], viewQueries: [{ propertyName: "_operatorOutlet", first: true, predicate: ConditionOperatorOutlet, descendants: true, static: true }, { propertyName: "_inputOutlet", first: true, predicate: ConditionInputOutlet, descendants: true, static: true }], ngImport: i0, template: "<form [formGroup]=\"parentForm\">\n  <novo-grid gap=\"1rem\" [columns]=\"isFirst ? '20rem 13rem 1fr' : '16rem 13rem 1fr'\" align=\"end\">\n    <novo-field class=\"condition-field\">\n      <novo-select\n        [placeholder]=\"labels.chooseAField\"\n        formControlName=\"field\"\n        (onSelect)=\"onFieldSelect()\"\n        overlayWidth=\"24rem\"\n        overlayHeight=\"20rem\"\n        [displayWith]=\"fieldDisplayWith\"\n        [style.minWidth.px]=\"160\"\n        [style.maxWidth.px]=\"isFirst ? 200 : 160\">\n        <novo-optgroup class=\"filter-search-results\">\n          <novo-option>\n            <novo-select-search [formControl]=\"searchTerm\" [clearSearchInput]=\"false\"></novo-select-search>\n          </novo-option>\n          <ng-container *ngIf=\"results$ | async as results; else loading\">\n            <ng-container *ngIf=\"results.length\">\n              <novo-option *ngFor=\"let field of results\" value=\"{{ field.name }}\"\n                [attr.data-automation-id]=\"field.name\">\n                {{ field.label || field.name }}\n              </novo-option>\n            </ng-container>\n          </ng-container>\n        </novo-optgroup>\n      </novo-select>\n    </novo-field>\n\n    <div class=\"condition-operator\">\n      <ng-container conditionOperatorOutlet></ng-container>\n    </div>\n\n    <div class=\"condition-input\">\n      <ng-container conditionInputOutlet></ng-container>\n    </div>\n  </novo-grid>\n  <ng-content></ng-content>\n</form>\n\n<!-- EMPTY STATE TEMPLATE -->\n<!-- <ng-template #empty>\n  <novo-non-ideal-state>\n    <novo-icon size=\"xl\" color=\"grapefruit\">search</novo-icon>\n    <novo-title>No results found.</novo-title>\n    <novo-text>Your search didn't find anything. Try searching for something else.</novo-text>\n  </novo-non-ideal-state>\n</ng-template> -->\n\n<!-- LOADING TEMPLATE -->\n<ng-template #loading>\n  <novo-loading></novo-loading>\n</ng-template>", styles: [":host{position:relative;display:block;width:100%}:host .condition-field{grid-template-columns:minmax(-webkit-fit-content,1fr);grid-template-columns:minmax(fit-content,1fr);width:100%;width:-webkit-fill-available}:host .condition-operator::ng-deep .novo-select{min-width:13rem}:host .condition-input::ng-deep novo-field.novo-field-layout-vertical{grid-template-columns:minmax(-webkit-fit-content,1fr);grid-template-columns:minmax(fit-content,1fr);width:-webkit-fill-available}:host .condition-input::ng-deep novo-field.novo-field-layout-vertical .novo-input-element{width:100%}:host .condition-input::ng-deep novo-field{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:host .condition-input::ng-deep .novo-field-infix{white-space:nowrap;overflow:hidden}:host .condition-input::ng-deep novo-chips{border-bottom:none!important}:host .condition-input::ng-deep novo-chips input{padding-left:0!important}:host .condition-input::ng-deep novo-radio-group{padding:0!important}:host .and-or-filter-button{box-sizing:border-box;background:#fff;border:1px solid #ddd;color:#5691f5;display:inline-block;position:relative;cursor:pointer;margin:.4rem auto;align-items:center;text-align:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;outline:none;white-space:nowrap;text-transform:uppercase;overflow:hidden;transition:box-shadow .4s cubic-bezier(.25,.8,.25,1),background-color .4s cubic-bezier(.25,.8,.25,1)}\n"], components: [{ type: NovoGridElement, selector: "novo-grid", inputs: ["direction", "align", "justify", "columns"] }, { type: NovoFieldElement, selector: "novo-field", inputs: ["layout", "appearance", "width"], outputs: ["valueChanges", "stateChanges"] }, { type: NovoSelectElement, selector: "novo-select", inputs: ["disabled", "required", "tabIndex", "id", "name", "options", "placeholder", "readonly", "headerConfig", "position", "overlayWidth", "overlayHeight", "displayWith", "compareWith", "value", "multiple"], outputs: ["onSelect", "selectionChange", "valueChange", "openedChange", "opened", "closed"] }, { type: NovoOptgroup, selector: "novo-optgroup", inputs: ["disabled", "label"], exportAs: ["novoOptgroup"] }, { type: NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }, { type: NovoSelectSearchComponent, selector: "novo-select-search", inputs: ["name", "placeholderLabel", "type", "noEntriesFoundLabel", "indexAndLengthScreenReaderText", "clearSearchInput", "searching", "disableInitialFocus", "enableClearOnEscapePressed", "preventHomeEndKeyPropagation", "disableScrollToActiveOnOptionsChanged", "ariaLabel", "showToggleAllCheckbox", "toggleAllCheckboxChecked", "toggleAllCheckboxIndeterminate", "toggleAllCheckboxTooltipMessage", "toogleAllCheckboxTooltipPosition", "hideClearSearchButton", "alwaysRestoreSelectedOptionsMulti"], outputs: ["toggleAll"] }, { type: NovoLoadingElement, selector: "novo-loading", inputs: ["theme", "color", "size"] }], directives: [{ type: i4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: GapDirective, selector: "[gap]", inputs: ["gap"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: ConditionOperatorOutlet, selector: "[conditionOperatorOutlet]" }, { type: ConditionInputOutlet, selector: "[conditionInputOutlet]" }], pipes: { "async": i1.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ConditionBuilderComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'novo-condition-builder', providers: [{ provide: NOVO_CONDITION_BUILDER, useExisting: ConditionBuilderComponent }], changeDetection: ChangeDetectionStrategy.OnPush, template: "<form [formGroup]=\"parentForm\">\n  <novo-grid gap=\"1rem\" [columns]=\"isFirst ? '20rem 13rem 1fr' : '16rem 13rem 1fr'\" align=\"end\">\n    <novo-field class=\"condition-field\">\n      <novo-select\n        [placeholder]=\"labels.chooseAField\"\n        formControlName=\"field\"\n        (onSelect)=\"onFieldSelect()\"\n        overlayWidth=\"24rem\"\n        overlayHeight=\"20rem\"\n        [displayWith]=\"fieldDisplayWith\"\n        [style.minWidth.px]=\"160\"\n        [style.maxWidth.px]=\"isFirst ? 200 : 160\">\n        <novo-optgroup class=\"filter-search-results\">\n          <novo-option>\n            <novo-select-search [formControl]=\"searchTerm\" [clearSearchInput]=\"false\"></novo-select-search>\n          </novo-option>\n          <ng-container *ngIf=\"results$ | async as results; else loading\">\n            <ng-container *ngIf=\"results.length\">\n              <novo-option *ngFor=\"let field of results\" value=\"{{ field.name }}\"\n                [attr.data-automation-id]=\"field.name\">\n                {{ field.label || field.name }}\n              </novo-option>\n            </ng-container>\n          </ng-container>\n        </novo-optgroup>\n      </novo-select>\n    </novo-field>\n\n    <div class=\"condition-operator\">\n      <ng-container conditionOperatorOutlet></ng-container>\n    </div>\n\n    <div class=\"condition-input\">\n      <ng-container conditionInputOutlet></ng-container>\n    </div>\n  </novo-grid>\n  <ng-content></ng-content>\n</form>\n\n<!-- EMPTY STATE TEMPLATE -->\n<!-- <ng-template #empty>\n  <novo-non-ideal-state>\n    <novo-icon size=\"xl\" color=\"grapefruit\">search</novo-icon>\n    <novo-title>No results found.</novo-title>\n    <novo-text>Your search didn't find anything. Try searching for something else.</novo-text>\n  </novo-non-ideal-state>\n</ng-template> -->\n\n<!-- LOADING TEMPLATE -->\n<ng-template #loading>\n  <novo-loading></novo-loading>\n</ng-template>", styles: [":host{position:relative;display:block;width:100%}:host .condition-field{grid-template-columns:minmax(-webkit-fit-content,1fr);grid-template-columns:minmax(fit-content,1fr);width:100%;width:-webkit-fill-available}:host .condition-operator::ng-deep .novo-select{min-width:13rem}:host .condition-input::ng-deep novo-field.novo-field-layout-vertical{grid-template-columns:minmax(-webkit-fit-content,1fr);grid-template-columns:minmax(fit-content,1fr);width:-webkit-fill-available}:host .condition-input::ng-deep novo-field.novo-field-layout-vertical .novo-input-element{width:100%}:host .condition-input::ng-deep novo-field{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:host .condition-input::ng-deep .novo-field-infix{white-space:nowrap;overflow:hidden}:host .condition-input::ng-deep novo-chips{border-bottom:none!important}:host .condition-input::ng-deep novo-chips input{padding-left:0!important}:host .and-or-filter-button{box-sizing:border-box;background:#fff;border:1px solid #ddd;color:#5691f5;display:inline-block;position:relative;cursor:pointer;margin:.4rem auto;align-items:center;text-align:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;outline:none;white-space:nowrap;text-transform:uppercase;overflow:hidden;transition:box-shadow .4s cubic-bezier(.25,.8,.25,1),background-color .4s cubic-bezier(.25,.8,.25,1)}\n"] }]
-        }], ctorParameters: function () { return [{ type: NovoLabelService }, { type: i0.ChangeDetectorRef }, { type: QueryBuilderService }, { type: i5.ControlContainer }]; }, propDecorators: { _operatorOutlet: [{
+            args: [{ selector: 'novo-condition-builder', providers: [{ provide: NOVO_CONDITION_BUILDER, useExisting: ConditionBuilderComponent }], changeDetection: ChangeDetectionStrategy.OnPush, template: "<form [formGroup]=\"parentForm\">\n  <novo-grid gap=\"1rem\" [columns]=\"isFirst ? '20rem 13rem 1fr' : '16rem 13rem 1fr'\" align=\"end\">\n    <novo-field class=\"condition-field\">\n      <novo-select\n        [placeholder]=\"labels.chooseAField\"\n        formControlName=\"field\"\n        (onSelect)=\"onFieldSelect()\"\n        overlayWidth=\"24rem\"\n        overlayHeight=\"20rem\"\n        [displayWith]=\"fieldDisplayWith\"\n        [style.minWidth.px]=\"160\"\n        [style.maxWidth.px]=\"isFirst ? 200 : 160\">\n        <novo-optgroup class=\"filter-search-results\">\n          <novo-option>\n            <novo-select-search [formControl]=\"searchTerm\" [clearSearchInput]=\"false\"></novo-select-search>\n          </novo-option>\n          <ng-container *ngIf=\"results$ | async as results; else loading\">\n            <ng-container *ngIf=\"results.length\">\n              <novo-option *ngFor=\"let field of results\" value=\"{{ field.name }}\"\n                [attr.data-automation-id]=\"field.name\">\n                {{ field.label || field.name }}\n              </novo-option>\n            </ng-container>\n          </ng-container>\n        </novo-optgroup>\n      </novo-select>\n    </novo-field>\n\n    <div class=\"condition-operator\">\n      <ng-container conditionOperatorOutlet></ng-container>\n    </div>\n\n    <div class=\"condition-input\">\n      <ng-container conditionInputOutlet></ng-container>\n    </div>\n  </novo-grid>\n  <ng-content></ng-content>\n</form>\n\n<!-- EMPTY STATE TEMPLATE -->\n<!-- <ng-template #empty>\n  <novo-non-ideal-state>\n    <novo-icon size=\"xl\" color=\"grapefruit\">search</novo-icon>\n    <novo-title>No results found.</novo-title>\n    <novo-text>Your search didn't find anything. Try searching for something else.</novo-text>\n  </novo-non-ideal-state>\n</ng-template> -->\n\n<!-- LOADING TEMPLATE -->\n<ng-template #loading>\n  <novo-loading></novo-loading>\n</ng-template>", styles: [":host{position:relative;display:block;width:100%}:host .condition-field{grid-template-columns:minmax(-webkit-fit-content,1fr);grid-template-columns:minmax(fit-content,1fr);width:100%;width:-webkit-fill-available}:host .condition-operator::ng-deep .novo-select{min-width:13rem}:host .condition-input::ng-deep novo-field.novo-field-layout-vertical{grid-template-columns:minmax(-webkit-fit-content,1fr);grid-template-columns:minmax(fit-content,1fr);width:-webkit-fill-available}:host .condition-input::ng-deep novo-field.novo-field-layout-vertical .novo-input-element{width:100%}:host .condition-input::ng-deep novo-field{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:host .condition-input::ng-deep .novo-field-infix{white-space:nowrap;overflow:hidden}:host .condition-input::ng-deep novo-chips{border-bottom:none!important}:host .condition-input::ng-deep novo-chips input{padding-left:0!important}:host .condition-input::ng-deep novo-radio-group{padding:0!important}:host .and-or-filter-button{box-sizing:border-box;background:#fff;border:1px solid #ddd;color:#5691f5;display:inline-block;position:relative;cursor:pointer;margin:.4rem auto;align-items:center;text-align:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;outline:none;white-space:nowrap;text-transform:uppercase;overflow:hidden;transition:box-shadow .4s cubic-bezier(.25,.8,.25,1),background-color .4s cubic-bezier(.25,.8,.25,1)}\n"] }]
+        }], ctorParameters: function () { return [{ type: NovoLabelService }, { type: i0.ChangeDetectorRef }, { type: QueryBuilderService }, { type: i4.ControlContainer }]; }, propDecorators: { _operatorOutlet: [{
                 type: ViewChild,
                 args: [ConditionOperatorOutlet, { static: true }]
             }], _inputOutlet: [{
@@ -56884,6 +57146,9 @@ class AbstractConditionFieldDef {
         var _a;
         (_a = this.fieldDef) === null || _a === void 0 ? void 0 : _a.unregister();
     }
+    onOperatorSelect(formGroup) {
+        formGroup.get('value').setValue(null);
+    }
     /** Synchronizes the column definition name with the text column name. */
     _syncFieldDefName() {
         if (this.fieldDef) {
@@ -56920,17 +57185,26 @@ NovoDefaultAddressConditionDef.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12
 NovoDefaultAddressConditionDef.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NovoDefaultAddressConditionDef, selector: "novo-address-condition-def", usesInheritance: true, ngImport: i0, template: `
     <ng-container novoConditionFieldDef>
       <novo-field *novoConditionOperatorsDef="let formGroup" [formGroup]="formGroup">
-        <novo-select [placeholder]="labels.operator" formControlName="operator">
+        <novo-select [placeholder]="labels.operator" formControlName="operator" (onSelect)="onOperatorSelect(formGroup)">
           <novo-option value="includeAny">{{ labels.includeAny }}</novo-option>
           <novo-option value="excludeAny">{{ labels.exclude }}</novo-option>
           <novo-option value="radius">{{ labels.radius }}</novo-option>
+          <novo-option value="isNull">{{ labels.isEmpty }}</novo-option>
         </novo-select>
       </novo-field>
-      <novo-field *novoConditionInputDef="let formGroup; fieldMeta as meta" [formGroup]="formGroup">
-        <novo-select formControlName="value" [placeholder]="labels.select" [multiple]="true"> </novo-select>
-      </novo-field>
+      <ng-container *novoConditionInputDef="let formGroup; viewIndex as viewIndex; fieldMeta as meta" [ngSwitch]="formGroup.value.operator" [formGroup]="formGroup">
+        <novo-field *novoSwitchCases="['includeAny', 'excludeAny', 'radius']">
+          <novo-select formControlName="value" [placeholder]="labels.select" [multiple]="true"> </novo-select>
+        </novo-field>
+        <novo-field *novoSwitchCases="['isNull']">
+          <novo-radio-group formControlName="value">
+            <novo-radio [value]="true">{{ labels.yes }}</novo-radio>
+            <novo-radio [value]="false">{{ labels.no }}</novo-radio>
+          </novo-radio-group>
+        </novo-field>
+      </ng-container>
     </ng-container>
-  `, isInline: true, components: [{ type: NovoFieldElement, selector: "novo-field", inputs: ["layout", "appearance", "width"], outputs: ["valueChanges", "stateChanges"] }, { type: NovoSelectElement, selector: "novo-select", inputs: ["disabled", "required", "tabIndex", "id", "name", "options", "placeholder", "readonly", "headerConfig", "position", "overlayWidth", "overlayHeight", "displayWith", "compareWith", "value", "multiple"], outputs: ["onSelect", "selectionChange", "valueChange", "openedChange", "opened", "closed"] }, { type: NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }], directives: [{ type: NovoConditionFieldDef, selector: "[novoConditionFieldDef]" }, { type: NovoConditionOperatorsDef, selector: "[novoConditionOperatorsDef]" }, { type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: NovoConditionInputDef, selector: "[novoConditionInputDef]" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
+  `, isInline: true, components: [{ type: NovoFieldElement, selector: "novo-field", inputs: ["layout", "appearance", "width"], outputs: ["valueChanges", "stateChanges"] }, { type: NovoSelectElement, selector: "novo-select", inputs: ["disabled", "required", "tabIndex", "id", "name", "options", "placeholder", "readonly", "headerConfig", "position", "overlayWidth", "overlayHeight", "displayWith", "compareWith", "value", "multiple"], outputs: ["onSelect", "selectionChange", "valueChange", "openedChange", "opened", "closed"] }, { type: NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }, { type: NovoRadioGroup, selector: "novo-radio-group", inputs: ["id", "tabindex", "errorStateMatcher", "appearance", "value", "name", "disabled", "required", "placeholder"], outputs: ["change", "blur"] }, { type: NovoRadioElement, selector: "novo-radio", inputs: ["id", "name", "tabindex", "vertical", "label", "button", "theme", "size", "icon", "color", "checked", "value", "disabled"], outputs: ["change", "blur", "focus"] }], directives: [{ type: NovoConditionFieldDef, selector: "[novoConditionFieldDef]" }, { type: NovoConditionOperatorsDef, selector: "[novoConditionOperatorsDef]" }, { type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: NovoConditionInputDef, selector: "[novoConditionInputDef]" }, { type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: SwitchCasesDirective, selector: "[novoSwitchCases]", inputs: ["novoSwitchCases"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoDefaultAddressConditionDef, decorators: [{
             type: Component,
             args: [{
@@ -56938,15 +57212,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                     template: `
     <ng-container novoConditionFieldDef>
       <novo-field *novoConditionOperatorsDef="let formGroup" [formGroup]="formGroup">
-        <novo-select [placeholder]="labels.operator" formControlName="operator">
+        <novo-select [placeholder]="labels.operator" formControlName="operator" (onSelect)="onOperatorSelect(formGroup)">
           <novo-option value="includeAny">{{ labels.includeAny }}</novo-option>
           <novo-option value="excludeAny">{{ labels.exclude }}</novo-option>
           <novo-option value="radius">{{ labels.radius }}</novo-option>
+          <novo-option value="isNull">{{ labels.isEmpty }}</novo-option>
         </novo-select>
       </novo-field>
-      <novo-field *novoConditionInputDef="let formGroup; fieldMeta as meta" [formGroup]="formGroup">
-        <novo-select formControlName="value" [placeholder]="labels.select" [multiple]="true"> </novo-select>
-      </novo-field>
+      <ng-container *novoConditionInputDef="let formGroup; viewIndex as viewIndex; fieldMeta as meta" [ngSwitch]="formGroup.value.operator" [formGroup]="formGroup">
+        <novo-field *novoSwitchCases="['includeAny', 'excludeAny', 'radius']">
+          <novo-select formControlName="value" [placeholder]="labels.select" [multiple]="true"> </novo-select>
+        </novo-field>
+        <novo-field *novoSwitchCases="['isNull']">
+          <novo-radio-group formControlName="value">
+            <novo-radio [value]="true">{{ labels.yes }}</novo-radio>
+            <novo-radio [value]="false">{{ labels.no }}</novo-radio>
+          </novo-radio-group>
+        </novo-field>
+      </ng-container>
     </ng-container>
   `,
                     encapsulation: ViewEncapsulation.None,
@@ -56967,19 +57250,20 @@ NovoDefaultBooleanConditionDef.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12
 NovoDefaultBooleanConditionDef.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NovoDefaultBooleanConditionDef, selector: "novo-boolean-condition-def", usesInheritance: true, ngImport: i0, template: `
     <ng-container novoConditionFieldDef>
       <novo-field *novoConditionOperatorsDef="let formGroup" [formGroup]="formGroup">
-        <novo-select [placeholder]="labels.operator" formControlName="operator">
+        <novo-select [placeholder]="labels.operator" formControlName="operator" (onSelect)="onOperatorSelect(formGroup)">
           <novo-option value="include">{{ labels.equals }}</novo-option>
           <novo-option value="exclude">{{ labels.doesNotEqual }}</novo-option>
+          <novo-option value="isNull">{{ labels.isEmpty }}</novo-option>
         </novo-select>
       </novo-field>
-      <novo-field *novoConditionInputDef="let formGroup" [style.width.px]="100" [formGroup]="formGroup">
-        <novo-select [placeholder]="labels.value" formControlName="value">
-          <novo-option [value]="true">{{ labels.true }}</novo-option>
-          <novo-option [value]="false">{{ labels.false }}</novo-option>
-        </novo-select>
+      <novo-field *novoConditionInputDef="let formGroup" [style.width.px]="125" [formGroup]="formGroup">
+        <novo-radio-group formControlName="value">
+          <novo-radio [value]="true">{{ formGroup.value.operator === 'isNull' ? labels.yes : labels.true }}</novo-radio>
+          <novo-radio [value]="false">{{ formGroup.value.operator === 'isNull' ? labels.no : labels.false }}</novo-radio>
+        </novo-radio-group>
       </novo-field>
     </ng-container>
-  `, isInline: true, components: [{ type: NovoFieldElement, selector: "novo-field", inputs: ["layout", "appearance", "width"], outputs: ["valueChanges", "stateChanges"] }, { type: NovoSelectElement, selector: "novo-select", inputs: ["disabled", "required", "tabIndex", "id", "name", "options", "placeholder", "readonly", "headerConfig", "position", "overlayWidth", "overlayHeight", "displayWith", "compareWith", "value", "multiple"], outputs: ["onSelect", "selectionChange", "valueChange", "openedChange", "opened", "closed"] }, { type: NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }], directives: [{ type: NovoConditionFieldDef, selector: "[novoConditionFieldDef]" }, { type: NovoConditionOperatorsDef, selector: "[novoConditionOperatorsDef]" }, { type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: NovoConditionInputDef, selector: "[novoConditionInputDef]" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
+  `, isInline: true, components: [{ type: NovoFieldElement, selector: "novo-field", inputs: ["layout", "appearance", "width"], outputs: ["valueChanges", "stateChanges"] }, { type: NovoSelectElement, selector: "novo-select", inputs: ["disabled", "required", "tabIndex", "id", "name", "options", "placeholder", "readonly", "headerConfig", "position", "overlayWidth", "overlayHeight", "displayWith", "compareWith", "value", "multiple"], outputs: ["onSelect", "selectionChange", "valueChange", "openedChange", "opened", "closed"] }, { type: NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }, { type: NovoRadioGroup, selector: "novo-radio-group", inputs: ["id", "tabindex", "errorStateMatcher", "appearance", "value", "name", "disabled", "required", "placeholder"], outputs: ["change", "blur"] }, { type: NovoRadioElement, selector: "novo-radio", inputs: ["id", "name", "tabindex", "vertical", "label", "button", "theme", "size", "icon", "color", "checked", "value", "disabled"], outputs: ["change", "blur", "focus"] }], directives: [{ type: NovoConditionFieldDef, selector: "[novoConditionFieldDef]" }, { type: NovoConditionOperatorsDef, selector: "[novoConditionOperatorsDef]" }, { type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: NovoConditionInputDef, selector: "[novoConditionInputDef]" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoDefaultBooleanConditionDef, decorators: [{
             type: Component,
             args: [{
@@ -56987,16 +57271,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                     template: `
     <ng-container novoConditionFieldDef>
       <novo-field *novoConditionOperatorsDef="let formGroup" [formGroup]="formGroup">
-        <novo-select [placeholder]="labels.operator" formControlName="operator">
+        <novo-select [placeholder]="labels.operator" formControlName="operator" (onSelect)="onOperatorSelect(formGroup)">
           <novo-option value="include">{{ labels.equals }}</novo-option>
           <novo-option value="exclude">{{ labels.doesNotEqual }}</novo-option>
+          <novo-option value="isNull">{{ labels.isEmpty }}</novo-option>
         </novo-select>
       </novo-field>
-      <novo-field *novoConditionInputDef="let formGroup" [style.width.px]="100" [formGroup]="formGroup">
-        <novo-select [placeholder]="labels.value" formControlName="value">
-          <novo-option [value]="true">{{ labels.true }}</novo-option>
-          <novo-option [value]="false">{{ labels.false }}</novo-option>
-        </novo-select>
+      <novo-field *novoConditionInputDef="let formGroup" [style.width.px]="125" [formGroup]="formGroup">
+        <novo-radio-group formControlName="value">
+          <novo-radio [value]="true">{{ formGroup.value.operator === 'isNull' ? labels.yes : labels.true }}</novo-radio>
+          <novo-radio [value]="false">{{ formGroup.value.operator === 'isNull' ? labels.no : labels.false }}</novo-radio>
+        </novo-radio-group>
       </novo-field>
     </ng-container>
   `,
@@ -57014,9 +57299,6 @@ class NovoDefaultDateConditionDef extends AbstractConditionFieldDef {
         super(...arguments);
         this.defaultOperator = 'within';
     }
-    onOperatorSelect(formGroup) {
-        formGroup.get('value').setValue(null);
-    }
     closePanel(event, viewIndex) {
         const overlay = this.overlayChildren.find(item => item.overlayId === viewIndex);
         overlay.closePanel(event);
@@ -57031,34 +57313,39 @@ NovoDefaultDateConditionDef.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.
           <novo-option value="after">{{ labels.after }}</novo-option>
           <novo-option value="between">{{ labels.between }}</novo-option>
           <novo-option value="within">{{ labels.within }}</novo-option>
+          <novo-option value="isNull">{{ labels.isEmpty }}</novo-option>
         </novo-select>
       </novo-field>
-      <ng-container *novoConditionInputDef="let formGroup; viewIndex as viewIndex">
-        <ng-container [ngSwitch]="formGroup.value.operator" [formGroup]="formGroup">
-          <novo-field *novoSwitchCases="['before', 'after']">
-            <input novoInput dateFormat="iso8601" [picker]="datepicker" formControlName="value" />
-            <novo-picker-toggle triggerOnFocus [overlayId]="viewIndex" novoSuffix icon="calendar">
-              <novo-date-picker (onSelect)="closePanel($event, viewIndex)" #datepicker></novo-date-picker>
-            </novo-picker-toggle>
-          </novo-field>
-          <novo-field *novoSwitchCases="['between']">
-            <input novoInput dateRangeFormat="date" [picker]="daterangepicker" formControlName="value" />
-            <novo-picker-toggle [for]="daterangepicker" triggerOnFocus [overlayId]="viewIndex" novoSuffix icon="calendar">
-              <novo-date-picker #daterangepicker (onSelect)="closePanel($event, viewIndex)" mode="range" numberOfMonths="2"></novo-date-picker>
-            </novo-picker-toggle>
-          </novo-field>
-          <novo-field *novoSwitchCases="['within']">
-            <novo-select [placeholder]="labels.selectDateRange" formControlName="value">
-              <novo-option value="7">{{ labels.next7Days }}</novo-option>
-              <novo-option value="-7">{{ labels.past7Days }}</novo-option>
-              <novo-option value="-30">{{ labels.past30Days }}</novo-option>
-              <novo-option value="-90">{{ labels.past90Days }}</novo-option>
-            </novo-select>
-          </novo-field>
-        </ng-container>
+      <ng-container *novoConditionInputDef="let formGroup; viewIndex as viewIndex" [ngSwitch]="formGroup.value.operator" [formGroup]="formGroup">
+        <novo-field *novoSwitchCases="['before', 'after']">
+          <input novoInput dateFormat="iso8601" [picker]="datepicker" formControlName="value" />
+          <novo-picker-toggle triggerOnFocus [overlayId]="viewIndex" novoSuffix icon="calendar">
+            <novo-date-picker (onSelect)="closePanel($event, viewIndex)" #datepicker></novo-date-picker>
+          </novo-picker-toggle>
+        </novo-field>
+        <novo-field *novoSwitchCases="['between']">
+          <input novoInput dateRangeFormat="date" [picker]="daterangepicker" formControlName="value" />
+          <novo-picker-toggle [for]="daterangepicker" triggerOnFocus [overlayId]="viewIndex" novoSuffix icon="calendar">
+            <novo-date-picker #daterangepicker (onSelect)="closePanel($event, viewIndex)" mode="range" numberOfMonths="2"></novo-date-picker>
+          </novo-picker-toggle>
+        </novo-field>
+        <novo-field *novoSwitchCases="['within']">
+          <novo-select [placeholder]="labels.selectDateRange" formControlName="value">
+            <novo-option value="7">{{ labels.next7Days }}</novo-option>
+            <novo-option value="-7">{{ labels.past7Days }}</novo-option>
+            <novo-option value="-30">{{ labels.past30Days }}</novo-option>
+            <novo-option value="-90">{{ labels.past90Days }}</novo-option>
+          </novo-select>
+        </novo-field>
+        <novo-field *novoSwitchCases="['isNull']">
+          <novo-radio-group formControlName="value">
+            <novo-radio [value]="true">{{ labels.yes }}</novo-radio>
+            <novo-radio [value]="false">{{ labels.no }}</novo-radio>
+          </novo-radio-group>
+        </novo-field>
       </ng-container>
     </ng-container>
-  `, isInline: true, components: [{ type: NovoFieldElement, selector: "novo-field", inputs: ["layout", "appearance", "width"], outputs: ["valueChanges", "stateChanges"] }, { type: NovoSelectElement, selector: "novo-select", inputs: ["disabled", "required", "tabIndex", "id", "name", "options", "placeholder", "readonly", "headerConfig", "position", "overlayWidth", "overlayHeight", "displayWith", "compareWith", "value", "multiple"], outputs: ["onSelect", "selectionChange", "valueChange", "openedChange", "opened", "closed"] }, { type: NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }, { type: NovoPickerToggleElement, selector: "novo-picker-toggle", inputs: ["for", "icon", "tabIndex", "aria-label", "triggerOnFocus", "overlayId", "disabled"], exportAs: ["novoPickerToggle"] }, { type: NovoDatePickerElement, selector: "novo-date-picker", inputs: ["minYear", "maxYear", "start", "end", "inline", "weekStart", "preselected", "hideOverflowDays", "hideFooter", "disabledDateMessage", "numberOfMonths", "mode", "range", "weekRangeSelect"], outputs: ["onSelect"] }], directives: [{ type: NovoConditionFieldDef, selector: "[novoConditionFieldDef]" }, { type: NovoConditionOperatorsDef, selector: "[novoConditionOperatorsDef]" }, { type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: NovoConditionInputDef, selector: "[novoConditionInputDef]" }, { type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: SwitchCasesDirective, selector: "[novoSwitchCases]", inputs: ["novoSwitchCases"] }, { type: NovoInput, selector: "input[novoInput], textarea[novoInput], select[novoInput]", inputs: ["disabled", "id", "placeholder", "required", "type", "value", "readonly"] }, { type: NovoDateFormatDirective, selector: "input[dateFormat]", inputs: ["dateFormat"] }, { type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: NovoPickerDirective, selector: "input[picker]", inputs: ["picker", "autocomplete"] }, { type: NovoFieldSuffixDirective, selector: "[novoSuffix]" }, { type: NovoDateRangeFormatDirective, selector: "input[dateRangeFormat]", inputs: ["dateRangeFormat"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
+  `, isInline: true, components: [{ type: NovoFieldElement, selector: "novo-field", inputs: ["layout", "appearance", "width"], outputs: ["valueChanges", "stateChanges"] }, { type: NovoSelectElement, selector: "novo-select", inputs: ["disabled", "required", "tabIndex", "id", "name", "options", "placeholder", "readonly", "headerConfig", "position", "overlayWidth", "overlayHeight", "displayWith", "compareWith", "value", "multiple"], outputs: ["onSelect", "selectionChange", "valueChange", "openedChange", "opened", "closed"] }, { type: NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }, { type: NovoPickerToggleElement, selector: "novo-picker-toggle", inputs: ["for", "icon", "tabIndex", "aria-label", "triggerOnFocus", "overlayId", "disabled"], exportAs: ["novoPickerToggle"] }, { type: NovoDatePickerElement, selector: "novo-date-picker", inputs: ["minYear", "maxYear", "start", "end", "inline", "weekStart", "preselected", "hideOverflowDays", "hideFooter", "disabledDateMessage", "numberOfMonths", "mode", "range", "weekRangeSelect"], outputs: ["onSelect"] }, { type: NovoRadioGroup, selector: "novo-radio-group", inputs: ["id", "tabindex", "errorStateMatcher", "appearance", "value", "name", "disabled", "required", "placeholder"], outputs: ["change", "blur"] }, { type: NovoRadioElement, selector: "novo-radio", inputs: ["id", "name", "tabindex", "vertical", "label", "button", "theme", "size", "icon", "color", "checked", "value", "disabled"], outputs: ["change", "blur", "focus"] }], directives: [{ type: NovoConditionFieldDef, selector: "[novoConditionFieldDef]" }, { type: NovoConditionOperatorsDef, selector: "[novoConditionOperatorsDef]" }, { type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: NovoConditionInputDef, selector: "[novoConditionInputDef]" }, { type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: SwitchCasesDirective, selector: "[novoSwitchCases]", inputs: ["novoSwitchCases"] }, { type: NovoInput, selector: "input[novoInput], textarea[novoInput], select[novoInput]", inputs: ["disabled", "id", "placeholder", "required", "type", "value", "readonly"] }, { type: NovoDateFormatDirective, selector: "input[dateFormat]", inputs: ["dateFormat"] }, { type: i4.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: NovoPickerDirective, selector: "input[picker]", inputs: ["picker", "autocomplete"] }, { type: NovoFieldSuffixDirective, selector: "[novoSuffix]" }, { type: NovoDateRangeFormatDirective, selector: "input[dateRangeFormat]", inputs: ["dateRangeFormat"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoDefaultDateConditionDef, decorators: [{
             type: Component,
             args: [{
@@ -57071,31 +57358,36 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
           <novo-option value="after">{{ labels.after }}</novo-option>
           <novo-option value="between">{{ labels.between }}</novo-option>
           <novo-option value="within">{{ labels.within }}</novo-option>
+          <novo-option value="isNull">{{ labels.isEmpty }}</novo-option>
         </novo-select>
       </novo-field>
-      <ng-container *novoConditionInputDef="let formGroup; viewIndex as viewIndex">
-        <ng-container [ngSwitch]="formGroup.value.operator" [formGroup]="formGroup">
-          <novo-field *novoSwitchCases="['before', 'after']">
-            <input novoInput dateFormat="iso8601" [picker]="datepicker" formControlName="value" />
-            <novo-picker-toggle triggerOnFocus [overlayId]="viewIndex" novoSuffix icon="calendar">
-              <novo-date-picker (onSelect)="closePanel($event, viewIndex)" #datepicker></novo-date-picker>
-            </novo-picker-toggle>
-          </novo-field>
-          <novo-field *novoSwitchCases="['between']">
-            <input novoInput dateRangeFormat="date" [picker]="daterangepicker" formControlName="value" />
-            <novo-picker-toggle [for]="daterangepicker" triggerOnFocus [overlayId]="viewIndex" novoSuffix icon="calendar">
-              <novo-date-picker #daterangepicker (onSelect)="closePanel($event, viewIndex)" mode="range" numberOfMonths="2"></novo-date-picker>
-            </novo-picker-toggle>
-          </novo-field>
-          <novo-field *novoSwitchCases="['within']">
-            <novo-select [placeholder]="labels.selectDateRange" formControlName="value">
-              <novo-option value="7">{{ labels.next7Days }}</novo-option>
-              <novo-option value="-7">{{ labels.past7Days }}</novo-option>
-              <novo-option value="-30">{{ labels.past30Days }}</novo-option>
-              <novo-option value="-90">{{ labels.past90Days }}</novo-option>
-            </novo-select>
-          </novo-field>
-        </ng-container>
+      <ng-container *novoConditionInputDef="let formGroup; viewIndex as viewIndex" [ngSwitch]="formGroup.value.operator" [formGroup]="formGroup">
+        <novo-field *novoSwitchCases="['before', 'after']">
+          <input novoInput dateFormat="iso8601" [picker]="datepicker" formControlName="value" />
+          <novo-picker-toggle triggerOnFocus [overlayId]="viewIndex" novoSuffix icon="calendar">
+            <novo-date-picker (onSelect)="closePanel($event, viewIndex)" #datepicker></novo-date-picker>
+          </novo-picker-toggle>
+        </novo-field>
+        <novo-field *novoSwitchCases="['between']">
+          <input novoInput dateRangeFormat="date" [picker]="daterangepicker" formControlName="value" />
+          <novo-picker-toggle [for]="daterangepicker" triggerOnFocus [overlayId]="viewIndex" novoSuffix icon="calendar">
+            <novo-date-picker #daterangepicker (onSelect)="closePanel($event, viewIndex)" mode="range" numberOfMonths="2"></novo-date-picker>
+          </novo-picker-toggle>
+        </novo-field>
+        <novo-field *novoSwitchCases="['within']">
+          <novo-select [placeholder]="labels.selectDateRange" formControlName="value">
+            <novo-option value="7">{{ labels.next7Days }}</novo-option>
+            <novo-option value="-7">{{ labels.past7Days }}</novo-option>
+            <novo-option value="-30">{{ labels.past30Days }}</novo-option>
+            <novo-option value="-90">{{ labels.past90Days }}</novo-option>
+          </novo-select>
+        </novo-field>
+        <novo-field *novoSwitchCases="['isNull']">
+          <novo-radio-group formControlName="value">
+            <novo-radio [value]="true">{{ labels.yes }}</novo-radio>
+            <novo-radio [value]="false">{{ labels.no }}</novo-radio>
+          </novo-radio-group>
+        </novo-field>
       </ng-container>
     </ng-container>
   `,
@@ -57129,7 +57421,7 @@ NovoDefaultIdConditionDef.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
         <input novoInput type="number" min="1" step="1" formControlName="value" />
       </novo-field>
     </ng-container>
-  `, isInline: true, components: [{ type: NovoFieldElement, selector: "novo-field", inputs: ["layout", "appearance", "width"], outputs: ["valueChanges", "stateChanges"] }, { type: NovoSelectElement, selector: "novo-select", inputs: ["disabled", "required", "tabIndex", "id", "name", "options", "placeholder", "readonly", "headerConfig", "position", "overlayWidth", "overlayHeight", "displayWith", "compareWith", "value", "multiple"], outputs: ["onSelect", "selectionChange", "valueChange", "openedChange", "opened", "closed"] }, { type: NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }], directives: [{ type: NovoConditionFieldDef, selector: "[novoConditionFieldDef]" }, { type: NovoConditionOperatorsDef, selector: "[novoConditionOperatorsDef]" }, { type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: NovoConditionInputDef, selector: "[novoConditionInputDef]" }, { type: NovoInput, selector: "input[novoInput], textarea[novoInput], select[novoInput]", inputs: ["disabled", "id", "placeholder", "required", "type", "value", "readonly"] }, { type: i5.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { type: i5.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
+  `, isInline: true, components: [{ type: NovoFieldElement, selector: "novo-field", inputs: ["layout", "appearance", "width"], outputs: ["valueChanges", "stateChanges"] }, { type: NovoSelectElement, selector: "novo-select", inputs: ["disabled", "required", "tabIndex", "id", "name", "options", "placeholder", "readonly", "headerConfig", "position", "overlayWidth", "overlayHeight", "displayWith", "compareWith", "value", "multiple"], outputs: ["onSelect", "selectionChange", "valueChange", "openedChange", "opened", "closed"] }, { type: NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }], directives: [{ type: NovoConditionFieldDef, selector: "[novoConditionFieldDef]" }, { type: NovoConditionOperatorsDef, selector: "[novoConditionOperatorsDef]" }, { type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: NovoConditionInputDef, selector: "[novoConditionInputDef]" }, { type: NovoInput, selector: "input[novoInput], textarea[novoInput], select[novoInput]", inputs: ["disabled", "id", "placeholder", "required", "type", "value", "readonly"] }, { type: i4.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { type: i4.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoDefaultIdConditionDef, decorators: [{
             type: Component,
             args: [{
@@ -57166,17 +57458,26 @@ NovoDefaultNumberConditionDef.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.
 NovoDefaultNumberConditionDef.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NovoDefaultNumberConditionDef, selector: "novo-number-condition-def", usesInheritance: true, ngImport: i0, template: `
     <ng-container novoConditionFieldDef>
       <novo-field *novoConditionOperatorsDef="let formGroup" [formGroup]="formGroup">
-        <novo-select [placeholder]="labels.operator" formControlName="operator">
+        <novo-select [placeholder]="labels.operator" formControlName="operator" (onSelect)="onOperatorSelect(formGroup)">
           <novo-option value="greaterThan">{{ labels.greaterThan }}</novo-option>
           <novo-option value="lessThan">{{ labels.lessThan }}</novo-option>
           <novo-option value="equalTo">{{ labels.equalTo }}</novo-option>
+          <novo-option value="isNull">{{ labels.isEmpty }}</novo-option>
         </novo-select>
       </novo-field>
-      <novo-field *novoConditionInputDef="let formGroup" [formGroup]="formGroup">
-        <input novoInput type="number" formControlName="value" />
-      </novo-field>
+      <ng-container *novoConditionInputDef="let formGroup" [ngSwitch]="formGroup.value.operator" [formGroup]="formGroup">
+        <novo-field *novoSwitchCases="['greaterThan', 'lessThan', 'equalTo']">
+          <input novoInput type="number" formControlName="value" />
+        </novo-field>
+        <novo-field *novoSwitchCases="['isNull']">
+          <novo-radio-group formControlName="value">
+            <novo-radio [value]="true">{{ labels.yes }}</novo-radio>
+            <novo-radio [value]="false">{{ labels.no }}</novo-radio>
+          </novo-radio-group>
+        </novo-field>
+      </ng-container>
     </ng-container>
-  `, isInline: true, components: [{ type: NovoFieldElement, selector: "novo-field", inputs: ["layout", "appearance", "width"], outputs: ["valueChanges", "stateChanges"] }, { type: NovoSelectElement, selector: "novo-select", inputs: ["disabled", "required", "tabIndex", "id", "name", "options", "placeholder", "readonly", "headerConfig", "position", "overlayWidth", "overlayHeight", "displayWith", "compareWith", "value", "multiple"], outputs: ["onSelect", "selectionChange", "valueChange", "openedChange", "opened", "closed"] }, { type: NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }], directives: [{ type: NovoConditionFieldDef, selector: "[novoConditionFieldDef]" }, { type: NovoConditionOperatorsDef, selector: "[novoConditionOperatorsDef]" }, { type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: NovoConditionInputDef, selector: "[novoConditionInputDef]" }, { type: NovoInput, selector: "input[novoInput], textarea[novoInput], select[novoInput]", inputs: ["disabled", "id", "placeholder", "required", "type", "value", "readonly"] }, { type: i5.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
+  `, isInline: true, components: [{ type: NovoFieldElement, selector: "novo-field", inputs: ["layout", "appearance", "width"], outputs: ["valueChanges", "stateChanges"] }, { type: NovoSelectElement, selector: "novo-select", inputs: ["disabled", "required", "tabIndex", "id", "name", "options", "placeholder", "readonly", "headerConfig", "position", "overlayWidth", "overlayHeight", "displayWith", "compareWith", "value", "multiple"], outputs: ["onSelect", "selectionChange", "valueChange", "openedChange", "opened", "closed"] }, { type: NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }, { type: NovoRadioGroup, selector: "novo-radio-group", inputs: ["id", "tabindex", "errorStateMatcher", "appearance", "value", "name", "disabled", "required", "placeholder"], outputs: ["change", "blur"] }, { type: NovoRadioElement, selector: "novo-radio", inputs: ["id", "name", "tabindex", "vertical", "label", "button", "theme", "size", "icon", "color", "checked", "value", "disabled"], outputs: ["change", "blur", "focus"] }], directives: [{ type: NovoConditionFieldDef, selector: "[novoConditionFieldDef]" }, { type: NovoConditionOperatorsDef, selector: "[novoConditionOperatorsDef]" }, { type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: NovoConditionInputDef, selector: "[novoConditionInputDef]" }, { type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: SwitchCasesDirective, selector: "[novoSwitchCases]", inputs: ["novoSwitchCases"] }, { type: NovoInput, selector: "input[novoInput], textarea[novoInput], select[novoInput]", inputs: ["disabled", "id", "placeholder", "required", "type", "value", "readonly"] }, { type: i4.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoDefaultNumberConditionDef, decorators: [{
             type: Component,
             args: [{
@@ -57184,15 +57485,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                     template: `
     <ng-container novoConditionFieldDef>
       <novo-field *novoConditionOperatorsDef="let formGroup" [formGroup]="formGroup">
-        <novo-select [placeholder]="labels.operator" formControlName="operator">
+        <novo-select [placeholder]="labels.operator" formControlName="operator" (onSelect)="onOperatorSelect(formGroup)">
           <novo-option value="greaterThan">{{ labels.greaterThan }}</novo-option>
           <novo-option value="lessThan">{{ labels.lessThan }}</novo-option>
           <novo-option value="equalTo">{{ labels.equalTo }}</novo-option>
+          <novo-option value="isNull">{{ labels.isEmpty }}</novo-option>
         </novo-select>
       </novo-field>
-      <novo-field *novoConditionInputDef="let formGroup" [formGroup]="formGroup">
-        <input novoInput type="number" formControlName="value" />
-      </novo-field>
+      <ng-container *novoConditionInputDef="let formGroup" [ngSwitch]="formGroup.value.operator" [formGroup]="formGroup">
+        <novo-field *novoSwitchCases="['greaterThan', 'lessThan', 'equalTo']">
+          <input novoInput type="number" formControlName="value" />
+        </novo-field>
+        <novo-field *novoSwitchCases="['isNull']">
+          <novo-radio-group formControlName="value">
+            <novo-radio [value]="true">{{ labels.yes }}</novo-radio>
+            <novo-radio [value]="false">{{ labels.no }}</novo-radio>
+          </novo-radio-group>
+        </novo-field>
+      </ng-container>
     </ng-container>
   `,
                     encapsulation: ViewEncapsulation.None,
@@ -57213,22 +57523,31 @@ NovoDefaultPickerConditionDef.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.
 NovoDefaultPickerConditionDef.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NovoDefaultPickerConditionDef, selector: "novo-picker-condition-def", usesInheritance: true, ngImport: i0, template: `
     <ng-container novoConditionFieldDef>
       <novo-field *novoConditionOperatorsDef="let formGroup" [formGroup]="formGroup">
-        <novo-select [placeholder]="labels.operator" formControlName="operator">
+        <novo-select [placeholder]="labels.operator" formControlName="operator" (onSelect)="onOperatorSelect(formGroup)">
           <novo-option value="includeAny">{{ labels.includeAny }}</novo-option>
           <novo-option value="includeAll">{{ labels.includeAll }}</novo-option>
           <novo-option value="excludeAny">{{ labels.exclude }}</novo-option>
+          <novo-option value="isNull">{{ labels.isEmpty }}</novo-option>
         </novo-select>
       </novo-field>
-      <novo-field *novoConditionInputDef="let formGroup; fieldMeta as meta" [formGroup]="formGroup">
-        <novo-select formControlName="value" [placeholder]="labels.select" [multiple]="true">
-          <!-- WHat about optionUrl/optionType -->
-          <novo-option *ngFor="let option of meta?.options" [value]="option.value">
-            {{ option.label }}
-          </novo-option>
-        </novo-select>
-      </novo-field>
+      <ng-container *novoConditionInputDef="let formGroup; fieldMeta as meta" [ngSwitch]="formGroup.value.operator" [formGroup]="formGroup">
+        <novo-field *novoSwitchCases="['includeAny', 'includeAll', 'excludeAny']">
+          <novo-select formControlName="value" [placeholder]="labels.select" [multiple]="true">
+            <!-- WHat about optionUrl/optionType -->
+            <novo-option *ngFor="let option of meta?.options" [value]="option.value" [attr.data-automation-value]="option.label">
+              {{ option.label }}
+            </novo-option>
+          </novo-select>
+        </novo-field>
+        <novo-field *novoSwitchCases="['isNull']">
+          <novo-radio-group formControlName="value">
+            <novo-radio [value]="true">{{ labels.yes }}</novo-radio>
+            <novo-radio [value]="false">{{ labels.no }}</novo-radio>
+          </novo-radio-group>
+        </novo-field>
+      </ng-container>
     </ng-container>
-  `, isInline: true, components: [{ type: NovoFieldElement, selector: "novo-field", inputs: ["layout", "appearance", "width"], outputs: ["valueChanges", "stateChanges"] }, { type: NovoSelectElement, selector: "novo-select", inputs: ["disabled", "required", "tabIndex", "id", "name", "options", "placeholder", "readonly", "headerConfig", "position", "overlayWidth", "overlayHeight", "displayWith", "compareWith", "value", "multiple"], outputs: ["onSelect", "selectionChange", "valueChange", "openedChange", "opened", "closed"] }, { type: NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }], directives: [{ type: NovoConditionFieldDef, selector: "[novoConditionFieldDef]" }, { type: NovoConditionOperatorsDef, selector: "[novoConditionOperatorsDef]" }, { type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: NovoConditionInputDef, selector: "[novoConditionInputDef]" }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
+  `, isInline: true, components: [{ type: NovoFieldElement, selector: "novo-field", inputs: ["layout", "appearance", "width"], outputs: ["valueChanges", "stateChanges"] }, { type: NovoSelectElement, selector: "novo-select", inputs: ["disabled", "required", "tabIndex", "id", "name", "options", "placeholder", "readonly", "headerConfig", "position", "overlayWidth", "overlayHeight", "displayWith", "compareWith", "value", "multiple"], outputs: ["onSelect", "selectionChange", "valueChange", "openedChange", "opened", "closed"] }, { type: NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }, { type: NovoRadioGroup, selector: "novo-radio-group", inputs: ["id", "tabindex", "errorStateMatcher", "appearance", "value", "name", "disabled", "required", "placeholder"], outputs: ["change", "blur"] }, { type: NovoRadioElement, selector: "novo-radio", inputs: ["id", "name", "tabindex", "vertical", "label", "button", "theme", "size", "icon", "color", "checked", "value", "disabled"], outputs: ["change", "blur", "focus"] }], directives: [{ type: NovoConditionFieldDef, selector: "[novoConditionFieldDef]" }, { type: NovoConditionOperatorsDef, selector: "[novoConditionOperatorsDef]" }, { type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: NovoConditionInputDef, selector: "[novoConditionInputDef]" }, { type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: SwitchCasesDirective, selector: "[novoSwitchCases]", inputs: ["novoSwitchCases"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoDefaultPickerConditionDef, decorators: [{
             type: Component,
             args: [{
@@ -57236,20 +57555,29 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                     template: `
     <ng-container novoConditionFieldDef>
       <novo-field *novoConditionOperatorsDef="let formGroup" [formGroup]="formGroup">
-        <novo-select [placeholder]="labels.operator" formControlName="operator">
+        <novo-select [placeholder]="labels.operator" formControlName="operator" (onSelect)="onOperatorSelect(formGroup)">
           <novo-option value="includeAny">{{ labels.includeAny }}</novo-option>
           <novo-option value="includeAll">{{ labels.includeAll }}</novo-option>
           <novo-option value="excludeAny">{{ labels.exclude }}</novo-option>
+          <novo-option value="isNull">{{ labels.isEmpty }}</novo-option>
         </novo-select>
       </novo-field>
-      <novo-field *novoConditionInputDef="let formGroup; fieldMeta as meta" [formGroup]="formGroup">
-        <novo-select formControlName="value" [placeholder]="labels.select" [multiple]="true">
-          <!-- WHat about optionUrl/optionType -->
-          <novo-option *ngFor="let option of meta?.options" [value]="option.value">
-            {{ option.label }}
-          </novo-option>
-        </novo-select>
-      </novo-field>
+      <ng-container *novoConditionInputDef="let formGroup; fieldMeta as meta" [ngSwitch]="formGroup.value.operator" [formGroup]="formGroup">
+        <novo-field *novoSwitchCases="['includeAny', 'includeAll', 'excludeAny']">
+          <novo-select formControlName="value" [placeholder]="labels.select" [multiple]="true">
+            <!-- WHat about optionUrl/optionType -->
+            <novo-option *ngFor="let option of meta?.options" [value]="option.value" [attr.data-automation-value]="option.label">
+              {{ option.label }}
+            </novo-option>
+          </novo-select>
+        </novo-field>
+        <novo-field *novoSwitchCases="['isNull']">
+          <novo-radio-group formControlName="value">
+            <novo-radio [value]="true">{{ labels.yes }}</novo-radio>
+            <novo-radio [value]="false">{{ labels.no }}</novo-radio>
+          </novo-radio-group>
+        </novo-field>
+      </ng-container>
     </ng-container>
   `,
                     encapsulation: ViewEncapsulation.None,
@@ -57302,29 +57630,38 @@ NovoDefaultStringConditionDef.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "1
     <!-- fieldTypes should be UPPERCASE -->
     <ng-container novoConditionFieldDef="STRING">
       <novo-field *novoConditionOperatorsDef="let formGroup" [formGroup]="formGroup">
-        <novo-select [placeholder]="labels.operator" formControlName="operator">
+        <novo-select [placeholder]="labels.operator" formControlName="operator" (onSelect)="onOperatorSelect(formGroup)">
           <novo-option value="includeAny">{{ labels.includeAny }}</novo-option>
           <novo-option value="includeAll">{{ labels.includeAll }}</novo-option>
           <novo-option value="excludeAny">{{ labels.exclude }}</novo-option>
+          <novo-option value="isEmpty">{{ labels.isEmpty }}</novo-option>
         </novo-select>
       </novo-field>
-      <novo-field *novoConditionInputDef="let formGroup" [formGroup]="formGroup">
-        <novo-chip-list #chipList aria-label="filter value" formControlName="value">
-          <novo-chip *ngFor="let chip of formGroup.value?.value || []" [value]="chip" (removed)="remove(chip, formGroup)">
-            {{ chip }}
-            <novo-icon novoChipRemove>close</novo-icon>
-          </novo-chip>
-          <input
-            novoChipInput
-            [placeholder]="labels.typeToAddChips"
-            autocomplete="off"
-            (novoChipInputTokenEnd)="add($event, formGroup)"
-          />
-        </novo-chip-list>
-        <novo-autocomplete></novo-autocomplete>
-      </novo-field>
+      <ng-container *novoConditionInputDef="let formGroup" [ngSwitch]="formGroup.value.operator" [formGroup]="formGroup">
+        <novo-field *novoSwitchCases="['includeAny', 'includeAll', 'excludeAny']">
+          <novo-chip-list #chipList aria-label="filter value" formControlName="value">
+            <novo-chip *ngFor="let chip of formGroup.value?.value || []" [value]="chip" (removed)="remove(chip, formGroup)">
+              {{ chip }}
+              <novo-icon novoChipRemove>close</novo-icon>
+            </novo-chip>
+            <input
+              novoChipInput
+              [placeholder]="labels.typeToAddChips"
+              autocomplete="off"
+              (novoChipInputTokenEnd)="add($event, formGroup)"
+            />
+          </novo-chip-list>
+          <novo-autocomplete></novo-autocomplete>
+        </novo-field>
+        <novo-field *novoSwitchCases="['isEmpty']">
+          <novo-radio-group formControlName="value">
+            <novo-radio [value]="true">{{ labels.yes }}</novo-radio>
+            <novo-radio [value]="false">{{ labels.no }}</novo-radio>
+          </novo-radio-group>
+        </novo-field>
+      </ng-container>
     </ng-container>
-  `, isInline: true, components: [{ type: NovoFieldElement, selector: "novo-field", inputs: ["layout", "appearance", "width"], outputs: ["valueChanges", "stateChanges"] }, { type: NovoSelectElement, selector: "novo-select", inputs: ["disabled", "required", "tabIndex", "id", "name", "options", "placeholder", "readonly", "headerConfig", "position", "overlayWidth", "overlayHeight", "displayWith", "compareWith", "value", "multiple"], outputs: ["onSelect", "selectionChange", "valueChange", "openedChange", "opened", "closed"] }, { type: NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }, { type: NovoChipList, selector: "novo-chip-list", inputs: ["errorStateMatcher", "multiple", "stacked", "compareWith", "value", "required", "placeholder", "disabled", "aria-orientation", "selectable", "tabIndex"], outputs: ["change", "valueChange"], exportAs: ["novoChipList"] }, { type: NovoChipElement, selector: "novo-chip, [novo-chip]", inputs: ["color", "tabIndex", "size", "type", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"] }, { type: NovoIconComponent, selector: "novo-icon", inputs: ["raised", "theme", "shape", "color", "size", "smaller", "larger", "alt", "name"] }, { type: NovoAutocompleteElement, selector: "novo-autocomplete", inputs: ["tabIndex", "triggerOn", "displayWith", "aria-label", "multiple", "disabled"], outputs: ["optionSelected", "optionActivated"], exportAs: ["novoAutocomplete"] }], directives: [{ type: NovoConditionFieldDef, selector: "[novoConditionFieldDef]" }, { type: NovoConditionOperatorsDef, selector: "[novoConditionOperatorsDef]" }, { type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: NovoConditionInputDef, selector: "[novoConditionInputDef]" }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: NovoChipRemove, selector: "[novoChipRemove]" }, { type: NovoChipInput, selector: "input[novoChipInput]", inputs: ["novoChipInputAddOnBlur", "novoChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["novoChipInputTokenEnd"], exportAs: ["novoChipInput", "novoChipInputFor"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
+  `, isInline: true, components: [{ type: NovoFieldElement, selector: "novo-field", inputs: ["layout", "appearance", "width"], outputs: ["valueChanges", "stateChanges"] }, { type: NovoSelectElement, selector: "novo-select", inputs: ["disabled", "required", "tabIndex", "id", "name", "options", "placeholder", "readonly", "headerConfig", "position", "overlayWidth", "overlayHeight", "displayWith", "compareWith", "value", "multiple"], outputs: ["onSelect", "selectionChange", "valueChange", "openedChange", "opened", "closed"] }, { type: NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }, { type: NovoChipList, selector: "novo-chip-list", inputs: ["errorStateMatcher", "multiple", "stacked", "compareWith", "value", "required", "placeholder", "disabled", "aria-orientation", "selectable", "tabIndex"], outputs: ["change", "valueChange"], exportAs: ["novoChipList"] }, { type: NovoChipElement, selector: "novo-chip, [novo-chip]", inputs: ["color", "tabIndex", "size", "type", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"] }, { type: NovoIconComponent, selector: "novo-icon", inputs: ["raised", "theme", "shape", "color", "size", "smaller", "larger", "alt", "name"] }, { type: NovoAutocompleteElement, selector: "novo-autocomplete", inputs: ["tabIndex", "triggerOn", "displayWith", "aria-label", "multiple", "disabled"], outputs: ["optionSelected", "optionActivated"], exportAs: ["novoAutocomplete"] }, { type: NovoRadioGroup, selector: "novo-radio-group", inputs: ["id", "tabindex", "errorStateMatcher", "appearance", "value", "name", "disabled", "required", "placeholder"], outputs: ["change", "blur"] }, { type: NovoRadioElement, selector: "novo-radio", inputs: ["id", "name", "tabindex", "vertical", "label", "button", "theme", "size", "icon", "color", "checked", "value", "disabled"], outputs: ["change", "blur", "focus"] }], directives: [{ type: NovoConditionFieldDef, selector: "[novoConditionFieldDef]" }, { type: NovoConditionOperatorsDef, selector: "[novoConditionOperatorsDef]" }, { type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: NovoConditionInputDef, selector: "[novoConditionInputDef]" }, { type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: SwitchCasesDirective, selector: "[novoSwitchCases]", inputs: ["novoSwitchCases"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: NovoChipRemove, selector: "[novoChipRemove]" }, { type: NovoChipInput, selector: "input[novoChipInput]", inputs: ["novoChipInputAddOnBlur", "novoChipInputSeparatorKeyCodes", "placeholder", "id", "disabled"], outputs: ["novoChipInputTokenEnd"], exportAs: ["novoChipInput", "novoChipInputFor"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoDefaultStringConditionDef, decorators: [{
             type: Component,
             args: [{
@@ -57333,27 +57670,36 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
     <!-- fieldTypes should be UPPERCASE -->
     <ng-container novoConditionFieldDef="STRING">
       <novo-field *novoConditionOperatorsDef="let formGroup" [formGroup]="formGroup">
-        <novo-select [placeholder]="labels.operator" formControlName="operator">
+        <novo-select [placeholder]="labels.operator" formControlName="operator" (onSelect)="onOperatorSelect(formGroup)">
           <novo-option value="includeAny">{{ labels.includeAny }}</novo-option>
           <novo-option value="includeAll">{{ labels.includeAll }}</novo-option>
           <novo-option value="excludeAny">{{ labels.exclude }}</novo-option>
+          <novo-option value="isEmpty">{{ labels.isEmpty }}</novo-option>
         </novo-select>
       </novo-field>
-      <novo-field *novoConditionInputDef="let formGroup" [formGroup]="formGroup">
-        <novo-chip-list #chipList aria-label="filter value" formControlName="value">
-          <novo-chip *ngFor="let chip of formGroup.value?.value || []" [value]="chip" (removed)="remove(chip, formGroup)">
-            {{ chip }}
-            <novo-icon novoChipRemove>close</novo-icon>
-          </novo-chip>
-          <input
-            novoChipInput
-            [placeholder]="labels.typeToAddChips"
-            autocomplete="off"
-            (novoChipInputTokenEnd)="add($event, formGroup)"
-          />
-        </novo-chip-list>
-        <novo-autocomplete></novo-autocomplete>
-      </novo-field>
+      <ng-container *novoConditionInputDef="let formGroup" [ngSwitch]="formGroup.value.operator" [formGroup]="formGroup">
+        <novo-field *novoSwitchCases="['includeAny', 'includeAll', 'excludeAny']">
+          <novo-chip-list #chipList aria-label="filter value" formControlName="value">
+            <novo-chip *ngFor="let chip of formGroup.value?.value || []" [value]="chip" (removed)="remove(chip, formGroup)">
+              {{ chip }}
+              <novo-icon novoChipRemove>close</novo-icon>
+            </novo-chip>
+            <input
+              novoChipInput
+              [placeholder]="labels.typeToAddChips"
+              autocomplete="off"
+              (novoChipInputTokenEnd)="add($event, formGroup)"
+            />
+          </novo-chip-list>
+          <novo-autocomplete></novo-autocomplete>
+        </novo-field>
+        <novo-field *novoSwitchCases="['isEmpty']">
+          <novo-radio-group formControlName="value">
+            <novo-radio [value]="true">{{ labels.yes }}</novo-radio>
+            <novo-radio [value]="false">{{ labels.no }}</novo-radio>
+          </novo-radio-group>
+        </novo-field>
+      </ng-container>
     </ng-container>
   `,
                     encapsulation: ViewEncapsulation.None,
@@ -57430,14 +57776,14 @@ class ConditionGroupComponent {
         return this.root.length <= 1;
     }
 }
-ConditionGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ConditionGroupComponent, deps: [{ token: QueryBuilderService }, { token: NovoLabelService }, { token: i5.ControlContainer }, { token: i5.FormBuilder }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-ConditionGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: ConditionGroupComponent, selector: "novo-condition-group", inputs: { controlName: "controlName", groupIndex: "groupIndex" }, host: { classAttribute: "novo-condition-group" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => ConditionGroupComponent), multi: true }], ngImport: i0, template: "<div [formGroup]=\"parentForm\" class=\"condition-group-container\">\n  <novo-stack [formArrayName]=\"controlName\" gap=\"md\">\n    <ng-container\n      *ngFor=\"let andGroup of root.controls; let andIndex = index; let isFirst = first;let isLast = last;\">\n      <ng-container [formGroupName]=\"andIndex\">\n        <novo-flex class=\"condition-row\" align=\"end\" gap=\"sm\">\n          <novo-dropdown *ngIf=\"!isFirst && qbs.allowedGroupings.length > 1; else labeledGroup\">\n            <button theme=\"dialogue\" icon=\"collapse\" size=\"sm\">{{qbs.getConjunctionLabel(controlName)}}</button>\n            <novo-optgroup>\n              <novo-option *ngFor=\"let c of qbs.allowedGroupings\" (click)=\"updateControlName(c)\">\n                {{qbs.getConjunctionLabel(c)}}</novo-option>\n            </novo-optgroup>\n          </novo-dropdown>\n          <ng-template #labeledGroup>\n            <novo-label *ngIf=\"!isFirst\" color=\"ash\" size=\"xs\" uppercase padding=\"sm\">\n              {{qbs.getConjunctionLabel(controlName)}}</novo-label>\n          </ng-template>\n          <novo-condition-builder [groupIndex]=\"groupIndex\" [andIndex]=\"andIndex\" [isFirst]=\"isFirst\"></novo-condition-builder>\n          <novo-button theme=\"icon\" icon=\"delete-o\" color=\"negative\" (click)=\"removeCondition(andIndex)\"\n            [disabled]=\"cantRemoveRow(isFirst)\">\n          </novo-button>\n        </novo-flex>\n      </ng-container>\n    </ng-container>\n    <button theme=\"dialogue\" data-automation-id=\"add-advanced-search-condition\" icon=\"add-thin\" side=\"left\" size=\"sm\" uppercase padding=\"sm\" (click)=\"addCondition()\">\n      {{ labels.addCondition }}</button>\n  </novo-stack>\n  <!-- <button class=\"and-or-button\" theme=\"secondary\" size=\"sm\" (click)=\"addRootCondition()\">{{ addCriteriaLabel }}</button> -->\n</div>", styles: [":host{position:relative;display:block;border:1px solid var(--border);border-radius:var(--border-radius-round);padding:var(--spacing-md);width:100%}:host .condition-row{width:100%}\n"], components: [{ type: NovoStackElement, selector: "novo-stack,novo-column", inputs: ["direction", "align"] }, { type: NovoFlexElement, selector: "novo-flex,novo-row", inputs: ["direction", "align", "justify", "wrap", "gap"] }, { type: NovoDropdownElement, selector: "novo-dropdown", inputs: ["parentScrollSelector", "parentScrollAction", "containerClass", "side", "scrollStrategy", "keepOpen", "height", "width", "appendToBody", "multiple"], outputs: ["toggled"] }, { type: NovoButtonElement, selector: "novo-button,button[theme]", inputs: ["color", "side", "size", "theme", "loading", "icon", "disabled"] }, { type: NovoOptgroup, selector: "novo-optgroup", inputs: ["disabled", "label"], exportAs: ["novoOptgroup"] }, { type: NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }, { type: NovoLabel, selector: "novo-label,[novo-label]" }, { type: ConditionBuilderComponent, selector: "novo-condition-builder", inputs: ["label", "isFirst", "andIndex", "groupIndex"] }], directives: [{ type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: GapDirective, selector: "[gap]", inputs: ["gap"] }, { type: i5.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: ThemeColorDirective, selector: "[theme]", inputs: ["theme"] }, { type: PaddingDirective, selector: "[p],[padding],[paddingTop],[paddingRight],[paddingBottom],[paddingLeft],[paddingX],[paddingY],[pt],[pr],[pb],[pl],[px],[py]", inputs: ["padding", "p", "paddingLeft", "pl", "paddingRight", "pr", "paddingTop", "pt", "paddingBottom", "pb", "paddingX", "px", "paddingY", "py"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+ConditionGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ConditionGroupComponent, deps: [{ token: QueryBuilderService }, { token: NovoLabelService }, { token: i4.ControlContainer }, { token: i4.FormBuilder }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+ConditionGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: ConditionGroupComponent, selector: "novo-condition-group", inputs: { controlName: "controlName", groupIndex: "groupIndex" }, host: { classAttribute: "novo-condition-group" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => ConditionGroupComponent), multi: true }], ngImport: i0, template: "<div [formGroup]=\"parentForm\" class=\"condition-group-container\">\n  <novo-stack [formArrayName]=\"controlName\" gap=\"md\">\n    <ng-container\n      *ngFor=\"let andGroup of root.controls; let andIndex = index; let isFirst = first;let isLast = last;\">\n      <ng-container [formGroupName]=\"andIndex\">\n        <novo-flex class=\"condition-row\" align=\"end\" gap=\"sm\">\n          <novo-dropdown *ngIf=\"!isFirst && qbs.allowedGroupings.length > 1; else labeledGroup\">\n            <button theme=\"dialogue\" icon=\"collapse\" size=\"sm\">{{qbs.getConjunctionLabel(controlName)}}</button>\n            <novo-optgroup>\n              <novo-option *ngFor=\"let c of qbs.allowedGroupings\" (click)=\"updateControlName(c)\">\n                {{qbs.getConjunctionLabel(c)}}</novo-option>\n            </novo-optgroup>\n          </novo-dropdown>\n          <ng-template #labeledGroup>\n            <novo-label *ngIf=\"!isFirst\" color=\"ash\" size=\"xs\" uppercase padding=\"sm\">\n              {{qbs.getConjunctionLabel(controlName)}}</novo-label>\n          </ng-template>\n          <novo-condition-builder [groupIndex]=\"groupIndex\" [andIndex]=\"andIndex\" [isFirst]=\"isFirst\"></novo-condition-builder>\n          <novo-button theme=\"icon\" icon=\"delete-o\" color=\"negative\" (click)=\"removeCondition(andIndex)\"\n            [disabled]=\"cantRemoveRow(isFirst)\">\n          </novo-button>\n        </novo-flex>\n      </ng-container>\n    </ng-container>\n    <button theme=\"dialogue\" data-automation-id=\"add-advanced-search-condition\" icon=\"add-thin\" side=\"left\" size=\"sm\" uppercase padding=\"sm\" (click)=\"addCondition()\">\n      {{ labels.addCondition }}</button>\n  </novo-stack>\n  <!-- <button class=\"and-or-button\" theme=\"secondary\" size=\"sm\" (click)=\"addRootCondition()\">{{ addCriteriaLabel }}</button> -->\n</div>", styles: [":host{position:relative;display:block;border:1px solid var(--border);border-radius:var(--border-radius-round);padding:var(--spacing-md);width:100%}:host .condition-row{width:100%}\n"], components: [{ type: NovoStackElement, selector: "novo-stack,novo-column", inputs: ["direction", "align"] }, { type: NovoFlexElement, selector: "novo-flex,novo-row", inputs: ["direction", "align", "justify", "wrap", "gap"] }, { type: NovoDropdownElement, selector: "novo-dropdown", inputs: ["parentScrollSelector", "parentScrollAction", "containerClass", "side", "scrollStrategy", "keepOpen", "height", "width", "appendToBody", "multiple"], outputs: ["toggled"] }, { type: NovoButtonElement, selector: "novo-button,button[theme]", inputs: ["color", "side", "size", "theme", "loading", "icon", "disabled"] }, { type: NovoOptgroup, selector: "novo-optgroup", inputs: ["disabled", "label"], exportAs: ["novoOptgroup"] }, { type: NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }, { type: NovoLabel, selector: "novo-label,[novo-label]" }, { type: ConditionBuilderComponent, selector: "novo-condition-builder", inputs: ["label", "isFirst", "andIndex", "groupIndex"] }], directives: [{ type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: GapDirective, selector: "[gap]", inputs: ["gap"] }, { type: i4.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: ThemeColorDirective, selector: "[theme]", inputs: ["theme"] }, { type: PaddingDirective, selector: "[p],[padding],[paddingTop],[paddingRight],[paddingBottom],[paddingLeft],[paddingX],[paddingY],[pt],[pr],[pb],[pl],[px],[py]", inputs: ["padding", "p", "paddingLeft", "pl", "paddingRight", "pr", "paddingTop", "pt", "paddingBottom", "pb", "paddingX", "px", "paddingY", "py"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: ConditionGroupComponent, decorators: [{
             type: Component,
             args: [{ selector: 'novo-condition-group', changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => ConditionGroupComponent), multi: true }], host: {
                         class: 'novo-condition-group',
                     }, template: "<div [formGroup]=\"parentForm\" class=\"condition-group-container\">\n  <novo-stack [formArrayName]=\"controlName\" gap=\"md\">\n    <ng-container\n      *ngFor=\"let andGroup of root.controls; let andIndex = index; let isFirst = first;let isLast = last;\">\n      <ng-container [formGroupName]=\"andIndex\">\n        <novo-flex class=\"condition-row\" align=\"end\" gap=\"sm\">\n          <novo-dropdown *ngIf=\"!isFirst && qbs.allowedGroupings.length > 1; else labeledGroup\">\n            <button theme=\"dialogue\" icon=\"collapse\" size=\"sm\">{{qbs.getConjunctionLabel(controlName)}}</button>\n            <novo-optgroup>\n              <novo-option *ngFor=\"let c of qbs.allowedGroupings\" (click)=\"updateControlName(c)\">\n                {{qbs.getConjunctionLabel(c)}}</novo-option>\n            </novo-optgroup>\n          </novo-dropdown>\n          <ng-template #labeledGroup>\n            <novo-label *ngIf=\"!isFirst\" color=\"ash\" size=\"xs\" uppercase padding=\"sm\">\n              {{qbs.getConjunctionLabel(controlName)}}</novo-label>\n          </ng-template>\n          <novo-condition-builder [groupIndex]=\"groupIndex\" [andIndex]=\"andIndex\" [isFirst]=\"isFirst\"></novo-condition-builder>\n          <novo-button theme=\"icon\" icon=\"delete-o\" color=\"negative\" (click)=\"removeCondition(andIndex)\"\n            [disabled]=\"cantRemoveRow(isFirst)\">\n          </novo-button>\n        </novo-flex>\n      </ng-container>\n    </ng-container>\n    <button theme=\"dialogue\" data-automation-id=\"add-advanced-search-condition\" icon=\"add-thin\" side=\"left\" size=\"sm\" uppercase padding=\"sm\" (click)=\"addCondition()\">\n      {{ labels.addCondition }}</button>\n  </novo-stack>\n  <!-- <button class=\"and-or-button\" theme=\"secondary\" size=\"sm\" (click)=\"addRootCondition()\">{{ addCriteriaLabel }}</button> -->\n</div>", styles: [":host{position:relative;display:block;border:1px solid var(--border);border-radius:var(--border-radius-round);padding:var(--spacing-md);width:100%}:host .condition-row{width:100%}\n"] }]
-        }], ctorParameters: function () { return [{ type: QueryBuilderService }, { type: NovoLabelService }, { type: i5.ControlContainer }, { type: i5.FormBuilder }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { controlName: [{
+        }], ctorParameters: function () { return [{ type: QueryBuilderService }, { type: NovoLabelService }, { type: i4.ControlContainer }, { type: i4.FormBuilder }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { controlName: [{
                 type: Input
             }], groupIndex: [{
                 type: Input
@@ -57547,12 +57893,12 @@ class CriteriaBuilderComponent {
         });
     }
 }
-CriteriaBuilderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: CriteriaBuilderComponent, deps: [{ token: i5.ControlContainer }, { token: i5.FormBuilder }, { token: i0.ChangeDetectorRef }, { token: QueryBuilderService }], target: i0.ɵɵFactoryTarget.Component });
+CriteriaBuilderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: CriteriaBuilderComponent, deps: [{ token: i4.ControlContainer }, { token: i4.FormBuilder }, { token: i0.ChangeDetectorRef }, { token: QueryBuilderService }], target: i0.ɵɵFactoryTarget.Component });
 CriteriaBuilderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: CriteriaBuilderComponent, selector: "novo-criteria-builder", inputs: { config: "config", controlName: "controlName", allowedGroupings: "allowedGroupings", editTypeFn: "editTypeFn" }, host: { classAttribute: "novo-criteria-builder" }, providers: [
         { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => CriteriaBuilderComponent), multi: true },
         { provide: NOVO_CRITERIA_BUILDER, useExisting: CriteriaBuilderComponent },
         { provide: QueryBuilderService, useClass: QueryBuilderService },
-    ], queries: [{ propertyName: "_contentFieldDefs", predicate: NovoConditionFieldDef, descendants: true }], ngImport: i0, template: "<form [formGroup]=\"innerForm\">\n  <novo-stack [formArrayName]=\"controlName\" class=\"criteria-builder-inner\">\n    <ng-container\n      *ngFor=\"let andGroup of root.controls; let andIndex = index; let isFirst = first;let isLastAnd = last;\">\n      <novo-label *ngIf=\"!isFirst\" color=\"ash\" size=\"xs\" uppercase padding=\"sm\">{{qbs.getConjunctionLabel('and')}}\n      </novo-label>\n      <novo-condition-group [groupIndex]=\"andIndex\" [formGroupName]=\"andIndex\"></novo-condition-group>\n    </ng-container>\n  </novo-stack>\n</form>\n<novo-id-condition-def name=\"ID\"></novo-id-condition-def>\n<novo-date-condition-def name=\"TIMESTAMP\"></novo-date-condition-def>\n<novo-string-condition-def name=\"STRING\"></novo-string-condition-def>\n<novo-number-condition-def name=\"FLOAT\"></novo-number-condition-def>\n<novo-number-condition-def name=\"INTEGER\"></novo-number-condition-def>\n<novo-number-condition-def name=\"BIGDECIMAL\"></novo-number-condition-def>\n<novo-number-condition-def name=\"DOUBLE\"></novo-number-condition-def>\n<novo-address-condition-def name=\"ADDRESS\"></novo-address-condition-def>\n<novo-boolean-condition-def name=\"BOOLEAN\"></novo-boolean-condition-def>\n<novo-picker-condition-def name=\"SELECT\"></novo-picker-condition-def>\n<novo-string-condition-def name=\"DEFAULT\"></novo-string-condition-def>\n\n<!-- \n  {\n    $and: [{\n      $or: [{\n        entity: 'JobOrder'\n        field: 'categories',\n        operator: 'doesNotContain',\n        value: 'Healthcare'\n      }]\n    }]\n  }\n -->", styles: [":host{position:relative;display:block;width:76rem}:host .criteria-builder-inner{padding-bottom:1rem}\n"], components: [{ type: NovoStackElement, selector: "novo-stack,novo-column", inputs: ["direction", "align"] }, { type: NovoLabel, selector: "novo-label,[novo-label]" }, { type: ConditionGroupComponent, selector: "novo-condition-group", inputs: ["controlName", "groupIndex"] }, { type: NovoDefaultIdConditionDef, selector: "novo-id-condition-def" }, { type: NovoDefaultDateConditionDef, selector: "novo-date-condition-def" }, { type: NovoDefaultStringConditionDef, selector: "novo-string-condition-def" }, { type: NovoDefaultNumberConditionDef, selector: "novo-number-condition-def" }, { type: NovoDefaultAddressConditionDef, selector: "novo-address-condition-def" }, { type: NovoDefaultBooleanConditionDef, selector: "novo-boolean-condition-def" }, { type: NovoDefaultPickerConditionDef, selector: "novo-picker-condition-def" }], directives: [{ type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i5.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: PaddingDirective, selector: "[p],[padding],[paddingTop],[paddingRight],[paddingBottom],[paddingLeft],[paddingX],[paddingY],[pt],[pr],[pb],[pl],[px],[py]", inputs: ["padding", "p", "paddingLeft", "pl", "paddingRight", "pr", "paddingTop", "pt", "paddingBottom", "pb", "paddingX", "px", "paddingY", "py"] }, { type: i5.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    ], queries: [{ propertyName: "_contentFieldDefs", predicate: NovoConditionFieldDef, descendants: true }], ngImport: i0, template: "<form [formGroup]=\"innerForm\">\n  <novo-stack [formArrayName]=\"controlName\" class=\"criteria-builder-inner\">\n    <ng-container\n      *ngFor=\"let andGroup of root.controls; let andIndex = index; let isFirst = first;let isLastAnd = last;\">\n      <novo-label *ngIf=\"!isFirst\" color=\"ash\" size=\"xs\" uppercase padding=\"sm\">{{qbs.getConjunctionLabel('and')}}\n      </novo-label>\n      <novo-condition-group [groupIndex]=\"andIndex\" [formGroupName]=\"andIndex\"></novo-condition-group>\n    </ng-container>\n  </novo-stack>\n</form>\n<novo-id-condition-def name=\"ID\"></novo-id-condition-def>\n<novo-date-condition-def name=\"TIMESTAMP\"></novo-date-condition-def>\n<novo-string-condition-def name=\"STRING\"></novo-string-condition-def>\n<novo-number-condition-def name=\"FLOAT\"></novo-number-condition-def>\n<novo-number-condition-def name=\"INTEGER\"></novo-number-condition-def>\n<novo-number-condition-def name=\"BIGDECIMAL\"></novo-number-condition-def>\n<novo-number-condition-def name=\"DOUBLE\"></novo-number-condition-def>\n<novo-address-condition-def name=\"ADDRESS\"></novo-address-condition-def>\n<novo-boolean-condition-def name=\"BOOLEAN\"></novo-boolean-condition-def>\n<novo-picker-condition-def name=\"SELECT\"></novo-picker-condition-def>\n<novo-string-condition-def name=\"DEFAULT\"></novo-string-condition-def>\n\n<!-- \n  {\n    $and: [{\n      $or: [{\n        entity: 'JobOrder'\n        field: 'categories',\n        operator: 'doesNotContain',\n        value: 'Healthcare'\n      }]\n    }]\n  }\n -->", styles: [":host{position:relative;display:block;width:76rem}:host .criteria-builder-inner{padding-bottom:1rem}\n"], components: [{ type: NovoStackElement, selector: "novo-stack,novo-column", inputs: ["direction", "align"] }, { type: NovoLabel, selector: "novo-label,[novo-label]" }, { type: ConditionGroupComponent, selector: "novo-condition-group", inputs: ["controlName", "groupIndex"] }, { type: NovoDefaultIdConditionDef, selector: "novo-id-condition-def" }, { type: NovoDefaultDateConditionDef, selector: "novo-date-condition-def" }, { type: NovoDefaultStringConditionDef, selector: "novo-string-condition-def" }, { type: NovoDefaultNumberConditionDef, selector: "novo-number-condition-def" }, { type: NovoDefaultAddressConditionDef, selector: "novo-address-condition-def" }, { type: NovoDefaultBooleanConditionDef, selector: "novo-boolean-condition-def" }, { type: NovoDefaultPickerConditionDef, selector: "novo-picker-condition-def" }], directives: [{ type: i4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i4.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: PaddingDirective, selector: "[p],[padding],[paddingTop],[paddingRight],[paddingBottom],[paddingLeft],[paddingX],[paddingY],[pt],[pr],[pb],[pl],[px],[py]", inputs: ["padding", "p", "paddingLeft", "pl", "paddingRight", "pr", "paddingTop", "pt", "paddingBottom", "pb", "paddingX", "px", "paddingY", "py"] }, { type: i4.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: CriteriaBuilderComponent, decorators: [{
             type: Component,
             args: [{ selector: 'novo-criteria-builder', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
@@ -57562,7 +57908,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                     ], host: {
                         class: 'novo-criteria-builder',
                     }, template: "<form [formGroup]=\"innerForm\">\n  <novo-stack [formArrayName]=\"controlName\" class=\"criteria-builder-inner\">\n    <ng-container\n      *ngFor=\"let andGroup of root.controls; let andIndex = index; let isFirst = first;let isLastAnd = last;\">\n      <novo-label *ngIf=\"!isFirst\" color=\"ash\" size=\"xs\" uppercase padding=\"sm\">{{qbs.getConjunctionLabel('and')}}\n      </novo-label>\n      <novo-condition-group [groupIndex]=\"andIndex\" [formGroupName]=\"andIndex\"></novo-condition-group>\n    </ng-container>\n  </novo-stack>\n</form>\n<novo-id-condition-def name=\"ID\"></novo-id-condition-def>\n<novo-date-condition-def name=\"TIMESTAMP\"></novo-date-condition-def>\n<novo-string-condition-def name=\"STRING\"></novo-string-condition-def>\n<novo-number-condition-def name=\"FLOAT\"></novo-number-condition-def>\n<novo-number-condition-def name=\"INTEGER\"></novo-number-condition-def>\n<novo-number-condition-def name=\"BIGDECIMAL\"></novo-number-condition-def>\n<novo-number-condition-def name=\"DOUBLE\"></novo-number-condition-def>\n<novo-address-condition-def name=\"ADDRESS\"></novo-address-condition-def>\n<novo-boolean-condition-def name=\"BOOLEAN\"></novo-boolean-condition-def>\n<novo-picker-condition-def name=\"SELECT\"></novo-picker-condition-def>\n<novo-string-condition-def name=\"DEFAULT\"></novo-string-condition-def>\n\n<!-- \n  {\n    $and: [{\n      $or: [{\n        entity: 'JobOrder'\n        field: 'categories',\n        operator: 'doesNotContain',\n        value: 'Healthcare'\n      }]\n    }]\n  }\n -->", styles: [":host{position:relative;display:block;width:76rem}:host .criteria-builder-inner{padding-bottom:1rem}\n"] }]
-        }], ctorParameters: function () { return [{ type: i5.ControlContainer }, { type: i5.FormBuilder }, { type: i0.ChangeDetectorRef }, { type: QueryBuilderService }]; }, propDecorators: { config: [{
+        }], ctorParameters: function () { return [{ type: i4.ControlContainer }, { type: i4.FormBuilder }, { type: i0.ChangeDetectorRef }, { type: QueryBuilderService }]; }, propDecorators: { config: [{
                 type: Input
             }], controlName: [{
                 type: Input
@@ -57653,6 +57999,7 @@ NovoQueryBuilderModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0",
         NovoCardModule,
         NovoDatePickerModule,
         NovoIconModule,
+        NovoRadioModule,
         NovoSearchBoxModule,
         NovoSwitchModule,
         NovoChipsModule,
@@ -57688,6 +58035,7 @@ NovoQueryBuilderModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0",
             NovoCardModule,
             NovoDatePickerModule,
             NovoIconModule,
+            NovoRadioModule,
             NovoSearchBoxModule,
             NovoSwitchModule,
             NovoChipsModule,
@@ -57716,6 +58064,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
                         NovoCardModule,
                         NovoDatePickerModule,
                         NovoIconModule,
+                        NovoRadioModule,
                         NovoSearchBoxModule,
                         NovoSwitchModule,
                         NovoChipsModule,
@@ -58030,7 +58379,7 @@ class NovoSimpleCheckboxHeaderCell extends _NovoHeaderCell {
     }
 }
 NovoSimpleCheckboxHeaderCell.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoSimpleCheckboxHeaderCell, deps: [{ token: i1$9.CdkColumnDef }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }, { token: NovoSelection, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-NovoSimpleCheckboxHeaderCell.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NovoSimpleCheckboxHeaderCell, selector: "novo-simple-checkbox-header-cell", host: { properties: { "attr.role": "this.role" } }, usesInheritance: true, ngImport: i0, template: `<novo-checkbox [(ngModel)]="selectAll" (ngModelChange)="toggle($event)"></novo-checkbox>`, isInline: true, components: [{ type: NovoCheckboxElement, selector: "novo-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "name", "label", "disabled", "layoutOptions", "color", "value", "tabIndex", "required", "checked", "indeterminate"], outputs: ["change", "indeterminateChange", "onSelect"] }], directives: [{ type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
+NovoSimpleCheckboxHeaderCell.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NovoSimpleCheckboxHeaderCell, selector: "novo-simple-checkbox-header-cell", host: { properties: { "attr.role": "this.role" } }, usesInheritance: true, ngImport: i0, template: `<novo-checkbox [(ngModel)]="selectAll" (ngModelChange)="toggle($event)"></novo-checkbox>`, isInline: true, components: [{ type: NovoCheckboxElement, selector: "novo-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "name", "label", "disabled", "layoutOptions", "color", "value", "tabIndex", "required", "checked", "indeterminate"], outputs: ["change", "indeterminateChange", "onSelect"] }], directives: [{ type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoSimpleCheckboxHeaderCell, decorators: [{
             type: Component,
             args: [{
@@ -58127,7 +58476,7 @@ class NovoSimpleCheckboxCell extends _NovoCell {
     }
 }
 NovoSimpleCheckboxCell.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoSimpleCheckboxCell, deps: [{ token: i1$9.CdkColumnDef }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: NovoSelection, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-NovoSimpleCheckboxCell.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NovoSimpleCheckboxCell, selector: "novo-simple-checkbox-cell", inputs: { row: "row", index: "index" }, host: { properties: { "attr.role": "this.role" } }, usesInheritance: true, ngImport: i0, template: ` <novo-checkbox [ngModel]="selected" (ngModelChange)="toggle($event)"></novo-checkbox> `, isInline: true, components: [{ type: NovoCheckboxElement, selector: "novo-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "name", "label", "disabled", "layoutOptions", "color", "value", "tabIndex", "required", "checked", "indeterminate"], outputs: ["change", "indeterminateChange", "onSelect"] }], directives: [{ type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
+NovoSimpleCheckboxCell.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NovoSimpleCheckboxCell, selector: "novo-simple-checkbox-cell", inputs: { row: "row", index: "index" }, host: { properties: { "attr.role": "this.role" } }, usesInheritance: true, ngImport: i0, template: ` <novo-checkbox [ngModel]="selected" (ngModelChange)="toggle($event)"></novo-checkbox> `, isInline: true, components: [{ type: NovoCheckboxElement, selector: "novo-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "name", "label", "disabled", "layoutOptions", "color", "value", "tabIndex", "required", "checked", "indeterminate"], outputs: ["change", "indeterminateChange", "onSelect"] }], directives: [{ type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoSimpleCheckboxCell, decorators: [{
             type: Component,
             args: [{
@@ -58468,7 +58817,7 @@ NovoSimpleCellHeader.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
         </ng-container>
       </novo-dropdown>
     </div>
-  `, isInline: true, components: [{ type: NovoButtonElement, selector: "novo-button,button[theme]", inputs: ["color", "side", "size", "theme", "loading", "icon", "disabled"] }, { type: NovoDropdownElement, selector: "novo-dropdown", inputs: ["parentScrollSelector", "parentScrollAction", "containerClass", "side", "scrollStrategy", "keepOpen", "height", "width", "appendToBody", "multiple"], outputs: ["toggled"] }, { type: NovoOptgroup, selector: "novo-optgroup", inputs: ["disabled", "label"], exportAs: ["novoOptgroup"] }, { type: NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }, { type: NovoDatePickerElement, selector: "novo-date-picker", inputs: ["minYear", "maxYear", "start", "end", "inline", "weekStart", "preselected", "hideOverflowDays", "hideFooter", "disabledDateMessage", "numberOfMonths", "mode", "range", "weekRangeSelect"], outputs: ["onSelect"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: ThemeColorDirective, selector: "[theme]", inputs: ["theme"] }, { type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: NovoSimpleFilterFocus, selector: "[novoSimpleFilterFocus]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+  `, isInline: true, components: [{ type: NovoButtonElement, selector: "novo-button,button[theme]", inputs: ["color", "side", "size", "theme", "loading", "icon", "disabled"] }, { type: NovoDropdownElement, selector: "novo-dropdown", inputs: ["parentScrollSelector", "parentScrollAction", "containerClass", "side", "scrollStrategy", "keepOpen", "height", "width", "appendToBody", "multiple"], outputs: ["toggled"] }, { type: NovoOptgroup, selector: "novo-optgroup", inputs: ["disabled", "label"], exportAs: ["novoOptgroup"] }, { type: NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }, { type: NovoDatePickerElement, selector: "novo-date-picker", inputs: ["minYear", "maxYear", "start", "end", "inline", "weekStart", "preselected", "hideOverflowDays", "hideFooter", "disabledDateMessage", "numberOfMonths", "mode", "range", "weekRangeSelect"], outputs: ["onSelect"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: ThemeColorDirective, selector: "[theme]", inputs: ["theme"] }, { type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i4.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: NovoSimpleFilterFocus, selector: "[novoSimpleFilterFocus]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoSimpleCellHeader, decorators: [{
             type: Component,
             args: [{
@@ -58738,7 +59087,7 @@ NovoSimpleTablePagination.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.
     >
       <span>{{ labels.next }}</span>
     </novo-button>
-  `, isInline: true, components: [{ type: NovoTilesElement, selector: "novo-tiles", inputs: ["name", "options", "required", "controlDisabled"], outputs: ["onChange", "onSelectedOptionClick", "onDisabledOptionClick"] }, { type: NovoButtonElement, selector: "novo-button,button[theme]", inputs: ["color", "side", "size", "theme", "loading", "icon", "disabled"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: ThemeColorDirective, selector: "[theme]", inputs: ["theme"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+  `, isInline: true, components: [{ type: NovoTilesElement, selector: "novo-tiles", inputs: ["name", "options", "required", "controlDisabled"], outputs: ["onChange", "onSelectedOptionClick", "onDisabledOptionClick"] }, { type: NovoButtonElement, selector: "novo-button,button[theme]", inputs: ["color", "side", "size", "theme", "loading", "icon", "disabled"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: ThemeColorDirective, selector: "[theme]", inputs: ["theme"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoSimpleTablePagination, decorators: [{
             type: Component,
             args: [{
@@ -59192,7 +59541,7 @@ NovoActivityTable.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", vers
         </div>
       </div>
     </div>
-  `, isInline: true, components: [{ type: NovoSearchBoxElement, selector: "novo-search", inputs: ["name", "icon", "position", "placeholder", "alwaysOpen", "theme", "color", "closeOnSelect", "displayField", "displayValue", "hint", "keepOpen", "hasBackdrop", "allowPropagation"], outputs: ["searchChanged", "applySearch"] }, { type: NovoSimpleTablePagination, selector: "novo-simple-table-pagination", inputs: ["page", "length", "pageSize", "pageSizeOptions"], outputs: ["pageChange"] }, { type: NovoLoadingElement, selector: "novo-loading", inputs: ["theme", "color", "size"] }, { type: NovoTable, selector: "novo-simple-table" }, { type: NovoSimpleCheckboxHeaderCell, selector: "novo-simple-checkbox-header-cell" }, { type: NovoSimpleCheckboxCell, selector: "novo-simple-checkbox-cell", inputs: ["row", "index"] }, { type: NovoSimpleActionCell, selector: "novo-simple-action-cell", inputs: ["row", "column"] }, { type: NovoSimpleCellHeader, selector: "[novo-simple-cell-config]", inputs: ["defaultSort", "novo-simple-cell-config"] }, { type: NovoSimpleCell, selector: "novo-simple-cell", inputs: ["row", "column"] }, { type: NovoSimpleHeaderRow, selector: "novo-simple-header-row" }, { type: NovoSimpleRow, selector: "novo-simple-row" }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: NovoSortFilter, selector: "[novoSortFilter]" }, { type: NovoSelection, selector: "[novoSelection]", outputs: ["novoSelectAllToggle"] }, { type: NovoSimpleColumnDef, selector: "[novoSimpleColumnDef]", inputs: ["novoSimpleColumnDef"] }, { type: NovoSimpleHeaderCellDef, selector: "[novoSimpleHeaderCellDef]" }, { type: NovoSimpleCellDef, selector: "[novoSimpleCellDef]" }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: NovoSimpleEmptyHeaderCell, selector: "novo-simple-empty-header-cell" }, { type: NovoSimpleHeaderCell, selector: "novo-simple-header-cell", inputs: ["column"] }, { type: NovoSimpleHeaderRowDef, selector: "[novoSimpleHeaderRowDef]", inputs: ["novoSimpleHeaderRowDef"] }, { type: NovoSimpleRowDef, selector: "[novoSimpleRowDef]", inputs: ["novoSimpleRowDefColumns"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+  `, isInline: true, components: [{ type: NovoSearchBoxElement, selector: "novo-search", inputs: ["name", "icon", "position", "placeholder", "alwaysOpen", "theme", "color", "closeOnSelect", "displayField", "displayValue", "hint", "keepOpen", "hasBackdrop", "allowPropagation"], outputs: ["searchChanged", "applySearch"] }, { type: NovoSimpleTablePagination, selector: "novo-simple-table-pagination", inputs: ["page", "length", "pageSize", "pageSizeOptions"], outputs: ["pageChange"] }, { type: NovoLoadingElement, selector: "novo-loading", inputs: ["theme", "color", "size"] }, { type: NovoTable, selector: "novo-simple-table" }, { type: NovoSimpleCheckboxHeaderCell, selector: "novo-simple-checkbox-header-cell" }, { type: NovoSimpleCheckboxCell, selector: "novo-simple-checkbox-cell", inputs: ["row", "index"] }, { type: NovoSimpleActionCell, selector: "novo-simple-action-cell", inputs: ["row", "column"] }, { type: NovoSimpleCellHeader, selector: "[novo-simple-cell-config]", inputs: ["defaultSort", "novo-simple-cell-config"] }, { type: NovoSimpleCell, selector: "novo-simple-cell", inputs: ["row", "column"] }, { type: NovoSimpleHeaderRow, selector: "novo-simple-header-row" }, { type: NovoSimpleRow, selector: "novo-simple-row" }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: NovoSortFilter, selector: "[novoSortFilter]" }, { type: NovoSelection, selector: "[novoSelection]", outputs: ["novoSelectAllToggle"] }, { type: NovoSimpleColumnDef, selector: "[novoSimpleColumnDef]", inputs: ["novoSimpleColumnDef"] }, { type: NovoSimpleHeaderCellDef, selector: "[novoSimpleHeaderCellDef]" }, { type: NovoSimpleCellDef, selector: "[novoSimpleCellDef]" }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: NovoSimpleEmptyHeaderCell, selector: "novo-simple-empty-header-cell" }, { type: NovoSimpleHeaderCell, selector: "novo-simple-header-cell", inputs: ["column"] }, { type: NovoSimpleHeaderRowDef, selector: "[novoSimpleHeaderRowDef]", inputs: ["novoSimpleHeaderRowDef"] }, { type: NovoSimpleRowDef, selector: "[novoSimpleRowDef]", inputs: ["novoSimpleRowDefColumns"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoActivityTable, decorators: [{
             type: Component,
             args: [{
@@ -60519,7 +60868,7 @@ Pagination.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "1
         <i class="bhi-next" data-automation-id="pager-next"></i>
       </li>
     </ul>
-  `, isInline: true, components: [{ type: NovoSelectElement, selector: "novo-select", inputs: ["disabled", "required", "tabIndex", "id", "name", "options", "placeholder", "readonly", "headerConfig", "position", "overlayWidth", "overlayHeight", "displayWith", "compareWith", "value", "multiple"], outputs: ["onSelect", "selectionChange", "valueChange", "openedChange", "opened", "closed"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+  `, isInline: true, components: [{ type: NovoSelectElement, selector: "novo-select", inputs: ["disabled", "required", "tabIndex", "id", "name", "options", "placeholder", "readonly", "headerConfig", "position", "overlayWidth", "overlayHeight", "displayWith", "compareWith", "value", "multiple"], outputs: ["onSelect", "selectionChange", "valueChange", "openedChange", "opened", "closed"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: Pagination, decorators: [{
             type: Component,
             args: [{
@@ -61765,7 +62114,7 @@ class NovoTableElement {
         return this.editing ? !!column.hideColumnOnEdit : !!column.hideColumnOnView;
     }
 }
-NovoTableElement.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoTableElement, deps: [{ token: NovoLabelService }, { token: FormUtils }, { token: i5.FormBuilder }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+NovoTableElement.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoTableElement, deps: [{ token: NovoLabelService }, { token: FormUtils }, { token: i4.FormBuilder }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
 NovoTableElement.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: NovoTableElement, selector: "novo-table", inputs: { config: "config", columns: "columns", theme: "theme", skipSortAndFilterClear: "skipSortAndFilterClear", mode: "mode", editable: "editable", rowIdentifier: "rowIdentifier", name: "name", rows: "rows", dataProvider: "dataProvider" }, outputs: { onRowClick: "onRowClick", onRowSelect: "onRowSelect", onTableChange: "onTableChange" }, host: { properties: { "attr.theme": "theme", "class.editing": "mode === NovoTableMode.EDIT", "class.novo-table-loading": "loading" }, classAttribute: "novo-table" }, viewQueries: [{ propertyName: "filterInputs", predicate: ["filterInput"], descendants: true, read: ElementRef }], ngImport: i0, template: `
     <header *ngIf="columns.length">
       <ng-content select="novo-table-header"></ng-content>
@@ -62092,7 +62441,7 @@ NovoTableElement.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", versi
         </table>
       </novo-form>
     </div>
-  `, isInline: true, components: [{ type: Pagination, selector: "novo-pagination", inputs: ["page", "totalItems", "itemsPerPage", "rowOptions", "label", "disablePageSelection"], outputs: ["pageChange", "itemsPerPageChange", "onPageChange"] }, { type: NovoLoadingElement, selector: "novo-loading", inputs: ["theme", "color", "size"] }, { type: NovoToastElement, selector: "novo-toast", inputs: ["appearance", "theme", "icon", "title", "action", "hasDialogue", "link", "isCloseable", "message"], outputs: ["closed"] }, { type: NovoFormElement, selector: "novo-form", inputs: ["form", "layout", "hideHeader"] }, { type: NovoButtonElement, selector: "novo-button,button[theme]", inputs: ["color", "side", "size", "theme", "loading", "icon", "disabled"] }, { type: NovoCheckboxElement, selector: "novo-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "name", "label", "disabled", "layoutOptions", "color", "value", "tabIndex", "required", "checked", "indeterminate"], outputs: ["change", "indeterminateChange", "onSelect"] }, { type: NovoDropdownElement, selector: "novo-dropdown", inputs: ["parentScrollSelector", "parentScrollAction", "containerClass", "side", "scrollStrategy", "keepOpen", "height", "width", "appendToBody", "multiple"], outputs: ["toggled"] }, { type: NovoOptgroup, selector: "novo-optgroup", inputs: ["disabled", "label"], exportAs: ["novoOptgroup"] }, { type: NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }, { type: NovoIconComponent, selector: "novo-icon", inputs: ["raised", "theme", "shape", "color", "size", "smaller", "larger", "alt", "name"] }, { type: NovoStackElement, selector: "novo-stack,novo-column", inputs: ["direction", "align"] }, { type: NovoDatePickerElement, selector: "novo-date-picker", inputs: ["minYear", "maxYear", "start", "end", "inline", "weekStart", "preselected", "hideOverflowDays", "hideFooter", "disabledDateMessage", "numberOfMonths", "mode", "range", "weekRangeSelect"], outputs: ["onSelect"] }, { type: TableCell, selector: "novo-table-cell", inputs: ["column", "row", "form", "hasEditor"] }, { type: NovoControlElement, selector: "novo-control", inputs: ["control", "form", "condensed", "autoFocus"], outputs: ["change", "edit", "save", "delete", "upload", "blur", "focus"] }, { type: RowDetails, selector: "novo-row-details", inputs: ["data", "renderer"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: ThemeColorDirective, selector: "[theme]", inputs: ["theme"] }, { type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: TooltipDirective, selector: "[tooltip]", inputs: ["tooltip", "tooltipPosition", "tooltipType", "tooltipSize", "tooltipBounce", "tooltipNoAnimate", "tooltipRounded", "tooltipAlways", "tooltipActive", "tooltipPreline", "removeTooltipArrow", "tooltipAutoPosition", "tooltipIsHTML"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: ThOrderable, selector: "[novoThOrderable]", inputs: ["novoThOrderable"], outputs: ["onOrderChange"] }, { type: ThSortable, selector: "[novoThSortable]", inputs: ["novoThSortable", "column"], outputs: ["onSortChange"] }, { type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: NovoTableKeepFilterFocus, selector: "[keepFilterFocused]" }, { type: TableFilter, selector: "[novoTableFilter]", inputs: ["novoTableFilter"], outputs: ["onFilterChange"] }] });
+  `, isInline: true, components: [{ type: Pagination, selector: "novo-pagination", inputs: ["page", "totalItems", "itemsPerPage", "rowOptions", "label", "disablePageSelection"], outputs: ["pageChange", "itemsPerPageChange", "onPageChange"] }, { type: NovoLoadingElement, selector: "novo-loading", inputs: ["theme", "color", "size"] }, { type: NovoToastElement, selector: "novo-toast", inputs: ["appearance", "theme", "icon", "title", "action", "hasDialogue", "link", "isCloseable", "message"], outputs: ["closed"] }, { type: NovoFormElement, selector: "novo-form", inputs: ["form", "layout", "hideHeader"] }, { type: NovoButtonElement, selector: "novo-button,button[theme]", inputs: ["color", "side", "size", "theme", "loading", "icon", "disabled"] }, { type: NovoCheckboxElement, selector: "novo-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "name", "label", "disabled", "layoutOptions", "color", "value", "tabIndex", "required", "checked", "indeterminate"], outputs: ["change", "indeterminateChange", "onSelect"] }, { type: NovoDropdownElement, selector: "novo-dropdown", inputs: ["parentScrollSelector", "parentScrollAction", "containerClass", "side", "scrollStrategy", "keepOpen", "height", "width", "appendToBody", "multiple"], outputs: ["toggled"] }, { type: NovoOptgroup, selector: "novo-optgroup", inputs: ["disabled", "label"], exportAs: ["novoOptgroup"] }, { type: NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }, { type: NovoIconComponent, selector: "novo-icon", inputs: ["raised", "theme", "shape", "color", "size", "smaller", "larger", "alt", "name"] }, { type: NovoStackElement, selector: "novo-stack,novo-column", inputs: ["direction", "align"] }, { type: NovoDatePickerElement, selector: "novo-date-picker", inputs: ["minYear", "maxYear", "start", "end", "inline", "weekStart", "preselected", "hideOverflowDays", "hideFooter", "disabledDateMessage", "numberOfMonths", "mode", "range", "weekRangeSelect"], outputs: ["onSelect"] }, { type: TableCell, selector: "novo-table-cell", inputs: ["column", "row", "form", "hasEditor"] }, { type: NovoControlElement, selector: "novo-control", inputs: ["control", "form", "condensed", "autoFocus"], outputs: ["change", "edit", "save", "delete", "upload", "blur", "focus"] }, { type: RowDetails, selector: "novo-row-details", inputs: ["data", "renderer"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: ThemeColorDirective, selector: "[theme]", inputs: ["theme"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: TooltipDirective, selector: "[tooltip]", inputs: ["tooltip", "tooltipPosition", "tooltipType", "tooltipSize", "tooltipBounce", "tooltipNoAnimate", "tooltipRounded", "tooltipAlways", "tooltipActive", "tooltipPreline", "removeTooltipArrow", "tooltipAutoPosition", "tooltipIsHTML"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: ThOrderable, selector: "[novoThOrderable]", inputs: ["novoThOrderable"], outputs: ["onOrderChange"] }, { type: ThSortable, selector: "[novoThSortable]", inputs: ["novoThSortable", "column"], outputs: ["onSortChange"] }, { type: i4.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: NovoTableKeepFilterFocus, selector: "[keepFilterFocused]" }, { type: TableFilter, selector: "[novoTableFilter]", inputs: ["novoTableFilter"], outputs: ["onFilterChange"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: NovoTableElement, decorators: [{
             type: Component,
             args: [{
@@ -62432,7 +62781,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
     </div>
   `,
                 }]
-        }], ctorParameters: function () { return [{ type: NovoLabelService }, { type: FormUtils }, { type: i5.FormBuilder }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { filterInputs: [{
+        }], ctorParameters: function () { return [{ type: NovoLabelService }, { type: FormUtils }, { type: i4.FormBuilder }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { filterInputs: [{
                 type: ViewChildren,
                 args: ['filterInput', { read: ElementRef }]
             }], config: [{
@@ -63669,5 +64018,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { AbstractConditionFieldDef, AccentColorDirective, AceEditorControl, ActivityTableDataSource, ActivityTableRenderers, AddressControl, AppBridge, AppBridgeHandler, AppBridgeService, ArrayCollection, AsideComponent, BackgroundColorDirective, BaseConditionFieldDef, BaseControl, BasePickerResults, BaseRenderer, BooleanInput, BorderDirective, BreadcrumbElement, BreadcrumbItemElement, BreadcrumbService, BrowserGlobalRef, COUNTRIES, CalendarEventResponse, Can, CardActionsElement, CardContentElement, CardElement, CardFooterElement, CardHeaderElement, CheckListControl, CheckboxControl, ChecklistPickerResults, CollectionEvent, ComponentUtils, ConditionBuilderComponent, ConditionInputOutlet, ConditionOperatorOutlet, Conjunction, ControlConfirmModal, ControlFactory, ControlPromptModal, CriteriaBuilderComponent, CustomControl, DATEFORMAT_VALUE_ACCESSOR, DATERANGEFORMAT_VALUE_ACCESSOR, DATE_FORMATS, DataTableBigDecimalRendererPipe, DataTableInterpolatePipe, DataTableSource, DataTableState, DateCell, DateControl, DateFormatService, DateTableCurrencyRendererPipe, DateTableDateRendererPipe, DateTableDateTimeRendererPipe, DateTableNumberRendererPipe, DateTableTimeRendererPipe, DateTimeControl, DayOfMonthPipe, DecodeURIPipe, DefaultDateSelectionStrategy, DefaultPipe, Deferred, DevAppBridge, DevAppBridgeService, DistributionListPickerResults, EXPANSION_PANEL_ANIMATION_TIMING, EditState, EditorControl, EndOfWeekDisplayPipe, EntityList, EntityPickerResult, EntityPickerResults, ErrorStateMatcher, FieldInteractionApi, FileControl, FillColorDirective, FlexDirective, FormUtils, FormValidators, GapDirective, GlobalRef, GooglePlacesModule, GooglePlacesService, GroupByPipe, GroupedControl, GroupedMultiPickerResults, Helpers, HighlightPipe, HoursPipe, IsoDatePipe, IsoDateRangePipe, IsoTimePipe, IsoTimeRangePipe, KeyCodes, LocalStorageService, MarginDirective, MenuComponent, MenuContentComponent, MenuDirective, MenuItemDirective, MixedMultiPickerResults, MonthDayPipe, MonthPipe, MultiDateSelectionStrategy, NOVO_BREADCRUMB_REF, NOVO_CHIPS_DEFAULT_OPTIONS, NOVO_CONDITION_BUILDER, NOVO_CRITERIA_BUILDER, NOVO_DATA_TABLE_REF, NOVO_DATE_SELECTION_STRATEGY, NOVO_DATE_SELECTION_STRATEGY_PROVIDER, NOVO_DATE_SELECTION_STRATEGY_PROVIDER_FACTORY, NOVO_ELEMENTS_LABELS_PROVIDERS, NOVO_FORM_FIELD, NOVO_INPUT_FORMAT, NOVO_INPUT_VALUE_ACCESSOR, NOVO_LAYOUT_CONTAINER, NOVO_LAYOUT_DEFAULT_AUTOSIZE, NOVO_LAYOUT_DEFAULT_AUTOSIZE_FACTORY, NOVO_OPTGROUP, NOVO_OPTION_PARENT_COMPONENT, NOVO_PROGRESS_CONTAINER, NOVO_QUERY_BUILDER, NOVO_RADIO_GROUP, NOVO_VALUE_THEME, NOVO_VALUE_TYPE, NativeSelectControl, NodeGlobalRef, NonIdealStateElement, NovoAccordion, NovoAceEditor, NovoAceEditorModule, NovoActivityTable, NovoActivityTableActions, NovoActivityTableCustomFilter, NovoActivityTableCustomHeader, NovoActivityTableEmptyMessage, NovoActivityTableNoResultsMessage, NovoActivityTableState, NovoAddressElement, NovoAgendaAllDayEventElement, NovoAgendaDateChangeElement, NovoAgendaDayEventElement, NovoAgendaDayViewElement, NovoAgendaHourSegmentElement, NovoAgendaModule, NovoAgendaMonthDayElement, NovoAgendaMonthHeaderElement, NovoAgendaMonthViewElement, NovoAgendaWeekEventElement, NovoAgendaWeekHeaderElement, NovoAgendaWeekViewElement, NovoAsideModule, NovoAsideRef, NovoAsideService, NovoAutoSize, NovoAutocompleteElement, NovoAvatarElement, NovoAvatarModule, NovoAvatarStackElement, NovoBaseTextElement, NovoBoxElement, NovoBreadcrumbModule, NovoButtonElement, NovoButtonModule, NovoCKEditorElement, NovoCalendarElement, NovoCalendarModule, NovoCaption, NovoCardModule, NovoCategoryDropdownElement, NovoCategoryDropdownModule, NovoCheckListElement, NovoCheckboxChange, NovoCheckboxElement, NovoCheckboxModule, NovoChipAvatar, NovoChipElement, NovoChipInput, NovoChipList, NovoChipListChange, NovoChipRemove, NovoChipSelectionChange, NovoChipsElement, NovoChipsModule, NovoColorInputElement, NovoColorPickerComponent, NovoColorPickerModule, NovoColorSwatchComponent, NovoCommonModule, NovoConditionFieldDef, NovoConditionInputDef, NovoConditionOperatorsDef, NovoControlElement, NovoControlGroup, NovoControlTemplates, NovoDataTable, NovoDataTableCell, NovoDataTableCellHeader, NovoDataTableCheckboxCell, NovoDataTableCheckboxHeaderCell, NovoDataTableClearButton, NovoDataTableExpandCell, NovoDataTableExpandDirective, NovoDataTableExpandHeaderCell, NovoDataTableFilterUtils, NovoDataTableHeaderCell, NovoDataTableHeaderRow, NovoDataTableModule, NovoDataTablePagination, NovoDataTableRow, NovoDataTableSortButton, NovoDataTableSortFilter, NovoDateFormatDirective, NovoDatePickerElement, NovoDatePickerInputElement, NovoDatePickerModule, NovoDateRangeFormatDirective, NovoDateRangeInputElement, NovoDateTimePickerElement, NovoDateTimePickerInputElement, NovoDateTimePickerModule, NovoDefaultAddressConditionDef, NovoDefaultBooleanConditionDef, NovoDefaultDateConditionDef, NovoDefaultIdConditionDef, NovoDefaultNumberConditionDef, NovoDefaultPickerConditionDef, NovoDefaultStringConditionDef, NovoDividerComponent, NovoDividerModule, NovoDragulaElement, NovoDragulaModule, NovoDragulaService, NovoDropDownItemHeaderElement, NovoDropDownTrigger, NovoDropdownCell, NovoDropdownElement, NovoDropdownListElement, NovoDropdownModule, NovoDynamicFormElement, NovoElementProviders, NovoElementsModule, NovoErrorElement, NovoEventTypeLegendElement, NovoExpansionModule, NovoExpansionPanel, NovoExpansionPanelActionRow, NovoExpansionPanelContent, NovoExpansionPanelDescription, NovoExpansionPanelHeader, NovoExpansionPanelTitle, NovoFieldControl, NovoFieldElement, NovoFieldModule, NovoFieldPrefixDirective, NovoFieldSuffixDirective, NovoFieldsElement, NovoFieldsetElement, NovoFieldsetHeaderElement, NovoFile, NovoFileInputElement, NovoFlexElement, NovoFlexModule, NovoFormControl, NovoFormElement, NovoFormExtrasModule, NovoFormGroup, NovoFormModule, NovoGridElement, NovoHeaderComponent, NovoHeaderModule, NovoHeaderSpacer, NovoHintElement, NovoHorizontalStepper, NovoIconComponent, NovoIconModule, NovoInput, NovoIsLoadingDirective, NovoItemAvatarElement, NovoItemContentElement, NovoItemDateElement, NovoItemElement, NovoItemEndElement, NovoItemHeaderElement, NovoItemTitleElement, NovoLabel, NovoLabelService, NovoLayoutContainer, NovoLayoutContent, NovoLayoutModule, NovoLink, NovoListElement, NovoListItemElement, NovoListModule, NovoLoadedDirective, NovoLoadingElement, NovoLoadingModule, NovoMenuModule, NovoMenuService, NovoModalContainerComponent, NovoModalElement, NovoModalModule, NovoModalNotificationElement, NovoModalParams, NovoModalRef, NovoModalService, NovoMonthSelectElement, NovoMonthViewElement, NovoMultiDateInputElement, NovoMultiPickerElement, NovoMultiPickerModule, NovoNavContentElement, NovoNavElement, NovoNavHeaderElement, NovoNavOutletElement, NovoNonIdealStateModule, NovoNovoCKEditorModule, NovoOptgroup, NovoOptgroupBase, NovoOptgroupMixinBase, NovoOption, NovoOptionBase, NovoOptionModule, NovoOptionSelectedEvent, NovoOptionSelectionChange, NovoOverlayModule, NovoOverlayTemplateComponent, NovoPickerDirective, NovoPickerElement, NovoPickerModule, NovoPickerToggleElement, NovoPipesModule, NovoPopOverModule, NovoProgressBarElement, NovoProgressElement, NovoProgressModule, NovoPseudoCheckbox, NovoPseudoCheckboxModule, NovoQueryBuilderModule, NovoQuickNoteModule, NovoRadioElement, NovoRadioGroup, NovoRadioModule, NovoRailComponent, NovoRowChipElement, NovoRowChipsElement, NovoSearchBoxElement, NovoSearchBoxModule, NovoSelectChange, NovoSelectElement, NovoSelectModule, NovoSelectSearchClearDirective, NovoSelectSearchComponent, NovoSelectSearchModule, NovoSelection, NovoSidenavComponent, NovoSimpleActionCell, NovoSimpleCell, NovoSimpleCellDef, NovoSimpleCellHeader, NovoSimpleCheckboxCell, NovoSimpleCheckboxHeaderCell, NovoSimpleColumnDef, NovoSimpleEmptyHeaderCell, NovoSimpleFilterFocus, NovoSimpleHeaderCell, NovoSimpleHeaderCellDef, NovoSimpleHeaderRow, NovoSimpleHeaderRowDef, NovoSimpleRow, NovoSimpleRowDef, NovoSimpleTableModule, NovoSimpleTablePagination, NovoSkeletonDirective, NovoSliderElement, NovoSliderModule, NovoSortFilter, NovoSpinnerElement, NovoStackElement, NovoStep, NovoStepHeader, NovoStepLabel, NovoStepStatus, NovoStepper, NovoStepperModule, NovoStepperNext, NovoStepperPrevious, NovoSwitchElement, NovoSwitchModule, NovoTabButtonElement, NovoTabElement, NovoTabLinkElement, NovoTabModule, NovoTabbedGroupPickerElement, NovoTabbedGroupPickerModule, NovoTable, NovoTableActionsElement, NovoTableElement, NovoTableExtrasModule, NovoTableFooterElement, NovoTableHeaderElement, NovoTableKeepFilterFocus, NovoTableMode, NovoTableModule, NovoTemplate, NovoTemplateService, NovoText, NovoTheme, NovoThemeOptions, NovoTilesElement, NovoTilesModule, NovoTimeFormatDirective, NovoTimePickerElement, NovoTimePickerInputElement, NovoTimePickerModule, NovoTipWellElement, NovoTipWellModule, NovoTitle, NovoToastElement, NovoToastModule, NovoToastService, NovoToolbar, NovoToolbarModule, NovoToolbarRow, NovoTooltip, NovoTooltipModule, NovoUtilActionComponent, NovoUtilsComponent, NovoValueElement, NovoValueModule, NovoVerticalStepper, NovoYearSelectElement, OptionsService, OutsideClick, PaddingDirective, PagedArrayCollection, Pagination, PercentageCell, PickerControl, PickerResults, PlacesListComponent, PluralPipe, PopOverContent, PopOverDirective, ProgressAppearance, QuickNoteControl, QuickNoteElement, QuickNoteResults, REMOVABLE_REF, RadioControl, RangeSelectionStrategy, ReadOnlyControl, RemoteActivityTableService, RemoteDataTableService, RenderPipe, RowDetails, Security, SelectControl, ShowOnDirtyErrorStateMatcher, SkillsSpecialtyPickerResults, SortDirection, StaticActivityTableService, StaticDataTableService, SwitchCasesDirective, SwitchControl, TIMEFORMAT_VALUE_ACCESSOR, TIME_FORMATS, TIME_VALUE_FORMATS, TableCell, TableFilter, TablePickerControl, TextAreaControl, TextBoxControl, TextColorDirective, ThOrderable, ThSortable, ThemeColorDirective, TilesControl, TimeControl, TimezoneControl, TooltipDirective, Unless, UnlessModule, VisibleDirective, WeekSelectionStrategy, WeekdayPipe, WorkersCompCodesPickerResults, YearPipe, _NovoCdkRowDef, _NovoCell, _NovoCellDef, _NovoColumnDef, _NovoHeaderCell, _NovoHeaderCellDef, _NovoHeaderRow, _NovoHeaderRowDef, _NovoRow, _countGroupLabelsBeforeOption, _getOptionScrollPosition, binarySearch, can, findByCountryCode, findByCountryId, findByCountryName, getCountries, getDayView, getDayViewHourGrid, getMonthView, getSpacingToken, getStateObjects, getStates, getWeekView, getWeekViewEventOffset, getWeekViewHeader, interpolateCell, isAlphaNumeric, mixinColor, mixinDisabled, mixinErrorState, mixinOverlay, mixinRequired, mixinSize, mixinTabIndex, notify, novoExpansionAnimations, novoStepperAnimations, slideInOut, throwNovoDuplicatedSidenavError, zoomInOut };
+export { AbstractConditionFieldDef, AccentColorDirective, AceEditorControl, ActivityTableDataSource, ActivityTableRenderers, AddressControl, AppBridge, AppBridgeHandler, AppBridgeService, ArrayCollection, AsideComponent, BackgroundColorDirective, BaseConditionFieldDef, BaseControl, BasePickerResults, BaseRenderer, BooleanInput, BorderDirective, BreadcrumbElement, BreadcrumbItemElement, BreadcrumbService, BrowserGlobalRef, COUNTRIES, CalendarEventResponse, Can, CardActionsElement, CardContentElement, CardElement, CardFooterElement, CardHeaderElement, CheckListControl, CheckboxControl, ChecklistPickerResults, CollectionEvent, ComponentUtils, ConditionBuilderComponent, ConditionInputOutlet, ConditionOperatorOutlet, Conjunction, ControlConfirmModal, ControlFactory, ControlPromptModal, CriteriaBuilderComponent, CustomControl, DATEFORMAT_VALUE_ACCESSOR, DATERANGEFORMAT_VALUE_ACCESSOR, DATETIMEFORMAT_VALUE_ACCESSOR, DATE_FORMATS, DataTableBigDecimalRendererPipe, DataTableInterpolatePipe, DataTableSource, DataTableState, DateCell, DateControl, DateFormatService, DateTableCurrencyRendererPipe, DateTableDateRendererPipe, DateTableDateTimeRendererPipe, DateTableNumberRendererPipe, DateTableTimeRendererPipe, DateTimeControl, DayOfMonthPipe, DecodeURIPipe, DefaultDateSelectionStrategy, DefaultPipe, Deferred, DevAppBridge, DevAppBridgeService, DistributionListPickerResults, EXPANSION_PANEL_ANIMATION_TIMING, EditState, EditorControl, EndOfWeekDisplayPipe, EntityList, EntityPickerResult, EntityPickerResults, ErrorStateMatcher, FieldInteractionApi, FileControl, FillColorDirective, FlexDirective, FormUtils, FormValidators, GapDirective, GlobalRef, GooglePlacesModule, GooglePlacesService, GroupByPipe, GroupedControl, GroupedMultiPickerResults, Helpers, HighlightPipe, HoursPipe, IsoDatePipe, IsoDateRangePipe, IsoTimePipe, IsoTimeRangePipe, KeyCodes, LocalStorageService, MarginDirective, MenuComponent, MenuContentComponent, MenuDirective, MenuItemDirective, MixedMultiPickerResults, MonthDayPipe, MonthPipe, MultiDateSelectionStrategy, NOVO_BREADCRUMB_REF, NOVO_CHIPS_DEFAULT_OPTIONS, NOVO_CONDITION_BUILDER, NOVO_CRITERIA_BUILDER, NOVO_DATA_TABLE_REF, NOVO_DATE_SELECTION_STRATEGY, NOVO_DATE_SELECTION_STRATEGY_PROVIDER, NOVO_DATE_SELECTION_STRATEGY_PROVIDER_FACTORY, NOVO_ELEMENTS_LABELS_PROVIDERS, NOVO_FORM_FIELD, NOVO_INPUT_FORMAT, NOVO_INPUT_VALUE_ACCESSOR, NOVO_LAYOUT_CONTAINER, NOVO_LAYOUT_DEFAULT_AUTOSIZE, NOVO_LAYOUT_DEFAULT_AUTOSIZE_FACTORY, NOVO_OPTGROUP, NOVO_OPTION_PARENT_COMPONENT, NOVO_PROGRESS_CONTAINER, NOVO_QUERY_BUILDER, NOVO_RADIO_GROUP, NOVO_VALUE_THEME, NOVO_VALUE_TYPE, NativeSelectControl, NodeGlobalRef, NonIdealStateElement, NovoAccordion, NovoAceEditor, NovoAceEditorModule, NovoActivityTable, NovoActivityTableActions, NovoActivityTableCustomFilter, NovoActivityTableCustomHeader, NovoActivityTableEmptyMessage, NovoActivityTableNoResultsMessage, NovoActivityTableState, NovoAddressElement, NovoAgendaAllDayEventElement, NovoAgendaDateChangeElement, NovoAgendaDayEventElement, NovoAgendaDayViewElement, NovoAgendaHourSegmentElement, NovoAgendaModule, NovoAgendaMonthDayElement, NovoAgendaMonthHeaderElement, NovoAgendaMonthViewElement, NovoAgendaWeekEventElement, NovoAgendaWeekHeaderElement, NovoAgendaWeekViewElement, NovoAsideModule, NovoAsideRef, NovoAsideService, NovoAutoSize, NovoAutocompleteElement, NovoAvatarElement, NovoAvatarModule, NovoAvatarStackElement, NovoBaseTextElement, NovoBoxElement, NovoBreadcrumbModule, NovoButtonElement, NovoButtonModule, NovoCKEditorElement, NovoCalendarElement, NovoCalendarModule, NovoCaption, NovoCardModule, NovoCategoryDropdownElement, NovoCategoryDropdownModule, NovoCheckListElement, NovoCheckboxChange, NovoCheckboxElement, NovoCheckboxModule, NovoChipAvatar, NovoChipElement, NovoChipInput, NovoChipList, NovoChipListChange, NovoChipRemove, NovoChipSelectionChange, NovoChipsElement, NovoChipsModule, NovoColorInputElement, NovoColorPickerComponent, NovoColorPickerModule, NovoColorSwatchComponent, NovoCommonModule, NovoConditionFieldDef, NovoConditionInputDef, NovoConditionOperatorsDef, NovoControlElement, NovoControlGroup, NovoControlTemplates, NovoDataTable, NovoDataTableCell, NovoDataTableCellHeader, NovoDataTableCheckboxCell, NovoDataTableCheckboxHeaderCell, NovoDataTableClearButton, NovoDataTableExpandCell, NovoDataTableExpandDirective, NovoDataTableExpandHeaderCell, NovoDataTableFilterUtils, NovoDataTableHeaderCell, NovoDataTableHeaderRow, NovoDataTableModule, NovoDataTablePagination, NovoDataTableRow, NovoDataTableSortButton, NovoDataTableSortFilter, NovoDateFormatDirective, NovoDatePickerElement, NovoDatePickerInputElement, NovoDatePickerModule, NovoDateRangeFormatDirective, NovoDateRangeInputElement, NovoDateTimeFormatDirective, NovoDateTimePickerElement, NovoDateTimePickerInputElement, NovoDateTimePickerModule, NovoDefaultAddressConditionDef, NovoDefaultBooleanConditionDef, NovoDefaultDateConditionDef, NovoDefaultIdConditionDef, NovoDefaultNumberConditionDef, NovoDefaultPickerConditionDef, NovoDefaultStringConditionDef, NovoDividerComponent, NovoDividerModule, NovoDragulaElement, NovoDragulaModule, NovoDragulaService, NovoDropDownItemHeaderElement, NovoDropDownTrigger, NovoDropdownCell, NovoDropdownElement, NovoDropdownListElement, NovoDropdownModule, NovoDynamicFormElement, NovoElementProviders, NovoElementsModule, NovoErrorElement, NovoEventTypeLegendElement, NovoExpansionModule, NovoExpansionPanel, NovoExpansionPanelActionRow, NovoExpansionPanelContent, NovoExpansionPanelDescription, NovoExpansionPanelHeader, NovoExpansionPanelTitle, NovoFieldControl, NovoFieldElement, NovoFieldModule, NovoFieldPrefixDirective, NovoFieldSuffixDirective, NovoFieldsElement, NovoFieldsetElement, NovoFieldsetHeaderElement, NovoFile, NovoFileInputElement, NovoFlexElement, NovoFlexModule, NovoFormControl, NovoFormElement, NovoFormExtrasModule, NovoFormGroup, NovoFormModule, NovoGridElement, NovoHeaderComponent, NovoHeaderModule, NovoHeaderSpacer, NovoHintElement, NovoHorizontalStepper, NovoIconComponent, NovoIconModule, NovoInput, NovoIsLoadingDirective, NovoItemAvatarElement, NovoItemContentElement, NovoItemDateElement, NovoItemElement, NovoItemEndElement, NovoItemHeaderElement, NovoItemTitleElement, NovoLabel, NovoLabelService, NovoLayoutContainer, NovoLayoutContent, NovoLayoutModule, NovoLink, NovoListElement, NovoListItemElement, NovoListModule, NovoLoadedDirective, NovoLoadingElement, NovoLoadingModule, NovoMenuModule, NovoMenuService, NovoModalContainerComponent, NovoModalElement, NovoModalModule, NovoModalNotificationElement, NovoModalParams, NovoModalRef, NovoModalService, NovoMonthSelectElement, NovoMonthViewElement, NovoMultiDateInputElement, NovoMultiPickerElement, NovoMultiPickerModule, NovoNavContentElement, NovoNavElement, NovoNavHeaderElement, NovoNavOutletElement, NovoNonIdealStateModule, NovoNovoCKEditorModule, NovoOptgroup, NovoOptgroupBase, NovoOptgroupMixinBase, NovoOption, NovoOptionBase, NovoOptionModule, NovoOptionSelectedEvent, NovoOptionSelectionChange, NovoOverlayModule, NovoOverlayTemplateComponent, NovoPickerDirective, NovoPickerElement, NovoPickerModule, NovoPickerToggleElement, NovoPipesModule, NovoPopOverModule, NovoProgressBarElement, NovoProgressElement, NovoProgressModule, NovoPseudoCheckbox, NovoPseudoCheckboxModule, NovoQueryBuilderModule, NovoQuickNoteModule, NovoRadioElement, NovoRadioGroup, NovoRadioModule, NovoRailComponent, NovoRowChipElement, NovoRowChipsElement, NovoSearchBoxElement, NovoSearchBoxModule, NovoSelectChange, NovoSelectElement, NovoSelectModule, NovoSelectSearchClearDirective, NovoSelectSearchComponent, NovoSelectSearchModule, NovoSelection, NovoSidenavComponent, NovoSimpleActionCell, NovoSimpleCell, NovoSimpleCellDef, NovoSimpleCellHeader, NovoSimpleCheckboxCell, NovoSimpleCheckboxHeaderCell, NovoSimpleColumnDef, NovoSimpleEmptyHeaderCell, NovoSimpleFilterFocus, NovoSimpleHeaderCell, NovoSimpleHeaderCellDef, NovoSimpleHeaderRow, NovoSimpleHeaderRowDef, NovoSimpleRow, NovoSimpleRowDef, NovoSimpleTableModule, NovoSimpleTablePagination, NovoSkeletonDirective, NovoSliderElement, NovoSliderModule, NovoSortFilter, NovoSpinnerElement, NovoStackElement, NovoStep, NovoStepHeader, NovoStepLabel, NovoStepStatus, NovoStepper, NovoStepperModule, NovoStepperNext, NovoStepperPrevious, NovoSwitchElement, NovoSwitchModule, NovoTabButtonElement, NovoTabElement, NovoTabLinkElement, NovoTabModule, NovoTabbedGroupPickerElement, NovoTabbedGroupPickerModule, NovoTable, NovoTableActionsElement, NovoTableElement, NovoTableExtrasModule, NovoTableFooterElement, NovoTableHeaderElement, NovoTableKeepFilterFocus, NovoTableMode, NovoTableModule, NovoTemplate, NovoTemplateService, NovoText, NovoTheme, NovoThemeOptions, NovoTilesElement, NovoTilesModule, NovoTimeFormatDirective, NovoTimePickerElement, NovoTimePickerInputElement, NovoTimePickerModule, NovoTipWellElement, NovoTipWellModule, NovoTitle, NovoToastElement, NovoToastModule, NovoToastService, NovoToolbar, NovoToolbarModule, NovoToolbarRow, NovoTooltip, NovoTooltipModule, NovoUtilActionComponent, NovoUtilsComponent, NovoValueElement, NovoValueModule, NovoVerticalStepper, NovoYearSelectElement, OptionsService, OutsideClick, PaddingDirective, PagedArrayCollection, Pagination, PercentageCell, PickerControl, PickerResults, PlacesListComponent, PluralPipe, PopOverContent, PopOverDirective, ProgressAppearance, QuickNoteControl, QuickNoteElement, QuickNoteResults, REMOVABLE_REF, RadioControl, RangeSelectionStrategy, ReadOnlyControl, RemoteActivityTableService, RemoteDataTableService, RenderPipe, RowDetails, Security, SelectControl, ShowOnDirtyErrorStateMatcher, SkillsSpecialtyPickerResults, SortDirection, StaticActivityTableService, StaticDataTableService, SwitchCasesDirective, SwitchControl, TIMEFORMAT_VALUE_ACCESSOR, TIME_FORMATS, TIME_VALUE_FORMATS, TableCell, TableFilter, TablePickerControl, TextAreaControl, TextBoxControl, TextColorDirective, ThOrderable, ThSortable, ThemeColorDirective, TilesControl, TimeControl, TimezoneControl, TooltipDirective, Unless, UnlessModule, VisibleDirective, WeekSelectionStrategy, WeekdayPipe, WorkersCompCodesPickerResults, YearPipe, _NovoCdkRowDef, _NovoCell, _NovoCellDef, _NovoColumnDef, _NovoHeaderCell, _NovoHeaderCellDef, _NovoHeaderRow, _NovoHeaderRowDef, _NovoRow, _countGroupLabelsBeforeOption, _getOptionScrollPosition, binarySearch, can, findByCountryCode, findByCountryId, findByCountryName, getCountries, getDayView, getDayViewHourGrid, getMonthView, getSpacingToken, getStateObjects, getStates, getWeekView, getWeekViewEventOffset, getWeekViewHeader, interpolateCell, isAlphaNumeric, mixinColor, mixinDisabled, mixinErrorState, mixinOverlay, mixinRequired, mixinSize, mixinTabIndex, notify, novoExpansionAnimations, novoStepperAnimations, slideInOut, throwNovoDuplicatedSidenavError, zoomInOut };
 //# sourceMappingURL=novo-elements.mjs.map