@trafica/editor 1.0.55 → 1.0.57

package/dist/index.js

@@ -903,11 +903,20 @@ function patchDocument(prevDoc, nextDoc, container) {
     renderDocument(nextDoc, container);
     return;
   }
+  if (container.children.length !== next.length) {
+    renderDocument(nextDoc, container);
+    return;
+  }
   const domChildren = container.children;
   for (let i = 0; i < next.length; i++) {
     if (next[i] !== prev[i]) {
+      const oldEl = domChildren[i];
+      if (!oldEl) {
+        renderDocument(nextDoc, container);
+        return;
+      }
       const newEl = renderBlock(next[i], [i]);
-      container.replaceChild(newEl, domChildren[i]);
+      container.replaceChild(newEl, oldEl);
     }
   }
 }
@@ -1716,15 +1725,19 @@ function serializeBlock(node, idCounts = /* @__PURE__ */ new Map(), inCell = fal
       const src = escapeAttr((_j = (_i = node.attrs) == null ? void 0 : _i.src) != null ? _j : "");
       const alt = escapeAttr((_l = (_k = node.attrs) == null ? void 0 : _k.alt) != null ? _l : "");
       const width = ((_m = node.attrs) == null ? void 0 : _m.width) ? ` width="${node.attrs.width}"` : "";
-      const align = ((_n = node.attrs) == null ? void 0 : _n.align) ? ` data-align="${node.attrs.align}"` : "";
+      const alignVal = (_n = node.attrs) == null ? void 0 : _n.align;
+      const alignAttr = alignVal ? ` data-align="${alignVal}"` : "";
       const caption = ((_o = node.attrs) == null ? void 0 : _o.caption) ? escapeHTML(node.attrs.caption) : "";
       const x = (_p = node.attrs) == null ? void 0 : _p.x;
       const y = (_q = node.attrs) == null ? void 0 : _q.y;
-      const posAttrs = x !== void 0 ? ` data-x="${Math.round(x)}" data-y="${Math.round(y != null ? y : 0)}" style="position:absolute;left:${Math.round(x)}px;top:${Math.round(y != null ? y : 0)}px;"` : "";
+      const alignStyle = alignVal === "center" ? "display:block;margin-left:auto;margin-right:auto;text-align:center;" : alignVal === "right" ? "display:block;margin-left:auto;text-align:right;" : alignVal === "left" ? "display:block;margin-right:auto;text-align:left;" : "";
+      const posStyle = x !== void 0 ? `position:absolute;left:${Math.round(x)}px;top:${Math.round(y != null ? y : 0)}px;` : "";
+      const posAttrs = x !== void 0 ? ` data-x="${Math.round(x)}" data-y="${Math.round(y != null ? y : 0)}"` : "";
+      const figStyle = alignStyle || posStyle ? ` style="${alignStyle}${posStyle}"` : "";
       if (caption) {
-        return `<figure${align}${posAttrs}><img src="${src}" alt="${alt}"${width} /><figcaption>${caption}</figcaption></figure>`;
+        return `<figure${alignAttr}${posAttrs}${figStyle}><img src="${src}" alt="${alt}"${width} style="max-width:100%;height:auto;" /><figcaption>${caption}</figcaption></figure>`;
       }
-      return `<figure${align}${posAttrs}><img src="${src}" alt="${alt}"${width} /></figure>`;
+      return `<figure${alignAttr}${posAttrs}${figStyle}><img src="${src}" alt="${alt}"${width} style="max-width:100%;height:auto;" /></figure>`;
     }
     case "horizontal_rule":
       return "<hr />";