@useinsider/guido 1.0.3-beta.9d0ef3f → 1.0.3-beta.9dbb968

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

@@ -5,19 +5,19 @@ const e = {
   YES: "Yes",
   NO: "No"
 }, d = `
-    <td align="left" class="radio-button radio-button-v2 esd-block-radio es-p10t es-p10b es-p30r es-p30l">
+    <td align="left" class="radio-button-v2 esd-block-radio es-p10t es-p10b es-p30r es-p30l">
         <table cellpadding="0" cellspacing="0" role="presentation" width="100%">
             <tbody>
                 <tr>
                     <td align="left" width="70%" style="vertical-align: top;">
                         <table cellpadding="0" cellspacing="0" role="presentation" width="100%">
                             <tbody>
-                                <${t.BLOCK_TEXT}>
-                                    {-{-TITLE-}-}
-                                </${t.BLOCK_TEXT}>
-                                <${t.BLOCK_TEXT}>
-                                    {-{-DESCRIPTION-}-}
-                                </${t.BLOCK_TEXT}>
+                                    <${t.BLOCK_TEXT}>
+                                        {-{-TITLE-}-}
+                                    </${t.BLOCK_TEXT}>
+                                    <${t.BLOCK_TEXT}>
+                                        {-{-DESCRIPTION-}-}
+                                    </${t.BLOCK_TEXT}>
                             </tbody>
                         </table>
                     </td>
@@ -75,21 +75,12 @@ const e = {
             </tbody>
         </table>
     </td>
-`, a = `
-    <td
-        align="left"
-        esd-extension-block-id="radio-button-block"
+`, l = `
+    <td 
+        align="left" 
+        esd-extension-block-id="radio-button-block" 
         esd-handler-name="esd-extension-RadioButtonBlock"
-        class="
-            radio-button
-            radio-button-v2
-            esd-block-ra
-            esd-radio-button-block
-            esd-extension-block
-            es-p10t
-            es-p10b
-            es-p30r
-            es-p30l"
+        class="radio-button-v2 esd-block-ra esd-radio-button-block esd-extension-block es-p10t es-p10b es-p30r es-p30l"
     >
         <table cellpadding="0" cellspacing="0" role="presentation" width="100%">
             <tbody>
@@ -149,10 +140,10 @@ const e = {
         </table>
     </td>
 `;
-function l() {
+function a() {
   return d.replace("{-{-TITLE-}-}", `<p path="1">${e.TITLE}</p>`).replace("{-{-DESCRIPTION-}-}", `<p path="1">${e.DESCRIPTION}</p>`).replace("{-{-YES-}-}", `<p path="1">${e.YES}</p>`).replace("{-{-NO-}-}", `<p path="1">${e.NO}</p>`);
 }
 export {
-  a as default,
-  l as getDefaultTemplate
+  l as default,
+  a as getDefaultTemplate
 };

package/dist/extensions/Blocks/Unsubscribe/block.js

@@ -1,17 +1,17 @@
 var _ = Object.defineProperty;
-var S = (n, i, e) => i in n ? _(n, i, { enumerable: !0, configurable: !0, writable: !0, value: e }) : n[i] = e;
-var u = (n, i, e) => S(n, typeof i != "symbol" ? i + "" : i, e);
+var d = (n, i, e) => i in n ? _(n, i, { enumerable: !0, configurable: !0, writable: !0, value: e }) : n[i] = e;
+var u = (n, i, e) => d(n, typeof i != "symbol" ? i + "" : i, e);
 import { PAGE_TYPES as E } from "../../../enums/unsubscribe.js";
 import { useUnsubscribeStore as c } from "../../../stores/unsubscribe.js";
-import { Block as d, BlockCompositionType as L, ModificationDescription as b } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
-import { getDefaultTemplate as h } from "./template.js";
+import { Block as S, BlockCompositionType as h, ModificationDescription as b } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
+import { getDefaultTemplate as L } from "./template.js";
 import { UNSUBSCRIBE_EVENTS as a, DATA_ATTRIBUTES as o } from "./utils/constants.js";
 import { parsePageList as m } from "./utils/utils.js";
-const v = "unsubscribe-block", g = 'a[data-unsubscribe-link="true"]', T = ".unsubscribe-block-v2", f = "{{ins-unsubscribe-link}}", B = {
+const v = "unsubscribe-block", g = 'a[data-unsubscribe-link="true"]', B = ".unsubscribe-block-v2", f = "{{ins-unsubscribe-link}}", C = {
   [E.GLOBAL_UNSUBSCRIBE]: "{{ins-global-unsubscribe-link}}",
   [E.SUBSCRIPTION_PREFERENCE_CENTER]: "{{ins-preferences-unsubscribe-link}}"
 };
-class D extends d {
+class D extends S {
   constructor() {
     super();
     u(this, "selectEventListener", null);
@@ -25,7 +25,7 @@ class D extends d {
     return "unsubscribe-icon";
   }
   getBlockCompositionType() {
-    return L.BLOCK;
+    return h.BLOCK;
   }
   getName() {
     return this.api.translate("Unsubscribe Block");
@@ -34,10 +34,10 @@ class D extends d {
     return this.api.translate("Unsubscribe Block Description");
   }
   getTemplate() {
-    return h();
+    return L();
   }
   onCreated(e) {
-    "getOuterHTML" in e && !e.getOuterHTML() || "getAttribute" in e && e.getAttribute("data-migration") || (this.currentNode = e, this._resetStoreState(), this._setupSelectEventListener(), this._setupCancelEventListener(), this._checkExistingBlocks(), this._openDrawer());
+    "getAttribute" in e && e.getAttribute("data-migration") || (this.currentNode = e, this._resetStoreState(), this._setupSelectEventListener(), this._setupCancelEventListener(), this._checkExistingBlocks(), this._openDrawer());
   }
   onSelect(e) {
     this.currentNode = e, this._resetStoreState(), this._loadBlockState(e), this._setupSelectEventListener();
@@ -50,8 +50,8 @@ class D extends d {
   }
   _setupSelectEventListener() {
     this._removeSelectEventListener(), this.selectEventListener = (e) => {
-      const s = e, { collectionType: t, selectedPages: r } = s.detail;
-      this._updateBlock(t, r.join(","));
+      const r = e, { collectionType: t, selectedPages: s } = r.detail;
+      this._updateBlock(t, s.join(","));
     }, document.addEventListener(a.SELECT, this.selectEventListener);
   }
   _removeSelectEventListener() {
@@ -71,17 +71,17 @@ class D extends d {
   _removeEventListeners() {
     this._removeSelectEventListener(), this._removeCancelEventListener();
   }
-  _updateBlock(e, s) {
+  _updateBlock(e, r) {
     if (!this.currentNode || !("querySelector" in this.currentNode))
       return;
     const t = this.currentNode.querySelector(g);
     if (!t)
       return;
-    const r = this._getMergeTag(e);
-    this.api.getDocumentModifier().modifyHtml(t).setAttribute("href", r).apply(new b(`Updated unsubscribe link to ${r}`)), this.api.getDocumentModifier().modifyHtml(this.currentNode).setAttribute(o.PAGE_TYPE, e.toString()).setAttribute(o.PAGE_LIST, s).apply(new b("Updated unsubscribe block metadata"));
+    const s = this._getMergeTag(e);
+    this.api.getDocumentModifier().modifyHtml(t).setAttribute("href", s).apply(new b(`Updated unsubscribe link to ${s}`)), this.api.getDocumentModifier().modifyHtml(this.currentNode).setAttribute(o.PAGE_TYPE, e.toString()).setAttribute(o.PAGE_LIST, r).apply(new b("Updated unsubscribe block metadata"));
   }
   _getMergeTag(e) {
-    return B[e] ?? f;
+    return C[e] ?? f;
   }
   _openDrawer() {
     try {
@@ -93,11 +93,11 @@ class D extends d {
   }
   _checkExistingBlocks() {
     const e = c();
-    e.isGlobalUnsubscribeDisabled = !1, e.isSubscriptionPreferencesCenterDisabled = !1, this.api.getDocumentRoot().querySelectorAll(T).forEach((t) => {
+    e.isGlobalUnsubscribeDisabled = !1, e.isSubscriptionPreferencesCenterDisabled = !1, this.api.getDocumentRoot().querySelectorAll(B).forEach((t) => {
       if ("getAttribute" in t) {
-        const r = t.getAttribute(o.PAGE_TYPE);
-        if (r) {
-          const l = Number(r);
+        const s = t.getAttribute(o.PAGE_TYPE);
+        if (s) {
+          const l = Number(s);
           l === E.GLOBAL_UNSUBSCRIBE ? e.isGlobalUnsubscribeDisabled = !0 : l === E.SUBSCRIPTION_PREFERENCE_CENTER && (e.isSubscriptionPreferencesCenterDisabled = !0);
         }
       }
@@ -106,11 +106,11 @@ class D extends d {
   _loadBlockState(e) {
     if (!("getAttribute" in e))
       return;
-    const s = e.getAttribute(o.PAGE_TYPE), t = e.getAttribute(o.PAGE_LIST);
-    if (!s || !t)
+    const r = e.getAttribute(o.PAGE_TYPE), t = e.getAttribute(o.PAGE_LIST);
+    if (!r || !t)
       return;
-    const r = c(), l = Number(s), p = m(t);
-    r.setCollectionWithoutAutoSelection(l), r.loadSelectedTemplates(p);
+    const s = c(), l = Number(r), p = m(t);
+    s.setCollectionWithoutAutoSelection(l), s.loadSelectedTemplates(p);
   }
   _resetStoreState() {
     c().$reset();
@@ -118,11 +118,11 @@ class D extends d {
   _removeBlockTemplatesFromStore(e) {
     if (!("getAttribute" in e))
       return;
-    const s = e.getAttribute(o.PAGE_LIST);
-    if (!s)
+    const r = e.getAttribute(o.PAGE_LIST);
+    if (!r)
       return;
-    const t = c(), r = m(s);
-    t.removeUnsubscribePages(r);
+    const t = c(), s = m(r);
+    t.removeUnsubscribePages(s);
   }
 }
 export {

package/dist/extensions/DynamicContent/dynamic-content-modal.d.ts

@@ -0,0 +1,6 @@
+import type { DynamicContent } from '@@/Types/generic';
+export declare class ExternalMergeTagsLibrary {
+    selectedDynamicContent: DynamicContent | null;
+    dataSelectCallback: (data: DynamicContent) => void;
+    openMergeTagsLibrary(dynamicContent: DynamicContent, onDataSelectCallback: (data: DynamicContent) => void): void;
+}

package/dist/extensions/DynamicContent/dynamic-content-modal.js

@@ -1,33 +1,27 @@
-var d = Object.defineProperty;
-var m = (t, e, n) => e in t ? d(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n;
-var c = (t, e, n) => m(t, typeof e != "symbol" ? e + "" : e, n);
-class C {
+var i = Object.defineProperty;
+var d = (t, e, n) => e in t ? i(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n;
+var a = (t, e, n) => d(t, typeof e != "symbol" ? e + "" : e, n);
+class y {
   constructor() {
-    c(this, "selectedDynamicContent", null);
-    c(this, "dataSelectCallback", () => {
+    a(this, "selectedDynamicContent", null);
+    a(this, "dataSelectCallback", () => {
     });
-    c(this, "closeDynamicContentHandler", null);
   }
-  /**
-   * Opens the merge tags library modal
-   * @param dynamicContent - Currently selected dynamic content (if any)
-   * @param onDataSelectCallback - Callback invoked when user selects a merge tag
-   * @param position - Optional position data to place the modal
-   */
-  openMergeTagsLibrary(e, n, l) {
-    this.closeDynamicContentHandler && (document.removeEventListener("dynamic-content:close", this.closeDynamicContentHandler), this.closeDynamicContentHandler = null), this.dataSelectCallback = n, this.selectedDynamicContent = e;
-    const o = {
-      attribute: e,
-      position: l
-    }, s = new CustomEvent("dynamic-content:open", {
-      detail: o
+  openMergeTagsLibrary(e, n) {
+    this.dataSelectCallback = n, this.selectedDynamicContent = e;
+    const s = new CustomEvent("dynamic-content:open", {
+      detail: {
+        attribute: e
+      }
     });
-    document.dispatchEvent(s), this.closeDynamicContentHandler = (i) => {
-      const a = i.detail;
-      this.selectedDynamicContent = a, a.text && a.value && this.dataSelectCallback(a);
-    }, document.addEventListener("dynamic-content:close", this.closeDynamicContentHandler);
+    document.dispatchEvent(s);
+    const o = (l) => {
+      const c = l.detail;
+      this.selectedDynamicContent = c, c.text && c.value && this.dataSelectCallback(c), document.removeEventListener("dynamic-content:close", o);
+    };
+    document.addEventListener("dynamic-content:close", o);
   }
 }
 export {
-  C as ExternalMergeTagsLibrary
+  y as ExternalMergeTagsLibrary
 };

package/dist/extensions/DynamicContent/dynamic-content.d.ts

@@ -0,0 +1,16 @@
+import { UIElementType, UIElement, UIElementTagRegistry } from '@stripoinc/ui-editor-extensions';
+export declare class DynamicContentTagRegistry extends UIElementTagRegistry {
+    registerUiElements(uiElementsTagsMap: Record<UIElementType, string>): void;
+}
+export declare class DynamicContentUiElementExtension extends UIElement {
+    private mergeTagsButton;
+    private listener;
+    private mergeTagsLibrary;
+    private selectedDynamicContent;
+    getId(): string;
+    onRender(container: HTMLElement): void;
+    onDestroy(): void;
+    _onClick(): void;
+    openMergeTagLibrary(): void;
+    getTemplate(): string;
+}

package/dist/extensions/DynamicContent/dynamic-content.js

@@ -1,156 +1,61 @@
-var c = Object.defineProperty;
-var g = (o, s, t) => s in o ? c(o, s, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[s] = t;
-var r = (o, s, t) => g(o, typeof s != "symbol" ? s + "" : s, t);
-import { mergeTagToDynamicContent as d, dynamicContentToMergeTags as m } from "../../utils/genericUtil.js";
-import { UIElement as u, UIElementType as a, UEAttr as h, UIElementTagRegistry as T } from "../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
-import { ExternalMergeTagsLibrary as y } from "./dynamic-content-modal.js";
-const l = "external-dynamic-content-ui-element", C = "button-add-dynamic-content";
-class p extends T {
-  registerUiElements(s) {
-    s[a.MERGETAGS] = l;
+var o = Object.defineProperty;
+var g = (n, t, e) => t in n ? o(n, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : n[t] = e;
+var i = (n, t, e) => g(n, typeof t != "symbol" ? t + "" : t, e);
+import { dynamicContentToMergeTags as m } from "../../utils/genericUtil.js";
+import { UIElement as c, UIElementType as r, UEAttr as l, UIElementTagRegistry as d } from "../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
+import { ExternalMergeTagsLibrary as T } from "./dynamic-content-modal.js";
+const a = "external-dynamic-content-ui-element", y = "button-add-dynamic-content";
+class p extends d {
+  registerUiElements(t) {
+    t[r.MERGETAGS] = a;
   }
 }
-class b extends u {
+class C extends c {
   constructor() {
     super(...arguments);
-    r(this, "mergeTagsButton", null);
-    r(this, "mergeTagsLibrary", null);
-    r(this, "clickListener", null);
-    r(this, "lastClickedElement", null);
-    r(this, "lastClickedFrame", null);
-    r(this, "mousedownListener", null);
+    i(this, "mergeTagsButton", null);
+    i(this, "listener", () => {
+    });
+    i(this, "mergeTagsLibrary", null);
+    i(this, "selectedDynamicContent", { value: "", text: "" });
   }
   getId() {
-    return l;
+    return a;
   }
-  onRender(t) {
-    var e;
-    this.mergeTagsButton = t.querySelector("#guido__btn-add-dynamic-content"), this.clickListener = this._onClick.bind(this), (e = this.mergeTagsButton) == null || e.addEventListener("click", this.clickListener), this._setupCoordinateTracking();
+  onRender(e) {
+    var s;
+    this.listener = this._onClick.bind(this), this.mergeTagsButton = e.querySelector("#guido__btn-add-dynamic-content"), (s = this.mergeTagsButton) == null || s.addEventListener("click", this.listener);
   }
   onDestroy() {
-    var t;
-    this.clickListener && ((t = this.mergeTagsButton) == null || t.removeEventListener("click", this.clickListener)), this._cleanupCoordinateTracking(), this.mergeTagsButton = null, this.clickListener = null, this.lastClickedElement = null, this.lastClickedFrame = null;
+    var e;
+    (e = this.mergeTagsButton) == null || e.removeEventListener("click", this.listener);
   }
   _onClick() {
     this.openMergeTagLibrary();
   }
-  /**
-   * Called when Stripo detects merge tag interactions
-   * This is the key method that receives notifications about merge tag clicks
-   * @param name - Attribute name (e.g., 'mergeTag')
-   * @param value - MergeTag object with label, value, selStart, selEnd, etc.
-   */
-  onAttributeUpdated(t, e) {
-    if (t !== "mergeTag" || !(e != null && e.value))
-      return;
-    const n = d(e), i = this._getLastClickedPosition();
-    this.lastClickedElement = null, this.lastClickedFrame = null, this._openDynamicContentLibrary(n, i);
-  }
   openMergeTagLibrary() {
-    const t = this._getButtonPosition(), e = { value: "", text: "" };
-    this._openDynamicContentLibrary(e, t);
-  }
-  /**
-   * Opens the dynamic content library for external apps
-   * Dispatches event with dynamic content data and position
-   */
-  _openDynamicContentLibrary(t, e) {
-    this.mergeTagsLibrary || (this.mergeTagsLibrary = new y()), this.mergeTagsLibrary.openMergeTagsLibrary(
-      t,
-      (n) => {
-        n.text && n.value ? this.api.triggerValueChange(m([n])[0]) : this.api.triggerValueChange(null);
-      },
-      e
+    this.mergeTagsLibrary || (this.mergeTagsLibrary = new T()), this.mergeTagsLibrary.openMergeTagsLibrary(
+      this.selectedDynamicContent,
+      (e) => {
+        this.api.onValueChanged(m([e])[0]);
+      }
     );
   }
-  /**
-   * Gets the button's position on the screen
-   * Used to position the modal or anything else near the button
-   */
-  _getButtonPosition() {
-    if (!this.mergeTagsButton)
-      return { x: 0, y: 0, width: 0, height: 0 };
-    const { x: t, y: e, width: n, height: i } = this.mergeTagsButton.getBoundingClientRect();
-    return { x: t, y: e, width: n, height: i };
-  }
-  /**
-   * Sets up coordinate tracking for merge tag clicks in the iframe
-   * Workaround from Stripo intercepting click events - tracks mousedown events instead
-   */
-  _setupCoordinateTracking() {
-    var e;
-    const t = this._getEditorFrame();
-    (e = t == null ? void 0 : t.contentWindow) != null && e.document && (this.mousedownListener = (n) => {
-      const i = this._findMergeTagElement(n.target);
-      i && (this.lastClickedElement = i, this.lastClickedFrame = t);
-    }, t.contentWindow.document.addEventListener("mousedown", this.mousedownListener));
-  }
-  /**
-   * Gets the editor iframe element
-   */
-  _getEditorFrame() {
-    var n;
-    const t = document.querySelector("ui-editor");
-    if (!(t != null && t.shadowRoot))
-      return null;
-    const e = t.shadowRoot.querySelector("iframe");
-    return (n = e == null ? void 0 : e.contentWindow) != null && n.document ? e : null;
-  }
-  /**
-   * Finds merge tag element in the element tree
-   */
-  _findMergeTagElement(t) {
-    return t.closest(".target, .esd-merge-tag");
-  }
-  /**
-   * Gets the position of the last clicked element, calculated on-demand
-   * This ensures we always use the correct element's position even with rapid clicks
-   */
-  _getLastClickedPosition() {
-    if (!(!this.lastClickedElement || !this.lastClickedFrame))
-      return this._calculateAbsolutePosition(this.lastClickedFrame, this.lastClickedElement);
-  }
-  /**
-   * Calculates absolute position of element relative to page
-   */
-  _calculateAbsolutePosition(t, e) {
-    const n = t.getBoundingClientRect(), i = e.getBoundingClientRect();
-    return {
-      x: n.x + i.x,
-      y: n.y + i.y,
-      width: i.width,
-      height: i.height
-    };
-  }
-  /**
-   * Cleans up the coordinate tracking event listener
-   */
-  _cleanupCoordinateTracking() {
-    var e;
-    if (!this.mousedownListener)
-      return;
-    const t = this._getEditorFrame();
-    (e = t == null ? void 0 : t.contentWindow) != null && e.document && t.contentWindow.document.removeEventListener("mousedown", this.mousedownListener), this.mousedownListener = null;
-  }
-  /**
-   * Returns the HTML template for the "Add Dynamic Content" button
-   * This button is placed in the merge tags selector UI
-   */
   getTemplate() {
     return `
             <div>
-                <${a.BUTTON} 
+                <${r.BUTTON} 
                     id="guido__btn-add-dynamic-content" 
                     class="btn btn-primary"
-                    ${h.BUTTON.name}="${C}">
-                        <${a.ICON} src="plus" class="icon icon-button color-primary">
-                        </${a.ICON}>
+                    ${l.BUTTON.name}="${y}">
+                        <${r.ICON} src="plus" class="icon icon-button color-primary">
+                        </${r.ICON}>
                         ${this.api.translate("Add Dynamic Content")}
-                </${a.BUTTON}>
+                </${r.BUTTON}>
             </div>`;
   }
 }
 export {
   p as DynamicContentTagRegistry,
-  b as DynamicContentUiElementExtension
+  C as DynamicContentUiElementExtension
 };

package/dist/guido.css

@@ -1 +1 @@
-.gap-16[data-v-6562e38c],.gap-16[data-v-1ccb6d4a]{gap:16px}[data-v-0502bceb] .in-button-v2__wrapper{line-height:0}[data-v-b5997368] .in-segments-wrapper .in-tooltip-wrapper__box{text-align:left}.version-history-item[data-v-ee4b9c3f]{flex-basis:200px}.version-history-wrapper[data-v-52a77eec]{gap:8px}.view-options-wrapper[data-v-d405ca59]{position:relative;display:inline-block}.new-tag[data-v-d405ca59]{position:absolute;top:-8px;right:-16px;z-index:10}[data-v-d405ca59] .guido__verion-history-view-option-selection-desktop svg,[data-v-d405ca59] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-d405ca59] .in-segments-wrapper__button_selected,[data-v-d405ca59] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-d405ca59] .in-tooltip-wrapper__icon{cursor:pointer}.view-options-wrapper[data-v-195ab6d4]{position:relative;display:inline-block}.new-tag[data-v-195ab6d4]{position:absolute;top:-8px;right:-16px;z-index:10}[data-v-195ab6d4] .guido__view-option-selection-desktop svg,[data-v-195ab6d4] .guido__view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-195ab6d4] .in-segments-wrapper__button_selected,[data-v-195ab6d4] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-195ab6d4] .in-tooltip-wrapper__icon{cursor:pointer}.guido-loading__wrapper[data-v-dced5582]{height:100%;top:75px}.guido-editor__wrapper[data-v-48a9b534],.guido-editor__container[data-v-48a9b534]{width:100%;height:calc(100vh - 128px)}.guido-editor__no-header[data-v-48a9b534]{height:calc(100vh - 75px)}[data-v-70835920] .in-breadcrumb-wrapper__links{cursor:pointer}.templates-wrapper[data-v-a86fc486]{gap:16px;grid-template-columns:repeat(3,1fr)}.templates-wrapper .template-wrapper[data-v-a86fc486]{cursor:pointer}.templates-wrapper .template-wrapper .template-container[data-v-a86fc486]{height:274px;padding:2px;transition:none}.templates-wrapper .template-wrapper .template-container.selected[data-v-a86fc486]{padding:1px}.templates-wrapper .template-wrapper .template-container .thumbnail[data-v-a86fc486]{object-fit:cover;transform:scale(1)}[data-v-dd57102d] .guido__verion-history-view-option-selection-desktop svg,[data-v-dd57102d] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-dd57102d] .in-segments-wrapper__button_selected,[data-v-dd57102d] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}.error-list[data-v-7a09985c]{gap:16px}[data-v-c2adc57d] .in-progress-wrapper__progress p span:last-child{display:none!important}.desktop-preview-container[data-v-2dd60b0c],[data-v-2dd60b0c] .desktop-preview-container .in-container{min-height:720px!important;height:100%}.cropped-text[data-v-f20b3a9b]{width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}[data-v-d3c52b44] .vueperslides__bullets,[data-v-dd1a237a] .vueperslides__bullets{pointer-events:none!important}[data-v-dd1a237a] .vueperslides__parallax-wrapper{height:110px!important}[data-v-a408dcea] .vueperslides__bullets{pointer-events:none!important}[data-v-a408dcea] .vueperslides__parallax-wrapper{height:110px!important}
+[data-v-2c168944] .in-button-v2__wrapper{line-height:0}[data-v-b5997368] .in-segments-wrapper .in-tooltip-wrapper__box{text-align:left}.version-history-item[data-v-ee4b9c3f]{flex-basis:200px}.version-history-wrapper[data-v-52a77eec]{gap:8px}.view-options-wrapper[data-v-d405ca59]{position:relative;display:inline-block}.new-tag[data-v-d405ca59]{position:absolute;top:-8px;right:-16px;z-index:10}[data-v-d405ca59] .guido__verion-history-view-option-selection-desktop svg,[data-v-d405ca59] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-d405ca59] .in-segments-wrapper__button_selected,[data-v-d405ca59] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-d405ca59] .in-tooltip-wrapper__icon{cursor:pointer}.view-options-wrapper[data-v-195ab6d4]{position:relative;display:inline-block}.new-tag[data-v-195ab6d4]{position:absolute;top:-8px;right:-16px;z-index:10}[data-v-195ab6d4] .guido__view-option-selection-desktop svg,[data-v-195ab6d4] .guido__view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-195ab6d4] .in-segments-wrapper__button_selected,[data-v-195ab6d4] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-195ab6d4] .in-tooltip-wrapper__icon{cursor:pointer}.guido-loading__wrapper[data-v-dced5582]{height:100%;top:75px}.guido-editor__wrapper[data-v-85d64228],.guido-editor__container[data-v-85d64228]{width:100%;height:calc(100vh - 128px)}.guido-editor__no-header[data-v-85d64228]{height:calc(100vh - 75px)}[data-v-70835920] .in-breadcrumb-wrapper__links{cursor:pointer}.templates-wrapper[data-v-a86fc486]{gap:16px;grid-template-columns:repeat(3,1fr)}.templates-wrapper .template-wrapper[data-v-a86fc486]{cursor:pointer}.templates-wrapper .template-wrapper .template-container[data-v-a86fc486]{height:274px;padding:2px;transition:none}.templates-wrapper .template-wrapper .template-container.selected[data-v-a86fc486]{padding:1px}.templates-wrapper .template-wrapper .template-container .thumbnail[data-v-a86fc486]{object-fit:cover;transform:scale(1)}[data-v-d89d9362] .guido__verion-history-view-option-selection-desktop svg,[data-v-d89d9362] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-d89d9362] .in-segments-wrapper__button_selected,[data-v-d89d9362] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}.error-list[data-v-7a09985c]{gap:16px}[data-v-c2adc57d] .in-progress-wrapper__progress p span:last-child{display:none!important}.desktop-preview-container[data-v-2dd60b0c],[data-v-2dd60b0c] .desktop-preview-container .in-container{min-height:720px!important;height:100%}.cropped-text[data-v-f20b3a9b]{width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}[data-v-d3c52b44] .vueperslides__bullets,[data-v-a408dcea] .vueperslides__bullets{pointer-events:none!important}[data-v-a408dcea] .vueperslides__parallax-wrapper{height:110px!important}