novo-elements 10.13.0 → 10.14.0

package/elements/common/typography/label/label.component.d.ts

@@ -1,16 +1,10 @@
+import { OnInit } from '@angular/core';
 import { NovoBaseTextElement } from '../base/base-text.component';
 import * as i0 from "@angular/core";
-/**
- * Tag Example
- * <novo-label size="sm" disabled>Label</novo-label
- * <novo-label small disabled>Label</novo-label>
- * <novo-label large disabled>Label</novo-label>
- * <novo-label error>Label</novo-label>
- * <novo-label muted>Label</novo-label>
- * <novo-label class="tc-grapefruit">Label</novo-label>
- * <novo-label color="grapefruit">Label</novo-label>
- */
-export declare class NovoLabel extends NovoBaseTextElement {
+export declare class NovoLabel extends NovoBaseTextElement implements OnInit {
+    id: string;
+    inputId: import("@angular/core").InputSignal<any>;
+    ngOnInit(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<NovoLabel, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<NovoLabel, "novo-label,[novo-label]", never, {}, {}, never, ["*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NovoLabel, "novo-label,[novo-label]", never, { "inputId": { "alias": "id"; "required": false; "isSignal": true; }; }, {}, never, ["*"], false, never>;
 }

package/elements/select/Select.d.ts

@@ -6,7 +6,7 @@ import { Observable, Subject } from 'rxjs';
 import { NovoLabelService } from 'novo-elements/services';
 import { CanDisableCtor, CanRequireCtor, CanUpdateErrorStateCtor, ErrorStateMatcher, HasOverlayCtor, HasTabIndexCtor, NovoOptgroup, NovoOption } from 'novo-elements/elements/common';
 import { NovoOverlayTemplateComponent } from 'novo-elements/elements/common';
-import { NovoFieldControl } from 'novo-elements/elements/field';
+import { NovoFieldControl, NovoFieldElement } from 'novo-elements/elements/field';
 import * as i0 from "@angular/core";
 /** Change event object that is emitted when the select value has changed. */
 export declare class NovoSelectChange {
@@ -34,6 +34,7 @@ export declare class NovoSelectElement extends NovoSelectMixins implements OnIni
     ref: ChangeDetectorRef;
     private focusMonitor;
     private ngZone;
+    private _fieldElement;
     private _uniqueId;
     private _stateChanges;
     private _activeOptionChanges;
@@ -45,10 +46,10 @@ export declare class NovoSelectElement extends NovoSelectMixins implements OnIni
     /** @docs-private Implemented as part of NovoFieldControl.*/
     lastCaretPosition: number | null;
     _selectionModel: SelectionModel<NovoOption>;
+    /** The aria-labelledby attribute */
+    _ariaLabelledBy: string;
     /** The aria-describedby attribute on the chip list for improved a11y. */
     _ariaDescribedby: string;
-    /** Tab index for the chip list. */
-    _tabIndex: number;
     /** User defined tab index. */
     _userTabIndex: number | null;
     /** The FocusKeyManager which handles focus. */
@@ -89,7 +90,6 @@ export declare class NovoSelectElement extends NovoSelectMixins implements OnIni
     disabled: boolean;
     /** Element for the panel containing the autocomplete options. */
     overlay: NovoOverlayTemplateComponent;
-    dropdown: ElementRef;
     optionGroups: QueryList<NovoOptgroup>;
     contentOptions: QueryList<NovoOption>;
     viewOptions: QueryList<NovoOption>;
@@ -114,11 +114,12 @@ export declare class NovoSelectElement extends NovoSelectMixins implements OnIni
     get selected(): NovoOption | NovoOption[];
     /** The value displayed in the trigger. */
     get displayValue(): string;
-    constructor(elementRef: ElementRef, labels: NovoLabelService, ref: ChangeDetectorRef, focusMonitor: FocusMonitor, ngZone: NgZone, defaultErrorStateMatcher: ErrorStateMatcher, ngControl: NgControl, _parentForm: NgForm, _parentFormGroup: FormGroupDirective);
+    constructor(elementRef: ElementRef, labels: NovoLabelService, ref: ChangeDetectorRef, focusMonitor: FocusMonitor, ngZone: NgZone, defaultErrorStateMatcher: ErrorStateMatcher, ngControl: NgControl, _parentForm: NgForm, _parentFormGroup: FormGroupDirective, _fieldElement: NovoFieldElement);
     ngOnInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
     ngAfterViewInit(): void;
     ngOnDestroy(): void;
+    onClick(): boolean;
     openPanel(): void;
     private _initializeSelection;
     /**
@@ -194,7 +195,7 @@ export declare class NovoSelectElement extends NovoSelectMixins implements OnIni
     saveHeader(): void;
     /** Determines the `aria-activedescendant` to be set on the host. */
     _getAriaActiveDescendant(): string | null;
-    static ɵfac: i0.ɵɵFactoryDeclaration<NovoSelectElement, [null, null, null, null, null, null, { optional: true; self: true; }, { optional: true; }, { optional: true; }]>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<NovoSelectElement, [null, null, null, null, null, null, { optional: true; self: true; }, { optional: true; }, { optional: true; }, { optional: true; }]>;
     static ɵcmp: i0.ɵɵComponentDeclaration<NovoSelectElement, "novo-select", never, { "disabled": { "alias": "disabled"; "required": false; }; "required": { "alias": "required"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; "id": { "alias": "id"; "required": false; }; "name": { "alias": "name"; "required": false; }; "options": { "alias": "options"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "headerConfig": { "alias": "headerConfig"; "required": false; }; "position": { "alias": "position"; "required": false; }; "overlayWidth": { "alias": "overlayWidth"; "required": false; }; "overlayHeight": { "alias": "overlayHeight"; "required": false; }; "displayIcon": { "alias": "displayIcon"; "required": false; }; "displayWith": { "alias": "displayWith"; "required": false; }; "compareWith": { "alias": "compareWith"; "required": false; }; "value": { "alias": "value"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; }, { "onSelect": "onSelect"; "selectionChange": "selectionChange"; "valueChange": "valueChange"; "openedChange": "openedChange"; "_openedStream": "opened"; "_closedStream": "closed"; }, ["optionGroups", "contentOptions"], ["*"], false, never>;
 }
 export {};

package/elements/select/Select.scss

@@ -9,6 +9,17 @@
   min-width: 180px;
   cursor: pointer;
 
+  &:focus .novo-select-trigger {
+    border-bottom: 1px solid $positive;
+    i {
+      color: rgba(0, 0, 0, 0.73);
+    }
+  }
+
+  &:focus {
+    outline: none;
+  }
+
   .novo-select-trigger {
     @include novo-body-text();
     display: flex;
@@ -32,19 +43,9 @@
     &.empty {
       color: #a9a9a9;
     }
-    &:focus,
-    &:hover {
-      outline: none;
-    }
     &:hover {
       border-bottom: 1px solid lighten($dark, 15%);
     }
-    &:focus {
-      border-bottom: 1px solid $positive;
-      i {
-        color: rgba(0, 0, 0, 0.73);
-      }
-    }
 
     .novo-select-placeholder {
       color: var(--form-placeholder);

package/esm2022/elements/chips/Chips.mjs

@@ -328,7 +328,7 @@ export class NovoChipsElement {
     <label class="clear-all" *ngIf="items.length && !disablePickerInput" (click)="clearValue()"
       >{{ labels.clearAll }} <i class="bhi-times"></i
     ></label>
-  `, isInline: true, styles: [":host{width:100%;display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-start;border-bottom:1px solid #afb9c0;transition:all .2s ease-in-out;position:relative;padding:2px 0}:host .hidden-chips-toggle{cursor:pointer;padding-left:.5rem;line-height:2.7rem}:host.with-value{margin-bottom:20px}:host:hover{border-bottom:1px solid #5f6d78}:host.selected,:host.selected:hover{border-bottom:1px solid #4a89dc}:host.selected+i,:host.selected:hover+i{color:#4a89dc}:host.disabled{border-bottom-style:dashed!important}:host .novo-chip-container{flex:1;display:flex;flex-flow:row wrap;gap:.4rem;align-items:center}:host .chip-input-container{flex:1 15rem;padding-left:1rem}:host .chip-input-container input{padding-top:0;border:none;background:transparent!important;width:100%}:host .chip-input-container input:focus{outline:none}:host .chip-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host label.clear-all{flex:1 100%;position:absolute;right:0;bottom:-20px;font-size:.9rem;color:#da4453;cursor:pointer;display:flex;align-items:center}:host label.clear-all i{font-size:.7rem;padding-bottom:2px;margin-left:5px}:host i.bhi-search{position:absolute;bottom:8px;right:0;font-size:1.1em;color:#3d464d}:host+i{position:absolute;right:0;bottom:7px}:host.with-value{margin-bottom:0}:host novo-picker{position:inherit;padding-bottom:0}:host novo-picker>::ng-deep input{border:none;border-bottom:none!important}:host novo-picker>::ng-deep input:disabled{border-bottom:none!important}:host novo-picker>::ng-deep i{display:none}:host novo-picker div.picker-results-container{left:0}:host picker-results{position:absolute;color:#000}:host picker-results novo-list{max-height:49vh;overflow:auto}:host picker-results novo-list novo-list-item{flex:0 0;transition:background-color .25s}:host picker-results novo-list novo-list-item>div{width:100%}:host picker-results novo-list novo-list-item.active{background-color:#e0ebf9}:host picker-results novo-list novo-list-item:hover{background-color:#e0ebf9}:host picker-results novo-list novo-list-item item-content{flex-flow:row wrap}:host picker-results novo-list novo-list-item item-content>*{flex:0 0 33%;white-space:nowrap}:host picker-results .error-results,:host picker-results .no-recents,:host picker-results .null-results{text-align:center;padding:1em 0 4em}:host picker-results .error-results>i,:host picker-results .no-recents>i,:host picker-results .null-results>i{font-size:3em;margin:.5em;color:#0000004d}:host picker-results .error-results>h4,:host picker-results .error-results>p,:host picker-results .no-recents>h4,:host picker-results .no-recents>p,:host picker-results .null-results>h4,:host picker-results .null-results>p{margin:0;max-width:none;padding:0}:host picker-results .error-results>h4,:host picker-results .no-recents>h4,:host picker-results .null-results>h4{font-weight:500}:host picker-results section{box-shadow:.1em .1em 1em #00000040;z-index:9;position:absolute;width:100%;background-color:#fff;color:#000}:host .preview-container entity-picker-result{background:#fff;position:absolute;top:100%;left:0;width:100%;min-width:180px;max-height:49vh;overflow:auto;z-index:9001;border:1px solid #4a89dc;transition:all .2s ease-in-out}:host .preview-container entity-picker-result .novo-list-item{flex:0 0}:host .preview-container entity-picker-result .novo-list-item>div{width:100%}:host .preview-container entity-picker-result .novo-list-item .novo-item-content{flex-flow:row wrap}:host .preview-container entity-picker-result .novo-list-item .novo-item-content>*{flex:0 0 33%;white-space:nowrap}:host .preview-container entity-picker-result .novo-list-item .novo-item-content>p{min-width:15em;font-size:.9em;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;padding-right:1em}entity-chip-results{max-width:none!important}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.NovoPickerElement, selector: "novo-picker", inputs: ["config", "placeholder", "clearValueOnSelect", "closeOnSelect", "selected", "appendToBody", "parentScrollSelector", "parentScrollAction", "containerClass", "side", "autoSelectFirstOption", "overrideElement", "maxlength", "allowCustomValues", "width", "minWidth", "allowTabNavigation", "disablePickerInput"], outputs: ["changed", "select", "focus", "blur", "typing", "tab"] }, { kind: "component", type: i5.NovoIconComponent, selector: "novo-icon", inputs: ["raised", "theme", "shape", "color", "size", "smaller", "larger", "alt", "name"] }, { kind: "component", type: i6.NovoLabel, selector: "novo-label,[novo-label]" }, { kind: "component", type: i7.NovoChipElement, selector: "novo-chip, [novo-chip]", inputs: ["color", "tabIndex", "size", "type", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"] }, { kind: "directive", type: i7.NovoChipAvatar, selector: "novo-chip-avatar, [novoChipAvatar]" }, { kind: "directive", type: i7.NovoChipRemove, selector: "[novoChipRemove]" }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.SlicePipe, name: "slice" }, { kind: "pipe", type: i8.AvatarTypePipe, name: "avatarType" }] }); }
+  `, isInline: true, styles: [":host{width:100%;display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-start;border-bottom:1px solid #afb9c0;transition:all .2s ease-in-out;position:relative;padding:2px 0}:host .hidden-chips-toggle{cursor:pointer;padding-left:.5rem;line-height:2.7rem}:host.with-value{margin-bottom:20px}:host:hover{border-bottom:1px solid #5f6d78}:host.selected,:host.selected:hover{border-bottom:1px solid #4a89dc}:host.selected+i,:host.selected:hover+i{color:#4a89dc}:host.disabled{border-bottom-style:dashed!important}:host .novo-chip-container{flex:1;display:flex;flex-flow:row wrap;gap:.4rem;align-items:center}:host .chip-input-container{flex:1 15rem;padding-left:1rem}:host .chip-input-container input{padding-top:0;border:none;background:transparent!important;width:100%}:host .chip-input-container input:focus{outline:none}:host .chip-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host label.clear-all{flex:1 100%;position:absolute;right:0;bottom:-20px;font-size:.9rem;color:#da4453;cursor:pointer;display:flex;align-items:center}:host label.clear-all i{font-size:.7rem;padding-bottom:2px;margin-left:5px}:host i.bhi-search{position:absolute;bottom:8px;right:0;font-size:1.1em;color:#3d464d}:host+i{position:absolute;right:0;bottom:7px}:host.with-value{margin-bottom:0}:host novo-picker{position:inherit;padding-bottom:0}:host novo-picker>::ng-deep input{border:none;border-bottom:none!important}:host novo-picker>::ng-deep input:disabled{border-bottom:none!important}:host novo-picker>::ng-deep i{display:none}:host novo-picker div.picker-results-container{left:0}:host picker-results{position:absolute;color:#000}:host picker-results novo-list{max-height:49vh;overflow:auto}:host picker-results novo-list novo-list-item{flex:0 0;transition:background-color .25s}:host picker-results novo-list novo-list-item>div{width:100%}:host picker-results novo-list novo-list-item.active{background-color:#e0ebf9}:host picker-results novo-list novo-list-item:hover{background-color:#e0ebf9}:host picker-results novo-list novo-list-item item-content{flex-flow:row wrap}:host picker-results novo-list novo-list-item item-content>*{flex:0 0 33%;white-space:nowrap}:host picker-results .error-results,:host picker-results .no-recents,:host picker-results .null-results{text-align:center;padding:1em 0 4em}:host picker-results .error-results>i,:host picker-results .no-recents>i,:host picker-results .null-results>i{font-size:3em;margin:.5em;color:#0000004d}:host picker-results .error-results>h4,:host picker-results .error-results>p,:host picker-results .no-recents>h4,:host picker-results .no-recents>p,:host picker-results .null-results>h4,:host picker-results .null-results>p{margin:0;max-width:none;padding:0}:host picker-results .error-results>h4,:host picker-results .no-recents>h4,:host picker-results .null-results>h4{font-weight:500}:host picker-results section{box-shadow:.1em .1em 1em #00000040;z-index:9;position:absolute;width:100%;background-color:#fff;color:#000}:host .preview-container entity-picker-result{background:#fff;position:absolute;top:100%;left:0;width:100%;min-width:180px;max-height:49vh;overflow:auto;z-index:9001;border:1px solid #4a89dc;transition:all .2s ease-in-out}:host .preview-container entity-picker-result .novo-list-item{flex:0 0}:host .preview-container entity-picker-result .novo-list-item>div{width:100%}:host .preview-container entity-picker-result .novo-list-item .novo-item-content{flex-flow:row wrap}:host .preview-container entity-picker-result .novo-list-item .novo-item-content>*{flex:0 0 33%;white-space:nowrap}:host .preview-container entity-picker-result .novo-list-item .novo-item-content>p{min-width:15em;font-size:.9em;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;padding-right:1em}entity-chip-results{max-width:none!important}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.NovoPickerElement, selector: "novo-picker", inputs: ["config", "placeholder", "clearValueOnSelect", "closeOnSelect", "selected", "appendToBody", "parentScrollSelector", "parentScrollAction", "containerClass", "side", "autoSelectFirstOption", "overrideElement", "maxlength", "allowCustomValues", "width", "minWidth", "allowTabNavigation", "disablePickerInput"], outputs: ["changed", "select", "focus", "blur", "typing", "tab"] }, { kind: "component", type: i5.NovoIconComponent, selector: "novo-icon", inputs: ["raised", "theme", "shape", "color", "size", "smaller", "larger", "alt", "name"] }, { kind: "component", type: i6.NovoLabel, selector: "novo-label,[novo-label]", inputs: ["id"] }, { kind: "component", type: i7.NovoChipElement, selector: "novo-chip, [novo-chip]", inputs: ["color", "tabIndex", "size", "type", "selected", "value", "selectable", "disabled", "removable"], outputs: ["selectionChange", "destroyed", "removed"] }, { kind: "directive", type: i7.NovoChipAvatar, selector: "novo-chip-avatar, [novoChipAvatar]" }, { kind: "directive", type: i7.NovoChipRemove, selector: "[novoChipRemove]" }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.SlicePipe, name: "slice" }, { kind: "pipe", type: i8.AvatarTypePipe, name: "avatarType" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: NovoChipsElement, decorators: [{
             type: Component,

package/esm2022/elements/common/typography/label/label.component.mjs

@@ -1,5 +1,5 @@
 // NG2
-import { Component } from '@angular/core';
+import { Component, HostBinding, input } from '@angular/core';
 import { NovoBaseTextElement } from '../base/base-text.component';
 import * as i0 from "@angular/core";
 /**
@@ -12,14 +12,25 @@ import * as i0 from "@angular/core";
  * <novo-label class="tc-grapefruit">Label</novo-label>
  * <novo-label color="grapefruit">Label</novo-label>
  */
+let nextId = 0;
 export class NovoLabel extends NovoBaseTextElement {
+    constructor() {
+        super(...arguments);
+        this.inputId = input(null, { alias: 'id' });
+    }
+    ngOnInit() {
+        this.id = this.inputId() || `novo-label-${++nextId}`;
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: NovoLabel, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: NovoLabel, selector: "novo-label,[novo-label]", host: { classAttribute: "novo-label" }, usesInheritance: true, ngImport: i0, template: ` <ng-content></ng-content> `, isInline: true, styles: [":host{display:inline-block;font-weight:500;word-break:word-break;overflow-wrap:break-word;line-height:1.375;color:var(--text-muted);font-size:var(--font-size-label);transition:color .2s ease-out,opacity .2s ease-out;vertical-align:middle}:host.text-capitalize{text-transform:capitalize}:host.text-uppercase{text-transform:uppercase}:host.text-nowrap{white-space:nowrap}:host.text-ellipsis{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host.text-size-default{font-size:inherit}:host.text-size-body{font-size:1.3rem}:host.text-size-xs{font-size:1rem}:host.text-size-sm{font-size:1.2rem}:host.text-size-md{font-size:1.3rem}:host.text-size-lg{font-size:1.6rem}:host.text-size-xl{font-size:2rem}:host.text-size-2xl{font-size:2.6rem}:host.text-size-3xl{font-size:3.2rem}:host.text-size-smaller{font-size:.8em}:host.text-size-larger{font-size:1.2em}:host.text-color-black{color:#000}:host.text-color-white{color:#fff}:host.text-color-gray{color:#9e9e9e}:host.text-color-grey{color:#9e9e9e}:host.text-color-offWhite{color:#f7f7f7}:host.text-color-bright{color:#f7f7f7}:host.text-color-light{color:#dbdbdb}:host.text-color-neutral{color:#4f5361}:host.text-color-dark{color:#3d464d}:host.text-color-orange{color:#ff6900}:host.text-color-navigation{color:#202945}:host.text-color-skyBlue{color:#009bdf}:host.text-color-steel{color:#5b6770}:host.text-color-metal{color:#637893}:host.text-color-sand{color:#f4f4f4}:host.text-color-silver{color:#e2e2e2}:host.text-color-stone{color:#bebebe}:host.text-color-ash{color:#a0a0a0}:host.text-color-slate{color:#707070}:host.text-color-onyx{color:#526980}:host.text-color-charcoal{color:#282828}:host.text-color-moonlight{color:#1a242f}:host.text-color-midnight{color:#202945}:host.text-color-darkness{color:#161f27}:host.text-color-navy{color:#0d2d42}:host.text-color-aqua{color:#3bafda}:host.text-color-ocean{color:#4a89dc}:host.text-color-mint{color:#37bc9b}:host.text-color-grass{color:#8cc152}:host.text-color-sunflower{color:#f6b042}:host.text-color-bittersweet{color:#eb6845}:host.text-color-grapefruit{color:#da4453}:host.text-color-carnation{color:#d770ad}:host.text-color-lavender{color:#967adc}:host.text-color-mountain{color:#9678b6}:host.text-color-info{color:#4a89dc}:host.text-color-positive{color:#4a89dc}:host.text-color-success{color:#8cc152}:host.text-color-negative{color:#da4453}:host.text-color-danger{color:#da4453}:host.text-color-error{color:#da4453}:host.text-color-warning{color:#f6b042}:host.text-color-empty{color:#cccdcc}:host.text-color-disabled{color:#bebebe}:host.text-color-background{color:#f7f7f7}:host.text-color-backgroundDark{color:#e2e2e2}:host.text-color-presentation{color:#5b6770}:host.text-color-bullhorn{color:#ff6900}:host.text-color-pulse{color:#3bafda}:host.text-color-company{color:#39d}:host.text-color-candidate{color:#4b7}:host.text-color-lead{color:#a69}:host.text-color-contact{color:#fa4}:host.text-color-clientcontact{color:#fa4}:host.text-color-opportunity{color:#625}:host.text-color-job{color:#b56}:host.text-color-joborder{color:#b56}:host.text-color-submission{color:#a9adbb}:host.text-color-sendout{color:#747884}:host.text-color-placement{color:#0b344f}:host.text-color-note{color:#747884}:host.text-color-contract{color:#454ea0}:host.text-color-jobCode{color:#696d79}:host.text-color-earnCode{color:#696d79}:host.text-color-invoiceStatement{color:#696d79}:host.text-color-billableCharge{color:#696d79}:host.text-color-payableCharge{color:#696d79}:host.text-color-user{color:#696d79}:host.text-color-corporateUser{color:#696d79}:host.text-color-distributionList{color:#696d79}:host.text-color-credential{color:#696d79}:host.text-color-person{color:#696d79}:host.margin-before{margin-top:.4rem}:host.margin-after{margin-bottom:.8rem}:host.text-length-small{max-width:40ch}:host.text-length-medium{max-width:55ch}:host.text-length-large{max-width:70ch}:host.text-weight-hairline{font-weight:100}:host.text-weight-thin{font-weight:200}:host.text-weight-light{font-weight:300}:host.text-weight-normal{font-weight:400}:host.text-weight-medium{font-weight:500}:host.text-weight-semibold{font-weight:600}:host.text-weight-bold{font-weight:700}:host.text-weight-extrabold{font-weight:800}:host.text-weight-heavy{font-weight:900}:host.text-weight-lighter{font-weight:lighter}:host.text-weight-bolder{font-weight:bolder}\n"] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "17.3.12", type: NovoLabel, selector: "novo-label,[novo-label]", inputs: { inputId: { classPropertyName: "inputId", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.id": "this.id" }, classAttribute: "novo-label" }, usesInheritance: true, ngImport: i0, template: ` <ng-content></ng-content> `, isInline: true, styles: [":host{display:inline-block;font-weight:500;word-break:word-break;overflow-wrap:break-word;line-height:1.375;color:var(--text-muted);font-size:var(--font-size-label);transition:color .2s ease-out,opacity .2s ease-out;vertical-align:middle}:host.text-capitalize{text-transform:capitalize}:host.text-uppercase{text-transform:uppercase}:host.text-nowrap{white-space:nowrap}:host.text-ellipsis{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host.text-size-default{font-size:inherit}:host.text-size-body{font-size:1.3rem}:host.text-size-xs{font-size:1rem}:host.text-size-sm{font-size:1.2rem}:host.text-size-md{font-size:1.3rem}:host.text-size-lg{font-size:1.6rem}:host.text-size-xl{font-size:2rem}:host.text-size-2xl{font-size:2.6rem}:host.text-size-3xl{font-size:3.2rem}:host.text-size-smaller{font-size:.8em}:host.text-size-larger{font-size:1.2em}:host.text-color-black{color:#000}:host.text-color-white{color:#fff}:host.text-color-gray{color:#9e9e9e}:host.text-color-grey{color:#9e9e9e}:host.text-color-offWhite{color:#f7f7f7}:host.text-color-bright{color:#f7f7f7}:host.text-color-light{color:#dbdbdb}:host.text-color-neutral{color:#4f5361}:host.text-color-dark{color:#3d464d}:host.text-color-orange{color:#ff6900}:host.text-color-navigation{color:#202945}:host.text-color-skyBlue{color:#009bdf}:host.text-color-steel{color:#5b6770}:host.text-color-metal{color:#637893}:host.text-color-sand{color:#f4f4f4}:host.text-color-silver{color:#e2e2e2}:host.text-color-stone{color:#bebebe}:host.text-color-ash{color:#a0a0a0}:host.text-color-slate{color:#707070}:host.text-color-onyx{color:#526980}:host.text-color-charcoal{color:#282828}:host.text-color-moonlight{color:#1a242f}:host.text-color-midnight{color:#202945}:host.text-color-darkness{color:#161f27}:host.text-color-navy{color:#0d2d42}:host.text-color-aqua{color:#3bafda}:host.text-color-ocean{color:#4a89dc}:host.text-color-mint{color:#37bc9b}:host.text-color-grass{color:#8cc152}:host.text-color-sunflower{color:#f6b042}:host.text-color-bittersweet{color:#eb6845}:host.text-color-grapefruit{color:#da4453}:host.text-color-carnation{color:#d770ad}:host.text-color-lavender{color:#967adc}:host.text-color-mountain{color:#9678b6}:host.text-color-info{color:#4a89dc}:host.text-color-positive{color:#4a89dc}:host.text-color-success{color:#8cc152}:host.text-color-negative{color:#da4453}:host.text-color-danger{color:#da4453}:host.text-color-error{color:#da4453}:host.text-color-warning{color:#f6b042}:host.text-color-empty{color:#cccdcc}:host.text-color-disabled{color:#bebebe}:host.text-color-background{color:#f7f7f7}:host.text-color-backgroundDark{color:#e2e2e2}:host.text-color-presentation{color:#5b6770}:host.text-color-bullhorn{color:#ff6900}:host.text-color-pulse{color:#3bafda}:host.text-color-company{color:#39d}:host.text-color-candidate{color:#4b7}:host.text-color-lead{color:#a69}:host.text-color-contact{color:#fa4}:host.text-color-clientcontact{color:#fa4}:host.text-color-opportunity{color:#625}:host.text-color-job{color:#b56}:host.text-color-joborder{color:#b56}:host.text-color-submission{color:#a9adbb}:host.text-color-sendout{color:#747884}:host.text-color-placement{color:#0b344f}:host.text-color-note{color:#747884}:host.text-color-contract{color:#454ea0}:host.text-color-jobCode{color:#696d79}:host.text-color-earnCode{color:#696d79}:host.text-color-invoiceStatement{color:#696d79}:host.text-color-billableCharge{color:#696d79}:host.text-color-payableCharge{color:#696d79}:host.text-color-user{color:#696d79}:host.text-color-corporateUser{color:#696d79}:host.text-color-distributionList{color:#696d79}:host.text-color-credential{color:#696d79}:host.text-color-person{color:#696d79}:host.margin-before{margin-top:.4rem}:host.margin-after{margin-bottom:.8rem}:host.text-length-small{max-width:40ch}:host.text-length-medium{max-width:55ch}:host.text-length-large{max-width:70ch}:host.text-weight-hairline{font-weight:100}:host.text-weight-thin{font-weight:200}:host.text-weight-light{font-weight:300}:host.text-weight-normal{font-weight:400}:host.text-weight-medium{font-weight:500}:host.text-weight-semibold{font-weight:600}:host.text-weight-bold{font-weight:700}:host.text-weight-extrabold{font-weight:800}:host.text-weight-heavy{font-weight:900}:host.text-weight-lighter{font-weight:lighter}:host.text-weight-bolder{font-weight:bolder}\n"] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: NovoLabel, decorators: [{
             type: Component,
             args: [{ selector: 'novo-label,[novo-label]', template: ` <ng-content></ng-content> `, host: {
                         class: 'novo-label',
                     }, styles: [":host{display:inline-block;font-weight:500;word-break:word-break;overflow-wrap:break-word;line-height:1.375;color:var(--text-muted);font-size:var(--font-size-label);transition:color .2s ease-out,opacity .2s ease-out;vertical-align:middle}:host.text-capitalize{text-transform:capitalize}:host.text-uppercase{text-transform:uppercase}:host.text-nowrap{white-space:nowrap}:host.text-ellipsis{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host.text-size-default{font-size:inherit}:host.text-size-body{font-size:1.3rem}:host.text-size-xs{font-size:1rem}:host.text-size-sm{font-size:1.2rem}:host.text-size-md{font-size:1.3rem}:host.text-size-lg{font-size:1.6rem}:host.text-size-xl{font-size:2rem}:host.text-size-2xl{font-size:2.6rem}:host.text-size-3xl{font-size:3.2rem}:host.text-size-smaller{font-size:.8em}:host.text-size-larger{font-size:1.2em}:host.text-color-black{color:#000}:host.text-color-white{color:#fff}:host.text-color-gray{color:#9e9e9e}:host.text-color-grey{color:#9e9e9e}:host.text-color-offWhite{color:#f7f7f7}:host.text-color-bright{color:#f7f7f7}:host.text-color-light{color:#dbdbdb}:host.text-color-neutral{color:#4f5361}:host.text-color-dark{color:#3d464d}:host.text-color-orange{color:#ff6900}:host.text-color-navigation{color:#202945}:host.text-color-skyBlue{color:#009bdf}:host.text-color-steel{color:#5b6770}:host.text-color-metal{color:#637893}:host.text-color-sand{color:#f4f4f4}:host.text-color-silver{color:#e2e2e2}:host.text-color-stone{color:#bebebe}:host.text-color-ash{color:#a0a0a0}:host.text-color-slate{color:#707070}:host.text-color-onyx{color:#526980}:host.text-color-charcoal{color:#282828}:host.text-color-moonlight{color:#1a242f}:host.text-color-midnight{color:#202945}:host.text-color-darkness{color:#161f27}:host.text-color-navy{color:#0d2d42}:host.text-color-aqua{color:#3bafda}:host.text-color-ocean{color:#4a89dc}:host.text-color-mint{color:#37bc9b}:host.text-color-grass{color:#8cc152}:host.text-color-sunflower{color:#f6b042}:host.text-color-bittersweet{color:#eb6845}:host.text-color-grapefruit{color:#da4453}:host.text-color-carnation{color:#d770ad}:host.text-color-lavender{color:#967adc}:host.text-color-mountain{color:#9678b6}:host.text-color-info{color:#4a89dc}:host.text-color-positive{color:#4a89dc}:host.text-color-success{color:#8cc152}:host.text-color-negative{color:#da4453}:host.text-color-danger{color:#da4453}:host.text-color-error{color:#da4453}:host.text-color-warning{color:#f6b042}:host.text-color-empty{color:#cccdcc}:host.text-color-disabled{color:#bebebe}:host.text-color-background{color:#f7f7f7}:host.text-color-backgroundDark{color:#e2e2e2}:host.text-color-presentation{color:#5b6770}:host.text-color-bullhorn{color:#ff6900}:host.text-color-pulse{color:#3bafda}:host.text-color-company{color:#39d}:host.text-color-candidate{color:#4b7}:host.text-color-lead{color:#a69}:host.text-color-contact{color:#fa4}:host.text-color-clientcontact{color:#fa4}:host.text-color-opportunity{color:#625}:host.text-color-job{color:#b56}:host.text-color-joborder{color:#b56}:host.text-color-submission{color:#a9adbb}:host.text-color-sendout{color:#747884}:host.text-color-placement{color:#0b344f}:host.text-color-note{color:#747884}:host.text-color-contract{color:#454ea0}:host.text-color-jobCode{color:#696d79}:host.text-color-earnCode{color:#696d79}:host.text-color-invoiceStatement{color:#696d79}:host.text-color-billableCharge{color:#696d79}:host.text-color-payableCharge{color:#696d79}:host.text-color-user{color:#696d79}:host.text-color-corporateUser{color:#696d79}:host.text-color-distributionList{color:#696d79}:host.text-color-credential{color:#696d79}:host.text-color-person{color:#696d79}:host.margin-before{margin-top:.4rem}:host.margin-after{margin-bottom:.8rem}:host.text-length-small{max-width:40ch}:host.text-length-medium{max-width:55ch}:host.text-length-large{max-width:70ch}:host.text-weight-hairline{font-weight:100}:host.text-weight-thin{font-weight:200}:host.text-weight-light{font-weight:300}:host.text-weight-normal{font-weight:400}:host.text-weight-medium{font-weight:500}:host.text-weight-semibold{font-weight:600}:host.text-weight-bold{font-weight:700}:host.text-weight-extrabold{font-weight:800}:host.text-weight-heavy{font-weight:900}:host.text-weight-lighter{font-weight:lighter}:host.text-weight-bolder{font-weight:bolder}\n"] }]
-        }] });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGFiZWwuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbm92by1lbGVtZW50cy9zcmMvZWxlbWVudHMvY29tbW9uL3R5cG9ncmFwaHkvbGFiZWwvbGFiZWwuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE1BQU07QUFDTixPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQzFDLE9BQU8sRUFBRSxtQkFBbUIsRUFBRSxNQUFNLDZCQUE2QixDQUFDOztBQUVsRTs7Ozs7Ozs7O0dBU0c7QUFVSCxNQUFNLE9BQU8sU0FBVSxTQUFRLG1CQUFtQjsrR0FBckMsU0FBUzttR0FBVCxTQUFTLDhIQU5WLDZCQUE2Qjs7NEZBTTVCLFNBQVM7a0JBUnJCLFNBQVM7K0JBQ0UseUJBQXlCLFlBQ3pCLDZCQUE2QixRQUVqQzt3QkFDSixLQUFLLEVBQUUsWUFBWTtxQkFDcEIiLCJzb3VyY2VzQ29udGVudCI6WyIvLyBORzJcbmltcG9ydCB7IENvbXBvbmVudCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgTm92b0Jhc2VUZXh0RWxlbWVudCB9IGZyb20gJy4uL2Jhc2UvYmFzZS10ZXh0LmNvbXBvbmVudCc7XG5cbi8qKlxuICogVGFnIEV4YW1wbGVcbiAqIDxub3ZvLWxhYmVsIHNpemU9XCJzbVwiIGRpc2FibGVkPkxhYmVsPC9ub3ZvLWxhYmVsXG4gKiA8bm92by1sYWJlbCBzbWFsbCBkaXNhYmxlZD5MYWJlbDwvbm92by1sYWJlbD5cbiAqIDxub3ZvLWxhYmVsIGxhcmdlIGRpc2FibGVkPkxhYmVsPC9ub3ZvLWxhYmVsPlxuICogPG5vdm8tbGFiZWwgZXJyb3I+TGFiZWw8L25vdm8tbGFiZWw+XG4gKiA8bm92by1sYWJlbCBtdXRlZD5MYWJlbDwvbm92by1sYWJlbD5cbiAqIDxub3ZvLWxhYmVsIGNsYXNzPVwidGMtZ3JhcGVmcnVpdFwiPkxhYmVsPC9ub3ZvLWxhYmVsPlxuICogPG5vdm8tbGFiZWwgY29sb3I9XCJncmFwZWZydWl0XCI+TGFiZWw8L25vdm8tbGFiZWw+XG4gKi9cblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnbm92by1sYWJlbCxbbm92by1sYWJlbF0nLFxuICB0ZW1wbGF0ZTogYCA8bmctY29udGVudD48L25nLWNvbnRlbnQ+IGAsXG4gIHN0eWxlVXJsczogWycuL2xhYmVsLnNjc3MnXSxcbiAgaG9zdDoge1xuICAgIGNsYXNzOiAnbm92by1sYWJlbCcsXG4gIH0sXG59KVxuZXhwb3J0IGNsYXNzIE5vdm9MYWJlbCBleHRlbmRzIE5vdm9CYXNlVGV4dEVsZW1lbnQge31cbiJdfQ==
+        }], propDecorators: { id: [{
+                type: HostBinding,
+                args: ['attr.id']
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGFiZWwuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbm92by1lbGVtZW50cy9zcmMvZWxlbWVudHMvY29tbW9uL3R5cG9ncmFwaHkvbGFiZWwvbGFiZWwuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE1BQU07QUFDTixPQUFPLEVBQUUsU0FBUyxFQUFFLFdBQVcsRUFBRSxLQUFLLEVBQVUsTUFBTSxlQUFlLENBQUM7QUFDdEUsT0FBTyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sNkJBQTZCLENBQUM7O0FBRWxFOzs7Ozs7Ozs7R0FTRztBQUVILElBQUksTUFBTSxHQUFHLENBQUMsQ0FBQztBQVVmLE1BQU0sT0FBTyxTQUFVLFNBQVEsbUJBQW1CO0lBUmxEOztRQVlFLFlBQU8sR0FBRyxLQUFLLENBQUMsSUFBSSxFQUFFLEVBQUUsS0FBSyxFQUFFLElBQUksRUFBRSxDQUFDLENBQUM7S0FLeEM7SUFIQyxRQUFRO1FBQ04sSUFBSSxDQUFDLEVBQUUsR0FBRyxJQUFJLENBQUMsT0FBTyxFQUFFLElBQUksY0FBYyxFQUFFLE1BQU0sRUFBRSxDQUFDO0lBQ3ZELENBQUM7K0dBUlUsU0FBUzttR0FBVCxTQUFTLHlTQU5WLDZCQUE2Qjs7NEZBTTVCLFNBQVM7a0JBUnJCLFNBQVM7K0JBQ0UseUJBQXlCLFlBQ3pCLDZCQUE2QixRQUVqQzt3QkFDSixLQUFLLEVBQUUsWUFBWTtxQkFDcEI7OEJBSU0sRUFBRTtzQkFEUixXQUFXO3VCQUFDLFNBQVMiLCJzb3VyY2VzQ29udGVudCI6WyIvLyBORzJcbmltcG9ydCB7IENvbXBvbmVudCwgSG9zdEJpbmRpbmcsIGlucHV0LCBPbkluaXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IE5vdm9CYXNlVGV4dEVsZW1lbnQgfSBmcm9tICcuLi9iYXNlL2Jhc2UtdGV4dC5jb21wb25lbnQnO1xuXG4vKipcbiAqIFRhZyBFeGFtcGxlXG4gKiA8bm92by1sYWJlbCBzaXplPVwic21cIiBkaXNhYmxlZD5MYWJlbDwvbm92by1sYWJlbFxuICogPG5vdm8tbGFiZWwgc21hbGwgZGlzYWJsZWQ+TGFiZWw8L25vdm8tbGFiZWw+XG4gKiA8bm92by1sYWJlbCBsYXJnZSBkaXNhYmxlZD5MYWJlbDwvbm92by1sYWJlbD5cbiAqIDxub3ZvLWxhYmVsIGVycm9yPkxhYmVsPC9ub3ZvLWxhYmVsPlxuICogPG5vdm8tbGFiZWwgbXV0ZWQ+TGFiZWw8L25vdm8tbGFiZWw+XG4gKiA8bm92by1sYWJlbCBjbGFzcz1cInRjLWdyYXBlZnJ1aXRcIj5MYWJlbDwvbm92by1sYWJlbD5cbiAqIDxub3ZvLWxhYmVsIGNvbG9yPVwiZ3JhcGVmcnVpdFwiPkxhYmVsPC9ub3ZvLWxhYmVsPlxuICovXG5cbmxldCBuZXh0SWQgPSAwO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdub3ZvLWxhYmVsLFtub3ZvLWxhYmVsXScsXG4gIHRlbXBsYXRlOiBgIDxuZy1jb250ZW50PjwvbmctY29udGVudD4gYCxcbiAgc3R5bGVVcmxzOiBbJy4vbGFiZWwuc2NzcyddLFxuICBob3N0OiB7XG4gICAgY2xhc3M6ICdub3ZvLWxhYmVsJyxcbiAgfSxcbn0pXG5leHBvcnQgY2xhc3MgTm92b0xhYmVsIGV4dGVuZHMgTm92b0Jhc2VUZXh0RWxlbWVudCBpbXBsZW1lbnRzIE9uSW5pdHtcbiAgQEhvc3RCaW5kaW5nKCdhdHRyLmlkJylcbiAgcHVibGljIGlkOiBzdHJpbmc7XG5cbiAgaW5wdXRJZCA9IGlucHV0KG51bGwsIHsgYWxpYXM6ICdpZCcgfSk7XG5cbiAgbmdPbkluaXQoKSB7XG4gICAgdGhpcy5pZCA9IHRoaXMuaW5wdXRJZCgpIHx8IGBub3ZvLWxhYmVsLSR7KytuZXh0SWR9YDtcbiAgfVxufVxuXG4iXX0=

package/esm2022/elements/data-table/cell-headers/data-table-header-cell-filter-header.component.mjs

@@ -35,7 +35,7 @@ export class NovoDataTableCellFilterHeader {
         {{ labels.clear }}
       </novo-button>
     </div>
-  `, isInline: true, dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.NovoButtonElement, selector: "novo-button,button[theme]", inputs: ["color", "side", "size", "theme", "loading", "icon", "secondIcon", "disabled"] }, { kind: "component", type: i4.NovoLabel, selector: "novo-label,[novo-label]" }, { kind: "directive", type: i4.ThemeColorDirective, selector: "[theme]", inputs: ["theme"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+  `, isInline: true, dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.NovoButtonElement, selector: "novo-button,button[theme]", inputs: ["color", "side", "size", "theme", "loading", "icon", "secondIcon", "disabled"] }, { kind: "component", type: i4.NovoLabel, selector: "novo-label,[novo-label]", inputs: ["id"] }, { kind: "directive", type: i4.ThemeColorDirective, selector: "[theme]", inputs: ["theme"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: NovoDataTableCellFilterHeader, decorators: [{
             type: Component,

package/esm2022/elements/query-builder/condition-group/condition-group.component.mjs

@@ -106,7 +106,7 @@ export class ConditionGroupComponent {
         return this.root.length <= 1;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ConditionGroupComponent, deps: [{ token: i1.QueryBuilderService }, { token: i2.NovoLabelService }, { token: i3.ControlContainer }, { token: i3.FormBuilder }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: ConditionGroupComponent, selector: "novo-condition-group", inputs: { controlName: "controlName", groupIndex: "groupIndex", hideFirstOperator: "hideFirstOperator", canBeEmpty: "canBeEmpty", formGroupName: "formGroupName" }, host: { classAttribute: "novo-condition-group" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => ConditionGroupComponent), multi: true }], usesOnChanges: 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\" [ngClass]=\"{ isFirst: andIndex === 0 }\" [class]=\"scope\" align=\"end\" gap=\"sm\" #flex>\n          <novo-dropdown *ngIf=\"(!isFirst || !hideFirstOperator) && 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 || !hideFirstOperator\" color=\"ash\" size=\"xs\" uppercase padding=\"sm\">\n              {{qbs.getConjunctionLabel(controlName)}}</novo-label>\n          </ng-template>\n          <novo-condition-builder [groupIndex]=\"groupIndex\" [andIndex]=\"andIndex\" [hideOperator]=\"isFirst && hideFirstOperator\" [scope]=\"scope\" [conditionType]=\"controlName\"></novo-condition-builder>\n          <novo-button theme=\"icon\" icon=\"delete-o\" color=\"negative\" (click)=\"removeCondition(andIndex)\">\n          </novo-button>\n        </novo-flex>\n      </ng-container>\n    </ng-container>\n    <button\n      *ngIf=\"!qbs.hasMultipleScopes()\"\n      theme=\"dialogue\"\n      data-automation-id=\"add-advanced-search-condition\"\n      icon=\"add-thin\"\n      side=\"left\"\n      size=\"sm\"\n      uppercase\n      (click)=\"addCondition()\">\n      {{ labels.addCondition }}</button>\n  </novo-stack>\n</div>\n", 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"], dependencies: [{ kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i3.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "component", type: i5.NovoButtonElement, selector: "novo-button,button[theme]", inputs: ["color", "side", "size", "theme", "loading", "icon", "secondIcon", "disabled"] }, { kind: "component", type: i6.NovoLabel, selector: "novo-label,[novo-label]" }, { kind: "directive", type: i6.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"] }, { kind: "directive", type: i6.GapDirective, selector: "[gap]", inputs: ["gap"] }, { kind: "directive", type: i6.ThemeColorDirective, selector: "[theme]", inputs: ["theme"] }, { kind: "component", type: i6.NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }, { kind: "component", type: i6.NovoOptgroup, selector: "novo-optgroup", inputs: ["disabled", "label"], exportAs: ["novoOptgroup"] }, { kind: "component", type: i7.NovoFlexElement, selector: "novo-flex,novo-row", inputs: ["direction", "align", "justify", "wrap", "gap"] }, { kind: "component", type: i7.NovoStackElement, selector: "novo-stack,novo-column", inputs: ["direction", "align"] }, { kind: "component", type: i8.NovoDropdownElement, selector: "novo-dropdown", inputs: ["parentScrollSelector", "parentScrollAction", "containerClass", "side", "scrollStrategy", "keepOpen", "height", "width", "appendToBody", "multiple", "scrollToActiveItemOnOpen"], outputs: ["toggled"] }, { kind: "component", type: i9.ConditionBuilderComponent, selector: "novo-condition-builder", inputs: ["label", "scope", "andIndex", "groupIndex", "addressConfig", "hideOperator", "conditionType", "config", "editTypeFn"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: ConditionGroupComponent, selector: "novo-condition-group", inputs: { controlName: "controlName", groupIndex: "groupIndex", hideFirstOperator: "hideFirstOperator", canBeEmpty: "canBeEmpty", formGroupName: "formGroupName" }, host: { classAttribute: "novo-condition-group" }, providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => ConditionGroupComponent), multi: true }], usesOnChanges: 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\" [ngClass]=\"{ isFirst: andIndex === 0 }\" [class]=\"scope\" align=\"end\" gap=\"sm\" #flex>\n          <novo-dropdown *ngIf=\"(!isFirst || !hideFirstOperator) && 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 || !hideFirstOperator\" color=\"ash\" size=\"xs\" uppercase padding=\"sm\">\n              {{qbs.getConjunctionLabel(controlName)}}</novo-label>\n          </ng-template>\n          <novo-condition-builder [groupIndex]=\"groupIndex\" [andIndex]=\"andIndex\" [hideOperator]=\"isFirst && hideFirstOperator\" [scope]=\"scope\" [conditionType]=\"controlName\"></novo-condition-builder>\n          <novo-button theme=\"icon\" icon=\"delete-o\" color=\"negative\" (click)=\"removeCondition(andIndex)\">\n          </novo-button>\n        </novo-flex>\n      </ng-container>\n    </ng-container>\n    <button\n      *ngIf=\"!qbs.hasMultipleScopes()\"\n      theme=\"dialogue\"\n      data-automation-id=\"add-advanced-search-condition\"\n      icon=\"add-thin\"\n      side=\"left\"\n      size=\"sm\"\n      uppercase\n      (click)=\"addCondition()\">\n      {{ labels.addCondition }}</button>\n  </novo-stack>\n</div>\n", 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"], dependencies: [{ kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i3.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "component", type: i5.NovoButtonElement, selector: "novo-button,button[theme]", inputs: ["color", "side", "size", "theme", "loading", "icon", "secondIcon", "disabled"] }, { kind: "component", type: i6.NovoLabel, selector: "novo-label,[novo-label]", inputs: ["id"] }, { kind: "directive", type: i6.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"] }, { kind: "directive", type: i6.GapDirective, selector: "[gap]", inputs: ["gap"] }, { kind: "directive", type: i6.ThemeColorDirective, selector: "[theme]", inputs: ["theme"] }, { kind: "component", type: i6.NovoOption, selector: "novo-option", inputs: ["selected", "keepOpen", "novoInert", "value", "disabled"], exportAs: ["novoOption"] }, { kind: "component", type: i6.NovoOptgroup, selector: "novo-optgroup", inputs: ["disabled", "label"], exportAs: ["novoOptgroup"] }, { kind: "component", type: i7.NovoFlexElement, selector: "novo-flex,novo-row", inputs: ["direction", "align", "justify", "wrap", "gap"] }, { kind: "component", type: i7.NovoStackElement, selector: "novo-stack,novo-column", inputs: ["direction", "align"] }, { kind: "component", type: i8.NovoDropdownElement, selector: "novo-dropdown", inputs: ["parentScrollSelector", "parentScrollAction", "containerClass", "side", "scrollStrategy", "keepOpen", "height", "width", "appendToBody", "multiple", "scrollToActiveItemOnOpen"], outputs: ["toggled"] }, { kind: "component", type: i9.ConditionBuilderComponent, selector: "novo-condition-builder", inputs: ["label", "scope", "andIndex", "groupIndex", "addressConfig", "hideOperator", "conditionType", "config", "editTypeFn"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ConditionGroupComponent, decorators: [{
             type: Component,

package/esm2022/elements/query-builder/criteria-builder/criteria-builder.component.mjs

@@ -204,7 +204,7 @@ export class CriteriaBuilderComponent {
             { 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 }], viewQueries: [{ propertyName: "scopedFieldPicker", first: true, predicate: NovoTabbedGroupPickerElement, descendants: true, isSignal: true }, { propertyName: "conditionGroups", predicate: ConditionGroupComponent, descendants: true, isSignal: 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.hasMultipleScopes() ? conditionGroup.scope + ' ' + labels.filterss : qbs.getConjunctionLabel('and') }}</novo-label>\n      <novo-condition-group [hideFirstOperator]=\"hideFirstOperator\" [canBeEmpty]=\"canBeEmpty\" [groupIndex]=\"andIndex\" [formGroupName]=\"andIndex\" #conditionGroup></novo-condition-group>\n    </ng-container>\n  </novo-stack>\n  <novo-tabbed-group-picker\n    *ngIf=\"qbs.hasMultipleScopes()\"\n    [tabs]=\"tabbedGroupPickerTabs()\"\n    [selectionEnabled]=\"false\"\n    [buttonConfig]=\"addButtonConfig\"\n    (activation)=\"onFieldSelect($event)\">\n  </novo-tabbed-group-picker>\n</form>\n<novo-condition-templates [addressConfig]=\"addressConfig\"/>\n\n<!--\n  {\n    $and: [{\n      $or: [{\n        entity: 'JobOrder'\n        field: 'categories',\n        operator: 'doesNotContain',\n        value: 'Healthcare'\n      }]\n    }]\n  }\n -->\n", styles: [":host{position:relative;display:block;width:76rem}:host .criteria-builder-inner{padding-bottom:1rem}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "component", type: i5.NovoLabel, selector: "novo-label,[novo-label]" }, { kind: "directive", type: i5.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"] }, { kind: "component", type: i6.NovoStackElement, selector: "novo-stack,novo-column", inputs: ["direction", "align"] }, { kind: "component", type: i7.NovoTabbedGroupPickerElement, selector: "novo-tabbed-group-picker", inputs: ["buttonConfig", "tabs", "quickSelectConfig", "showFooter", "selectionEnabled"], outputs: ["activation", "selectionChange", "applyChange", "cancelChange"] }, { kind: "component", type: i8.ConditionGroupComponent, selector: "novo-condition-group", inputs: ["controlName", "groupIndex", "hideFirstOperator", "canBeEmpty", "formGroupName"] }, { kind: "component", type: i9.NovoConditionTemplatesComponent, selector: "novo-condition-templates", inputs: ["addressConfig"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], queries: [{ propertyName: "_contentFieldDefs", predicate: NovoConditionFieldDef, descendants: true }], viewQueries: [{ propertyName: "scopedFieldPicker", first: true, predicate: NovoTabbedGroupPickerElement, descendants: true, isSignal: true }, { propertyName: "conditionGroups", predicate: ConditionGroupComponent, descendants: true, isSignal: 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.hasMultipleScopes() ? conditionGroup.scope + ' ' + labels.filterss : qbs.getConjunctionLabel('and') }}</novo-label>\n      <novo-condition-group [hideFirstOperator]=\"hideFirstOperator\" [canBeEmpty]=\"canBeEmpty\" [groupIndex]=\"andIndex\" [formGroupName]=\"andIndex\" #conditionGroup></novo-condition-group>\n    </ng-container>\n  </novo-stack>\n  <novo-tabbed-group-picker\n    *ngIf=\"qbs.hasMultipleScopes()\"\n    [tabs]=\"tabbedGroupPickerTabs()\"\n    [selectionEnabled]=\"false\"\n    [buttonConfig]=\"addButtonConfig\"\n    (activation)=\"onFieldSelect($event)\">\n  </novo-tabbed-group-picker>\n</form>\n<novo-condition-templates [addressConfig]=\"addressConfig\"/>\n\n<!--\n  {\n    $and: [{\n      $or: [{\n        entity: 'JobOrder'\n        field: 'categories',\n        operator: 'doesNotContain',\n        value: 'Healthcare'\n      }]\n    }]\n  }\n -->\n", styles: [":host{position:relative;display:block;width:76rem}:host .criteria-builder-inner{padding-bottom:1rem}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "component", type: i5.NovoLabel, selector: "novo-label,[novo-label]", inputs: ["id"] }, { kind: "directive", type: i5.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"] }, { kind: "component", type: i6.NovoStackElement, selector: "novo-stack,novo-column", inputs: ["direction", "align"] }, { kind: "component", type: i7.NovoTabbedGroupPickerElement, selector: "novo-tabbed-group-picker", inputs: ["buttonConfig", "tabs", "quickSelectConfig", "showFooter", "selectionEnabled"], outputs: ["activation", "selectionChange", "applyChange", "cancelChange"] }, { kind: "component", type: i8.ConditionGroupComponent, selector: "novo-condition-group", inputs: ["controlName", "groupIndex", "hideFirstOperator", "canBeEmpty", "formGroupName"] }, { kind: "component", type: i9.NovoConditionTemplatesComponent, selector: "novo-condition-templates", inputs: ["addressConfig"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CriteriaBuilderComponent, decorators: [{
             type: Component,