eru-grid 0.0.59 → 0.0.60

package/fesm2022/eru-grid.mjs

@@ -8721,6 +8721,14 @@ class ChipListComponent {
     }
     _compact = signal(false, ...(ngDevMode ? [{ debugName: "_compact" }] : []));
     set compact(value) { this._compact.set(!!value); }
+    /**
+     * Show every chip, wrapping onto further lines, instead of fitting one row
+     * and counting the rest. For a read-only display where the height is free;
+     * a grid cell or a select trigger has one line and keeps the `+N`.
+     */
+    _wrap = signal(false, ...(ngDevMode ? [{ debugName: "_wrap" }] : []));
+    set wrap(value) { this._wrap.set(!!value); }
+    isWrapped = computed(() => this._wrap(), ...(ngDevMode ? [{ debugName: "isWrapped" }] : []));
     /**
      * Width to fit into. 0 means "measure the host", which is what a page control
      * wants; a grid cell passes its column width, which is known before layout.
@@ -8813,6 +8821,10 @@ class ChipListComponent {
         const width = this.measuredWidth();
         if (items.length === 0)
             return { visible: [], hidden: [] };
+        // Wrapping has no overflow to count — every chip is shown and the row grows
+        // downwards, so the measuring below has nothing to decide.
+        if (this._wrap())
+            return { visible: items, hidden: [] };
         // Before the first measurement, show the first chip only: showing all of
         // them would flash a too-wide row for one frame.
         if (width <= 0)
@@ -8861,8 +8873,9 @@ class ChipListComponent {
     hiddenCount = computed(() => this.fit().hidden.length, ...(ngDevMode ? [{ debugName: "hiddenCount" }] : []));
     hiddenLabels = computed(() => this.fit().hidden.map(c => c.label).join(', '), ...(ngDevMode ? [{ debugName: "hiddenLabels" }] : []));
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: ChipListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: ChipListComponent, isStandalone: true, selector: "eru-chip-list", inputs: { labels: "labels", chips: "chips", compact: "compact", availableWidth: "availableWidth" }, ngImport: i0, template: `
-    <div class="eru-chip-list" [class.eru-chip-list--compact]="isCompact()">
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: ChipListComponent, isStandalone: true, selector: "eru-chip-list", inputs: { labels: "labels", chips: "chips", compact: "compact", wrap: "wrap", availableWidth: "availableWidth" }, ngImport: i0, template: `
+    <div class="eru-chip-list" [class.eru-chip-list--compact]="isCompact()"
+      [class.eru-chip-list--wrap]="isWrapped()">
       @for (chip of visible(); track $index) {
         <span class="eru-chip" [title]="chip.label"
           [style.background]="chip.background || null"
@@ -8877,12 +8890,13 @@ class ChipListComponent {
         <span class="eru-chip eru-chip--more" [title]="hiddenLabels()">+{{ hiddenCount() }}</span>
       }
     </div>
-  `, isInline: true, styles: [".eru-chip-list{display:flex;flex-wrap:nowrap;align-items:center;gap:var(--eru-chip-gap, 4px);min-width:0;overflow:hidden}.eru-chip{flex:0 0 auto;max-width:100%;padding:var(--grid-pill-padding-y, 2px) var(--grid-pill-padding-x, 8px);border-radius:var(--grid-pill-radius, 999px);background:var(--grid-surface-container-high, #e6e0e9);color:var(--grid-on-surface, #1d1b20);font-size:var(--grid-pill-font-size, inherit);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.eru-chip--more{background:var(--grid-surface-variant, #e7e0ec);color:var(--grid-on-surface-variant, #49454f)}.eru-chip-list--compact .eru-chip{padding:1px 6px}.eru-chip__dot{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:4px;vertical-align:middle;flex:0 0 auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+  `, isInline: true, styles: [".eru-chip-list{display:flex;flex-wrap:nowrap;align-items:center;gap:var(--eru-chip-gap, 4px);min-width:0;overflow:hidden}.eru-chip{flex:0 0 auto;max-width:100%;padding:var(--grid-pill-padding-y, 2px) var(--grid-pill-padding-x, 8px);border-radius:var(--grid-pill-radius, 999px);background:var(--grid-surface-container-high, #e6e0e9);color:var(--grid-on-surface, #1d1b20);font-size:var(--grid-pill-font-size, inherit);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.eru-chip--more{background:var(--grid-surface-variant, #e7e0ec);color:var(--grid-on-surface-variant, #49454f)}.eru-chip-list--compact .eru-chip{padding:1px 6px}.eru-chip-list--wrap{flex-wrap:wrap;overflow:visible;row-gap:var(--eru-chip-gap, 4px)}.eru-chip__dot{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:4px;vertical-align:middle;flex:0 0 auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: ChipListComponent, decorators: [{
             type: Component,
             args: [{ selector: 'eru-chip-list', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: `
-    <div class="eru-chip-list" [class.eru-chip-list--compact]="isCompact()">
+    <div class="eru-chip-list" [class.eru-chip-list--compact]="isCompact()"
+      [class.eru-chip-list--wrap]="isWrapped()">
       @for (chip of visible(); track $index) {
         <span class="eru-chip" [title]="chip.label"
           [style.background]="chip.background || null"
@@ -8897,13 +8911,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImpor
         <span class="eru-chip eru-chip--more" [title]="hiddenLabels()">+{{ hiddenCount() }}</span>
       }
     </div>
-  `, styles: [".eru-chip-list{display:flex;flex-wrap:nowrap;align-items:center;gap:var(--eru-chip-gap, 4px);min-width:0;overflow:hidden}.eru-chip{flex:0 0 auto;max-width:100%;padding:var(--grid-pill-padding-y, 2px) var(--grid-pill-padding-x, 8px);border-radius:var(--grid-pill-radius, 999px);background:var(--grid-surface-container-high, #e6e0e9);color:var(--grid-on-surface, #1d1b20);font-size:var(--grid-pill-font-size, inherit);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.eru-chip--more{background:var(--grid-surface-variant, #e7e0ec);color:var(--grid-on-surface-variant, #49454f)}.eru-chip-list--compact .eru-chip{padding:1px 6px}.eru-chip__dot{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:4px;vertical-align:middle;flex:0 0 auto}\n"] }]
+  `, styles: [".eru-chip-list{display:flex;flex-wrap:nowrap;align-items:center;gap:var(--eru-chip-gap, 4px);min-width:0;overflow:hidden}.eru-chip{flex:0 0 auto;max-width:100%;padding:var(--grid-pill-padding-y, 2px) var(--grid-pill-padding-x, 8px);border-radius:var(--grid-pill-radius, 999px);background:var(--grid-surface-container-high, #e6e0e9);color:var(--grid-on-surface, #1d1b20);font-size:var(--grid-pill-font-size, inherit);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.eru-chip--more{background:var(--grid-surface-variant, #e7e0ec);color:var(--grid-on-surface-variant, #49454f)}.eru-chip-list--compact .eru-chip{padding:1px 6px}.eru-chip-list--wrap{flex-wrap:wrap;overflow:visible;row-gap:var(--eru-chip-gap, 4px)}.eru-chip__dot{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:4px;vertical-align:middle;flex:0 0 auto}\n"] }]
         }], ctorParameters: () => [], propDecorators: { labels: [{
                 type: Input
             }], chips: [{
                 type: Input
             }], compact: [{
                 type: Input
+            }], wrap: [{
+                type: Input
             }], availableWidth: [{
                 type: Input
             }] } });
@@ -9539,7 +9555,7 @@ class SelectComponent {
         return undefined;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: SelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: SelectComponent, isStandalone: true, selector: "eru-select", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, isEditable: { classPropertyName: "isEditable", publicName: "isEditable", isSignal: true, isRequired: false, transformFunction: null }, isActive: { classPropertyName: "isActive", publicName: "isActive", isSignal: true, isRequired: false, transformFunction: null }, isDrillable: { classPropertyName: "isDrillable", publicName: "isDrillable", isSignal: true, isRequired: false, transformFunction: null }, columnWidth: { classPropertyName: "columnWidth", publicName: "columnWidth", isSignal: true, isRequired: false, transformFunction: null }, fieldSize: { classPropertyName: "fieldSize", publicName: "fieldSize", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, eruGridStore: { classPropertyName: "eruGridStore", publicName: "eruGridStore", isSignal: true, isRequired: false, transformFunction: null }, row: { classPropertyName: "row", publicName: "row", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", blur: "blur", focus: "focus", drilldownClick: "drilldownClick", editModeChange: "editModeChange" }, viewQueries: [{ propertyName: "selectContainer", first: true, predicate: ["selectContainer"], descendants: true }, { propertyName: "matSelect", first: true, predicate: MatSelect, descendants: true }], ngImport: i0, template: "@if(isActive()) {\n<mat-form-field [appearance]=\"getProperty('appearance') || 'outline'\" class=\"select-form-field\"\n  (click)=\"$event.stopPropagation()\" (mousedown)=\"$event.stopPropagation()\">\n  <div #selectContainer class=\"select-container\">\n    <mat-select [placeholder]=\"getProperty('placeholder') || ''\" [multiple]=\"multiple()\"\n      [disabled]=\"getProperty('disabled') || !isEditable()\" [required]=\"hasRequiredValidation()\"\n      [value]=\"currentValue()\" [compareWith]=\"compareWith\" panelClass=\"select-panel\" class=\"select-input\"\n      (selectionChange)=\"onValueChange($event.value)\" (blur)=\"onBlur($event)\" (openedChange)=\"onOpenedChange($event)\"\n      (click)=\"$event.stopPropagation()\">\n      <!-- Material's own custom-trigger hook (MatSelectTrigger). Everything\n           mat-select does \u2014 selection model, keyboard, a11y \u2014 is untouched;\n           only the comma-joined text is replaced by the chip row. -->\n      @if (multiple() && selectedLabels().length > 0) {\n      <mat-select-trigger>\n        <eru-chip-list [labels]=\"selectedLabels()\" [compact]=\"true\"></eru-chip-list>\n      </mat-select-trigger>\n      }\n\n      <mat-option disabled class=\"search-option\" (click)=\"$event.stopPropagation(); $event.preventDefault()\"\n        (mousedown)=\"$event.stopPropagation(); $event.preventDefault()\">\n        <mat-form-field [appearance]=\"getProperty('appearance') || 'outline'\" class=\"search-form-field\">\n          <mat-label>Search</mat-label>\n          <input matInput type=\"text\" class=\"search-input\" [value]=\"searchText()\"\n            (input)=\"onSearchChange($any($event.target).value)\" (click)=\"$event.stopPropagation()\"\n            (mousedown)=\"$event.stopPropagation()\" (keydown)=\"$event.stopPropagation()\"\n            (focus)=\"$event.stopPropagation()\">\n        </mat-form-field>\n        @if (multiple()) {\n        <div class=\"select-all-container\" (click)=\"$event.stopPropagation()\">\n          <mat-checkbox [checked]=\"isAllSelected()\" [indeterminate]=\"isIndeterminate()\"\n            (change)=\"toggleSelectAll($event.checked)\" (click)=\"$event.stopPropagation(); $event.preventDefault()\"\n            (mousedown)=\"$event.stopPropagation(); $event.preventDefault()\">\n            <span class=\"select-all-text\">Select All</span>\n          </mat-checkbox>\n        </div>\n        }\n      </mat-option>\n\n      @for (option of filteredOptions(); track trackByValueAndIndex($index, option)) {\n      @if (multiple()) {\n      <mat-option [value]=\"option.value\" (mousedown)=\"$event.stopPropagation(); $event.preventDefault()\"\n        (click)=\"$event.stopPropagation(); $event.preventDefault()\">\n        {{ option.label }}\n      </mat-option>\n      } @else {\n      <mat-option [value]=\"option.value\">\n        {{ option.label }}\n      </mat-option>\n      }\n      }\n    </mat-select>\n  </div>\n</mat-form-field>\n} @else {\n<div class=\"select-display\" [class.select-display-editable]=\"isEditable()\" (dblclick)=\"onActivate()\">\n  @if (multiple() && selectedLabels().length > 0) {\n  <eru-chip-list [labels]=\"selectedLabels()\" [compact]=\"true\" [availableWidth]=\"columnWidth()\"></eru-chip-list>\n  } @else if (isDrillable()) {\n  <span class=\"select-drillable\" (click)=\"onDrillableClick($event)\">\n    {{formatDisplayValue() || (getProperty('placeholder') || '')}}\n  </span>\n  } @else {\n  {{formatDisplayValue() || (getProperty('placeholder') || '')}}\n  }\n</div>\n}", styles: ["@charset \"UTF-8\";.select-form-field{width:100%}.select-form-field .mat-mdc-form-field-subscript-wrapper{display:none}.select-container{width:100%}.select-display{width:100%;padding:8px 12px;min-height:30px;display:flex;align-items:center;cursor:default}.select-display.select-display-editable{cursor:pointer}.select-display.select-display-editable:hover{background-color:#0000000a}.select-drillable{color:var(--cell-color, #1976d2);cursor:pointer;text-decoration:underline}.select-drillable:hover{color:var(--cell-color, #1565c0)}.search-option{padding:2px 4px!important;cursor:default!important;pointer-events:auto!important;width:100%!important;box-sizing:border-box!important;overflow:hidden!important}.search-option mat-pseudo-checkbox{display:none!important}.search-option .mat-mdc-option{height:auto!important;padding:2px 4px!important;min-height:auto!important}.search-option .mat-mdc-option:hover{background:transparent!important}.search-option .mdc-list-item__primary-text{width:100%!important;max-width:100%!important;box-sizing:border-box!important;padding:0!important;margin:0!important;align-items:stretch!important}.search-option .search-form-field{width:100%!important;max-width:100%!important;pointer-events:auto!important;box-sizing:border-box!important;margin:0!important}.search-option .search-form-field .mat-mdc-form-field-subscript-wrapper{display:none}.search-option .search-form-field .mat-mdc-text-field-wrapper{padding-bottom:0!important;width:100%!important;max-width:100%!important;box-sizing:border-box!important}.search-option .search-form-field .mat-mdc-form-field-infix{width:100%!important;max-width:100%!important;box-sizing:border-box!important;min-height:auto!important;padding:0!important}.search-option .search-form-field .mat-mdc-form-field-flex{width:100%!important;max-width:100%!important;box-sizing:border-box!important}.search-option .search-input{width:100%;border:none;outline:none;background:transparent;font-size:var(--cell-font-size, var(--grid-font-size-body, 12px))!important;padding:8px 0}.search-option .select-all-container{padding:4px 0 4px 12px!important;display:flex!important;align-items:center!important;pointer-events:auto!important}.search-option .select-all-container .select-all-text{font-family:var(--grid-font-family, \"Poppins\")!important;font-size:var(--cell-font-size, var(--grid-font-size-body, 12px))!important;font-weight:var(--cell-font-weight, 500)!important;color:var(--cell-color, var(--grid-on-surface, #1d1b20))!important}.search-option .select-all-container mat-checkbox .mdc-checkbox{display:none!important}.search-option .select-all-container mat-checkbox .mdc-form-field{padding:0!important;margin:0!important}.search-option .select-all-container mat-checkbox .mdc-label{padding:0 0 0 12px!important;margin:0!important;cursor:pointer!important}.search-option .select-all-container mat-checkbox.mat-mdc-checkbox-checked .mdc-label:before,.search-option .select-all-container mat-checkbox.mat-mdc-checkbox-indeterminate .mdc-label:before{content:\"\\2713\";font-size:var(--cell-font-size, 16px);font-weight:var(--cell-font-weight, 700);color:var(--cell-color, var(--grid-on-surface, #1d1b20));margin-right:4px}.select-panel{min-width:200px!important}.select-input{padding-left:4px}.select-panel .search-option .mat-mdc-option,.mat-mdc-select-panel .search-option .mat-mdc-option{min-height:auto!important;padding:2px 4px!important}.select-panel .mdc-list-item--disabled,.mat-mdc-select-panel .mdc-list-item--disabled{pointer-events:auto!important;cursor:default!important}.select-panel .mdc-list-item--disabled:hover,.mat-mdc-select-panel .mdc-list-item--disabled:hover{background:transparent!important}.select-panel mat-option mat-pseudo-checkbox{display:none!important}.select-panel mat-option.mdc-list-item--selected:not(.search-option) .mdc-list-item__primary-text:before{content:\"\\2713\"!important;font-size:var(--cell-font-size, 16px);font-weight:var(--cell-font-weight, 700);color:var(--cell-color, var(--grid-on-surface, #1d1b20));margin-right:8px;display:inline!important}mat-option .mdc-list-item__primary-text{line-height:1.5!important;white-space:normal!important}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i2$3.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i2$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i2$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "component", type: ChipListComponent, selector: "eru-chip-list", inputs: ["labels", "chips", "compact", "availableWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: SelectComponent, isStandalone: true, selector: "eru-select", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, isEditable: { classPropertyName: "isEditable", publicName: "isEditable", isSignal: true, isRequired: false, transformFunction: null }, isActive: { classPropertyName: "isActive", publicName: "isActive", isSignal: true, isRequired: false, transformFunction: null }, isDrillable: { classPropertyName: "isDrillable", publicName: "isDrillable", isSignal: true, isRequired: false, transformFunction: null }, columnWidth: { classPropertyName: "columnWidth", publicName: "columnWidth", isSignal: true, isRequired: false, transformFunction: null }, fieldSize: { classPropertyName: "fieldSize", publicName: "fieldSize", isSignal: true, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: true, isRequired: false, transformFunction: null }, eruGridStore: { classPropertyName: "eruGridStore", publicName: "eruGridStore", isSignal: true, isRequired: false, transformFunction: null }, row: { classPropertyName: "row", publicName: "row", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", blur: "blur", focus: "focus", drilldownClick: "drilldownClick", editModeChange: "editModeChange" }, viewQueries: [{ propertyName: "selectContainer", first: true, predicate: ["selectContainer"], descendants: true }, { propertyName: "matSelect", first: true, predicate: MatSelect, descendants: true }], ngImport: i0, template: "@if(isActive()) {\n<mat-form-field [appearance]=\"getProperty('appearance') || 'outline'\" class=\"select-form-field\"\n  (click)=\"$event.stopPropagation()\" (mousedown)=\"$event.stopPropagation()\">\n  <div #selectContainer class=\"select-container\">\n    <mat-select [placeholder]=\"getProperty('placeholder') || ''\" [multiple]=\"multiple()\"\n      [disabled]=\"getProperty('disabled') || !isEditable()\" [required]=\"hasRequiredValidation()\"\n      [value]=\"currentValue()\" [compareWith]=\"compareWith\" panelClass=\"select-panel\" class=\"select-input\"\n      (selectionChange)=\"onValueChange($event.value)\" (blur)=\"onBlur($event)\" (openedChange)=\"onOpenedChange($event)\"\n      (click)=\"$event.stopPropagation()\">\n      <!-- Material's own custom-trigger hook (MatSelectTrigger). Everything\n           mat-select does \u2014 selection model, keyboard, a11y \u2014 is untouched;\n           only the comma-joined text is replaced by the chip row. -->\n      @if (multiple() && selectedLabels().length > 0) {\n      <mat-select-trigger>\n        <eru-chip-list [labels]=\"selectedLabels()\" [compact]=\"true\"></eru-chip-list>\n      </mat-select-trigger>\n      }\n\n      <mat-option disabled class=\"search-option\" (click)=\"$event.stopPropagation(); $event.preventDefault()\"\n        (mousedown)=\"$event.stopPropagation(); $event.preventDefault()\">\n        <mat-form-field [appearance]=\"getProperty('appearance') || 'outline'\" class=\"search-form-field\">\n          <mat-label>Search</mat-label>\n          <input matInput type=\"text\" class=\"search-input\" [value]=\"searchText()\"\n            (input)=\"onSearchChange($any($event.target).value)\" (click)=\"$event.stopPropagation()\"\n            (mousedown)=\"$event.stopPropagation()\" (keydown)=\"$event.stopPropagation()\"\n            (focus)=\"$event.stopPropagation()\">\n        </mat-form-field>\n        @if (multiple()) {\n        <div class=\"select-all-container\" (click)=\"$event.stopPropagation()\">\n          <mat-checkbox [checked]=\"isAllSelected()\" [indeterminate]=\"isIndeterminate()\"\n            (change)=\"toggleSelectAll($event.checked)\" (click)=\"$event.stopPropagation(); $event.preventDefault()\"\n            (mousedown)=\"$event.stopPropagation(); $event.preventDefault()\">\n            <span class=\"select-all-text\">Select All</span>\n          </mat-checkbox>\n        </div>\n        }\n      </mat-option>\n\n      @for (option of filteredOptions(); track trackByValueAndIndex($index, option)) {\n      @if (multiple()) {\n      <mat-option [value]=\"option.value\" (mousedown)=\"$event.stopPropagation(); $event.preventDefault()\"\n        (click)=\"$event.stopPropagation(); $event.preventDefault()\">\n        {{ option.label }}\n      </mat-option>\n      } @else {\n      <mat-option [value]=\"option.value\">\n        {{ option.label }}\n      </mat-option>\n      }\n      }\n    </mat-select>\n  </div>\n</mat-form-field>\n} @else {\n<div class=\"select-display\" [class.select-display-editable]=\"isEditable()\" (dblclick)=\"onActivate()\">\n  @if (multiple() && selectedLabels().length > 0) {\n  <eru-chip-list [labels]=\"selectedLabels()\" [compact]=\"true\" [availableWidth]=\"columnWidth()\"></eru-chip-list>\n  } @else if (isDrillable()) {\n  <span class=\"select-drillable\" (click)=\"onDrillableClick($event)\">\n    {{formatDisplayValue() || (getProperty('placeholder') || '')}}\n  </span>\n  } @else {\n  {{formatDisplayValue() || (getProperty('placeholder') || '')}}\n  }\n</div>\n}", styles: ["@charset \"UTF-8\";.select-form-field{width:100%}.select-form-field .mat-mdc-form-field-subscript-wrapper{display:none}.select-container{width:100%}.select-display{width:100%;padding:8px 12px;min-height:30px;display:flex;align-items:center;cursor:default}.select-display.select-display-editable{cursor:pointer}.select-display.select-display-editable:hover{background-color:#0000000a}.select-drillable{color:var(--cell-color, #1976d2);cursor:pointer;text-decoration:underline}.select-drillable:hover{color:var(--cell-color, #1565c0)}.search-option{padding:2px 4px!important;cursor:default!important;pointer-events:auto!important;width:100%!important;box-sizing:border-box!important;overflow:hidden!important}.search-option mat-pseudo-checkbox{display:none!important}.search-option .mat-mdc-option{height:auto!important;padding:2px 4px!important;min-height:auto!important}.search-option .mat-mdc-option:hover{background:transparent!important}.search-option .mdc-list-item__primary-text{width:100%!important;max-width:100%!important;box-sizing:border-box!important;padding:0!important;margin:0!important;align-items:stretch!important}.search-option .search-form-field{width:100%!important;max-width:100%!important;pointer-events:auto!important;box-sizing:border-box!important;margin:0!important}.search-option .search-form-field .mat-mdc-form-field-subscript-wrapper{display:none}.search-option .search-form-field .mat-mdc-text-field-wrapper{padding-bottom:0!important;width:100%!important;max-width:100%!important;box-sizing:border-box!important}.search-option .search-form-field .mat-mdc-form-field-infix{width:100%!important;max-width:100%!important;box-sizing:border-box!important;min-height:auto!important;padding:0!important}.search-option .search-form-field .mat-mdc-form-field-flex{width:100%!important;max-width:100%!important;box-sizing:border-box!important}.search-option .search-input{width:100%;border:none;outline:none;background:transparent;font-size:var(--cell-font-size, var(--grid-font-size-body, 12px))!important;padding:8px 0}.search-option .select-all-container{padding:4px 0 4px 12px!important;display:flex!important;align-items:center!important;pointer-events:auto!important}.search-option .select-all-container .select-all-text{font-family:var(--grid-font-family, \"Poppins\")!important;font-size:var(--cell-font-size, var(--grid-font-size-body, 12px))!important;font-weight:var(--cell-font-weight, 500)!important;color:var(--cell-color, var(--grid-on-surface, #1d1b20))!important}.search-option .select-all-container mat-checkbox .mdc-checkbox{display:none!important}.search-option .select-all-container mat-checkbox .mdc-form-field{padding:0!important;margin:0!important}.search-option .select-all-container mat-checkbox .mdc-label{padding:0 0 0 12px!important;margin:0!important;cursor:pointer!important}.search-option .select-all-container mat-checkbox.mat-mdc-checkbox-checked .mdc-label:before,.search-option .select-all-container mat-checkbox.mat-mdc-checkbox-indeterminate .mdc-label:before{content:\"\\2713\";font-size:var(--cell-font-size, 16px);font-weight:var(--cell-font-weight, 700);color:var(--cell-color, var(--grid-on-surface, #1d1b20));margin-right:4px}.select-panel{min-width:200px!important}.select-input{padding-left:4px}.select-panel .search-option .mat-mdc-option,.mat-mdc-select-panel .search-option .mat-mdc-option{min-height:auto!important;padding:2px 4px!important}.select-panel .mdc-list-item--disabled,.mat-mdc-select-panel .mdc-list-item--disabled{pointer-events:auto!important;cursor:default!important}.select-panel .mdc-list-item--disabled:hover,.mat-mdc-select-panel .mdc-list-item--disabled:hover{background:transparent!important}.select-panel mat-option mat-pseudo-checkbox{display:none!important}.select-panel mat-option.mdc-list-item--selected:not(.search-option) .mdc-list-item__primary-text:before{content:\"\\2713\"!important;font-size:var(--cell-font-size, 16px);font-weight:var(--cell-font-weight, 700);color:var(--cell-color, var(--grid-on-surface, #1d1b20));margin-right:8px;display:inline!important}mat-option .mdc-list-item__primary-text{line-height:1.5!important;white-space:normal!important}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i2$3.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i2$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i2$1.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "component", type: ChipListComponent, selector: "eru-chip-list", inputs: ["labels", "chips", "compact", "wrap", "availableWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: SelectComponent, decorators: [{
             type: Component,
@@ -10185,7 +10201,7 @@ class TagComponent {
         this.newTagColor.set('#cccccc');
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: TagComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: TagComponent, isStandalone: true, selector: "eru-tag", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, isEditable: { classPropertyName: "isEditable", publicName: "isEditable", isSignal: true, isRequired: false, transformFunction: null }, isActive: { classPropertyName: "isActive", publicName: "isActive", isSignal: true, isRequired: false, transformFunction: null }, isDrillable: { classPropertyName: "isDrillable", publicName: "isDrillable", isSignal: true, isRequired: false, transformFunction: null }, columnWidth: { classPropertyName: "columnWidth", publicName: "columnWidth", isSignal: true, isRequired: false, transformFunction: null }, fieldSize: { classPropertyName: "fieldSize", publicName: "fieldSize", isSignal: true, isRequired: false, transformFunction: null }, eruGridStore: { classPropertyName: "eruGridStore", publicName: "eruGridStore", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", blur: "blur", focus: "focus", drilldownClick: "drilldownClick", editModeChange: "editModeChange", newTagAdded: "newTagAdded" }, viewQueries: [{ propertyName: "selectContainer", first: true, predicate: ["selectContainer"], descendants: true }], ngImport: i0, template: "@if(isActive()) {\n  <mat-form-field \n    [appearance]=\"getProperty('appearance') || 'outline'\"\n    class=\"tag-form-field\"\n    (click)=\"$event.stopPropagation()\"\n    (mousedown)=\"$event.stopPropagation()\">\n    <div #selectContainer class=\"tag-container\">\n      <mat-select\n        [placeholder]=\"getProperty('placeholder') || ''\"\n        [multiple]=\"true\"\n        [disabled]=\"getProperty('disabled') || !isEditable()\"\n        [required]=\"hasRequiredValidation()\"\n        [value]=\"currentValue()\"\n        [compareWith]=\"compareWith\"\n        panelClass=\"tag-panel\"\n        (selectionChange)=\"onValueChange($event.value)\"\n        (blur)=\"onBlur($event)\"\n        (openedChange)=\"onOpenedChange($event)\"\n        (click)=\"$event.stopPropagation()\">\n      <!-- Material's own custom-trigger hook (MatSelectTrigger), so the closed\n           control shows the same coloured chip row as view mode instead of\n           mat-select's comma-joined text. Nothing about mat-select's own\n           behaviour is replaced. -->\n      <!-- Unconditional: `customTrigger` is a content query, and gating the\n           element behind an @if leaves it unresolved on the pass that matters.\n           mat-select renders its placeholder while the value is empty, so an\n           always-present trigger costs nothing. -->\n      <mat-select-trigger>\n        <eru-chip-list [chips]=\"tagChips()\" [compact]=\"true\"></eru-chip-list>\n      </mat-select-trigger>\n        \n        <mat-option disabled class=\"search-option\"\n          (click)=\"$event.stopPropagation(); $event.preventDefault()\"\n          (mousedown)=\"$event.stopPropagation(); $event.preventDefault()\">\n          @if (isSearchable()) {\n            <mat-form-field\n              [appearance]=\"getProperty('appearance') || 'outline'\"\n              class=\"search-form-field\">\n              <mat-label>Search</mat-label>\n              <input\n                matInput\n                type=\"text\"\n                class=\"search-input\"\n                [value]=\"searchText()\"\n                (input)=\"onSearchChange($any($event.target).value)\"\n                (click)=\"$event.stopPropagation()\"\n                (mousedown)=\"$event.stopPropagation()\"\n                (keydown)=\"$event.stopPropagation()\"\n                (focus)=\"$event.stopPropagation()\">\n            </mat-form-field>\n          }\n          <div class=\"select-all-container mat-mdc-option mdc-list-item\"\n            [class.mdc-list-item--selected]=\"isAllSelected() || isIndeterminate()\"\n            [class.select-all-partial]=\"isIndeterminate()\"\n            (click)=\"toggleSelectAll(!isAllSelected()); $event.stopPropagation(); $event.preventDefault()\"\n            (mousedown)=\"$event.stopPropagation(); $event.preventDefault()\">\n            <mat-pseudo-checkbox\n              class=\"mat-mdc-option-pseudo-checkbox select-all-checkbox\"\n              [state]=\"isIndeterminate() ? 'indeterminate' : (isAllSelected() ? 'checked' : 'unchecked')\"></mat-pseudo-checkbox>\n            <span class=\"mdc-list-item__primary-text select-all-text\">Select All</span>\n          </div>\n        </mat-option>\n\n        @for (option of filteredOptions(); track trackByValueAndIndex($index, option)) {\n          <mat-option [value]=\"option.value\" \n            (mousedown)=\"$event.stopPropagation(); $event.preventDefault()\" \n            (click)=\"$event.stopPropagation(); $event.preventDefault()\">\n            <span class=\"tag-option\" \n              [style.background]=\"getTagColor(option.value).background\" \n              [style.color]=\"getTagColor(option.value).text\">\n              <span class=\"tag-dot\" [style.background]=\"getTagColor(option.value).dot\"></span>\n              {{ option.label }}\n            </span>\n          </mat-option>\n        }\n\n        <mat-option class=\"add-tag-option\"\n          (click)=\"$event.stopPropagation(); $event.preventDefault()\"\n          (mousedown)=\"$event.stopPropagation(); $event.preventDefault()\">\n          <div class=\"add-tag-container\" (click)=\"$event.stopPropagation()\">\n            <mat-form-field\n              [appearance]=\"getProperty('appearance') || 'outline'\"\n              class=\"add-tag-form-field\">\n              <mat-label>Add new tag</mat-label>\n              <input\n                matInput\n                type=\"text\"\n                class=\"add-tag-input\"\n                [value]=\"newTagInput()\"\n                (input)=\"onNewTagInputChange($any($event.target).value)\"\n                (keydown.enter)=\"addNewTag()\"\n                (click)=\"$event.stopPropagation()\"\n                (mousedown)=\"$event.stopPropagation()\"\n                (keydown)=\"$event.stopPropagation()\"\n                (focus)=\"$event.stopPropagation()\">\n            </mat-form-field>\n            <div class=\"add-tag-actions\">\n              <input\n                type=\"color\"\n                class=\"add-tag-color-picker\"\n                [value]=\"newTagColor()\"\n                (input)=\"onNewTagColorChange($any($event.target).value)\"\n                (click)=\"$event.stopPropagation()\"\n                (mousedown)=\"$event.stopPropagation()\"\n                title=\"Select tag color\">\n              <button\n                mat-icon-button\n                class=\"add-tag-button\"\n                [disabled]=\"!canAddNewTag()\"\n                (click)=\"addNewTag(); $event.stopPropagation()\"\n                (mousedown)=\"$event.stopPropagation()\">\n                <mat-icon>add</mat-icon>\n              </button>\n            </div>\n          </div>\n        </mat-option>\n\n      </mat-select>\n    </div>\n  </mat-form-field>\n} @else {\n  <div \n    class=\"tag-display\" \n    [class.tag-display-editable]=\"isEditable()\"\n    (dblclick)=\"onActivate()\">\n    @if (isDrillable()) {\n      <span class=\"drillable-value\" (click)=\"onDrillableClick($event)\">\n        <eru-chip-list [chips]=\"tagChips()\" [compact]=\"true\" [availableWidth]=\"columnWidth()\"></eru-chip-list>\n      </span>\n    } @else {\n      <eru-chip-list [chips]=\"tagChips()\" [compact]=\"true\" [availableWidth]=\"columnWidth()\"></eru-chip-list>\n    }\n  </div>\n}\n\n", styles: [".tag-form-field{width:100%}.tag-form-field .mat-mdc-form-field-subscript-wrapper{display:none}.tag-container{width:100%}.tag-display{width:100%;padding:8px 12px;min-height:30px;display:flex;flex-wrap:wrap;align-items:center;gap:4px;cursor:default}.tag-display.tag-display-editable{cursor:pointer}.tag-display.tag-display-editable:hover{background-color:#0000000a}.tag{display:inline-flex;align-items:center;gap:var(--grid-tag-dot-gap, 5px);padding:var(--grid-pill-padding-y, 3px) var(--grid-pill-padding-x, 10px);border-radius:var(--grid-pill-radius, 12px);font-size:var(--cell-font-size, var(--grid-pill-font-size, var(--grid-font-size-body, 12px)));font-weight:var(--cell-font-weight, var(--grid-pill-font-weight, 500));white-space:nowrap;line-height:1.2}.tag-dot{flex:0 0 auto;width:var(--grid-tag-dot-size, 6px);height:var(--grid-tag-dot-size, 6px);border-radius:50%}.tag-more{display:inline-block;border-radius:var(--grid-pill-radius, 12px);background-color:var(--grid-surface-container-high, #f5f5f5);color:var(--grid-on-surface-variant, #49454f);font-size:var(--cell-font-size, var(--grid-pill-font-size, var(--grid-font-size-body, 12px)));font-weight:var(--cell-font-weight, var(--grid-pill-font-weight, 700));font-style:italic;padding:var(--grid-pill-padding-y, 3px) var(--grid-pill-padding-x, 10px);white-space:nowrap;line-height:1.2}.drillable-value{display:flex;flex-wrap:wrap;gap:4px;align-items:center;cursor:pointer}.drillable-value .tag{text-decoration:underline}.add-option{position:sticky;position:-webkit-sticky;bottom:0;z-index:3;background:var(--grid-surface-container-high, #fff);box-shadow:0 -2px 8px -4px #00000017;border-top:1px solid var(--grid-outline-variant, #e0e0e0)}.search-option{padding:2px 4px!important;cursor:default!important;pointer-events:auto!important;width:100%!important;box-sizing:border-box!important;overflow:hidden!important}.search-option .mat-mdc-option{height:auto!important;padding:2px 4px!important;min-height:auto!important}.search-option .mat-mdc-option:hover{background:transparent!important}.search-option .mdc-list-item__primary-text{width:100%!important;max-width:100%!important;box-sizing:border-box!important;padding:0!important;margin:0!important;display:flex!important;flex-direction:column!important;gap:8px!important;opacity:1!important}.search-option .search-form-field{width:100%!important;max-width:100%!important;pointer-events:auto!important;box-sizing:border-box!important;margin:0!important}.search-option .search-form-field .mat-mdc-form-field-subscript-wrapper{display:none}.search-option .search-form-field .mat-mdc-text-field-wrapper{padding-bottom:0!important;width:100%!important;max-width:100%!important;box-sizing:border-box!important}.search-option .search-form-field .mat-mdc-form-field-infix{width:100%!important;max-width:100%!important;box-sizing:border-box!important;min-height:auto!important;padding:0!important}.search-option .search-form-field .mat-mdc-form-field-flex{width:100%!important;max-width:100%!important;box-sizing:border-box!important}.search-option .search-input{width:100%;border:none;outline:none;background:transparent;font-size:var(--cell-font-size, var(--grid-font-size-body, 12px))!important;padding:8px 0}.search-option .select-all-container{padding:4px 0!important;min-height:auto!important;display:flex!important;align-items:center!important;pointer-events:auto!important;cursor:pointer!important;background:transparent!important}.search-option .select-all-container:hover{background:var(--grid-row-hover, rgba(0, 0, 0, .04))!important}.search-option .select-all-container .select-all-text{display:inline-flex!important;flex-direction:row!important;align-items:center!important;width:auto!important;max-width:none!important;gap:0!important;font-family:var(--grid-font-family, \"Poppins\")!important;font-size:var(--cell-font-size, var(--grid-font-size-body, 12px))!important;font-weight:var(--cell-font-weight, 500)!important;color:var(--grid-on-surface, #1d1b20)!important}.search-option .select-all-container.select-all-partial .select-all-text:before,.search-option .select-all-container.select-all-partial .select-all-checkbox{opacity:.5}.tag-panel-footer{position:absolute;bottom:0;left:0;right:0;background:#fff;border-top:1px solid rgba(0,0,0,.12);padding:8px;z-index:10;box-shadow:0 -2px 4px #0000001a}.tag-panel-footer .add-tag-container{display:flex;align-items:center;gap:8px;width:100%;pointer-events:auto}.tag-panel-footer .add-tag-form-field-wrapper{flex:1;min-width:0;position:relative}.tag-panel-footer .new-tag-input{width:100%;border:1px solid rgba(0,0,0,.38);border-radius:4px;outline:none;background:transparent;font-size:var(--cell-font-size, var(--grid-font-size-body, 12px))!important;padding:8px 12px;font-family:var(--grid-font-family, \"Poppins\")!important;box-sizing:border-box;cursor:text}.tag-panel-footer .new-tag-input:focus{border-color:var(--grid-primary, #6750a4);border-width:2px}.tag-panel-footer .add-tag-button{flex-shrink:0;font-size:var(--cell-font-size, var(--grid-font-size-body, 12px))!important;padding:8px 16px!important;min-width:auto!important;pointer-events:auto!important;background-color:var(--grid-primary, #6750a4);color:#fff;border:none;border-radius:4px;cursor:pointer;font-family:var(--grid-font-family, \"Poppins\")!important}.tag-panel-footer .add-tag-button:hover:not([disabled]){opacity:.9}.tag-panel-footer .add-tag-button[disabled]{opacity:.5;cursor:not-allowed}.cdk-overlay-pane.tag-panel-overlay{position:relative;padding-bottom:60px!important}.cdk-overlay-pane.tag-panel-overlay .mat-mdc-select-panel{max-height:calc(100% - 60px)!important}.add-tag-option{position:sticky!important;background:var(--grid-surface, #fff)!important;bottom:-10px!important;z-index:10!important;padding:8px 8px 10px!important;margin-top:auto!important;margin-bottom:0!important;box-shadow:0 -2px 8px #00000026!important;border-top:1px solid rgba(0,0,0,.12)!important}.add-tag-option:hover{background:var(--grid-surface, #fff)!important}.add-tag-option .mat-mdc-option{min-height:auto!important;padding:0!important;height:auto!important}.add-tag-option .mat-mdc-option:hover{background:var(--grid-surface, #fff)!important}.add-tag-option .mdc-list-item__primary-text{width:100%!important;padding:0!important;margin:0!important}.add-tag-option .add-tag-container{display:flex;align-items:center;gap:8px;width:100%;padding:0;margin-bottom:0}.add-tag-option .add-tag-form-field{flex:1;min-width:0}.add-tag-option .add-tag-form-field .mat-mdc-form-field-focus-overlay{background:transparent!important}.add-tag-option .add-tag-form-field .mdc-notched-outline__leading,.add-tag-option .add-tag-form-field .mdc-notched-outline__notch,.add-tag-option .add-tag-form-field .mdc-notched-outline__trailing{border-color:var(--grid-outline-variant, #cac4d0)!important;border-width:1px!important}.add-tag-option .add-tag-form-field.mat-focused .mdc-notched-outline__leading,.add-tag-option .add-tag-form-field.mat-focused .mdc-notched-outline__notch,.add-tag-option .add-tag-form-field.mat-focused .mdc-notched-outline__trailing{border-color:var(--grid-outline, #79747e)!important}.add-tag-option .add-tag-form-field .mdc-floating-label,.add-tag-option .add-tag-form-field label{color:var(--grid-on-surface-variant, #49454f)!important}.add-tag-option .add-tag-form-field .mat-mdc-form-field-subscript-wrapper{display:none}.add-tag-option .add-tag-form-field .mat-mdc-text-field-wrapper{background:transparent!important;padding-bottom:0!important;width:100%!important;max-width:100%!important;box-sizing:border-box!important}.add-tag-option .add-tag-form-field .mat-mdc-form-field-infix{min-height:auto!important;padding:0!important;width:100%!important;max-width:100%!important;box-sizing:border-box!important}.add-tag-option .add-tag-form-field .mat-mdc-form-field-flex{width:100%!important;max-width:100%!important;box-sizing:border-box!important}.add-tag-option .add-tag-input{width:100%;border:none;outline:none;background:transparent;font-size:var(--cell-font-size, var(--grid-font-size-body, 12px))!important;padding:8px 0}.add-tag-option .add-tag-actions{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;flex-shrink:0}.add-tag-option .add-tag-color-picker{flex-shrink:0;width:20px;height:20px;border:1px solid rgba(0,0,0,.12);border-radius:4px;cursor:pointer;padding:2px;background:transparent;box-sizing:border-box;margin:0 auto}.add-tag-option .add-tag-color-picker::-webkit-color-swatch-wrapper{padding:0}.add-tag-option .add-tag-color-picker::-webkit-color-swatch{border:none;border-radius:2px}.add-tag-option .add-tag-color-picker::-moz-color-swatch{border:none;border-radius:2px}.add-tag-option .add-tag-color-picker:hover{border-color:var(--grid-primary, #6750a4)}.add-tag-option .add-tag-color-picker:focus{outline:2px solid var(--grid-primary, #6750a4);outline-offset:2px}.add-tag-option .add-tag-button{flex-shrink:0;width:20px;height:20px;color:var(--grid-primary, #6750a4)!important;display:flex!important;align-items:center!important;justify-content:center!important;margin:0 auto}.add-tag-option .add-tag-button:not([disabled]){color:var(--grid-primary, #6750a4)!important}.add-tag-option .add-tag-button:not([disabled]):hover{background-color:#6750a414!important}.add-tag-option .add-tag-button[disabled]{opacity:.38;color:#00000061!important}.add-tag-option .add-tag-button mat-icon{font-size:var(--cell-font-size, 24px);width:24px;height:24px;line-height:24px;display:flex;align-items:center;justify-content:center;margin-right:0}.tag-panel .search-option>mat-pseudo-checkbox,.tag-panel .search-option>.mat-mdc-option-pseudo-checkbox,.tag-panel .add-tag-option>mat-pseudo-checkbox,.tag-panel .add-tag-option>.mat-mdc-option-pseudo-checkbox{display:none!important}.tag-panel{min-width:200px!important}.tag-panel .search-option .mat-mdc-option,.mat-mdc-select-panel .search-option .mat-mdc-option{min-height:auto!important;padding:2px 4px!important}.tag-panel .mdc-list-item--disabled,.mat-mdc-select-panel .mdc-list-item--disabled{pointer-events:auto!important;cursor:default!important}.tag-panel .mdc-list-item--disabled:hover,.mat-mdc-select-panel .mdc-list-item--disabled:hover{background:transparent!important}mat-option .mdc-list-item__primary-text{line-height:1.5!important;white-space:normal!important;display:flex!important;align-items:center!important}mat-option .tag-option{display:inline-flex;align-items:center;gap:var(--grid-tag-dot-gap, 5px);padding:4px 8px;border-radius:12px;font-size:var(--cell-font-size, var(--grid-font-size-body, 12px));font-weight:var(--cell-font-weight, 500);white-space:nowrap;line-height:1.2}.tag-form-field .mat-mdc-select-value-text{overflow:visible;text-overflow:clip}.tag-display eru-chip-list{display:block;min-width:0}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i2$3.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i2$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatPseudoCheckboxModule }, { kind: "component", type: i1$1.MatPseudoCheckbox, selector: "mat-pseudo-checkbox", inputs: ["state", "disabled", "appearance"] }, { kind: "ngmodule", type: MatChipsModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: ChipListComponent, selector: "eru-chip-list", inputs: ["labels", "chips", "compact", "availableWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.2", type: TagComponent, isStandalone: true, selector: "eru-tag", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, isEditable: { classPropertyName: "isEditable", publicName: "isEditable", isSignal: true, isRequired: false, transformFunction: null }, isActive: { classPropertyName: "isActive", publicName: "isActive", isSignal: true, isRequired: false, transformFunction: null }, isDrillable: { classPropertyName: "isDrillable", publicName: "isDrillable", isSignal: true, isRequired: false, transformFunction: null }, columnWidth: { classPropertyName: "columnWidth", publicName: "columnWidth", isSignal: true, isRequired: false, transformFunction: null }, fieldSize: { classPropertyName: "fieldSize", publicName: "fieldSize", isSignal: true, isRequired: false, transformFunction: null }, eruGridStore: { classPropertyName: "eruGridStore", publicName: "eruGridStore", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange", blur: "blur", focus: "focus", drilldownClick: "drilldownClick", editModeChange: "editModeChange", newTagAdded: "newTagAdded" }, viewQueries: [{ propertyName: "selectContainer", first: true, predicate: ["selectContainer"], descendants: true }], ngImport: i0, template: "@if(isActive()) {\n  <mat-form-field \n    [appearance]=\"getProperty('appearance') || 'outline'\"\n    class=\"tag-form-field\"\n    (click)=\"$event.stopPropagation()\"\n    (mousedown)=\"$event.stopPropagation()\">\n    <div #selectContainer class=\"tag-container\">\n      <mat-select\n        [placeholder]=\"getProperty('placeholder') || ''\"\n        [multiple]=\"true\"\n        [disabled]=\"getProperty('disabled') || !isEditable()\"\n        [required]=\"hasRequiredValidation()\"\n        [value]=\"currentValue()\"\n        [compareWith]=\"compareWith\"\n        panelClass=\"tag-panel\"\n        (selectionChange)=\"onValueChange($event.value)\"\n        (blur)=\"onBlur($event)\"\n        (openedChange)=\"onOpenedChange($event)\"\n        (click)=\"$event.stopPropagation()\">\n      <!-- Material's own custom-trigger hook (MatSelectTrigger), so the closed\n           control shows the same coloured chip row as view mode instead of\n           mat-select's comma-joined text. Nothing about mat-select's own\n           behaviour is replaced. -->\n      <!-- Unconditional: `customTrigger` is a content query, and gating the\n           element behind an @if leaves it unresolved on the pass that matters.\n           mat-select renders its placeholder while the value is empty, so an\n           always-present trigger costs nothing. -->\n      <mat-select-trigger>\n        <eru-chip-list [chips]=\"tagChips()\" [compact]=\"true\"></eru-chip-list>\n      </mat-select-trigger>\n        \n        <mat-option disabled class=\"search-option\"\n          (click)=\"$event.stopPropagation(); $event.preventDefault()\"\n          (mousedown)=\"$event.stopPropagation(); $event.preventDefault()\">\n          @if (isSearchable()) {\n            <mat-form-field\n              [appearance]=\"getProperty('appearance') || 'outline'\"\n              class=\"search-form-field\">\n              <mat-label>Search</mat-label>\n              <input\n                matInput\n                type=\"text\"\n                class=\"search-input\"\n                [value]=\"searchText()\"\n                (input)=\"onSearchChange($any($event.target).value)\"\n                (click)=\"$event.stopPropagation()\"\n                (mousedown)=\"$event.stopPropagation()\"\n                (keydown)=\"$event.stopPropagation()\"\n                (focus)=\"$event.stopPropagation()\">\n            </mat-form-field>\n          }\n          <div class=\"select-all-container mat-mdc-option mdc-list-item\"\n            [class.mdc-list-item--selected]=\"isAllSelected() || isIndeterminate()\"\n            [class.select-all-partial]=\"isIndeterminate()\"\n            (click)=\"toggleSelectAll(!isAllSelected()); $event.stopPropagation(); $event.preventDefault()\"\n            (mousedown)=\"$event.stopPropagation(); $event.preventDefault()\">\n            <mat-pseudo-checkbox\n              class=\"mat-mdc-option-pseudo-checkbox select-all-checkbox\"\n              [state]=\"isIndeterminate() ? 'indeterminate' : (isAllSelected() ? 'checked' : 'unchecked')\"></mat-pseudo-checkbox>\n            <span class=\"mdc-list-item__primary-text select-all-text\">Select All</span>\n          </div>\n        </mat-option>\n\n        @for (option of filteredOptions(); track trackByValueAndIndex($index, option)) {\n          <mat-option [value]=\"option.value\" \n            (mousedown)=\"$event.stopPropagation(); $event.preventDefault()\" \n            (click)=\"$event.stopPropagation(); $event.preventDefault()\">\n            <span class=\"tag-option\" \n              [style.background]=\"getTagColor(option.value).background\" \n              [style.color]=\"getTagColor(option.value).text\">\n              <span class=\"tag-dot\" [style.background]=\"getTagColor(option.value).dot\"></span>\n              {{ option.label }}\n            </span>\n          </mat-option>\n        }\n\n        <mat-option class=\"add-tag-option\"\n          (click)=\"$event.stopPropagation(); $event.preventDefault()\"\n          (mousedown)=\"$event.stopPropagation(); $event.preventDefault()\">\n          <div class=\"add-tag-container\" (click)=\"$event.stopPropagation()\">\n            <mat-form-field\n              [appearance]=\"getProperty('appearance') || 'outline'\"\n              class=\"add-tag-form-field\">\n              <mat-label>Add new tag</mat-label>\n              <input\n                matInput\n                type=\"text\"\n                class=\"add-tag-input\"\n                [value]=\"newTagInput()\"\n                (input)=\"onNewTagInputChange($any($event.target).value)\"\n                (keydown.enter)=\"addNewTag()\"\n                (click)=\"$event.stopPropagation()\"\n                (mousedown)=\"$event.stopPropagation()\"\n                (keydown)=\"$event.stopPropagation()\"\n                (focus)=\"$event.stopPropagation()\">\n            </mat-form-field>\n            <div class=\"add-tag-actions\">\n              <input\n                type=\"color\"\n                class=\"add-tag-color-picker\"\n                [value]=\"newTagColor()\"\n                (input)=\"onNewTagColorChange($any($event.target).value)\"\n                (click)=\"$event.stopPropagation()\"\n                (mousedown)=\"$event.stopPropagation()\"\n                title=\"Select tag color\">\n              <button\n                mat-icon-button\n                class=\"add-tag-button\"\n                [disabled]=\"!canAddNewTag()\"\n                (click)=\"addNewTag(); $event.stopPropagation()\"\n                (mousedown)=\"$event.stopPropagation()\">\n                <mat-icon>add</mat-icon>\n              </button>\n            </div>\n          </div>\n        </mat-option>\n\n      </mat-select>\n    </div>\n  </mat-form-field>\n} @else {\n  <div \n    class=\"tag-display\" \n    [class.tag-display-editable]=\"isEditable()\"\n    (dblclick)=\"onActivate()\">\n    @if (isDrillable()) {\n      <span class=\"drillable-value\" (click)=\"onDrillableClick($event)\">\n        <eru-chip-list [chips]=\"tagChips()\" [compact]=\"true\" [availableWidth]=\"columnWidth()\"></eru-chip-list>\n      </span>\n    } @else {\n      <eru-chip-list [chips]=\"tagChips()\" [compact]=\"true\" [availableWidth]=\"columnWidth()\"></eru-chip-list>\n    }\n  </div>\n}\n\n", styles: [".tag-form-field{width:100%}.tag-form-field .mat-mdc-form-field-subscript-wrapper{display:none}.tag-container{width:100%}.tag-display{width:100%;padding:8px 12px;min-height:30px;display:flex;flex-wrap:wrap;align-items:center;gap:4px;cursor:default}.tag-display.tag-display-editable{cursor:pointer}.tag-display.tag-display-editable:hover{background-color:#0000000a}.tag{display:inline-flex;align-items:center;gap:var(--grid-tag-dot-gap, 5px);padding:var(--grid-pill-padding-y, 3px) var(--grid-pill-padding-x, 10px);border-radius:var(--grid-pill-radius, 12px);font-size:var(--cell-font-size, var(--grid-pill-font-size, var(--grid-font-size-body, 12px)));font-weight:var(--cell-font-weight, var(--grid-pill-font-weight, 500));white-space:nowrap;line-height:1.2}.tag-dot{flex:0 0 auto;width:var(--grid-tag-dot-size, 6px);height:var(--grid-tag-dot-size, 6px);border-radius:50%}.tag-more{display:inline-block;border-radius:var(--grid-pill-radius, 12px);background-color:var(--grid-surface-container-high, #f5f5f5);color:var(--grid-on-surface-variant, #49454f);font-size:var(--cell-font-size, var(--grid-pill-font-size, var(--grid-font-size-body, 12px)));font-weight:var(--cell-font-weight, var(--grid-pill-font-weight, 700));font-style:italic;padding:var(--grid-pill-padding-y, 3px) var(--grid-pill-padding-x, 10px);white-space:nowrap;line-height:1.2}.drillable-value{display:flex;flex-wrap:wrap;gap:4px;align-items:center;cursor:pointer}.drillable-value .tag{text-decoration:underline}.add-option{position:sticky;position:-webkit-sticky;bottom:0;z-index:3;background:var(--grid-surface-container-high, #fff);box-shadow:0 -2px 8px -4px #00000017;border-top:1px solid var(--grid-outline-variant, #e0e0e0)}.search-option{padding:2px 4px!important;cursor:default!important;pointer-events:auto!important;width:100%!important;box-sizing:border-box!important;overflow:hidden!important}.search-option .mat-mdc-option{height:auto!important;padding:2px 4px!important;min-height:auto!important}.search-option .mat-mdc-option:hover{background:transparent!important}.search-option .mdc-list-item__primary-text{width:100%!important;max-width:100%!important;box-sizing:border-box!important;padding:0!important;margin:0!important;display:flex!important;flex-direction:column!important;gap:8px!important;opacity:1!important}.search-option .search-form-field{width:100%!important;max-width:100%!important;pointer-events:auto!important;box-sizing:border-box!important;margin:0!important}.search-option .search-form-field .mat-mdc-form-field-subscript-wrapper{display:none}.search-option .search-form-field .mat-mdc-text-field-wrapper{padding-bottom:0!important;width:100%!important;max-width:100%!important;box-sizing:border-box!important}.search-option .search-form-field .mat-mdc-form-field-infix{width:100%!important;max-width:100%!important;box-sizing:border-box!important;min-height:auto!important;padding:0!important}.search-option .search-form-field .mat-mdc-form-field-flex{width:100%!important;max-width:100%!important;box-sizing:border-box!important}.search-option .search-input{width:100%;border:none;outline:none;background:transparent;font-size:var(--cell-font-size, var(--grid-font-size-body, 12px))!important;padding:8px 0}.search-option .select-all-container{padding:4px 0!important;min-height:auto!important;display:flex!important;align-items:center!important;pointer-events:auto!important;cursor:pointer!important;background:transparent!important}.search-option .select-all-container:hover{background:var(--grid-row-hover, rgba(0, 0, 0, .04))!important}.search-option .select-all-container .select-all-text{display:inline-flex!important;flex-direction:row!important;align-items:center!important;width:auto!important;max-width:none!important;gap:0!important;font-family:var(--grid-font-family, \"Poppins\")!important;font-size:var(--cell-font-size, var(--grid-font-size-body, 12px))!important;font-weight:var(--cell-font-weight, 500)!important;color:var(--grid-on-surface, #1d1b20)!important}.search-option .select-all-container.select-all-partial .select-all-text:before,.search-option .select-all-container.select-all-partial .select-all-checkbox{opacity:.5}.tag-panel-footer{position:absolute;bottom:0;left:0;right:0;background:#fff;border-top:1px solid rgba(0,0,0,.12);padding:8px;z-index:10;box-shadow:0 -2px 4px #0000001a}.tag-panel-footer .add-tag-container{display:flex;align-items:center;gap:8px;width:100%;pointer-events:auto}.tag-panel-footer .add-tag-form-field-wrapper{flex:1;min-width:0;position:relative}.tag-panel-footer .new-tag-input{width:100%;border:1px solid rgba(0,0,0,.38);border-radius:4px;outline:none;background:transparent;font-size:var(--cell-font-size, var(--grid-font-size-body, 12px))!important;padding:8px 12px;font-family:var(--grid-font-family, \"Poppins\")!important;box-sizing:border-box;cursor:text}.tag-panel-footer .new-tag-input:focus{border-color:var(--grid-primary, #6750a4);border-width:2px}.tag-panel-footer .add-tag-button{flex-shrink:0;font-size:var(--cell-font-size, var(--grid-font-size-body, 12px))!important;padding:8px 16px!important;min-width:auto!important;pointer-events:auto!important;background-color:var(--grid-primary, #6750a4);color:#fff;border:none;border-radius:4px;cursor:pointer;font-family:var(--grid-font-family, \"Poppins\")!important}.tag-panel-footer .add-tag-button:hover:not([disabled]){opacity:.9}.tag-panel-footer .add-tag-button[disabled]{opacity:.5;cursor:not-allowed}.cdk-overlay-pane.tag-panel-overlay{position:relative;padding-bottom:60px!important}.cdk-overlay-pane.tag-panel-overlay .mat-mdc-select-panel{max-height:calc(100% - 60px)!important}.add-tag-option{position:sticky!important;background:var(--grid-surface, #fff)!important;bottom:-10px!important;z-index:10!important;padding:8px 8px 10px!important;margin-top:auto!important;margin-bottom:0!important;box-shadow:0 -2px 8px #00000026!important;border-top:1px solid rgba(0,0,0,.12)!important}.add-tag-option:hover{background:var(--grid-surface, #fff)!important}.add-tag-option .mat-mdc-option{min-height:auto!important;padding:0!important;height:auto!important}.add-tag-option .mat-mdc-option:hover{background:var(--grid-surface, #fff)!important}.add-tag-option .mdc-list-item__primary-text{width:100%!important;padding:0!important;margin:0!important}.add-tag-option .add-tag-container{display:flex;align-items:center;gap:8px;width:100%;padding:0;margin-bottom:0}.add-tag-option .add-tag-form-field{flex:1;min-width:0}.add-tag-option .add-tag-form-field .mat-mdc-form-field-focus-overlay{background:transparent!important}.add-tag-option .add-tag-form-field .mdc-notched-outline__leading,.add-tag-option .add-tag-form-field .mdc-notched-outline__notch,.add-tag-option .add-tag-form-field .mdc-notched-outline__trailing{border-color:var(--grid-outline-variant, #cac4d0)!important;border-width:1px!important}.add-tag-option .add-tag-form-field.mat-focused .mdc-notched-outline__leading,.add-tag-option .add-tag-form-field.mat-focused .mdc-notched-outline__notch,.add-tag-option .add-tag-form-field.mat-focused .mdc-notched-outline__trailing{border-color:var(--grid-outline, #79747e)!important}.add-tag-option .add-tag-form-field .mdc-floating-label,.add-tag-option .add-tag-form-field label{color:var(--grid-on-surface-variant, #49454f)!important}.add-tag-option .add-tag-form-field .mat-mdc-form-field-subscript-wrapper{display:none}.add-tag-option .add-tag-form-field .mat-mdc-text-field-wrapper{background:transparent!important;padding-bottom:0!important;width:100%!important;max-width:100%!important;box-sizing:border-box!important}.add-tag-option .add-tag-form-field .mat-mdc-form-field-infix{min-height:auto!important;padding:0!important;width:100%!important;max-width:100%!important;box-sizing:border-box!important}.add-tag-option .add-tag-form-field .mat-mdc-form-field-flex{width:100%!important;max-width:100%!important;box-sizing:border-box!important}.add-tag-option .add-tag-input{width:100%;border:none;outline:none;background:transparent;font-size:var(--cell-font-size, var(--grid-font-size-body, 12px))!important;padding:8px 0}.add-tag-option .add-tag-actions{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;flex-shrink:0}.add-tag-option .add-tag-color-picker{flex-shrink:0;width:20px;height:20px;border:1px solid rgba(0,0,0,.12);border-radius:4px;cursor:pointer;padding:2px;background:transparent;box-sizing:border-box;margin:0 auto}.add-tag-option .add-tag-color-picker::-webkit-color-swatch-wrapper{padding:0}.add-tag-option .add-tag-color-picker::-webkit-color-swatch{border:none;border-radius:2px}.add-tag-option .add-tag-color-picker::-moz-color-swatch{border:none;border-radius:2px}.add-tag-option .add-tag-color-picker:hover{border-color:var(--grid-primary, #6750a4)}.add-tag-option .add-tag-color-picker:focus{outline:2px solid var(--grid-primary, #6750a4);outline-offset:2px}.add-tag-option .add-tag-button{flex-shrink:0;width:20px;height:20px;color:var(--grid-primary, #6750a4)!important;display:flex!important;align-items:center!important;justify-content:center!important;margin:0 auto}.add-tag-option .add-tag-button:not([disabled]){color:var(--grid-primary, #6750a4)!important}.add-tag-option .add-tag-button:not([disabled]):hover{background-color:#6750a414!important}.add-tag-option .add-tag-button[disabled]{opacity:.38;color:#00000061!important}.add-tag-option .add-tag-button mat-icon{font-size:var(--cell-font-size, 24px);width:24px;height:24px;line-height:24px;display:flex;align-items:center;justify-content:center;margin-right:0}.tag-panel .search-option>mat-pseudo-checkbox,.tag-panel .search-option>.mat-mdc-option-pseudo-checkbox,.tag-panel .add-tag-option>mat-pseudo-checkbox,.tag-panel .add-tag-option>.mat-mdc-option-pseudo-checkbox{display:none!important}.tag-panel{min-width:200px!important}.tag-panel .search-option .mat-mdc-option,.mat-mdc-select-panel .search-option .mat-mdc-option{min-height:auto!important;padding:2px 4px!important}.tag-panel .mdc-list-item--disabled,.mat-mdc-select-panel .mdc-list-item--disabled{pointer-events:auto!important;cursor:default!important}.tag-panel .mdc-list-item--disabled:hover,.mat-mdc-select-panel .mdc-list-item--disabled:hover{background:transparent!important}mat-option .mdc-list-item__primary-text{line-height:1.5!important;white-space:normal!important;display:flex!important;align-items:center!important}mat-option .tag-option{display:inline-flex;align-items:center;gap:var(--grid-tag-dot-gap, 5px);padding:4px 8px;border-radius:12px;font-size:var(--cell-font-size, var(--grid-font-size-body, 12px));font-weight:var(--cell-font-weight, 500);white-space:nowrap;line-height:1.2}.tag-form-field .mat-mdc-select-value-text{overflow:visible;text-overflow:clip}.tag-display eru-chip-list{display:block;min-width:0}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i2$3.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i2$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: MatPseudoCheckboxModule }, { kind: "component", type: i1$1.MatPseudoCheckbox, selector: "mat-pseudo-checkbox", inputs: ["state", "disabled", "appearance"] }, { kind: "ngmodule", type: MatChipsModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i1$2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2$2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: ChipListComponent, selector: "eru-chip-list", inputs: ["labels", "chips", "compact", "wrap", "availableWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.2", ngImport: i0, type: TagComponent, decorators: [{
             type: Component,