@progress/kendo-vue-dropdowns 3.11.0-dev.202305230623 → 3.11.0-dev.202305230751

package/dist/npm/common/List.js

@@ -12,6 +12,7 @@ var isV3 = allVue.version && allVue.version[0] === '3';
 var ref = allVue.ref;
 var inject = allVue.inject;
 var ListItem_1 = require("./ListItem");
+var ListGroupItem_1 = require("./ListGroupItem");
 var utils_1 = require("./utils");
 var kendo_vue_common_1 = require("@progress/kendo-vue-common");
 var kendo_vue_intl_1 = require("@progress/kendo-vue-intl");
@@ -44,8 +45,10 @@ var ListVue2 = {
       default: true
     },
     itemRender: [String, Function, Object],
+    groupHeaderItemRender: [String, Function, Object],
     noDataRender: [String, Function, Object],
-    scroller: Boolean
+    scroller: Boolean,
+    groupField: String
   },
   inject: {
     kendoLocalizationService: {
@@ -107,39 +110,64 @@ var ListVue2 = {
         focusedIndex = _a.focusedIndex,
         highlightSelected = _a.highlightSelected,
         value = _a.value,
-        itemRender = _a.itemRender;
+        groupField = _a.groupField,
+        itemRender = _a.itemRender,
+        groupHeaderItemRender = _a.groupHeaderItemRender,
+        dataItems = _a.dataItems;
       var isArray = Array.isArray(value);
-      return this.$props.dataItems.map(function (item, index) {
+      var groupCounter = 0;
+      return dataItems.map(function (item, index) {
         var realIndex = skip + index;
         var selected = highlightSelected && (!isArray && (0, utils_1.areSame)(item, value, valueField) || isArray && value.findIndex(function (i) {
           return (0, utils_1.areSame)(i, item, valueField);
         }) !== -1);
-        return (
-          // @ts-ignore
-          h(ListItem_1.ListItem, {
+        var group = undefined;
+        var current, previous;
+        if (index > 0 && groupField !== undefined) {
+          current = (0, utils_1.getItemValue)(item, groupField);
+          previous = (0, utils_1.getItemValue)(dataItems[index - 1], groupField);
+          if (current && previous && current !== previous !== undefined) {
+            group = current;
+          }
+        }
+        if (group !== undefined && Object.keys(item).length === 1) {
+          groupCounter += 1;
+        }
+        return group !== undefined && item[groupField] !== undefined && Object.keys(item).length === 1 ? h(ListGroupItem_1.ListGroupItem, {
+          id: "option-".concat(optionsGuid, "-").concat(realIndex),
+          attrs: this.v3 ? undefined : {
+            id: "option-".concat(optionsGuid, "-").concat(realIndex),
+            group: group,
+            render: groupHeaderItemRender
+          },
+          key: realIndex + '-group-item',
+          group: group,
+          render: groupHeaderItemRender
+        }) : h(ListItem_1.ListItem, {
+          id: "option-".concat(optionsGuid, "-").concat(realIndex),
+          attrs: this.v3 ? undefined : {
             id: "option-".concat(optionsGuid, "-").concat(realIndex),
-            attrs: this.v3 ? undefined : {
-              id: "option-".concat(optionsGuid, "-").concat(realIndex),
-              dataItem: item,
-              selected: selected,
-              focused: focusedIndex === index,
-              index: realIndex,
-              textField: textField,
-              render: itemRender
-            },
             dataItem: item,
             selected: selected,
-            focused: focusedIndex === index,
-            index: realIndex,
-            key: realIndex,
-            onItemclick: this.handleClick,
-            on: this.v3 ? undefined : {
-              "itemclick": this.handleClick
-            },
+            focused: focusedIndex === realIndex - groupCounter,
+            index: realIndex - groupCounter,
             textField: textField,
+            group: group,
             render: itemRender
-          })
-        );
+          },
+          dataItem: item,
+          selected: selected,
+          focused: focusedIndex === realIndex - groupCounter,
+          index: realIndex - groupCounter,
+          key: realIndex - groupCounter,
+          onItemclick: this.handleClick,
+          on: this.v3 ? undefined : {
+            "itemclick": this.handleClick
+          },
+          textField: textField,
+          group: group,
+          render: itemRender
+        });
       }, this);
     };
     var items = renderItems.call(this);

package/dist/npm/common/ListGroupItem.d.ts

@@ -0,0 +1,41 @@
+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;
+};
+/**
+ * Represents the props of the ListItem component.
+ */
+export interface ListGroupItemProps {
+    /**
+     * Specifies the id that will be added to the group header item element.
+     */
+    id?: string;
+    /**
+     * The group that will be rendered.
+     */
+    group?: string;
+    /**
+     * @hidden
+     */
+    virtual?: boolean;
+    /**
+     * Fires when the group header item is about to be rendered. Used to override the default appearance of the group header item.
+     */
+    render?: any;
+}
+/**
+ * @hidden
+ */
+export interface ListItemAll extends Vue2type {
+    itemClass: object;
+}
+/**
+ * @hidden
+ */
+declare let ListGroupItemVue2: ComponentOptions<Vue2type, DefaultData<{}>, DefaultMethods<ListItemAll>, {}, RecordPropsDefinition<ListGroupItemProps>>;
+/**
+ * @hidden
+ */
+declare const ListGroupItem: DefineComponent<ListGroupItemProps, any, {}, {}, {}, {}, {}, {}, string, ListGroupItemProps, ListGroupItemProps, {}>;
+export { ListGroupItem, ListGroupItemVue2 };

package/dist/npm/common/ListGroupItem.js

@@ -0,0 +1,78 @@
+"use strict";
+
+var __assign = undefined && undefined.__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);
+};
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ListGroupItemVue2 = exports.ListGroupItem = void 0;
+// @ts-ignore
+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
+ */
+var ListGroupItemVue2 = {
+  name: 'KendoListItem',
+  inheritAttrs: false,
+  props: {
+    id: String,
+    group: String,
+    render: Object
+  },
+  // @ts-ignore
+  setup: !isV3 ? undefined : function () {
+    var v3 = !!isV3;
+    return {
+      v3: v3
+    };
+  },
+  // @ts-ignore
+  render: function render(createElement) {
+    var h = gh || createElement;
+    var _a = this.$props,
+      id = _a.id,
+      group = _a.group,
+      virtual = _a.virtual,
+      renderer = _a.render;
+    var defaultRendering = h("li", {
+      id: id,
+      attrs: this.v3 ? undefined : {
+        id: id,
+        role: "group"
+      },
+      role: "group",
+      "class": 'k-list-group-item',
+      style: {
+        position: virtual ? 'relative' : 'unset'
+      }
+    }, [h("span", {
+      "class": !renderer ? 'k-list-item-text' : undefined
+    }, [group])]);
+    return kendo_vue_common_1.getTemplate.call(this, {
+      h: h,
+      template: this.$props.render,
+      defaultRendering: defaultRendering,
+      additionalProps: __assign({}, this.$props)
+    });
+  }
+};
+exports.ListGroupItemVue2 = ListGroupItemVue2;
+/**
+ * @hidden
+ */
+var ListGroupItem = ListGroupItemVue2;
+exports.ListGroupItem = ListGroupItem;

package/dist/npm/common/settings.d.ts

@@ -92,6 +92,7 @@ export interface DropDownStateBase {
     value?: any;
     focused?: boolean;
     opened?: boolean;
+    group?: string;
 }
 /**
  * @hidden

package/dist/npm/package-metadata.js

@@ -8,7 +8,7 @@ exports.packageMetadata = {
     name: '@progress/kendo-vue-dropdowns',
     productName: 'Kendo UI for Vue',
     productCodes: ['KENDOUIVUE', 'KENDOUICOMPLETE'],
-    publishDate: 1684822401,
+    publishDate: 1684827665,
     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/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@progress/kendo-vue-dropdowns",
   "description": "Kendo UI for Vue Dropdowns package",
-  "version": "3.11.0-dev.202305230623",
+  "version": "3.11.0-dev.202305230751",
   "repository": {
     "type": "git",
     "url": "https://github.com/telerik/kendo-vue.git"
@@ -53,19 +53,19 @@
     "vue": "^2.6.12 || ^3.0.2"
   },
   "dependencies": {
-    "@progress/kendo-vue-buttons": "3.11.0-dev.202305230623",
-    "@progress/kendo-vue-common": "3.11.0-dev.202305230623",
-    "@progress/kendo-vue-popup": "3.11.0-dev.202305230623"
+    "@progress/kendo-vue-buttons": "3.11.0-dev.202305230751",
+    "@progress/kendo-vue-common": "3.11.0-dev.202305230751",
+    "@progress/kendo-vue-popup": "3.11.0-dev.202305230751"
   },
   "devDependencies": {
     "@progress/kendo-data-query": "^1.5.4",
     "@progress/kendo-licensing": "^1.3.0",
     "@progress/kendo-svg-icons": "^1.0.0",
-    "@progress/kendo-vue-data-tools": "3.11.0-dev.202305230623",
-    "@progress/kendo-vue-inputs": "3.11.0-dev.202305230623",
-    "@progress/kendo-vue-intl": "3.11.0-dev.202305230623",
-    "@progress/kendo-vue-labels": "3.11.0-dev.202305230623",
-    "@progress/kendo-vue-treeview": "3.11.0-dev.202305230623"
+    "@progress/kendo-vue-data-tools": "3.11.0-dev.202305230751",
+    "@progress/kendo-vue-inputs": "3.11.0-dev.202305230751",
+    "@progress/kendo-vue-intl": "3.11.0-dev.202305230751",
+    "@progress/kendo-vue-labels": "3.11.0-dev.202305230751",
+    "@progress/kendo-vue-treeview": "3.11.0-dev.202305230751"
   },
   "author": "Progress",
   "license": "SEE LICENSE IN LICENSE.md",