Take into account borders during a component move. Fixes #5621 Closes #…

…5622
GrapesJS · Feb 10, 2024 · ec4f2d6 · ec4f2d6
1 parent 58a6ff7
commit ec4f2d6
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 3 deletions.
diff --git a/src/canvas/view/CanvasView.ts b/src/canvas/view/CanvasView.ts
@@ -29,6 +29,10 @@ export interface MarginPaddingOffsets {
   paddingRight?: number;
   paddingBottom?: number;
   paddingLeft?: number;
+  borderTopWidth?: number;
+  borderRightWidth?: number;
+  borderBottomWidth?: number;
+  borderLeftWidth?: number;
 }
 
 export type ElementPosOpts = {
@@ -516,6 +520,10 @@ export default class CanvasView extends ModuleView<Canvas> {
       'paddingRight',
       'paddingBottom',
       'paddingLeft',
+      'borderTopWidth',
+      'borderRightWidth',
+      'borderBottomWidth',
+      'borderLeftWidth',
     ];
     marginPaddingOffsets.forEach(offset => {
       result[offset] = parseFloat(styles[offset]) * zoom;

diff --git a/src/utils/Sorter.ts b/src/utils/Sorter.ts
@@ -1097,9 +1097,13 @@ export default class Sorter extends View {
         const offset = trgDim.offsets || {};
         const pT = offset.paddingTop || margI;
         const pL = offset.paddingLeft || margI;
-        t = trgDim.top + pT;
-        l = trgDim.left + pL;
-        w = parseInt(`${trgDim.width}`) - pL * 2 + un;
+        const bT = offset.borderTopWidth || 0;
+        const bL = offset.borderLeftWidth || 0;
+        const bR = offset.borderRightWidth || 0;
+        const bWidth = bL + bR;
+        t = trgDim.top + pT + bT;
+        l = trgDim.left + pL + bL;
+        w = parseInt(`${trgDim.width}`) - pL * 2 - bWidth + un;
         h = 'auto';
       }
     }