@innovastudio/contentbuilder 1.4.125 → 1.4.127

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@innovastudio/contentbuilder",
   "type": "module",
-  "version": "1.4.125",
+  "version": "1.4.127",
   "description": "",
   "main": "public/contentbuilder/contentbuilder.esm.js",
   "files": [

package/public/contentbuilder/contentbuilder.esm.js

@@ -1439,7 +1439,7 @@ class Util {
       const selection = this.builder.win.getSelection();
       const container = this.builder.dom.getElm();
       if (!container) return;
-      const sameSelection = container && container.innerText === selection.toString();
+      const sameSelection = container && container.innerText === selection.toString().trim();
       if (sameSelection || selection.toString().trim() === '') {
         this.builder.selectionElm = container;
 
@@ -3395,7 +3395,7 @@ class Dom {
         if (callback) callback(false);
         return;
       }
-      const sameSelection = container && container.innerText === selection.toString();
+      const sameSelection = container && container.innerText === selection.toString().trim();
       let newElement;
       if (sameSelection || selection.toString().trim() === '') {
         newElement = this.updateSelection(action, value, container);
@@ -3519,7 +3519,7 @@ class Dom {
       const selection = this.builder.win.getSelection();
       let container = this.getElm();
       if (!container) return;
-      const sameSelection = container && container.innerText === selection.toString();
+      const sameSelection = container && container.innerText === selection.toString().trim();
       if (currentElement) {
         if (mode === 'block') if (this.getStyle(container, 'display') === 'inline') {
           container = this.getParentBlock(container);
@@ -3600,6 +3600,21 @@ class Dom {
         blocks.push(item);
       }
     });
+
+    /*
+    If a block is double clicked to select the block, the selection goes to the next block as well.
+    This seems a default behavior (tested with simple contentEditable div). So the blocks contains 2 blocks.
+    To fix this, perform an extra test here:
+    */
+    if (blocks.length === 2) {
+      // console.log(blocks[0].innerText.trim());
+      // console.log(selection.toString().trim());
+      if (blocks[0].innerText.trim() === selection.toString().trim()) {
+        blocks.pop();
+        // console.log('remove last')
+      }
+    }
+
     if (multiSelectBlocks) {
       return blocks;
     } else {
@@ -3733,7 +3748,7 @@ class Dom {
       const selection = this.builder.win.getSelection();
       const container = this.getElm();
       if (!container) return;
-      const sameSelection = container && container.innerText === selection.toString();
+      const sameSelection = container && container.innerText === selection.toString().trim();
       if (sameSelection || selection.toString().trim() === '') {
         this.updateSelectionToggle(action, value, config, container);
       } else {
@@ -4155,7 +4170,7 @@ class Dom {
     const anchorNode = selection.anchorNode;
     if (!anchorNode) return;
     const container = anchorNode.nodeType !== Node.TEXT_NODE && anchorNode.nodeType !== Node.COMMENT_NODE ? anchorNode : anchorNode.parentElement;
-    const sameSelection = container && container.innerText === selection.toString();
+    const sameSelection = container && container.innerText === selection.toString().trim();
     if (sameSelection || selection.toString().trim() === '') {
       this.cleanElement(container);
     } else {
@@ -11311,6 +11326,7 @@ class UndoRedo {
     this.builder.opts.onRender();
   }
   saveForUndo(checkLater) {
+    if (this.builder.onBeforeSaveForUndo) this.builder.onBeforeSaveForUndo();
     if (this.builder.undoRedoStyles) {
       if (this.undoList[120]) {
         let saves = this.undoList[120][0];
@@ -66285,7 +66301,7 @@ class Rte {
           } else if (num === '+' || num === '-') {
             for (let i = 0; i < Object.keys(classes).length; i++) {
               let className = Object.values(classes)[i];
-              if (dom.hasClass(container, className)) {
+              if (container.closest('.' + className) && !container.classList.contains('is-builder')) {
                 if (num === '+') {
                   if (i + 1 === Object.keys(classes).length) return;
                   newClassName = Object.values(classes)[i + 1];
@@ -79509,6 +79525,44 @@ class ContentBuilder {
       var lastNode = docFrag.lastChild;
        range.insertNode(docFrag);
       */
+
+      /*
+      When selection is made by double clicking text (to select the entire block),
+      the actual selection goes to the next block as well (default behavior, tested using a simple contentEditable div).
+      To fix this, re-select the contents inside.
+      */
+
+      const blocks = this.dom.getSelectedBlocks();
+      const selection = this.win.getSelection();
+
+      /* 
+      Check same selection for the block first (this is more accurate than the sameSelection checking below).
+      In case of double click (to select the entire block), for example, on this element:
+           <h2 class="font-light size-54"><span class="size-24">Heading</span> 2 here</h2>
+       The sameSelection checking below is failed, since the container = this.getElm() will return not the entire h2, but only
+           <span class="size-24">Heading</span>
+       So, blocks checking below is made to fix it.
+      */
+      let blockSelection = false;
+      if (blocks.length === 1) {
+        if (blocks[0].innerText.trim() === selection.toString().trim()) {
+          let range = document.createRange();
+          range.selectNodeContents(blocks[0]);
+          selection.removeAllRanges();
+          selection.addRange(range);
+          blockSelection = true;
+        }
+      }
+      if (!blockSelection) {
+        const container = this.dom.getElm();
+        const sameSelection = container && container.innerText === selection.toString().trim();
+        if (sameSelection || selection.toString().trim() === '') {
+          let range = document.createRange();
+          range.selectNodeContents(container);
+          selection.removeAllRanges();
+          selection.addRange(range);
+        }
+      }
       document.execCommand('insertHTML', false, sPastedText);
       if (this.activeCol) {
         /*