@nanahoshi/mona-ui 0.18.5 → 0.19.0

package/fesm2022/nanahoshi-mona-ui-filter.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Pipe, Injectable, inject, computed, signal, output, input, model, effect, untracked, Component } from '@angular/core';
+import { Pipe, inject, Injectable, computed, signal, output, input, model, effect, untracked, Component } from '@angular/core';
 import * as i1 from '@angular/forms';
 import { FormsModule } from '@angular/forms';
 import { ButtonDirective } from '@nanahoshi/mona-ui/button';
@@ -8,6 +8,7 @@ import { DatePickerComponent } from '@nanahoshi/mona-ui/date-picker';
 import { DropdownListComponent } from '@nanahoshi/mona-ui/dropdown-list';
 import { NumericTextBoxComponent } from '@nanahoshi/mona-ui/numeric-text-box';
 import { TextBoxComponent } from '@nanahoshi/mona-ui/text-box';
+import { MonaI18nService } from '@nanahoshi/mona-ui/i18n';
 import { cva } from 'class-variance-authority';
 import { themeOverlaySurfaceClasses } from '@nanahoshi/mona-ui/internal';
 
@@ -55,48 +56,89 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImpor
                 }]
         }] });
 
+const FILTER_DEFAULT_MESSAGES = {
+    and: "AND",
+    apply: "Apply",
+    clear: "Clear",
+    contains: "Contains",
+    doesNotContain: "Does not contain",
+    endsWith: "Ends with",
+    isAfter: "Is after",
+    isAfterOrEqualTo: "Is after or equal to",
+    isBefore: "Is before",
+    isBeforeOrEqualTo: "Is before or equal to",
+    isEmpty: "Is empty",
+    isEqualTo: "Is equal to",
+    isFalse: "Is false",
+    isGreaterThan: "Is greater than",
+    isGreaterThanOrEqualTo: "Is greater than or equal to",
+    isLessThan: "Is less than",
+    isLessThanOrEqualTo: "Is less than or equal to",
+    isNotEmpty: "Is not empty",
+    isNotEqualTo: "Is not equal to",
+    isNotNull: "Is not null",
+    isNotNullOrEmpty: "Is not null or empty",
+    isNull: "Is null",
+    isNullOrEmpty: "Is null or empty",
+    isTrue: "Is true",
+    or: "OR",
+    startsWith: "Starts with"
+};
+
 class FilterService {
-    constructor() {
-        this.booleanFilterMenuItems = [
-            { text: "Is true", value: "istrue" },
-            { text: "Is false", value: "isfalse" },
-            { text: "Is null", value: "isnull" },
-            { text: "Is not null", value: "isnotnull" }
+    #i18n = inject(MonaI18nService);
+    #messages = this.#i18n.componentMessages("filter", FILTER_DEFAULT_MESSAGES);
+    get booleanFilterMenuItems() {
+        const m = this.#messages();
+        return [
+            { text: m.isTrue, value: "istrue" },
+            { text: m.isFalse, value: "isfalse" },
+            { text: m.isNull, value: "isnull" },
+            { text: m.isNotNull, value: "isnotnull" }
         ];
-        this.dateFilterMenuItems = [
-            { text: "Is equal to", value: "eq" },
-            { text: "Is not equal to", value: "neq" },
-            { text: "Is after", value: "gt" },
-            { text: "Is after or equal to", value: "gte" },
-            { text: "Is before", value: "lt" },
-            { text: "Is before or equal to", value: "lte" },
-            { text: "Is null", value: "isnull" },
-            { text: "Is not null", value: "isnotnull" }
+    }
+    get dateFilterMenuItems() {
+        const m = this.#messages();
+        return [
+            { text: m.isEqualTo, value: "eq" },
+            { text: m.isNotEqualTo, value: "neq" },
+            { text: m.isAfter, value: "gt" },
+            { text: m.isAfterOrEqualTo, value: "gte" },
+            { text: m.isBefore, value: "lt" },
+            { text: m.isBeforeOrEqualTo, value: "lte" },
+            { text: m.isNull, value: "isnull" },
+            { text: m.isNotNull, value: "isnotnull" }
         ];
-        // TODO: Add null and empty filter operators
-        this.numericFilterMenuItems = [
-            { text: "Is equal to", value: "eq" },
-            { text: "Is not equal to", value: "neq" },
-            { text: "Is greater than", value: "gt" },
-            { text: "Is greater than or equal to", value: "gte" },
-            { text: "Is less than", value: "lt" },
-            { text: "Is less than or equal to", value: "lte" },
-            { text: "Is null", value: "isnull" },
-            { text: "Is not null", value: "isnotnull" }
+    }
+    // TODO: Add null and empty filter operators
+    get numericFilterMenuItems() {
+        const m = this.#messages();
+        return [
+            { text: m.isEqualTo, value: "eq" },
+            { text: m.isNotEqualTo, value: "neq" },
+            { text: m.isGreaterThan, value: "gt" },
+            { text: m.isGreaterThanOrEqualTo, value: "gte" },
+            { text: m.isLessThan, value: "lt" },
+            { text: m.isLessThanOrEqualTo, value: "lte" },
+            { text: m.isNull, value: "isnull" },
+            { text: m.isNotNull, value: "isnotnull" }
         ];
-        this.stringFilterMenuItems = [
-            { text: "Contains", value: "contains" },
-            { text: "Does not contain", value: "doesnotcontain" },
-            { text: "Ends with", value: "endswith" },
-            { text: "Starts with", value: "startswith" },
-            { text: "Is equal to", value: "eq" },
-            { text: "Is not equal to", value: "neq" },
-            { text: "Is empty", value: "isempty" },
-            { text: "Is not empty", value: "isnotempty" },
-            { text: "Is null", value: "isnull" },
-            { text: "Is not null", value: "isnotnull" },
-            { text: "Is null or empty", value: "isnullorempty" },
-            { text: "Is not null or empty", value: "isnotnullorempty" }
+    }
+    get stringFilterMenuItems() {
+        const m = this.#messages();
+        return [
+            { text: m.contains, value: "contains" },
+            { text: m.doesNotContain, value: "doesnotcontain" },
+            { text: m.endsWith, value: "endswith" },
+            { text: m.startsWith, value: "startswith" },
+            { text: m.isEqualTo, value: "eq" },
+            { text: m.isNotEqualTo, value: "neq" },
+            { text: m.isEmpty, value: "isempty" },
+            { text: m.isNotEmpty, value: "isnotempty" },
+            { text: m.isNull, value: "isnull" },
+            { text: m.isNotNull, value: "isnotnull" },
+            { text: m.isNullOrEmpty, value: "isnullorempty" },
+            { text: m.isNotNullOrEmpty, value: "isnotnullorempty" }
         ];
     }
     buildBooleanFilterDescriptor(args) {
@@ -252,9 +294,12 @@ const filterMenuActionsThemeVariants = cva(`
 class FilterMenuComponent {
     #booleanFilterValues;
     #filterService;
+    #i18n;
     constructor() {
         this.#booleanFilterValues = [null, null];
         this.#filterService = inject(FilterService);
+        this.#i18n = inject(MonaI18nService);
+        this.messages = this.#i18n.componentMessages("filter", FILTER_DEFAULT_MESSAGES);
         this.applyDisabled = computed(() => {
             if (!this.firstFilterValid()) {
                 return true;
@@ -266,12 +311,15 @@ class FilterMenuComponent {
             return filterMenuBaseThemeVariants();
         }, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "baseClass" }] : /* istanbul ignore next */ []));
-        this.booleanFilterMenuDataItems = this.#filterService.booleanFilterMenuItems;
-        this.connectorDataItems = [
-            { text: "AND", value: "and" },
-            { text: "OR", value: "or" }
-        ];
-        this.dateFilterMenuDataItems = this.#filterService.dateFilterMenuItems;
+        this.booleanFilterMenuDataItems = computed(() => this.#filterService.booleanFilterMenuItems, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "booleanFilterMenuDataItems" }] : /* istanbul ignore next */ []));
+        this.connectorDataItems = computed(() => [
+            { text: this.messages().and, value: "and" },
+            { text: this.messages().or, value: "or" }
+        ], /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "connectorDataItems" }] : /* istanbul ignore next */ []));
+        this.dateFilterMenuDataItems = computed(() => this.#filterService.dateFilterMenuItems, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "dateFilterMenuDataItems" }] : /* istanbul ignore next */ []));
         this.dateFilterValues = signal([null, null], /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "dateFilterValues" }] : /* istanbul ignore next */ []));
         this.effectiveDateOptions = computed(() => {
@@ -331,7 +379,8 @@ class FilterMenuComponent {
         ...(ngDevMode ? [{ debugName: "firstFilterValid" }] : /* istanbul ignore next */ []));
         this.numberFilterValues = signal([null, null], /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "numberFilterValues" }] : /* istanbul ignore next */ []));
-        this.numericFilterMenuDataItems = this.#filterService.numericFilterMenuItems;
+        this.numericFilterMenuDataItems = computed(() => this.#filterService.numericFilterMenuItems, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "numericFilterMenuDataItems" }] : /* istanbul ignore next */ []));
         this.secondFilterValid = computed(() => {
             const operator = this.selectedFilterMenuDataItemList()[1]?.value;
             const type = this.type();
@@ -371,7 +420,8 @@ class FilterMenuComponent {
             undefined
         ], /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "selectedFilterMenuDataItemList" }] : /* istanbul ignore next */ []));
-        this.stringFilterMenuDataItems = this.#filterService.stringFilterMenuItems;
+        this.stringFilterMenuDataItems = computed(() => this.#filterService.stringFilterMenuItems, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "stringFilterMenuDataItems" }] : /* istanbul ignore next */ []));
         this.stringFilterValues = signal(["", ""], /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "stringFilterValues" }] : /* istanbul ignore next */ []));
         this.apply = output();
@@ -400,6 +450,39 @@ class FilterMenuComponent {
                 });
             }
         });
+        effect(() => {
+            this.messages();
+            untracked(() => {
+                const current = this.selectedFilterMenuDataItemList();
+                let items = [];
+                switch (this.type()) {
+                    case "string":
+                        items = this.stringFilterMenuDataItems();
+                        break;
+                    case "number":
+                        items = this.numericFilterMenuDataItems();
+                        break;
+                    case "date":
+                        items = this.dateFilterMenuDataItems();
+                        break;
+                    case "boolean":
+                        items = this.booleanFilterMenuDataItems();
+                        break;
+                }
+                const newFirst = current[0] ? items.find(i => i.value === current[0].value) : undefined;
+                const newSecond = current[1] ? items.find(i => i.value === current[1].value) : undefined;
+                if (newFirst !== current[0] || newSecond !== current[1]) {
+                    this.selectedFilterMenuDataItemList.set([newFirst, newSecond]);
+                }
+                const currentConnector = this.selectedConnectorItem();
+                if (currentConnector) {
+                    const newConnector = this.connectorDataItems().find(c => c.value === currentConnector.value) ?? null;
+                    if (newConnector && newConnector.text !== currentConnector.text) {
+                        this.selectedConnectorItem.set(newConnector);
+                    }
+                }
+            });
+        });
     }
     onConnectorChange(item, selected) {
         if (selected) {
@@ -563,17 +646,17 @@ class FilterMenuComponent {
         let filterValues;
         switch (this.type()) {
             case "string":
-                filterMenuDataItems = this.stringFilterMenuDataItems;
+                filterMenuDataItems = this.stringFilterMenuDataItems();
                 filterValues = [values.value1 ?? "", values.value2 ?? ""];
                 break;
             case "number":
-                filterMenuDataItems = this.numericFilterMenuDataItems;
+                filterMenuDataItems = this.numericFilterMenuDataItems();
                 filterValues = [values.value1 ?? null, values.value2 ?? null];
                 break;
             case "date":
             case "boolean":
                 filterMenuDataItems =
-                    this.type() !== "boolean" ? this.dateFilterMenuDataItems : this.booleanFilterMenuDataItems;
+                    this.type() !== "boolean" ? this.dateFilterMenuDataItems() : this.booleanFilterMenuDataItems();
                 filterValues = [values.value1 ?? null, values.value2 ?? null];
                 break;
             default:
@@ -602,7 +685,7 @@ class FilterMenuComponent {
                 break;
         }
         const selectedConnectorItem = values.operator2 && values.logic
-            ? (this.connectorDataItems.find(c => c.value === values.logic) ?? null)
+            ? (this.connectorDataItems().find(c => c.value === values.logic) ?? null)
             : null;
         this.selectedConnectorItem.set(selectedConnectorItem);
     }
@@ -619,7 +702,7 @@ class FilterMenuComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: FilterMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: FilterMenuComponent, isStandalone: true, selector: "mona-filter-menu", inputs: { dateOptions: { classPropertyName: "dateOptions", publicName: "dateOptions", isSignal: true, isRequired: false, transformFunction: null }, field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: false, transformFunction: null }, operators: { classPropertyName: "operators", publicName: "operators", isSignal: true, isRequired: false, transformFunction: null }, rounded: { classPropertyName: "rounded", publicName: "rounded", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { apply: "apply", field: "fieldChange", operators: "operatorsChange", type: "typeChange", value: "valueChange" }, host: { properties: { "class": "baseClass()" } }, ngImport: i0, template: "<div [class]=\"filterMenuItemClass()\">\n    @if (type() === \"string\") {\n        <mona-dropdown-list\n            [data]=\"stringFilterMenuDataItems | operatorFilter: operators()\"\n            textField=\"text\"\n            valueField=\"value\"\n            [size]=\"size()\"\n            [rounded]=\"rounded()\"\n            [ngModel]=\"selectedFilterMenuDataItemList()[0]\"\n            (ngModelChange)=\"onFilterOperatorChange(0, $event)\"></mona-dropdown-list>\n        <mona-text-box\n            [ngModel]=\"stringFilterValues()[0]\"\n            (ngModelChange)=\"stringFilterValues.set([$event, stringFilterValues()[1]])\"\n            [size]=\"size()\"\n            [disabled]=\"selectedFilterMenuDataItemList()[0]?.value | valuelessOperator\"></mona-text-box>\n    }\n\n    @if (type() === \"number\") {\n        <mona-dropdown-list\n            [data]=\"numericFilterMenuDataItems | operatorFilter: operators()\"\n            textField=\"text\"\n            valueField=\"value\"\n            [size]=\"size()\"\n            [rounded]=\"rounded()\"\n            [ngModel]=\"selectedFilterMenuDataItemList()[0]\"\n            (ngModelChange)=\"onFilterOperatorChange(0, $event)\"></mona-dropdown-list>\n        <mona-numeric-text-box\n            [ngModel]=\"numberFilterValues()[0]\"\n            (ngModelChange)=\"numberFilterValues.set([$event, numberFilterValues()[1]])\"\n            [size]=\"size()\"\n            [rounded]=\"rounded()\"\n            [disabled]=\"selectedFilterMenuDataItemList()[0]?.value | valuelessOperator\"></mona-numeric-text-box>\n    }\n\n    @if (type() === \"date\") {\n        <mona-dropdown-list\n            [data]=\"dateFilterMenuDataItems | operatorFilter: operators()\"\n            textField=\"text\"\n            valueField=\"value\"\n            [size]=\"size()\"\n            [rounded]=\"rounded()\"\n            [ngModel]=\"selectedFilterMenuDataItemList()[0]\"\n            (ngModelChange)=\"onFilterOperatorChange(0, $event)\"></mona-dropdown-list>\n\n        @if (type() === \"date\") {\n            <mona-date-picker\n                [ngModel]=\"dateFilterValues()[0]\"\n                (ngModelChange)=\"dateFilterValues.set([$event, dateFilterValues()[1]])\"\n                [format]=\"effectiveDateOptions().format\"\n                [size]=\"size()\"\n                [rounded]=\"rounded()\"\n                [disabled]=\"selectedFilterMenuDataItemList()[0]?.value | valuelessOperator\"></mona-date-picker>\n        }\n    }\n\n    @if (type() === \"boolean\") {\n        <mona-dropdown-list\n            [data]=\"booleanFilterMenuDataItems | operatorFilter: operators()\"\n            textField=\"text\"\n            valueField=\"value\"\n            [ngModel]=\"selectedFilterMenuDataItemList()[0]\"\n            [size]=\"size()\"\n            [rounded]=\"rounded()\"\n            (ngModelChange)=\"onFilterOperatorChange(0, $event)\"></mona-dropdown-list>\n    }\n</div>\n@if (firstFilterValid()) {\n    <div [class]=\"filterMenuItemClass()\">\n        <mona-button-group selection=\"single\" [size]=\"size()\" [rounded]=\"rounded()\" [disabled]=\"!firstFilterValid()\">\n            @for (item of connectorDataItems; track item) {\n                <button\n                    monaButton\n                    [selected]=\"item.value === selectedConnectorItem()?.value\"\n                    (selectedChange)=\"onConnectorChange(item, $event)\">\n                    {{ item.text }}\n                </button>\n            }\n        </mona-button-group>\n    </div>\n}\n@if (!!selectedConnectorItem()) {\n    <div [class]=\"filterMenuItemClass()\">\n        @if (type() === \"string\") {\n            <mona-dropdown-list\n                [data]=\"stringFilterMenuDataItems | operatorFilter: operators()\"\n                textField=\"text\"\n                valueField=\"value\"\n                [size]=\"size()\"\n                [rounded]=\"rounded()\"\n                [ngModel]=\"selectedFilterMenuDataItemList()[1]\"\n                (ngModelChange)=\"onFilterOperatorChange(1, $event)\"></mona-dropdown-list>\n            <mona-text-box\n                [ngModel]=\"stringFilterValues()[1]\"\n                (ngModelChange)=\"stringFilterValues.set([stringFilterValues()[0], $event])\"\n                [disabled]=\"selectedFilterMenuDataItemList()[1]?.value | valuelessOperator\"></mona-text-box>\n        }\n\n        @if (type() === \"number\") {\n            <mona-dropdown-list\n                [data]=\"numericFilterMenuDataItems | operatorFilter: operators()\"\n                textField=\"text\"\n                valueField=\"value\"\n                [size]=\"size()\"\n                [rounded]=\"rounded()\"\n                [ngModel]=\"selectedFilterMenuDataItemList()[1]\"\n                (ngModelChange)=\"onFilterOperatorChange(1, $event)\"></mona-dropdown-list>\n\n            <mona-numeric-text-box\n                [size]=\"size()\"\n                [rounded]=\"rounded()\"\n                [ngModel]=\"numberFilterValues()[1]\"\n                (ngModelChange)=\"numberFilterValues.set([numberFilterValues()[0], $event])\"\n                [disabled]=\"selectedFilterMenuDataItemList()[1]?.value | valuelessOperator\"></mona-numeric-text-box>\n        }\n\n        @if (type() === \"date\") {\n            <mona-dropdown-list\n                [data]=\"dateFilterMenuDataItems | operatorFilter: operators()\"\n                textField=\"text\"\n                valueField=\"value\"\n                [size]=\"size()\"\n                [rounded]=\"rounded()\"\n                [ngModel]=\"selectedFilterMenuDataItemList()[1]\"\n                (ngModelChange)=\"onFilterOperatorChange(1, $event)\"></mona-dropdown-list>\n\n            @if (type() === \"date\") {\n                <mona-date-picker\n                    [ngModel]=\"dateFilterValues()[1]\"\n                    (ngModelChange)=\"dateFilterValues.set([dateFilterValues()[0], $event])\"\n                    [format]=\"effectiveDateOptions().format\"\n                    [size]=\"size()\"\n                    [rounded]=\"rounded()\"\n                    [disabled]=\"selectedFilterMenuDataItemList()[1]?.value | valuelessOperator\"></mona-date-picker>\n            }\n        }\n\n        @if (type() === \"boolean\") {\n            <mona-dropdown-list\n                [data]=\"booleanFilterMenuDataItems | operatorFilter: operators()\"\n                textField=\"text\"\n                valueField=\"value\"\n                [size]=\"size()\"\n                [rounded]=\"rounded()\"\n                [ngModel]=\"selectedFilterMenuDataItemList()[1]\"\n                (ngModelChange)=\"onFilterOperatorChange(1, $event)\"></mona-dropdown-list>\n        }\n    </div>\n}\n<div [class]=\"`${filterMenuItemClass()} ${filterMenuActionsClass()}`\">\n    <button\n        monaButton\n        (click)=\"onFilterApply()\"\n        [look]=\"'primary'\"\n        [size]=\"size()\"\n        [rounded]=\"rounded()\"\n        [disabled]=\"applyDisabled()\">\n        Apply\n    </button>\n    <button monaButton (click)=\"onFilterClear()\" [look]=\"'default'\" [size]=\"size()\" [rounded]=\"rounded()\">Clear</button>\n</div>\n", dependencies: [{ kind: "component", type: DropdownListComponent, selector: "mona-dropdown-list", inputs: ["aria-label", "aria-labelledby", "data", "disabled", "itemDisabled", "invalid", "loading", "placeholder", "popupClass", "popupHeight", "popupWidth", "readonly", "required", "rounded", "showClearButton", "size", "textField", "touched", "class", "valueField", "valuePrimitive", "value"], outputs: ["close", "closed", "disabledChange", "open", "opened", "touch", "valueChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: TextBoxComponent, selector: "mona-text-box", inputs: ["clearButton", "disabled", "inputAttributes", "inputClass", "inputStyle", "invalid", "placeholder", "readonly", "required", "rounded", "size", "touched", "type", "class", "value"], outputs: ["inputBlur", "inputFocus", "touch", "valueChange"] }, { kind: "component", type: NumericTextBoxComponent, selector: "mona-numeric-text-box", inputs: ["aria-label", "decimals", "disabled", "formatter", "maxValue", "minValue", "nullable", "readonly", "required", "invalid", "rounded", "size", "spinners", "step", "tabindex", "touched", "class", "value"], outputs: ["inputBlur", "inputFocus", "inputFocusOut", "touch", "valueChange"] }, { kind: "component", type: DatePickerComponent, selector: "mona-date-picker", inputs: ["disabled", "disabledDates", "firstDay", "format", "invalid", "max", "min", "placeholder", "popupClass", "popupHeight", "popupWidth", "readonly", "readonlyInput", "required", "rounded", "showClearButton", "size", "touched", "class", "value", "weekNumber"], outputs: ["close", "closed", "open", "opened", "touch", "valueChange"] }, { kind: "component", type: ButtonGroupComponent, selector: "mona-button-group", inputs: ["allowEmpty", "aria-label", "disabled", "look", "rounded", "selection", "size", "class"], outputs: ["buttonClick", "disabledChange", "selectionChange"] }, { kind: "directive", type: ButtonDirective, selector: "button[monaButton]", inputs: ["aria-haspopup", "disabled", "iconOnly", "loading", "look", "rounded", "selected", "size", "tabindex", "type", "toggleable", "class"], outputs: ["disabledChange", "loadingChange", "lookChange", "selectedChange"] }, { kind: "pipe", type: ValuelessOperatorPipe, name: "valuelessOperator" }, { kind: "pipe", type: OperatorFilterPipe, name: "operatorFilter" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.6", type: FilterMenuComponent, isStandalone: true, selector: "mona-filter-menu", inputs: { dateOptions: { classPropertyName: "dateOptions", publicName: "dateOptions", isSignal: true, isRequired: false, transformFunction: null }, field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: false, transformFunction: null }, operators: { classPropertyName: "operators", publicName: "operators", isSignal: true, isRequired: false, transformFunction: null }, rounded: { classPropertyName: "rounded", publicName: "rounded", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { apply: "apply", field: "fieldChange", operators: "operatorsChange", type: "typeChange", value: "valueChange" }, host: { properties: { "class": "baseClass()" } }, ngImport: i0, template: "<div [class]=\"filterMenuItemClass()\">\n    @if (type() === \"string\") {\n        <mona-dropdown-list\n            [data]=\"stringFilterMenuDataItems() | operatorFilter: operators()\"\n            textField=\"text\"\n            valueField=\"value\"\n            [size]=\"size()\"\n            [rounded]=\"rounded()\"\n            [ngModel]=\"selectedFilterMenuDataItemList()[0]\"\n            (ngModelChange)=\"onFilterOperatorChange(0, $event)\"></mona-dropdown-list>\n        <mona-text-box\n            [ngModel]=\"stringFilterValues()[0]\"\n            (ngModelChange)=\"stringFilterValues.set([$event, stringFilterValues()[1]])\"\n            [size]=\"size()\"\n            [disabled]=\"selectedFilterMenuDataItemList()[0]?.value | valuelessOperator\"></mona-text-box>\n    }\n\n    @if (type() === \"number\") {\n        <mona-dropdown-list\n            [data]=\"numericFilterMenuDataItems() | operatorFilter: operators()\"\n            textField=\"text\"\n            valueField=\"value\"\n            [size]=\"size()\"\n            [rounded]=\"rounded()\"\n            [ngModel]=\"selectedFilterMenuDataItemList()[0]\"\n            (ngModelChange)=\"onFilterOperatorChange(0, $event)\"></mona-dropdown-list>\n        <mona-numeric-text-box\n            [ngModel]=\"numberFilterValues()[0]\"\n            (ngModelChange)=\"numberFilterValues.set([$event, numberFilterValues()[1]])\"\n            [size]=\"size()\"\n            [rounded]=\"rounded()\"\n            [disabled]=\"selectedFilterMenuDataItemList()[0]?.value | valuelessOperator\"></mona-numeric-text-box>\n    }\n\n    @if (type() === \"date\") {\n        <mona-dropdown-list\n            [data]=\"dateFilterMenuDataItems() | operatorFilter: operators()\"\n            textField=\"text\"\n            valueField=\"value\"\n            [size]=\"size()\"\n            [rounded]=\"rounded()\"\n            [ngModel]=\"selectedFilterMenuDataItemList()[0]\"\n            (ngModelChange)=\"onFilterOperatorChange(0, $event)\"></mona-dropdown-list>\n\n        @if (type() === \"date\") {\n            <mona-date-picker\n                [ngModel]=\"dateFilterValues()[0]\"\n                (ngModelChange)=\"dateFilterValues.set([$event, dateFilterValues()[1]])\"\n                [format]=\"effectiveDateOptions().format\"\n                [size]=\"size()\"\n                [rounded]=\"rounded()\"\n                [disabled]=\"selectedFilterMenuDataItemList()[0]?.value | valuelessOperator\"></mona-date-picker>\n        }\n    }\n\n    @if (type() === \"boolean\") {\n        <mona-dropdown-list\n            [data]=\"booleanFilterMenuDataItems() | operatorFilter: operators()\"\n            textField=\"text\"\n            valueField=\"value\"\n            [ngModel]=\"selectedFilterMenuDataItemList()[0]\"\n            [size]=\"size()\"\n            [rounded]=\"rounded()\"\n            (ngModelChange)=\"onFilterOperatorChange(0, $event)\"></mona-dropdown-list>\n    }\n</div>\n@if (firstFilterValid()) {\n    <div [class]=\"filterMenuItemClass()\">\n        <mona-button-group selection=\"single\" [size]=\"size()\" [rounded]=\"rounded()\" [disabled]=\"!firstFilterValid()\">\n            @for (item of connectorDataItems(); track item.value) {\n                <button\n                    monaButton\n                    [selected]=\"item.value === selectedConnectorItem()?.value\"\n                    (selectedChange)=\"onConnectorChange(item, $event)\">\n                    {{ item.text }}\n                </button>\n            }\n        </mona-button-group>\n    </div>\n}\n@if (!!selectedConnectorItem()) {\n    <div [class]=\"filterMenuItemClass()\">\n        @if (type() === \"string\") {\n            <mona-dropdown-list\n                [data]=\"stringFilterMenuDataItems() | operatorFilter: operators()\"\n                textField=\"text\"\n                valueField=\"value\"\n                [size]=\"size()\"\n                [rounded]=\"rounded()\"\n                [ngModel]=\"selectedFilterMenuDataItemList()[1]\"\n                (ngModelChange)=\"onFilterOperatorChange(1, $event)\"></mona-dropdown-list>\n            <mona-text-box\n                [ngModel]=\"stringFilterValues()[1]\"\n                (ngModelChange)=\"stringFilterValues.set([stringFilterValues()[0], $event])\"\n                [disabled]=\"selectedFilterMenuDataItemList()[1]?.value | valuelessOperator\"></mona-text-box>\n        }\n\n        @if (type() === \"number\") {\n            <mona-dropdown-list\n                [data]=\"numericFilterMenuDataItems() | operatorFilter: operators()\"\n                textField=\"text\"\n                valueField=\"value\"\n                [size]=\"size()\"\n                [rounded]=\"rounded()\"\n                [ngModel]=\"selectedFilterMenuDataItemList()[1]\"\n                (ngModelChange)=\"onFilterOperatorChange(1, $event)\"></mona-dropdown-list>\n\n            <mona-numeric-text-box\n                [size]=\"size()\"\n                [rounded]=\"rounded()\"\n                [ngModel]=\"numberFilterValues()[1]\"\n                (ngModelChange)=\"numberFilterValues.set([numberFilterValues()[0], $event])\"\n                [disabled]=\"selectedFilterMenuDataItemList()[1]?.value | valuelessOperator\"></mona-numeric-text-box>\n        }\n\n        @if (type() === \"date\") {\n            <mona-dropdown-list\n                [data]=\"dateFilterMenuDataItems() | operatorFilter: operators()\"\n                textField=\"text\"\n                valueField=\"value\"\n                [size]=\"size()\"\n                [rounded]=\"rounded()\"\n                [ngModel]=\"selectedFilterMenuDataItemList()[1]\"\n                (ngModelChange)=\"onFilterOperatorChange(1, $event)\"></mona-dropdown-list>\n\n            @if (type() === \"date\") {\n                <mona-date-picker\n                    [ngModel]=\"dateFilterValues()[1]\"\n                    (ngModelChange)=\"dateFilterValues.set([dateFilterValues()[0], $event])\"\n                    [format]=\"effectiveDateOptions().format\"\n                    [size]=\"size()\"\n                    [rounded]=\"rounded()\"\n                    [disabled]=\"selectedFilterMenuDataItemList()[1]?.value | valuelessOperator\"></mona-date-picker>\n            }\n        }\n\n        @if (type() === \"boolean\") {\n            <mona-dropdown-list\n                [data]=\"booleanFilterMenuDataItems() | operatorFilter: operators()\"\n                textField=\"text\"\n                valueField=\"value\"\n                [size]=\"size()\"\n                [rounded]=\"rounded()\"\n                [ngModel]=\"selectedFilterMenuDataItemList()[1]\"\n                (ngModelChange)=\"onFilterOperatorChange(1, $event)\"></mona-dropdown-list>\n        }\n    </div>\n}\n<div [class]=\"`${filterMenuItemClass()} ${filterMenuActionsClass()}`\">\n    <button\n        monaButton\n        (click)=\"onFilterApply()\"\n        [look]=\"'primary'\"\n        [size]=\"size()\"\n        [rounded]=\"rounded()\"\n        [disabled]=\"applyDisabled()\">\n        {{ messages().apply }}\n    </button>\n    <button monaButton (click)=\"onFilterClear()\" [look]=\"'default'\" [size]=\"size()\" [rounded]=\"rounded()\">{{ messages().clear }}</button>\n</div>\n", dependencies: [{ kind: "component", type: DropdownListComponent, selector: "mona-dropdown-list", inputs: ["aria-label", "aria-labelledby", "data", "disabled", "itemDisabled", "invalid", "loading", "placeholder", "popupClass", "popupHeight", "popupWidth", "readonly", "required", "rounded", "showClearButton", "size", "textField", "touched", "class", "valueField", "valuePrimitive", "value"], outputs: ["close", "closed", "disabledChange", "open", "opened", "touch", "valueChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: TextBoxComponent, selector: "mona-text-box", inputs: ["clearButton", "disabled", "inputAttributes", "inputClass", "inputStyle", "invalid", "placeholder", "readonly", "required", "rounded", "size", "touched", "type", "class", "value"], outputs: ["inputBlur", "inputFocus", "touch", "valueChange"] }, { kind: "component", type: NumericTextBoxComponent, selector: "mona-numeric-text-box", inputs: ["aria-label", "decimals", "disabled", "formatter", "invalid", "maxValue", "minValue", "nullable", "readonly", "required", "rounded", "size", "spinners", "step", "tabindex", "touched", "class", "value"], outputs: ["inputBlur", "inputFocus", "inputFocusOut", "touch", "valueChange"] }, { kind: "component", type: DatePickerComponent, selector: "mona-date-picker", inputs: ["disabled", "disabledDates", "firstDay", "format", "invalid", "max", "min", "placeholder", "popupClass", "popupHeight", "popupWidth", "readonly", "readonlyInput", "required", "rounded", "showClearButton", "size", "touched", "class", "value", "weekNumber"], outputs: ["close", "closed", "open", "opened", "touch", "valueChange"] }, { kind: "component", type: ButtonGroupComponent, selector: "mona-button-group", inputs: ["allowEmpty", "aria-label", "disabled", "look", "rounded", "selection", "size", "class"], outputs: ["buttonClick", "disabledChange", "selectionChange"] }, { kind: "directive", type: ButtonDirective, selector: "button[monaButton]", inputs: ["aria-haspopup", "disabled", "iconOnly", "loading", "look", "rounded", "selected", "size", "tabindex", "type", "toggleable", "class"], outputs: ["disabledChange", "loadingChange", "lookChange", "selectedChange"] }, { kind: "pipe", type: ValuelessOperatorPipe, name: "valuelessOperator" }, { kind: "pipe", type: OperatorFilterPipe, name: "operatorFilter" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImport: i0, type: FilterMenuComponent, decorators: [{
             type: Component,
@@ -635,7 +718,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImpor
                         OperatorFilterPipe
                     ], host: {
                         "[class]": "baseClass()"
-                    }, template: "<div [class]=\"filterMenuItemClass()\">\n    @if (type() === \"string\") {\n        <mona-dropdown-list\n            [data]=\"stringFilterMenuDataItems | operatorFilter: operators()\"\n            textField=\"text\"\n            valueField=\"value\"\n            [size]=\"size()\"\n            [rounded]=\"rounded()\"\n            [ngModel]=\"selectedFilterMenuDataItemList()[0]\"\n            (ngModelChange)=\"onFilterOperatorChange(0, $event)\"></mona-dropdown-list>\n        <mona-text-box\n            [ngModel]=\"stringFilterValues()[0]\"\n            (ngModelChange)=\"stringFilterValues.set([$event, stringFilterValues()[1]])\"\n            [size]=\"size()\"\n            [disabled]=\"selectedFilterMenuDataItemList()[0]?.value | valuelessOperator\"></mona-text-box>\n    }\n\n    @if (type() === \"number\") {\n        <mona-dropdown-list\n            [data]=\"numericFilterMenuDataItems | operatorFilter: operators()\"\n            textField=\"text\"\n            valueField=\"value\"\n            [size]=\"size()\"\n            [rounded]=\"rounded()\"\n            [ngModel]=\"selectedFilterMenuDataItemList()[0]\"\n            (ngModelChange)=\"onFilterOperatorChange(0, $event)\"></mona-dropdown-list>\n        <mona-numeric-text-box\n            [ngModel]=\"numberFilterValues()[0]\"\n            (ngModelChange)=\"numberFilterValues.set([$event, numberFilterValues()[1]])\"\n            [size]=\"size()\"\n            [rounded]=\"rounded()\"\n            [disabled]=\"selectedFilterMenuDataItemList()[0]?.value | valuelessOperator\"></mona-numeric-text-box>\n    }\n\n    @if (type() === \"date\") {\n        <mona-dropdown-list\n            [data]=\"dateFilterMenuDataItems | operatorFilter: operators()\"\n            textField=\"text\"\n            valueField=\"value\"\n            [size]=\"size()\"\n            [rounded]=\"rounded()\"\n            [ngModel]=\"selectedFilterMenuDataItemList()[0]\"\n            (ngModelChange)=\"onFilterOperatorChange(0, $event)\"></mona-dropdown-list>\n\n        @if (type() === \"date\") {\n            <mona-date-picker\n                [ngModel]=\"dateFilterValues()[0]\"\n                (ngModelChange)=\"dateFilterValues.set([$event, dateFilterValues()[1]])\"\n                [format]=\"effectiveDateOptions().format\"\n                [size]=\"size()\"\n                [rounded]=\"rounded()\"\n                [disabled]=\"selectedFilterMenuDataItemList()[0]?.value | valuelessOperator\"></mona-date-picker>\n        }\n    }\n\n    @if (type() === \"boolean\") {\n        <mona-dropdown-list\n            [data]=\"booleanFilterMenuDataItems | operatorFilter: operators()\"\n            textField=\"text\"\n            valueField=\"value\"\n            [ngModel]=\"selectedFilterMenuDataItemList()[0]\"\n            [size]=\"size()\"\n            [rounded]=\"rounded()\"\n            (ngModelChange)=\"onFilterOperatorChange(0, $event)\"></mona-dropdown-list>\n    }\n</div>\n@if (firstFilterValid()) {\n    <div [class]=\"filterMenuItemClass()\">\n        <mona-button-group selection=\"single\" [size]=\"size()\" [rounded]=\"rounded()\" [disabled]=\"!firstFilterValid()\">\n            @for (item of connectorDataItems; track item) {\n                <button\n                    monaButton\n                    [selected]=\"item.value === selectedConnectorItem()?.value\"\n                    (selectedChange)=\"onConnectorChange(item, $event)\">\n                    {{ item.text }}\n                </button>\n            }\n        </mona-button-group>\n    </div>\n}\n@if (!!selectedConnectorItem()) {\n    <div [class]=\"filterMenuItemClass()\">\n        @if (type() === \"string\") {\n            <mona-dropdown-list\n                [data]=\"stringFilterMenuDataItems | operatorFilter: operators()\"\n                textField=\"text\"\n                valueField=\"value\"\n                [size]=\"size()\"\n                [rounded]=\"rounded()\"\n                [ngModel]=\"selectedFilterMenuDataItemList()[1]\"\n                (ngModelChange)=\"onFilterOperatorChange(1, $event)\"></mona-dropdown-list>\n            <mona-text-box\n                [ngModel]=\"stringFilterValues()[1]\"\n                (ngModelChange)=\"stringFilterValues.set([stringFilterValues()[0], $event])\"\n                [disabled]=\"selectedFilterMenuDataItemList()[1]?.value | valuelessOperator\"></mona-text-box>\n        }\n\n        @if (type() === \"number\") {\n            <mona-dropdown-list\n                [data]=\"numericFilterMenuDataItems | operatorFilter: operators()\"\n                textField=\"text\"\n                valueField=\"value\"\n                [size]=\"size()\"\n                [rounded]=\"rounded()\"\n                [ngModel]=\"selectedFilterMenuDataItemList()[1]\"\n                (ngModelChange)=\"onFilterOperatorChange(1, $event)\"></mona-dropdown-list>\n\n            <mona-numeric-text-box\n                [size]=\"size()\"\n                [rounded]=\"rounded()\"\n                [ngModel]=\"numberFilterValues()[1]\"\n                (ngModelChange)=\"numberFilterValues.set([numberFilterValues()[0], $event])\"\n                [disabled]=\"selectedFilterMenuDataItemList()[1]?.value | valuelessOperator\"></mona-numeric-text-box>\n        }\n\n        @if (type() === \"date\") {\n            <mona-dropdown-list\n                [data]=\"dateFilterMenuDataItems | operatorFilter: operators()\"\n                textField=\"text\"\n                valueField=\"value\"\n                [size]=\"size()\"\n                [rounded]=\"rounded()\"\n                [ngModel]=\"selectedFilterMenuDataItemList()[1]\"\n                (ngModelChange)=\"onFilterOperatorChange(1, $event)\"></mona-dropdown-list>\n\n            @if (type() === \"date\") {\n                <mona-date-picker\n                    [ngModel]=\"dateFilterValues()[1]\"\n                    (ngModelChange)=\"dateFilterValues.set([dateFilterValues()[0], $event])\"\n                    [format]=\"effectiveDateOptions().format\"\n                    [size]=\"size()\"\n                    [rounded]=\"rounded()\"\n                    [disabled]=\"selectedFilterMenuDataItemList()[1]?.value | valuelessOperator\"></mona-date-picker>\n            }\n        }\n\n        @if (type() === \"boolean\") {\n            <mona-dropdown-list\n                [data]=\"booleanFilterMenuDataItems | operatorFilter: operators()\"\n                textField=\"text\"\n                valueField=\"value\"\n                [size]=\"size()\"\n                [rounded]=\"rounded()\"\n                [ngModel]=\"selectedFilterMenuDataItemList()[1]\"\n                (ngModelChange)=\"onFilterOperatorChange(1, $event)\"></mona-dropdown-list>\n        }\n    </div>\n}\n<div [class]=\"`${filterMenuItemClass()} ${filterMenuActionsClass()}`\">\n    <button\n        monaButton\n        (click)=\"onFilterApply()\"\n        [look]=\"'primary'\"\n        [size]=\"size()\"\n        [rounded]=\"rounded()\"\n        [disabled]=\"applyDisabled()\">\n        Apply\n    </button>\n    <button monaButton (click)=\"onFilterClear()\" [look]=\"'default'\" [size]=\"size()\" [rounded]=\"rounded()\">Clear</button>\n</div>\n" }]
+                    }, template: "<div [class]=\"filterMenuItemClass()\">\n    @if (type() === \"string\") {\n        <mona-dropdown-list\n            [data]=\"stringFilterMenuDataItems() | operatorFilter: operators()\"\n            textField=\"text\"\n            valueField=\"value\"\n            [size]=\"size()\"\n            [rounded]=\"rounded()\"\n            [ngModel]=\"selectedFilterMenuDataItemList()[0]\"\n            (ngModelChange)=\"onFilterOperatorChange(0, $event)\"></mona-dropdown-list>\n        <mona-text-box\n            [ngModel]=\"stringFilterValues()[0]\"\n            (ngModelChange)=\"stringFilterValues.set([$event, stringFilterValues()[1]])\"\n            [size]=\"size()\"\n            [disabled]=\"selectedFilterMenuDataItemList()[0]?.value | valuelessOperator\"></mona-text-box>\n    }\n\n    @if (type() === \"number\") {\n        <mona-dropdown-list\n            [data]=\"numericFilterMenuDataItems() | operatorFilter: operators()\"\n            textField=\"text\"\n            valueField=\"value\"\n            [size]=\"size()\"\n            [rounded]=\"rounded()\"\n            [ngModel]=\"selectedFilterMenuDataItemList()[0]\"\n            (ngModelChange)=\"onFilterOperatorChange(0, $event)\"></mona-dropdown-list>\n        <mona-numeric-text-box\n            [ngModel]=\"numberFilterValues()[0]\"\n            (ngModelChange)=\"numberFilterValues.set([$event, numberFilterValues()[1]])\"\n            [size]=\"size()\"\n            [rounded]=\"rounded()\"\n            [disabled]=\"selectedFilterMenuDataItemList()[0]?.value | valuelessOperator\"></mona-numeric-text-box>\n    }\n\n    @if (type() === \"date\") {\n        <mona-dropdown-list\n            [data]=\"dateFilterMenuDataItems() | operatorFilter: operators()\"\n            textField=\"text\"\n            valueField=\"value\"\n            [size]=\"size()\"\n            [rounded]=\"rounded()\"\n            [ngModel]=\"selectedFilterMenuDataItemList()[0]\"\n            (ngModelChange)=\"onFilterOperatorChange(0, $event)\"></mona-dropdown-list>\n\n        @if (type() === \"date\") {\n            <mona-date-picker\n                [ngModel]=\"dateFilterValues()[0]\"\n                (ngModelChange)=\"dateFilterValues.set([$event, dateFilterValues()[1]])\"\n                [format]=\"effectiveDateOptions().format\"\n                [size]=\"size()\"\n                [rounded]=\"rounded()\"\n                [disabled]=\"selectedFilterMenuDataItemList()[0]?.value | valuelessOperator\"></mona-date-picker>\n        }\n    }\n\n    @if (type() === \"boolean\") {\n        <mona-dropdown-list\n            [data]=\"booleanFilterMenuDataItems() | operatorFilter: operators()\"\n            textField=\"text\"\n            valueField=\"value\"\n            [ngModel]=\"selectedFilterMenuDataItemList()[0]\"\n            [size]=\"size()\"\n            [rounded]=\"rounded()\"\n            (ngModelChange)=\"onFilterOperatorChange(0, $event)\"></mona-dropdown-list>\n    }\n</div>\n@if (firstFilterValid()) {\n    <div [class]=\"filterMenuItemClass()\">\n        <mona-button-group selection=\"single\" [size]=\"size()\" [rounded]=\"rounded()\" [disabled]=\"!firstFilterValid()\">\n            @for (item of connectorDataItems(); track item.value) {\n                <button\n                    monaButton\n                    [selected]=\"item.value === selectedConnectorItem()?.value\"\n                    (selectedChange)=\"onConnectorChange(item, $event)\">\n                    {{ item.text }}\n                </button>\n            }\n        </mona-button-group>\n    </div>\n}\n@if (!!selectedConnectorItem()) {\n    <div [class]=\"filterMenuItemClass()\">\n        @if (type() === \"string\") {\n            <mona-dropdown-list\n                [data]=\"stringFilterMenuDataItems() | operatorFilter: operators()\"\n                textField=\"text\"\n                valueField=\"value\"\n                [size]=\"size()\"\n                [rounded]=\"rounded()\"\n                [ngModel]=\"selectedFilterMenuDataItemList()[1]\"\n                (ngModelChange)=\"onFilterOperatorChange(1, $event)\"></mona-dropdown-list>\n            <mona-text-box\n                [ngModel]=\"stringFilterValues()[1]\"\n                (ngModelChange)=\"stringFilterValues.set([stringFilterValues()[0], $event])\"\n                [disabled]=\"selectedFilterMenuDataItemList()[1]?.value | valuelessOperator\"></mona-text-box>\n        }\n\n        @if (type() === \"number\") {\n            <mona-dropdown-list\n                [data]=\"numericFilterMenuDataItems() | operatorFilter: operators()\"\n                textField=\"text\"\n                valueField=\"value\"\n                [size]=\"size()\"\n                [rounded]=\"rounded()\"\n                [ngModel]=\"selectedFilterMenuDataItemList()[1]\"\n                (ngModelChange)=\"onFilterOperatorChange(1, $event)\"></mona-dropdown-list>\n\n            <mona-numeric-text-box\n                [size]=\"size()\"\n                [rounded]=\"rounded()\"\n                [ngModel]=\"numberFilterValues()[1]\"\n                (ngModelChange)=\"numberFilterValues.set([numberFilterValues()[0], $event])\"\n                [disabled]=\"selectedFilterMenuDataItemList()[1]?.value | valuelessOperator\"></mona-numeric-text-box>\n        }\n\n        @if (type() === \"date\") {\n            <mona-dropdown-list\n                [data]=\"dateFilterMenuDataItems() | operatorFilter: operators()\"\n                textField=\"text\"\n                valueField=\"value\"\n                [size]=\"size()\"\n                [rounded]=\"rounded()\"\n                [ngModel]=\"selectedFilterMenuDataItemList()[1]\"\n                (ngModelChange)=\"onFilterOperatorChange(1, $event)\"></mona-dropdown-list>\n\n            @if (type() === \"date\") {\n                <mona-date-picker\n                    [ngModel]=\"dateFilterValues()[1]\"\n                    (ngModelChange)=\"dateFilterValues.set([dateFilterValues()[0], $event])\"\n                    [format]=\"effectiveDateOptions().format\"\n                    [size]=\"size()\"\n                    [rounded]=\"rounded()\"\n                    [disabled]=\"selectedFilterMenuDataItemList()[1]?.value | valuelessOperator\"></mona-date-picker>\n            }\n        }\n\n        @if (type() === \"boolean\") {\n            <mona-dropdown-list\n                [data]=\"booleanFilterMenuDataItems() | operatorFilter: operators()\"\n                textField=\"text\"\n                valueField=\"value\"\n                [size]=\"size()\"\n                [rounded]=\"rounded()\"\n                [ngModel]=\"selectedFilterMenuDataItemList()[1]\"\n                (ngModelChange)=\"onFilterOperatorChange(1, $event)\"></mona-dropdown-list>\n        }\n    </div>\n}\n<div [class]=\"`${filterMenuItemClass()} ${filterMenuActionsClass()}`\">\n    <button\n        monaButton\n        (click)=\"onFilterApply()\"\n        [look]=\"'primary'\"\n        [size]=\"size()\"\n        [rounded]=\"rounded()\"\n        [disabled]=\"applyDisabled()\">\n        {{ messages().apply }}\n    </button>\n    <button monaButton (click)=\"onFilterClear()\" [look]=\"'default'\" [size]=\"size()\" [rounded]=\"rounded()\">{{ messages().clear }}</button>\n</div>\n" }]
         }], ctorParameters: () => [], propDecorators: { apply: [{ type: i0.Output, args: ["apply"] }], dateOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "dateOptions", required: false }] }], field: [{ type: i0.Input, args: [{ isSignal: true, alias: "field", required: false }] }, { type: i0.Output, args: ["fieldChange"] }], operators: [{ type: i0.Input, args: [{ isSignal: true, alias: "operators", required: false }] }, { type: i0.Output, args: ["operatorsChange"] }], rounded: [{ type: i0.Input, args: [{ isSignal: true, alias: "rounded", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }, { type: i0.Output, args: ["typeChange"] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }] } });
 
 /*
@@ -646,5 +729,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { FilterMenuComponent, FilterService };
+export { FILTER_DEFAULT_MESSAGES, FilterMenuComponent, FilterService };
 //# sourceMappingURL=nanahoshi-mona-ui-filter.mjs.map

package/fesm2022/{nanahoshi-mona-ui-grid-grid-footer-cell.component-WEDbZ5vy.mjs → nanahoshi-mona-ui-grid-grid-footer-cell.component-Bg7rckst.mjs}

@@ -2,7 +2,7 @@ import { NgTemplateOutlet } from '@angular/common';
 import * as i0 from '@angular/core';
 import { inject, computed, input, ChangeDetectionStrategy, Component } from '@angular/core';
 import { ImmutableDictionary } from '@mirei/ts-collections';
-import { c as GridService } from './nanahoshi-mona-ui-grid-nanahoshi-mona-ui-grid-Pm8Fbp6M.mjs';
+import { c as GridService } from './nanahoshi-mona-ui-grid-nanahoshi-mona-ui-grid-DPmJmCap.mjs';
 
 class GridFooterCellComponent {
     constructor() {
@@ -102,4 +102,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImpor
         }], propDecorators: { column: [{ type: i0.Input, args: [{ isSignal: true, alias: "column", required: true }] }], columnIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "columnIndex", required: true }] }], groupKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupKey", required: false }] }] } });
 
 export { GridFooterCellComponent };
-//# sourceMappingURL=nanahoshi-mona-ui-grid-grid-footer-cell.component-WEDbZ5vy.mjs.map
+//# sourceMappingURL=nanahoshi-mona-ui-grid-grid-footer-cell.component-Bg7rckst.mjs.map

package/fesm2022/{nanahoshi-mona-ui-grid-grid-footer-table-cell.directive-ibH5osCg.mjs → nanahoshi-mona-ui-grid-grid-footer-table-cell.directive-BSSpaCLL.mjs}

@@ -1,6 +1,6 @@
 import * as i0 from '@angular/core';
 import { computed, input, Directive } from '@angular/core';
-import { z as gridFooterTableCellThemeVariants } from './nanahoshi-mona-ui-grid-nanahoshi-mona-ui-grid-Pm8Fbp6M.mjs';
+import { z as gridFooterTableCellThemeVariants } from './nanahoshi-mona-ui-grid-nanahoshi-mona-ui-grid-DPmJmCap.mjs';
 
 class GridFooterTableCellDirective {
     constructor() {
@@ -35,4 +35,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.6", ngImpor
         }], propDecorators: { footerCellMinWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "footerCellMinWidth", required: false }] }], footerCellWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "footerCellWidth", required: false }] }], footerColumn: [{ type: i0.Input, args: [{ isSignal: true, alias: "footerColumn", required: false }] }] } });
 
 export { GridFooterTableCellDirective };
-//# sourceMappingURL=nanahoshi-mona-ui-grid-grid-footer-table-cell.directive-ibH5osCg.mjs.map
+//# sourceMappingURL=nanahoshi-mona-ui-grid-grid-footer-table-cell.directive-BSSpaCLL.mjs.map