@social-mail/social-mail-client 1.8.315 → 1.8.317

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@social-mail/social-mail-client",
-  "version": "1.8.315",
+  "version": "1.8.317",
   "description": "",
   "main": "index.js",
   "scripts": {

package/src/site-editor/drag-drop/DragDropHelper.ts

@@ -24,8 +24,13 @@ export function InstallDragDropHelper(editor: HtmlPageEditor) {
     const dropTarget = (editor as any).dropTarget as SelectedElement;
 
     document.addEventListener("dragstart", (e) => {
+        const target = e.target as HTMLElement;
+        const s = document.defaultView.getComputedStyle(target);
+        if(/absolute|relative/i.test(s.position)) {
+            return;
+        }
         setTimeout(() => document.body.contentEditable = "false", 0);
-        dragged = e.target as HTMLElement;
+        dragged = target;
         e.dataTransfer.dropEffect = "move";
         e.dataTransfer.setDragImage(dragged, 0, 0);
     });

package/src/site-editor/editor/UndoRedo.tsx

@@ -41,6 +41,15 @@ export default class UndoRedo {
         setTimeout(() => this.silent = false, 100);
     }
 
+    beginPause() {
+        this.silent = true;
+        return {
+            resume: () => {
+                this.silent = false;
+            }
+        };
+    }
+
     observe(records: MutationRecord[]) {
         if (this.silent) {
             return;

package/src/site-editor/editor/ui/SelectionUI.tsx

@@ -7,8 +7,6 @@ import { BindEditor } from "../../properties/controls/PropertyEditor";
 import "./SelectionUI.global.css";
 import HtmlPageEditor from "../HtmlPageEditor";
 import { mobileScreenWidth, tabletScreenWidth } from "../sizes";
-import { AtomBinder } from "@web-atoms/core/dist/core/AtomBinder";
-
 declare global {
     namespace JSX {
         interface IntrinsicElements {
@@ -26,6 +24,7 @@ interface IRect {
     dy;
     sx;
     sy;
+    move?: boolean;
 }
 
 const setCapture = (editor: HtmlPageEditor, element: HTMLElement, e: PointerEvent, fx: (r: IRect, ) => IRect) => {
@@ -35,7 +34,7 @@ const setCapture = (editor: HtmlPageEditor, element: HTMLElement, e: PointerEven
         ? "styler-tablet"
         : (editor.maxWidth === mobileScreenWidth
             ? "styler-mobile"
-            : "styler");
+            : "styler-desktop");
 
     const sx = e.clientX;
     const sy = e.clientY;
@@ -51,6 +50,8 @@ const setCapture = (editor: HtmlPageEditor, element: HTMLElement, e: PointerEven
 
     const ps = (v, max) => (v* 100 / (max || 1)).toFixed(2);
 
+    const d = editor.undoRedo.beginPause();
+
     const captureMove = (evt: PointerEvent) => {
         const dx = evt.clientX - sx;
         const dy = evt.clientY - sy;
@@ -69,16 +70,18 @@ const setCapture = (editor: HtmlPageEditor, element: HTMLElement, e: PointerEven
         selectedElement.setAttribute(`${prefix}-inset`, av);
         // if (/^img$/i.test(selectedElement.tagName)) {
             // image needs width/height as well...
-            let widthDiff = -r.left;
-            let heightDiff = -r.top;
-            if (ri.bottom === r.bottom) {
-                heightDiff -= r.bottom;
-            }
-            if (ri.right === r.right) {
-                widthDiff -= r.right;
+            if (!r.move) {
+                let widthDiff = -r.left;
+                let heightDiff = -r.top;
+                if (ri.bottom === r.bottom) {
+                    heightDiff -= r.bottom;
+                }
+                if (ri.right === r.right) {
+                    widthDiff -= r.right;
+                }
+                selectedElement.setAttribute(`${prefix}-width`, ps(width + widthDiff, width) + "%");
+                selectedElement.setAttribute(`${prefix}-height`, ps(height + heightDiff, height) + "%");
             }
-            selectedElement.setAttribute(`${prefix}-width`, ps(width + widthDiff, width) + "%");
-            selectedElement.setAttribute(`${prefix}-height`, ps(height + heightDiff, height) + "%");
         // }
 
         setTimeout(() => {
@@ -93,6 +96,8 @@ const setCapture = (editor: HtmlPageEditor, element: HTMLElement, e: PointerEven
         element.releasePointerCapture(e.pointerId);
         element.removeEventListener("pointermove", captureMove);
         element.removeEventListener("pointerup", release);
+        d.resume();
+        editor.commit();
     };
     element.addEventListener("pointerup", release);
 };
@@ -151,6 +156,7 @@ const eventPointerDown = (editor: HtmlPageEditor, e: PointerEvent) =>  {
         r.left += r.dx;
         r.bottom -= r.dy;
         r.right -= r.dx;
+        r.move = true;
         return r;
     });