@useinsider/guido 3.18.3-beta.ec88281 → 3.19.0

package/README.md

@@ -561,6 +561,26 @@ import {
 import '@useinsider/guido/style';
 ```
 
+### Subpath entries
+
+Two surfaces also ship as their own entry points. Importing one pulls in only its
+own dependencies, so a consumer that needs the store or the tracking-id helpers
+never loads the editor:
+
+```typescript
+// Live editor state, published by the editor into the host's shared Pinia instance.
+// Store id `guidoEmailEditor` is the cross-app contract — read it, do not redeclare it.
+import { useGuidoEmailEditorStore } from '@useinsider/guido/editor-state';
+import type { GuidoEmailEditorState } from '@useinsider/guido/editor-state';
+
+// Persistent link ids for the click heatmap.
+import { assignTrackingIds, TRACK_ID_ATTRIBUTE } from '@useinsider/guido/tracking-ids';
+import type { TrackingIdResult } from '@useinsider/guido/tracking-ids';
+```
+
+Both are re-exported from the root barrel as well; the subpath is what keeps the
+editor out of the consumer's module graph.
+
 ---
 
 ## Constants

package/dist/composables/useGuidoStateBridge.js

@@ -1,54 +1,59 @@
-import { useActionsApi as b } from "./useActionsApi.js";
-import { useEditorLock as v } from "./useEditorLock.js";
+import { useActionsApi as v } from "./useActionsApi.js";
+import { useEditorLock as C } from "./useEditorLock.js";
 import { useConfigStore as T } from "../stores/config.js";
 import { useEditorStore as w } from "../stores/editor.js";
 import { useGuidoEmailEditorStore as y } from "../stores/guido-email-editor.js";
-import { watch as a, onUnmounted as B } from "vue";
-const C = 500, L = () => {
-  const i = w(), u = y(), l = T(), { getTemplateData: d } = b(), { runExclusive: m, isEditorBusy: p } = v();
-  let o = null, s = !1;
-  const n = () => {
+import { watch as c, onUnmounted as z } from "vue";
+const B = 500, G = () => {
+  const i = w(), u = y(), d = T(), { getTemplateData: l } = v(), { runExclusive: m, isEditorBusy: p } = C();
+  let o = null, n = !1;
+  const r = () => {
     o && (clearTimeout(o), o = null);
-  }, c = (t) => {
-    n(), o = setTimeout(() => {
+  }, a = (t) => {
+    r(), o = setTimeout(() => {
       o = null, t();
-    }, C);
+    }, B);
   }, e = async () => {
-    var t, r;
-    if (!(s || !i.isStripoInitialized)) {
+    var t, s;
+    if (!(n || !i.isStripoInitialized)) {
       if (p()) {
-        c(() => void e());
+        a(() => void e());
         return;
       }
       try {
-        const { html: E, css: g } = await m(d), I = ((r = (t = l.config) == null ? void 0 : t.identity) == null ? void 0 : r.templateId) ?? "";
-        if (s)
+        const { html: E, css: I } = await m(l), b = ((s = (t = d.config) == null ? void 0 : t.identity) == null ? void 0 : s.templateId) ?? "";
+        if (n)
           return;
         u.$patch({
           html: E ?? "",
-          css: g ?? "",
-          templateId: I,
+          css: I ?? "",
+          templateId: b,
           lastUpdatedAt: Date.now()
         });
       } catch {
       }
     }
-  }, f = () => c(() => void e()), h = a(
+  }, f = () => a(() => void e()), h = c(
     () => i.isStripoInitialized,
     (t) => {
       t && e();
     },
     { immediate: !0 }
-  ), S = a(
+  ), S = c(
+    () => i.changeSeq,
+    () => {
+      i.isStripoInitialized && f();
+    }
+  ), g = c(
     () => i.hasChanges,
-    (t, r) => {
-      i.isStripoInitialized && (t ? f() : r && (n(), e()));
+    (t, s) => {
+      !t && s && i.isStripoInitialized && (r(), e());
     }
   );
-  B(() => {
-    s = !0, n(), h(), S();
+  z(() => {
+    n = !0, r(), h(), S(), g();
   });
 };
 export {
-  L as useGuidoStateBridge
+  G as useGuidoStateBridge
 };

package/dist/composables/useStripo.js

@@ -1,6 +1,6 @@
-import { useActionsApi as L } from "./useActionsApi.js";
-import { useBlocksConfig as O } from "./useBlocksConfig.js";
-import { useConfig as q } from "./useConfig.js";
+import { useActionsApi as x } from "./useActionsApi.js";
+import { useBlocksConfig as L } from "./useBlocksConfig.js";
+import { useConfig as O } from "./useConfig.js";
 import { useCustomInterfaceAppearance as H } from "./useCustomInterfaceAppearance.js";
 import { useFullStoryBridge as N } from "./useFullStoryBridge.js";
 import { useModuleRepair as j } from "./useModuleRepair.js";
@@ -17,7 +17,7 @@ import { buildMergeTagEntries as W, flattenDynamicContentList as Y } from "../ut
 import Z from "../package.json.js";
 let n = null;
 const Ce = () => {
-  const { features: c, template: u, isFeatureEnabled: m } = q(), { handleError: p, showToaster: k } = G(), { getToken: B, getCustomFonts: M, getSyncModulesStatus: T } = K(), { handleEvent: v } = z(), { handleModuleAdd: F } = j(), { getStripoBlocksConfig: A } = O(), { getStripoNotifications: V } = $(), f = () => n || (n = new Promise((i, s) => {
+  const { features: c, template: u, isFeatureEnabled: m } = O(), { handleError: p, showToaster: k } = G(), { getToken: B, getCustomFonts: M, getSyncModulesStatus: T } = K(), { handleEvent: v } = z(), { handleModuleAdd: F } = j(), { getStripoBlocksConfig: A } = L(), { getStripoNotifications: V } = $(), f = () => n || (n = new Promise((i, s) => {
     var d;
     if (document.getElementById("UiEditorScript")) {
       i();
@@ -88,8 +88,8 @@ const Ce = () => {
         },
         onTemplateLoaded() {
           try {
-            const { importCss: t } = H(), { activateCustomViewStyles: l, updateTimerInClonedTemplate: I } = L(), { injectFullStory: x } = N();
-            t(), l(), x(), I(), o.onReady(), e.isStripoInitialized = !0, e.loadingStatus = !1, setTimeout(() => {
+            const { importCss: t } = H(), { activateCustomViewStyles: l, updateTimerInClonedTemplate: I } = x(), { injectFullStory: q } = N();
+            t(), l(), q(), I(), o.onReady(), e.isStripoInitialized = !0, e.loadingStatus = !1, setTimeout(() => {
               e.hasChanges = !1;
             }, 1e3);
           } catch (t) {
@@ -106,7 +106,7 @@ const Ce = () => {
           e.isVersionHistoryOpen = t;
         },
         onDataChanged() {
-          e.hasChanges = !0;
+          e.hasChanges = !0, e.changeSeq += 1;
         },
         onEvent: v,
         onModuleAdd: F,

package/dist/extensions/Blocks/Recommendation/controls/cardComposition/index.js

@@ -67,7 +67,7 @@ class se extends ut {
       (d, c) => `
                 <div data-reorder-icon-key="${P}${c}" style="display: none;">
                     <${_.BUTTON}
-                        class="drag-handle-btn flat-inline flat-white"
+                        class="guido-drag-handle-btn flat-inline flat-white"
                         ${O.BUTTON.name}="${P}${c}"
                     >
                         <${_.ICON}
@@ -328,7 +328,7 @@ class se extends ut {
   _createBuiltInItemHtml(t, e) {
     return `
             <div class="orderable-item" draggable="true" data-key="${t.key}">
-                <span class="drag-handle" data-reorder-icon-slot="${e}"></span>
+                <span class="guido-drag-handle" data-reorder-icon-slot="${e}"></span>
                 <span class="item-label">${this.api.translate(t.label)}</span>
                 <div class="item-action" data-action-for="${t.key}"></div>
             </div>
@@ -353,7 +353,7 @@ class se extends ut {
             <div class="orderable-item price-group-item" draggable="true"
                 data-key="${C}" data-group="prices">
                 <div class="price-group-header">
-                    <span class="drag-handle" data-reorder-icon-slot="${t}"></span>
+                    <span class="guido-drag-handle" data-reorder-icon-slot="${t}"></span>
                     <span class="item-label">${this.api.translate("Product Prices")}</span>
                     <div class="item-action" data-action-for="${C}"></div>
                 </div>
@@ -365,7 +365,7 @@ class se extends ut {
     return `
             <div class="orderable-item" draggable="true"
                 data-key="${t}" data-custom-index="${e}">
-                <span class="drag-handle" data-reorder-icon-slot="${r}"></span>
+                <span class="guido-drag-handle" data-reorder-icon-slot="${r}"></span>
                 <div class="custom-attr-select-wrap"
                     data-custom-select-slot="${e}"></div>
                 <div class="item-action"

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

@@ -134,7 +134,10 @@ ue-orderable.orderable-disabled .droppable-icon {
     border-top: 2px solid var(--guido-color-primary-500, #0A2ECC);
 }
 
-.drag-handle {
+/* Namespaced: Stripo ships a global \`.drag-handle { position: absolute }\` for its
+   floating popups, which knocked this handle out of flow (SD-151734). */
+.guido-drag-handle {
+    cursor: move;
     user-select: none;
     display: flex;
     align-items: center;
@@ -144,13 +147,13 @@ ue-orderable.orderable-disabled .droppable-icon {
     flex-shrink: 0;
 }
 
-.drag-handle .drag-handle-btn .button {
+.guido-drag-handle .guido-drag-handle-btn .button {
     padding: 0;
     min-width: auto;
     cursor: move;
 }
 
-.drag-handle .drag-handle-btn .button .icon-button {
+.guido-drag-handle .guido-drag-handle-btn .button .icon-button {
     color: var(--guido-color-gray-600);
 }
 

package/dist/library.js

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

package/dist/package.json.js

@@ -1,4 +1,4 @@
-const o = { stripo: { version: "2.76.0" } }, s = {
+const o = { stripo: { version: "2.77.0" } }, s = {
   guido: o
 };
 export {

package/dist/public/editorState.js

@@ -0,0 +1,4 @@
+import { useGuidoEmailEditorStore as e } from "../stores/guido-email-editor.js";
+export {
+  e as useGuidoEmailEditorStore
+};

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

@@ -1,22 +1,26 @@
 /**
  * Outbound bridge — publishes the current editor's html/css to the shared
- * Pinia store `guidoEmailEditor` so cortex-fe can read it at chat-stream
- * submit time and forward it as `clientState.editor`. This is what enables
+ * Pinia store `guidoEmailEditor`. cortex-fe reads it at chat-stream submit
+ * time and forwards it as `clientState.editor`, which is what enables
  * sub-case 1.3 (refine an already-loaded template via the email-agent).
  *
  * The bridge writes on three triggers:
  *
  *   1. Stripo finishes initializing — first snapshot.
- *   2. Editor `hasChanges` flips to true — debounced 500 ms so a streaming
- *      Stripo edit doesn't thrash the store.
+ *   2. Every document change, via the `changeSeq` counter — debounced 500 ms
+ *      so a streaming Stripo edit doesn't thrash the store.
  *   3. Editor `hasChanges` flips back to false (post-save / autosave) —
  *      immediate, since this is the canonical "saved" snapshot.
  *
  * `getTemplateData()` is a Stripo iframe call; it must not run before
  * `isStripoInitialized` is true. The bridge guards against that.
  *
- * If cortex-fe isn't loaded the store still gets written — that's fine;
- * the store has zero overhead and any future reader will find consistent
- * state. The bridge is a one-way pipe with no consumer dependency.
+ * The store is written even with no reader attached — it has zero overhead,
+ * and a late reader still finds consistent state.
+ *
+ * Readers are not optional any more, so treat the publish timing as part of
+ * the contract: the store ships as `@useinsider/guido/editor-state`, and
+ * email-fe imports it to scan the live html for its Array of Objects lock.
+ * Weakening a trigger here silently breaks that lock in the consumer.
  */
 export declare const useGuidoStateBridge: () => void;

package/dist/src/library.d.ts

@@ -2,5 +2,7 @@ export { default as Guido } from './components/Guido.vue';
 export type { GuidoConfig, GuidoConfigInput, IdentityConfig, PartnerConfig, TemplateConfig, TemplateMigrationConfig, LegacyRecommendationConfig, EditorConfig, UIConfig, FeaturesConfig, BlocksConfig, CompilerConfig, DynamicContent, EmailHeader, DefaultBlockType, CustomBlockType, ValidationResult, ValidationError, } from './@types/config';
 export { validateConfig, parseConfig, parseConfigSafe, isValidConfig, getValidationErrors, MessageType, ProductType, } from './@types/config';
 export { assignTrackingIds, readTrackFloor, readTrackSeq } from './public/trackingIds';
+export { useGuidoEmailEditorStore } from './public/editorState';
+export type { GuidoEmailEditorState } from './public/editorState';
 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/editorState.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Published as `@useinsider/guido/editor-state` — the live editor snapshot Guido
+ * writes into the host's shared Pinia singleton.
+ *
+ * Importing from here pulls in nothing but pinia, so the editor never enters a
+ * consumer's module graph. Re-export surface only: this is the contract,
+ * `stores/guido-email-editor` is the implementation and stays free to move.
+ *
+ * Consumers read the store by importing it; the id `guidoEmailEditor` remains
+ * part of the contract for cortex-fe, which probes `pinia._s` at runtime instead
+ * of taking a build-time dependency on this package.
+ */
+export { useGuidoEmailEditorStore } from '../stores/guido-email-editor';
+export type { GuidoEmailEditorState } from '../stores/guido-email-editor';

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

@@ -4,6 +4,10 @@
  * Importing from here pulls in nothing else, so the editor never enters a
  * consumer's module graph. Re-export surface only: this is the contract,
  * `utils/linkTrackingIds` is the implementation and stays free to move.
+ *
+ * Relative, not the `@@/Utils/` alias: vue-tsc copies the specifier into the emitted
+ * .d.ts verbatim, and a consumer's TypeScript cannot resolve our alias table. A relative
+ * path resolves against dist/src/, so the published types actually load.
  */
-export { assignTrackingIds, readTrackFloor, readTrackSeq, TRACK_ID_ATTRIBUTE, TRACK_SEQ_ATTRIBUTE, } from '@@/Utils/linkTrackingIds';
-export type { TrackingIdResult } from '@@/Utils/linkTrackingIds';
+export { assignTrackingIds, readTrackFloor, readTrackSeq, TRACK_ID_ATTRIBUTE, TRACK_SEQ_ATTRIBUTE, } from '../utils/linkTrackingIds';
+export type { TrackingIdResult } from '../utils/linkTrackingIds';

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

@@ -6,6 +6,7 @@ export declare const useEditorStore: import("pinia").StoreDefinition<"guidoEdito
     isPreviewModeOpen: boolean;
     editorVisualMode: string;
     hasChanges: boolean;
+    changeSeq: number;
     isStripoInitialized: boolean;
     templateId: string;
     syncModulesEnabled: boolean;
@@ -19,6 +20,7 @@ export declare const useEditorStore: import("pinia").StoreDefinition<"guidoEdito
         isPreviewModeOpen: boolean;
         editorVisualMode: string;
         hasChanges: boolean;
+        changeSeq: number;
         isStripoInitialized: boolean;
         templateId: string;
         syncModulesEnabled: boolean;
@@ -31,6 +33,7 @@ export declare const useEditorStore: import("pinia").StoreDefinition<"guidoEdito
         isPreviewModeOpen: boolean;
         editorVisualMode: string;
         hasChanges: boolean;
+        changeSeq: number;
         isStripoInitialized: boolean;
         templateId: string;
         syncModulesEnabled: boolean;
@@ -44,6 +47,7 @@ export declare const useEditorStore: import("pinia").StoreDefinition<"guidoEdito
         isPreviewModeOpen: boolean;
         editorVisualMode: string;
         hasChanges: boolean;
+        changeSeq: number;
         isStripoInitialized: boolean;
         templateId: string;
         syncModulesEnabled: boolean;
@@ -56,6 +60,7 @@ export declare const useEditorStore: import("pinia").StoreDefinition<"guidoEdito
         isPreviewModeOpen: boolean;
         editorVisualMode: string;
         hasChanges: boolean;
+        changeSeq: number;
         isStripoInitialized: boolean;
         templateId: string;
         syncModulesEnabled: boolean;
@@ -69,6 +74,7 @@ export declare const useEditorStore: import("pinia").StoreDefinition<"guidoEdito
         isPreviewModeOpen: boolean;
         editorVisualMode: string;
         hasChanges: boolean;
+        changeSeq: number;
         isStripoInitialized: boolean;
         templateId: string;
         syncModulesEnabled: boolean;
@@ -81,6 +87,7 @@ export declare const useEditorStore: import("pinia").StoreDefinition<"guidoEdito
         isPreviewModeOpen: boolean;
         editorVisualMode: string;
         hasChanges: boolean;
+        changeSeq: number;
         isStripoInitialized: boolean;
         templateId: string;
         syncModulesEnabled: boolean;
@@ -94,6 +101,7 @@ export declare const useEditorStore: import("pinia").StoreDefinition<"guidoEdito
         isPreviewModeOpen: boolean;
         editorVisualMode: string;
         hasChanges: boolean;
+        changeSeq: number;
         isStripoInitialized: boolean;
         templateId: string;
         syncModulesEnabled: boolean;
@@ -106,6 +114,7 @@ export declare const useEditorStore: import("pinia").StoreDefinition<"guidoEdito
         isPreviewModeOpen: boolean;
         editorVisualMode: string;
         hasChanges: boolean;
+        changeSeq: number;
         isStripoInitialized: boolean;
         templateId: string;
         syncModulesEnabled: boolean;
@@ -119,6 +128,7 @@ export declare const useEditorStore: import("pinia").StoreDefinition<"guidoEdito
         isPreviewModeOpen: boolean;
         editorVisualMode: string;
         hasChanges: boolean;
+        changeSeq: number;
         isStripoInitialized: boolean;
         templateId: string;
         syncModulesEnabled: boolean;
@@ -131,6 +141,7 @@ export declare const useEditorStore: import("pinia").StoreDefinition<"guidoEdito
         isPreviewModeOpen: boolean;
         editorVisualMode: string;
         hasChanges: boolean;
+        changeSeq: number;
         isStripoInitialized: boolean;
         templateId: string;
         syncModulesEnabled: boolean;
@@ -144,6 +155,7 @@ export declare const useEditorStore: import("pinia").StoreDefinition<"guidoEdito
         isPreviewModeOpen: boolean;
         editorVisualMode: string;
         hasChanges: boolean;
+        changeSeq: number;
         isStripoInitialized: boolean;
         templateId: string;
         syncModulesEnabled: boolean;
@@ -156,6 +168,7 @@ export declare const useEditorStore: import("pinia").StoreDefinition<"guidoEdito
         isPreviewModeOpen: boolean;
         editorVisualMode: string;
         hasChanges: boolean;
+        changeSeq: number;
         isStripoInitialized: boolean;
         templateId: string;
         syncModulesEnabled: boolean;
@@ -169,6 +182,7 @@ export declare const useEditorStore: import("pinia").StoreDefinition<"guidoEdito
         isPreviewModeOpen: boolean;
         editorVisualMode: string;
         hasChanges: boolean;
+        changeSeq: number;
         isStripoInitialized: boolean;
         templateId: string;
         syncModulesEnabled: boolean;
@@ -181,6 +195,7 @@ export declare const useEditorStore: import("pinia").StoreDefinition<"guidoEdito
         isPreviewModeOpen: boolean;
         editorVisualMode: string;
         hasChanges: boolean;
+        changeSeq: number;
         isStripoInitialized: boolean;
         templateId: string;
         syncModulesEnabled: boolean;
@@ -194,6 +209,7 @@ export declare const useEditorStore: import("pinia").StoreDefinition<"guidoEdito
         isPreviewModeOpen: boolean;
         editorVisualMode: string;
         hasChanges: boolean;
+        changeSeq: number;
         isStripoInitialized: boolean;
         templateId: string;
         syncModulesEnabled: boolean;
@@ -206,6 +222,7 @@ export declare const useEditorStore: import("pinia").StoreDefinition<"guidoEdito
         isPreviewModeOpen: boolean;
         editorVisualMode: string;
         hasChanges: boolean;
+        changeSeq: number;
         isStripoInitialized: boolean;
         templateId: string;
         syncModulesEnabled: boolean;
@@ -219,6 +236,7 @@ export declare const useEditorStore: import("pinia").StoreDefinition<"guidoEdito
         isPreviewModeOpen: boolean;
         editorVisualMode: string;
         hasChanges: boolean;
+        changeSeq: number;
         isStripoInitialized: boolean;
         templateId: string;
         syncModulesEnabled: boolean;
@@ -231,6 +249,7 @@ export declare const useEditorStore: import("pinia").StoreDefinition<"guidoEdito
         isPreviewModeOpen: boolean;
         editorVisualMode: string;
         hasChanges: boolean;
+        changeSeq: number;
         isStripoInitialized: boolean;
         templateId: string;
         syncModulesEnabled: boolean;
@@ -244,6 +263,7 @@ export declare const useEditorStore: import("pinia").StoreDefinition<"guidoEdito
         isPreviewModeOpen: boolean;
         editorVisualMode: string;
         hasChanges: boolean;
+        changeSeq: number;
         isStripoInitialized: boolean;
         templateId: string;
         syncModulesEnabled: boolean;
@@ -256,6 +276,7 @@ export declare const useEditorStore: import("pinia").StoreDefinition<"guidoEdito
         isPreviewModeOpen: boolean;
         editorVisualMode: string;
         hasChanges: boolean;
+        changeSeq: number;
         isStripoInitialized: boolean;
         templateId: string;
         syncModulesEnabled: boolean;
@@ -269,6 +290,7 @@ export declare const useEditorStore: import("pinia").StoreDefinition<"guidoEdito
         isPreviewModeOpen: boolean;
         editorVisualMode: string;
         hasChanges: boolean;
+        changeSeq: number;
         isStripoInitialized: boolean;
         templateId: string;
         syncModulesEnabled: boolean;
@@ -281,6 +303,7 @@ export declare const useEditorStore: import("pinia").StoreDefinition<"guidoEdito
         isPreviewModeOpen: boolean;
         editorVisualMode: string;
         hasChanges: boolean;
+        changeSeq: number;
         isStripoInitialized: boolean;
         templateId: string;
         syncModulesEnabled: boolean;
@@ -294,6 +317,7 @@ export declare const useEditorStore: import("pinia").StoreDefinition<"guidoEdito
         isPreviewModeOpen: boolean;
         editorVisualMode: string;
         hasChanges: boolean;
+        changeSeq: number;
         isStripoInitialized: boolean;
         templateId: string;
         syncModulesEnabled: boolean;
@@ -306,6 +330,7 @@ export declare const useEditorStore: import("pinia").StoreDefinition<"guidoEdito
         isPreviewModeOpen: boolean;
         editorVisualMode: string;
         hasChanges: boolean;
+        changeSeq: number;
         isStripoInitialized: boolean;
         templateId: string;
         syncModulesEnabled: boolean;

package/dist/src/stores/guido-email-editor.d.ts

@@ -1,41 +1,41 @@
-/**
- * Outbound contract Guido publishes to the host's shared Pinia singleton so
- * cortex-fe can pick up the current editor state and forward it as
- * `clientState.editor` on the next chat-stream POST.
- *
- * State + getters only — `useGuidoStateBridge` writes via `$patch`, no actions
- * live here (architecture invariant).
- *
- * Store id `guidoEmailEditor` is cross-MFE: cortex-fe reads it via
- * `pinia._s.get('guidoEmailEditor')` at runtime. The internal Guido editor
- * store keeps id `guidoEditor` — these are intentionally separate. The
- * internal store carries UI state that cortex-fe should not see; this public
- * store carries the contract Guido is willing to share.
- */
-export declare const useGuidoEmailEditorStore: import("pinia").StoreDefinition<"guidoEmailEditor", {
+/** The published editor snapshot — the shape a consumer reads off the shared store. */
+export interface GuidoEmailEditorState {
     /** Current Stripo HTML — stripe tables only, no DOCTYPE/wrapper. */
     html: string;
     /** Current Stripo CSS — es-p* utility classes used by the html. */
     css: string;
     /** Wall-clock ms when html/css were last written by the bridge. */
     lastUpdatedAt: number;
-    /** Template id from the editor config, for cortex-fe to scope per-template. */
+    /** Template id from the editor config, so a consumer can scope per-template. */
     templateId: string;
-}, {
+}
+/**
+ * Outbound contract Guido publishes to the host's shared Pinia singleton so a
+ * consumer can read the current editor state: cortex-fe forwards it as
+ * `clientState.editor` on the next chat-stream POST, email-fe scans it for the
+ * Array of Objects lock.
+ *
+ * Published as `@useinsider/guido/editor-state` and from the root barrel, so a
+ * consumer imports this store instead of re-declaring one under the same id.
+ *
+ * State + getters only, no actions. `useGuidoStateBridge` is the only intended
+ * writer, but that is Guido's own convention rather than something the store
+ * enforces: publishing the definition hands a consumer `$patch` as well, exactly
+ * as the runtime `pinia._s` probe always did.
+ *
+ * Store id `guidoEmailEditor` is cross-MFE: cortex-fe reads it via
+ * `pinia._s.get('guidoEmailEditor')` at runtime rather than importing it, so the
+ * id stays part of the contract. The internal Guido editor store keeps id
+ * `guidoEditor` — these are intentionally separate. The internal store carries
+ * UI state a consumer should not see; this public store carries the contract
+ * Guido is willing to share.
+ */
+export declare const useGuidoEmailEditorStore: import("pinia").StoreDefinition<"guidoEmailEditor", GuidoEmailEditorState, {
     /** True once the bridge has published at least one snapshot. */
     hasSnapshot: (state: {
         html: string;
         css: string;
         lastUpdatedAt: number;
         templateId: string;
-    } & import("pinia").PiniaCustomStateProperties<{
-        /** Current Stripo HTML — stripe tables only, no DOCTYPE/wrapper. */
-        html: string;
-        /** Current Stripo CSS — es-p* utility classes used by the html. */
-        css: string;
-        /** Wall-clock ms when html/css were last written by the bridge. */
-        lastUpdatedAt: number;
-        /** Template id from the editor config, for cortex-fe to scope per-template. */
-        templateId: string;
-    }>) => boolean;
+    } & import("pinia").PiniaCustomStateProperties<GuidoEmailEditorState>) => boolean;
 }, {}>;

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

@@ -0,0 +1,20 @@
+import type { BaseDynamicContent } from '@@/Types/generic';
+export type DynamicContentFormat = NonNullable<BaseDynamicContent['format']>;
+/** Format key the dynamic-content picker sends for a custom date/time format. */
+export declare const TIME_FORMAT_KEY = "time-format";
+/** Wraps a Liquid filter argument in whichever quote style the value itself does not use. */
+export declare const quoteArgument: (value: string) => string | null;
+/**
+ * `{ key: 'time-format', value: '%Y-%m-%d' }` -> `date: "%Y-%m-%d"`.
+ *
+ * Only a custom date/time strftime pattern has a Liquid equivalent. Anything else returns null so
+ * the caller emits a plain tag rather than one that silently lost — or literally printed — its
+ * format.
+ * @example formatToLiquidFilter({ key: 'time-format', value: '%b %-d, %Y' }) -> date: "%b %-d, %Y"
+ */
+export declare const formatToLiquidFilter: (format: DynamicContentFormat) => string | null;
+/**
+ * Inverse of `formatToLiquidFilter` — reads the picker format back out of one filter segment, so a
+ * reopened tag restores its selection in the host's format dropdown.
+ */
+export declare const liquidFilterToFormat: (segment: string) => DynamicContentFormat | null;

package/dist/stores/editor.js

@@ -8,6 +8,10 @@ const o = e("guidoEditor", {
     isPreviewModeOpen: !1,
     editorVisualMode: "desktop",
     hasChanges: !1,
+    // Bumped on every Stripo document change. `hasChanges` is a latch that stays
+    // true until a save, so it cannot signal the second edit onwards; watchers
+    // that need every change (the outbound state bridge) watch this instead.
+    changeSeq: 0,
     isStripoInitialized: !1,
     templateId: "",
     syncModulesEnabled: !1,

package/dist/stores/guido-email-editor.js

@@ -1,13 +1,9 @@
 import { defineStore as e } from "pinia";
 const d = e("guidoEmailEditor", {
   state: () => ({
-    /** Current Stripo HTML — stripe tables only, no DOCTYPE/wrapper. */
     html: "",
-    /** Current Stripo CSS — es-p* utility classes used by the html. */
     css: "",
-    /** Wall-clock ms when html/css were last written by the bridge. */
     lastUpdatedAt: 0,
-    /** Template id from the editor config, for cortex-fe to scope per-template. */
     templateId: ""
   }),
   getters: {

package/dist/utils/genericUtil.js

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

package/dist/utils/liquidDynamicContent.js

@@ -0,0 +1,15 @@
+const E = "time-format", r = "date", u = new RegExp(`^${r}\\s*:\\s*(?:"([^"]*)"|'([^']*)')$`), s = /%[-_0^#]?\d*[a-zA-Z%]/, c = new RegExp(s, "g"), l = /\b(?:Y{2,4}|M{2,4}|D{1,4}|d{3,4}|H{2}|h{2}|m{2}|s{2}|S{1,3}|A|a)\b/, T = (t) => t.includes('"') ? t.includes("'") ? null : `'${t}'` : `"${t}"`, i = (t) => s.test(t) && !l.test(t.replace(c, "")), R = (t) => {
+  if (t.key !== E || !i(t.value ?? ""))
+    return null;
+  const n = T(t.value);
+  return n === null ? null : `${r}: ${n}`;
+}, _ = (t) => {
+  const [, n, o] = t.match(u) ?? [], e = n ?? o;
+  return e ? { key: E, value: e } : null;
+};
+export {
+  E as TIME_FORMAT_KEY,
+  R as formatToLiquidFilter,
+  _ as liquidFilterToFormat,
+  T as quoteArgument
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@useinsider/guido",
-  "version": "3.18.3-beta.ec88281",
+  "version": "3.19.0",
   "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",
@@ -18,6 +18,10 @@
       "types": "./dist/src/public/trackingIds.d.ts",
       "import": "./dist/public/trackingIds.js"
     },
+    "./editor-state": {
+      "types": "./dist/src/public/editorState.d.ts",
+      "import": "./dist/public/editorState.js"
+    },
     "./style": "./dist/guido.css"
   },
   "scripts": {
@@ -77,7 +81,7 @@
     "@typescript-eslint/parser": "7.18.0",
     "@useinsider/eslint-config": "1.5.3",
     "@vitejs/plugin-vue2": "2.3.1",
-    "@vitest/coverage-v8": "2.1.9",
+    "@vitest/coverage-v8": "4.1.11",
     "eslint": "8.57.1",
     "eslint-config-airbnb-base": "15.0.0",
     "eslint-config-airbnb-typescript": "18.0.0",
@@ -90,17 +94,17 @@
     "happy-dom": "15.11.7",
     "husky": "9.1.7",
     "msw": "2.10.3",
-    "nyc": "17.1.0",
+    "nyc": "18.0.0",
     "sass": "1.69.7",
     "typescript": "5.5.4",
     "typescript-eslint": "8.26.0",
     "vite-plugin-dts": "4.5.4",
     "vite-plugin-istanbul": "7.0.0",
-    "vitest": "2.1.9",
+    "vitest": "4.1.11",
     "vue-tsc": "2.2.10"
   },
   "overrides": {
-    "axios": "1.8.2",
+    "axios": "1.20.0",
     "flatted": "3.4.2",
     "micromatch": "4.0.8",
     "path-to-regexp": "6.3.0"
@@ -118,7 +122,7 @@
   },
   "guido": {
     "stripo": {
-      "version": "2.76.0"
+      "version": "2.77.0"
     }
   }
 }