@progress/kendo-vue-data-tools 3.5.0 → 3.5.1-dev.202208150613

package/dist/esm/filter/Expression.js

@@ -0,0 +1,495 @@
+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 __rest = this && this.__rest || function (s, e) {
+  var t = {};
+
+  for (var p in s) {
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  }
+
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+}; // @ts-ignore
+
+
+import * as Vue from 'vue';
+var allVue = Vue;
+var gh = allVue.h;
+var isV3 = allVue.version && allVue.version[0] === '3';
+import { getTemplate } from '@progress/kendo-vue-common';
+import { Button, Toolbar, ToolbarItem } from '@progress/kendo-vue-buttons';
+import { DropDownList } from '@progress/kendo-vue-dropdowns';
+import { provideLocalizationService } from '@progress/kendo-vue-intl';
+import { unaryOperator, stringOperator } from './operators.js';
+import { messages, filterClose } from '../messages.js';
+import { TextFilter } from './filters/TextFilter.js';
+import { NumericFilter } from './filters/NumericFilter.js';
+import { BooleanFilter } from './filters/BooleanFilter.js';
+import { DateFilter } from './filters/DateFilter.js';
+/**
+ * @hidden
+ */
+
+var ExpressionVue2 = {
+  name: 'KendoExpression',
+  // @ts-ignore
+  emits: {
+    change: null,
+    remove: null
+  },
+  props: {
+    filter: {
+      type: Object,
+      required: true
+    },
+    fields: {
+      type: Array,
+      required: true
+    }
+  },
+  inject: {
+    kendoLocalizationService: {
+      default: null
+    }
+  },
+  // @ts-ignore
+  setup: !isV3 ? undefined : function () {
+    var v3 = !!isV3;
+    return {
+      v3: v3
+    };
+  },
+  render: function render(createElement) {
+    var _this = this;
+
+    var h = gh || createElement;
+    var _a = this.$props,
+        fields = _a.fields,
+        filter = _a.filter;
+    var field = fields.find(function (f) {
+      return f.name === filter.field;
+    });
+    var locService = provideLocalizationService(this);
+    var operators = (field && field.operators || []).map(function (o) {
+      return __assign(__assign({}, o), {
+        text: locService.toLanguageString(o.text, messages[o.text] || o.text)
+      });
+    });
+    var defaultRendering = null;
+
+    var filterEditors = function filterEditors(filterName, filterRender) {
+      switch (filterName) {
+        case 'numeric':
+          defaultRendering = // @ts-ignore
+          h(NumericFilter, {
+            filter: filter,
+            attrs: this.v3 ? undefined : {
+              filter: filter
+            },
+            onFilterchange: this.onInputChange,
+            on: this.v3 ? undefined : {
+              "filterchange": this.onInputChange
+            }
+          });
+          break;
+
+        case 'date':
+          defaultRendering = // @ts-ignore
+          h(DateFilter, {
+            filter: filter,
+            attrs: this.v3 ? undefined : {
+              filter: filter
+            },
+            onFilterchange: this.onInputChange,
+            on: this.v3 ? undefined : {
+              "filterchange": this.onInputChange
+            }
+          });
+          break;
+
+        case 'boolean':
+          defaultRendering = // @ts-ignore
+          h(BooleanFilter, {
+            filter: filter,
+            attrs: this.v3 ? undefined : {
+              filter: filter
+            },
+            onFilterchange: this.onInputChange,
+            on: this.v3 ? undefined : {
+              "filterchange": this.onInputChange
+            }
+          });
+          break;
+
+        default:
+          defaultRendering = // @ts-ignore
+          h(TextFilter, {
+            filter: filter,
+            attrs: this.v3 ? undefined : {
+              filter: filter
+            },
+            onFilterchange: this.onInputChange,
+            on: this.v3 ? undefined : {
+              "filterchange": this.onInputChange
+            }
+          });
+          break;
+      }
+
+      return getTemplate.call(this, {
+        h: h,
+        template: filterRender,
+        defaultRendering: defaultRendering,
+        additionalProps: {
+          filter: filter
+        },
+        additionalListeners: {
+          filterchange: this.onInputChange
+        }
+      });
+    };
+
+    return h("div", {
+      "class": "k-filter-toolbar"
+    }, [// @ts-ignore function children 
+    h(Toolbar, {
+      keyboardNavigation: false,
+      attrs: this.v3 ? undefined : {
+        keyboardNavigation: false
+      }
+    }, this.v3 ? function () {
+      return [// @ts-ignore function children 
+      h(ToolbarItem, {
+        "class": "k-filter-field"
+      }, _this.v3 ? function () {
+        return [// @ts-ignore 
+        h(DropDownList, {
+          "class": "k-filter-dropdown",
+          dataItems: fields,
+          attrs: _this.v3 ? undefined : {
+            dataItems: fields,
+            textField: "label",
+            value: fields.find(function (f) {
+              return f.name === filter.field;
+            })
+          },
+          textField: "label",
+          value: fields.find(function (f) {
+            return f.name === filter.field;
+          }),
+          onChange: _this.onFieldChange,
+          on: _this.v3 ? undefined : {
+            "change": _this.onFieldChange
+          }
+        })];
+      } : [h(DropDownList, {
+        "class": "k-filter-dropdown",
+        dataItems: fields,
+        attrs: _this.v3 ? undefined : {
+          dataItems: fields,
+          textField: "label",
+          value: fields.find(function (f) {
+            return f.name === filter.field;
+          })
+        },
+        textField: "label",
+        value: fields.find(function (f) {
+          return f.name === filter.field;
+        }),
+        onChange: _this.onFieldChange,
+        on: _this.v3 ? undefined : {
+          "change": _this.onFieldChange
+        }
+      })]), // @ts-ignore function children 
+      h(ToolbarItem, {
+        "class": "k-filter-operator"
+      }, _this.v3 ? function () {
+        return [// @ts-ignore
+        h(DropDownList, {
+          dataItems: operators,
+          attrs: _this.v3 ? undefined : {
+            dataItems: operators,
+            textField: "text",
+            value: operators.find(function (o) {
+              return o.operator === filter.operator;
+            })
+          },
+          textField: "text",
+          value: operators.find(function (o) {
+            return o.operator === filter.operator;
+          }),
+          onChange: _this.onOperatorChange,
+          on: _this.v3 ? undefined : {
+            "change": _this.onOperatorChange
+          }
+        })];
+      } : [h(DropDownList, {
+        dataItems: operators,
+        attrs: _this.v3 ? undefined : {
+          dataItems: operators,
+          textField: "text",
+          value: operators.find(function (o) {
+            return o.operator === filter.operator;
+          })
+        },
+        textField: "text",
+        value: operators.find(function (o) {
+          return o.operator === filter.operator;
+        }),
+        onChange: _this.onOperatorChange,
+        on: _this.v3 ? undefined : {
+          "change": _this.onOperatorChange
+        }
+      })]), // @ts-ignore function children 
+      h(ToolbarItem, {
+        "class": "k-filter-value"
+      }, _this.v3 ? function () {
+        return [field && filterEditors.call(_this, field.filter, field.filterRender)];
+      } : [field && filterEditors.call(_this, field.filter, field.filterRender)]), // @ts-ignore function children 
+      h(ToolbarItem, _this.v3 ? function () {
+        return [// @ts-ignore
+        h(Button, {
+          title: locService.toLanguageString(filterClose, messages[filterClose]),
+          attrs: _this.v3 ? undefined : {
+            title: locService.toLanguageString(filterClose, messages[filterClose]),
+            icon: "close",
+            look: "flat",
+            type: "button"
+          },
+          icon: "close",
+          look: "flat",
+          type: "button",
+          onClick: _this.onFilterRemove,
+          on: _this.v3 ? undefined : {
+            "click": _this.onFilterRemove
+          }
+        })];
+      } : [h(Button, {
+        title: locService.toLanguageString(filterClose, messages[filterClose]),
+        attrs: _this.v3 ? undefined : {
+          title: locService.toLanguageString(filterClose, messages[filterClose]),
+          icon: "close",
+          look: "flat",
+          type: "button"
+        },
+        icon: "close",
+        look: "flat",
+        type: "button",
+        onClick: _this.onFilterRemove,
+        on: _this.v3 ? undefined : {
+          "click": _this.onFilterRemove
+        }
+      })])];
+    } : [h(ToolbarItem, {
+      "class": "k-filter-field"
+    }, _this.v3 ? function () {
+      return [h(DropDownList, {
+        "class": "k-filter-dropdown",
+        dataItems: fields,
+        attrs: _this.v3 ? undefined : {
+          dataItems: fields,
+          textField: "label",
+          value: fields.find(function (f) {
+            return f.name === filter.field;
+          })
+        },
+        textField: "label",
+        value: fields.find(function (f) {
+          return f.name === filter.field;
+        }),
+        onChange: _this.onFieldChange,
+        on: _this.v3 ? undefined : {
+          "change": _this.onFieldChange
+        }
+      })];
+    } : [h(DropDownList, {
+      "class": "k-filter-dropdown",
+      dataItems: fields,
+      attrs: _this.v3 ? undefined : {
+        dataItems: fields,
+        textField: "label",
+        value: fields.find(function (f) {
+          return f.name === filter.field;
+        })
+      },
+      textField: "label",
+      value: fields.find(function (f) {
+        return f.name === filter.field;
+      }),
+      onChange: _this.onFieldChange,
+      on: _this.v3 ? undefined : {
+        "change": _this.onFieldChange
+      }
+    })]), h(ToolbarItem, {
+      "class": "k-filter-operator"
+    }, _this.v3 ? function () {
+      return [h(DropDownList, {
+        dataItems: operators,
+        attrs: _this.v3 ? undefined : {
+          dataItems: operators,
+          textField: "text",
+          value: operators.find(function (o) {
+            return o.operator === filter.operator;
+          })
+        },
+        textField: "text",
+        value: operators.find(function (o) {
+          return o.operator === filter.operator;
+        }),
+        onChange: _this.onOperatorChange,
+        on: _this.v3 ? undefined : {
+          "change": _this.onOperatorChange
+        }
+      })];
+    } : [h(DropDownList, {
+      dataItems: operators,
+      attrs: _this.v3 ? undefined : {
+        dataItems: operators,
+        textField: "text",
+        value: operators.find(function (o) {
+          return o.operator === filter.operator;
+        })
+      },
+      textField: "text",
+      value: operators.find(function (o) {
+        return o.operator === filter.operator;
+      }),
+      onChange: _this.onOperatorChange,
+      on: _this.v3 ? undefined : {
+        "change": _this.onOperatorChange
+      }
+    })]), h(ToolbarItem, {
+      "class": "k-filter-value"
+    }, _this.v3 ? function () {
+      return [field && filterEditors.call(_this, field.filter, field.filterRender)];
+    } : [field && filterEditors.call(_this, field.filter, field.filterRender)]), h(ToolbarItem, _this.v3 ? function () {
+      return [h(Button, {
+        title: locService.toLanguageString(filterClose, messages[filterClose]),
+        attrs: _this.v3 ? undefined : {
+          title: locService.toLanguageString(filterClose, messages[filterClose]),
+          icon: "close",
+          look: "flat",
+          type: "button"
+        },
+        icon: "close",
+        look: "flat",
+        type: "button",
+        onClick: _this.onFilterRemove,
+        on: _this.v3 ? undefined : {
+          "click": _this.onFilterRemove
+        }
+      })];
+    } : [h(Button, {
+      title: locService.toLanguageString(filterClose, messages[filterClose]),
+      attrs: _this.v3 ? undefined : {
+        title: locService.toLanguageString(filterClose, messages[filterClose]),
+        icon: "close",
+        look: "flat",
+        type: "button"
+      },
+      icon: "close",
+      look: "flat",
+      type: "button",
+      onClick: _this.onFilterRemove,
+      on: _this.v3 ? undefined : {
+        "click": _this.onFilterRemove
+      }
+    })])])]);
+  },
+  methods: {
+    onFieldChange: function onFieldChange(event) {
+      var nextFieldName = event.value.name;
+      var nextField = this.$props.fields.find(function (f) {
+        return f.name === nextFieldName;
+      });
+      var prevFilter = this.$props.filter;
+      var operator = nextField && !nextField.operators.some(function (o) {
+        return o.operator === prevFilter.operator;
+      }) ? nextField.operators[0].operator : prevFilter.operator;
+      var nextFilter = {
+        field: nextFieldName,
+        operator: operator
+      };
+
+      if (!unaryOperator(operator)) {
+        nextFilter.value = stringOperator(operator) ? '' : null;
+      }
+
+      this.triggerOnFilterChange(prevFilter, nextFilter, event);
+    },
+    onOperatorChange: function onOperatorChange(event) {
+      var operator = event.value.operator;
+      var prevFilter = this.$props.filter;
+      var nextFilter;
+
+      if (unaryOperator(operator)) {
+        var value = prevFilter.value,
+            prevFilterNoValue = __rest(prevFilter, ["value"]);
+
+        nextFilter = __assign(__assign({}, prevFilterNoValue), {
+          operator: operator
+        });
+      } else {
+        nextFilter = __assign(__assign({}, prevFilter), {
+          operator: operator
+        });
+      }
+
+      this.triggerOnFilterChange(prevFilter, nextFilter, event);
+    },
+    onInputChange: function onInputChange(event) {
+      var prevFilter = this.$props.filter;
+      var nextFilter = event.nextFilter;
+
+      if (unaryOperator(nextFilter.operator)) {
+        var field = this.$props.fields.find(function (f) {
+          return f.name === nextFilter.field;
+        });
+        nextFilter = __assign(__assign({}, nextFilter), {
+          operator: field && field.operators[0].operator || nextFilter.operator
+        });
+      }
+
+      this.triggerOnFilterChange(prevFilter, nextFilter, event);
+    },
+    triggerOnFilterChange: function triggerOnFilterChange(prevFilter, nextFilter, event) {
+      var changeEvent = {
+        prevFilter: prevFilter,
+        nextFilter: nextFilter,
+        event: event.event,
+        target: this
+      };
+      this.$emit('change', changeEvent);
+    },
+    onFilterRemove: function onFilterRemove(event) {
+      var removeEvent = {
+        filter: this.$props.filter,
+        event: event.event,
+        target: this
+      };
+      this.$emit('remove', removeEvent);
+    }
+  }
+};
+/**
+ * @hidden
+ */
+
+var Expression = ExpressionVue2;
+export { Expression, ExpressionVue2 };

package/dist/esm/filter/FieldSettings.d.ts

@@ -0,0 +1,22 @@
+import { FilterOperator } from '../filteringCells';
+/**
+ * The FieldSettings object.
+ */
+export interface FieldSettings {
+    /**
+     * The field name.
+     */
+    name: string;
+    /**
+     * The field label, which will be shown in the fields DropDownList.
+     */
+    label: string;
+    /**
+     * The filter editor component. Could be any of the built-in TextFilter, NumericFilter, DateFilter, BooleanFilter or a custom component.
+     */
+    filter: any;
+    /**
+     * The collection of operators which will be passed to the operators DropDownList.
+     */
+    operators: Array<FilterOperator>;
+}

package/dist/esm/filter/FieldSettings.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/filter/Filter.d.ts

@@ -0,0 +1,83 @@
+import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from '../additionalTypes';
+declare type DefaultData<V> = object | ((this: V) => {});
+declare type DefaultMethods<V> = {
+    [key: string]: (this: V, ...args: any[]) => any;
+};
+import { CompositeFilterDescriptor } from '@progress/kendo-data-query';
+import { GroupChangeEvent, GroupRemoveEvent } from './GroupFilters';
+import { FieldSettings } from './FieldSettings';
+/**
+ * The FilterChangeEvent object.
+ */
+export interface FilterChangeEvent {
+    target: any;
+    event: any;
+    /**
+     * The changed composite filter descriptor.
+     */
+    filter: CompositeFilterDescriptor;
+}
+/**
+ * The props of the Filter component.
+ */
+export interface FilterProps {
+    /**
+     * The fields settings of the Filter.
+     */
+    fields: Array<FieldSettings>;
+    /**
+     * The composite filter descriptor value.
+     */
+    value: CompositeFilterDescriptor;
+    /**
+     * @hidden
+     */
+    modelValue?: any;
+    /**
+     * The Filter onChange event.
+     */
+    onChange?: (event: FilterChangeEvent) => void;
+    /**
+     * The initial composite filter descriptor which will be used when a new group is created.
+     */
+    defaultGroupFilter?: CompositeFilterDescriptor;
+}
+/**
+ * @hidden
+ */
+export interface FilterState {
+}
+/**
+ * @hidden
+ */
+export interface FilterComputed {
+    [key: string]: any;
+    computedValue: any;
+}
+/**
+ * @hidden
+ */
+export interface FilterMethods {
+    [key: string]: any;
+    onFilterChange: (event: GroupChangeEvent) => void;
+    onGroupRemove: (event: GroupRemoveEvent) => void;
+}
+/**
+ * @hidden
+ */
+export interface FilterData {
+}
+/**
+ * @hidden
+ */
+export interface FilterAll extends Vue2type, FilterMethods, FilterData, FilterComputed, FilterState {
+}
+/**
+ * @hidden
+ */
+declare let FilterVue2: ComponentOptions<FilterAll, DefaultData<FilterData>, DefaultMethods<FilterAll>, FilterComputed, RecordPropsDefinition<FilterProps>>;
+/**
+ * @hidden
+ */
+declare const Filter: DefineComponent<FilterProps, any, FilterData, FilterComputed, FilterMethods, {}, {}, {}, string, FilterProps, FilterProps, {}>;
+export { Filter, FilterVue2 };