@useinsider/guido 3.16.0-beta.cbe0707 → 3.16.0-beta.d7c8e2a

package/dist/src/stores/config.d.ts

@@ -2106,11 +2106,6 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
             };
         } | null;
     } & import("pinia").PiniaCustomStateProperties<ConfigStoreState>) => number;
-    /**
-     * Transactional campaigns keep the hard save block. Reactive getter, so
-     * consumers stay safe in setup where a raw config read snapshots null (SD-147945).
-     */
-    isTransactional(): boolean;
     /**
      * Get the username
      */

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

@@ -0,0 +1,33 @@
+import type { BaseDynamicContent } from '@@/Types/generic';
+/** Format key the dynamic-content picker sends for a custom date/time format. */
+export declare const TIME_FORMAT_KEY = "time-format";
+/** Liquid filter that renders a date/time value in a custom pattern. */
+export declare const TIME_FORMAT_FILTER = "time_format";
+/** Liquid filter that renders a fallback when the value is empty. */
+export declare const DEFAULT_FILTER = "default";
+export type DynamicContentFormat = NonNullable<BaseDynamicContent['format']>;
+/** Unwraps a quoted Liquid literal — the exact inverse of `toLiquidLiteral`. */
+export declare const stripQuotes: (literal: string) => string;
+/** Liquid string literal — numbers stay unquoted so `default: 0` keeps its type. */
+export declare const toLiquidLiteral: (value: string) => string;
+/**
+ * `{ key: 'time-format', value: 'YYYY-MM-DD' }` → `time_format: "YYYY-MM-DD"`.
+ * Returns null when the format has no Liquid equivalent, which is the caller's
+ * signal to keep the legacy tail instead.
+ */
+export declare const formatToLiquidFilter: (format: DynamicContentFormat | undefined) => string | null;
+/** Inverse of `formatToLiquidFilter` — reads the picker format back out of one filter segment. */
+export declare const liquidFilterToFormat: (segment: string) => DynamicContentFormat | null;
+/**
+ * The full Liquid expression for a dynamic-content selection, e.g.
+ * `{{ signup_date | time_format: "YYYY-MM-DD" | default: "-" }}`.
+ * A format with no Liquid filter is dropped rather than emitted as invalid syntax —
+ * callers that must preserve it fall back to the legacy tag form.
+ */
+export declare const buildLiquidTag: ({ value, format, fallback }: BaseDynamicContent) => string;
+/** Whether the selection can be expressed in Liquid without losing its format. */
+export declare const hasLiquidEquivalent: (format: DynamicContentFormat | undefined) => boolean;
+/** Whether one `{{ … }}` segment is a `default:` filter. */
+export declare const isLiquidDefaultFilter: (segment: string) => boolean;
+/** Reads the fallback out of a `default: "…"` filter segment. */
+export declare const readLiquidDefault: (segment: string) => string;

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

@@ -15,36 +15,6 @@ import type { SavedTemplateDetails } from '@@/Types/stripo';
  * same source), so it is reliably present regardless of how the block was added.
  */
 export declare function getHtmlReferencedUnsubscribePages(html: string): number[];
-/**
- * Hydrates the recommendation extension store from the persisted `esd-ext-config`
- * JSON blob on each `.recommendation-block-v2` element in the raw editor HTML.
- *
- * Why this runs before `compileHtml`:
- *   The HTML compiler's `prepareRecommendationBlocks` rule asks
- *   `useRecommendation.buildCampaignUrl(id)` to assemble each block's API URL
- *   from `blockStates[id].recommendationConfigs`. That Pinia entry is normally
- *   populated by `RecommendationBlockControl._syncNodeConfigToStore`, which
- *   only fires when the user *selects* the block. Saving without ever
- *   selecting a migrated block would otherwise build the URL from empty/
- *   default state and the campaign URL would not be saved.
- *
- * Why we read raw HTML, not compiled HTML:
- *   Stripo's `compileEmail()` strips editor-only attributes (`esd-*`) from the
- *   compiled output, so `esd-ext-config` is gone by the time the compiler
- *   pipeline sees the HTML. The raw HTML from `getTemplateData()` preserves
- *   the attribute as the migrator wrote it.
- *
- * Reference data pre-load:
- *   When the template has recommendation blocks, this also pre-loads the
- *   shared reference data (languages / currency list) so the save-time
- *   required-fields validator can check each block's locale and currency
- *   against the partner's real options. Best-effort — on a fetch failure the
- *   validator degrades to its empty-list guard (`requiredFields.ts`) instead
- *   of blocking the save or stranding the Save button.
- */
-declare function hydrateRecommendationStoreFromRawHtml(rawHtml: string): Promise<void>;
 export declare const useTemplatePreparation: () => {
     prepareTemplateDetails: () => Promise<Omit<SavedTemplateDetails, "metadata">>;
-    hydrateRecommendationStore: typeof hydrateRecommendationStoreFromRawHtml;
 };
-export {};

package/dist/stores/config.js

@@ -1,8 +1,8 @@
-import { MessageType as o } from "../@types/config/schemas.js";
+import "../@types/config/schemas.js";
 import "../@types/config/defaults.js";
-import { parseConfig as r } from "../@types/config/validator.js";
-import { defineStore as a } from "pinia";
-const g = a("guido-config", {
+import { parseConfig as o } from "../@types/config/validator.js";
+import { defineStore as r } from "pinia";
+const f = r("guido-config", {
   state: () => ({
     initialized: !1,
     config: null
@@ -113,13 +113,6 @@ const g = a("guido-config", {
       var e, n;
       return ((n = (e = i.config) == null ? void 0 : e.partner) == null ? void 0 : n.messageType) ?? 1;
     },
-    /**
-     * Transactional campaigns keep the hard save block. Reactive getter, so
-     * consumers stay safe in setup where a raw config read snapshots null (SD-147945).
-     */
-    isTransactional() {
-      return this.messageType === o.TRANSACTIONAL;
-    },
     /**
      * Get the username
      */
@@ -150,7 +143,7 @@ const g = a("guido-config", {
      * Initialize the config store with validated configuration
      */
     init(i) {
-      const e = r(i);
+      const e = o(i);
       this.config = e, this.initialized = !0;
     },
     /**
@@ -162,5 +155,5 @@ const g = a("guido-config", {
   }
 });
 export {
-  g as useConfigStore
+  f as useConfigStore
 };

package/dist/utils/dynamicContentFormat.js

@@ -0,0 +1,35 @@
+const l = "time-format", _ = "time_format", s = "default", u = {
+  [l]: _
+}, L = Object.fromEntries(
+  Object.entries(u).map(([t, i]) => [i, t])
+), E = /^([a-z_]+)\s*:\s*(.+)$/, c = (t) => {
+  const i = t.slice(0, 1);
+  return (i === '"' || i === "'") && t.endsWith(i) && t.length > 1 ? t.slice(1, -1).replace(/\\(["'\\])/g, "$1") : t;
+}, o = (t) => !Number.isNaN(Number(t)) && t.trim() !== "" ? t : `"${t.replace(/(["\\])/g, "\\$1")}"`, r = (t) => {
+  const i = t != null && t.key ? u[t.key] : void 0;
+  return !i || !(t != null && t.value) ? null : `${i}: ${o(t.value)}`;
+}, T = (t) => {
+  const i = t.trim().match(E);
+  if (!i)
+    return null;
+  const e = L[i[1]];
+  return e ? { key: e, value: c(i[2].trim()) } : null;
+}, d = ({ value: t, format: i, fallback: e }) => {
+  const n = [r(i)];
+  return e && n.push(`${s}: ${o(e)}`), `{{ ${[t, ...n.filter(Boolean)].join(" | ")} }}`;
+}, F = (t) => !t || r(t) !== null, I = (t) => t.startsWith(`${s}:`), $ = (t) => c(
+  t.slice(`${s}:`.length).trim()
+);
+export {
+  s as DEFAULT_FILTER,
+  _ as TIME_FORMAT_FILTER,
+  l as TIME_FORMAT_KEY,
+  d as buildLiquidTag,
+  r as formatToLiquidFilter,
+  F as hasLiquidEquivalent,
+  I as isLiquidDefaultFilter,
+  T as liquidFilterToFormat,
+  $ as readLiquidDefault,
+  c as stripQuotes,
+  o as toLiquidLiteral
+};

package/dist/utils/genericUtil.js

@@ -1,68 +1,62 @@
-const o = (l) => {
-  const a = l.value.match(/\{\{([^}]+)\}\}/)[1].split("|").map((t) => t.trim()), [c] = a, r = {
-    text: l.label,
-    value: c || ""
+import { hasLiquidEquivalent as v, buildLiquidTag as b, isLiquidDefaultFilter as o, readLiquidDefault as f, liquidFilterToFormat as h } from "./dynamicContentFormat.js";
+const d = (e) => {
+  const a = e.value.match(/\{\{([^}]+)\}\}/)[1].split("|").map((t) => t.trim()), [n] = a, r = {
+    text: e.label,
+    value: n || ""
   };
   if (a.length >= 2) {
-    const [, t, e] = a;
-    if (t.startsWith("default:")) {
-      let n = t.slice(8).trim();
-      n.startsWith('"') && n.endsWith('"') && (n = n.slice(1, -1)), r.fallback = n;
-    } else {
-      const n = t.includes("=") ? { key: t.split("=")[0].trim(), value: t.split("=")[1].trim() } : null;
-      n ? r.format = n : e || (r.fallback = t), e && (r.fallback = e);
+    const [, t, l] = a;
+    if (o(t))
+      r.fallback = f(t);
+    else {
+      const s = h(t) ?? (t.includes("=") ? { key: t.split("=")[0].trim(), value: t.split("=")[1].trim() } : null);
+      s ? r.format = s : l || (r.fallback = t), l && (r.fallback = o(l) ? f(l) : l);
     }
   }
   return r;
-}, f = (l, s = !1) => l.map((a) => {
-  if (a.format)
+}, i = (e, u = !1) => e.map((a) => {
+  var n;
+  if (u && v(a.format)) {
+    const r = [(n = a.format) == null ? void 0 : n.value, a.fallback].filter(Boolean);
     return {
-      label: `${a.text} | ${a.format.key}=${a.format.value}`,
-      value: `{{${a.value}|${a.format.key}=${a.format.value}}}`
-    };
-  if (s) {
-    if (!a.fallback)
-      return {
-        label: a.text,
-        value: `{{ ${a.value} }}`
-      };
-    const r = !Number.isNaN(Number(a.fallback)) && a.fallback.trim() !== "" ? a.fallback : `"${a.fallback}"`;
-    return {
-      label: `${a.text} | ${a.fallback}`,
-      value: `{{ ${a.value} | default: ${r} }}`
+      label: [a.text, ...r].join(" | "),
+      value: b(a)
     };
   }
-  return {
+  return a.format ? {
+    label: `${a.text} | ${a.format.key}=${a.format.value}`,
+    value: `{{${a.value}|${a.format.key}=${a.format.value}}}`
+  } : {
     label: a.fallback ? `${a.text} | ${a.fallback}` : a.text,
     value: a.fallback ? `{{${a.value}|${a.fallback}}}` : `{{${a.value}}}`
   };
-}), b = (l) => {
-  const s = [], a = /* @__PURE__ */ new Set(), c = (t) => {
-    Array.isArray(t) && t.forEach((e) => {
-      const n = [...e.children ?? [], ...e.select_items ?? []];
-      if (n.length > 0) {
-        c(n);
+}), $ = (e) => {
+  const u = [], a = /* @__PURE__ */ new Set(), n = (t) => {
+    Array.isArray(t) && t.forEach((l) => {
+      const s = [...l.children ?? [], ...l.select_items ?? []];
+      if (s.length > 0) {
+        n(s);
         return;
       }
-      const u = e.text || e.tag_text;
-      u && e.value && !a.has(e.value) && (a.add(e.value), s.push({ text: u, value: e.value }));
+      const c = l.text || l.tag_text;
+      c && l.value && !a.has(l.value) && (a.add(l.value), u.push({ text: c, value: l.value }));
     });
-  }, [r] = Object.values(l ?? {});
-  return c(r), s;
-}, v = (l, s, a = !1) => {
-  const c = new Set(l.map((t) => t.value)), r = s.filter((t) => c.has(t.value) ? !1 : (c.add(t.value), !0));
+  }, [r] = Object.values(e ?? {});
+  return n(r), u;
+}, g = (e, u, a = !1) => {
+  const n = new Set(e.map((t) => t.value)), r = u.filter((t) => n.has(t.value) ? !1 : (n.add(t.value), !0));
   return [
-    ...f(l, a),
-    ...f(r, a)
+    ...i(e, a),
+    ...i(r, a)
   ];
-}, i = () => {
-  var l;
-  return ((l = document.head.querySelector('meta[name="csrf-token"]')) == null ? void 0 : l.getAttribute("content")) ?? "";
+}, y = () => {
+  var e;
+  return ((e = document.head.querySelector('meta[name="csrf-token"]')) == null ? void 0 : e.getAttribute("content")) ?? "";
 };
 export {
-  v as buildMergeTagEntries,
-  f as dynamicContentToMergeTags,
-  b as flattenDynamicContentList,
-  i as getCsrfToken,
-  o as mergeTagToDynamicContent
+  g as buildMergeTagEntries,
+  i as dynamicContentToMergeTags,
+  $ as flattenDynamicContentList,
+  y as getCsrfToken,
+  d as mergeTagToDynamicContent
 };

package/dist/utils/templatePreparation.js

@@ -1,27 +1,27 @@
-import { useActionsApi as R } from "../composables/useActionsApi.js";
+import { useActionsApi as k } from "../composables/useActionsApi.js";
 import { useConfig as U } from "../composables/useConfig.js";
 import { useHtmlCompiler as x } from "../composables/useHtmlCompiler.js";
 import { DEFAULT_CURRENCY as d, DEFAULT_NODE_CONFIG as s } from "../extensions/Blocks/Recommendation/constants/defaultConfig.js";
-import { useRecommendationExtensionStore as T } from "../extensions/Blocks/Recommendation/store/recommendation.js";
+import { useRecommendationExtensionStore as C } from "../extensions/Blocks/Recommendation/store/recommendation.js";
 import { mapLegacyStrategy as L } from "../extensions/Blocks/Recommendation/utils/legacyStrategyMap.js";
 import { DATA_ATTRIBUTES as A } from "../extensions/Blocks/Unsubscribe/utils/constants.js";
-import { parsePageList as N } from "../extensions/Blocks/Unsubscribe/utils/utils.js";
-import { useDynamicContentStore as z } from "../stores/dynamic-content.js";
-import { useEditorStore as _ } from "../stores/editor.js";
-import { useUnsubscribeStore as v } from "../stores/unsubscribe.js";
-import { assignTrackingIds as O } from "./linkTrackingIds.js";
-function M(m) {
+import { parsePageList as R } from "../extensions/Blocks/Unsubscribe/utils/utils.js";
+import { useDynamicContentStore as N } from "../stores/dynamic-content.js";
+import { useEditorStore as z } from "../stores/editor.js";
+import { useUnsubscribeStore as _ } from "../stores/unsubscribe.js";
+import { assignTrackingIds as v } from "./linkTrackingIds.js";
+function O(m) {
   const n = new DOMParser().parseFromString(m, "text/html").querySelectorAll(`[${A.PAGE_LIST}]`), t = [];
   return n.forEach((i) => {
     const o = i.getAttribute(A.PAGE_LIST);
-    o && t.push(...N(o));
+    o && t.push(...R(o));
   }), [...new Set(t)];
 }
-async function C(m) {
+async function M(m) {
   const a = new DOMParser().parseFromString(m, "text/html").querySelectorAll(".recommendation-block-v2");
   if (a.length === 0)
     return;
-  const n = T();
+  const n = C();
   a.forEach((t) => {
     var r, l, g, f, c;
     const i = t.getAttribute("recommendation-id"), o = i ? Number(i) : NaN;
@@ -68,39 +68,39 @@ async function C(m) {
   }
 }
 const Z = () => {
-  const m = z(), u = _(), a = v(), { getCompiledEmail: n, getTemplateData: t, updateHtmlAndCss: i } = R(), { compileHtml: o, compileAmpHtml: p } = x(), { isFeatureEnabled: e } = U();
+  const m = N(), u = z(), a = _(), { getCompiledEmail: n, getTemplateData: t, updateHtmlAndCss: i } = k(), { compileHtml: o, compileAmpHtml: p } = x(), { isFeatureEnabled: e } = U();
   return {
     prepareTemplateDetails: async () => {
       let { html: r, css: l, syncModulesIds: g = [] } = await t();
       if (e("linkTrackingIds"))
         try {
-          const { html: y, changed: I, nextSeq: k } = O(r, u.trackIdSessionFloor);
-          u.trackIdSessionFloor = k, I && (r = y, await i(y, l));
+          const { html: y, changed: H, nextSeq: I } = v(r, u.trackIdSessionFloor);
+          u.trackIdSessionFloor = I, H && (r = y, await i(y, l));
         } catch (y) {
           console.error("Tracking-id step failed, saving anyway:", y);
         }
-      const { html: f, ampHtml: c = "", ampErrors: w = [] } = await n({
+      const { html: f, ampHtml: c = "", ampErrors: T = [] } = await n({
         minimize: !0,
         resetDataSavedFlag: !1
       });
-      a.selectedUnsubscribePages.length && await a.fetchTemplates(), await C(r);
-      const { compiledHtml: D, stats: S, appliedRules: E } = o(f), P = c && p(c).compiledHtml, F = m.getSelectedDynamicContentList, H = T(), b = M(r);
+      a.selectedUnsubscribePages.length && await a.fetchTemplates(), await M(r);
+      const { compiledHtml: w, stats: S, appliedRules: D } = o(f), E = c && p(c).compiledHtml, P = m.getSelectedDynamicContentList, F = C(), b = O(r);
       return console.debug("HTML Compilation Stats:", {
         originalSize: S.originalSize,
         compiledSize: S.compiledSize,
         reduction: `${S.reductionPercentage.toFixed(2)}%`,
-        appliedRules: E,
+        appliedRules: D,
         executionTime: `${S.executionTime.toFixed(2)}ms`
       }), {
-        dynamicContentList: F,
-        compiledHtml: D,
+        dynamicContentList: P,
+        compiledHtml: w,
         rawHtml: r,
         css: l,
-        ampHtml: P,
-        ampErrors: w,
+        ampHtml: E,
+        ampErrors: T,
         modules: g.map(Number),
         recommendation: {
-          campaignUrls: H.recommendationCampaignUrls,
+          campaignUrls: F.recommendationCampaignUrls,
           configs: {}
         },
         unsubscribe: {
@@ -108,13 +108,10 @@ const Z = () => {
           config: b
         }
       };
-    },
-    // Exposed so the back/test validate-only path can seed the reco store the
-    // same way a full save does (required-field findings depend on it).
-    hydrateRecommendationStore: C
+    }
   };
 };
 export {
-  M as getHtmlReferencedUnsubscribePages,
+  O as getHtmlReferencedUnsubscribePages,
   Z as useTemplatePreparation
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@useinsider/guido",
-  "version": "3.16.0-beta.cbe0707",
+  "version": "3.16.0-beta.d7c8e2a",
   "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",

package/dist/components/organisms/validation/ValidationErrorDrawer.vue.js

@@ -1,20 +0,0 @@
-import n from "./ValidationErrorDrawer.vue2.js";
-/* empty css                           */
-import s from "../../../_virtual/_plugin-vue2_normalizer.js";
-var i = function() {
-  var r = this, o = r._self._c, t = r._self._setupProxy;
-  return o(t.WpDrawer, { attrs: { id: "guido__validation-error-drawer", size: "small", "footer-button-group-options": t.footerButtonGroupOptions, status: t.store.isDrawerOpen, "title-text": t.titleText }, on: { onCloseEvent: t.handleClose, primaryButtonEvent: t.handleClose, secondaryButtonEvent: t.handleSecondary } }, [o("div", { staticClass: "d-f f-d-c validation-error-list" }, r._l(t.rows, function(e, a) {
-    return o("div", { key: a, staticClass: "d-f a-i-c validation-error-row" }, [o(t.InIcons, { staticClass: "validation-error-row__icon i-c-12", attrs: { name: "filled-caution-triangle" } }), o("span", { staticClass: "validation-error-row__text" }, [r._v(r._s(e))])], 1);
-  }), 0)]);
-}, l = [], _ = /* @__PURE__ */ s(
-  n,
-  i,
-  l,
-  !1,
-  null,
-  "31b677b4"
-);
-const u = _.exports;
-export {
-  u as default
-};

package/dist/components/organisms/validation/ValidationErrorDrawer.vue2.js

@@ -1,61 +0,0 @@
-import { defineComponent as S, ref as v, computed as a } from "vue";
-import g from "../../wrappers/WpDrawer.vue.js";
-import { useBack as h } from "../../../composables/useGuidoActions.js";
-import { useSave as _ } from "../../../composables/useSave.js";
-import { useTranslations as b } from "../../../composables/useTranslations.js";
-import { useConfigStore as w } from "../../../stores/config.js";
-import { useEditorStore as B } from "../../../stores/editor.js";
-import { useSaveValidationStore as T } from "../../../stores/save-validation.js";
-import { InIcons as x } from "@useinsider/design-system-vue";
-const L = /* @__PURE__ */ S({
-  __name: "ValidationErrorDrawer",
-  setup(C) {
-    const o = b(), t = T(), n = B(), s = w(), { saveWithErrors: i } = _(), l = h(), r = v(!1), d = a(() => `${o("email-editor.validation-errors")} (${t.errorCount})`), m = a(() => {
-      const e = {
-        primaryButton: {
-          styling: "solid",
-          type: "primary",
-          labelText: o("email-editor.update-design")
-        }
-      };
-      return t.intent === "back" ? e.secondaryButton = {
-        styling: "solid",
-        type: "subtle-primary",
-        labelText: o("email-editor.leave-without-saving")
-      } : !s.isTransactional && t.intent !== "test" && (e.secondaryButton = {
-        styling: "solid",
-        type: "subtle-primary",
-        labelText: o("email-editor.save-and-continue"),
-        loadingStatus: r.value
-      }), e;
-    }), p = a(() => t.errors.map((e) => {
-      const y = e.detail ? ` (${e.detail})` : "";
-      return `${e.message}${y}`;
-    })), f = () => {
-      t.isDrawerOpen && t.close();
-    }, c = async () => {
-      if (!r.value) {
-        r.value = !0, n.loadingStatus = !0;
-        try {
-          await i() ? t.close() : n.loadingStatus = !1;
-        } catch {
-          n.loadingStatus = !1;
-        } finally {
-          r.value = !1;
-        }
-      }
-    }, u = () => {
-      t.close(), l();
-    };
-    return { __sfc: !0, trans: o, store: t, editorStore: n, configStore: s, saveWithErrors: i, handleBack: l, isSaving: r, titleText: d, footerButtonGroupOptions: m, rows: p, handleClose: f, handleSaveAndContinue: c, handleDiscardAndLeave: u, handleSecondary: () => {
-      if (t.intent === "back") {
-        u();
-        return;
-      }
-      c();
-    }, WpDrawer: g, InIcons: x };
-  }
-});
-export {
-  L as default
-};