@useinsider/guido 3.21.0-beta.78e343a → 3.21.0-beta.8a9421f

package/dist/extensions/Blocks/Recommendation/utils/captureStyleTemplates.js

@@ -1,10 +1,10 @@
 import { extractWrapperTags as A } from "../../../../utils/preserveTextStyles.js";
 import { RecommendationBlockId as c } from "../constants/blockIds.js";
-import { DESKTOP_CONTAINER_SELECTOR as g, ATTR_PRODUCT_NAME as k, ATTR_PRODUCT_PRICE as y, ATTR_PRODUCT_OLD_PRICE as p, ATTR_PRODUCT_OMNIBUS_PRICE as R, ATTR_PRODUCT_OMNIBUS_DISCOUNT as _, ATTR_PRODUCT_BUTTON as x, ATTR_PRODUCT_IMAGE as q, ATTR_PRODUCT_ATTR as v } from "../constants/selectors.js";
+import { DESKTOP_CONTAINER_SELECTOR as b, ATTR_PRODUCT_NAME as k, ATTR_PRODUCT_PRICE as y, ATTR_PRODUCT_OLD_PRICE as p, ATTR_PRODUCT_OMNIBUS_PRICE as R, ATTR_PRODUCT_OMNIBUS_DISCOUNT as _, ATTR_PRODUCT_BUTTON as x, ATTR_PRODUCT_IMAGE as q, ATTR_PRODUCT_ATTR as v } from "../constants/selectors.js";
 import { CSS_CLASS_TEXT_TRIM as B } from "../controls/shared/textTrimCssRules.js";
 import { toCustomCompositionKey as U } from "../templates/utils.js";
 import { resolveRowVisibilityKeys as N, isMergedInlinePriceRow as C } from "./compositionKeys.js";
-import { hasQuerySelectorAll as I, hasGetAttribute as l, hasGetStyle as h, hasGetComputedStyle as M } from "./tagName.js";
+import { hasQuerySelectorAll as I, hasGetAttribute as l, hasGetStyle as O, hasGetComputedStyle as M } from "./tagName.js";
 const s = [
   "font-size",
   "font-family",
@@ -37,10 +37,9 @@ const s = [
   "width",
   "height",
   "max-width",
-  "max-height",
   "border-radius",
   "margin"
-], b = /* @__PURE__ */ new Set(["transparent", "rgba(0, 0, 0, 0)"]), L = [
+], g = /* @__PURE__ */ new Set(["transparent", "rgba(0, 0, 0, 0)"]), L = [
   { attrKey: k, blockId: c.NAME, kind: "text" },
   { attrKey: y, blockId: c.PRICE, kind: "text" },
   { attrKey: p, blockId: c.OLD_PRICE, kind: "text" },
@@ -49,14 +48,14 @@ const s = [
   { attrKey: x, blockId: c.BUTTON, kind: "button" },
   { attrKey: q, blockId: c.IMAGE, kind: "image" }
 ];
-function O(t) {
+function h(t) {
   return t && "getInnerHTML" in t && typeof t.getInnerHTML == "function" ? t.getInnerHTML().trim() : "";
 }
 function K(t) {
   return t && "getInnerText" in t && typeof t.getInnerText == "function" ? t.getInnerText().trim() : "";
 }
 function a(t, e, r) {
-  !e || !h(e) || r.forEach((n) => {
+  !e || !O(e) || r.forEach((n) => {
     const o = e.getStyle(n);
     o && o !== "inherit" && o !== "initial" && (t[n] = o);
   });
@@ -65,10 +64,10 @@ function E(t) {
   return Object.entries(t).map(([e, r]) => `${e}: ${r};`).join(" ");
 }
 function P(t) {
-  if (!t || !h(t))
+  if (!t || !O(t))
     return;
   const e = t.getStyle("background-color") || t.getStyle("background");
-  return e && !b.has(e) ? e : void 0;
+  return e && !g.has(e) ? e : void 0;
 }
 function S(t, e) {
   const r = {};
@@ -77,11 +76,11 @@ function S(t, e) {
 function $(t) {
   const e = t.querySelector("p"), r = {};
   a(r, t, s), a(r, e, s), a(r, t.querySelector("strong"), s), a(r, t.querySelector("em"), s), a(r, t.querySelector("s"), s);
-  const n = E(r), { openTags: o, closeTags: i } = A(O(e));
+  const n = E(r), { openTags: o, closeTags: i } = A(h(e));
   return !n && !o ? null : { pStyle: n || void 0, openTags: o, closeTags: i };
 }
 function H(t) {
-  const e = t.querySelector(".es-button-border"), r = t.querySelector("a.es-button") ?? t.querySelector("a"), n = S(e, D), o = S(r, w), i = e && "getAttribute" in e ? e.getAttribute("class") ?? "" : "", u = /\bes-fw\b/.test(i), { openTags: T, closeTags: d } = A(O(r)), m = K(r);
+  const e = t.querySelector(".es-button-border"), r = t.querySelector("a.es-button") ?? t.querySelector("a"), n = S(e, D), o = S(r, w), i = e && "getAttribute" in e ? e.getAttribute("class") ?? "" : "", u = /\bes-fw\b/.test(i), { openTags: T, closeTags: d } = A(h(r)), m = K(r);
   return !n && !o && !u && !T && !m ? null : {
     buttonBorderStyle: n || void 0,
     buttonAnchorStyle: o || void 0,
@@ -101,7 +100,7 @@ function j(t, e) {
 function f(t, e) {
   if (!t || !("querySelector" in t))
     return;
-  const r = t.querySelector(g) ?? t;
+  const r = t.querySelector(b) ?? t;
   if (L.forEach(({ attrKey: i, blockId: u, kind: T }) => {
     const d = r.querySelector(`[esd-extension-block-id="${u}"]`);
     d && e(d, i, T);
@@ -127,20 +126,20 @@ function V(t) {
 function X(t) {
   if (!t || !("querySelector" in t))
     return;
-  const e = t.querySelector(g) ?? t, r = e.querySelector(".product-card-segment") ?? e.querySelector(".product-card-wrapper");
+  const e = t.querySelector(b) ?? t, r = e.querySelector(".product-card-segment") ?? e.querySelector(".product-card-wrapper");
   return P(r);
 }
 function z(t) {
   if (!t)
     return;
   const e = l(t) ? t.getAttribute("bgcolor") : null;
-  if (e && !b.has(e))
+  if (e && !g.has(e))
     return e;
   const r = P(t);
   if (r)
     return r;
   const n = M(t) ? t.getComputedStyle("background-color") : void 0;
-  return n && !b.has(n) ? n : void 0;
+  return n && !g.has(n) ? n : void 0;
 }
 function Q(t) {
   const e = {};
@@ -171,7 +170,7 @@ function J(t) {
 function Z(t) {
   if (!t || !("querySelector" in t))
     return !1;
-  const e = t.querySelector(g) ?? t;
+  const e = t.querySelector(b) ?? t;
   return C(e.querySelector(`[data-attribute-type="${y}"]`)) || C(e.querySelector(`[data-attribute-type="${p}"]`));
 }
 function tt(t) {
@@ -196,7 +195,7 @@ function rt(t) {
   const e = {};
   if (!t || !("querySelector" in t))
     return e;
-  const r = t.querySelector(g) ?? t;
+  const r = t.querySelector(b) ?? t;
   return I(r) && r.querySelectorAll(".recommendation-attribute-row").forEach((n) => {
     if (!l(n))
       return;

package/dist/extensions/Blocks/Recommendation/utils/strategyCommit.js

@@ -1,43 +1,64 @@
-import { useRecommendationExtensionStore as g } from "../store/recommendation.js";
-import { refreshBlockOutsidePanel as y } from "./blockRefresh.js";
-import { toBlockUrlConfig as a } from "./blockUrlConfig.js";
-import { commitBlockChangeOutsidePanel as l, readBlockNodeConfigs as S } from "./nodeConfigWriter.js";
-function d(e, t) {
-  const r = JSON.stringify(a(t));
-  return S(e).find((o) => JSON.stringify(a(o)) !== r) ?? t;
+import { useRecommendationExtensionStore as f } from "../store/recommendation.js";
+import { refreshBlockOutsidePanel as l } from "./blockRefresh.js";
+import { toBlockUrlConfig as c } from "./blockUrlConfig.js";
+import { readBlockNodeConfigs as m, commitBlockChangeOutsidePanel as d } from "./nodeConfigWriter.js";
+function u(n, t) {
+  const r = JSON.stringify(c(t));
+  return m(n).find((s) => JSON.stringify(c(s)) !== r) ?? t;
 }
-async function p(e, t, r) {
-  const o = g(), s = [e, t];
-  (/* @__PURE__ */ new Map([[e, d(e, r)], [t, r]])).forEach((n, i) => {
-    var m;
-    (!!n.strategyId || i === t) && ((m = o.blockStates[i]) == null ? void 0 : m.recommendationConfigs.strategyId) !== n.strategyId && o.seedBlockUrlConfig(i, a(n));
-  }), o.resetArrivedBlock(t), await Promise.all(s.map(async (n) => {
-    if (!await o.refreshStrategyBlock(n))
+async function y(n, t, r = () => !0) {
+  const s = f();
+  await Promise.all(n.map(async (e) => {
+    if (!await s.refreshStrategyBlock(e))
       return;
-    const { recommendationConfigs: i, recommendationProducts: f } = o.blockStates[n];
-    l(
-      n,
-      { size: i.size },
-      f,
-      "Refresh duplicated recommendation strategy"
+    const { recommendationConfigs: a, recommendationProducts: o } = s.blockStates[e];
+    r(e, a.size) && d(
+      e,
+      { size: a.size },
+      o,
+      t
     );
   }));
 }
-async function k(e, t) {
-  if (!g().blockStates[e])
+async function w(n, t, r) {
+  const s = f(), e = [n, t];
+  (/* @__PURE__ */ new Map([[n, u(n, r)], [t, r]])).forEach((o, i) => {
+    var g;
+    (!!o.strategyId || i === t) && ((g = s.blockStates[i]) == null ? void 0 : g.recommendationConfigs.strategyId) !== o.strategyId && s.seedBlockUrlConfig(i, c(o));
+  }), s.resetArrivedBlock(t), await y(e, "Refresh duplicated recommendation strategy");
+}
+async function k(n) {
+  const t = f(), r = n.filter(({ config: e }) => !!e.strategyId);
+  if (!r.length)
+    return;
+  r.forEach(({ id: e, config: a }) => t.seedBlockUrlConfig(e, c(a))), t.invalidateStrategies();
+  const s = new Map(r.map(({ id: e, config: a }) => [e, a]));
+  await y(
+    r.map(({ id: e }) => e),
+    "Refresh recommendation strategy",
+    (e, a) => {
+      const o = s.get(e);
+      return a !== (o == null ? void 0 : o.size) && m(e).some((i) => i.strategyId === (o == null ? void 0 : o.strategyId));
+    }
+  );
+}
+async function O(n, t) {
+  if (!f().blockStates[n])
     return !1;
-  const r = await y(e, {
-    pickUpdates: ({ strategyId: o, strategy: s, size: c, nodeConfigVersion: n }) => ({
-      strategyId: o,
-      strategy: s,
-      size: c,
-      configVersion: n
+  const r = await l(n, {
+    pickUpdates: ({ strategyId: s, strategy: e, size: a, nodeConfigVersion: o }) => ({
+      strategyId: s,
+      strategy: e,
+      size: a,
+      configVersion: o
     }),
     description: t
   });
-  return r || console.error("[recommendation] strategy change did not reach a node", { blockId: e }), r;
+  return r || console.error("[recommendation] strategy change did not reach a node", { blockId: n }), r;
 }
 export {
-  k as commitStrategyChange,
-  p as refreshDuplicatedStrategyBlocks
+  O as commitStrategyChange,
+  k as refreshArrivedStrategyBlocks,
+  w as refreshDuplicatedStrategyBlocks,
+  u as resolveSourceConfig
 };

package/dist/guido.css

@@ -1 +1 @@
-@charset "UTF-8";.auth-error-modal[data-v-b4d7ae51]{position:relative;z-index:145}.gap-16[data-v-5553d071],.gap-16[data-v-0e1b0c54]{gap:16px}[data-v-b8f24f34] .in-button-v2__wrapper{line-height:0}[data-v-22226124] .in-segments-wrapper__button_selected,[data-v-22226124] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb;color:#0010ac;border-color:#0010ac}[data-v-2cb418af] .in-progress-wrapper__progress p span:last-child{display:none!important}[data-v-2cb418af] .in-progress-description-status{display:none!important}.view-options-wrapper[data-v-87033101]{position:relative;display:inline-block}.new-tag[data-v-87033101]{position:absolute;top:-8px;right:-16px;z-index:10}[data-v-87033101] .guido__view-option-selection-desktop svg,[data-v-87033101] .guido__view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-87033101] .in-segments-wrapper__button_selected,[data-v-87033101] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-87033101] .in-tooltip-wrapper-v2__icon{cursor:pointer}.editor-toolbar[data-v-173c3a40]{gap:4px}.version-history-item[data-v-ee4b9c3f]{flex-basis:200px}.version-history[data-v-fad98586]{gap:8px}.version-history__toolbar[data-v-fad98586]{gap:4px}.view-options-wrapper[data-v-6ebabfe4]{position:relative;display:inline-block}.new-tag[data-v-6ebabfe4]{position:absolute;top:-8px;right:-16px;z-index:10}[data-v-6ebabfe4] .guido__verion-history-view-option-selection-desktop svg,[data-v-6ebabfe4] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-6ebabfe4] .in-segments-wrapper__button_selected,[data-v-6ebabfe4] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-6ebabfe4] .in-tooltip-wrapper-v2__icon{cursor:pointer}.auto-save-toggle[data-v-2c964af4]{position:relative}.auto-save-toggle__info-box[data-v-2c964af4]{position:absolute;top:100%;left:0;z-index:10;width:280px}.editor-actions[data-v-baf7a5dd]{gap:4px}.header-wrapper[data-v-d11dd577]{min-width:1000px}.guido-loading__wrapper[data-v-07c4b2d8]{height:100%;top:75px!important;bottom:0!important}.validation-error-list[data-v-e48cebe9]{gap:16px}.validation-error-row[data-v-e48cebe9]{gap:8px;padding:24px;border:1px solid #E1E1E1;border-radius:8px}.validation-error-row__icon[data-v-e48cebe9]{flex-shrink:0;font-size:24px;line-height:0}.validation-error-row__text[data-v-e48cebe9]{font-size:13px;line-height:16px;color:#292929;word-break:break-word}.guido-editor__wrapper[data-v-c5146fc5]{--ribbon-offset: 0px;position:relative;width:100%;height:calc(100vh - 128px - var(--ribbon-offset))}.guido-editor__container[data-v-c5146fc5]{width:100%;height:calc(100vh - 128px - var(--ribbon-offset))}.guido-editor__no-header[data-v-c5146fc5]{height:calc(100vh - 75px - var(--ribbon-offset))}[data-v-293f1c47] .in-breadcrumb-wrapper__links{cursor:pointer}.templates-wrapper[data-v-91a26acd]{gap:16px;grid-template-columns:repeat(3,1fr)}.templates-wrapper .template-wrapper[data-v-91a26acd]{cursor:pointer}.templates-wrapper .template-wrapper .template-container[data-v-91a26acd]{height:274px;padding:2px;transition:none}.templates-wrapper .template-wrapper .template-container.selected[data-v-91a26acd]{padding:1px}.templates-wrapper .template-wrapper .template-container .thumbnail[data-v-91a26acd]{object-fit:cover;transform:scale(1)}[data-v-b9a93c6e] .guido__verion-history-view-option-selection-desktop svg,[data-v-b9a93c6e] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-b9a93c6e] .in-segments-wrapper__button_selected,[data-v-b9a93c6e] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}.error-list[data-v-c3fd5d4b]{gap:16px}.desktop-browser-header[data-v-d86c5af5]{height:79px;min-height:79px}.desktop-browser-header__left[data-v-d86c5af5]{-webkit-user-drag:none;height:79px;width:378px}.desktop-browser-header__center[data-v-d86c5af5]{height:79px;background-repeat:repeat-x;background-size:auto 100%;background-position:left top}.desktop-browser-header__right[data-v-d86c5af5]{-webkit-user-drag:none;height:79px;width:112px}.desktop-preview[data-v-cf946232]{min-width:602px;height:70vh;min-height:583px;border-radius:10px}.desktop-preview iframe[data-v-cf946232]{min-height:504px}.iframe-wrapper[data-v-f255b2bb]{width:258px}.iframe-scaled[data-v-f255b2bb]{width:320px;height:124.0310077519%;transform:scale(.80625);transform-origin:top left}.cropped-text[data-v-eb3d05d7]{width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-preview-wrapper__phone[data-v-3f472f96]{width:282px}.mobile-preview-wrapper__phone img[data-v-3f472f96]{object-fit:cover;border-radius:44px}.mobile-preview-wrapper__content[data-v-3f472f96]{width:258px;height:450px;left:12px}[data-v-6bcaca8a] .vueperslides__parallax-wrapper{padding-bottom:110px!important}[data-v-f16f20f8] .vueperslides__bullets{pointer-events:none!important}[data-v-f16f20f8] .vueperslides__parallax-wrapper{padding-bottom:110px!important}[data-v-bb3cca55] .vueperslides__bullets{pointer-events:none!important}[data-v-bb3cca55] .vueperslides__parallax-wrapper{height:110px!important;padding-bottom:110px!important}[data-v-19d8cb42] .vueperslides__bullets,[data-v-ec2027ff] .vueperslides__bullets,[data-v-b09e80c4] .vueperslides__bullets{pointer-events:none!important}[data-v-b09e80c4] .vueperslides__parallax-wrapper{height:110px!important;padding-bottom:110px!important}[data-v-9bdef600] .vueperslides__parallax-wrapper{padding-bottom:110px!important}.assign-strategy-drawer-content .assign-strategy-select[data-v-6ce48dfd]{width:100%;max-width:none}.assign-strategy-drawer-content .assign-strategy-select[data-v-6ce48dfd] .in-skeleton{width:100%!important}.assign-strategy-drawer-content .assign-strategy-select[data-v-6ce48dfd] .in-dropdown-box__container{width:413px}.assign-strategy-drawer .spaced-dot-sep{background-image:linear-gradient(90deg,#91949f 20%,#fff0 0);background-position:center bottom;background-repeat:repeat-x;background-size:5px 1px}.assign-strategy-drawer .spaced-dot-sep--top{background-position:center top}.assign-strategy-drawer .spaced-dot-sep--fc-n:first-child{background:none}.legacy-strategy-updated-modal[data-v-da2225a1]{position:relative;z-index:145}
+@charset "UTF-8";.auth-error-modal[data-v-b4d7ae51]{position:relative;z-index:145}.gap-16[data-v-5553d071],.gap-16[data-v-0e1b0c54]{gap:16px}[data-v-b8f24f34] .in-button-v2__wrapper{line-height:0}[data-v-22226124] .in-segments-wrapper__button_selected,[data-v-22226124] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb;color:#0010ac;border-color:#0010ac}[data-v-2cb418af] .in-progress-wrapper__progress p span:last-child{display:none!important}[data-v-2cb418af] .in-progress-description-status{display:none!important}.view-options-wrapper[data-v-87033101]{position:relative;display:inline-block}.new-tag[data-v-87033101]{position:absolute;top:-8px;right:-16px;z-index:10}[data-v-87033101] .guido__view-option-selection-desktop svg,[data-v-87033101] .guido__view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-87033101] .in-segments-wrapper__button_selected,[data-v-87033101] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-87033101] .in-tooltip-wrapper-v2__icon{cursor:pointer}.editor-toolbar[data-v-173c3a40]{gap:4px}.version-history-item[data-v-ee4b9c3f]{flex-basis:200px}.version-history[data-v-fad98586]{gap:8px}.version-history__toolbar[data-v-fad98586]{gap:4px}.view-options-wrapper[data-v-6ebabfe4]{position:relative;display:inline-block}.new-tag[data-v-6ebabfe4]{position:absolute;top:-8px;right:-16px;z-index:10}[data-v-6ebabfe4] .guido__verion-history-view-option-selection-desktop svg,[data-v-6ebabfe4] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-6ebabfe4] .in-segments-wrapper__button_selected,[data-v-6ebabfe4] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-6ebabfe4] .in-tooltip-wrapper-v2__icon{cursor:pointer}.auto-save-toggle[data-v-2c964af4]{position:relative}.auto-save-toggle__info-box[data-v-2c964af4]{position:absolute;top:100%;left:0;z-index:10;width:280px}.editor-actions[data-v-baf7a5dd]{gap:4px}.header-wrapper[data-v-d11dd577]{min-width:1000px}.guido-loading__wrapper[data-v-07c4b2d8]{height:100%;top:75px!important;bottom:0!important}.validation-error-list[data-v-e48cebe9]{gap:16px}.validation-error-row[data-v-e48cebe9]{gap:8px;padding:24px;border:1px solid #E1E1E1;border-radius:8px}.validation-error-row__icon[data-v-e48cebe9]{flex-shrink:0;font-size:24px;line-height:0}.validation-error-row__text[data-v-e48cebe9]{font-size:13px;line-height:16px;color:#292929;word-break:break-word}.guido-editor__wrapper[data-v-1a3ddd48]{--ribbon-offset: 0px;position:relative;width:100%;height:calc(100vh - 128px - var(--ribbon-offset))}.guido-editor__container[data-v-1a3ddd48]{width:100%;height:calc(100vh - 128px - var(--ribbon-offset))}.guido-editor__no-header[data-v-1a3ddd48]{height:calc(100vh - 75px - var(--ribbon-offset))}[data-v-293f1c47] .in-breadcrumb-wrapper__links{cursor:pointer}.templates-wrapper[data-v-91a26acd]{gap:16px;grid-template-columns:repeat(3,1fr)}.templates-wrapper .template-wrapper[data-v-91a26acd]{cursor:pointer}.templates-wrapper .template-wrapper .template-container[data-v-91a26acd]{height:274px;padding:2px;transition:none}.templates-wrapper .template-wrapper .template-container.selected[data-v-91a26acd]{padding:1px}.templates-wrapper .template-wrapper .template-container .thumbnail[data-v-91a26acd]{object-fit:cover;transform:scale(1)}[data-v-b9a93c6e] .guido__verion-history-view-option-selection-desktop svg,[data-v-b9a93c6e] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-b9a93c6e] .in-segments-wrapper__button_selected,[data-v-b9a93c6e] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}.error-list[data-v-c3fd5d4b]{gap:16px}.desktop-browser-header[data-v-d86c5af5]{height:79px;min-height:79px}.desktop-browser-header__left[data-v-d86c5af5]{-webkit-user-drag:none;height:79px;width:378px}.desktop-browser-header__center[data-v-d86c5af5]{height:79px;background-repeat:repeat-x;background-size:auto 100%;background-position:left top}.desktop-browser-header__right[data-v-d86c5af5]{-webkit-user-drag:none;height:79px;width:112px}.desktop-preview[data-v-cf946232]{min-width:602px;height:70vh;min-height:583px;border-radius:10px}.desktop-preview iframe[data-v-cf946232]{min-height:504px}.iframe-wrapper[data-v-f255b2bb]{width:258px}.iframe-scaled[data-v-f255b2bb]{width:320px;height:124.0310077519%;transform:scale(.80625);transform-origin:top left}.cropped-text[data-v-eb3d05d7]{width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-preview-wrapper__phone[data-v-3f472f96]{width:282px}.mobile-preview-wrapper__phone img[data-v-3f472f96]{object-fit:cover;border-radius:44px}.mobile-preview-wrapper__content[data-v-3f472f96]{width:258px;height:450px;left:12px}[data-v-6bcaca8a] .vueperslides__parallax-wrapper{padding-bottom:110px!important}[data-v-f16f20f8] .vueperslides__bullets{pointer-events:none!important}[data-v-f16f20f8] .vueperslides__parallax-wrapper{padding-bottom:110px!important}[data-v-bb3cca55] .vueperslides__bullets{pointer-events:none!important}[data-v-bb3cca55] .vueperslides__parallax-wrapper{height:110px!important;padding-bottom:110px!important}[data-v-19d8cb42] .vueperslides__bullets,[data-v-ec2027ff] .vueperslides__bullets,[data-v-b09e80c4] .vueperslides__bullets{pointer-events:none!important}[data-v-b09e80c4] .vueperslides__parallax-wrapper{height:110px!important;padding-bottom:110px!important}[data-v-9bdef600] .vueperslides__parallax-wrapper{padding-bottom:110px!important}.assign-strategy-drawer-content .assign-strategy-select[data-v-6ce48dfd]{width:100%;max-width:none}.assign-strategy-drawer-content .assign-strategy-select[data-v-6ce48dfd] .in-skeleton{width:100%!important}.assign-strategy-drawer-content .assign-strategy-select[data-v-6ce48dfd] .in-dropdown-box__container{width:413px}.assign-strategy-drawer .spaced-dot-sep{background-image:linear-gradient(90deg,#91949f 20%,#fff0 0);background-position:center bottom;background-repeat:repeat-x;background-size:5px 1px}.assign-strategy-drawer .spaced-dot-sep--top{background-position:center top}.assign-strategy-drawer .spaced-dot-sep--fc-n:first-child{background:none}.legacy-strategy-updated-modal[data-v-da2225a1]{position:relative;z-index:145}

package/dist/library.js

@@ -1,20 +1,22 @@
 import { default as a } from "./components/Guido.vue.js";
-import { MessageType as t, ProductType as d } from "./@types/config/schemas.js";
+import { MessageType as t, ProductType as f } from "./@types/config/schemas.js";
 import "./@types/config/defaults.js";
-import { getValidationErrors as s, isValidConfig as p, parseConfig as g, parseConfigSafe as m, validateConfig as n } from "./@types/config/validator.js";
-import { assignTrackingIds as u, readTrackFloor as x, readTrackSeq as T } from "./utils/linkTrackingIds.js";
+import { getValidationErrors as p, isValidConfig as s, parseConfig as m, parseConfigSafe as g, validateConfig as n } from "./@types/config/validator.js";
+import { assignTrackingIds as l, readTrackFloor as x, readTrackSeq as c } from "./utils/linkTrackingIds.js";
 import { useGuidoEmailEditorStore as C } from "./stores/guido-email-editor.js";
+import { prefetchGuidoRuntime as E } from "./utils/runtimePrefetch.js";
 export {
   a as Guido,
   t as MessageType,
-  d as ProductType,
-  u as assignTrackingIds,
-  s as getValidationErrors,
-  p as isValidConfig,
-  g as parseConfig,
-  m as parseConfigSafe,
+  f as ProductType,
+  l as assignTrackingIds,
+  p as getValidationErrors,
+  s as isValidConfig,
+  m as parseConfig,
+  g as parseConfigSafe,
+  E as prefetchGuidoRuntime,
   x as readTrackFloor,
-  T as readTrackSeq,
+  c as readTrackSeq,
   C as useGuidoEmailEditorStore,
   n as validateConfig
 };

package/dist/package.json.js

@@ -1,7 +1,9 @@
-const o = { stripo: { version: "2.79.0" } }, s = {
-  guido: o
+const o = "3.21.0-beta.8a9421f", s = { stripo: { version: "2.79.0" } }, t = {
+  version: o,
+  guido: s
 };
 export {
-  s as default,
-  o as guido
+  t as default,
+  s as guido,
+  o as version
 };

package/dist/public/prefetchRuntime.js

@@ -0,0 +1,4 @@
+import { prefetchGuidoRuntime as r } from "../utils/runtimePrefetch.js";
+export {
+  r as prefetchGuidoRuntime
+};

package/dist/src/composables/useEditorOpenMetrics.d.ts

@@ -0,0 +1,27 @@
+export type TimedOpenPhase = 'migration' | 'default_template' | 'timer_clone';
+export type OpenPhase = 'setup' | 'host_ready' | `${TimedOpenPhase}_start` | `${TimedOpenPhase}_end` | 'plugin_start' | 'script_ready' | 'fonts_sync_ready' | 'blocks_config_ready' | 'init_editor' | 'token_start' | 'token_end' | 'ready';
+export type OpenOutcome = 'ready' | 'error' | 'abandoned';
+export interface OpenContext {
+    partnerName: string;
+    productType: number;
+    templateId: string;
+    variationId: string;
+}
+export interface OpenTemplate {
+    html: string;
+    css: string;
+    forceRecreate: boolean;
+}
+export interface EditorOpenMetrics {
+    mark: (phase: OpenPhase) => void;
+    timed: <T>(phase: TimedOpenPhase, task: () => Promise<T>) => Promise<T>;
+    setContext: (context: OpenContext) => void;
+    setTemplate: (template: OpenTemplate) => void;
+    setScriptPreloaded: (preloaded: boolean) => void;
+    markReady: () => void;
+    markFailed: () => void;
+    dispose: () => void;
+}
+export declare const startEditorOpenMetrics: () => EditorOpenMetrics;
+/** Binds to the session open at call time, so a remounted editor never writes into its replacement's session. */
+export declare const useEditorOpenMetrics: () => EditorOpenMetrics;

package/dist/src/extensions/Blocks/Recommendation/block.d.ts

@@ -19,6 +19,9 @@ export declare class RecommendationBlock extends Block {
     private _resetSourceIds;
     /** Ids handed to duplicates the document root does not show yet: a copied module renames all its blocks at once. */
     private _unsettledDuplicateIds;
+    private _arrivedBlocks;
+    /** Strategy each in-flight arrival or duplicate refresh is fetching, by block id, so a second one does not race it. */
+    private _refreshClaims;
     constructor();
     getId(): string;
     getIcon(): string;
@@ -44,6 +47,8 @@ export declare class RecommendationBlock extends Block {
      * @param node - The newly created block node
      */
     onCreated(node: ImmutableHtmlNode): void;
+    /** Refreshes every block of an opened template: Stripo restores a stored document without `onCreated`. */
+    onDocumentInit(): void;
     /**
      * Called when the document changes or template is loaded
      *
@@ -59,7 +64,6 @@ export declare class RecommendationBlock extends Block {
      * @param node - The block node being deleted
      */
     onDelete(node: ImmutableHtmlNode): void;
-    private _ensureMobileFitRule;
     /**
      * Warns (dark advisory toaster) when the design holds more than one live
      * recommendation block. Triggered from the user-add paths only (fresh drop
@@ -86,15 +90,26 @@ export declare class RecommendationBlock extends Block {
      * the renamed one depending on where the module was dropped (SD-149916).
      */
     private _scheduleArrivalReset;
+    /**
+     * Re-reads the strategy of a block that arrived with saved cards, without waiting for a click.
+     * Blocks of one opened template or dropped module arrive in one tick and refresh together.
+     */
+    private _queueArrivalRefresh;
+    private _refreshArrivedBlocks;
+    /**
+     * A new document reports each block to onCreated and onDocumentInit, not always in one batch, so a
+     * claimed block refreshes again only once the document shows it under another strategy (a restored version).
+     */
+    private _canClaimRefresh;
+    private _releaseRefreshClaim;
     /**
      * Heals a duplicate that slipped past the create-time `_detectDuplicate`
      * scan (or that was persisted by an older template before SD-142352).
      * When two blocks share a `recommendation-id`, the first occurrence in DOM
      * order is treated as the source and any later sibling is reassigned a
-     * fresh id. The store entry and active-block focus are intentionally not
-     * touched here: each block's persisted `esd-ext-config` carries its own
-     * truth and the regular save-time hydration (`hydrateRecommendationStore`)
-     * will seed the new id from that. Skipping `setCurrentBlock` avoids
+     * fresh id and queued for the arrival refresh, which seeds the new id's
+     * store entry from its persisted `esd-ext-config`. The source's store
+     * entry is not cloned and focus is not moved. Skipping `setCurrentBlock` avoids
      * yanking the user's current selection mid-edit when the heal fires from
      * `onDocumentChanged`.
      */
@@ -110,9 +125,9 @@ export declare class RecommendationBlock extends Block {
      *
      * Used by `_handleDuplicate` at create-time (which additionally clones the
      * store entry and focuses the new block) and by `_healLingeringDuplicate`
-     * at document-change time (which intentionally skips store/focus side
-     * effects so older bug-affected templates can self-repair without
-     * disturbing the user's current selection).
+     * at document-change time (which skips the clone and focus change so older
+     * bug-affected templates can self-repair without disturbing the user's
+     * current selection, and queues the arrival refresh for the new id).
      */
     private _reassignDuplicateId;
     /**

package/dist/src/extensions/Blocks/Recommendation/controls/image/index.d.ts

@@ -3,48 +3,35 @@
  *
  * Controls for styling the product image element in recommendation cards.
  */
-import type { CssNodeModifier, HtmlNodeModifier, ImmutableCssNode, ImmutableHtmlNode, TemplateModifier } from '@stripoinc/ui-editor-extensions';
-import { ModificationDescription } from '@stripoinc/ui-editor-extensions';
-interface FitRuleApi {
-    getDocumentRootCssNode: () => ImmutableCssNode | null;
-    getDocumentModifier: () => TemplateModifier<HtmlNodeModifier, CssNodeModifier>;
-}
-export declare function ensureMobileFitRule(api: FitRuleApi, block: ImmutableHtmlNode): void;
-declare const SizeControl_base: {
-    new (): {
-        getId(): string;
-        getTargetNodes(root: ImmutableHtmlNode): ImmutableHtmlNode[];
-        getParentControlId(): string;
-        api: import("@stripoinc/ui-editor-extensions").ControlApi;
-        getLabels(): import("@stripoinc/ui-editor-extensions").ControlLabels | undefined;
-        getModificationDescription(): ModificationDescription | undefined;
-        getAdditionalModifications(_root: ImmutableHtmlNode): TemplateModifier<HtmlNodeModifier, CssNodeModifier> | undefined;
-        isVisible(_node: ImmutableHtmlNode): boolean;
-        getElementLockCategory(): import("@stripoinc/ui-editor-extensions").ElementLockCategory | undefined;
-    };
-};
-declare class SizeControl extends SizeControl_base {
-    getAdditionalModifications(root: ImmutableHtmlNode): TemplateModifier<HtmlNodeModifier, CssNodeModifier> | undefined;
-    private getFitStyles;
-}
 /**
  * Grouped Image Controls
  * Use this object for cleaner imports in extension.ts
  */
 export declare const ImageControls: {
-    readonly size: typeof SizeControl;
+    readonly size: {
+        new (): {
+            getId(): string;
+            getTargetNodes(root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode[];
+            getParentControlId(): string;
+            api: import("@stripoinc/ui-editor-extensions").ControlApi;
+            getLabels(): import("@stripoinc/ui-editor-extensions").ControlLabels | undefined;
+            getModificationDescription(): import("@stripoinc/ui-editor-extensions").ModificationDescription | undefined;
+            getAdditionalModifications(_root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").TemplateModifier<import("@stripoinc/ui-editor-extensions").HtmlNodeModifier, import("@stripoinc/ui-editor-extensions").CssNodeModifier> | undefined;
+            isVisible(_node: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): boolean;
+            getElementLockCategory(): import("@stripoinc/ui-editor-extensions").ElementLockCategory | undefined;
+        };
+    };
     readonly margins: {
         new (): {
             getId(): string;
-            getTargetNodes(root: ImmutableHtmlNode): ImmutableHtmlNode[];
+            getTargetNodes(root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode[];
             getParentControlId(): string;
             api: import("@stripoinc/ui-editor-extensions").ControlApi;
             getLabels(): import("@stripoinc/ui-editor-extensions").ControlLabels | undefined;
-            getModificationDescription(): ModificationDescription | undefined;
-            getAdditionalModifications(_root: ImmutableHtmlNode): TemplateModifier<HtmlNodeModifier, CssNodeModifier> | undefined;
-            isVisible(_node: ImmutableHtmlNode): boolean;
+            getModificationDescription(): import("@stripoinc/ui-editor-extensions").ModificationDescription | undefined;
+            getAdditionalModifications(_root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").TemplateModifier<import("@stripoinc/ui-editor-extensions").HtmlNodeModifier, import("@stripoinc/ui-editor-extensions").CssNodeModifier> | undefined;
+            isVisible(_node: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): boolean;
             getElementLockCategory(): import("@stripoinc/ui-editor-extensions").ElementLockCategory | undefined;
         };
     };
 };
-export {};

package/dist/src/extensions/Blocks/Recommendation/utils/strategyCommit.d.ts

@@ -1,10 +1,21 @@
 import type { RecommendationNodeConfig } from '../types/nodeConfig';
+/** A saved module keeps the id it was saved with, so it can arrive sharing the id of an unrelated block. */
+export declare function resolveSourceConfig(sourceId: number, arrived: RecommendationNodeConfig): RecommendationNodeConfig;
 /**
  * Re-reads the strategy of a duplicated block and its source and redraws both: the clone copies the
  * cards the source last drew, so a strategy edited since then only reached a block once selected (SD-153266).
  * @param config - the arriving block's persisted config; seeds either block its store entry does not match
  */
 export declare function refreshDuplicatedStrategyBlocks(sourceId: number, duplicateId: number, config: RecommendationNodeConfig): Promise<void>;
+/**
+ * Re-reads the strategy of blocks that arrived from a saved template or module, so the panel and
+ * preview show a strategy edited since the design was saved without selecting the block.
+ * @param blocks - each block's id with its persisted config, the truth its store entry is seeded from
+ */
+export declare function refreshArrivedStrategyBlocks(blocks: {
+    id: number;
+    config: RecommendationNodeConfig;
+}[]): Promise<void>;
 /**
  * Writes a strategy change and its products straight to the document, without the settings panel.
  *

package/dist/src/library.d.ts

@@ -4,5 +4,6 @@ export { validateConfig, parseConfig, parseConfigSafe, isValidConfig, getValidat
 export { assignTrackingIds, readTrackFloor, readTrackSeq } from './public/trackingIds';
 export { useGuidoEmailEditorStore } from './public/editorState';
 export type { GuidoEmailEditorState } from './public/editorState';
+export { prefetchGuidoRuntime } from './public/prefetchRuntime';
 export type { StripoEventType } from './@types/events';
 export type { PositionData, DynamicContentEvent, MergeTagClickEvent, MergeTag, BaseDynamicContent, DynamicContentNode, DynamicContentList, TooltipOptions, TextValueObject, L10n, } from './@types/generic';

package/dist/src/public/prefetchRuntime.d.ts

@@ -0,0 +1 @@
+export { prefetchGuidoRuntime } from '../utils/runtimePrefetch';

package/dist/src/utils/runtimePrefetch.d.ts

@@ -0,0 +1,4 @@
+export type RuntimePrefetchState = 'none' | 'pending' | 'done';
+export declare const RUNTIME_PREFETCH_ATTRIBUTE = "data-guido-prefetch";
+export declare const prefetchGuidoRuntime: () => void;
+export declare const readRuntimePrefetchState: () => RuntimePrefetchState;

package/dist/src/utils/stripoRuntime.d.ts

@@ -0,0 +1,2 @@
+/** Null when package.json does not pin `guido.stripo.version`. */
+export declare const getStripoRuntimeBaseUrl: () => string | null;

package/dist/static/stripo-runtime-manifest.json.js

@@ -0,0 +1,9 @@
+const s = "2.79.0", n = ["UIEditor.js", "zone.js", "styles-BWH3PMR4.css", "polyfills-FF3RLU5F.js", "main-MFU2R4FE.js", "chunk-2PIEA5YN.js", "chunk-5FVAINMG.js", "chunk-67OKDPNA.js", "chunk-BEE4NTMB.js", "chunk-FXMA33WF.js", "chunk-HEM7M3GC.js", "chunk-IP346EOD.js", "chunk-J3Q2HMUE.js", "chunk-JER72PP5.js", "chunk-LXRTAID3.js", "chunk-MV5VZJ34.js", "chunk-RTXKBDZV.js", "chunk-UQMM7Q74.js", "chunk-WCDYHSTN.js", "assets/css/uiEditor.css", "assets/i18n/en.json", "assets/icons/ui-editor-icons.sprite.svg", "assets/icons/ui-editor-icons.map.json", "assets/imageeditor/scripts.min.js", "assets/imageeditor/assets/icons/merged.svg"], c = {
+  version: s,
+  files: n
+};
+export {
+  c as default,
+  n as files,
+  s as version
+};

package/dist/utils/runtimePrefetch.js

@@ -0,0 +1,26 @@
+import s from "../static/stripo-runtime-manifest.json.js";
+import { getStripoRuntimeBaseUrl as c } from "./stripoRuntime.js";
+const r = "data-guido-prefetch", d = "pending", o = "settled", i = `link[${r}]`, u = ["slow-2g", "2g"], l = /\.(?:js|json)$/, a = () => document.getElementById("UiEditorScript") !== null || window.UIEditor !== void 0, E = () => {
+  const { connection: e } = navigator;
+  return (e == null ? void 0 : e.saveData) === !0 || u.includes((e == null ? void 0 : e.effectiveType) ?? "");
+}, m = (e) => {
+  const t = document.createElement("link"), n = () => t.setAttribute(r, o);
+  t.rel = "prefetch", t.href = e, l.test(e) && t.setAttribute("crossorigin", "anonymous"), t.setAttribute(r, d), t.addEventListener("load", n, { once: !0 }), t.addEventListener("error", n, { once: !0 }), document.head.appendChild(t);
+}, T = () => {
+  try {
+    const e = c(), t = document.querySelector(i) !== null;
+    if (!e || t || a() || E())
+      return;
+    s.files.forEach((n) => m(`${e}${n}`));
+  } catch (e) {
+    console.debug("guido: runtime prefetch skipped", e);
+  }
+}, g = () => {
+  const e = Array.from(document.querySelectorAll(i));
+  return e.length ? e.every((t) => t.getAttribute(r) === o) ? "done" : "pending" : "none";
+};
+export {
+  r as RUNTIME_PREFETCH_ATTRIBUTE,
+  T as prefetchGuidoRuntime,
+  g as readRuntimePrefetchState
+};

package/dist/utils/stripoRuntime.js

@@ -0,0 +1,9 @@
+import r from "../package.json.js";
+const e = "https://email-static.useinsider.com/guido/", n = () => {
+  var s;
+  const t = r.guido, o = (s = t == null ? void 0 : t.stripo) == null ? void 0 : s.version;
+  return o ? `${e}${o}/` : null;
+};
+export {
+  n as getStripoRuntimeBaseUrl
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@useinsider/guido",
-  "version": "3.21.0-beta.78e343a",
+  "version": "3.21.0-beta.8a9421f",
   "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",
@@ -22,6 +22,10 @@
       "types": "./dist/src/public/editorState.d.ts",
       "import": "./dist/public/editorState.js"
     },
+    "./prefetch": {
+      "types": "./dist/src/public/prefetchRuntime.d.ts",
+      "import": "./dist/public/prefetchRuntime.js"
+    },
     "./style": "./dist/guido.css"
   },
   "scripts": {
@@ -45,6 +49,7 @@
     "coverage:e2e:report": "nyc report --reporter=lcov --reporter=text-summary --report-dir=coverage/e2e",
     "test:mutation": "stryker run",
     "test:mutation:since": "CHANGED=$(git diff --name-only --diff-filter=AMR origin/develop...HEAD -- 'src/**/*.ts' ':(glob)src/components/organisms/onboarding/**/*.vue' ':(glob)src/components/organisms/header/**/*.vue' ':(glob)src/components/organisms/unsubscribe/**/*.vue' ':(glob)src/components/organisms/save-as-template/**/*.vue' ':(glob)src/components/organisms/email-preview/**/*.vue' ':(glob)src/components/wrappers/**/*.vue' 'src/components/Guido.vue' ':(exclude)src/**/*.test.ts' ':(exclude)src/**/index.ts' ':(exclude)src/@types/**' ':(exclude)src/enums/**' ':(exclude)src/mock/**' ':(exclude)src/**/_Boilerplate/**' | paste -sd, -); if [ -n \"$CHANGED\" ]; then stryker run --incremental --mutate \"$CHANGED\"; else echo \"No changed mutatable src files vs origin/develop\"; fi",
+    "stripo:manifest": "node scripts/stripo-runtime-manifest.mjs",
     "prepare": "husky",
     "preinstall": "rm -rf ./node_modules/.vite"
   },