@useinsider/guido 2.0.0-beta.13ba613 → 2.0.0-beta.1ba7e26

package/dist/extensions/Blocks/Items/controls/button/link.js

@@ -1,32 +1,32 @@
 var r = Object.defineProperty;
-var a = (o, e, t) => e in o ? r(o, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[e] = t;
-var s = (o, e, t) => a(o, typeof e != "symbol" ? e + "" : e, t);
+var a = (n, e, t) => e in n ? r(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t;
+var i = (n, e, t) => a(n, typeof e != "symbol" ? e + "" : e, t);
 import { CommonControl as u } from "../../../common-control.js";
 import { ItemsBlockControlId as d } from "../../enums/controlEnums.js";
 import { useItemsBlockStore as l } from "../../store/items-block.js";
 import { syncButtonLinkFromAttributes as h } from "../../utils/syncAttributesFromConfigBlock.js";
 import { updateConfigBlockAttributes as m } from "../../utils/updateAttributes.js";
-const i = d.BUTTON_LINK, n = {
+const s = d.BUTTON_LINK, o = {
   LINK: "link"
 };
 class C extends u {
   constructor() {
     super(...arguments);
-    s(this, "store", l());
+    i(this, "store", l());
   }
   getId() {
-    return i;
+    return s;
   }
   getTemplate() {
     return `
-            <div class="${i}">
+            <div class="container ${s}">
                 ${this._getLink()}
             </div>
         `;
   }
   onRender() {
     this.api.updateValues({
-      [n.LINK]: this.store.buttonLink
+      [o.LINK]: this.store.buttonLink
     }), this._listenToFormUpdates();
   }
   onTemplateNodeUpdated(t) {
@@ -34,14 +34,14 @@ class C extends u {
       () => h(this.currentNode),
       () => {
         this.api.updateValues({
-          [n.LINK]: this.store.buttonLink
+          [o.LINK]: this.store.buttonLink
         });
       }
     );
   }
   _listenToFormUpdates() {
     this.api.onValueChanged(
-      n.LINK,
+      o.LINK,
       (t) => this._onLinkChange(t)
     );
   }
@@ -53,7 +53,7 @@ class C extends u {
             ${this._GuOneColumn([
       this._GuLabel({ text: "Link" }),
       this._GuTextInput({
-        name: n.LINK,
+        name: o.LINK,
         placeholder: "Enter Link",
         className: "es-100",
         disabled: !0
@@ -64,5 +64,5 @@ class C extends u {
 }
 export {
   C as ButtonLinkControl,
-  i as CONTROL_BLOCK_ID
+  s as CONTROL_BLOCK_ID
 };

package/dist/extensions/Blocks/Items/controls/image/link.js

@@ -1,12 +1,12 @@
 var r = Object.defineProperty;
-var a = (o, t, e) => t in o ? r(o, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : o[t] = e;
-var i = (o, t, e) => a(o, typeof t != "symbol" ? t + "" : t, e);
+var a = (n, t, e) => t in n ? r(n, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : n[t] = e;
+var i = (n, t, e) => a(n, typeof t != "symbol" ? t + "" : t, e);
 import { CommonControl as m } from "../../../common-control.js";
 import { ItemsBlockControlId as d } from "../../enums/controlEnums.js";
 import { useItemsBlockStore as l } from "../../store/items-block.js";
 import { syncImageLinkFromAttributes as h } from "../../utils/syncAttributesFromConfigBlock.js";
 import { updateConfigBlockAttributes as p } from "../../utils/updateAttributes.js";
-const s = d.IMAGE_LINK, n = {
+const s = d.IMAGE_LINK, o = {
   LINK: "link"
 };
 class N extends m {
@@ -19,14 +19,14 @@ class N extends m {
   }
   getTemplate() {
     return `
-            <div class="${s}">
+            <div class="container ${s}">
                 ${this._getLink()}
             </div>
         `;
   }
   onRender() {
     this.api.updateValues({
-      [n.LINK]: this.store.imageLink
+      [o.LINK]: this.store.imageLink
     }), this._listenToFormUpdates();
   }
   onTemplateNodeUpdated(e) {
@@ -34,14 +34,14 @@ class N extends m {
       () => h(this.currentNode),
       () => {
         this.api.updateValues({
-          [n.LINK]: this.store.imageLink
+          [o.LINK]: this.store.imageLink
         });
       }
     );
   }
   _listenToFormUpdates() {
     this.api.onValueChanged(
-      n.LINK,
+      o.LINK,
       (e) => this._onLinkChange(e)
     );
   }
@@ -53,7 +53,7 @@ class N extends m {
             ${this._GuOneColumn([
       this._GuLabel({ text: "Link" }),
       this._GuTextInput({
-        name: n.LINK,
+        name: o.LINK,
         placeholder: "Enter Link",
         className: "es-100",
         disabled: !0

package/dist/extensions/Blocks/Items/controls/name/trimming.js

@@ -1,6 +1,6 @@
 var d = Object.defineProperty;
 var h = (i, t, e) => t in i ? d(i, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : i[t] = e;
-var n = (i, t, e) => h(i, typeof t != "symbol" ? t + "" : t, e);
+var s = (i, t, e) => h(i, typeof t != "symbol" ? t + "" : t, e);
 import { ModificationDescription as a, UIElementType as l, UEAttr as g } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
 import { CommonControl as c } from "../../../common-control.js";
 import { ItemsBlockControlId as p } from "../../enums/controlEnums.js";
@@ -11,17 +11,17 @@ import { updateConfigBlockAttributes as u } from "../../utils/updateAttributes.j
 const y = p.NAME_TRIMMING, o = {
   TRIMMING: "trimming"
 };
-class _ extends c {
+class v extends c {
   constructor() {
     super(...arguments);
-    n(this, "store", N());
+    s(this, "store", N());
   }
   getId() {
     return y;
   }
   getTemplate() {
     return `
-            <div class="${p.NAME_TRIMMING}">
+            <div class="container ${p.NAME_TRIMMING}">
                 ${this._getTextTrimming()}
             </div>
         `;
@@ -43,8 +43,8 @@ class _ extends c {
     this.store.setNameTrimming(e), u(this.currentNode, this.api), this.api.updateValues({ [o.TRIMMING]: e }), this._applyTrimmingStyles(e);
   }
   _applyTrimmingStyles(e) {
-    var s;
-    const r = (s = this.currentNode) == null ? void 0 : s.querySelector("p > a");
+    var n;
+    const r = (n = this.currentNode) == null ? void 0 : n.querySelector("p > a");
     if (!r)
       return;
     const T = e !== void 0 ? e : this.store.nameTrimming, m = this.store.orientation === I.ORIENTATION.VERTICAL;
@@ -52,19 +52,17 @@ class _ extends c {
   }
   _getTextTrimming() {
     return `
-            <div class="container">
-                <div class="display-flex align-items-center justify-content-between">
-                    <${l.LABEL} 
-                        ${g.LABEL.text}="${this.api.translate("Text Trimming")}"
-                    >
-                    </${l.LABEL}>
-                    ${this._GuToggle(o.TRIMMING)}
-                </div>
+            <div class="display-flex align-items-center justify-content-between">
+                <${l.LABEL}
+                    ${g.LABEL.text}="${this.api.translate("Text Trimming")}"
+                >
+                </${l.LABEL}>
+                ${this._GuToggle(o.TRIMMING)}
             </div>
         `;
   }
 }
 export {
   y as CONTROL_BLOCK_ID,
-  _ as NameTrimmingControl
+  v as NameTrimmingControl
 };

package/dist/extensions/Blocks/Items/controls/price/currencyLocation.js

@@ -21,7 +21,7 @@ class Y extends T {
   }
   getTemplate() {
     return `
-            <div class="${h.PRICE_CURRENCY_LOCATION}">
+            <div class="container ${h.PRICE_CURRENCY_LOCATION}">
                 ${this._getCurrencyLocation()}
             </div>
         `;

package/dist/extensions/Blocks/Items/controls/price/currencySymbol.js

@@ -21,7 +21,7 @@ class P extends R {
   }
   getTemplate() {
     return `
-            <div class="${h.PRICE_CURRENCY_SYMBOL}">
+            <div class="container ${h.PRICE_CURRENCY_SYMBOL}">
                 ${this._getCurrencySymbol()}
             </div>
         `;

package/dist/extensions/Blocks/Items/controls/price/formattedPrice.js

@@ -3,12 +3,12 @@ var I = (r, e, t) => e in r ? _(r, e, { enumerable: !0, configurable: !0, writab
 var P = (r, e, t) => I(r, typeof e != "symbol" ? e + "" : e, t);
 import { ModificationDescription as F, UIElementType as m, UEAttr as C } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
 import { CommonControl as h } from "../../../common-control.js";
-import { ItemsBlockControlId as l, ItemsBlockId as A } from "../../enums/controlEnums.js";
+import { ItemsBlockControlId as p, ItemsBlockId as A } from "../../enums/controlEnums.js";
 import { productPairs as T } from "../../enums/productEnums.js";
 import { useItemsBlockStore as u } from "../../store/items-block.js";
 import { syncFormattedPriceFromAttributes as g } from "../../utils/syncAttributesFromConfigBlock.js";
 import { updateConfigBlockAttributes as D } from "../../utils/updateAttributes.js";
-const f = l.PRICE_FORMATTED_PRICE, n = {
+const f = p.PRICE_FORMATTED_PRICE, s = {
   FORMATTED_PRICE: "formattedPrice"
 };
 class y extends h {
@@ -21,13 +21,13 @@ class y extends h {
   }
   getTemplate() {
     return `
-            <div class="${l.PRICE_FORMATTED_PRICE}">
+            <div class="container ${p.PRICE_FORMATTED_PRICE}">
                 ${this._getFormattedPrice()}
             </div>
         `;
   }
   onRender() {
-    this.api.updateValues({ [n.FORMATTED_PRICE]: this.store.formattedPrice }), this.api.onValueChanged(n.FORMATTED_PRICE, (t) => {
+    this.api.updateValues({ [s.FORMATTED_PRICE]: this.store.formattedPrice }), this.api.onValueChanged(s.FORMATTED_PRICE, (t) => {
       this._onFormattedPriceChange(t);
     });
   }
@@ -35,14 +35,14 @@ class y extends h {
     super.onTemplateNodeUpdated(t), this.handleBlockInstanceChange(
       () => g(this.currentNode),
       () => {
-        this.api.updateValues({ [n.FORMATTED_PRICE]: this.store.formattedPrice });
+        this.api.updateValues({ [s.FORMATTED_PRICE]: this.store.formattedPrice });
       }
     );
   }
   _onFormattedPriceChange(t) {
     if (console.debug("Formatted price changed to: ", t), this.store.setFormattedPrice(t), D(this.currentNode, this.api), !this.currentNode)
       return;
-    const { itemsType: s } = this.store, i = T.PAIRS_FOR_EXTENSION.price[s], o = T.PAIRS_FOR_EXTENSION.originalPrice[s], [c, a] = t ? [i.DEFAULT_PRICE, i.DEFAULT_PRICE_FORMATTED] : [i.DEFAULT_PRICE_FORMATTED, i.DEFAULT_PRICE], [p, R] = t ? [o.DEFAULT_PRICE, o.DEFAULT_PRICE_FORMATTED] : [o.DEFAULT_PRICE_FORMATTED, o.DEFAULT_PRICE];
+    const { itemsType: n } = this.store, i = T.PAIRS_FOR_EXTENSION.price[n], o = T.PAIRS_FOR_EXTENSION.originalPrice[n], [c, a] = t ? [i.DEFAULT_PRICE, i.DEFAULT_PRICE_FORMATTED] : [i.DEFAULT_PRICE_FORMATTED, i.DEFAULT_PRICE], [l, R] = t ? [o.DEFAULT_PRICE, o.DEFAULT_PRICE_FORMATTED] : [o.DEFAULT_PRICE_FORMATTED, o.DEFAULT_PRICE];
     this._updatePriceBlock(
       this.currentNode,
       c,
@@ -50,22 +50,20 @@ class y extends h {
       "price"
     );
     const d = this.currentNode.closest(".items-block"), E = d == null ? void 0 : d.querySelector(`[esd-extension-block-id="${A.ORIGINAL_PRICE}"]`);
-    E && this._updatePriceBlock(E, p, R, "original price");
+    E && this._updatePriceBlock(E, l, R, "original price");
   }
-  _updatePriceBlock(t, s, i, o) {
-    const c = t.getInnerHTML().replace(s, i), a = `Updated ${o} to ${this.store.formattedPrice ? "formatted" : "unformatted"}`;
+  _updatePriceBlock(t, n, i, o) {
+    const c = t.getInnerHTML().replace(n, i), a = `Updated ${o} to ${this.store.formattedPrice ? "formatted" : "unformatted"}`;
     this.api.getDocumentModifier().modifyHtml(t).setInnerHtml(c).apply(new F(a));
   }
   _getFormattedPrice() {
     return `
-            <div class="container">
-                <div class="display-flex align-items-center justify-content-between">
-                    <${m.LABEL} 
-                        ${C.LABEL.text}="${this.api.translate("Formatted Price (e.g. $9.90)")}"
-                    >
-                    </${m.LABEL}>
-                    ${this._GuToggle(n.FORMATTED_PRICE)}
-                </div>
+            <div class="display-flex align-items-center justify-content-between">
+                <${m.LABEL}
+                    ${C.LABEL.text}="${this.api.translate("Formatted Price (e.g. $9.90)")}"
+                >
+                </${m.LABEL}>
+                ${this._GuToggle(s.FORMATTED_PRICE)}
             </div>
         `;
   }

package/dist/extensions/Blocks/Items/controls/price/hideDiscount.js

@@ -1,32 +1,32 @@
 var d = Object.defineProperty;
 var a = (i, e, t) => e in i ? d(i, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : i[e] = t;
-var o = (i, e, t) => a(i, typeof e != "symbol" ? e + "" : e, t);
-import { UIElementType as n, UEAttr as c } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
-import { CommonControl as u } from "../../../common-control.js";
+var s = (i, e, t) => a(i, typeof e != "symbol" ? e + "" : e, t);
+import { UIElementType as n, UEAttr as u } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
+import { CommonControl as c } from "../../../common-control.js";
 import { ItemsBlockControlId as r } from "../../enums/controlEnums.js";
 import { useItemsBlockStore as D } from "../../store/items-block.js";
 import { syncHideDiscountFromAttributes as p } from "../../utils/syncAttributesFromConfigBlock.js";
 import { updateConfigBlockAttributes as I } from "../../utils/updateAttributes.js";
-const l = r.PRICE_HIDE_DISCOUNT, s = {
+const h = r.PRICE_HIDE_DISCOUNT, o = {
   HIDE_DISCOUNT: "hideDiscount"
 };
-class N extends u {
+class N extends c {
   constructor() {
     super(...arguments);
-    o(this, "store", D());
+    s(this, "store", D());
   }
   getId() {
-    return l;
+    return h;
   }
   getTemplate() {
     return `
-            <div class="${r.PRICE_HIDE_DISCOUNT}">
+            <div class="container ${r.PRICE_HIDE_DISCOUNT}">
                 ${this._getHideDiscount()}
             </div>
         `;
   }
   onRender() {
-    this.api.updateValues({ [s.HIDE_DISCOUNT]: this.store.hideDiscount }), this.api.onValueChanged(s.HIDE_DISCOUNT, (t) => {
+    this.api.updateValues({ [o.HIDE_DISCOUNT]: this.store.hideDiscount }), this.api.onValueChanged(o.HIDE_DISCOUNT, (t) => {
       this._onHideDiscountChange(t);
     });
   }
@@ -34,28 +34,28 @@ class N extends u {
     super.onTemplateNodeUpdated(t), this.handleBlockInstanceChange(
       () => p(this.currentNode),
       () => {
-        this.api.updateValues({ [s.HIDE_DISCOUNT]: this.store.hideDiscount });
+        this.api.updateValues({ [o.HIDE_DISCOUNT]: this.store.hideDiscount });
       }
     );
   }
   _onHideDiscountChange(t) {
-    this.store.setHideDiscount(t), I(this.currentNode, this.api), this.api.updateValues({ [s.HIDE_DISCOUNT]: t });
+    this.store.setHideDiscount(t), I(this.currentNode, this.api), this.api.updateValues({ [o.HIDE_DISCOUNT]: t });
   }
   _getHideDiscount() {
     return `
-            <div class="container">
+
                 <div class="display-flex align-items-center justify-content-between">
                     <${n.LABEL} 
-                        ${c.LABEL.text}="${this.api.translate("Hide if same as discounted ")}"
+                        ${u.LABEL.text}="${this.api.translate("Hide if same as discounted ")}"
                     >
                     </${n.LABEL}>
-                    ${this._GuToggle(s.HIDE_DISCOUNT)}
+                    ${this._GuToggle(o.HIDE_DISCOUNT)}
                 </div>
             </div>
         `;
   }
 }
 export {
-  l as CONTROL_BLOCK_ID,
+  h as CONTROL_BLOCK_ID,
   N as PriceHideDiscountControl
 };

package/dist/extensions/Blocks/Items/controls/price/priceOrientation.js

@@ -23,7 +23,7 @@ class H extends y {
   }
   getTemplate() {
     return `
-            <div class="${O.PRICE_ORIENTATION}">
+            <div class="container ${O.PRICE_ORIENTATION}">
                 ${this._getPriceOrientation()}
             </div>
         `;

package/dist/extensions/Blocks/Items/template.js

@@ -1,45 +1,51 @@
-import { BlockType as $, BlockAttr as R } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
-import { ItemsBlockId as b } from "./enums/controlEnums.js";
-import { productPairs as c, templateFirstLine as v } from "./enums/productEnums.js";
-import { ItemInCartOptions as X, SETTINGS_ENUMS as y, DefaultConfigValues as P } from "./enums/settingsEnums.js";
-import K from "./layouts/horizontal.html.js";
-import z from "./layouts/vertical.html.js";
-let [N] = c.PAIRS_FOR_EXTENSION.imageSrc.CART_ITEMS.DEFAULT, [A] = c.PAIRS_FOR_EXTENSION.name.CART_ITEMS.DEFAULT, [f] = c.PAIRS_FOR_EXTENSION.price.CART_ITEMS.DEFAULT_PRICE_FORMATTED, [k] = c.PAIRS_FOR_EXTENSION.originalPrice.CART_ITEMS.DEFAULT_PRICE_FORMATTED, [m] = c.PAIRS_FOR_EXTENSION.quantity.CART_ITEMS.DEFAULT;
-const S = (e) => e.split(";").map((t) => t.trim()).filter((t) => !t.toLowerCase().startsWith("text-align")).join("; ").replace(/;\s*$/, ""), G = (e, t, n) => {
-  const a = n || P.productImageWidth;
+import { BlockType as u, BlockAttr as R } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
+import { ItemsBlockId as O } from "./enums/controlEnums.js";
+import { productPairs as d, templateFirstLine as z } from "./enums/productEnums.js";
+import { ItemInCartOptions as K, SETTINGS_ENUMS as g, DefaultConfigValues as m } from "./enums/settingsEnums.js";
+import G from "./layouts/horizontal.html.js";
+import Q from "./layouts/vertical.html.js";
+let [k] = d.PAIRS_FOR_EXTENSION.imageSrc.CART_ITEMS.DEFAULT, [A] = d.PAIRS_FOR_EXTENSION.name.CART_ITEMS.DEFAULT, [f] = d.PAIRS_FOR_EXTENSION.price.CART_ITEMS.DEFAULT_PRICE_FORMATTED, [y] = d.PAIRS_FOR_EXTENSION.originalPrice.CART_ITEMS.DEFAULT_PRICE_FORMATTED, [P] = d.PAIRS_FOR_EXTENSION.quantity.CART_ITEMS.DEFAULT;
+const V = (t, e) => t.split(";").map((n) => n.trim()).filter((n) => !n.toLowerCase().startsWith(e.toLowerCase())).join("; ").replace(/;\s*$/, ""), x = (t) => V(t, "text-align"), S = (t, e) => {
+  const n = new RegExp(`${e}\\s*:\\s*([^;]+)`, "i"), a = t.match(n);
+  return a ? a[1].trim() : null;
+}, N = (t, e, n) => new RegExp(`(${e}\\s*:\\s*)[^;]+`, "gi").test(t) ? t.replace(
+  new RegExp(`(${e}\\s*:\\s*)[^;]+`, "gi"),
+  `$1${n}`
+) : t, W = (t, e, n) => {
+  const a = n || m.productImageWidth;
   return `
         <td class="esd-block-image document-node-component default-block-component selectable ng-star-inserted"
             align="center"
             esd-extension-block-id="items-block-image"
             data-slot-1=""
             product-attr="imageSrc"
-            data-type="${e}"
-            data-number="${t}"
+            data-type="${t}"
+            data-number="${e}"
             style="font-size: 0px;">
             <a class="document-node-component ng-star-inserted"
                 target="_blank"
                 href="#!">
                 <img class="adapt-img document-node-component ng-star-inserted"
-                    src="${N}"
+                    src="${k}"
                     alt="${A}"
                     width="${a}">
             </a>
         </td>
     `;
-}, Q = (e, t) => `
-    <${$.BLOCK_IMAGE}
-        ${R.BLOCK_IMAGE.src}="${N}"
+}, q = (t, e) => `
+    <${u.BLOCK_IMAGE}
+        ${R.BLOCK_IMAGE.src}="${k}"
         ${R.BLOCK_IMAGE.alt}="${A}"
         ${R.BLOCK_IMAGE.href}="#!"
-        ${R.BLOCK_IMAGE.width}="${P.productImageWidth}"
-        ${R.BLOCK_IMAGE.height}="${P.productImageWidth}"
-        esd-extension-block-id="${b.IMAGE}"
+        ${R.BLOCK_IMAGE.width}="${m.productImageWidth}"
+        ${R.BLOCK_IMAGE.height}="${m.productImageWidth}"
+        esd-extension-block-id="${O.IMAGE}"
         data-slot-1
         product-attr="imageSrc"
-        data-type="${e}"
-        data-number="${t}"
+        data-type="${t}"
+        data-number="${e}"
     />
-    `, W = (e, t, n, a) => {
+    `, j = (t, e, n, a) => {
   const l = `
         text-decoration:none;
         font-size: inherit;
@@ -50,37 +56,45 @@ const S = (e) => e.split(";").map((t) => t.trim()).filter((t) => !t.toLowerCase(
         display: block;
         word-wrap:break-word;
         white-space: nowrap;
-        width: ${n === y.ORIENTATION.HORIZONTAL ? "130px" : "520px"};
+        width: ${n === g.ORIENTATION.HORIZONTAL ? "130px" : "520px"};
         overflow: hidden;
         text-overflow: ellipsis;
-    `, o = a || l;
-  return t ? `
+    `;
+  if (e) {
+    const o = x(a || l), c = S(o, "color"), s = S(o, "font-size"), p = [
+      c ? `color: ${c}` : "",
+      s ? `font-size: ${s}` : ""
+    ].filter(Boolean).join("; "), i = N(
+      N(o, "color", "inherit"),
+      "font-size",
+      "inherit"
+    );
+    return `
             <td class="esd-block-text es-p10"
                 align="center"
                 width="100%"
-                data-type="${e}"
-                esd-extension-block-id="${b.NAME}"
+                data-type="${t}"
+                esd-extension-block-id="${O.NAME}"
                 style="display: table-cell;">
-                <div id="renderedContent" class="service-element text-block-input-area text-block-preview-area"
-                    style="outline: none;" contenteditable="">
-                    <p contenteditable="false" path="1">
-                        <a
-                            href="#!"
-                            style="${o}"
-                            product-attr="name"
-                            data-slot-2
-                            width="100%">
-                            ${A}
-                        </a>
-                    </p>
-                </div>
+                <p contenteditable="false" path="1"${p ? ` style="${p}"` : ""}>
+                    <a
+                        href="#!"
+                        style="${i}"
+                        product-attr="name"
+                        data-slot-2
+                        width="100%">
+                        ${A}
+                    </a>
+                </p>
             </td>
-        ` : `<${$.BLOCK_TEXT} 
+        `;
+  }
+  return `<${u.BLOCK_TEXT} 
         width="100%" 
         align="center" 
         class="es-p10" 
-        data-type="${e}"
-        esd-extension-block-id="${b.NAME}"
+        data-type="${t}"
+        esd-extension-block-id="${O.NAME}"
     >
         <p contenteditable="false">
             <a  
@@ -105,17 +119,17 @@ const S = (e) => e.split(";").map((t) => t.trim()).filter((t) => !t.toLowerCase(
                 ${A}
             </a>
         </p>
-    </${$.BLOCK_TEXT}>
+    </${u.BLOCK_TEXT}>
 `;
-}, q = (e, t, n, a, r, l, o) => {
-  let d = f;
+}, H = (t, e, n, a, r, l, o) => {
+  let c = f;
   if (a && a.trim()) {
-    const u = `&nbsp;${a.trim()}&nbsp;`;
-    d = (r || "0") === "1" ? `${f}${u}` : `${u}${f}`;
+    const E = `&nbsp;${a.trim()}&nbsp;`;
+    c = (r || "0") === "1" ? `${f}${E}` : `${E}${f}`;
   }
-  const s = r === "1" ? "after" : "before", T = `data-formated="${n ? "true" : "false"}"`, i = `data-curency="${s}"`, E = a ? `data-currency_symbol="${a}"` : "";
+  const s = r === "1" ? "after" : "before", p = `data-formated="${n ? "true" : "false"}"`, i = `data-curency="${s}"`, T = a ? `data-currency_symbol="${a}"` : "";
   if (l) {
-    const p = S(o || "color: #060606; white-space: nowrap; font-size: 20px;");
+    const $ = x(o || "color: #060606; white-space: nowrap; font-size: 20px;");
     return `
         <td class="esd-block-text items-block-price"
             align="center"
@@ -124,19 +138,19 @@ const S = (e) => e.split(";").map((t) => t.trim()).filter((t) => !t.toLowerCase(
             <p product-attr="price"
                 contenteditable="false"
                 data-slot-4
-                data-type="${e}"
-                data-number="${t}"
-                ${T}
+                data-type="${t}"
+                data-number="${e}"
+                ${p}
                 ${i}
-                ${E}
-                style="${p}">
-                ${d}
+                ${T}
+                style="${$}">
+                ${c}
             </p>
         </td>`;
   }
   return `
-    <${$.BLOCK_TEXT}
-        esd-extension-block-id="${b.PRICE}"
+    <${u.BLOCK_TEXT}
+        esd-extension-block-id="${O.PRICE}"
         class="items-block-price"
         width="100%"
         align="center"
@@ -145,48 +159,48 @@ const S = (e) => e.split(";").map((t) => t.trim()).filter((t) => !t.toLowerCase(
             product-attr="price"
             contenteditable="false"
             data-slot-4
-            data-type="${e}"
-            data-number="${t}"
-            ${T}
+            data-type="${t}"
+            data-number="${e}"
+            ${p}
             ${i}
             ${a ? `data-currency_symbol="${a}"` : ""}
         >
-            ${d}
+            ${c}
         </p>
-    </${$.BLOCK_TEXT}>
+    </${u.BLOCK_TEXT}>
 `;
-}, V = (e, t, n, a, r, l, o = !0, d) => {
-  let s = k;
+}, Y = (t, e, n, a, r, l, o = !0, c) => {
+  let s = y;
   if (a && a.trim()) {
-    const p = `&nbsp;${a.trim()}&nbsp;`;
-    s = (r || "0") === "1" ? `${k}${p}` : `${p}${k}`;
+    const $ = `&nbsp;${a.trim()}&nbsp;`;
+    s = (r || "0") === "1" ? `${y}${$}` : `${$}${y}`;
   }
-  const T = r === "1" ? "after" : "before", i = `data-formated="${n ? "true" : "false"}"`, E = `data-curency="${T}"`, u = o ? "" : ' style="display: none;"';
+  const p = r === "1" ? "after" : "before", i = `data-formated="${n ? "true" : "false"}"`, T = `data-curency="${p}"`, E = o ? "" : ' style="display: none;"';
   if (l) {
-    const O = S(d || "color: #cc0000; white-space: nowrap; font-size: 19px;");
+    const b = x(c || "color: #cc0000; white-space: nowrap; font-size: 19px;");
     return `
         <td class="esd-block-text items-block-price"
             esd-extension-block-id="items-block-original-price"
             width="100%"
-            align="center"${u}>
+            align="center"${E}>
             <p
                 product-attr="originalPrice"
                 contenteditable="false"
                 data-slot-5
-                data-type="${e}"
-                data-number="${t}"
+                data-type="${t}"
+                data-number="${e}"
                 ${i}
-                ${E}
+                ${T}
                 ${a ? `data-currency_symbol="${a}"` : ""}
-                style="${O}">
+                style="${b}">
                 <s>${s}</s>
             </p>
         </td>`;
   }
   return `
-    <${$.BLOCK_TEXT}
+    <${u.BLOCK_TEXT}
         class="items-block-price"
-        esd-extension-block-id="${b.ORIGINAL_PRICE}"
+        esd-extension-block-id="${O.ORIGINAL_PRICE}"
         width="100%"
         align="center"
         ${o ? "" : 'style="display: none;"'}
@@ -196,124 +210,124 @@ const S = (e) => e.split(";").map((t) => t.trim()).filter((t) => !t.toLowerCase(
             contenteditable="false"
             data-slot-5
             style="color: #cc0000"
-            data-type="${e}"
-            data-number="${t}"
+            data-type="${t}"
+            data-number="${e}"
             ${i}
-            ${E}
+            ${T}
             ${a ? `data-currency_symbol="${a}"` : ""}
         >
             <s>${s}</s>
         </p>
-    </${$.BLOCK_TEXT}>
+    </${u.BLOCK_TEXT}>
 `;
-}, H = (e = !0, t, n) => {
-  const a = e ? "" : 'style="display: none;"';
-  return t ? `
+}, Z = (t = !0, e, n) => {
+  const a = t ? "" : 'style="display: none;"';
+  return e ? `
             <td class="esd-block-text es-p10 document-node-component default-block-component selectable"
                 width="100%" align="center" esd-extension-block-id="items-block-quantity" ${a}>
                 <div class="service-element text-block-input-area text-block-preview-area"
                     style="outline: none;" contenteditable="">
                     <p product-attr="quantity" data-slot-3="" contenteditable="false" width="100%" path="1"
                         style="${n || "text-align: center; font-size: 14px;"}">
-                        ${m}
+                        ${P}
                     </p>
                 </div>
             </td>` : `
-        <${$.BLOCK_TEXT}
+        <${u.BLOCK_TEXT}
             width="100%"
             align="center"
             class="es-p10"
-            esd-extension-block-id="${b.QUANTITY}"
-            ${e ? "" : 'style="display: none;"'}
+            esd-extension-block-id="${O.QUANTITY}"
+            ${t ? "" : 'style="display: none;"'}
         >
             <p
                 product-attr="quantity"
                 data-slot-3
                 contenteditable="false"
                 width="100%">
-                ${m}
+                ${P}
             </p>
-        </${$.BLOCK_TEXT}>
+        </${u.BLOCK_TEXT}>
     `;
-}, j = (e, t, n = "Buy", a, r) => a ? `
+}, J = (t, e, n = "Buy", a, r) => a ? `
         <td class="esd-block-button ins-button default-block-component selectable"
             align="center" width="100%" name="buy-button" caption="${n}"
             esd-extension-block-id="items-block-button"
-            product-attr="button" data-slot-6="" data-type="${e}" data-number="${t}">
+            product-attr="button" data-slot-6="" data-type="${t}" data-number="${e}">
             <span class="es-button-border" style="border-width: 0px;">
                 <a class="es-button" href="#!" target="_blank" style="${r || ""}">
                     ${n}
                 </a>
             </span>
         </td>` : `
-        <${$.BLOCK_BUTTON}
+        <${u.BLOCK_BUTTON}
             width="100%"
             class="ins-button"
             name="buy-button"
             caption="${n}"
             align="center"
-            esd-extension-block-id="${b.BUTTON}"
+            esd-extension-block-id="${O.BUTTON}"
             product-attr="button"
             data-slot-6
-            data-type="${e}"
-            data-number="${t}"
+            data-type="${t}"
+            data-number="${e}"
         >${n}
-        </${$.BLOCK_BUTTON}>
-    `, Y = (e) => !e || Object.keys(e).length === 0 ? '<esd-config-block style="display: none;"></esd-config-block>' : `<esd-config-block style="display: none;" ${Object.entries(e).map(([n, a]) => `${n}="${a}"`).join(" ")}></esd-config-block>`, Z = (e, t, n) => {
-  const a = t === y.ORIENTATION.VERTICAL, r = n === "horizontal";
-  return a ? r ? e : e.replace(
+        </${u.BLOCK_BUTTON}>
+    `, tt = (t) => !t || Object.keys(t).length === 0 ? '<esd-config-block style="display: none;"></esd-config-block>' : `<esd-config-block style="display: none;" ${Object.entries(t).map(([n, a]) => `${n}="${a}"`).join(" ")}></esd-config-block>`, et = (t, e, n) => {
+  const a = e === g.ORIENTATION.VERTICAL, r = n === "horizontal";
+  return a ? r ? t : t.replace(
     /<td\s+[^>]*class="[^"]*product-(?:original-)?price-class[^"]*"[^>]*>/gi,
     (l) => l.replace(/width="50%"/gi, 'width="100%"').replace(/width:\s*50%;/gi, "width: 100%;")
-  ) : r ? e : e.replace(
+  ) : r ? t : t.replace(
     /<td\s+[^>]*class="[^"]*horizontal-price[^"]*"[^>]*>/gi,
     (l) => /style\s*=\s*"/i.test(l) ? l.replace(/style\s*=\s*"([^"]*)"/i, 'style="display: none; $1"') : l.replace(/>$/, ' style="display: none;">')
   ).replace(
     /<td\s+[^>]*class="[^"]*vertical-price[^"]*"[^>]*>/gi,
     (l) => l.replace(/display:\s*none;?/gi, "display: table-cell;")
   );
-}, J = (e) => e ? `<td align="center"
+}, at = (t) => t ? `<td align="center"
             esd-extension-block-id="items-block" width="560"
             data-number="4"
-            class="ins-product-td items-block items-block-v2 esd-items-block esd-extension-block esd-container-frame">` : v, g = (e, t, n, a, r, l, o, d, s, T, i, E, u, p = "horizontal", O, _, I) => {
-  const x = `${`data-type="${t}" data-number="${n}"`} data-orientation="${a}"`, L = e.replace(
+            class="ins-product-td items-block items-block-v2 esd-items-block esd-extension-block esd-container-frame">` : z, L = (t, e, n, a, r, l, o, c, s, p, i, T, E, $ = "horizontal", b, _, I) => {
+  const F = `${`data-type="${e}" data-number="${n}"`} data-orientation="${a}"`, C = t.replace(
     /<td([^>]*class="[^"]*ins-product-td[^"]*"[^>]*)>/,
-    `<td$1 ${x}>`
-  ), F = s == null ? void 0 : s["data-product_image_control_image-width"], C = l ? G(t, n, F) : Q(t, n), M = (i == null ? void 0 : i.buttonLabel) || "Buy", U = (i == null ? void 0 : i.quantityControlEnabled) !== void 0 ? i.quantityControlEnabled : !0, D = (i == null ? void 0 : i.originalPriceVisible) !== void 0 ? i.originalPriceVisible : (s == null ? void 0 : s["data-product_original_price_control_enabled"]) !== "false", B = L.replace("{-{-TEMPLATE_FIRST_LINE-}-}", J(l)).replace("{-{-PRODUCT_IMAGE-}-}", C).replace("{-{-PRODUCT_NAME-}-}", W(t, l, a, E)).replaceAll(
+    `<td$1 ${F}>`
+  ), M = s == null ? void 0 : s["data-product_image_control_image-width"], U = l ? W(e, n, M) : q(e, n), B = (i == null ? void 0 : i.buttonLabel) || "Buy", D = (i == null ? void 0 : i.quantityControlEnabled) !== void 0 ? i.quantityControlEnabled : !0, X = (i == null ? void 0 : i.originalPriceVisible) !== void 0 ? i.originalPriceVisible : (s == null ? void 0 : s["data-product_original_price_control_enabled"]) !== "false", v = C.replace("{-{-TEMPLATE_FIRST_LINE-}-}", at(l)).replace("{-{-PRODUCT_IMAGE-}-}", U).replace("{-{-PRODUCT_NAME-}-}", j(e, l, a, T)).replaceAll(
     "{-{-PRODUCT_PRICE-}-}",
-    q(t, n, r, o, d, l, O)
+    H(e, n, r, o, c, l, b)
   ).replaceAll(
     "{-{-PRODUCT_ORIGINAL_PRICE-}-}",
-    V(
-      t,
+    Y(
+      e,
       n,
       r,
       o,
-      d,
+      c,
       l,
-      D,
+      X,
       _
     )
-  ).replace("{-{-PRODUCT_QUANTITY-}-}", H(U, l, I)).replace("{-{-PRODUCT_BUTTON-}-}", j(t, n, M, l, u)).replace("{-{-CONFIG_BLOCK-}-}", Y(s));
-  return Z(B, a, p);
+  ).replace("{-{-PRODUCT_QUANTITY-}-}", Z(D, l, I)).replace("{-{-PRODUCT_BUTTON-}-}", J(e, n, B, l, E)).replace("{-{-CONFIG_BLOCK-}-}", tt(s));
+  return et(v, a, $);
 };
-function st({
-  orientation: e,
-  itemsType: t = y.ITEMS_TYPE.CART_ITEMS,
+function ct({
+  orientation: t,
+  itemsType: e = g.ITEMS_TYPE.CART_ITEMS,
   itemId: n,
   currencySymbol: a,
   currencyLocation: r,
   migrate: l = !1,
   formattedPrice: o = !0,
-  configBlockAttributes: d,
+  configBlockAttributes: c,
   nodeConfig: s,
-  nameStyles: T,
+  nameStyles: p,
   buttonStyles: i,
-  priceStyles: E,
-  originalPriceStyles: u,
-  quantityStyles: p,
-  priceOrientation: O
+  priceStyles: T,
+  originalPriceStyles: E,
+  quantityStyles: $,
+  priceOrientation: b
 }) {
-  const _ = X[t].findIndex((h) => h.value === n);
+  const _ = K[e].findIndex((h) => h.value === n);
   let I = "1";
   if (_ >= 0)
     I = String(_ + 1);
@@ -321,48 +335,48 @@ function st({
     const h = n.match(/\((\d+)\)/);
     h && h[1] && ([, I] = h);
   }
-  N = c.PAIRS_FOR_EXTENSION.imageSrc[t].DEFAULT[_ >= 0 ? _ : 0], A = c.PAIRS_FOR_EXTENSION.name[t].DEFAULT[_ >= 0 ? _ : 0], f = o ? c.PAIRS_FOR_EXTENSION.price[t].DEFAULT_PRICE_FORMATTED : c.PAIRS_FOR_EXTENSION.price[t].DEFAULT_PRICE, k = o ? c.PAIRS_FOR_EXTENSION.originalPrice[t].DEFAULT_PRICE_FORMATTED : c.PAIRS_FOR_EXTENSION.originalPrice[t].DEFAULT_PRICE, m = c.PAIRS_FOR_EXTENSION.quantity[t].DEFAULT;
-  const w = O || (s == null ? void 0 : s.priceOrientation) || "horizontal";
-  return e === y.ORIENTATION.VERTICAL ? g(
-    z,
-    t,
-    I,
+  k = d.PAIRS_FOR_EXTENSION.imageSrc[e].DEFAULT[_ >= 0 ? _ : 0], A = d.PAIRS_FOR_EXTENSION.name[e].DEFAULT[_ >= 0 ? _ : 0], f = o ? d.PAIRS_FOR_EXTENSION.price[e].DEFAULT_PRICE_FORMATTED : d.PAIRS_FOR_EXTENSION.price[e].DEFAULT_PRICE, y = o ? d.PAIRS_FOR_EXTENSION.originalPrice[e].DEFAULT_PRICE_FORMATTED : d.PAIRS_FOR_EXTENSION.originalPrice[e].DEFAULT_PRICE, P = d.PAIRS_FOR_EXTENSION.quantity[e].DEFAULT;
+  const w = b || (s == null ? void 0 : s.priceOrientation) || "horizontal";
+  return t === g.ORIENTATION.VERTICAL ? L(
+    Q,
     e,
+    I,
+    t,
     o,
     l,
     a,
     r,
-    d,
+    c,
     void 0,
     // nodup
     s,
-    T,
+    p,
     i,
     w,
+    T,
     E,
-    u,
-    p
-  ) : g(
-    K,
-    t,
-    I,
+    $
+  ) : L(
+    G,
     e,
+    I,
+    t,
     o,
     l,
     a,
     r,
-    d,
+    c,
     void 0,
     // nodup
     s,
-    T,
+    p,
     i,
     w,
+    T,
     E,
-    u,
-    p
+    $
   );
 }
 export {
-  st as getDefaultTemplate
+  ct as getDefaultTemplate
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@useinsider/guido",
-  "version": "2.0.0-beta.13ba613",
+  "version": "2.0.0-beta.1ba7e26",
   "description": "Guido is a Vue + TypeScript wrapper for Email Plugin. Easily embed the email editor in your Vue applications.",
   "main": "./dist/guido.umd.cjs",
   "module": "./dist/library.js",