@progress/kendo-angular-dropdowns 17.1.1-develop.5 → 17.1.1-develop.7

package/esm2022/autocomplete/autocomplete.component.mjs

@@ -1066,13 +1066,14 @@ export class AutoCompleteComponent {
         const horizontalAlign = this.direction === "rtl" ? "right" : "left";
         const anchorPosition = { horizontal: horizontalAlign, vertical: "bottom" };
         const popupPosition = { horizontal: horizontalAlign, vertical: "top" };
+        const appendToComponent = typeof this.popupSettings.appendTo === 'string' && this.popupSettings.appendTo === 'component';
         this.popupRef = this.popupService.open({
             anchor: this.wrapper,
             animate: this.popupSettings.animate,
             appendTo: this.appendTo,
             content: this.popupTemplate,
             popupClass: this.listContainerClasses,
-            positionMode: 'absolute',
+            positionMode: appendToComponent ? 'fixed' : 'absolute',
             popupAlign: popupPosition,
             anchorAlign: anchorPosition
         });

package/esm2022/comboboxes/combobox.component.mjs

@@ -1470,13 +1470,14 @@ export class ComboBoxComponent extends MultiTabStop {
         const horizontalAlign = this.direction === "rtl" ? "right" : "left";
         const anchorPosition = { horizontal: horizontalAlign, vertical: "bottom" };
         const popupPosition = { horizontal: horizontalAlign, vertical: "top" };
+        const appendToComponent = typeof this.popupSettings.appendTo === 'string' && this.popupSettings.appendTo === 'component';
         this.popupRef = this.popupService.open({
             anchor: this.wrapper,
             animate: this.popupSettings.animate,
             appendTo: this.appendTo,
             content: this.popupTemplate,
             popupClass: this.listContainerClasses,
-            positionMode: 'absolute',
+            positionMode: appendToComponent ? 'fixed' : 'absolute',
             anchorAlign: anchorPosition,
             popupAlign: popupPosition
         });

package/esm2022/dropdownlist/dropdownlist.component.mjs

@@ -985,6 +985,7 @@ export class DropDownListComponent {
         const horizontalAlign = this.direction === "rtl" ? "right" : "left";
         const anchorPosition = { horizontal: horizontalAlign, vertical: "bottom" };
         const popupPosition = { horizontal: horizontalAlign, vertical: "top" };
+        const appendToComponent = typeof this.popupSettings.appendTo === 'string' && this.popupSettings.appendTo === 'component';
         this.popupRef = this.popupService.open({
             anchor: this.wrapper,
             anchorAlign: anchorPosition,
@@ -993,7 +994,7 @@ export class DropDownListComponent {
             content: this.popupTemplate,
             popupAlign: popupPosition,
             popupClass: this.listContainerClasses,
-            positionMode: 'absolute'
+            positionMode: appendToComponent ? 'fixed' : 'absolute'
         });
         this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-expanded', 'true');
         this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-controls', this.listBoxId);

package/esm2022/dropdowntrees/dropdowntree.component.mjs

@@ -1088,13 +1088,14 @@ export class DropDownTreeComponent {
         const horizontalAlign = this.direction === "rtl" ? "right" : "left";
         const anchorPosition = { horizontal: horizontalAlign, vertical: 'bottom' };
         const popupPosition = { horizontal: horizontalAlign, vertical: 'top' };
+        const appendToComponent = typeof this.popupSettings.appendTo === 'string' && this.popupSettings.appendTo === 'component';
         this.popupRef = this.popupService.open({
             anchor: this.wrapper,
             appendTo: this.appendTo,
             anchorAlign: anchorPosition,
             content: this.popupTemplate,
             popupAlign: popupPosition,
-            positionMode: 'absolute',
+            positionMode: appendToComponent ? 'fixed' : 'absolute',
             popupClass: this.popupContainerClasses
         });
         const popupWrapper = this.popupRef.popupElement;

package/esm2022/dropdowntrees/multiselecttree.component.mjs

@@ -1278,13 +1278,14 @@ export class MultiSelectTreeComponent {
         const horizontalAlign = this.direction === "rtl" ? "right" : "left";
         const anchorPosition = { horizontal: horizontalAlign, vertical: 'bottom' };
         const popupPosition = { horizontal: horizontalAlign, vertical: 'top' };
+        const appendToComponent = typeof this.popupSettings.appendTo === 'string' && this.popupSettings.appendTo === 'component';
         this.popupRef = this.popupService.open({
             anchor: this.wrapper,
             appendTo: this.appendTo,
             anchorAlign: anchorPosition,
             content: this.popupTemplate,
             popupAlign: popupPosition,
-            positionMode: 'absolute',
+            positionMode: appendToComponent ? 'fixed' : 'absolute',
             popupClass: this.popupContainerClasses
         });
         const popupWrapper = this.popupRef.popupElement;

package/esm2022/multiselect/multiselect.component.mjs

@@ -1709,6 +1709,7 @@ export class MultiSelectComponent {
         const horizontalAlign = this.direction === "rtl" ? "right" : "left";
         const anchorPosition = { horizontal: horizontalAlign, vertical: "bottom" };
         const popupPosition = { horizontal: horizontalAlign, vertical: "top" };
+        const appendToComponent = typeof this.popupSettings.appendTo === 'string' && this.popupSettings.appendTo === 'component';
         this.popupRef = this.popupService.open({
             anchor: this.wrapper,
             anchorAlign: anchorPosition,
@@ -1717,7 +1718,7 @@ export class MultiSelectComponent {
             content: this.popupTemplate,
             popupAlign: popupPosition,
             popupClass: this.listContainerClasses,
-            positionMode: 'absolute'
+            positionMode: appendToComponent ? 'fixed' : 'absolute'
         });
         const popupWrapper = this.popupRef.popupElement;
         const { min, max } = this.width;

package/esm2022/package-metadata.mjs

@@ -9,7 +9,7 @@ export const packageMetadata = {
     name: '@progress/kendo-angular-dropdowns',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1733230602,
-    version: '17.1.1-develop.5',
+    publishDate: 1733390756,
+    version: '17.1.1-develop.7',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };

package/fesm2022/progress-kendo-angular-dropdowns.mjs

@@ -34,8 +34,8 @@ const packageMetadata = {
     name: '@progress/kendo-angular-dropdowns',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1733230602,
-    version: '17.1.1-develop.5',
+    publishDate: 1733390756,
+    version: '17.1.1-develop.7',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };
 
@@ -4151,13 +4151,14 @@ class AutoCompleteComponent {
         const horizontalAlign = this.direction === "rtl" ? "right" : "left";
         const anchorPosition = { horizontal: horizontalAlign, vertical: "bottom" };
         const popupPosition = { horizontal: horizontalAlign, vertical: "top" };
+        const appendToComponent = typeof this.popupSettings.appendTo === 'string' && this.popupSettings.appendTo === 'component';
         this.popupRef = this.popupService.open({
             anchor: this.wrapper,
             animate: this.popupSettings.animate,
             appendTo: this.appendTo,
             content: this.popupTemplate,
             popupClass: this.listContainerClasses,
-            positionMode: 'absolute',
+            positionMode: appendToComponent ? 'fixed' : 'absolute',
             popupAlign: popupPosition,
             anchorAlign: anchorPosition
         });
@@ -6211,13 +6212,14 @@ class ComboBoxComponent extends MultiTabStop {
         const horizontalAlign = this.direction === "rtl" ? "right" : "left";
         const anchorPosition = { horizontal: horizontalAlign, vertical: "bottom" };
         const popupPosition = { horizontal: horizontalAlign, vertical: "top" };
+        const appendToComponent = typeof this.popupSettings.appendTo === 'string' && this.popupSettings.appendTo === 'component';
         this.popupRef = this.popupService.open({
             anchor: this.wrapper,
             animate: this.popupSettings.animate,
             appendTo: this.appendTo,
             content: this.popupTemplate,
             popupClass: this.listContainerClasses,
-            positionMode: 'absolute',
+            positionMode: appendToComponent ? 'fixed' : 'absolute',
             anchorAlign: anchorPosition,
             popupAlign: popupPosition
         });
@@ -7880,6 +7882,7 @@ class DropDownListComponent {
         const horizontalAlign = this.direction === "rtl" ? "right" : "left";
         const anchorPosition = { horizontal: horizontalAlign, vertical: "bottom" };
         const popupPosition = { horizontal: horizontalAlign, vertical: "top" };
+        const appendToComponent = typeof this.popupSettings.appendTo === 'string' && this.popupSettings.appendTo === 'component';
         this.popupRef = this.popupService.open({
             anchor: this.wrapper,
             anchorAlign: anchorPosition,
@@ -7888,7 +7891,7 @@ class DropDownListComponent {
             content: this.popupTemplate,
             popupAlign: popupPosition,
             popupClass: this.listContainerClasses,
-            positionMode: 'absolute'
+            positionMode: appendToComponent ? 'fixed' : 'absolute'
         });
         this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-expanded', 'true');
         this.renderer.setAttribute(this.wrapper.nativeElement, 'aria-controls', this.listBoxId);
@@ -11003,6 +11006,7 @@ class MultiSelectComponent {
         const horizontalAlign = this.direction === "rtl" ? "right" : "left";
         const anchorPosition = { horizontal: horizontalAlign, vertical: "bottom" };
         const popupPosition = { horizontal: horizontalAlign, vertical: "top" };
+        const appendToComponent = typeof this.popupSettings.appendTo === 'string' && this.popupSettings.appendTo === 'component';
         this.popupRef = this.popupService.open({
             anchor: this.wrapper,
             anchorAlign: anchorPosition,
@@ -11011,7 +11015,7 @@ class MultiSelectComponent {
             content: this.popupTemplate,
             popupAlign: popupPosition,
             popupClass: this.listContainerClasses,
-            positionMode: 'absolute'
+            positionMode: appendToComponent ? 'fixed' : 'absolute'
         });
         const popupWrapper = this.popupRef.popupElement;
         const { min, max } = this.width;
@@ -13761,13 +13765,14 @@ class DropDownTreeComponent {
         const horizontalAlign = this.direction === "rtl" ? "right" : "left";
         const anchorPosition = { horizontal: horizontalAlign, vertical: 'bottom' };
         const popupPosition = { horizontal: horizontalAlign, vertical: 'top' };
+        const appendToComponent = typeof this.popupSettings.appendTo === 'string' && this.popupSettings.appendTo === 'component';
         this.popupRef = this.popupService.open({
             anchor: this.wrapper,
             appendTo: this.appendTo,
             anchorAlign: anchorPosition,
             content: this.popupTemplate,
             popupAlign: popupPosition,
-            positionMode: 'absolute',
+            positionMode: appendToComponent ? 'fixed' : 'absolute',
             popupClass: this.popupContainerClasses
         });
         const popupWrapper = this.popupRef.popupElement;
@@ -16285,13 +16290,14 @@ class MultiSelectTreeComponent {
         const horizontalAlign = this.direction === "rtl" ? "right" : "left";
         const anchorPosition = { horizontal: horizontalAlign, vertical: 'bottom' };
         const popupPosition = { horizontal: horizontalAlign, vertical: 'top' };
+        const appendToComponent = typeof this.popupSettings.appendTo === 'string' && this.popupSettings.appendTo === 'component';
         this.popupRef = this.popupService.open({
             anchor: this.wrapper,
             appendTo: this.appendTo,
             anchorAlign: anchorPosition,
             content: this.popupTemplate,
             popupAlign: popupPosition,
-            positionMode: 'absolute',
+            positionMode: appendToComponent ? 'fixed' : 'absolute',
             popupClass: this.popupContainerClasses
         });
         const popupWrapper = this.popupRef.popupElement;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-angular-dropdowns",
-  "version": "17.1.1-develop.5",
+  "version": "17.1.1-develop.7",
   "description": "A wide variety of native Angular dropdown components including AutoComplete, ComboBox, DropDownList, DropDownTree, MultiColumnComboBox, MultiSelect, and MultiSelectTree ",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "Progress",
@@ -25,17 +25,17 @@
     "@angular/forms": "16 - 19",
     "@angular/platform-browser": "16 - 19",
     "@progress/kendo-licensing": "^1.0.2",
-    "@progress/kendo-angular-common": "17.1.1-develop.5",
-    "@progress/kendo-angular-l10n": "17.1.1-develop.5",
-    "@progress/kendo-angular-navigation": "17.1.1-develop.5",
-    "@progress/kendo-angular-popup": "17.1.1-develop.5",
-    "@progress/kendo-angular-icons": "17.1.1-develop.5",
-    "@progress/kendo-angular-treeview": "17.1.1-develop.5",
+    "@progress/kendo-angular-common": "17.1.1-develop.7",
+    "@progress/kendo-angular-l10n": "17.1.1-develop.7",
+    "@progress/kendo-angular-navigation": "17.1.1-develop.7",
+    "@progress/kendo-angular-popup": "17.1.1-develop.7",
+    "@progress/kendo-angular-icons": "17.1.1-develop.7",
+    "@progress/kendo-angular-treeview": "17.1.1-develop.7",
     "rxjs": "^6.5.3 || ^7.0.0"
   },
   "dependencies": {
     "tslib": "^2.3.1",
-    "@progress/kendo-angular-schematics": "17.1.1-develop.5",
+    "@progress/kendo-angular-schematics": "17.1.1-develop.7",
     "@progress/kendo-common": "^1.0.1"
   },
   "schematics": "./schematics/collection.json",

package/schematics/ngAdd/index.js

@@ -4,9 +4,9 @@ const schematics_1 = require("@angular-devkit/schematics");
 function default_1(options) {
     const finalOptions = Object.assign(Object.assign({}, options), { mainNgModule: 'DropDownsModule', package: 'dropdowns', peerDependencies: {
             // peers of the treeview
-            '@progress/kendo-angular-inputs': '17.1.1-develop.5',
+            '@progress/kendo-angular-inputs': '17.1.1-develop.7',
             // peers of inputs
-            '@progress/kendo-angular-intl': '17.1.1-develop.5',
+            '@progress/kendo-angular-intl': '17.1.1-develop.7',
             '@progress/kendo-drawing': '^1.17.2',
             // Peer dependency of icons
             '@progress/kendo-svg-icons': '^4.0.0'