@trafica/editor 1.0.39 → 1.0.41

package/dist/index.js

@@ -1639,23 +1639,27 @@ function serializeBlock(node, idCounts = /* @__PURE__ */ new Map(), inCell = fal
   var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A;
   switch (node.type) {
     case "paragraph": {
-      const align = ((_a = node.attrs) == null ? void 0 : _a.align) ? ` data-align="${node.attrs.align}"` : "";
-      const style = inCell ? ` style="margin:0;min-height:1.2em;"` : "";
-      return `<p${align}${style}>${serializeChildren(node.children)}</p>`;
+      const alignVal = (_a = node.attrs) == null ? void 0 : _a.align;
+      const alignAttrs = alignVal ? ` data-align="${alignVal}" style="text-align:${alignVal};"` : "";
+      const cellStyle = inCell ? ` style="margin:0;min-height:1.2em;${alignVal ? `text-align:${alignVal};` : ""}"` : "";
+      const attrs = inCell ? alignVal ? ` data-align="${alignVal}"${cellStyle}` : cellStyle : alignAttrs;
+      return `<p${attrs}>${serializeChildren(node.children)}</p>`;
     }
     case "heading": {
       const l = (_c = (_b = node.attrs) == null ? void 0 : _b.level) != null ? _c : 1;
-      const align = ((_d = node.attrs) == null ? void 0 : _d.align) ? ` data-align="${node.attrs.align}"` : "";
+      const alignVal = (_d = node.attrs) == null ? void 0 : _d.align;
+      const alignAttrs = alignVal ? ` data-align="${alignVal}" style="text-align:${alignVal};"` : "";
       const rawText = node.children.filter((c) => "text" in c).map((c) => c.text).join("");
       const base = slugify(rawText) || `heading-${l}`;
       const count = (_e = idCounts.get(base)) != null ? _e : 0;
       idCounts.set(base, count + 1);
       const id = count === 0 ? base : `${base}-${count}`;
-      return `<h${l} id="${id}"${align}>${serializeChildren(node.children)}</h${l}>`;
+      return `<h${l} id="${id}"${alignAttrs}>${serializeChildren(node.children)}</h${l}>`;
     }
     case "blockquote": {
-      const align = ((_f = node.attrs) == null ? void 0 : _f.align) ? ` data-align="${node.attrs.align}"` : "";
-      return `<blockquote${align}>${serializeChildren(node.children)}</blockquote>`;
+      const alignVal = (_f = node.attrs) == null ? void 0 : _f.align;
+      const alignAttrs = alignVal ? ` data-align="${alignVal}" style="text-align:${alignVal};"` : "";
+      return `<blockquote${alignAttrs}>${serializeChildren(node.children)}</blockquote>`;
     }
     case "bullet_list":
       return `<ul>${serializeChildren(node.children)}</ul>`;
@@ -1771,6 +1775,14 @@ function escapeHTML(str) {
 function escapeAttr(str) {
   return str.replace(/"/g, "&quot;").replace(/'/g, "&#39;");
 }
+var VALID_ALIGNS = /* @__PURE__ */ new Set(["left", "center", "right", "justify"]);
+function getAlign(el) {
+  const da = el.getAttribute("data-align");
+  if (da && VALID_ALIGNS.has(da)) return da;
+  const ta = el.style.textAlign;
+  if (ta && VALID_ALIGNS.has(ta)) return ta;
+  return null;
+}
 function parseHTMLBody(body) {
   const children = [];
   for (const child of Array.from(body.childNodes)) {
@@ -1791,35 +1803,35 @@ function parseHTMLNode(node) {
   switch (tag) {
     case "p":
     case "div": {
-      const align = el.getAttribute("data-align");
+      const align = getAlign(el);
       return { type: "paragraph", attrs: align ? { align } : {}, children: parseInlineChildren(el) };
     }
     case "h1": {
-      const align = el.getAttribute("data-align");
+      const align = getAlign(el);
       return { type: "heading", attrs: { level: 1, ...align ? { align } : {} }, children: parseInlineChildren(el) };
     }
     case "h2": {
-      const align = el.getAttribute("data-align");
+      const align = getAlign(el);
       return { type: "heading", attrs: { level: 2, ...align ? { align } : {} }, children: parseInlineChildren(el) };
     }
     case "h3": {
-      const align = el.getAttribute("data-align");
+      const align = getAlign(el);
       return { type: "heading", attrs: { level: 3, ...align ? { align } : {} }, children: parseInlineChildren(el) };
     }
     case "h4": {
-      const align = el.getAttribute("data-align");
+      const align = getAlign(el);
       return { type: "heading", attrs: { level: 4, ...align ? { align } : {} }, children: parseInlineChildren(el) };
     }
     case "h5": {
-      const align = el.getAttribute("data-align");
+      const align = getAlign(el);
       return { type: "heading", attrs: { level: 5, ...align ? { align } : {} }, children: parseInlineChildren(el) };
     }
     case "h6": {
-      const align = el.getAttribute("data-align");
+      const align = getAlign(el);
       return { type: "heading", attrs: { level: 6, ...align ? { align } : {} }, children: parseInlineChildren(el) };
     }
     case "blockquote": {
-      const align = el.getAttribute("data-align");
+      const align = getAlign(el);
       return { type: "blockquote", attrs: align ? { align } : {}, children: parseInlineChildren(el) };
     }
     case "ul": {
@@ -2495,6 +2507,30 @@ var toggleListOfType = (listType) => (engine) => {
     engine.dispatch(tr);
     return true;
   }
+  if (block.type === "list_item" && (parentType === "bullet_list" || parentType === "ordered_list")) {
+    tr.steps.push(tr_setNodeType(parentPath, listType, {}));
+    engine.dispatch(tr);
+    return true;
+  }
+  if (block.type === "check_list_item" && parentType === "check_list") {
+    const checkList = parent;
+    const grandParentPath = parentPath.slice(0, -1);
+    const listIdx = parentPath[parentPath.length - 1];
+    const convertedList = {
+      type: listType,
+      attrs: {},
+      children: checkList.children.map((item) => ({
+        type: "list_item",
+        attrs: {},
+        children: item.children
+      }))
+    };
+    tr.steps.push({ type: "delete_node", path: parentPath });
+    tr.steps.push({ type: "insert_node", parentPath: grandParentPath, index: listIdx, node: convertedList });
+    tr.steps.push(tr_setSelection(makeCollapsedSelection(makePosition([...grandParentPath, listIdx, blockIdx, 0], 0))));
+    engine.dispatch(tr);
+    return true;
+  }
   const listItem = {
     type: "list_item",
     attrs: {},
@@ -2653,6 +2689,25 @@ var toggleCheckList = (engine) => {
     engine.dispatch(tr);
     return true;
   }
+  if (block.type === "list_item" && (parentType === "bullet_list" || parentType === "ordered_list")) {
+    const listNode = parent;
+    const grandParentPath = parentPath.slice(0, -1);
+    const listIdx = parentPath[parentPath.length - 1];
+    const convertedList = {
+      type: "check_list",
+      attrs: {},
+      children: listNode.children.map((item) => ({
+        type: "check_list_item",
+        attrs: { checked: false },
+        children: item.children
+      }))
+    };
+    tr.steps.push({ type: "delete_node", path: parentPath });
+    tr.steps.push({ type: "insert_node", parentPath: grandParentPath, index: listIdx, node: convertedList });
+    tr.steps.push(tr_setSelection(makeCollapsedSelection(makePosition([...grandParentPath, listIdx, blockIdx, 0], 0))));
+    engine.dispatch(tr);
+    return true;
+  }
   const checkListItem = { type: "check_list_item", attrs: { checked: false }, children: block.children };
   const checkListNode = { type: "check_list", attrs: {}, children: [checkListItem] };
   tr.steps.push({ type: "delete_node", path: blockPath });