@progress/kendo-vue-grid 3.5.0 → 3.5.1-dev.202208100944

package/dist/es/columnMenu/GridColumnMenuFilter.js

@@ -14,18 +14,14 @@ var __assign = this && this.__assign || function () {
   return __assign.apply(this, arguments);
 };
 
-var __spreadArrays = this && this.__spreadArrays || function () {
-  for (var s = 0, i = 0, il = arguments.length; i < il; i++) {
-    s += arguments[i].length;
-  }
-
-  for (var r = Array(s), k = 0, i = 0; i < il; i++) {
-    for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++) {
-      r[k] = a[j];
+var __spreadArray = this && this.__spreadArray || function (to, from, pack) {
+  if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+    if (ar || !(i in from)) {
+      if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+      ar[i] = from[i];
     }
   }
-
-  return r;
+  return to.concat(ar || Array.prototype.slice.call(from));
 }; // @ts-ignore
 
 
@@ -34,7 +30,7 @@ var allVue = Vue;
 var gh = allVue.h;
 var isV3 = allVue.version && allVue.version[0] === '3';
 var inject = allVue.inject;
-import { templateRendering, hasListener, getListeners } from '@progress/kendo-vue-common';
+import { templateRendering, hasListener, getListeners, getTemplate } from '@progress/kendo-vue-common';
 import { isCompositeFilterDescriptor } from '@progress/kendo-data-query';
 import { GridColumnMenuItem } from './GridColumnMenuItem';
 import { GridColumnMenuItemGroup } from './GridColumnMenuItemGroup';
@@ -43,7 +39,9 @@ import { Button } from '@progress/kendo-vue-buttons';
 import { provideLocalizationService } from '@progress/kendo-vue-intl';
 import { operatorMap, getDefaultOperator, filterLogicList, defaultHideSecondFilter, booleanFilterValues, getFilterType, operators } from '../filterCommon';
 import { messages, filterClearButton, filterSubmitButton, filterTitle } from '../messages';
-import { GridColumnMenuFilterUI } from './GridColumnMenuFilterUI';
+import { GridColumnMenuFilterCell } from './GridColumnMenuFilterCell';
+import { ColumnMenuFilterOperators } from './GridColumnMenuFilterOperators';
+import { DropDownList } from '@progress/kendo-vue-dropdowns';
 /**
  * @hidden
  */
@@ -151,7 +149,7 @@ var GridColumnMenuFilterVue2 = {
   },
   methods: {
     removeGroup: function removeGroup(group, rootFilter) {
-      var filters = __spreadArrays(rootFilter.filters);
+      var filters = __spreadArray([], rootFilter.filters, true);
 
       var groupIndex = filters.findIndex(function (f) {
         return f === group;
@@ -167,7 +165,7 @@ var GridColumnMenuFilterVue2 = {
     },
     insertGroup: function insertGroup(group, rootFilter) {
       return __assign(__assign({}, rootFilter), {
-        filters: __spreadArrays([group], rootFilter.filters)
+        filters: __spreadArray([group], rootFilter.filters, true)
       });
     },
     isControlled: function isControlled() {
@@ -284,7 +282,7 @@ var GridColumnMenuFilterVue2 = {
         }
       } else {
         updatedFilter = __assign(__assign({}, rootFilter), {
-          filters: __spreadArrays(rootFilter.filters, [currentFilterGroup])
+          filters: __spreadArray(__spreadArray([], rootFilter.filters, true), [currentFilterGroup], false)
         });
       }
 
@@ -311,6 +309,8 @@ var GridColumnMenuFilterVue2 = {
   render: function render(createElement) {
     var _this2 = this;
 
+    var _this = this;
+
     var h = gh || createElement;
     var _a = this.$props,
         column = _a.column,
@@ -354,6 +354,27 @@ var GridColumnMenuFilterVue2 = {
     };
     var isFilterValid = this.currentFilterGroup().filters.length !== 0;
     var expandState = this.isControlled() ? this.$props.expanded : this.currentExpanded;
+    var firstField = firstFilterCellProps.field,
+        firstValue = firstFilterCellProps.value,
+        firstOperator = firstFilterCellProps.operator,
+        firstBooleanValues = firstFilterCellProps.booleanValues,
+        firstFilterType = firstFilterCellProps.filterType,
+        secondField = secondFilterCellProps.field,
+        secondValue = secondFilterCellProps.value,
+        secondOperator = secondFilterCellProps.operator,
+        secondBooleanValues = secondFilterCellProps.booleanValues,
+        secondFilterType = secondFilterCellProps.filterType;
+    var filterUIRender = filterUI && templateRendering.call(this, filterUI, getListeners.call(this));
+    var render = getTemplate.call(this, {
+      h: h,
+      template: filterUIRender,
+      defaultRendering: undefined,
+      additionalProps: this.$props,
+      additionalListeners: {
+        change: this.filterChangeHandler,
+        logicchange: this.logicChange
+      }
+    });
     return (// @ts-ignore function children
       h(GridColumnMenuItemGroup, this.v3 ? function () {
         return [// @ts-ignore
@@ -388,32 +409,108 @@ var GridColumnMenuFilterVue2 = {
           }, [h("div", {
             "class": 'k-filter-menu-container'
           }, [// @ts-ignore
-          h(GridColumnMenuFilterUI, {
-            firstFilterProps: firstFilterCellProps,
+          !filterUI && [h(ColumnMenuFilterOperators, {
+            operator: firstOperator,
+            attrs: _this2.v3 ? undefined : {
+              operator: firstOperator,
+              filterType: firstFilterType,
+              operators: currentOperators
+            },
+            filterType: firstFilterType,
+            onChange: function onChange(e) {
+              _this.filterChangeHandler(e, 0);
+            },
+            on: _this2.v3 ? undefined : {
+              "change": function onChange(e) {
+                _this.filterChangeHandler(e, 0);
+              }
+            },
+            operators: currentOperators
+          }), h(GridColumnMenuFilterCell, {
+            field: firstField,
+            attrs: _this2.v3 ? undefined : {
+              field: firstField,
+              value: firstValue,
+              operator: firstOperator,
+              booleanValues: firstBooleanValues,
+              filterType: firstFilterType,
+              operators: currentOperators
+            },
+            value: firstValue,
+            operator: firstOperator,
+            booleanValues: firstBooleanValues,
+            filterType: firstFilterType,
+            onFiltercellfocus: _this2.handleFocus,
+            on: _this2.v3 ? undefined : {
+              "filtercellfocus": _this2.handleFocus,
+              "change": function change(e) {
+                _this.filterChangeHandler(e, 0);
+              }
+            },
+            onChange: function change(e) {
+              _this.filterChangeHandler(e, 0);
+            },
+            operators: currentOperators
+          })], !hideSecondFilter && !filterUI && [// @ts-ignore
+          h(DropDownList, {
+            onChange: _this2.logicChange,
+            on: _this2.v3 ? undefined : {
+              "change": _this2.logicChange
+            },
+            "class": "k-filter-and",
+            "data-items": logicProps.data,
+            attrs: _this2.v3 ? undefined : {
+              "data-items": logicProps.data,
+              value: logicProps.value,
+              textField: "text"
+            },
+            value: logicProps.value,
+            textField: "text"
+          }), // @ts-ignore
+          h(ColumnMenuFilterOperators, {
+            operator: secondOperator,
             attrs: _this2.v3 ? undefined : {
-              firstFilterProps: firstFilterCellProps,
-              secondFilterProps: secondFilterCellProps,
-              logicData: logicProps.data,
-              logicValue: logicProps.value,
-              hideSecondFilter: currentHideSecondFilter,
-              operators: currentOperators,
-              render: filterUI && templateRendering.call(_this2, filterUI, getListeners.call(_this2))
+              operator: secondOperator,
+              filterType: secondFilterType,
+              operators: currentOperators
             },
-            secondFilterProps: secondFilterCellProps,
-            logicData: logicProps.data,
-            logicValue: logicProps.value,
-            onFilteruifocus: _this2.handleFocus,
+            filterType: secondFilterType,
+            onChange: function onChange(e) {
+              _this.filterChangeHandler(e, 1);
+            },
+            on: _this2.v3 ? undefined : {
+              "change": function onChange(e) {
+                _this.filterChangeHandler(e, 1);
+              }
+            },
+            operators: currentOperators
+          }), // @ts-ignore
+          h(GridColumnMenuFilterCell, {
+            field: secondField,
+            attrs: _this2.v3 ? undefined : {
+              field: secondField,
+              value: secondValue,
+              operator: secondOperator,
+              booleanValues: secondBooleanValues,
+              filterType: secondFilterType,
+              operators: currentOperators
+            },
+            value: secondValue,
+            operator: secondOperator,
+            booleanValues: secondBooleanValues,
+            filterType: secondFilterType,
+            onFiltercellfocus: _this2.handleFocus,
             on: _this2.v3 ? undefined : {
-              "filteruifocus": _this2.handleFocus,
-              "logicChange": _this2.logicChange,
-              "change": _this2.filterChangeHandler
+              "filtercellfocus": _this2.handleFocus,
+              "change": function change(e) {
+                _this.filterChangeHandler(e, 1);
+              }
+            },
+            onChange: function change(e) {
+              _this.filterChangeHandler(e, 1);
             },
-            onLogicChange: _this2.logicChange,
-            onChange: _this2.filterChangeHandler,
-            hideSecondFilter: currentHideSecondFilter,
-            operators: currentOperators,
-            render: filterUI && templateRendering.call(_this2, filterUI, getListeners.call(_this2))
-          }), h("div", {
+            operators: currentOperators
+          })], filterUI && render, h("div", {
             "class": 'k-columnmenu-actions'
           }, [// @ts-ignore function children
           h(Button, {
@@ -446,32 +543,105 @@ var GridColumnMenuFilterVue2 = {
           onReset: _this2.clear
         }, [h("div", {
           "class": 'k-filter-menu-container'
-        }, [h(GridColumnMenuFilterUI, {
-          firstFilterProps: firstFilterCellProps,
+        }, [!filterUI && [h(ColumnMenuFilterOperators, {
+          operator: firstOperator,
           attrs: _this2.v3 ? undefined : {
-            firstFilterProps: firstFilterCellProps,
-            secondFilterProps: secondFilterCellProps,
-            logicData: logicProps.data,
-            logicValue: logicProps.value,
-            hideSecondFilter: currentHideSecondFilter,
-            operators: currentOperators,
-            render: filterUI && templateRendering.call(_this2, filterUI, getListeners.call(_this2))
-          },
-          secondFilterProps: secondFilterCellProps,
-          logicData: logicProps.data,
-          logicValue: logicProps.value,
-          onFilteruifocus: _this2.handleFocus,
+            operator: firstOperator,
+            filterType: firstFilterType,
+            operators: currentOperators
+          },
+          filterType: firstFilterType,
+          onChange: function onChange(e) {
+            _this.filterChangeHandler(e, 0);
+          },
+          on: _this2.v3 ? undefined : {
+            "change": function onChange(e) {
+              _this.filterChangeHandler(e, 0);
+            }
+          },
+          operators: currentOperators
+        }), h(GridColumnMenuFilterCell, {
+          field: firstField,
+          attrs: _this2.v3 ? undefined : {
+            field: firstField,
+            value: firstValue,
+            operator: firstOperator,
+            booleanValues: firstBooleanValues,
+            filterType: firstFilterType,
+            operators: currentOperators
+          },
+          value: firstValue,
+          operator: firstOperator,
+          booleanValues: firstBooleanValues,
+          filterType: firstFilterType,
+          onFiltercellfocus: _this2.handleFocus,
           on: _this2.v3 ? undefined : {
-            "filteruifocus": _this2.handleFocus,
-            "logicChange": _this2.logicChange,
-            "change": _this2.filterChangeHandler
-          },
-          onLogicChange: _this2.logicChange,
-          onChange: _this2.filterChangeHandler,
-          hideSecondFilter: currentHideSecondFilter,
-          operators: currentOperators,
-          render: filterUI && templateRendering.call(_this2, filterUI, getListeners.call(_this2))
-        }), h("div", {
+            "filtercellfocus": _this2.handleFocus,
+            "change": function change(e) {
+              _this.filterChangeHandler(e, 0);
+            }
+          },
+          onChange: function change(e) {
+            _this.filterChangeHandler(e, 0);
+          },
+          operators: currentOperators
+        })], !hideSecondFilter && !filterUI && [h(DropDownList, {
+          onChange: _this2.logicChange,
+          on: _this2.v3 ? undefined : {
+            "change": _this2.logicChange
+          },
+          "class": "k-filter-and",
+          "data-items": logicProps.data,
+          attrs: _this2.v3 ? undefined : {
+            "data-items": logicProps.data,
+            value: logicProps.value,
+            textField: "text"
+          },
+          value: logicProps.value,
+          textField: "text"
+        }), h(ColumnMenuFilterOperators, {
+          operator: secondOperator,
+          attrs: _this2.v3 ? undefined : {
+            operator: secondOperator,
+            filterType: secondFilterType,
+            operators: currentOperators
+          },
+          filterType: secondFilterType,
+          onChange: function onChange(e) {
+            _this.filterChangeHandler(e, 1);
+          },
+          on: _this2.v3 ? undefined : {
+            "change": function onChange(e) {
+              _this.filterChangeHandler(e, 1);
+            }
+          },
+          operators: currentOperators
+        }), h(GridColumnMenuFilterCell, {
+          field: secondField,
+          attrs: _this2.v3 ? undefined : {
+            field: secondField,
+            value: secondValue,
+            operator: secondOperator,
+            booleanValues: secondBooleanValues,
+            filterType: secondFilterType,
+            operators: currentOperators
+          },
+          value: secondValue,
+          operator: secondOperator,
+          booleanValues: secondBooleanValues,
+          filterType: secondFilterType,
+          onFiltercellfocus: _this2.handleFocus,
+          on: _this2.v3 ? undefined : {
+            "filtercellfocus": _this2.handleFocus,
+            "change": function change(e) {
+              _this.filterChangeHandler(e, 1);
+            }
+          },
+          onChange: function change(e) {
+            _this.filterChangeHandler(e, 1);
+          },
+          operators: currentOperators
+        })], filterUI && render, h("div", {
           "class": 'k-columnmenu-actions'
         }, [h(Button, {
           type: 'reset',
@@ -519,32 +689,105 @@ var GridColumnMenuFilterVue2 = {
           onReset: _this2.clear
         }, [h("div", {
           "class": 'k-filter-menu-container'
-        }, [h(GridColumnMenuFilterUI, {
-          firstFilterProps: firstFilterCellProps,
+        }, [!filterUI && [h(ColumnMenuFilterOperators, {
+          operator: firstOperator,
+          attrs: _this2.v3 ? undefined : {
+            operator: firstOperator,
+            filterType: firstFilterType,
+            operators: currentOperators
+          },
+          filterType: firstFilterType,
+          onChange: function onChange(e) {
+            _this.filterChangeHandler(e, 0);
+          },
+          on: _this2.v3 ? undefined : {
+            "change": function onChange(e) {
+              _this.filterChangeHandler(e, 0);
+            }
+          },
+          operators: currentOperators
+        }), h(GridColumnMenuFilterCell, {
+          field: firstField,
+          attrs: _this2.v3 ? undefined : {
+            field: firstField,
+            value: firstValue,
+            operator: firstOperator,
+            booleanValues: firstBooleanValues,
+            filterType: firstFilterType,
+            operators: currentOperators
+          },
+          value: firstValue,
+          operator: firstOperator,
+          booleanValues: firstBooleanValues,
+          filterType: firstFilterType,
+          onFiltercellfocus: _this2.handleFocus,
+          on: _this2.v3 ? undefined : {
+            "filtercellfocus": _this2.handleFocus,
+            "change": function change(e) {
+              _this.filterChangeHandler(e, 0);
+            }
+          },
+          onChange: function change(e) {
+            _this.filterChangeHandler(e, 0);
+          },
+          operators: currentOperators
+        })], !hideSecondFilter && !filterUI && [h(DropDownList, {
+          onChange: _this2.logicChange,
+          on: _this2.v3 ? undefined : {
+            "change": _this2.logicChange
+          },
+          "class": "k-filter-and",
+          "data-items": logicProps.data,
+          attrs: _this2.v3 ? undefined : {
+            "data-items": logicProps.data,
+            value: logicProps.value,
+            textField: "text"
+          },
+          value: logicProps.value,
+          textField: "text"
+        }), h(ColumnMenuFilterOperators, {
+          operator: secondOperator,
           attrs: _this2.v3 ? undefined : {
-            firstFilterProps: firstFilterCellProps,
-            secondFilterProps: secondFilterCellProps,
-            logicData: logicProps.data,
-            logicValue: logicProps.value,
-            hideSecondFilter: currentHideSecondFilter,
-            operators: currentOperators,
-            render: filterUI && templateRendering.call(_this2, filterUI, getListeners.call(_this2))
-          },
-          secondFilterProps: secondFilterCellProps,
-          logicData: logicProps.data,
-          logicValue: logicProps.value,
-          onFilteruifocus: _this2.handleFocus,
+            operator: secondOperator,
+            filterType: secondFilterType,
+            operators: currentOperators
+          },
+          filterType: secondFilterType,
+          onChange: function onChange(e) {
+            _this.filterChangeHandler(e, 1);
+          },
           on: _this2.v3 ? undefined : {
-            "filteruifocus": _this2.handleFocus,
-            "logicChange": _this2.logicChange,
-            "change": _this2.filterChangeHandler
-          },
-          onLogicChange: _this2.logicChange,
-          onChange: _this2.filterChangeHandler,
-          hideSecondFilter: currentHideSecondFilter,
-          operators: currentOperators,
-          render: filterUI && templateRendering.call(_this2, filterUI, getListeners.call(_this2))
-        }), h("div", {
+            "change": function onChange(e) {
+              _this.filterChangeHandler(e, 1);
+            }
+          },
+          operators: currentOperators
+        }), h(GridColumnMenuFilterCell, {
+          field: secondField,
+          attrs: _this2.v3 ? undefined : {
+            field: secondField,
+            value: secondValue,
+            operator: secondOperator,
+            booleanValues: secondBooleanValues,
+            filterType: secondFilterType,
+            operators: currentOperators
+          },
+          value: secondValue,
+          operator: secondOperator,
+          booleanValues: secondBooleanValues,
+          filterType: secondFilterType,
+          onFiltercellfocus: _this2.handleFocus,
+          on: _this2.v3 ? undefined : {
+            "filtercellfocus": _this2.handleFocus,
+            "change": function change(e) {
+              _this.filterChangeHandler(e, 1);
+            }
+          },
+          onChange: function change(e) {
+            _this.filterChangeHandler(e, 1);
+          },
+          operators: currentOperators
+        })], filterUI && render, h("div", {
           "class": 'k-columnmenu-actions'
         }, [h(Button, {
           type: 'reset',
@@ -575,32 +818,105 @@ var GridColumnMenuFilterVue2 = {
         onReset: _this2.clear
       }, [h("div", {
         "class": 'k-filter-menu-container'
-      }, [h(GridColumnMenuFilterUI, {
-        firstFilterProps: firstFilterCellProps,
+      }, [!filterUI && [h(ColumnMenuFilterOperators, {
+        operator: firstOperator,
+        attrs: _this2.v3 ? undefined : {
+          operator: firstOperator,
+          filterType: firstFilterType,
+          operators: currentOperators
+        },
+        filterType: firstFilterType,
+        onChange: function onChange(e) {
+          _this.filterChangeHandler(e, 0);
+        },
+        on: _this2.v3 ? undefined : {
+          "change": function onChange(e) {
+            _this.filterChangeHandler(e, 0);
+          }
+        },
+        operators: currentOperators
+      }), h(GridColumnMenuFilterCell, {
+        field: firstField,
         attrs: _this2.v3 ? undefined : {
-          firstFilterProps: firstFilterCellProps,
-          secondFilterProps: secondFilterCellProps,
-          logicData: logicProps.data,
-          logicValue: logicProps.value,
-          hideSecondFilter: currentHideSecondFilter,
-          operators: currentOperators,
-          render: filterUI && templateRendering.call(_this2, filterUI, getListeners.call(_this2))
+          field: firstField,
+          value: firstValue,
+          operator: firstOperator,
+          booleanValues: firstBooleanValues,
+          filterType: firstFilterType,
+          operators: currentOperators
         },
-        secondFilterProps: secondFilterCellProps,
-        logicData: logicProps.data,
-        logicValue: logicProps.value,
-        onFilteruifocus: _this2.handleFocus,
+        value: firstValue,
+        operator: firstOperator,
+        booleanValues: firstBooleanValues,
+        filterType: firstFilterType,
+        onFiltercellfocus: _this2.handleFocus,
         on: _this2.v3 ? undefined : {
-          "filteruifocus": _this2.handleFocus,
-          "logicChange": _this2.logicChange,
-          "change": _this2.filterChangeHandler
+          "filtercellfocus": _this2.handleFocus,
+          "change": function change(e) {
+            _this.filterChangeHandler(e, 0);
+          }
+        },
+        onChange: function change(e) {
+          _this.filterChangeHandler(e, 0);
+        },
+        operators: currentOperators
+      })], !hideSecondFilter && !filterUI && [h(DropDownList, {
+        onChange: _this2.logicChange,
+        on: _this2.v3 ? undefined : {
+          "change": _this2.logicChange
+        },
+        "class": "k-filter-and",
+        "data-items": logicProps.data,
+        attrs: _this2.v3 ? undefined : {
+          "data-items": logicProps.data,
+          value: logicProps.value,
+          textField: "text"
+        },
+        value: logicProps.value,
+        textField: "text"
+      }), h(ColumnMenuFilterOperators, {
+        operator: secondOperator,
+        attrs: _this2.v3 ? undefined : {
+          operator: secondOperator,
+          filterType: secondFilterType,
+          operators: currentOperators
+        },
+        filterType: secondFilterType,
+        onChange: function onChange(e) {
+          _this.filterChangeHandler(e, 1);
+        },
+        on: _this2.v3 ? undefined : {
+          "change": function onChange(e) {
+            _this.filterChangeHandler(e, 1);
+          }
+        },
+        operators: currentOperators
+      }), h(GridColumnMenuFilterCell, {
+        field: secondField,
+        attrs: _this2.v3 ? undefined : {
+          field: secondField,
+          value: secondValue,
+          operator: secondOperator,
+          booleanValues: secondBooleanValues,
+          filterType: secondFilterType,
+          operators: currentOperators
+        },
+        value: secondValue,
+        operator: secondOperator,
+        booleanValues: secondBooleanValues,
+        filterType: secondFilterType,
+        onFiltercellfocus: _this2.handleFocus,
+        on: _this2.v3 ? undefined : {
+          "filtercellfocus": _this2.handleFocus,
+          "change": function change(e) {
+            _this.filterChangeHandler(e, 1);
+          }
+        },
+        onChange: function change(e) {
+          _this.filterChangeHandler(e, 1);
         },
-        onLogicChange: _this2.logicChange,
-        onChange: _this2.filterChangeHandler,
-        hideSecondFilter: currentHideSecondFilter,
-        operators: currentOperators,
-        render: filterUI && templateRendering.call(_this2, filterUI, getListeners.call(_this2))
-      }), h("div", {
+        operators: currentOperators
+      })], filterUI && render, h("div", {
         "class": 'k-columnmenu-actions'
       }, [h(Button, {
         type: 'reset',