@progress/kendo-vue-data-tools 5.3.0-dev.202410141143 → 5.3.0-develop.1

package/dist/esm/columnmenu/ColumnMenuFilter.js

@@ -1,1061 +0,0 @@
-var __assign = this && this.__assign || function () {
-  __assign = Object.assign || function (t) {
-    for (var s, i = 1, n = arguments.length; i < n; i++) {
-      s = arguments[i];
-      for (var p in s) {
-        if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
-      }
-    }
-    return t;
-  };
-  return __assign.apply(this, arguments);
-};
-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 to.concat(ar || Array.prototype.slice.call(from));
-};
-// @ts-ignore
-import * as Vue from 'vue';
-var allVue = Vue;
-var gh = allVue.h;
-var isV3 = allVue.version && allVue.version[0] === '3';
-var inject = allVue.inject;
-import { templateRendering, hasListener, getListeners, getTemplate } from '@progress/kendo-vue-common';
-import { isCompositeFilterDescriptor } from '@progress/kendo-data-query';
-import { ColumnMenuItem } from './ColumnMenuItem.js';
-import { ColumnMenuItemGroup } from './ColumnMenuItemGroup.js';
-import { ColumnMenuItemContent } from './ColumnMenuItemContent.js';
-import { Button } from '@progress/kendo-vue-buttons';
-import { provideLocalizationService } from '@progress/kendo-vue-intl';
-import { operatorMap, getDefaultOperator, filterLogicList, defaultHideSecondFilter, booleanFilterValues, getFilterType, operators } from '../filterCommon.js';
-import { messages, columnMenuFilterClearButton, columnMenuFilterSubmitButton, columnMenuFilterTitle } from '../messages/main.js';
-import { ColumnMenuFilterCell } from './ColumnMenuFilterCell.js';
-import { ColumnMenuFilterOperators } from './ColumnMenuFilterOperators.js';
-import { DropDownList } from '@progress/kendo-vue-dropdowns';
-import { filterIcon } from '@progress/kendo-svg-icons';
-/**
- * @hidden
- */
-export var rootFilterOrDefault = function rootFilterOrDefault(rootFilter) {
-  return rootFilter || {
-    filters: [],
-    logic: 'and'
-  };
-};
-// tslint:disable:max-line-length
-/**
- * Can be used to check if filtering is applied to a specific field ([see example]({% slug column_menu_grid %}#toc-styling-the-column-menu-icon)). Useful for creating active filter indicators.
- */
-// tslint:enable:max-line-length
-export var filterGroupByField = function filterGroupByField(field, filter) {
-  var rootFilter = rootFilterOrDefault(filter);
-  var compositeFilters = rootFilter.filters.filter(function (f) {
-    if (isCompositeFilterDescriptor(f)) {
-      return f.filters && f.filters.length && f.filters.length <= 2 && !f.filters.find(function (nf) {
-        return isCompositeFilterDescriptor(nf) || nf.field !== field;
-      });
-    }
-    return false;
-  });
-  return compositeFilters[0] || null;
-};
-/**
- * @hidden
- */
-var ColumnMenuFilterVue2 = {
-  name: 'KendoColumnMenuFilter',
-  props: {
-    column: Object,
-    filter: Object,
-    expanded: {
-      type: Boolean,
-      default: undefined
-    },
-    filterable: Boolean,
-    filterOperators: {
-      type: Object,
-      default: function _default() {
-        return operators;
-      }
-    },
-    hideSecondFilter: {
-      type: [Boolean, Object],
-      default: function _default() {
-        return undefined;
-      }
-    },
-    filterUI: [String, Function, Object],
-    onFilterchange: Function
-  },
-  inject: {
-    kendoLocalizationService: {
-      default: null
-    }
-  },
-  data: function data() {
-    return {
-      currentExpanded: false,
-      filterGroup: null
-    };
-  },
-  created: function created() {
-    var _this = this;
-    var filterGroup;
-    if (this.$props.column && this.$props.column.field) {
-      var filterType = getFilterType(this.$props.column.filter);
-      var defaultOperator = getDefaultOperator(this.$props.filterOperators, filterType);
-      filterGroup = filterGroupByField(this.$props.column.field, this.$props.filter);
-      filterGroup = filterGroup ? __assign(__assign({}, filterGroup), {
-        filters: filterGroup.filters.map(function (f) {
-          return __assign({}, f);
-        })
-      }) : {
-        logic: 'and',
-        filters: [{
-          field: this.$props.column.field,
-          operator: defaultOperator
-        }, {
-          field: this.$props.column.field,
-          operator: defaultOperator
-        }]
-      };
-      if (filterGroup.filters.filter(function (x) {
-        return x.field === _this.$props.column.field;
-      }).length === 1) {
-        filterGroup.filters.splice(1, 0, {
-          field: this.$props.column.field,
-          operator: defaultOperator
-        });
-      }
-    }
-    this.currentExpanded = this.$props.expanded || false;
-    this.filterGroup = filterGroup;
-  },
-  methods: {
-    removeGroup: function removeGroup(group, rootFilter) {
-      var filters = __spreadArray([], rootFilter.filters, true);
-      var groupIndex = filters.findIndex(function (f) {
-        return f === group;
-      });
-      if (groupIndex > -1) {
-        filters.splice(groupIndex, 1);
-      }
-      return __assign(__assign({}, rootFilter), {
-        filters: filters
-      });
-    },
-    insertGroup: function insertGroup(group, rootFilter) {
-      return __assign(__assign({}, rootFilter), {
-        filters: __spreadArray([group], rootFilter.filters, true)
-      });
-    },
-    isControlled: function isControlled() {
-      return this.$props.expanded !== undefined;
-    },
-    onFilterExpand: function onFilterExpand() {
-      var isControlled = this.isControlled();
-      var nextValue = !(isControlled ? this.$props.expanded : this.currentExpanded);
-      this.$emit('expandchange', nextValue);
-      if (!isControlled) {
-        this.currentExpanded = nextValue;
-      }
-    },
-    filterChangeHandler: function filterChangeHandler(e, filterIndex) {
-      this.filterChange(filterIndex || 0, e);
-    },
-    firstFilterChange: function firstFilterChange(e) {
-      this.filterChange(0, e);
-    },
-    secondFilterChange: function secondFilterChange(e) {
-      this.filterChange(1, e);
-    },
-    filterChange: function filterChange(filterIndex, e) {
-      var filters = this.filterGroup.filters.map(function (f, i) {
-        if (i === filterIndex) {
-          return __assign(__assign({}, f), {
-            value: e.value,
-            operator: e.operator
-          });
-        }
-        return f;
-      });
-      this.filterGroup = __assign(__assign({}, this.filterGroup), {
-        filters: filters
-      });
-    },
-    logicChange: function logicChange(e) {
-      this.filterGroup = __assign(__assign({}, this.filterGroup), {
-        logic: e.target.value.operator
-      });
-    },
-    clear: function clear(e) {
-      e.preventDefault();
-      if (!hasListener.call(this, 'filterchange')) {
-        return;
-      }
-      var field = this.$props.column.field;
-      var rootFilter = rootFilterOrDefault(this.$props.filter);
-      var filterGroup = filterGroupByField(field, this.$props.filter);
-      var rootFilters = rootFilter.filters.filter(function (f) {
-        return f !== filterGroup;
-      });
-      if (!rootFilters.length) {
-        this.$emit('filterchange', null, {
-          event: e,
-          field: this.$props.column.field
-        });
-      } else {
-        this.$emit('filterchange', __assign(__assign({}, rootFilter), {
-          filters: rootFilters
-        }), {
-          event: e,
-          field: this.$props.column.field
-        });
-      }
-      this.$emit('closemenu');
-    },
-    currentFilterGroup: function currentFilterGroup() {
-      return __assign(__assign({}, this.filterGroup), {
-        filters: this.filterGroup.filters.filter(function (nf) {
-          return nf.value !== undefined && nf.value !== null && nf.value !== '' || nf.value === null && nf.operator;
-        })
-      });
-    },
-    submit: function submit(e) {
-      e.preventDefault();
-      if (!hasListener.call(this, 'filterchange')) {
-        return;
-      }
-      var field = this.$props.column.field;
-      var rootFilter = rootFilterOrDefault(this.$props.filter);
-      var filterGroup = filterGroupByField(field, this.$props.filter);
-      var currentFilterGroup = this.currentFilterGroup();
-      var updatedFilter = null;
-      if (filterGroup && currentFilterGroup.filters.length > 0) {
-        var rootFilters = rootFilter.filters.map(function (f) {
-          if (f === filterGroup) {
-            return currentFilterGroup;
-          }
-          return f;
-        });
-        updatedFilter = __assign(__assign({}, rootFilter), {
-          filters: rootFilters
-        });
-      } else if (currentFilterGroup.filters.length === 0) {
-        var rootFilters = rootFilter.filters.filter(function (f) {
-          return f !== filterGroup;
-        });
-        if (rootFilters.length) {
-          updatedFilter = __assign(__assign({}, rootFilter), {
-            filters: rootFilters
-          });
-        }
-      } else {
-        updatedFilter = __assign(__assign({}, rootFilter), {
-          filters: __spreadArray(__spreadArray([], rootFilter.filters, true), [currentFilterGroup], false)
-        });
-      }
-      this.$emit('filterchange', updatedFilter, {
-        event: e,
-        field: this.$props.column.field
-      });
-      this.$emit('closemenu');
-    },
-    handleFocus: function handleFocus(e) {
-      this.$emit('filterfocus', e);
-    }
-  },
-  // @ts-ignore
-  setup: !isV3 ? undefined : function () {
-    var v3 = !!isV3;
-    var kendoLocalizationService = inject('kendoLocalizationService', {});
-    return {
-      v3: v3,
-      kendoLocalizationService: kendoLocalizationService
-    };
-  },
-  // @ts-ignore
-  render: function render(createElement) {
-    var _this2 = this;
-    var _this = this;
-    var h = gh || createElement;
-    var _a = this.$props,
-      column = _a.column,
-      filterUI = _a.filterUI,
-      hideSecondFilter = _a.hideSecondFilter,
-      filterOperators = _a.filterOperators;
-    if (!column || !column.field) {
-      return h("div");
-    }
-    var filterType = column.filter || 'text';
-    var currentHideSecondFilter = hideSecondFilter !== undefined ? hideSecondFilter : defaultHideSecondFilter[filterType];
-    var localizationService = provideLocalizationService(this);
-    var filters = this.filterGroup.filters;
-    var currentOperators = operatorMap(filterOperators[filterType], localizationService);
-    var booleanValues = operatorMap(booleanFilterValues, localizationService);
-    var firstFilterCellProps = {
-      field: column.field,
-      value: filters[0].value,
-      operator: filters[0].operator,
-      operators: currentOperators,
-      booleanValues: booleanValues,
-      filterType: filterType
-    };
-    var secondFilterCellProps = {
-      field: column.field,
-      value: filters[1].value,
-      operator: filters[1].operator,
-      operators: currentOperators,
-      booleanValues: booleanValues,
-      filterType: filterType
-    };
-    var filterLogic = this.filterGroup.logic;
-    var logicData = operatorMap(filterLogicList, localizationService);
-    var logicProps = {
-      value: logicData.find(function (item) {
-        return item.operator === (filterLogic === null ? '' : filterLogic);
-      }),
-      data: logicData
-    };
-    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(ColumnMenuItemGroup, this.v3 ? function () {
-        return [
-        // @ts-ignore
-        h(ColumnMenuItem, {
-          title: localizationService.toLanguageString(columnMenuFilterTitle, messages[columnMenuFilterTitle]),
-          attrs: _this2.v3 ? undefined : {
-            title: localizationService.toLanguageString(columnMenuFilterTitle, messages[columnMenuFilterTitle]),
-            icon: 'filter',
-            svgIcon: filterIcon
-          },
-          icon: 'filter',
-          svgIcon: filterIcon,
-          onMenuitemclick: _this2.onFilterExpand,
-          on: _this2.v3 ? undefined : {
-            "menuitemclick": _this2.onFilterExpand
-          }
-        }),
-        // @ts-ignore function children
-        h(ColumnMenuItemContent, {
-          show: !!expandState,
-          attrs: _this2.v3 ? undefined : {
-            show: !!expandState
-          }
-        }, _this2.v3 ? function () {
-          return [h("div", {
-            "class": 'kendo-grid-filter-menu-container'
-          }, [h("form", {
-            "class": 'k-filter-menu k-border-up',
-            onSubmit: _this2.submit,
-            on: _this2.v3 ? undefined : {
-              "submit": _this2.submit,
-              "reset": _this2.clear
-            },
-            onReset: _this2.clear
-          }, [h("div", {
-            "class": 'k-filter-menu-container'
-          }, [
-          // @ts-ignore
-          !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(ColumnMenuFilterCell, {
-            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 : {
-              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
-          }),
-          // @ts-ignore
-          h(ColumnMenuFilterCell, {
-            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'
-          }, [
-          // @ts-ignore function children
-          h(Button, {
-            type: 'reset',
-            attrs: _this2.v3 ? undefined : {
-              type: 'reset'
-            }
-          }, _this2.v3 ? function () {
-            return [localizationService.toLanguageString(columnMenuFilterClearButton, messages[columnMenuFilterClearButton])];
-          } : [localizationService.toLanguageString(columnMenuFilterClearButton, messages[columnMenuFilterClearButton])]),
-          // @ts-ignore function children
-          h(Button, {
-            themeColor: 'primary',
-            attrs: _this2.v3 ? undefined : {
-              themeColor: 'primary',
-              disabled: !isFilterValid
-            },
-            disabled: !isFilterValid
-          }, _this2.v3 ? function () {
-            return [localizationService.toLanguageString(columnMenuFilterSubmitButton, messages[columnMenuFilterSubmitButton])];
-          } : [localizationService.toLanguageString(columnMenuFilterSubmitButton, messages[columnMenuFilterSubmitButton])])])])])])];
-        } : [h("div", {
-          "class": 'kendo-grid-filter-menu-container'
-        }, [h("form", {
-          "class": 'k-filter-menu k-border-up',
-          onSubmit: _this2.submit,
-          on: _this2.v3 ? undefined : {
-            "submit": _this2.submit,
-            "reset": _this2.clear
-          },
-          onReset: _this2.clear
-        }, [h("div", {
-          "class": 'k-filter-menu-container'
-        }, [!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(ColumnMenuFilterCell, {
-          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 : {
-            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(ColumnMenuFilterCell, {
-          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',
-          attrs: _this2.v3 ? undefined : {
-            type: 'reset'
-          }
-        }, _this2.v3 ? function () {
-          return [localizationService.toLanguageString(columnMenuFilterClearButton, messages[columnMenuFilterClearButton])];
-        } : [localizationService.toLanguageString(columnMenuFilterClearButton, messages[columnMenuFilterClearButton])]), h(Button, {
-          themeColor: 'primary',
-          attrs: _this2.v3 ? undefined : {
-            themeColor: 'primary',
-            disabled: !isFilterValid
-          },
-          disabled: !isFilterValid
-        }, _this2.v3 ? function () {
-          return [localizationService.toLanguageString(columnMenuFilterSubmitButton, messages[columnMenuFilterSubmitButton])];
-        } : [localizationService.toLanguageString(columnMenuFilterSubmitButton, messages[columnMenuFilterSubmitButton])])])])])])])];
-      } : [h(ColumnMenuItem, {
-        title: localizationService.toLanguageString(columnMenuFilterTitle, messages[columnMenuFilterTitle]),
-        attrs: _this2.v3 ? undefined : {
-          title: localizationService.toLanguageString(columnMenuFilterTitle, messages[columnMenuFilterTitle]),
-          icon: 'filter',
-          svgIcon: filterIcon
-        },
-        icon: 'filter',
-        svgIcon: filterIcon,
-        onMenuitemclick: _this2.onFilterExpand,
-        on: _this2.v3 ? undefined : {
-          "menuitemclick": _this2.onFilterExpand
-        }
-      }), h(ColumnMenuItemContent, {
-        show: !!expandState,
-        attrs: _this2.v3 ? undefined : {
-          show: !!expandState
-        }
-      }, _this2.v3 ? function () {
-        return [h("div", {
-          "class": 'kendo-grid-filter-menu-container'
-        }, [h("form", {
-          "class": 'k-filter-menu k-border-up',
-          onSubmit: _this2.submit,
-          on: _this2.v3 ? undefined : {
-            "submit": _this2.submit,
-            "reset": _this2.clear
-          },
-          onReset: _this2.clear
-        }, [h("div", {
-          "class": 'k-filter-menu-container'
-        }, [!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(ColumnMenuFilterCell, {
-          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 : {
-            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(ColumnMenuFilterCell, {
-          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',
-          attrs: _this2.v3 ? undefined : {
-            type: 'reset'
-          }
-        }, _this2.v3 ? function () {
-          return [localizationService.toLanguageString(columnMenuFilterClearButton, messages[columnMenuFilterClearButton])];
-        } : [localizationService.toLanguageString(columnMenuFilterClearButton, messages[columnMenuFilterClearButton])]), h(Button, {
-          themeColor: 'primary',
-          attrs: _this2.v3 ? undefined : {
-            themeColor: 'primary',
-            disabled: !isFilterValid
-          },
-          disabled: !isFilterValid
-        }, _this2.v3 ? function () {
-          return [localizationService.toLanguageString(columnMenuFilterSubmitButton, messages[columnMenuFilterSubmitButton])];
-        } : [localizationService.toLanguageString(columnMenuFilterSubmitButton, messages[columnMenuFilterSubmitButton])])])])])])];
-      } : [h("div", {
-        "class": 'kendo-grid-filter-menu-container'
-      }, [h("form", {
-        "class": 'k-filter-menu k-border-up',
-        onSubmit: _this2.submit,
-        on: _this2.v3 ? undefined : {
-          "submit": _this2.submit,
-          "reset": _this2.clear
-        },
-        onReset: _this2.clear
-      }, [h("div", {
-        "class": 'k-filter-menu-container'
-      }, [!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(ColumnMenuFilterCell, {
-        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 : {
-          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(ColumnMenuFilterCell, {
-        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',
-        attrs: _this2.v3 ? undefined : {
-          type: 'reset'
-        }
-      }, _this2.v3 ? function () {
-        return [localizationService.toLanguageString(columnMenuFilterClearButton, messages[columnMenuFilterClearButton])];
-      } : [localizationService.toLanguageString(columnMenuFilterClearButton, messages[columnMenuFilterClearButton])]), h(Button, {
-        themeColor: 'primary',
-        attrs: _this2.v3 ? undefined : {
-          themeColor: 'primary',
-          disabled: !isFilterValid
-        },
-        disabled: !isFilterValid
-      }, _this2.v3 ? function () {
-        return [localizationService.toLanguageString(columnMenuFilterSubmitButton, messages[columnMenuFilterSubmitButton])];
-      } : [localizationService.toLanguageString(columnMenuFilterSubmitButton, messages[columnMenuFilterSubmitButton])])])])])])])])
-    );
-  }
-};
-/**
- * Represents the ColumnMenuFilter component.
- *
- * {% meta height:410 %}
- *  ```html-preview
- *  <div id="vueapp">
- *     <Grid :style="{height: '280px'}"
- *          :data-items="gridData"
- *          :sortable="true"
- *          :sort= "sort"
- *          :filter="filter"
- *          :expand-field="'Discontinued'"
- *          @datastatechange="dataStateChange"
- *          @expandchange="expandChange"
- *          :columns="columns">
- *       </Grid>
- *  </div>
- * ```
- * ```js
- * import { , ColumnMenuFilter } from '@progress/kendo-vue-grid';
- * import { process } from '@progress/kendo-data-query';
- *      const ColumnMenu = {
- *        props: {
- *            column: Object,
- *            sortable: [Boolean, Object],
- *            sort: {
- *                type: Array
- *            },
- *            filter: Object,
- *            filterable: Boolean
- *        },
- *        components: {
- *            ColumnMenuFilter
- *        },
- *        template: `<div>
- *            <ColumnMenuFilter
- *                :column="column"
- *                :filterable="filterable"
- *                :filter="filter"
- *                @closemenu ="closeMenu"
- *                @expandchange = "expandChange"
- *                @filterchange = "filterChange"
- *            />
- *        </div>`,
- *        methods: {
- *            expandChange () {
- *                this.$emit('expandchange');
- *            },
- *            closeMenu () {
- *                this.$emit('closemenu');
- *            },
- *            filterChange (newDescriptor, e) {
- *                this.$emit('filterchange', newDescriptor, e);
- *            }
- *        }
- *      };
- *
- *      Vue.component('Grid', Grid);
- *      new Vue({
- *          el: '#vueapp',
- *          components: {
- *
- *          },
- *          created: function() {
- *             this.getData();
- *          },
- *          methods: {
- *            getData: function () {
- *                let dataState = {
- *                    filter: this.filter,
- *                    sort: this.sort
- *                };
- *                this.gridData = process([{
- *                    "ProductID": 1,
- *                    "ProductName": "Chai",
- *                    "UnitsInStock": 39,
- *                    "Discontinued": false,
- *                    "FirstOrderedOn": new Date(1996, 8, 20)
- *                },{
- *                    "ProductID": 2,
- *                    "ProductName": "Chang",
- *                    "UnitsInStock": 17,
- *                    "Discontinued": false,
- *                    "FirstOrderedOn": new Date(1996, 7, 12)
- *                },{
- *                    "ProductID": 3,
- *                    "ProductName": "Aniseed Syrup",
- *                    "UnitsInStock": 13,
- *                    "Discontinued": false,
- *                    "FirstOrderedOn": new Date(1996, 8, 26)
- *                },{
- *                    "ProductID": 4,
- *                    "ProductName": "Chef Anton's Cajun Seasoning",
- *                    "UnitsInStock": 53,
- *                    "Discontinued": false,
- *                    "FirstOrderedOn": new Date(1996, 9, 19)
- *                }], dataState);
- *            },
- *            createAppState: function(dataState) {
- *                this.sort = dataState.sort;
- *                this.filter = dataState.filter;
- *                this.getData();
- *            },
- *            dataStateChange: function (event) {
- *                this.createAppState(event.data);
- *            },
- *            expandChange: function (event) {
- *                 event.dataItem[event.target.$props.expandField] = event.value;
- *                 //
- *                 // In Vue 2 context, instead of the above line, inside the expandChange method we should have the following:
- *                 //
- *                 //   Vue.set(
- *                 //     event.dataItem,
- *                 //     event.target.$props.expandField,
- *                 //     event.dataItem.expanded === undefined ? false : !event.dataItem.expanded
- *                 //   );
- *                 //
- *            }
- *          },
- *          data: function () {
- *              return {
- *                 filter: null,
- *                 sort: [],
- *                  gridData: [],
- *                  columns: [
- *                      { field: 'ProductID'},
- *                      { field: 'ProductName', title: 'Product Name' },
- *                      { field: 'UnitsInStock', title: 'Units In Stock', columnMenu: ColumnMenu }
- *                  ]
- *              };
- *          }
- *       } );
- * ```
- *
- * ### props <span class='code'>[ColumnMenuFilterProps]({% slug api_grid_gridcolumnmenufilterprops %})</span>
- */
-var ColumnMenuFilter = ColumnMenuFilterVue2;
-export { ColumnMenuFilter, ColumnMenuFilterVue2 };