@hufe921/canvas-editor 0.9.62 → 0.9.63

package/CHANGELOG.md

@@ -1,3 +1,19 @@
+## [0.9.63](https://github.com/Hufe921/canvas-editor/compare/v0.9.62...v0.9.63) (2024-01-19)
+
+
+### Bug Fixes
+
+* copy row properties on input #415 ([55a43e6](https://github.com/Hufe921/canvas-editor/commit/55a43e61bf6aded9f50644e86d3a1c276ee7a53a)), closes [#415](https://github.com/Hufe921/canvas-editor/issues/415)
+* format list element boundary error ([094af57](https://github.com/Hufe921/canvas-editor/commit/094af57302a7db0c83cb3dd8a5eb9bbe5581b8f8))
+* image render error within the control #406 ([d175f92](https://github.com/Hufe921/canvas-editor/commit/d175f920e8887cc3b1f5132e8ac7443b0d556204)), closes [#406](https://github.com/Hufe921/canvas-editor/issues/406)
+
+
+### Features
+
+* keep aspect ratio when drag image #414 ([e8684da](https://github.com/Hufe921/canvas-editor/commit/e8684daffd40a8efda0342809846451afa0027a2)), closes [#414](https://github.com/Hufe921/canvas-editor/issues/414)
+
+
+
 ## [0.9.62](https://github.com/Hufe921/canvas-editor/compare/v0.9.61...v0.9.62) (2024-01-12)
 
 

package/dist/canvas-editor.es.js

@@ -23,7 +23,7 @@ var __publicField = (obj, key, value) => {
   return value;
 };
 var index = "";
-const version = "0.9.62";
+const version = "0.9.63";
 var MaxHeightRatio;
 (function(MaxHeightRatio2) {
   MaxHeightRatio2["HALF"] = "half";
@@ -363,6 +363,7 @@ const EDITOR_ELEMENT_STYLE_ATTR = [
   "underline",
   "strikeout"
 ];
+const EDITOR_ROW_ATTR = ["rowFlex", "rowMargin"];
 const EDITOR_ELEMENT_COPY_ATTR = [
   "type",
   "font",
@@ -378,7 +379,9 @@ const EDITOR_ELEMENT_COPY_ATTR = [
   "hyperlinkId",
   "dateId",
   "dateFormat",
-  "groupIds"
+  "groupIds",
+  "rowFlex",
+  "rowMargin"
 ];
 const EDITOR_ELEMENT_ZIP_ATTR = [
   "type",
@@ -3668,7 +3671,9 @@ function formatElementList(elementList, options) {
     } else if (el.type === ElementType.LIST) {
       elementList.splice(i, 1);
       const valueList = el.valueList || [];
-      formatElementList(valueList, __spreadValues({}, options));
+      formatElementList(valueList, __spreadProps(__spreadValues({}, options), {
+        isHandleFirstElement: true
+      }));
       if (valueList.length) {
         const listId = getUUID();
         for (let v = 0; v < valueList.length; v++) {
@@ -3812,20 +3817,20 @@ function formatElementList(elementList, options) {
               }
             }
           }
+          formatElementList(valueList, __spreadProps(__spreadValues({}, options), {
+            isHandleFirstElement: false
+          }));
           for (let v = 0; v < valueList.length; v++) {
             const element = valueList[v];
-            const valueStrList = splitText(element.value);
-            for (let e = 0; e < valueStrList.length; e++) {
-              const value2 = valueStrList[e];
-              elementList.splice(i, 0, __spreadProps(__spreadValues({}, element), {
-                controlId,
-                value: value2 === "\n" ? ZERO : value2,
-                type: element.type || ElementType.TEXT,
-                control: el.control,
-                controlComponent: ControlComponent.VALUE
-              }));
-              i++;
-            }
+            const value2 = element.value;
+            elementList.splice(i, 0, __spreadProps(__spreadValues({}, element), {
+              controlId,
+              value: value2 === "\n" ? ZERO : value2,
+              type: element.type || ElementType.TEXT,
+              control: el.control,
+              controlComponent: ControlComponent.VALUE
+            }));
+            i++;
           }
         }
       } else if (placeholder) {
@@ -5467,7 +5472,8 @@ function enter(evt, host) {
   }
   const copyElement = getAnchorElement(elementList, endIndex);
   if (copyElement) {
-    EDITOR_ELEMENT_STYLE_ATTR.forEach((attr) => {
+    const copyAttr = [...EDITOR_ELEMENT_STYLE_ATTR, ...EDITOR_ROW_ATTR];
+    copyAttr.forEach((attr) => {
       const value = copyElement[attr];
       if (value !== void 0) {
         enterText[attr] = value;
@@ -10330,15 +10336,31 @@ class Previewer {
     let dy = 0;
     switch (this.curHandleIndex) {
       case 0:
-        dx = this.mousedownX - evt.x;
-        dy = this.mousedownY - evt.y;
+        {
+          const offsetX = this.mousedownX - evt.x;
+          const offsetY = this.mousedownY - evt.y;
+          dx = Math.cbrt(offsetX ** 3 + offsetY ** 3);
+          dy = this.curElement.height * dx / this.curElement.width;
+        }
         break;
       case 1:
         dy = this.mousedownY - evt.y;
         break;
       case 2:
-        dx = evt.x - this.mousedownX;
-        dy = this.mousedownY - evt.y;
+        {
+          const offsetX = evt.x - this.mousedownX;
+          const offsetY = this.mousedownY - evt.y;
+          dx = Math.cbrt(offsetX ** 3 + offsetY ** 3);
+          dy = this.curElement.height * dx / this.curElement.width;
+        }
+        break;
+      case 4:
+        {
+          const offsetX = evt.x - this.mousedownX;
+          const offsetY = evt.y - this.mousedownY;
+          dx = Math.cbrt(offsetX ** 3 + offsetY ** 3);
+          dy = this.curElement.height * dx / this.curElement.width;
+        }
         break;
       case 3:
         dx = evt.x - this.mousedownX;
@@ -10347,16 +10369,16 @@ class Previewer {
         dy = evt.y - this.mousedownY;
         break;
       case 6:
-        dx = this.mousedownX - evt.x;
-        dy = evt.y - this.mousedownY;
+        {
+          const offsetX = this.mousedownX - evt.x;
+          const offsetY = evt.y - this.mousedownY;
+          dx = Math.cbrt(offsetX ** 3 + offsetY ** 3);
+          dy = this.curElement.height * dx / this.curElement.width;
+        }
         break;
       case 7:
         dx = this.mousedownX - evt.x;
         break;
-      default:
-        dx = evt.x - this.mousedownX;
-        dy = evt.y - this.mousedownY;
-        break;
     }
     const dw = this.curElement.width + dx / scale;
     const dh = this.curElement.height + dy / scale;
@@ -12960,7 +12982,7 @@ class Draw {
     return `${el.italic ? "italic " : ""}${el.bold ? "bold " : ""}${size * scale}px ${font}`;
   }
   computeRowList(innerWidth, elementList) {
-    var _a, _b, _c, _d, _e, _f;
+    var _a, _b, _c, _d, _e, _f, _g, _h;
     const { defaultSize, defaultRowMargin, scale, tdPadding, defaultTabWidth } = this.options;
     const defaultBasicRowMarginHeight = this.getDefaultBasicRowMarginHeight();
     const canvas = document.createElement("canvas");
@@ -12974,7 +12996,7 @@ class Draw {
         ascent: 0,
         elementList: [],
         startIndex: 0,
-        rowFlex: (_a = elementList == null ? void 0 : elementList[1]) == null ? void 0 : _a.rowFlex
+        rowFlex: ((_a = elementList == null ? void 0 : elementList[0]) == null ? void 0 : _a.rowFlex) || ((_b = elementList == null ? void 0 : elementList[1]) == null ? void 0 : _b.rowFlex)
       });
     }
     let listId;
@@ -13083,7 +13105,7 @@ class Draw {
         let curPagePreHeight = marginHeight;
         for (let r = 0; r < rowList.length; r++) {
           const row = rowList[r];
-          if (row.height + curPagePreHeight > height2 || ((_b = rowList[r - 1]) == null ? void 0 : _b.isPageBreak)) {
+          if (row.height + curPagePreHeight > height2 || ((_c = rowList[r - 1]) == null ? void 0 : _c.isPageBreak)) {
             curPagePreHeight = marginHeight + row.height;
           } else {
             curPagePreHeight += row.height;
@@ -13100,7 +13122,7 @@ class Draw {
               const tr = trList2[r];
               const trHeight = tr.height * scale;
               if (curPagePreHeight + rowMarginHeight + preTrHeight + trHeight > height2) {
-                if (((_c = element.colgroup) == null ? void 0 : _c.length) !== tr.tdList.length) {
+                if (((_d = element.colgroup) == null ? void 0 : _d.length) !== tr.tdList.length) {
                   deleteCount = 0;
                 }
                 break;
@@ -13186,7 +13208,7 @@ class Draw {
         metrics,
         style: this._getFont(element, scale)
       });
-      if ((_d = rowElement.control) == null ? void 0 : _d.minWidth) {
+      if ((_e = rowElement.control) == null ? void 0 : _e.minWidth) {
         if (rowElement.controlComponent) {
           controlRealWidth += metrics.width;
         }
@@ -13243,10 +13265,10 @@ class Draw {
           startIndex: i,
           elementList: [rowElement],
           ascent,
-          rowFlex: (_e = elementList[i + 1]) == null ? void 0 : _e.rowFlex,
+          rowFlex: ((_f = elementList[i]) == null ? void 0 : _f.rowFlex) || ((_g = elementList[i + 1]) == null ? void 0 : _g.rowFlex),
           isPageBreak: element.type === ElementType.PAGE_BREAK
         };
-        if (rowElement.controlComponent !== ControlComponent.PREFIX && ((_f = rowElement.control) == null ? void 0 : _f.indentation) === ControlIndentation.VALUE_START) {
+        if (rowElement.controlComponent !== ControlComponent.PREFIX && ((_h = rowElement.control) == null ? void 0 : _h.indentation) === ControlIndentation.VALUE_START) {
           const preStartIndex = curRow.elementList.findIndex((el) => el.controlId === rowElement.controlId && el.controlComponent !== ControlComponent.PREFIX);
           if (~preStartIndex) {
             const preRowPositionList = this.position.computeRowPosition({