@progress/kendo-vue-data-tools 3.7.4-dev.202212300853 → 3.7.4-dev.202301120847

package/dist/npm/filter/GroupToolbar.js

@@ -34,6 +34,7 @@ var kendo_vue_buttons_1 = require("@progress/kendo-vue-buttons");
 var kendo_vue_intl_1 = require("@progress/kendo-vue-intl");
 var operators_1 = require("./operators");
 var main_1 = require("../messages/main");
+var kendo_svg_icons_1 = require("@progress/kendo-svg-icons");
 /**
  * @hidden
  */
@@ -231,9 +232,11 @@ var GroupToolbarVue2 = {
           attrs: _this.v3 ? undefined : {
             title: locService.toLanguageString(main_1.filterAddExpression, main_1.messages[main_1.filterAddExpression]),
             icon: "filter-add-expression",
+            svgIcon: kendo_svg_icons_1.filterAddExpressionIcon,
             type: "button"
           },
           icon: "filter-add-expression",
+          svgIcon: kendo_svg_icons_1.filterAddExpressionIcon,
           type: "button",
           onClick: _this.onAddExpression,
           on: _this.v3 ? undefined : {
@@ -245,9 +248,11 @@ var GroupToolbarVue2 = {
         attrs: _this.v3 ? undefined : {
           title: locService.toLanguageString(main_1.filterAddExpression, main_1.messages[main_1.filterAddExpression]),
           icon: "filter-add-expression",
+          svgIcon: kendo_svg_icons_1.filterAddExpressionIcon,
           type: "button"
         },
         icon: "filter-add-expression",
+        svgIcon: kendo_svg_icons_1.filterAddExpressionIcon,
         type: "button",
         onClick: _this.onAddExpression,
         on: _this.v3 ? undefined : {
@@ -263,9 +268,11 @@ var GroupToolbarVue2 = {
           attrs: _this.v3 ? undefined : {
             title: locService.toLanguageString(main_1.filterAddGroup, main_1.messages[main_1.filterAddGroup]),
             icon: "filter-add-group",
+            svgIcon: kendo_svg_icons_1.filterAddGroupIcon,
             type: "button"
           },
           icon: "filter-add-group",
+          svgIcon: kendo_svg_icons_1.filterAddGroupIcon,
           type: "button",
           onClick: _this.onAddGroup,
           on: _this.v3 ? undefined : {
@@ -277,9 +284,11 @@ var GroupToolbarVue2 = {
         attrs: _this.v3 ? undefined : {
           title: locService.toLanguageString(main_1.filterAddGroup, main_1.messages[main_1.filterAddGroup]),
           icon: "filter-add-group",
+          svgIcon: kendo_svg_icons_1.filterAddGroupIcon,
           type: "button"
         },
         icon: "filter-add-group",
+        svgIcon: kendo_svg_icons_1.filterAddGroupIcon,
         type: "button",
         onClick: _this.onAddGroup,
         on: _this.v3 ? undefined : {
@@ -294,11 +303,13 @@ var GroupToolbarVue2 = {
           title: locService.toLanguageString(main_1.filterClose, main_1.messages[main_1.filterClose]),
           attrs: _this.v3 ? undefined : {
             title: locService.toLanguageString(main_1.filterClose, main_1.messages[main_1.filterClose]),
-            icon: "close",
+            icon: "x",
+            svgIcon: kendo_svg_icons_1.xIcon,
             look: "flat",
             type: "button"
           },
-          icon: "close",
+          icon: "x",
+          svgIcon: kendo_svg_icons_1.xIcon,
           look: "flat",
           type: "button",
           onClick: _this.onGroupRemove,
@@ -310,11 +321,13 @@ var GroupToolbarVue2 = {
         title: locService.toLanguageString(main_1.filterClose, main_1.messages[main_1.filterClose]),
         attrs: _this.v3 ? undefined : {
           title: locService.toLanguageString(main_1.filterClose, main_1.messages[main_1.filterClose]),
-          icon: "close",
+          icon: "x",
+          svgIcon: kendo_svg_icons_1.xIcon,
           look: "flat",
           type: "button"
         },
-        icon: "close",
+        icon: "x",
+        svgIcon: kendo_svg_icons_1.xIcon,
         look: "flat",
         type: "button",
         onClick: _this.onGroupRemove,
@@ -454,9 +467,11 @@ var GroupToolbarVue2 = {
         attrs: _this.v3 ? undefined : {
           title: locService.toLanguageString(main_1.filterAddExpression, main_1.messages[main_1.filterAddExpression]),
           icon: "filter-add-expression",
+          svgIcon: kendo_svg_icons_1.filterAddExpressionIcon,
           type: "button"
         },
         icon: "filter-add-expression",
+        svgIcon: kendo_svg_icons_1.filterAddExpressionIcon,
         type: "button",
         onClick: _this.onAddExpression,
         on: _this.v3 ? undefined : {
@@ -468,9 +483,11 @@ var GroupToolbarVue2 = {
       attrs: _this.v3 ? undefined : {
         title: locService.toLanguageString(main_1.filterAddExpression, main_1.messages[main_1.filterAddExpression]),
         icon: "filter-add-expression",
+        svgIcon: kendo_svg_icons_1.filterAddExpressionIcon,
         type: "button"
       },
       icon: "filter-add-expression",
+      svgIcon: kendo_svg_icons_1.filterAddExpressionIcon,
       type: "button",
       onClick: _this.onAddExpression,
       on: _this.v3 ? undefined : {
@@ -482,9 +499,11 @@ var GroupToolbarVue2 = {
         attrs: _this.v3 ? undefined : {
           title: locService.toLanguageString(main_1.filterAddGroup, main_1.messages[main_1.filterAddGroup]),
           icon: "filter-add-group",
+          svgIcon: kendo_svg_icons_1.filterAddGroupIcon,
           type: "button"
         },
         icon: "filter-add-group",
+        svgIcon: kendo_svg_icons_1.filterAddGroupIcon,
         type: "button",
         onClick: _this.onAddGroup,
         on: _this.v3 ? undefined : {
@@ -496,9 +515,11 @@ var GroupToolbarVue2 = {
       attrs: _this.v3 ? undefined : {
         title: locService.toLanguageString(main_1.filterAddGroup, main_1.messages[main_1.filterAddGroup]),
         icon: "filter-add-group",
+        svgIcon: kendo_svg_icons_1.filterAddGroupIcon,
         type: "button"
       },
       icon: "filter-add-group",
+      svgIcon: kendo_svg_icons_1.filterAddGroupIcon,
       type: "button",
       onClick: _this.onAddGroup,
       on: _this.v3 ? undefined : {
@@ -509,11 +530,13 @@ var GroupToolbarVue2 = {
         title: locService.toLanguageString(main_1.filterClose, main_1.messages[main_1.filterClose]),
         attrs: _this.v3 ? undefined : {
           title: locService.toLanguageString(main_1.filterClose, main_1.messages[main_1.filterClose]),
-          icon: "close",
+          icon: "x",
+          svgIcon: kendo_svg_icons_1.xIcon,
           look: "flat",
           type: "button"
         },
-        icon: "close",
+        icon: "x",
+        svgIcon: kendo_svg_icons_1.xIcon,
         look: "flat",
         type: "button",
         onClick: _this.onGroupRemove,
@@ -525,11 +548,13 @@ var GroupToolbarVue2 = {
       title: locService.toLanguageString(main_1.filterClose, main_1.messages[main_1.filterClose]),
       attrs: _this.v3 ? undefined : {
         title: locService.toLanguageString(main_1.filterClose, main_1.messages[main_1.filterClose]),
-        icon: "close",
+        icon: "x",
+        svgIcon: kendo_svg_icons_1.xIcon,
         look: "flat",
         type: "button"
       },
-      icon: "close",
+      icon: "x",
+      svgIcon: kendo_svg_icons_1.xIcon,
       look: "flat",
       type: "button",
       onClick: _this.onGroupRemove,

package/dist/npm/header/FilterRow.d.ts

@@ -18,6 +18,7 @@ export interface FilterRowProps {
     cellRender?: any;
     isRtl?: boolean;
     ariaRowIndex?: number;
+    size?: string;
 }
 /**
  * @hidden

package/dist/npm/header/FilterRow.js

@@ -29,7 +29,8 @@ var FilterRowVue2 = {
     sort: [Object, Array],
     cellRender: [String, Function, Object],
     isRtl: Boolean,
-    ariaRowIndex: Number
+    ariaRowIndex: Number,
+    size: String
   },
   inject: {
     kendoLocalizationService: {
@@ -38,7 +39,7 @@ var FilterRowVue2 = {
   },
   methods: {
     headerCellClassName: function headerCellClassName(field, locked) {
-      var result = "".concat(locked ? 'k-grid-header-sticky' : '');
+      var result = "k-table-th k-header" + (locked ? ' k-grid-header-sticky' : '');
       if (this.$props.sort && this.$props.sort.filter(function (descriptor) {
         return descriptor.field === field;
       }).length > 0) {
@@ -101,7 +102,6 @@ var FilterRowVue2 = {
       })[0];
       return found ? found.operator : null;
     };
-    var filterCellProps;
     var serviceIndex = 0,
       index = -1;
     var filterCells = this.$props.columns.filter(function (c) {
@@ -118,6 +118,7 @@ var FilterRowVue2 = {
         attrs: this.v3 ? undefined : {
           grid: this.$props.grid,
           field: column.field,
+          size: this.$props.size,
           title: column.filterTitle,
           value: activeFilterValueFor(column.field, filterType === 'text' ? '' : null),
           operator: activeOperatorFor(column.field),
@@ -127,6 +128,7 @@ var FilterRowVue2 = {
           render: column.filterCell || this.$props.cellRender
         },
         field: column.field,
+        size: this.$props.size,
         title: column.filterTitle,
         value: activeFilterValueFor(column.field, filterType === 'text' ? '' : null),
         operator: activeOperatorFor(column.field),
@@ -189,7 +191,7 @@ var FilterRowVue2 = {
       });
     }, this);
     return h("tr", {
-      "class": "k-filter-row",
+      "class": "k-table-row k-filter-row",
       "aria-rowindex": this.ariaRowIndex,
       attrs: this.v3 ? undefined : {
         "aria-rowindex": this.ariaRowIndex,

package/dist/npm/header/Header.d.ts

@@ -16,6 +16,7 @@ export interface HeaderProps {
     };
     cols: Element[];
     draggable: boolean;
+    size?: string;
 }
 /**
  * @hidden

package/dist/npm/header/Header.js

@@ -21,7 +21,8 @@ var HeaderVue2 = {
     headerRow: Object,
     columnResize: Object,
     cols: Array,
-    draggable: Boolean
+    draggable: Boolean,
+    size: String
   },
   data: function data() {
     return {
@@ -37,6 +38,14 @@ var HeaderVue2 = {
         'k-grid-header': true,
         'k-grid-draggable-header': this.$props.draggable
       };
+    },
+    tableClass: function tableClass() {
+      var _a;
+      var size = this.$props.size;
+      return _a = {
+        'k-table': true,
+        'k-grid-header-table': true
+      }, _a["k-table-".concat(kendo_vue_common_1.kendoThemeMaps.sizeMap[size] || size)] = size, _a;
     }
   },
   mounted: function mounted() {
@@ -101,6 +110,7 @@ var HeaderVue2 = {
         role: "presentation"
       }
     }, [h("table", {
+      "class": this.tableClass,
       ref: (0, kendo_vue_common_1.setRef)(this, 'table'),
       role: "presentation",
       attrs: this.v3 ? undefined : {

package/dist/npm/header/HeaderRow.d.ts

@@ -36,6 +36,7 @@ export interface HeaderRowProps extends ColumnDraggableProps {
     columnMenuAnimate?: boolean | PopupAnimation;
     onFilterChange?: Function;
     isRtl?: boolean;
+    size: string;
 }
 /**
  * @hidden

package/dist/npm/header/HeaderRow.js

@@ -16,6 +16,7 @@ var HeaderCell_1 = require("./HeaderCell");
 var ColumnMenu_1 = require("../columnmenu/ColumnMenu");
 var HeaderSelectionCell_1 = require("./HeaderSelectionCell");
 var kendo_vue_common_1 = require("@progress/kendo-vue-common");
+var kendo_svg_icons_1 = require("@progress/kendo-svg-icons");
 var HeaderThElement_1 = require("./HeaderThElement");
 /**
  * @hidden
@@ -70,6 +71,7 @@ var HeaderRowVue2 = {
         return true;
       }
     },
+    size: String,
     isRtl: Boolean
   },
   inject: {
@@ -135,7 +137,7 @@ var HeaderRowVue2 = {
     },
     cellClass: function cellClass(field, headerClassName, locked) {
       var customClass = headerClassName ? ' ' + headerClassName : '';
-      var result = "k-header ".concat(locked ? 'k-grid-header-sticky' : '') + customClass;
+      var result = "k-header" + (locked ? ' k-grid-header-sticky' : '') + customClass;
       if (this.$props.sort && this.$props.sort.filter(function (descriptor) {
         return descriptor.field === field;
       }).length > 0) {
@@ -175,6 +177,7 @@ var HeaderRowVue2 = {
     theadClasses: {
       get: function get() {
         return {
+          'k-table-thead': true,
           'k-grid-header': true
         };
       }
@@ -206,20 +209,23 @@ var HeaderRowVue2 = {
           if (!this.$props.sort) {
             return null;
           }
+          var currentDir = this.$props.sort[iconSortIndex].dir;
           return iconSortIndex >= 0 && [h(kendo_vue_common_1.Icon, {
             key: 1,
-            name: "sort-".concat(this.$props.sort[iconSortIndex].dir, "-small"),
+            name: "sort-".concat(currentDir, "-small"),
             attrs: this.v3 ? undefined : {
-              name: "sort-".concat(this.$props.sort[iconSortIndex].dir, "-small")
-            }
+              name: "sort-".concat(currentDir, "-small"),
+              icon: currentDir === 'asc' ? kendo_svg_icons_1.sortAscSmallIcon : kendo_svg_icons_1.sortDescSmallIcon
+            },
+            icon: currentDir === 'asc' ? kendo_svg_icons_1.sortAscSmallIcon : kendo_svg_icons_1.sortDescSmallIcon
           }), this.$props.sort.length > 1 && h("span", {
             key: 2,
             "class": "k-sort-order"
           }, [iconSortIndex + 1])];
         };
         var sortIcon = sortIconRenderer.call(this, sortIndex);
-        var className = (column.kFirst ? 'k-first ' : '') + this.cellClass(column.field, column.headerClassName, column.locked);
         var columnMenu = column.columnMenu || column.columnMenu === false ? column.columnMenu : this.$props.columnMenu;
+        var className = (column.kFirst ? 'k-first ' : '') + this.cellClass(column.field, column.headerClassName, column.locked) + (columnMenu ? ' k-filterable' : '');
         var columnMenuRender = !columnMenu || typeof columnMenu === 'boolean' ? !!columnMenu : this.getTemplate(columnMenu);
         var style = column.left !== undefined ? !this.$props.isRtl ? {
           left: column.left + 'px',
@@ -566,6 +572,7 @@ var HeaderRowVue2 = {
       }, this.v3 ? function () {
         return [cells.call(_this3, rowIndexes)];
       } : [cells.call(_this3, rowIndexes)]) || h("tr", {
+        "class": 'k-table-row',
         role: 'row',
         attrs: this.v3 ? undefined : {
           role: 'row'

package/dist/npm/header/HeaderTdElement.d.ts

@@ -0,0 +1,46 @@
+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;
+};
+export interface HeaderTdElementProps {
+    ariaColumnIndex?: number;
+    colSpan?: number;
+    rowSpan?: number;
+    role?: string;
+    columnId: string;
+    navigatable?: boolean;
+}
+/**
+ * @hidden
+ */
+export interface HeaderTdElementMethods extends Vue2type {
+    onKeydown: (event: any) => void;
+}
+/**
+ * @hidden
+ */
+export interface HeaderTdElementComputed {
+    [key: string]: any;
+    tdClass: object;
+}
+/**
+ * @hidden
+ */
+export interface HeaderTdElementState {
+    _text: string | undefined;
+}
+/**
+ * @hidden
+ */
+export interface HeaderTdElementAll extends HeaderTdElementMethods, HeaderTdElementState, HeaderTdElementComputed {
+}
+/**
+ * @hidden
+ */
+declare let HeaderTdElementVue2: ComponentOptions<Vue2type, DefaultData<{}>, DefaultMethods<HeaderTdElementAll>, {}, RecordPropsDefinition<HeaderTdElementProps>>;
+/**
+ * @hidden
+ */
+declare const HeaderTdElement: DefineComponent<HeaderTdElementProps, any, {}, {}, HeaderTdElementMethods, {}, {}, {}, string, HeaderTdElementProps, HeaderTdElementProps, {}>;
+export { HeaderTdElement, HeaderTdElementVue2 };

package/dist/npm/header/HeaderTdElement.js

@@ -0,0 +1,99 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.HeaderTdElementVue2 = exports.HeaderTdElement = 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 constants_1 = require("../navigation/constants");
+/**
+ * @hidden
+ */
+var HeaderTdElementVue2 = {
+  name: 'KendoHeaderTdElement',
+  // @ts-ignore
+  emits: {
+    keydown: null
+  },
+  props: {
+    ariaColumnIndex: Number,
+    role: String,
+    columnId: String,
+    navigatable: Boolean
+  },
+  computed: {
+    tdClass: function tdClass() {
+      var _a;
+      var className = this.$props.className;
+      return _a = {
+        'k-table-td': true
+      }, _a[className] = className, _a;
+    }
+  },
+  inject: {
+    getKeyboardNavigationAttributes: {
+      default: kendo_vue_common_1.noop
+    }
+  },
+  // @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 h = gh || createElement;
+    var _a = this.$props,
+      columnId = _a.columnId,
+      navigatable = _a.navigatable,
+      ariaColumnIndex = _a.ariaColumnIndex,
+      role = _a.role;
+    var navAttrs = this.getKeyboardNavigationAttributes(columnId, navigatable);
+    var defaultSlot = (0, kendo_vue_common_1.getDefaultSlots)(this);
+    return h("td", {
+      style: {
+        top: '0px'
+      },
+      "aria-colindex": ariaColumnIndex,
+      attrs: this.v3 ? undefined : {
+        "aria-colindex": ariaColumnIndex,
+        role: role,
+        tabindex: navAttrs.tabIndex,
+        "data-keyboardnavlevel": navAttrs[constants_1.KEYBOARD_NAV_DATA_LEVEL],
+        "data-keyboardnavid": navAttrs[constants_1.KEYBOARD_NAV_DATA_ID]
+      },
+      "class": this.tdClass,
+      onKeydown: this.onKeyDown,
+      on: this.v3 ? undefined : {
+        "keydown": this.onKeyDown
+      },
+      role: role,
+      tabindex: navAttrs.tabIndex,
+      "data-keyboardnavlevel": navAttrs[constants_1.KEYBOARD_NAV_DATA_LEVEL],
+      "data-keyboardnavid": navAttrs[constants_1.KEYBOARD_NAV_DATA_ID]
+    }, [defaultSlot]);
+  },
+  methods: {
+    onKeyDown: function onKeyDown(e) {
+      this.$emit('keydown', e);
+    }
+  }
+};
+exports.HeaderTdElementVue2 = HeaderTdElementVue2;
+/**
+ * @hidden
+ */
+var HeaderTdElement = HeaderTdElementVue2;
+exports.HeaderTdElement = HeaderTdElement;

package/dist/npm/header/HeaderThElement.d.ts

@@ -20,6 +20,13 @@ export interface HeaderThElementProps {
 export interface HeaderThElementMethods extends Vue2type {
     onKeydown: (event: any) => void;
 }
+/**
+ * @hidden
+ */
+export interface HeaderThElementComputed {
+    [key: string]: any;
+    thClass: object;
+}
 /**
  * @hidden
  */
@@ -29,7 +36,7 @@ export interface HeaderThElementState {
 /**
  * @hidden
  */
-export interface HeaderThElementAll extends HeaderThElementMethods, HeaderThElementState {
+export interface HeaderThElementAll extends HeaderThElementMethods, HeaderThElementState, HeaderThElementComputed {
 }
 /**
  * @hidden

package/dist/npm/header/HeaderThElement.js

@@ -37,6 +37,15 @@ var HeaderThElementVue2 = {
     columnId: String,
     navigatable: Boolean
   },
+  computed: {
+    thClass: function thClass() {
+      var _a;
+      var className = this.$props.className;
+      return _a = {
+        'k-table-th': true
+      }, _a[className] = className, _a;
+    }
+  },
   inject: {
     getKeyboardNavigationAttributes: {
       default: kendo_vue_common_1.noop
@@ -60,7 +69,6 @@ var HeaderThElementVue2 = {
       ariaSort = _a.ariaSort,
       colSpan = _a.colSpan,
       rowSpan = _a.rowSpan,
-      className = _a.className,
       columnId = _a.columnId,
       navigatable = _a.navigatable,
       ariaColumnIndex = _a.ariaColumnIndex,
@@ -91,7 +99,7 @@ var HeaderThElementVue2 = {
       "aria-selected": ariaSelected,
       colspan: colSpan,
       rowspan: rowSpan,
-      "class": className,
+      "class": this.thClass,
       onKeydown: this.onKeyDown,
       on: this.v3 ? undefined : {
         "keydown": this.onKeyDown

package/dist/npm/header/main.d.ts

@@ -8,3 +8,4 @@ export * from './HeaderSelectionCell';
 export * from '../interfaces/SortSettings';
 export * from './utils/main';
 export * from './HeaderThElement';
+export * from './HeaderTdElement';

package/dist/npm/header/main.js

@@ -24,3 +24,4 @@ __exportStar(require("./HeaderSelectionCell"), exports);
 __exportStar(require("../interfaces/SortSettings"), exports);
 __exportStar(require("./utils/main"), exports);
 __exportStar(require("./HeaderThElement"), exports);
+__exportStar(require("./HeaderTdElement"), exports);

package/dist/npm/interfaces/FilterCellProps.d.ts

@@ -69,4 +69,16 @@ export interface FilterCellProps {
      * The ariaLabel of the filter editor.
      */
     ariaLabel?: string;
+    /**
+     * Configures the `size` of the cell.
+     *
+     * The available options are:
+     * - small
+     * - medium
+     * - large
+     * - null—Does not set a size `class`.
+     *
+     * @default `medium`
+     */
+    size?: null | 'small' | 'medium' | 'large' | string;
 }

package/dist/npm/package-metadata.js

@@ -8,7 +8,7 @@ exports.packageMetadata = {
     name: '@progress/kendo-vue-data-tools',
     productName: 'Kendo UI for Vue',
     productCodes: ['KENDOUIVUE', 'KENDOUICOMPLETE'],
-    publishDate: 1672389924,
+    publishDate: 1673512534,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-vue-ui/my-license/?utm_medium=product&utm_source=kendovue&utm_campaign=kendo-ui-vue-purchase-license-keys-warning'
 };

package/dist/npm/pager/Pager.d.ts

@@ -34,6 +34,18 @@ export interface PagerProps extends GridPagerSettings {
     responsive?: boolean;
     pagerRender?: any;
     width?: number | string;
+    /**
+     * Configures the `size` of the Pager.
+     *
+     * The available options are:
+     * - small
+     * - medium
+     * - large
+     * - null—Does not set a size `class`.
+     *
+     * @default `medium`
+     */
+    size?: null | 'small' | 'medium' | 'large' | string;
     /**
      * A map with the messages.
      */
@@ -80,7 +92,7 @@ export interface PagerComputed {
  * @hidden
  */
 export interface PagerData {
-    size: string;
+    currentSize: string;
 }
 /**
  * @hidden