@useinsider/guido 3.6.0-beta.6fd3d23 → 3.6.0-beta.70bbf9f

package/dist/extensions/Blocks/Recommendation/extension.js

@@ -1,13 +1,14 @@
 import { ExtensionBuilder as r } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
 import { RecommendationBlock as m } from "./block.js";
 import { RecommendationBlockControl as n } from "./controls/main/index.js";
+import "./constants/selectors.js";
 import "./store/recommendation.js";
 import { NameControls as i } from "./controls/name/index.js";
 import { PriceControls as e } from "./controls/price/index.js";
 import { OldPriceControls as s } from "./controls/oldPrice/index.js";
 import { OmnibusPriceControls as l } from "./controls/omnibusPrice/index.js";
-import { OmnibusDiscountControls as a } from "./controls/omnibusDiscount/index.js";
-import { ButtonControls as p } from "./controls/button/index.js";
+import { OmnibusDiscountControls as p } from "./controls/omnibusDiscount/index.js";
+import { ButtonControls as a } from "./controls/button/index.js";
 import { ImageControls as c } from "./controls/image/index.js";
 import { CustomAttributeControls as C } from "./controls/customAttribute/index.js";
 import { SpacingControl as f } from "./controls/spacing/index.js";
@@ -22,8 +23,8 @@ const b = [
   e,
   s,
   l,
-  a,
   p,
+  a,
   c,
   C
 ], P = [
@@ -35,10 +36,10 @@ const b = [
 ], S = [
   ...P,
   ...b.flatMap((o) => Object.values(o))
-], K = S.reduce(
+], L = S.reduce(
   (o, t) => o.addControl(t),
   new r().addBlock(m).withSettingsPanelRegistry(B)
 ).addStyles(y).withIconsRegistry(R).build();
 export {
-  K as default
+  L as default
 };

package/dist/extensions/Blocks/Recommendation/settingsPanel.js

@@ -2,6 +2,7 @@ import { SettingsPanelRegistry as E, SettingsPanelTab as _, SettingsTab as O, Co
 import { BLOCK_ID as U } from "./block.js";
 import { RecommendationBlockId as S } from "./constants/blockIds.js";
 import { RecommendationControlId as T } from "./constants/controlIds.js";
+import "./constants/selectors.js";
 import { CONTROL_BLOCK_ID as A } from "./controls/main/index.js";
 import "./store/recommendation.js";
 import "./controls/name/index.js";
@@ -15,7 +16,7 @@ import { SPACING_CONTROL_ID as L } from "./controls/spacing/index.js";
 import { CARD_BACKGROUND_COLOR_CONTROL_ID as D } from "./controls/cardBackground/index.js";
 import { COMPOSITION_CONTROL_BLOCK_ID as B } from "./controls/cardComposition/index.js";
 import { SYNC_INFO_MESSAGE_CONTROL_ID as N } from "./controls/syncInfoMessage.js";
-class Z extends E {
+class a extends E {
   registerBlockControls(I) {
     I[U] = [
       new _(
@@ -194,5 +195,5 @@ class Z extends E {
   }
 }
 export {
-  Z as SettingsPanel
+  a as SettingsPanel
 };

package/dist/extensions/Blocks/Recommendation/store/recommendation.js

@@ -2,6 +2,7 @@ import { getRecommendationFeedSourceMaps as g, getOperatorOptions as R, PriceAtt
 import { useRecommendationApi as y } from "../../../../services/recommendationApi.js";
 import { useConfigStore as G } from "../../../../stores/config.js";
 import { defineStore as P } from "pinia";
+import "../constants/selectors.js";
 import { DEFAULT_CARDS_IN_ROW as F } from "../constants/layout.js";
 import { EXCLUDED_ALGORITHM_IDS as D } from "../constants/defaultConfig.js";
 import { getDefaultProducts as S } from "../templates/utils.js";
@@ -59,7 +60,7 @@ const x = () => ({
   blockStates: {},
   currentRecommendationId: null,
   configVersion: 0
-}), T = P("guidoRecommendationExtension", {
+}), K = P("guidoRecommendationExtension", {
   state: () => x(),
   getters: {
     // ====================================================================
@@ -475,5 +476,5 @@ const x = () => ({
   }
 });
 export {
-  T as useRecommendationExtensionStore
+  K as useRecommendationExtensionStore
 };

package/dist/extensions/Blocks/Recommendation/templates/grid/elementRenderer.js

@@ -115,10 +115,8 @@ const S = {
                             class="esd-block-text product-old-price es-p15l es-p15r"
                             align="center"
                             esd-extension-block-id="${s.OLD_PRICE}">
-                            <p
-                                contenteditable="false"
-                                style="font-size: 14px; color: #999999;">
-                                <s><strong>${i(t, "original_price")}</strong></s>
+                            <p contenteditable="false" style="font-size: 14px; color: #999999;">
+                                <strong>${i(t, "original_price")}</strong>
                             </p>
                         </td>
                     </tr>

package/dist/extensions/Blocks/Recommendation/templates/grid/template.js

@@ -1,3 +1,4 @@
+import "../../constants/selectors.js";
 import { DEFAULT_PRODUCTS_PER_ROW as L } from "../../constants/layout.js";
 import { getDefaultProducts as E, DEFAULTS as I, createBlockTemplate as _, DEFAULT_CARD_COMPOSITION as S, spacer as b, buildElementRenderer as A, DEFAULT_CARD_VISIBILITY as f } from "../utils.js";
 import { ATTRIBUTE_CELL_CLASS as w, DEFAULT_CELL_PADDING as D, gridElementRenderer as C } from "./elementRenderer.js";
@@ -52,12 +53,12 @@ function U(t, e, o, r, n = {}) {
 function h(t, e, o, r = {}) {
   return U(t, e, C, o, r);
 }
-function F(t) {
+function H(t) {
   const e = t ? `ins-recommendation-v3-block-${t}` : void 0, o = _("grid", e), r = E(), n = h(r, L);
   return o.replace("{-{-TITLE-}-}", I.TITLE).replace("{-{-PRODUCT_ROWS-}-}", n).replace("{-{-MOBILE_PRODUCT_ROWS-}-}", "");
 }
 export {
-  F as getDefaultTemplate,
+  H as getDefaultTemplate,
   P as prepareGridAttributeRows,
   U as prepareGridProductRows,
   h as prepareProductRows

package/dist/extensions/Blocks/Recommendation/templates/index.js

@@ -1,12 +1,13 @@
+import "../constants/selectors.js";
 import { DEFAULT_PRODUCTS_PER_ROW as s } from "../constants/layout.js";
 import { prepareProductRows as c } from "./grid/template.js";
-import { prepareProductRows as R } from "./list/template.js";
-function a(o, t, r = {}) {
+import { prepareProductRows as m } from "./list/template.js";
+function f(o, t, r = {}) {
   if (t === "list")
-    return R(o, r.composition, r.filterList);
+    return m(o, r.composition, r.filterList);
   const { productsPerRow: e = s, composition: p, filterList: i } = r;
   return c(o, e, p, i);
 }
 export {
-  a as prepareProductRows
+  f as prepareProductRows
 };

package/dist/extensions/Blocks/Recommendation/templates/list/elementRenderer.js

@@ -14,10 +14,10 @@ function b() {
     thousandSeparator: e.thousandSeparator
   };
 }
-function r(t, e = "price") {
-  const n = b(), s = t[e], a = (s == null ? void 0 : s[n.code]) ?? Object.values(s ?? {})[0] ?? 0;
+function s(t, e = "price") {
+  const n = b(), a = t[e], r = (a == null ? void 0 : a[n.code]) ?? Object.values(a ?? {})[0] ?? 0;
   return R({
-    price: a,
+    price: r,
     currency: n
   });
 }
@@ -69,7 +69,7 @@ const I = {
                 esd-extension-block-id="${o.PRICE}"
                 align="left">
                 <p contenteditable="false" style="font-size: 16px; color: #333333; font-weight: bold; margin: 0;">
-                    <strong>${r(t, "price")}</strong>
+                    <strong>${s(t, "price")}</strong>
                 </p>
             </td>
         </tr>
@@ -85,8 +85,8 @@ const I = {
                 align="left">
                 <p
                     contenteditable="false"
-                    style="font-size: 14px; color: #999999; margin: 0;">
-                    <s><strong>${r(t, "original_price")}</strong></s>
+                    style="font-size: 14px; color: #999999; text-decoration: line-through; margin: 0;">
+                    <strong>${s(t, "original_price")}</strong>
                 </p>
             </td>
         </tr>
@@ -104,7 +104,7 @@ const I = {
                 align="left">
                 <p contenteditable="false" style="font-size: 12px; color: #666666; margin: 0;">
                     <span class="omnibus-text-before">Lowest 30-day price: </span>
-                    <span class="omnibus-price-value">${r(t, "original_price")}</span>
+                    <span class="omnibus-price-value">${s(t, "original_price")}</span>
                     <span class="omnibus-text-after"></span>
                 </p>
             </td>
@@ -115,7 +115,7 @@ const I = {
    */
   [g]: (t) => {
     var i, l;
-    const e = b(), n = ((i = t.original_price) == null ? void 0 : i[e.code]) ?? Object.values(t.original_price ?? {})[0] ?? 0, s = ((l = t.price) == null ? void 0 : l[e.code]) ?? Object.values(t.price ?? {})[0] ?? 0, a = n > 0 ? Math.round((n - s) / n * 100) : 0, m = a > 0 ? `-${a}%` : "0%";
+    const e = b(), n = ((i = t.original_price) == null ? void 0 : i[e.code]) ?? Object.values(t.original_price ?? {})[0] ?? 0, a = ((l = t.price) == null ? void 0 : l[e.code]) ?? Object.values(t.price ?? {})[0] ?? 0, r = n > 0 ? Math.round((n - a) / n * 100) : 0, m = r > 0 ? `-${r}%` : "0%";
     return `
         <tr>
             <td

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

@@ -1,29 +1,29 @@
-function d(c, t) {
-  const { thousandSeparator: i, decimalSeparator: e, decimalCount: r } = t, [u, o = ""] = String(c).split("."), n = o.slice(0, r).padEnd(r, "0"), a = u.replace(
+function d(a, t) {
+  const { thousandSeparator: s, decimalSeparator: e, decimalCount: r } = t, u = Math.abs(a).toFixed(r), [c, o] = u.split("."), n = c.replace(
     /\B(?=(\d{3})+(?!\d))/g,
-    i
-  );
-  return r > 0 && n ? `${a}${e}${n}` : a;
+    s
+  ), i = a < 0 ? "-" : "";
+  return r > 0 && o ? `${i}${n}${e}${o}` : `${i}${n}`;
 }
-function f(c) {
-  const { price: t, currency: i } = c, {
+function m(a) {
+  const { price: t, currency: s } = a, {
     symbol: e,
     alignment: r,
     thousandSeparator: u,
-    decimalSeparator: o,
-    decimalCount: n
-  } = i;
+    decimalSeparator: c,
+    decimalCount: o
+  } = s;
   if (typeof t != "number" || Number.isNaN(t)) {
-    const s = "0".repeat(n), m = `0${o}${s}`;
-    return r === "before" ? `${e} ${m}` : `${m} ${e}`;
+    const i = "0".repeat(o), $ = `0${c}${i}`;
+    return r === "before" ? `${e} ${$}` : `${$} ${e}`;
   }
-  const a = d(t, {
+  const n = d(t, {
     thousandSeparator: u,
-    decimalSeparator: o,
-    decimalCount: n
+    decimalSeparator: c,
+    decimalCount: o
   });
-  return r === "before" ? `${e} ${a}` : `${a} ${e}`;
+  return r === "before" ? `${e} ${n}` : `${n} ${e}`;
 }
 export {
-  f as formatPrice
+  m as formatPrice
 };

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

@@ -1,4 +1,31 @@
 import type { DynamicContent } from '@@/Types/generic';
+import type { FiltersResponse } from '@@/Types/recommendation';
+/**
+ * Parses a `{{recoId_index_attributeName}}` variable (already stripped of the
+ * braces/whitespace) into its recommendation id and attribute name. Returns
+ * null for anything that isn't a well-formed recommendation variable.
+ */
+export declare function parseRecommendationVariable(field: string): {
+    recoId: string;
+    attribute: string;
+} | null;
+/**
+ * Builds the set of attribute forms valid inside partner-authored
+ * `{{recoId_index_attribute}}` variables: the built-in compiler attributes plus
+ * each account attribute in its canonical token form — bare for
+ * `defaultAttribute`, `product_attribute.<name>` for `productAttribute`. Using
+ * `resolveProductAttrValue` (the same producer the block builder uses) keeps the
+ * validator's notion of "valid form" identical to what is actually emitted.
+ */
+export declare function buildPartnerAttributeNameSet(filterList: FiltersResponse): Set<string>;
+/**
+ * Returns the `{{...}}` custom fields in the HTML that are invalid. Partner
+ * attributes in `ins-skip-compile` blocks (recoId ∈ ignoredIds) are checked
+ * against `ignoredAttributeNames`; Guido-generated reco variables and known merge
+ * tags pass. An unrecognized dotted token is ignored: it was never captured
+ * before, so flagging it would false-positive on merge tags like `{{user.name}}`.
+ */
+export declare function findInvalidCustomFields(html: string, validCustomFields: string[], recommendationBlockIds: string[], ignoredIds: Set<string>, ignoredAttributeNames: Set<string> | null): string[];
 export declare const useHtmlValidator: () => {
     validateHtml: (html: string, customFields: DynamicContent[], isOnSaveValidation?: boolean) => Promise<boolean>;
 };

package/dist/src/config/compiler/utils/recommendationIgnoreUtils.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Returns true when a recommendation block has opted out of Guido's
+ * product-data → template-variable substitution. Partners signal opt-out by
+ * adding the `ins-skip-compile` class on the `.recommendation-block-v2`
+ * element. Only the variable substitution is skipped — campaign URL building,
+ * hidden-row removal, Outlook image widths, discount conditions, text-trim CSS
+ * and general HTML optimizations still apply. See `CSS_CLASS_SKIP_COMPILE` for
+ * the full scope.
+ */
+export declare function isIgnoredRecommendationBlock(block: Element): boolean;
+/**
+ * DOM-parses the HTML once and returns the set of `recommendation-id`
+ * values that belong to ignored blocks. Use this in regex/string-based
+ * compiler rules where the rule processes flat matches and only has the
+ * extracted block ID rather than a DOM Element reference.
+ */
+export declare function getIgnoredRecommendationBlockIds(html: string): Set<string>;

package/dist/src/config/compiler/utils/recommendationIgnoreUtils.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/src/config/migrator/recommendation/extractors.d.ts

@@ -5,3 +5,18 @@ export declare function extractTitleText(block: Element): string;
  * the caller treats that as "no segment background".
  */
 export declare function extractCardBgColor(block: Element): string;
+/**
+ * Reads the legacy block's own `currency-*` attributes into a
+ * `currencySettings`-shaped object that `mapCurrency` understands. Used as a
+ * fallback when the external recommendationConfigs map has no entry for this
+ * block, so the migrated block keeps its real currency instead of defaulting.
+ * Returns undefined when the block carries no `currency` attribute.
+ */
+export declare function extractCurrencyFromBlock(block: Element): Record<string, string> | undefined;
+/**
+ * True when a PM has manually opted the legacy block out of content
+ * regeneration by adding the `ins-skip-compile` class. Detected before rebuild
+ * so the migrator preserves the partner's markup verbatim (keeping their
+ * hand-authored variables) instead of regenerating the block.
+ */
+export declare function isPartnerManagedBlock(block: Element): boolean;

package/dist/src/config/migrator/recommendation/htmlBuilder.d.ts

@@ -8,4 +8,12 @@ export declare function buildBlockHtml(params: {
     extraClasses?: string;
     legacyId?: string;
     legacyBgColor?: string;
+    /**
+     * When set, the block's existing inner HTML is preserved verbatim instead
+     * of regenerating product rows — used for partner-customized blocks so
+     * their hand-authored `{{...}}` variables survive migration.
+     */
+    preserveInnerHtml?: string;
+    /** Adds the `ins-skip-compile` opt-out class to the migrated block. */
+    skipCompile?: boolean;
 }): string;

package/dist/src/extensions/Blocks/Recommendation/constants/index.d.ts

@@ -8,6 +8,6 @@
  */
 export { RecommendationBlockId } from './blockIds';
 export { RecommendationControlId } from './controlIds';
-export { BLOCK_ROOT_SELECTOR, CONTAINER_SELECTOR, DESKTOP_CONTAINER_SELECTOR, MOBILE_CONTAINER_SELECTOR, MOBILE_ROW_SELECTOR, CSS_CLASS_RECO_BUTTON, CURRENCY_ATTR, ATTR_PRODUCT_IMAGE, ATTR_PRODUCT_NAME, ATTR_PRODUCT_PRICE, ATTR_PRODUCT_OLD_PRICE, ATTR_PRODUCT_OMNIBUS_PRICE, ATTR_PRODUCT_OMNIBUS_DISCOUNT, ATTR_PRODUCT_BUTTON, ATTR_CUSTOM_PREFIX, ATTR_DATA_CUSTOM_ATTRIBUTES, ATTR_PRODUCT_ATTR, BUILT_IN_DEFAULT_ATTRIBUTES, } from './selectors';
+export { BLOCK_ROOT_SELECTOR, CONTAINER_SELECTOR, DESKTOP_CONTAINER_SELECTOR, MOBILE_CONTAINER_SELECTOR, MOBILE_ROW_SELECTOR, CSS_CLASS_RECO_BUTTON, CSS_CLASS_SKIP_COMPILE, RECOMMENDATION_VARIABLE_BUILTIN_ATTRIBUTES, CURRENCY_ATTR, ATTR_PRODUCT_IMAGE, ATTR_PRODUCT_NAME, ATTR_PRODUCT_PRICE, ATTR_PRODUCT_OLD_PRICE, ATTR_PRODUCT_OMNIBUS_PRICE, ATTR_PRODUCT_OMNIBUS_DISCOUNT, ATTR_PRODUCT_BUTTON, ATTR_CUSTOM_PREFIX, ATTR_DATA_CUSTOM_ATTRIBUTES, ATTR_PRODUCT_ATTR, BUILT_IN_DEFAULT_ATTRIBUTES, } from './selectors';
 export { LAYOUT_VALUES, LAYOUT_OPTIONS, DEFAULT_PRODUCTS_PER_ROW, DEFAULT_CARDS_IN_ROW, DEFAULT_MOBILE_CARDS_IN_ROW, MAX_PRODUCT_COUNT, MIN_PRODUCT_COUNT, MAX_PRODUCTS_PER_ROW, MIN_PRODUCTS_PER_ROW, MAX_MOBILE_PRODUCTS_PER_ROW, MIN_MOBILE_PRODUCTS_PER_ROW, DEFAULT_COLUMN_SPACING, DEFAULT_ROW_SPACING, DEFAULT_MOBILE_COLUMN_SPACING, DEFAULT_MOBILE_ROW_SPACING, MIN_SPACING, MAX_SPACING, SPACING_STEP, } from './layout';
 export { DEFAULT_NODE_CONFIG, DEFAULT_CURRENCY, DEFAULT_COMPOSITION, DEFAULT_VISIBILITY, CURRENT_CONFIG_VERSION, EXCLUDED_ALGORITHM_IDS, } from './defaultConfig';

package/dist/src/extensions/Blocks/Recommendation/constants/selectors.d.ts

@@ -23,6 +23,18 @@ export declare const MOBILE_ROW_SELECTOR = ".ins-recommendation-mobile-row";
  * `{{cId_pIdx_url}}` template variable.
  */
 export declare const CSS_CLASS_RECO_BUTTON = "reco-v3-button";
+/**
+ * Opt-out class for partners who want to inject their own template variables
+ * into a recommendation block. When present on `.recommendation-block-v2`,
+ * Guido skips ONLY its product-data → template-variable substitution
+ * (`replaceProductAttributes`) for that block — partners author their own
+ * `{{recoId_index_attribute}}` variables. Everything else (campaign URL
+ * building, hidden-row removal, Outlook image widths, text-trim CSS, discount
+ * conditions, store hydration, store-level config validation, and general HTML
+ * optimizations) still applies. The class is preserved in the final compiled
+ * output so partners may use it for their own styling.
+ */
+export declare const CSS_CLASS_SKIP_COMPILE = "ins-skip-compile";
 /**
  * Currency HTML attributes set on the block element
  * These are read by the HTML compiler at runtime to format prices
@@ -61,3 +73,12 @@ export declare const ATTR_PRODUCT_ATTR = "product-attr";
  * Used to exclude these from the custom attribute dropdown to prevent duplication with toggles.
  */
 export declare const BUILT_IN_DEFAULT_ATTRIBUTES: Set<string>;
+/**
+ * Attribute names valid inside a `{{recoId_index_attributeName}}` template
+ * variable regardless of the account's custom attribute list. Every built-in
+ * composition attribute is valid, plus `currency` and `discount` which the
+ * compiler emits but are not composition toggles. Custom attributes are
+ * validated separately against the account's fetched attribute list
+ * (`stripo/email-recommendation-attributes`).
+ */
+export declare const RECOMMENDATION_VARIABLE_BUILTIN_ATTRIBUTES: Set<string>;

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

@@ -17,6 +17,13 @@ export declare class RecommendationCardCompositionControl extends CommonControl
     getId(): string;
     getTemplate(): string;
     onRender(): void;
+    /**
+     * Card composition restructures the block (toggles/reorders/adds attribute
+     * cells), which would corrupt a partner-managed (`ins-skip-compile`) block's
+     * preserved markup. There is no native tab-disable API, so the whole control
+     * container is rendered inert (greyed + non-interactive) instead.
+     */
+    _syncDisabledState(): void;
     onTemplateNodeUpdated(node: ImmutableHtmlNode): void;
     onDestroy(): void;
     private _initializeComposition;

package/dist/src/extensions/Blocks/Recommendation/controls/main/layoutOrientation.d.ts

@@ -21,6 +21,11 @@ export declare class LayoutOrientationControl extends CommonControl {
     getTemplate(): string;
     onRender(): void;
     onTemplateNodeUpdated(node: ImmutableHtmlNode): void;
+    /**
+     * Layout orientation restructures the whole block, which is meaningless for
+     * partner-managed (`ins-skip-compile`) blocks — disable the control there.
+     */
+    _syncDisabledState(): void;
     _setFormValues(): void;
     /**
      * Handles layout change

package/dist/src/extensions/Blocks/Recommendation/controls/main/productLayout.d.ts

@@ -30,6 +30,12 @@ export declare class ProductLayoutControl extends CommonControl {
     getTemplate(): string;
     onRender(): void;
     onTemplateNodeUpdated(node: ImmutableHtmlNode): void;
+    /**
+     * Products-per-row and mobile-layout restructure the block, which is
+     * meaningless for partner-managed (`ins-skip-compile`) blocks — disable
+     * these inputs there. Disabling coexists with the visibility logic above.
+     */
+    _syncDisabledState(): void;
     onDestroy(): void;
     _setFormValues(): void;
     /**

package/dist/src/extensions/Blocks/Recommendation/controls/main/utils.d.ts

@@ -35,6 +35,15 @@ interface DocumentModifier {
  * @returns The block element or null if not found
  */
 export declare function getBlockElement(currentNode: ImmutableHtmlNode | null | undefined): ImmutableHtmlNode | null;
+/**
+ * True when the recommendation block has opted out of Guido's content
+ * regeneration via the `ins-skip-compile` class. Partner-managed blocks carry
+ * hand-authored `{{...}}` variables in their cells, so Guido must never
+ * overwrite their content with product data (regenerate / in-place update).
+ * @param currentNode - The current template node
+ * @returns True if the block opted out of content regeneration
+ */
+export declare function isPartnerManagedBlock(currentNode: ImmutableHtmlNode | null | undefined): boolean;
 /**
  * Gets the current layout orientation from the block's data attribute
  * Supports both old (horizontal/vertical) and new (list/grid) values for backward compatibility

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@useinsider/guido",
-  "version": "3.6.0-beta.6fd3d23",
+  "version": "3.6.0-beta.70bbf9f",
   "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",