@progress/kendo-vue-dropdowns 4.3.1-dev.202402011147 → 4.3.1-dev.202402201046

package/dist/es/AutoComplete/AutoComplete.js

@@ -155,6 +155,7 @@ var AutoCompleteVue2 = {
       suggested: '',
       group: undefined,
       isScrolling: false,
+      popupWidth: undefined,
       itemHeight: 0
     };
   },
@@ -718,7 +719,6 @@ var AutoCompleteVue2 = {
         template: footerTemplate
       });
       var opened = this.$props.opened !== undefined ? this.$props.opened : this.currentOpened;
-      var popupWidth = popupSettings.width !== undefined ? popupSettings.width : base.popupWidth;
       var dataItems = this.$props.dataItems || [];
       if (this.group === undefined && this.$props.groupField !== undefined) {
         this.group = getItemValue(dataItems[0], this.$props.groupField);
@@ -734,9 +734,9 @@ var AutoCompleteVue2 = {
               return e.preventDefault();
             }
           },
-          width: popupWidth,
+          width: this.popupWidth,
           attrs: this.v3 ? undefined : {
-            width: popupWidth,
+            width: this.popupWidth,
             popupSettings: __assign(__assign({}, popupSettings), {
               anchor: this.anchor,
               show: opened,

package/dist/es/ComboBox/ComboBox.js

@@ -215,6 +215,7 @@ var ComboBoxVue2 = {
       isScrolling: false,
       itemHeight: 0,
       state: undefined,
+      popupWidth: undefined,
       windowWidth: 0
     };
   },
@@ -1091,7 +1092,6 @@ var ComboBoxVue2 = {
       var groupStickyHeaderTemplate = templateRendering.call(this, this.$props.groupStickyHeaderItemRender, getListeners.call(this));
       var headerListContainer = base.getTemplateDef.call(this, header);
       var footerListContainer = base.getTemplateDef.call(this, footer);
-      var popupWidth = popupSettings.width !== undefined ? popupSettings.width : base.popupWidth;
       var dataItems = this.$props.dataItems || [];
       if (this.group === undefined && this.$props.groupField !== undefined) {
         this.group = getItemValue(dataItems[0], this.$props.groupField);
@@ -1108,9 +1108,9 @@ var ComboBoxVue2 = {
               return e.preventDefault();
             }
           },
-          width: popupWidth,
+          width: this.popupWidth,
           attrs: this.v3 ? undefined : {
-            width: popupWidth,
+            width: this.popupWidth,
             popupSettings: __assign(__assign({}, popupSettings), {
               anchor: this.anchor,
               show: opened,

package/dist/es/DropDownList/DropDownList.js

@@ -204,6 +204,7 @@ var DropDownListVue2 = {
       isScrolling: false,
       itemHeight: 0,
       state: undefined,
+      popupWidth: undefined,
       windowWidth: 0
     };
   },
@@ -1123,7 +1124,6 @@ var DropDownListVue2 = {
       var groupStickyHeaderTemplate = templateRendering.call(this, this.$props.groupStickyHeaderItemRender, getListeners.call(this));
       var headerListContainer = base.getTemplateDef.call(this, header);
       var footerListContainer = base.getTemplateDef.call(this, footer);
-      var popupWidth = popupSettings.width !== undefined ? popupSettings.width : base.popupWidth;
       return (
         // @ts-ignore  function children
         h(ListContainer, {
@@ -1138,7 +1138,7 @@ var DropDownListVue2 = {
           dir: dir !== undefined ? dir : base.dirCalculated,
           attrs: this.v3 ? undefined : {
             dir: dir !== undefined ? dir : base.dirCalculated,
-            width: popupWidth
+            width: this.popupWidth
             // @ts-ignore
             ,
             popupSettings: __assign(__assign({}, popupSettings), {
@@ -1148,7 +1148,7 @@ var DropDownListVue2 = {
               show: opened
             })
           },
-          width: popupWidth,
+          width: this.popupWidth,
           popupSettings: __assign(__assign({}, popupSettings), {
             popupClass: classNames(popupSettings.popupClass, 'k-list', (_a = {}, _a["k-list-".concat(sizeMap[size] || size)] = size, _a['k-virtual-list'] = this.base.vs.enabled, _a)),
             className: classNames('k-list-container', popupSettings.className),

package/dist/es/MultiSelect/MultiSelect.js

@@ -294,6 +294,7 @@ var MultiSelectVue2 = {
       isScrolling: false,
       itemHeight: 0,
       windowWidth: 0,
+      popupWidth: undefined,
       initialAdaptiveRenderingValues: undefined
     };
   },
@@ -1180,7 +1181,6 @@ var MultiSelectVue2 = {
       var headerListContainer = base.getTemplateDef.call(this, header);
       var footerListContainer = base.getTemplateDef.call(this, footer);
       var currentText = this.$props.filter !== undefined ? this.$props.filter : this.currentText;
-      var popupWidth = popupSettings.width !== undefined ? popupSettings.width : base.popupWidth;
       var focusedType = this.getFocusedState().focusedType;
       var customItem = allowCustom && currentText && h("div", {
         "class": "k-list",
@@ -1219,7 +1219,7 @@ var MultiSelectVue2 = {
           dir: dir !== undefined ? dir : base.dirCalculated,
           attrs: this.v3 ? undefined : {
             dir: dir !== undefined ? dir : base.dirCalculated,
-            width: popupWidth,
+            width: this.popupWidth,
             popupSettings: __assign(__assign({}, popupSettings), {
               anchor: this.anchor,
               show: opened,
@@ -1231,7 +1231,7 @@ var MultiSelectVue2 = {
             itemsCount: dataItems.length
           },
           onBlur: this.handleBlur,
-          width: popupWidth,
+          width: this.popupWidth,
           popupSettings: __assign(__assign({}, popupSettings), {
             anchor: this.anchor,
             show: opened,

package/dist/es/common/DropDownBase.d.ts

@@ -48,6 +48,7 @@ export interface DropDownComponent {
     value: any;
     currentOpened: boolean;
     currentFocused: boolean;
+    popupWidth: string;
 }
 /**
  * @hidden

package/dist/es/common/DropDownBase.js

@@ -165,8 +165,12 @@ var DropDownBase = /** @class */function () {
     }
   };
   DropDownBase.prototype.calculatePopupWidth = function () {
-    if (this.wrapper && !this.popupWidth) {
-      this.popupWidth = this.wrapper.offsetWidth + 'px';
+    // @ts-ignore
+    var props = this.component.$props;
+    var popupSettings = props.popupSettings || {};
+    var popupWidth = popupSettings.width;
+    if (this.wrapper && !popupWidth) {
+      this.component.popupWidth = props.popupSettings.width !== undefined ? props.popupSettings.width : this.wrapper.offsetWidth + 'px';
     }
   };
   DropDownBase.prototype.scrollToItem = function (itemIndex, vsEnabled) {

package/dist/es/package-metadata.js

@@ -5,7 +5,7 @@ export var packageMetadata = {
     name: '@progress/kendo-vue-dropdowns',
     productName: 'Kendo UI for Vue',
     productCodes: ['KENDOUIVUE', 'KENDOUICOMPLETE'],
-    publishDate: 1706787509,
+    publishDate: 1708425453,
     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/esm/AutoComplete/AutoComplete.js

@@ -155,6 +155,7 @@ var AutoCompleteVue2 = {
       suggested: '',
       group: undefined,
       isScrolling: false,
+      popupWidth: undefined,
       itemHeight: 0
     };
   },
@@ -718,7 +719,6 @@ var AutoCompleteVue2 = {
         template: footerTemplate
       });
       var opened = this.$props.opened !== undefined ? this.$props.opened : this.currentOpened;
-      var popupWidth = popupSettings.width !== undefined ? popupSettings.width : base.popupWidth;
       var dataItems = this.$props.dataItems || [];
       if (this.group === undefined && this.$props.groupField !== undefined) {
         this.group = getItemValue(dataItems[0], this.$props.groupField);
@@ -734,9 +734,9 @@ var AutoCompleteVue2 = {
               return e.preventDefault();
             }
           },
-          width: popupWidth,
+          width: this.popupWidth,
           attrs: this.v3 ? undefined : {
-            width: popupWidth,
+            width: this.popupWidth,
             popupSettings: __assign(__assign({}, popupSettings), {
               anchor: this.anchor,
               show: opened,

package/dist/esm/ComboBox/ComboBox.js

@@ -215,6 +215,7 @@ var ComboBoxVue2 = {
       isScrolling: false,
       itemHeight: 0,
       state: undefined,
+      popupWidth: undefined,
       windowWidth: 0
     };
   },
@@ -1091,7 +1092,6 @@ var ComboBoxVue2 = {
       var groupStickyHeaderTemplate = templateRendering.call(this, this.$props.groupStickyHeaderItemRender, getListeners.call(this));
       var headerListContainer = base.getTemplateDef.call(this, header);
       var footerListContainer = base.getTemplateDef.call(this, footer);
-      var popupWidth = popupSettings.width !== undefined ? popupSettings.width : base.popupWidth;
       var dataItems = this.$props.dataItems || [];
       if (this.group === undefined && this.$props.groupField !== undefined) {
         this.group = getItemValue(dataItems[0], this.$props.groupField);
@@ -1108,9 +1108,9 @@ var ComboBoxVue2 = {
               return e.preventDefault();
             }
           },
-          width: popupWidth,
+          width: this.popupWidth,
           attrs: this.v3 ? undefined : {
-            width: popupWidth,
+            width: this.popupWidth,
             popupSettings: __assign(__assign({}, popupSettings), {
               anchor: this.anchor,
               show: opened,

package/dist/esm/DropDownList/DropDownList.js

@@ -204,6 +204,7 @@ var DropDownListVue2 = {
       isScrolling: false,
       itemHeight: 0,
       state: undefined,
+      popupWidth: undefined,
       windowWidth: 0
     };
   },
@@ -1123,7 +1124,6 @@ var DropDownListVue2 = {
       var groupStickyHeaderTemplate = templateRendering.call(this, this.$props.groupStickyHeaderItemRender, getListeners.call(this));
       var headerListContainer = base.getTemplateDef.call(this, header);
       var footerListContainer = base.getTemplateDef.call(this, footer);
-      var popupWidth = popupSettings.width !== undefined ? popupSettings.width : base.popupWidth;
       return (
         // @ts-ignore  function children
         h(ListContainer, {
@@ -1138,7 +1138,7 @@ var DropDownListVue2 = {
           dir: dir !== undefined ? dir : base.dirCalculated,
           attrs: this.v3 ? undefined : {
             dir: dir !== undefined ? dir : base.dirCalculated,
-            width: popupWidth
+            width: this.popupWidth
             // @ts-ignore
             ,
             popupSettings: __assign(__assign({}, popupSettings), {
@@ -1148,7 +1148,7 @@ var DropDownListVue2 = {
               show: opened
             })
           },
-          width: popupWidth,
+          width: this.popupWidth,
           popupSettings: __assign(__assign({}, popupSettings), {
             popupClass: classNames(popupSettings.popupClass, 'k-list', (_a = {}, _a["k-list-".concat(sizeMap[size] || size)] = size, _a['k-virtual-list'] = this.base.vs.enabled, _a)),
             className: classNames('k-list-container', popupSettings.className),

package/dist/esm/MultiSelect/MultiSelect.js

@@ -294,6 +294,7 @@ var MultiSelectVue2 = {
       isScrolling: false,
       itemHeight: 0,
       windowWidth: 0,
+      popupWidth: undefined,
       initialAdaptiveRenderingValues: undefined
     };
   },
@@ -1180,7 +1181,6 @@ var MultiSelectVue2 = {
       var headerListContainer = base.getTemplateDef.call(this, header);
       var footerListContainer = base.getTemplateDef.call(this, footer);
       var currentText = this.$props.filter !== undefined ? this.$props.filter : this.currentText;
-      var popupWidth = popupSettings.width !== undefined ? popupSettings.width : base.popupWidth;
       var focusedType = this.getFocusedState().focusedType;
       var customItem = allowCustom && currentText && h("div", {
         "class": "k-list",
@@ -1219,7 +1219,7 @@ var MultiSelectVue2 = {
           dir: dir !== undefined ? dir : base.dirCalculated,
           attrs: this.v3 ? undefined : {
             dir: dir !== undefined ? dir : base.dirCalculated,
-            width: popupWidth,
+            width: this.popupWidth,
             popupSettings: __assign(__assign({}, popupSettings), {
               anchor: this.anchor,
               show: opened,
@@ -1231,7 +1231,7 @@ var MultiSelectVue2 = {
             itemsCount: dataItems.length
           },
           onBlur: this.handleBlur,
-          width: popupWidth,
+          width: this.popupWidth,
           popupSettings: __assign(__assign({}, popupSettings), {
             anchor: this.anchor,
             show: opened,

package/dist/esm/common/DropDownBase.d.ts

@@ -48,6 +48,7 @@ export interface DropDownComponent {
     value: any;
     currentOpened: boolean;
     currentFocused: boolean;
+    popupWidth: string;
 }
 /**
  * @hidden

package/dist/esm/common/DropDownBase.js

@@ -165,8 +165,12 @@ var DropDownBase = /** @class */function () {
     }
   };
   DropDownBase.prototype.calculatePopupWidth = function () {
-    if (this.wrapper && !this.popupWidth) {
-      this.popupWidth = this.wrapper.offsetWidth + 'px';
+    // @ts-ignore
+    var props = this.component.$props;
+    var popupSettings = props.popupSettings || {};
+    var popupWidth = popupSettings.width;
+    if (this.wrapper && !popupWidth) {
+      this.component.popupWidth = props.popupSettings.width !== undefined ? props.popupSettings.width : this.wrapper.offsetWidth + 'px';
     }
   };
   DropDownBase.prototype.scrollToItem = function (itemIndex, vsEnabled) {

package/dist/esm/package-metadata.js

@@ -5,7 +5,7 @@ export var packageMetadata = {
     name: '@progress/kendo-vue-dropdowns',
     productName: 'Kendo UI for Vue',
     productCodes: ['KENDOUIVUE', 'KENDOUICOMPLETE'],
-    publishDate: 1706787509,
+    publishDate: 1708425453,
     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/AutoComplete/AutoComplete.js

@@ -161,6 +161,7 @@ var AutoCompleteVue2 = {
       suggested: '',
       group: undefined,
       isScrolling: false,
+      popupWidth: undefined,
       itemHeight: 0
     };
   },
@@ -724,7 +725,6 @@ var AutoCompleteVue2 = {
         template: footerTemplate
       });
       var opened = this.$props.opened !== undefined ? this.$props.opened : this.currentOpened;
-      var popupWidth = popupSettings.width !== undefined ? popupSettings.width : base.popupWidth;
       var dataItems = this.$props.dataItems || [];
       if (this.group === undefined && this.$props.groupField !== undefined) {
         this.group = (0, utils_1.getItemValue)(dataItems[0], this.$props.groupField);
@@ -740,9 +740,9 @@ var AutoCompleteVue2 = {
               return e.preventDefault();
             }
           },
-          width: popupWidth,
+          width: this.popupWidth,
           attrs: this.v3 ? undefined : {
-            width: popupWidth,
+            width: this.popupWidth,
             popupSettings: __assign(__assign({}, popupSettings), {
               anchor: this.anchor,
               show: opened,

package/dist/npm/ComboBox/ComboBox.js

@@ -221,6 +221,7 @@ var ComboBoxVue2 = {
       isScrolling: false,
       itemHeight: 0,
       state: undefined,
+      popupWidth: undefined,
       windowWidth: 0
     };
   },
@@ -1097,7 +1098,6 @@ var ComboBoxVue2 = {
       var groupStickyHeaderTemplate = kendo_vue_common_1.templateRendering.call(this, this.$props.groupStickyHeaderItemRender, kendo_vue_common_1.getListeners.call(this));
       var headerListContainer = base.getTemplateDef.call(this, header);
       var footerListContainer = base.getTemplateDef.call(this, footer);
-      var popupWidth = popupSettings.width !== undefined ? popupSettings.width : base.popupWidth;
       var dataItems = this.$props.dataItems || [];
       if (this.group === undefined && this.$props.groupField !== undefined) {
         this.group = (0, utils_1.getItemValue)(dataItems[0], this.$props.groupField);
@@ -1114,9 +1114,9 @@ var ComboBoxVue2 = {
               return e.preventDefault();
             }
           },
-          width: popupWidth,
+          width: this.popupWidth,
           attrs: this.v3 ? undefined : {
-            width: popupWidth,
+            width: this.popupWidth,
             popupSettings: __assign(__assign({}, popupSettings), {
               anchor: this.anchor,
               show: opened,

package/dist/npm/DropDownList/DropDownList.js

@@ -210,6 +210,7 @@ var DropDownListVue2 = {
       isScrolling: false,
       itemHeight: 0,
       state: undefined,
+      popupWidth: undefined,
       windowWidth: 0
     };
   },
@@ -1129,7 +1130,6 @@ var DropDownListVue2 = {
       var groupStickyHeaderTemplate = kendo_vue_common_1.templateRendering.call(this, this.$props.groupStickyHeaderItemRender, kendo_vue_common_1.getListeners.call(this));
       var headerListContainer = base.getTemplateDef.call(this, header);
       var footerListContainer = base.getTemplateDef.call(this, footer);
-      var popupWidth = popupSettings.width !== undefined ? popupSettings.width : base.popupWidth;
       return (
         // @ts-ignore  function children
         h(ListContainer_1.ListContainer, {
@@ -1144,7 +1144,7 @@ var DropDownListVue2 = {
           dir: dir !== undefined ? dir : base.dirCalculated,
           attrs: this.v3 ? undefined : {
             dir: dir !== undefined ? dir : base.dirCalculated,
-            width: popupWidth
+            width: this.popupWidth
             // @ts-ignore
             ,
             popupSettings: __assign(__assign({}, popupSettings), {
@@ -1154,7 +1154,7 @@ var DropDownListVue2 = {
               show: opened
             })
           },
-          width: popupWidth,
+          width: this.popupWidth,
           popupSettings: __assign(__assign({}, popupSettings), {
             popupClass: (0, kendo_vue_common_1.classNames)(popupSettings.popupClass, 'k-list', (_a = {}, _a["k-list-".concat(sizeMap[size] || size)] = size, _a['k-virtual-list'] = this.base.vs.enabled, _a)),
             className: (0, kendo_vue_common_1.classNames)('k-list-container', popupSettings.className),

package/dist/npm/MultiSelect/MultiSelect.js

@@ -300,6 +300,7 @@ var MultiSelectVue2 = {
       isScrolling: false,
       itemHeight: 0,
       windowWidth: 0,
+      popupWidth: undefined,
       initialAdaptiveRenderingValues: undefined
     };
   },
@@ -1186,7 +1187,6 @@ var MultiSelectVue2 = {
       var headerListContainer = base.getTemplateDef.call(this, header);
       var footerListContainer = base.getTemplateDef.call(this, footer);
       var currentText = this.$props.filter !== undefined ? this.$props.filter : this.currentText;
-      var popupWidth = popupSettings.width !== undefined ? popupSettings.width : base.popupWidth;
       var focusedType = this.getFocusedState().focusedType;
       var customItem = allowCustom && currentText && h("div", {
         "class": "k-list",
@@ -1225,7 +1225,7 @@ var MultiSelectVue2 = {
           dir: dir !== undefined ? dir : base.dirCalculated,
           attrs: this.v3 ? undefined : {
             dir: dir !== undefined ? dir : base.dirCalculated,
-            width: popupWidth,
+            width: this.popupWidth,
             popupSettings: __assign(__assign({}, popupSettings), {
               anchor: this.anchor,
               show: opened,
@@ -1237,7 +1237,7 @@ var MultiSelectVue2 = {
             itemsCount: dataItems.length
           },
           onBlur: this.handleBlur,
-          width: popupWidth,
+          width: this.popupWidth,
           popupSettings: __assign(__assign({}, popupSettings), {
             anchor: this.anchor,
             show: opened,

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

@@ -48,6 +48,7 @@ export interface DropDownComponent {
     value: any;
     currentOpened: boolean;
     currentFocused: boolean;
+    popupWidth: string;
 }
 /**
  * @hidden

package/dist/npm/common/DropDownBase.js

@@ -170,8 +170,12 @@ var DropDownBase = /** @class */function () {
     }
   };
   DropDownBase.prototype.calculatePopupWidth = function () {
-    if (this.wrapper && !this.popupWidth) {
-      this.popupWidth = this.wrapper.offsetWidth + 'px';
+    // @ts-ignore
+    var props = this.component.$props;
+    var popupSettings = props.popupSettings || {};
+    var popupWidth = popupSettings.width;
+    if (this.wrapper && !popupWidth) {
+      this.component.popupWidth = props.popupSettings.width !== undefined ? props.popupSettings.width : this.wrapper.offsetWidth + 'px';
     }
   };
   DropDownBase.prototype.scrollToItem = function (itemIndex, vsEnabled) {

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: 1706787509,
+    publishDate: 1708425453,
     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": "4.3.1-dev.202402011147",
+  "version": "4.3.1-dev.202402201046",
   "repository": {
     "type": "git",
     "url": "https://github.com/telerik/kendo-vue.git"
@@ -54,21 +54,21 @@
     "vue": "^2.6.12 || ^3.0.2"
   },
   "dependencies": {
-    "@progress/kendo-vue-buttons": "4.3.1-dev.202402011147",
-    "@progress/kendo-vue-common": "4.3.1-dev.202402011147",
-    "@progress/kendo-vue-layout": "4.3.1-dev.202402011147",
-    "@progress/kendo-vue-popup": "4.3.1-dev.202402011147"
+    "@progress/kendo-vue-buttons": "4.3.1-dev.202402201046",
+    "@progress/kendo-vue-common": "4.3.1-dev.202402201046",
+    "@progress/kendo-vue-layout": "4.3.1-dev.202402201046",
+    "@progress/kendo-vue-popup": "4.3.1-dev.202402201046"
   },
   "devDependencies": {
     "@progress/kendo-data-query": "^1.5.4",
     "@progress/kendo-licensing": "^1.3.0",
     "@progress/kendo-svg-icons": "^2.0.0",
-    "@progress/kendo-vue-data-tools": "4.3.1-dev.202402011147",
-    "@progress/kendo-vue-inputs": "4.3.1-dev.202402011147",
-    "@progress/kendo-vue-intl": "4.3.1-dev.202402011147",
-    "@progress/kendo-vue-labels": "4.3.1-dev.202402011147",
-    "@progress/kendo-vue-layout": "4.3.1-dev.202402011147",
-    "@progress/kendo-vue-treeview": "4.3.1-dev.202402011147"
+    "@progress/kendo-vue-data-tools": "4.3.1-dev.202402201046",
+    "@progress/kendo-vue-inputs": "4.3.1-dev.202402201046",
+    "@progress/kendo-vue-intl": "4.3.1-dev.202402201046",
+    "@progress/kendo-vue-labels": "4.3.1-dev.202402201046",
+    "@progress/kendo-vue-layout": "4.3.1-dev.202402201046",
+    "@progress/kendo-vue-treeview": "4.3.1-dev.202402201046"
   },
   "author": "Progress",
   "license": "SEE LICENSE IN LICENSE.md",