@innovastudio/contentbuilder 1.1.19 → 1.1.22

package/package.json

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

package/public/contentbuilder/contentbuilder.css

@@ -2893,6 +2893,7 @@ button:focus {
 #_cbhtml textarea:focus,
 .is-ui textarea:focus {
   outline: none;
+  box-shadow: none;
 }
 #_cbhtml select,
 .is-ui select {
@@ -2919,6 +2920,7 @@ button:focus {
 #_cbhtml select:focus,
 .is-ui select:focus {
   outline: none;
+  box-shadow: none;
 }
 #_cbhtml input[type=text],
 .is-ui input[type=text] {
@@ -2941,6 +2943,7 @@ button:focus {
 #_cbhtml input[type=text]:focus,
 .is-ui input[type=text]:focus {
   outline: none;
+  box-shadow: none;
 }
 #_cbhtml input[type=text] [type=checkbox], #_cbhtml input[type=text] [type=radio],
 .is-ui input[type=text] [type=checkbox],

package/public/contentbuilder/contentbuilder.esm.js

@@ -4738,8 +4738,8 @@ class Util {
 
       let builderActive = document.querySelector('.builder-active');
       if (builderActive) this.builder.applyBehaviorOn(builderActive);
-      cellElement = rowElement.childNodes[0];
-      cellElement.click(); //change active block to the newly created
+      cellElement = rowElement.querySelector('div');
+      if (cellElement) cellElement.click(); //change active block to the newly created
       // Change to row selection
 
       rowElement.className = rowElement.className.replace('row-outline', ''); // columnTool = parent.document.querySelector('.is-column-tool');
@@ -15732,7 +15732,7 @@ const renderQuickAdd = builder => {
     if (elm) dom$F.addEventListener(elm, 'click', () => {
       const mode = quickadd.getAttribute('data-mode');
       let html = `<div>
-                <a href="#" class="transition-all inline-block cursor-pointer no-underline border-2 border-solid border-transparent ml-1 mr-1 hover:border-transparent rounded bg-gray-200 hover:bg-gray-300 tracking-75 uppercase py-2 size-14 px-8 font-semibold text-gray-600">Read More</a>
+                <a href="#" class="transition-all inline-block cursor-pointer no-underline border-2 border-solid border-transparent ml-1 mr-1 hover:border-transparent rounded bg-gray-200 hover:bg-gray-300 tracking-50 uppercase py-2 size-14 px-6 font-semibold text-gray-600 leading-relaxed">Read More</a>
             </div>`;
 
       if (builder.opts.emailMode) {
@@ -15745,8 +15745,8 @@ const renderQuickAdd = builder => {
     if (elm) dom$F.addEventListener(elm, 'click', () => {
       const mode = quickadd.getAttribute('data-mode');
       let html = `<div>
-                <a href="#" class="transition-all inline-block cursor-pointer no-underline border-2 border-solid border-transparent ml-1 mr-1 hover:border-transparent rounded bg-gray-200 hover:bg-gray-300 tracking-75 uppercase py-2 size-14 px-8 font-semibold text-gray-600">Read More</a>
-                <a href="#" class="transition-all inline-block cursor-pointer no-underline border-2 border-solid ml-1 mr-1 rounded tracking-75 uppercase py-2 size-14 px-8 border-current hover:border-transparent hover:text-white font-semibold text-indigo-500 hover:bg-indigo-500">Get Started</a>
+                <a href="#" class="transition-all inline-block cursor-pointer no-underline border-2 border-solid border-transparent ml-1 mr-1 hover:border-transparent rounded bg-gray-200 hover:bg-gray-300 tracking-50 uppercase py-2 size-14 px-6 font-semibold text-gray-600 leading-relaxed">Read More</a>
+                <a href="#" class="transition-all inline-block cursor-pointer no-underline border-2 border-solid ml-1 mr-1 rounded tracking-50 uppercase py-2 size-14 px-6 border-current hover:border-transparent hover:text-white font-semibold text-indigo-500 hover:bg-indigo-500 leading-relaxed">Get Started</a>
             </div>`;
 
       if (builder.opts.emailMode) {
@@ -48167,52 +48167,52 @@ class ButtonEditor {
   renderTemplates() {
     const templates = [{
       text: 'Order Now',
-      className: 'transition-all inline-block cursor-pointer no-underline border-2 border-solid rounded-full border-current ml-1 mr-1 px-8 py-2 text-pink-600 hover:text-white  bg-white hover:bg-pink-500 hover:border-transparent size-18 font-semibold tracking-75'
+      className: 'transition-all inline-block cursor-pointer no-underline border-2 border-solid rounded-full border-current ml-1 mr-1 px-8 py-2 text-pink-600 hover:text-white  bg-white hover:bg-pink-500 hover:border-transparent size-18 font-semibold tracking-75 leading-relaxed'
     }, {
       text: 'Explore',
-      className: 'transition-all inline-block cursor-pointer no-underline font-semibold border-2 border-solid tracking-200 rounded-full border-current size-12 ml-1 mr-1 py-0 px-3 text-indigo-600 hover:text-white bg-white hover:bg-indigo-500 hover:border-transparent'
+      className: 'transition-all inline-block cursor-pointer no-underline font-semibold border-2 border-solid tracking-200 rounded-full border-current size-12 ml-1 mr-1 py-0 px-3 text-indigo-600 hover:text-white bg-white hover:bg-indigo-500 hover:border-transparent leading-relaxed'
     }, {
       text: 'View Demo',
-      className: 'transition-all inline-block cursor-pointer no-underline border-2 border-solid border-transparent ml-1 mr-1 hover:border-transparent rounded bg-gray-200 hover:bg-gray-300 size-16 py-1 px-5 font-normal tracking-wide text-gray-800'
+      className: 'transition-all inline-block cursor-pointer no-underline border-2 border-solid border-transparent ml-1 mr-1 hover:border-transparent rounded bg-gray-200 hover:bg-gray-300 size-16 py-1 px-5 font-normal tracking-wide text-gray-800 leading-relaxed'
     }, {
       text: 'Get Started',
-      className: 'transition-all inline-block cursor-pointer no-underline border-2 border-solid ml-1 mr-1 rounded size-16 text-black py-1 px-5 font-normal border-current hover: hover:border-current tracking-wide'
+      className: 'transition-all inline-block cursor-pointer no-underline border-2 border-solid ml-1 mr-1 rounded size-16 text-black py-1 px-5 font-normal border-current hover: hover:border-current tracking-wide leading-relaxed'
     }, {
       text: 'Create',
-      className: 'transition-all inline-block cursor-pointer no-underline border-2 border-solid border-transparent ml-1 mr-1 hover:border-transparent size-12 rounded bg-yellow-300 text-black bg-white hover:bg-yellow-400 font-normal px-3 py-0 tracking-75'
+      className: 'transition-all inline-block cursor-pointer no-underline border-2 border-solid border-transparent ml-1 mr-1 hover:border-transparent size-12 rounded bg-yellow-300 text-black bg-white hover:bg-yellow-400 font-normal px-3 py-0 tracking-75 leading-relaxed'
     }, {
       text: 'Hello!',
-      className: 'transition-all inline-block cursor-pointer no-underline border-2 border-solid border-current ml-1 mr-1 hover:text-white hover:border-transparent rounded-lg size-24 font-normal py-2 tracking-150 px-12 text-orange-500 bg-white hover:bg-orange-500'
+      className: 'transition-all inline-block cursor-pointer no-underline border-2 border-solid border-current ml-1 mr-1 hover:text-white hover:border-transparent rounded-lg size-24 font-normal py-2 tracking-150 px-12 text-orange-500 bg-white hover:bg-orange-500 leading-relaxed'
     }, {
       text: 'Build',
-      className: 'transition-all inline-block cursor-pointer no-underline border-2 border-solid border-transparent ml-1 mr-1 text-violet-700 hover:border-transparent hover:bg-cyan-200 rounded uppercase size-12 tracking-75 px-4 py-1 font-semibold bg-cyan-200'
+      className: 'transition-all inline-block cursor-pointer no-underline border-2 border-solid border-transparent ml-1 mr-1 text-violet-700 hover:border-transparent hover:bg-cyan-200 rounded uppercase size-12 tracking-75 px-4 py-1 font-semibold bg-cyan-200 leading-relaxed'
     }, {
       text: 'Contact',
-      className: 'transition-all inline-block border-2 border-solid rounded-none no-underline hover:border-transparent ml-1 mr-1 cursor-pointer bg-white text-red-600 border-current hover:bg-red-600 hover:text-white uppercase size-12 font-semibold py-2 px-6 tracking-150'
+      className: 'transition-all inline-block border-2 border-solid rounded-none no-underline hover:border-transparent ml-1 mr-1 cursor-pointer bg-white text-red-600 border-current hover:bg-red-600 hover:text-white uppercase size-12 font-semibold py-2 px-6 tracking-150 leading-relaxed'
     }, {
       text: 'Read More',
-      className: 'transition-all inline-block cursor-pointer border-2 border-solid border-transparent ml-1 mr-1 hover:border-transparent rounded size-16 py-1 px-5 font-normal tracking-wide text-gray-800 underline'
+      className: 'transition-all inline-block cursor-pointer border-2 border-solid border-transparent ml-1 mr-1 hover:border-transparent rounded size-16 py-1 px-5 font-normal tracking-wide text-gray-800 underline leading-relaxed'
     }, {
       text: 'Send a Message',
-      className: 'transition-all inline-block cursor-pointer no-underline border-2 border-solid ml-1 mr-1 rounded tracking-75 uppercase px-6 py-2 size-12 hover:border-transparent font-semibold bg-gray-200 border-transparent hover:bg-gray-300 text-gray-800'
+      className: 'transition-all inline-block cursor-pointer no-underline border-2 border-solid ml-1 mr-1 rounded tracking-75 uppercase px-6 py-2 size-12 hover:border-transparent font-semibold bg-gray-200 border-transparent hover:bg-gray-300 text-gray-800 leading-relaxed'
     }, {
       text: 'Our Works',
-      className: 'transition-all inline-block cursor-pointer no-underline border-2 border-solid ml-1 mr-1 rounded tracking-75 uppercase px-6 py-2 size-12 border-current hover:text-white hover:border-transparent hover:bg-indigo-500 text-indigo-500 font-semibold'
+      className: 'transition-all inline-block cursor-pointer no-underline border-2 border-solid ml-1 mr-1 rounded tracking-75 uppercase px-6 py-2 size-12 border-current hover:text-white hover:border-transparent hover:bg-indigo-500 text-indigo-500 font-semibold leading-relaxed'
     }, {
       text: 'Read More',
-      className: 'transition-all inline-block cursor-pointer no-underline border-2 border-solid mr-1 tracking-75 uppercase py-2 size-14 px-8 rounded font-normal ml-1 border-transparent bg-gray-200 hover:bg-gray-300 hover:border-transparent text-gray-800'
+      className: 'transition-all inline-block cursor-pointer no-underline border-2 border-solid mr-1 tracking-75 uppercase py-2 size-14 px-8 rounded font-normal ml-1 border-transparent bg-gray-200 hover:bg-gray-300 hover:border-transparent text-gray-800 leading-relaxed'
     }, {
       text: 'Get a Quote',
-      className: 'transition-all inline-block cursor-pointer no-underline border-2 border-solid mr-1 tracking-75 uppercase py-2 size-14 px-8 border-current rounded text-black hover:border-current font-normal ml-1'
+      className: 'transition-all inline-block cursor-pointer no-underline border-2 border-solid mr-1 tracking-75 uppercase py-2 size-14 px-8 border-current rounded text-black hover:border-current font-normal ml-1 leading-relaxed'
     }, {
       text: 'Try Demo',
-      className: 'transition-all inline-block cursor-pointer no-underline border-2 border-solid border-transparent hover:border-transparent bg-gray-200 hover:bg-gray-300 size-16 text-black font-normal uppercase py-3 px-11 tracking-75 mr-3 ml-0 rounded-md'
+      className: 'transition-all inline-block cursor-pointer no-underline border-2 border-solid border-transparent hover:border-transparent bg-gray-200 hover:bg-gray-300 size-16 text-black font-normal uppercase py-3 px-11 tracking-75 mr-3 ml-0 rounded-md leading-relaxed'
     }, {
       text: 'Buy Now',
-      className: 'transition-all inline-block cursor-pointer no-underline border-2 border-solid size-16 tracking-75 font-normal uppercase px-11 py-3 hover:text-white hover:bg-teal-500 bg-teal-400 text-white border-transparent hover:border-transparent ml-0 mr-2 rounded-md'
+      className: 'transition-all inline-block cursor-pointer no-underline border-2 border-solid size-16 tracking-75 font-normal uppercase px-11 py-3 hover:text-white hover:bg-teal-500 bg-teal-400 text-white border-transparent hover:border-transparent ml-0 mr-2 rounded-md leading-relaxed'
     }, {
       text: 'Play',
-      className: 'transition-all inline-block cursor-pointer no-underline border-2 border-solid ml-1 mr-1 size-16 text-black tracking-75 font-normal uppercase px-11 border-current hover:border-current py-3 rounded'
+      className: 'transition-all inline-block cursor-pointer no-underline border-2 border-solid ml-1 mr-1 size-16 text-black tracking-75 font-normal uppercase px-11 border-current hover:border-current py-3 rounded leading-relaxed'
     }];
     let html = '';
 
@@ -48308,6 +48308,7 @@ class ButtonEditor {
     dom$z.addClass(link, 'cursor-pointer');
     dom$z.addClass(link, 'border-2');
     dom$z.addClass(link, 'border-solid');
+    dom$z.addClass(link, 'leading-relaxed');
     link.removeAttribute('style');
     link.removeAttribute('onmouseover');
     link.removeAttribute('onmouseout');
@@ -48649,7 +48650,7 @@ class Hyperlink {
       let isButton;
       let display = dom$y.getStyle(link, 'display');
 
-      if (display === 'inline-block' || display === 'block') {
+      if (display === 'inline-block' || display === 'block' || display === 'flex') {
         isButton = true;
       }
 
@@ -69085,10 +69086,8 @@ class ContentBuilder {
           Additional Cleanup:
               - Remove empty elements (empty p, etc)
           */
-          // $block.find('h1:empty,h2:empty,h3:empty,h4:empty,h5:empty,h6:empty,p:empty').remove();
-          this.activeCol.querySelectorAll('*:empty').forEach(x => {
-            x.remove();
-          });
+          this.activeCol.find('h1:empty,h2:empty,h3:empty,h4:empty,h5:empty,h6:empty,p:empty').remove(); // this.activeCol.querySelectorAll('*:empty').forEach((x)=>{x.remove();}); // Makes <img> removed
+
           /*
           Additional Cleanup:
               Fix HTML structure. The problem:
@@ -69136,10 +69135,9 @@ class ContentBuilder {
 
               elmActive.outerHTML = elmActive.innerHTML; //fix
               // Re-clean empty elements
+              // this.activeCol.querySelectorAll('*:empty').forEach((x)=>{x.remove();}); // Makes <img> removed
 
-              this.activeCol.querySelectorAll('*:empty').forEach(x => {
-                x.remove();
-              }); //place cursor
+              this.activeCol.find('h1:empty,h2:empty,h3:empty,h4:empty,h5:empty,h6:empty,p:empty').remove(); //place cursor
 
               if (elmClosestElement) dom.moveCursorToElement(elmClosestElement.previousElementSibling);else dom.moveCursorToElement(this.activeCol);
               let builderActive = document.querySelector('.builder-active');