v20.4.44 is released

Author: pipeline

controls/base/CHANGELOG.md

@@ -2,6 +2,14 @@
 
 ## [Unreleased]
 
+## 20.4.44 (2023-01-18)
+
+### Common
+
+#### Bug Fixes
+
+- `#F178732` - Resolved the sudden changes in top value of `draggable` element.
+
 ## 20.4.42 (2023-01-04)
 
 ### Common

controls/base/src/draggable.ts

@@ -1058,6 +1058,12 @@ export class Draggable extends Base<HTMLElement> implements INotifyPropertyChang
             pageX = this.clone ? intCoord.pageX : (intCoord.pageX + window.pageXOffset) - this.relativeXPosition;
             pageY = this.clone ? intCoord.pageY : (intCoord.pageY + window.pageYOffset) - this.relativeYPosition;
         }
+        if (this.element && this.element.classList.length > 0 && this.element.classList.value.indexOf("e-dialog") === -1 && document.scrollingElement) {
+            let isVerticalScroll: boolean = document.scrollingElement.scrollHeight > 0 && document.scrollingElement.scrollHeight > document.scrollingElement.clientHeight && document.scrollingElement.scrollTop > 0;
+            let isHorrizontalScroll: boolean = document.scrollingElement.scrollWidth > 0 && document.scrollingElement.scrollWidth > document.scrollingElement.clientWidth && document.scrollingElement.scrollLeft > 0;
+            pageX = isHorrizontalScroll ? pageX - document.scrollingElement.scrollLeft : pageX;
+            pageY = isVerticalScroll ? pageY - document.scrollingElement.scrollTop : pageY;
+        }
         return {
             left: pageX - (this.margin.left + this.cursorAt.left),
             top: pageY - (this.margin.top + this.cursorAt.top)

controls/base/styles/definition/_tailwind.scss

@@ -160,7 +160,7 @@ $shadow-focus-ring1: 0 0 0 1px rgba($primary, 1) !default;
 $shadow-focus-ring2: 0 0 0 2px rgba($content-bg-color, .95), 0 0 0 4px rgba($primary, 1) !default;
 
 // FontFamily
-$font-family: 'Inter';
+$font-family: 'Inter' !default;
 
 // Default Font Size
 $text-xxs: 10px !default;

controls/base/themestudio/styles/base/definition/_tailwind.scss

@@ -160,7 +160,7 @@ $shadow-focus-ring1: 0 0 0 1px rgba($primary, 1) !default;
 $shadow-focus-ring2: 0 0 0 2px rgba($content-bg-color, .95), 0 0 0 4px rgba($primary, 1) !default;
 
 // FontFamily
-$font-family: 'Inter';
+$font-family: 'Inter' !default;
 
 // Default Font Size
 $text-xxs: 10px !default;

controls/base/themestudio/styles/dropdowns/drop-down-list/_layout.scss

@@ -54,6 +54,9 @@
     #{&}.e-ddl.e-popup.e-ddl-device-filter {
       margin: $ddl-filter-margin;
     }
+    #{&}.e-ios {
+      position: fixed;
+    }
   }
 
   .e-ddl.e-control-wrapper .e-ddl-disable-icon {

controls/base/themestudio/styles/grids/grid/_bootstrap-dark-definition.scss

@@ -561,6 +561,8 @@ $grid-reorderarrow-margin-top: -6.5px !default;
 $grid-reorderdownarrow-margin-top: 4px !default;
 $grid-reorder-arrow-top-margin: .5px !default;
 $grid-reorder-downarrow-top-margin: -1.5px !default;
+$grid-reorder-virtualarrow-top-margin: -.5px !default;
+$grid-reorder-virtualdownarrow-top-margin: -1.5px !default;
 $grid-sortnumber-font-size: 9px !default;
 $grid-header-text-transform: none !default;
 $grid-bigger-toolbar-icon-size: 18px !default;

controls/base/themestudio/styles/grids/grid/_bootstrap-definition.scss

@@ -563,6 +563,8 @@ $grid-reorderarrow-margin-top: -6.5px !default;
 $grid-reorderdownarrow-margin-top: 4px !default;
 $grid-reorder-arrow-top-margin: .5px !default;
 $grid-reorder-downarrow-top-margin: -1.5px !default;
+$grid-reorder-virtualarrow-top-margin: -.5px !default;
+$grid-reorder-virtualdownarrow-top-margin: -1.5px !default;
 $grid-sortnumber-font-size: 9px !default;
 $grid-header-text-transform: none !default;
 $grid-bigger-toolbar-icon-size: 18px !default;

controls/base/themestudio/styles/grids/grid/_bootstrap4-definition.scss

@@ -567,6 +567,8 @@ $grid-reorderarrow-margin-top: -7.5px !default;
 $grid-reorderdownarrow-margin-top: 2.5px !default;
 $grid-reorder-arrow-top-margin: 0 !default;
 $grid-reorder-downarrow-top-margin: -3px !default;
+$grid-reorder-virtualarrow-top-margin: -1px !default;
+$grid-reorder-virtualdownarrow-top-margin: -3px !default;
 $grid-sortnumber-font-size: 9px !default;
 $grid-header-text-transform: none !default;
 $grid-bigger-toolbar-icon-size: 18px !default;

controls/base/themestudio/styles/grids/grid/_bootstrap5-definition.scss

@@ -564,6 +564,8 @@ $grid-reorderarrow-margin-top: -7px !default;
 $grid-reorderdownarrow-margin-top: 4px !default;
 $grid-reorder-arrow-top-margin: 0 !default;
 $grid-reorder-downarrow-top-margin: -2px !default;
+$grid-reorder-virtualarrow-top-margin: -1px !default;
+$grid-reorder-virtualdownarrow-top-margin: -1px !default;
 $grid-bigger-toolbar-icon-size: $grid-bigger-icons-font-size !default;
 $grid-reorderarrow-margin-left: -3px !default;
 $grid-column-chooser-cancel-icon-size: $text-sm !default;

controls/base/themestudio/styles/grids/grid/_fabric-dark-definition.scss

@@ -559,6 +559,8 @@ $grid-reorderarrow-margin-top: -4.5px !default;
 $grid-reorderdownarrow-margin-top: 4px !default;
 $grid-reorder-arrow-top-margin: 1px !default;
 $grid-reorder-downarrow-top-margin: -1px !default;
+$grid-reorder-virtualarrow-top-margin: 1px !default;
+$grid-reorder-virtualdownarrow-top-margin: -1px !default;
 $grid-sortnumber-font-size: 9px !default;
 $grid-header-text-transform: none !default;
 $grid-bigger-toolbar-icon-size: 18px !default;