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

package/dist/esm/utils/main.js

@@ -0,0 +1,20 @@
+import { canUseDOM } from '@progress/kendo-vue-common';
+/**
+ * @hidden
+ */
+export function getIndex(event, parent) {
+    if (!parent || !event || !event.originalEvent || !canUseDOM) {
+        return -1;
+    }
+    var target = document.elementFromPoint(event.clientX, event.originalEvent.clientY);
+    while (target && target.parentElement !== parent) {
+        target = target.parentElement;
+    }
+    var children = parent.children;
+    for (var i = 0; i < children.length; i++) {
+        if (children[i] === target) {
+            return i;
+        }
+    }
+    return -1;
+}

package/dist/npm/cells/FilterCell.d.ts

@@ -0,0 +1,26 @@
+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 { FilterCellProps } from '../interfaces/FilterCellProps';
+/**
+ * @hidden
+ */
+export interface FilterCellMethods extends Vue2type {
+    triggerClick: () => void;
+    inputChange: (value: any, e: any) => void;
+    operatorChange: (operatorValue: any, e: any) => void;
+    boolDropdownChange: (value: any, e: any) => void;
+    clear: (e: any) => void;
+    triggerChange: (filter: any) => void;
+}
+/**
+ * @hidden
+ */
+declare let FilterCellVue2: ComponentOptions<Vue2type, DefaultData<{}>, DefaultMethods<FilterCellMethods>, {}, RecordPropsDefinition<FilterCellProps>>;
+/**
+ * @hidden
+ */
+declare const FilterCell: DefineComponent<FilterCellProps, any, {}, {}, FilterCellMethods, {}, {}, {}, string, FilterCellProps, FilterCellProps, {}>;
+export { FilterCell, FilterCellVue2 };

package/dist/npm/cells/FilterCell.js

@@ -0,0 +1,280 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.FilterCellVue2 = exports.FilterCell = void 0; // @ts-ignore
+
+var Vue = require("vue");
+
+var allVue = Vue;
+var gh = allVue.h;
+var isV3 = allVue.version && allVue.version[0] === '3';
+var inject = allVue.inject;
+
+var kendo_vue_buttons_1 = require("@progress/kendo-vue-buttons");
+
+var main_1 = require("../messages/main");
+
+var kendo_vue_dropdowns_1 = require("@progress/kendo-vue-dropdowns");
+
+var kendo_vue_inputs_1 = require("@progress/kendo-vue-inputs");
+
+var kendo_vue_dateinputs_1 = require("@progress/kendo-vue-dateinputs");
+
+var kendo_vue_intl_1 = require("@progress/kendo-vue-intl");
+
+var filterCommon_1 = require("../filterCommon");
+
+var kendo_vue_common_1 = require("@progress/kendo-vue-common");
+/**
+ * @hidden
+ */
+
+
+var FilterCellVue2 = {
+  name: 'KendoFilterCell',
+  // @ts-ignore
+  emits: {
+    'change': null
+  },
+  props: {
+    id: String,
+    grid: Object,
+    field: String,
+    filterType: String,
+    colSpan: Number,
+    title: String,
+    value: [String, Number, Boolean, Date],
+    operator: [String, Function],
+    operators: Array,
+    booleanValues: Array,
+    onChange: Function,
+    render: [String, Function, Object]
+  },
+  inject: {
+    kendoLocalizationService: {
+      default: null
+    },
+    kendoIntlService: {
+      default: null
+    }
+  },
+  methods: {
+    inputChange: function inputChange(value, e) {
+      var filter = (0, filterCommon_1.cellInputChange)(value, e, this.$props);
+      this.triggerChange(filter);
+    },
+    operatorChange: function operatorChange(operatorValue, e) {
+      var filter = (0, filterCommon_1.cellOperatorChange)(operatorValue.value.operator, e, this.$props.value);
+      this.triggerChange(filter);
+    },
+    boolDropdownChange: function boolDropdownChange(value, e) {
+      var filter = (0, filterCommon_1.cellBoolDropdownChange)(value.value.operator, e);
+      this.triggerChange(filter);
+    },
+    clear: function clear(e) {
+      e.preventDefault();
+      this.triggerChange({
+        value: '',
+        operator: '',
+        event: e
+      });
+    },
+    triggerChange: function triggerChange(filter) {
+      filter.field = this.$props.field;
+      this.$emit('change', filter);
+    }
+  },
+  // @ts-ignore
+  setup: !isV3 ? undefined : function () {
+    var v3 = !!isV3;
+    var kendoIntlService = inject('kendoIntlService', {});
+    var kendoLocalizationService = inject('kendoLocalizationService', {});
+    return {
+      v3: v3,
+      kendoIntlService: kendoIntlService,
+      kendoLocalizationService: kendoLocalizationService
+    };
+  },
+  // @ts-ignore
+  render: function render(createElement) {
+    var _this = this;
+
+    var h = gh || createElement;
+    var localizationService = (0, kendo_vue_intl_1.provideLocalizationService)(this);
+    var selectedOperator = this.$props.operators.find(function (item) {
+      return item.operator === _this.$props.operator;
+    }) || null;
+
+    var renderOperatorEditor = function renderOperatorEditor() {
+      if (this.$props.filterType === 'boolean') {
+        return;
+      }
+
+      return (// @ts-ignore
+        h(kendo_vue_dropdowns_1.DropDownList, {
+          onChange: this.operatorChange,
+          on: this.v3 ? undefined : {
+            "change": this.operatorChange
+          },
+          value: selectedOperator,
+          attrs: this.v3 ? undefined : {
+            value: selectedOperator,
+            iconClassName: "k-i-filter k-icon",
+            "data-items": this.$props.operators,
+            textField: "text",
+            title: localizationService.toLanguageString(main_1.columnMenuFilterChooseOperator, main_1.messages[main_1.columnMenuFilterChooseOperator]),
+            popupSettings: {
+              width: ''
+            }
+          },
+          "class": "k-dropdown-operator",
+          iconClassName: "k-i-filter k-icon",
+          "data-items": this.$props.operators,
+          textField: "text",
+          title: localizationService.toLanguageString(main_1.columnMenuFilterChooseOperator, main_1.messages[main_1.columnMenuFilterChooseOperator]),
+          popupSettings: {
+            width: ''
+          }
+        })
+      );
+    };
+
+    var filterComponent = function filterComponent(filterType, value) {
+      var _this = this;
+
+      switch (filterType) {
+        case 'numeric':
+          return (// @ts-ignore
+            h(kendo_vue_inputs_1.NumericTextBox, {
+              value: value,
+              attrs: this.v3 ? undefined : {
+                value: value,
+                title: this.$props.title
+              },
+              onChange: function onChange(e) {
+                _this.inputChange(e.value, e.event);
+              },
+              on: this.v3 ? undefined : {
+                "change": function onChange(e) {
+                  _this.inputChange(e.value, e.event);
+                }
+              },
+              title: this.$props.title
+            })
+          );
+
+        case 'date':
+          return (// @ts-ignore
+            h(kendo_vue_dateinputs_1.DatePicker, {
+              value: value,
+              attrs: this.v3 ? undefined : {
+                value: value,
+                title: this.$props.title
+              },
+              onChange: function onChange(e) {
+                _this.inputChange(e.value, e);
+              },
+              on: this.v3 ? undefined : {
+                "change": function onChange(e) {
+                  _this.inputChange(e.value, e);
+                }
+              },
+              title: this.$props.title
+            })
+          );
+
+        case 'boolean':
+          var booleanValues = this.$props.booleanValues;
+          return (// @ts-ignore
+            h(kendo_vue_dropdowns_1.DropDownList, {
+              onChange: this.boolDropdownChange,
+              on: this.v3 ? undefined : {
+                "change": this.boolDropdownChange
+              },
+              value: booleanValues.find(function (item) {
+                return item.operator === (value !== null ? value : '');
+              }),
+              attrs: this.v3 ? undefined : {
+                value: booleanValues.find(function (item) {
+                  return item.operator === (value !== null ? value : '');
+                }),
+                "data-items": booleanValues,
+                textField: "text",
+                title: this.$props.title
+              },
+              "data-items": booleanValues,
+              textField: "text",
+              title: this.$props.title
+            })
+          );
+
+        default:
+          return h("span", {
+            "class": "k-textbox k-input k-input-md k-rounded-md k-input-solid"
+          }, [h("input", {
+            "class": "k-input-inner",
+            value: this.v3 ? value || '' : null,
+            domProps: this.v3 ? undefined : {
+              "value": value || ''
+            },
+            onInput: function onInput(e) {
+              _this.inputChange(e.target.value, e);
+            },
+            on: this.v3 ? undefined : {
+              "input": function onInput(e) {
+                _this.inputChange(e.target.value, e);
+              }
+            },
+            title: this.$props.title,
+            attrs: this.v3 ? undefined : {
+              title: this.$props.title
+            }
+          })]);
+      }
+    };
+
+    var defaultRendering = h("div", {
+      "class": "k-filtercell"
+    }, [h("div", {
+      "class": "k-filtercell-wrapper"
+    }, [filterComponent.call(this, this.$props.filterType, this.$props.value), renderOperatorEditor.call(this), // @ts-ignore function children 
+    h(kendo_vue_buttons_1.Button, {
+      type: "button",
+      attrs: this.v3 ? undefined : {
+        type: "button",
+        icon: 'filter-clear',
+        title: localizationService.toLanguageString(main_1.columnMenuFilterClearButton, main_1.messages[main_1.columnMenuFilterClearButton])
+      },
+      icon: 'filter-clear',
+      "class": {
+        /* button is always visible if there is either value or operator */
+        'k-disabled': !(!(this.$props.value === null || this.$props.value === '') || this.$props.operator)
+      },
+      title: localizationService.toLanguageString(main_1.columnMenuFilterClearButton, main_1.messages[main_1.columnMenuFilterClearButton]),
+      onClick: this.clear,
+      on: this.v3 ? undefined : {
+        "click": this.clear
+      }
+    })])]);
+    var gridListeners = this.$props.grid ? kendo_vue_common_1.getListeners.call(this.$props.grid) : null;
+    var cellRenderFunction = kendo_vue_common_1.templateRendering.call(this.$props.grid, this.$props.render, gridListeners);
+    return kendo_vue_common_1.getTemplate.call(this, {
+      h: h,
+      template: cellRenderFunction,
+      defaultRendering: defaultRendering,
+      additionalProps: this.$props,
+      additionalListeners: {
+        change: this.triggerChange
+      }
+    });
+  }
+};
+exports.FilterCellVue2 = FilterCellVue2;
+/**
+ * @hidden
+ */
+
+var FilterCell = FilterCellVue2;
+exports.FilterCell = FilterCell;

package/dist/npm/columnmenu/ColumnMenu.d.ts

@@ -0,0 +1,56 @@
+import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from '../additionalTypes';
+declare type DefaultData<V> = object | ((this: V) => ColumnMenuData);
+declare type DefaultMethods<V> = {
+    [key: string]: (this: V, ...args: any[]) => any;
+};
+import { ColumnMenuProps } from '../interfaces/ColumnMenuProps';
+import { CompositeFilterDescriptor } from '@progress/kendo-data-query';
+/**
+ * @hidden
+ */
+export interface ColumnMenuMethods extends Vue2type {
+    blur: () => void;
+    focus: () => void;
+    handleFocus: (_: any) => void;
+    anchorClick: () => void;
+    closeMenu: () => void;
+    sortChange: () => void;
+    filterChange: (newDescriptor: CompositeFilterDescriptor | null, e: any) => void;
+}
+/**
+ * @hidden
+ */
+export interface ColumnMenuData {
+    show: boolean;
+    blurTimeout: any;
+}
+/**
+ * @hidden
+ */
+export interface ColumnMenuComputed {
+    [key: string]: any;
+    currentOpen: boolean;
+}
+/**
+ * @hidden
+ */
+export interface ColumnMenuState {
+    _anchor: string;
+    _content: any;
+    kendoAnchorRef: any;
+    v3: boolean;
+}
+/**
+ * @hidden
+ */
+export interface ColumnMenuAll extends ColumnMenuMethods, ColumnMenuData, ColumnMenuState, ColumnMenuComputed {
+}
+/**
+ * @hidden
+ */
+declare let ColumnMenuVue2: ComponentOptions<Vue2type, DefaultData<ColumnMenuData>, DefaultMethods<ColumnMenuAll>, {}, RecordPropsDefinition<ColumnMenuProps>>;
+/**
+ * @hidden
+ */
+declare const ColumnMenu: DefineComponent<ColumnMenuProps, any, ColumnMenuData, ColumnMenuComputed, ColumnMenuMethods, {}, {}, {}, string, ColumnMenuProps, ColumnMenuProps, {}>;
+export { ColumnMenu, ColumnMenuVue2 };

package/dist/npm/columnmenu/ColumnMenu.js

@@ -0,0 +1,267 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ColumnMenuVue2 = exports.ColumnMenu = void 0; // @ts-ignore
+
+var Vue = require("vue");
+
+var allVue = Vue;
+var gh = allVue.h;
+var isV3 = allVue.version && allVue.version[0] === '3';
+var inject = allVue.inject;
+
+var kendo_vue_common_1 = require("@progress/kendo-vue-common");
+
+var kendo_vue_popup_1 = require("@progress/kendo-vue-popup");
+
+var ColumnMenuContent_1 = require("./ColumnMenuContent");
+
+var utils_1 = require("../navigation/utils");
+
+var kendo_vue_intl_1 = require("@progress/kendo-vue-intl");
+
+var main_1 = require("../messages/main");
+/**
+ * @hidden
+ */
+
+
+var ColumnMenuVue2 = {
+  name: 'KendoColumnMenu',
+  props: {
+    animate: {
+      type: [Boolean, Object],
+      default: function _default() {
+        return true;
+      }
+    },
+    column: Object,
+    sortable: [Boolean, Object],
+    sort: {
+      type: Array
+    },
+    opened: Boolean,
+    filter: Object,
+    filterable: Boolean,
+    filterOperators: Object,
+    render: [Boolean, String, Function, Object]
+  },
+  inject: {
+    kendoIntlService: {
+      default: null
+    },
+    kendoLocalizationService: {
+      default: null
+    }
+  },
+  data: function data() {
+    return {
+      show: false,
+      blurTimeout: undefined
+    };
+  },
+  created: function created() {
+    this._anchor = (0, kendo_vue_common_1.guid)();
+  },
+  computed: {
+    currentOpen: function currentOpen() {
+      return this.show || this.$props.opened;
+    }
+  },
+  watch: {
+    currentOpen: function currentOpen(newOpened) {
+      this.$nextTick(function () {
+        this._content = this.$refs.content;
+
+        if (newOpened && this._content) {
+          var focusableElements = utils_1.tableKeyboardNavigationTools.getFocusableElements(this._content, {
+            focusable: true
+          });
+
+          if (focusableElements.length) {
+            focusableElements[0].focus();
+          } else {
+            this._content.focus();
+          }
+        }
+      });
+    }
+  },
+  methods: {
+    blur: function blur() {
+      var _this = this;
+
+      clearTimeout(this.blurTimeout);
+      this.blurTimeout = setTimeout(function () {
+        _this.closeMenu();
+      }, 200);
+    },
+    focus: function focus() {
+      clearTimeout(this.blurTimeout);
+    },
+    handleFocus: function handleFocus(_) {
+      clearTimeout(this.blurTimeout);
+    },
+    anchorClick: function anchorClick() {
+      var that = this;
+      this.show = !this.show;
+    },
+    closeMenu: function closeMenu() {
+      this.$emit('close');
+      this.show = false;
+    },
+    sortChange: function sortChange(newDescriptor, e) {
+      this.$emit('sortchange', newDescriptor, e);
+    },
+    filterChange: function filterChange(newDescriptor, e) {
+      this.$emit('filterchange', newDescriptor, 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 h = gh || createElement;
+    var renderTemplate = this.$props.render;
+    var ls = (0, kendo_vue_intl_1.provideLocalizationService)(this);
+    return h("div", {
+      style: {
+        display: 'inline'
+      }
+    }, [h("div", {
+      "class": 'k-grid-column-menu k-grid-filter',
+      tabindex: 0,
+      attrs: this.v3 ? undefined : {
+        tabindex: 0,
+        title: "".concat(this.$props.column.field, " ").concat(ls.toLanguageString(main_1.columnMenu, main_1.messages[main_1.columnMenu]))
+      },
+      title: "".concat(this.$props.column.field, " ").concat(ls.toLanguageString(main_1.columnMenu, main_1.messages[main_1.columnMenu])),
+      ref: (0, kendo_vue_common_1.setRef)(this, 'kendoAnchor', this._anchor),
+      onClick: this.anchorClick,
+      on: this.v3 ? undefined : {
+        "click": this.anchorClick
+      }
+    }, [h("span", {
+      "class": 'k-icon k-i-more-vertical'
+    })]), // @ts-ignore function children
+    h(kendo_vue_popup_1.Popup, {
+      animate: this.$props.animate,
+      attrs: this.v3 ? undefined : {
+        animate: this.$props.animate,
+        anchor: this._anchor,
+        show: this.currentOpen
+      },
+      anchor: this._anchor,
+      show: this.currentOpen
+    }, this.v3 ? function () {
+      return [h("div", {
+        ref: 'content',
+        "class": 'k-grid-columnmenu-popup',
+        tabindex: 0,
+        attrs: _this2.v3 ? undefined : {
+          tabindex: 0
+        },
+        onFocusout: _this2.blur,
+        on: _this2.v3 ? undefined : {
+          "focusout": _this2.blur,
+          "focusin": _this2.focus
+        },
+        onFocusin: _this2.focus,
+        style: {
+          outline: 'none',
+          width: '230px'
+        }
+      }, [// @ts-ignore
+      h(ColumnMenuContent_1.ColumnMenuContent, {
+        column: _this2.$props.column,
+        attrs: _this2.v3 ? undefined : {
+          column: _this2.$props.column,
+          sortable: _this2.$props.sortable,
+          sort: _this2.$props.sort,
+          filter: _this2.$props.filter,
+          filterable: _this2.$props.filterable,
+          filterOperators: _this2.$props.filterOperators,
+          render: renderTemplate
+        },
+        sortable: _this2.$props.sortable,
+        sort: _this2.$props.sort,
+        filter: _this2.$props.filter,
+        filterable: _this2.$props.filterable,
+        filterOperators: _this2.$props.filterOperators,
+        render: renderTemplate,
+        onContentfocus: _this2.handleFocus,
+        on: _this2.v3 ? undefined : {
+          "contentfocus": _this2.handleFocus,
+          "closemenu": _this2.closeMenu,
+          "sortchange": _this2.sortChange,
+          "filterchange": _this2.filterChange
+        },
+        onClosemenu: _this2.closeMenu,
+        onSortchange: _this2.sortChange,
+        onFilterchange: _this2.filterChange
+      })])];
+    } : [h("div", {
+      ref: 'content',
+      "class": 'k-grid-columnmenu-popup',
+      tabindex: 0,
+      attrs: _this2.v3 ? undefined : {
+        tabindex: 0
+      },
+      onFocusout: _this2.blur,
+      on: _this2.v3 ? undefined : {
+        "focusout": _this2.blur,
+        "focusin": _this2.focus
+      },
+      onFocusin: _this2.focus,
+      style: {
+        outline: 'none',
+        width: '230px'
+      }
+    }, [h(ColumnMenuContent_1.ColumnMenuContent, {
+      column: _this2.$props.column,
+      attrs: _this2.v3 ? undefined : {
+        column: _this2.$props.column,
+        sortable: _this2.$props.sortable,
+        sort: _this2.$props.sort,
+        filter: _this2.$props.filter,
+        filterable: _this2.$props.filterable,
+        filterOperators: _this2.$props.filterOperators,
+        render: renderTemplate
+      },
+      sortable: _this2.$props.sortable,
+      sort: _this2.$props.sort,
+      filter: _this2.$props.filter,
+      filterable: _this2.$props.filterable,
+      filterOperators: _this2.$props.filterOperators,
+      render: renderTemplate,
+      onContentfocus: _this2.handleFocus,
+      on: _this2.v3 ? undefined : {
+        "contentfocus": _this2.handleFocus,
+        "closemenu": _this2.closeMenu,
+        "sortchange": _this2.sortChange,
+        "filterchange": _this2.filterChange
+      },
+      onClosemenu: _this2.closeMenu,
+      onSortchange: _this2.sortChange,
+      onFilterchange: _this2.filterChange
+    })])])]);
+  }
+};
+exports.ColumnMenuVue2 = ColumnMenuVue2;
+/**
+ * @hidden
+ */
+
+var ColumnMenu = ColumnMenuVue2;
+exports.ColumnMenu = ColumnMenu;