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

package/dist/npm/header/HeaderRow.js

@@ -14,6 +14,7 @@ var ColumnResizer_1 = require("../drag/ColumnResizer");
 var ColumnDraggable_1 = require("../drag/ColumnDraggable");
 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 HeaderThElement_1 = require("./HeaderThElement");
 /**
@@ -53,6 +54,7 @@ var HeaderRowVue2 = {
     sort: {
       type: Array
     },
+    selectedField: String,
     filter: Object,
     filterable: Boolean,
     filterOperators: Object,
@@ -201,18 +203,21 @@ var HeaderRowVue2 = {
         }) : -1;
         var sortDir = sortIndex >= 0 ? this.$props.sort[sortIndex].dir || 'none' : 'none';
         var sortIconRenderer = function sortIconRenderer(iconSortIndex) {
-          if (!_this.$props.sort) {
+          if (!this.$props.sort) {
             return null;
           }
-          return iconSortIndex >= 0 && [h("span", {
+          return iconSortIndex >= 0 && [h(kendo_vue_common_1.Icon, {
             key: 1,
-            "class": 'k-icon k-i-sort-' + _this.$props.sort[iconSortIndex].dir + '-sm'
-          }), _this.$props.sort.length > 1 && h("span", {
+            name: "sort-".concat(this.$props.sort[iconSortIndex].dir, "-small"),
+            attrs: this.v3 ? undefined : {
+              name: "sort-".concat(this.$props.sort[iconSortIndex].dir, "-small")
+            }
+          }), this.$props.sort.length > 1 && h("span", {
             key: 2,
             "class": "k-sort-order"
           }, [iconSortIndex + 1])];
         };
-        var sortIcon = sortIconRenderer(sortIndex);
+        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 columnMenuRender = !columnMenu || typeof columnMenu === 'boolean' ? !!columnMenu : this.getTemplate(columnMenu);
@@ -333,6 +338,36 @@ var HeaderRowVue2 = {
               render: (column.headerCell || _this2.$props.cellRender) && _this2.getTemplate(column.headerCell || _this2.$props.cellRender)
             }, _this2.v3 ? function () {
               return [sortIcon];
+            } : [sortIcon])]) || column.field === _this2.$props.selectedField && h("span", {
+              "class": 'k-cell-inner'
+            }, [
+            // @ts-ignore function children
+            h(HeaderSelectionCell_1.HeaderSelectionCell, {
+              key: 1,
+              field: column.field,
+              attrs: _this2.v3 ? undefined : {
+                field: column.field,
+                sortable: sortable,
+                selectionValue: column.headerSelectionValue,
+                title: column.title,
+                render: (column.headerCell || _this2.$props.cellRender) && _this2.getTemplate(column.headerCell || _this2.$props.cellRender)
+              },
+              sortable: sortable,
+              onHeadercellclick: function onHeadercellclick(e) {
+                return _this.cellClick(e, column);
+              },
+              on: _this2.v3 ? undefined : {
+                "headercellclick": function onHeadercellclick(e) {
+                  return _this.cellClick(e, column);
+                },
+                "selectionchange": _this2.selectionChangeHandler
+              },
+              onSelectionchange: _this2.selectionChangeHandler,
+              selectionValue: column.headerSelectionValue,
+              title: column.title,
+              render: (column.headerCell || _this2.$props.cellRender) && _this2.getTemplate(column.headerCell || _this2.$props.cellRender)
+            }, _this2.v3 ? function () {
+              return [sortIcon];
             } : [sortIcon])]) || h("span", {
               "class": 'k-cell-inner'
             }, [
@@ -438,6 +473,34 @@ var HeaderRowVue2 = {
             render: (column.headerCell || _this2.$props.cellRender) && _this2.getTemplate(column.headerCell || _this2.$props.cellRender)
           }, _this2.v3 ? function () {
             return [sortIcon];
+          } : [sortIcon])]) || column.field === _this2.$props.selectedField && h("span", {
+            "class": 'k-cell-inner'
+          }, [h(HeaderSelectionCell_1.HeaderSelectionCell, {
+            key: 1,
+            field: column.field,
+            attrs: _this2.v3 ? undefined : {
+              field: column.field,
+              sortable: sortable,
+              selectionValue: column.headerSelectionValue,
+              title: column.title,
+              render: (column.headerCell || _this2.$props.cellRender) && _this2.getTemplate(column.headerCell || _this2.$props.cellRender)
+            },
+            sortable: sortable,
+            onHeadercellclick: function onHeadercellclick(e) {
+              return _this.cellClick(e, column);
+            },
+            on: _this2.v3 ? undefined : {
+              "headercellclick": function onHeadercellclick(e) {
+                return _this.cellClick(e, column);
+              },
+              "selectionchange": _this2.selectionChangeHandler
+            },
+            onSelectionchange: _this2.selectionChangeHandler,
+            selectionValue: column.headerSelectionValue,
+            title: column.title,
+            render: (column.headerCell || _this2.$props.cellRender) && _this2.getTemplate(column.headerCell || _this2.$props.cellRender)
+          }, _this2.v3 ? function () {
+            return [sortIcon];
           } : [sortIcon])]) || h("span", {
             "class": 'k-cell-inner'
           }, [h(HeaderCell_1.HeaderCell, {

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

@@ -9,6 +9,7 @@ import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } fr
  */
 export interface HeaderSelectionCellMethods extends Vue2type {
     changeHandle: (e: any) => void;
+    clickHandler: (e: any) => void;
 }
 /**
  * @hidden

package/dist/npm/header/HeaderSelectionCell.js

@@ -10,6 +10,8 @@ var allVue = Vue;
 var gh = allVue.h;
 var isV3 = allVue.version && allVue.version[0] === '3';
 var kendo_vue_common_1 = require("@progress/kendo-vue-common");
+var kendo_vue_intl_1 = require("@progress/kendo-vue-intl");
+var main_1 = require("../messages/main");
 /**
  * @hidden
  */
@@ -17,9 +19,20 @@ var HeaderSelectionCellVue2 = {
   props: {
     field: String,
     title: String,
+    sortable: [Boolean, Object],
     selectionValue: Boolean,
     render: [Object, Function, String]
   },
+  // @ts-ignore
+  emits: {
+    selectionchange: null,
+    headercellclick: null
+  },
+  inject: {
+    kendoLocalizationService: {
+      default: null
+    }
+  },
   created: function created() {
     this.inputId = (0, kendo_vue_common_1.guid)();
   },
@@ -29,6 +42,11 @@ var HeaderSelectionCellVue2 = {
         field: this.$props.field,
         event: e
       });
+    },
+    clickHandler: function clickHandler(event) {
+      if (this.$props.sortable) {
+        this.$emit('headercellclick', event);
+      }
     }
   },
   // @ts-ignore
@@ -41,8 +59,11 @@ var HeaderSelectionCellVue2 = {
   // @ts-ignore
   render: function render(createElement) {
     var h = gh || createElement;
+    var defaultSlot = (0, kendo_vue_common_1.getDefaultSlots)(this);
     var renderTemplate = this.$props.render;
-    var defaultRendering = h("span", [[h("input", {
+    var ls = (0, kendo_vue_intl_1.provideLocalizationService)(this);
+    var selectAllRowsMessage = ls.toLanguageString(main_1.selectAllRows, main_1.messages[main_1.selectAllRows]);
+    var input = h("input", {
       key: 0,
       checked: this.v3 ? this.$props.selectionValue : null,
       domProps: this.v3 ? undefined : {
@@ -51,31 +72,40 @@ var HeaderSelectionCellVue2 = {
       id: this.inputId,
       attrs: this.v3 ? undefined : {
         id: this.inputId,
-        type: "checkbox"
+        type: "checkbox",
+        "aria-label": selectAllRowsMessage
       },
       type: "checkbox",
       "class": "k-checkbox k-checkbox-md k-rounded-md",
+      "aria-label": selectAllRowsMessage,
       onChange: this.changeHandle,
       on: this.v3 ? undefined : {
         "change": this.changeHandle
       }
-    }), h("label", {
-      key: 1,
-      "class": "k-checkbox-label",
-      "for": this.inputId,
-      attrs: this.v3 ? undefined : {
-        "for": this.inputId
-      }
-    })]]);
-    return kendo_vue_common_1.getTemplate.call(this, {
+    });
+    var defaultRendering = kendo_vue_common_1.getTemplate.call(this, {
       h: h,
       template: renderTemplate,
-      defaultRendering: defaultRendering,
+      defaultRendering: input,
       additionalProps: this.$props,
       additionalListeners: {
+        click: this.clickHandler,
         selectionchange: this.changeHandle
       }
     });
+    return h("span", {
+      "class": "k-link",
+      onClick: this.clickHandler,
+      on: this.v3 ? undefined : {
+        "click": this.clickHandler
+      }
+    }, [h("span", {
+      "class": "k-column-title",
+      title: this.$props.title,
+      attrs: this.v3 ? undefined : {
+        title: this.$props.title
+      }
+    }, [defaultRendering]), defaultSlot]);
   }
 };
 exports.HeaderSelectionCellVue2 = HeaderSelectionCellVue2;

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

@@ -254,6 +254,10 @@ export declare const columnMenuFilterOrLogic = "columnMenu.filterOrLogic";
  * @hidden
  */
 export declare const searchPlaceholder = "grid.searchPlaceholder";
+/**
+ * @hidden
+ */
+export declare const selectAllRows = "grid.selectAllRows";
 /**
  * @hidden
  */
@@ -317,6 +321,7 @@ export declare const messages: {
     "pager.of": string;
     "pager.totalPages": string;
     "grid.searchPlaceholder": string;
+    "grid.selectAllRows": string;
     "grid.filterCheckAll": string;
     "sort.ariaLabel": string;
     "filter.ariaLabel": string;

package/dist/npm/messages/main.js

@@ -2,7 +2,7 @@
 var _a;
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.columnMenuFilterContainsOperator = exports.columnMenuFilterStartsWithOperator = exports.columnMenuFilterIsNotEmptyOperator = exports.columnMenuFilterIsEmptyOperator = exports.columnMenuFilterIsNotNullOperator = exports.columnMenuFilterIsNullOperator = exports.columnMenuFilterNotEqOperator = exports.columnMenuFilterEqOperator = exports.columnMenuSortDescending = exports.columnMenuSortAscending = exports.columnMenuFilterTitle = exports.columnMenuFilterSubmitButton = exports.columnMenuFilterClearButton = exports.columnMenuFilterChooseOperator = exports.filterClose = exports.filterAddGroup = exports.filterAddExpression = exports.filterOrLogic = exports.filterAndLogic = exports.filterBeforeOrEqualOperator = exports.filterBeforeOperator = exports.filterAfterOperator = exports.filterAfterOrEqualOperator = exports.filterIsFalse = exports.filterIsTrue = exports.filterLtOperator = exports.filterLteOperator = exports.filterGtOperator = exports.filterGteOperator = exports.filterEndsWithOperator = exports.filterNotContainsOperator = exports.filterContainsOperator = exports.filterStartsWithOperator = exports.filterIsNotEmptyOperator = exports.filterIsEmptyOperator = exports.filterIsNotNullOperator = exports.filterIsNullOperator = exports.filterNotEqOperator = exports.filterEqOperator = exports.pagerTotalPages = exports.pagerOf = exports.pagerPage = exports.pagerPageSelection = exports.pagerItemPerPage = exports.pagerLastPage = exports.pagerNextPage = exports.pagerPreviousPage = exports.pagerFirstPage = exports.pagerInfo = exports.columnMenu = void 0;
-exports.messages = exports.filterDropDownOperatorAriaLabel = exports.filterDateFilterAriaLabel = exports.filterTextFilterAriaLabel = exports.filterNumericFilterAriaLabel = exports.filterEnumFilterDropdownAriaLabel = exports.filterExpressionOperatorDropdownAriaLabel = exports.filterExpressionDropdownAriaLabel = exports.filterExpressionAriaLabel = exports.filterGroupAriaLabel = exports.filterAriaLabel = exports.sortAriaLabel = exports.filterCheckAll = exports.searchPlaceholder = exports.columnMenuFilterOrLogic = exports.columnMenuFilterAndLogic = exports.columnMenuFilterBeforeOrEqualOperator = exports.columnMenuFilterBeforeOperator = exports.columnMenuFilterAfterOperator = exports.columnMenuFilterAfterOrEqualOperator = exports.columnMenuFilterIsTrue = exports.columnMenuFilterLtOperator = exports.columnMenuFilterLteOperator = exports.columnMenuFilterGtOperator = exports.columnMenuFilterGteOperator = exports.columnMenuFilterEndsWithOperator = exports.columnMenuFilterNotContainsOperator = void 0;
+exports.messages = exports.filterDropDownOperatorAriaLabel = exports.filterDateFilterAriaLabel = exports.filterTextFilterAriaLabel = exports.filterNumericFilterAriaLabel = exports.filterEnumFilterDropdownAriaLabel = exports.filterExpressionOperatorDropdownAriaLabel = exports.filterExpressionDropdownAriaLabel = exports.filterExpressionAriaLabel = exports.filterGroupAriaLabel = exports.filterAriaLabel = exports.sortAriaLabel = exports.filterCheckAll = exports.selectAllRows = exports.searchPlaceholder = exports.columnMenuFilterOrLogic = exports.columnMenuFilterAndLogic = exports.columnMenuFilterBeforeOrEqualOperator = exports.columnMenuFilterBeforeOperator = exports.columnMenuFilterAfterOperator = exports.columnMenuFilterAfterOrEqualOperator = exports.columnMenuFilterIsTrue = exports.columnMenuFilterLtOperator = exports.columnMenuFilterLteOperator = exports.columnMenuFilterGtOperator = exports.columnMenuFilterGteOperator = exports.columnMenuFilterEndsWithOperator = exports.columnMenuFilterNotContainsOperator = void 0;
 /**
  * @hidden
  */
@@ -259,6 +259,10 @@ exports.columnMenuFilterOrLogic = 'columnMenu.filterOrLogic';
  * @hidden
  */
 exports.searchPlaceholder = 'grid.searchPlaceholder';
+/**
+ * @hidden
+ */
+exports.selectAllRows = 'grid.selectAllRows';
 /**
  * @hidden
  */
@@ -322,6 +326,7 @@ exports.messages = (_a = {},
     _a[exports.pagerOf] = 'Of',
     _a[exports.pagerTotalPages] = '{0}',
     _a[exports.searchPlaceholder] = 'Search',
+    _a[exports.selectAllRows] = 'Select All Rows',
     _a[exports.filterCheckAll] = 'Check All',
     _a[exports.sortAriaLabel] = 'Sortable',
     _a[exports.filterAriaLabel] = 'Filter',

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: 1669818534,
+    publishDate: 1672389924,
     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.js

@@ -108,7 +108,6 @@ var PagerVue2 = {
     wrapperClass: {
       get: function get() {
         return {
-          'k-widget': true,
           'k-pager': true,
           'k-pager-sm': this.size === 'small',
           'k-pager-md': this.size === 'medium'

package/dist/npm/pager/PagerNavigationButton.js

@@ -9,6 +9,7 @@ var Vue = require("vue");
 var allVue = Vue;
 var gh = allVue.h;
 var isV3 = allVue.version && allVue.version[0] === '3';
+var kendo_vue_common_1 = require("@progress/kendo-vue-common");
 /**
  * @hidden
  */
@@ -19,11 +20,6 @@ var PagerNavigationButtonVue2 = {
     icon: String,
     page: Number
   },
-  computed: {
-    iconClass: function iconClass() {
-      return 'k-icon k-i-' + this.icon;
-    }
-  },
   inject: {
     kendoLocalizationService: {
       default: null
@@ -64,8 +60,11 @@ var PagerNavigationButtonVue2 = {
       role: "button",
       title: this.$props.title,
       "aria-label": this.$props.title
-    }, [h("span", {
-      "class": this.iconClass
+    }, [h(kendo_vue_common_1.Icon, {
+      name: this.icon,
+      attrs: this.v3 ? undefined : {
+        name: this.icon
+      }
     })]);
   }
 };

package/dist/npm/selection/utils.js

@@ -82,11 +82,10 @@ exports.getColumnIndex = getColumnIndex;
  */
 var setSelectedState = function (options) {
     var subItemsField = options.subItemsField || GROUP_SUBITEMS_COLLECTION;
-    var idGetter = (0, kendo_vue_common_1.getter)(options.dataItemKey);
     return (0, kendo_vue_common_1.mapTree)(options.data, subItemsField, function (item) {
         var _a;
         return (0, kendo_vue_common_1.extendDataItem)(item, subItemsField, (_a = {},
-            _a[options.selectedField] = options.selectedState[idGetter(item)],
+            _a[options.selectedField] = options.selectedState[item[options.dataItemKey]],
             _a));
     });
 };
@@ -143,12 +142,11 @@ exports.getSelectedStateFromKeyDown = getSelectedStateFromKeyDown;
 var getSelectedState = function (options) {
     var event = options.event, dataItemKey = options.dataItemKey, prevSelectedState = options.selectedState;
     var dataItems = event.dataItems, startRowIndex = event.startRowIndex, endRowIndex = event.endRowIndex, startColIndex = event.startColIndex, endColIndex = event.endColIndex, cell = event.cell, isDrag = event.isDrag, ctrlKey = event.ctrlKey, shiftKey = event.shiftKey, metaKey = event.metaKey, componentId = event.componentId, mode = event.mode, dataItem = event.dataItem;
-    var idGetter = (0, kendo_vue_common_1.getter)(dataItemKey);
     var selectionState = {};
     var isInputEvent = dataItem !== null;
     if (mode === 'single') {
         var currentDataItem = dataItems.slice(startRowIndex, startRowIndex + 1)[0];
-        var itemId = idGetter(currentDataItem);
+        var itemId = currentDataItem[dataItemKey];
         LAST_SELECTION_STATE[componentId] = {
             rowIndex: startRowIndex,
             colIndex: startColIndex
@@ -168,7 +166,7 @@ var getSelectedState = function (options) {
         }
         var selectedDataItems = dataItems.slice(startRowIndex, endRowIndex + 1);
         selectedDataItems.forEach(function (currentItem) {
-            var itemId = idGetter(currentItem);
+            var itemId = currentItem[dataItemKey];
             selectionState[itemId] = cell ? __spreadArray([], selectedColumns_1, true) : true;
         });
     }
@@ -180,7 +178,7 @@ var getSelectedState = function (options) {
             };
             var selectedDataItems = dataItems.slice(startRowIndex, endRowIndex + 1);
             var currentDataItem = selectedDataItems[0];
-            var itemId = idGetter(currentDataItem);
+            var itemId = currentDataItem[dataItemKey];
             selectionState = __assign({}, prevSelectedState);
             selectionState[itemId] = cell && !isInputEvent
                 ? getCellSelection(selectionState[itemId], startColIndex)
@@ -199,7 +197,7 @@ var getSelectedState = function (options) {
             }
             var selectedDataItems = dataItems.slice(currentStartRowIndex, currentEndRowIndex + 1);
             selectedDataItems.forEach(function (currentItem) {
-                var itemId = idGetter(currentItem);
+                var itemId = currentItem[dataItemKey];
                 selectionState[itemId] = cell ? __spreadArray([], selectedColumns_2, true) : true;
             });
         }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@progress/kendo-vue-data-tools",
   "description": "Kendo UI for Vue Data Tools package",
-  "version": "3.7.4-dev.202211301436",
+  "version": "3.7.4-dev.202212300853",
   "repository": {
     "type": "git",
     "url": "https://github.com/telerik/kendo-vue.git"
@@ -18,7 +18,7 @@
   },
   "scripts": {
     "test": "cd ../../ && npm run test -- --testPathPattern=/packages/datatools/.*",
-    "start": "gulp start",
+    "start": "gulp start --notsc",
     "build-package": "gulp build-package"
   },
   "homepage": "https://www.telerik.com/kendo-vue-ui/",
@@ -45,21 +45,21 @@
     "vue": "^2.6.12 || ^3.0.2"
   },
   "dependencies": {
-    "@progress/kendo-vue-common": "3.7.4-dev.202211301436"
+    "@progress/kendo-vue-common": "3.7.4-dev.202212300853"
   },
   "devDependencies": {
     "@progress/kendo-data-query": "^1.0.0",
     "@progress/kendo-date-math": "^1.4.1",
     "@progress/kendo-drawing": "^1.8.0",
     "@progress/kendo-licensing": "^1.1.1",
-    "@progress/kendo-vue-animation": "3.7.4-dev.202211301436",
-    "@progress/kendo-vue-buttons": "3.7.4-dev.202211301436",
-    "@progress/kendo-vue-dateinputs": "3.7.4-dev.202211301436",
-    "@progress/kendo-vue-dropdowns": "3.7.4-dev.202211301436",
-    "@progress/kendo-vue-grid": "3.7.4-dev.202211301436",
-    "@progress/kendo-vue-inputs": "3.7.4-dev.202211301436",
-    "@progress/kendo-vue-intl": "3.7.4-dev.202211301436",
-    "@progress/kendo-vue-popup": "3.7.4-dev.202211301436"
+    "@progress/kendo-vue-animation": "3.7.4-dev.202212300853",
+    "@progress/kendo-vue-buttons": "3.7.4-dev.202212300853",
+    "@progress/kendo-vue-dateinputs": "3.7.4-dev.202212300853",
+    "@progress/kendo-vue-dropdowns": "3.7.4-dev.202212300853",
+    "@progress/kendo-vue-grid": "3.7.4-dev.202212300853",
+    "@progress/kendo-vue-inputs": "3.7.4-dev.202212300853",
+    "@progress/kendo-vue-intl": "3.7.4-dev.202212300853",
+    "@progress/kendo-vue-popup": "3.7.4-dev.202212300853"
   },
   "@progress": {
     "friendlyName": "Data Tools",