@useinsider/guido 3.1.1 → 3.2.0-beta.080341b

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

@@ -50,3 +50,8 @@ export declare const ATTR_CUSTOM_PREFIX = "customAttr:";
 export declare const ATTR_DATA_CUSTOM_ATTRIBUTES = "data-custom-attributes";
 /** HTML attribute on <td> elements identifying the product attribute for compiler template variable generation */
 export declare const ATTR_PRODUCT_ATTR = "product-attr";
+/**
+ * Default attribute names that are already represented by built-in composition toggle items.
+ * Used to exclude these from the custom attribute dropdown to prevent duplication with toggles.
+ */
+export declare const BUILT_IN_DEFAULT_ATTRIBUTES: Set<string>;

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

@@ -170,6 +170,11 @@ export declare class RecommendationCardCompositionControl extends CommonControl
      * When filterList changes (e.g. after async fetch), re-renders dropdowns with new options.
      */
     private _subscribeToStoreChanges;
+    /**
+     * Returns filters eligible for the custom attribute dropdown,
+     * excluding default attributes already covered by built-in toggle items.
+     */
+    private _getAddableFilters;
     /**
      * Looks up the display name for an attribute from the store's filterList.
      * Falls back to Title Case conversion of the snake_case attribute name.

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

@@ -13,10 +13,12 @@
  * product cards — changing "brand" color won't affect "rating_star" color.
  */
 import { ImmutableHtmlNode } from '@stripoinc/ui-editor-extensions';
+import { CustomAttributeTextTrimControl } from './textTrim';
 /**
  * Grouped Custom Attribute Controls
  * Use this object for cleaner imports in extension.ts
  */
+export { CustomAttributeTextTrimControl } from './textTrim';
 export declare const CustomAttributeControls: {
     readonly align: {
         new (): {
@@ -102,4 +104,5 @@ export declare const CustomAttributeControls: {
             isVisible(_node: ImmutableHtmlNode): boolean;
         };
     };
+    readonly textTrim: typeof CustomAttributeTextTrimControl;
 };

package/dist/src/extensions/Blocks/Recommendation/controls/customAttribute/textTrim.d.ts

@@ -0,0 +1,35 @@
+/**
+ * Custom Attribute Text Trim Control
+ *
+ * Per-attribute text trimming for custom product attributes.
+ * Unlike NameTextTrimControl which applies to ALL product names globally,
+ * this control is scoped to a specific custom attribute type via the
+ * `product-attr` HTML attribute — changing text-trim on "brand" won't
+ * affect "rating_star".
+ *
+ * CSS rules are shared with NameTextTrimControl via shared/textTrimCssRules.ts.
+ */
+import { ImmutableHtmlNode } from '@stripoinc/ui-editor-extensions';
+import { CommonControl } from '../../../common-control';
+/**
+ * Control for enabling/disabling text trimming on individual custom attributes.
+ * Scoped per attribute type using the `product-attr` HTML attribute.
+ */
+export declare class CustomAttributeTextTrimControl extends CommonControl {
+    getId(): string;
+    getTemplate(): string;
+    onRender(): void;
+    onTemplateNodeUpdated(node: ImmutableHtmlNode): void;
+    _setFormValues(): void;
+    _getCurrentTrimState(): boolean;
+    /**
+     * Finds all custom attribute elements of the same type as the current node.
+     *
+     * Similar to getCustomAttrTargetNodes in customAttribute/index.ts, but adapted
+     * for CommonControl lifecycle where currentNode is a class property (not a
+     * parameter from Stripo's getTargetNodes override).
+     */
+    _getTargetElements(): ImmutableHtmlNode[];
+    _onTextTrimChange(enabled: boolean): void;
+    _listenToFormUpdates(): void;
+}

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

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

package/dist/src/extensions/Blocks/Recommendation/controls/name/textTrim.d.ts

@@ -1,9 +1,9 @@
-import { ImmutableCssNode, ImmutableHtmlNode } from '@stripoinc/ui-editor-extensions';
+import { ImmutableHtmlNode } from '@stripoinc/ui-editor-extensions';
 import { CommonControl } from '../../../common-control';
 /**
- * Control for enabling/disabling text trimming on product names
+ * Control for enabling/disabling text trimming on product names.
  * When enabled, adds a CSS class that applies text-overflow: ellipsis
- * and injects the required CSS rules into the document stylesheet
+ * and injects the required CSS rules into the document stylesheet.
  */
 export declare class NameTextTrimControl extends CommonControl {
     getId(): string;
@@ -12,23 +12,6 @@ export declare class NameTextTrimControl extends CommonControl {
     onTemplateNodeUpdated(node: ImmutableHtmlNode): void;
     _setFormValues(): void;
     _getCurrentTrimState(): boolean;
-    /**
-     * Finds an existing CSS rule in the document stylesheet by exact query
-     * @param query - The CSS query to search for (uses Stripo's CSS query syntax)
-     * @returns The CSS rule node if found, undefined otherwise
-     */
-    _findCssRule(query: string): ImmutableCssNode | undefined;
-    /**
-     * Finds the .text-trim-enabled p rule by searching all text-trim rules and comparing selectors
-     * This is needed because Stripo's CSS query syntax interprets spaces as path separators
-     * @returns true if the rule exists
-     */
-    _hasParagraphRule(): boolean;
-    /**
-     * Ensures the text-trim CSS rules exist in the document stylesheet
-     * Only adds rules if they don't already exist (prevents duplicates across multiple blocks)
-     */
-    _ensureCssRulesExist(): void;
     _onTextTrimChange(enabled: boolean): void;
     _listenToFormUpdates(): void;
 }

package/dist/src/extensions/Blocks/Recommendation/controls/shared/textTrimCssRules.d.ts

@@ -0,0 +1,29 @@
+/**
+ * Shared Text Trim CSS Rule Management
+ *
+ * Extracted from NameTextTrimControl to be reused by CustomAttributeTextTrimControl.
+ * Follows the same pattern as controls/mobileLayout/cssRules.ts — standalone
+ * functions that accept an API parameter, importable by any control class.
+ *
+ * The CSS rules are document-scoped (shared across all recommendation blocks).
+ * Once injected, they persist until the template is closed.
+ */
+import type { ImmutableCssNode } from '@stripoinc/ui-editor-extensions';
+import { ModificationDescription } from '@stripoinc/ui-editor-extensions';
+export declare const CSS_CLASS_TEXT_TRIM = "text-trim-enabled";
+interface CssCapableApi {
+    getDocumentRootCssNode: () => ImmutableCssNode | null;
+    getDocumentModifier: () => {
+        modifyCss: (node: ImmutableCssNode) => {
+            appendRule: (rule: string) => void;
+        };
+        apply: (desc: ModificationDescription) => void;
+    };
+}
+/**
+ * Ensures the text-trim CSS rules exist in the document stylesheet.
+ * Only adds rules if they don't already exist (prevents duplicates across blocks).
+ * Calls getDocumentRootCssNode once and passes it to both checks.
+ */
+export declare function ensureTextTrimCssRulesExist(api: CssCapableApi): void;
+export {};

package/dist/src/extensions/Blocks/Recommendation/services/configService.d.ts

@@ -95,15 +95,23 @@ export declare class RecommendationConfigService {
      *
      * Called when a block is first created (dropped into template).
      * Can optionally merge in partial config from migration.
+     *
+     * The `wasFreshDrop` flag distinguishes a brand-new drop (no prior config)
+     * from a clone (Stripo replays the source's setNodeConfig payload before
+     * onCreated fires). Callers use this to skip side-effects already inherited
+     * from the source.
      * @example
      * // In Block.onCreated lifecycle
-     * RecommendationConfigService.initializeConfig(this.api, node);
+     * const { config, wasFreshDrop } = RecommendationConfigService.initializeConfig(this.api, node);
      * @param api - Stripo extension API with document modifier
      * @param node - The immutable HTML node to initialize
      * @param partialConfig - Optional partial config to merge with defaults
-     * @returns The initialized configuration
+     * @returns The initialized configuration and whether the node was a fresh drop
      */
-    static initializeConfig(api: DocumentModifierApi, node: ImmutableHtmlNode, partialConfig?: PartialNodeConfig): RecommendationNodeConfig;
+    static initializeConfig(api: DocumentModifierApi, node: ImmutableHtmlNode, partialConfig?: PartialNodeConfig): {
+        config: RecommendationNodeConfig;
+        wasFreshDrop: boolean;
+    };
     /**
      * Save complete configuration to a node
      *
@@ -119,6 +127,16 @@ export declare class RecommendationConfigService {
      *
      * Reads existing data-attributes and creates a proper node config.
      * Used when loading templates created before node config was implemented.
+     *
+     * Sources, in priority order (later overrides earlier):
+     * 1. `esd-ext-config` JSON blob — emitted by the recommendation migrator and
+     *    by hand-authored new templates. Carries the full RecommendationNodeConfig
+     *    (strategy, language, currency, filters, productIds, etc.) which the
+     *    discrete data-* attrs below cannot capture.
+     * 2. Discrete `data-*` attributes — runtime source of truth for
+     *    layout/composition/spacing; controls keep these in sync as the user
+     *    edits, so we let them override the JSON blob if they disagree.
+     * 3. `currency-*` attributes — durable currency source on the block element.
      * @param api - Stripo extension API with document modifier
      * @param node - The block node to migrate
      * @returns The migrated configuration

package/dist/src/extensions/Blocks/Recommendation/services/configService.test.d.ts

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

package/dist/src/extensions/Blocks/Recommendation/store/recommendation.d.ts

@@ -36,6 +36,25 @@ interface PerBlockState {
     /** Snapshot of filters taken when the drawer opens, used to revert on cancel */
     filterSnapshot: Filter[] | null;
 }
+/**
+ * Persisted-config subset used by `seedBlockUrlConfig` to reconstruct
+ * `recommendationConfigs` from a node-config JSON blob without coupling the
+ * caller to the full `RecommendationNodeConfig` shape. Separator strings are
+ * narrowed at the seed boundary.
+ */
+export interface PerBlockUrlConfig {
+    strategy: string;
+    language: string;
+    size: string;
+    productIds: string[];
+    filters: Filter[];
+    shuffleProducts: boolean;
+    currencyCode: string;
+    currencyAlignment: 'before' | 'after';
+    currencyDecimalCount: number;
+    currencyDecimalSeparator: string;
+    currencyThousandSeparator: string;
+}
 interface StoreState {
     recommendationCampaignUrls: Record<string, string>;
     activePredictiveAlgorithms: number[];
@@ -202,6 +221,21 @@ export declare const useRecommendationExtensionStore: import("pinia").StoreDefin
      * Automatically cleaned up when removeBlockState deletes the block entry.
      */
     markBlockInitialized(id: number): void;
+    /**
+     * Seeds the URL-relevant fields of a block from a persisted node config.
+     *
+     * Used at save-time to ensure the campaign URL is built from the
+     * persisted truth (the `esd-ext-config` blob in the raw HTML) even when
+     * the user never selected the block in this editor session — without
+     * this seed, `_syncNodeConfigToStore` would never have run for that
+     * block and the store would hold default values (USD/en_US/mostPopular)
+     * instead of the real config.
+     *
+     * Creates the block entry if missing; otherwise patches only the URL-
+     * relevant subset and leaves runtime fields (e.g., `recommendedProducts`,
+     * `isInitialized`) alone.
+     */
+    seedBlockUrlConfig(id: number, config: PerBlockUrlConfig): void;
     /**
      * Patches the current block's recommendationConfigs.
      * Replaces `store.$patch({ recommendationConfigs: { ... } })` pattern.

package/dist/src/extensions/Blocks/Recommendation/templates/grid/template.d.ts

@@ -1,4 +1,4 @@
-import type { RecommendationProduct } from '@@/Types/recommendation';
+import type { FiltersResponse, RecommendationProduct } from '@@/Types/recommendation';
 import { type ElementRenderer } from '../utils';
 /**
  * Generates attribute-aligned product rows for grid layout.
@@ -9,7 +9,7 @@ import { type ElementRenderer } from '../utils';
  * @param composition - Array defining order of card elements
  * @returns HTML string for attribute-aligned rows
  */
-export declare function prepareGridAttributeRows(products: RecommendationProduct[], productsPerRow: number, elementRenderer: ElementRenderer, composition?: string[]): string;
+export declare function prepareGridAttributeRows(products: RecommendationProduct[], productsPerRow: number, elementRenderer: ElementRenderer, composition?: string[], filterList?: FiltersResponse): string;
 /**
  * Prepares grid product rows with attribute-aligned structure
  * Groups products into rows, then generates attribute-aligned HTML for each group
@@ -19,7 +19,7 @@ export declare function prepareGridAttributeRows(products: RecommendationProduct
  * @param composition - Array defining order of card elements
  * @returns HTML string for all product rows
  */
-export declare function prepareGridProductRows(products: RecommendationProduct[], productsPerRow: number, elementRenderer: ElementRenderer, composition?: string[]): string;
+export declare function prepareGridProductRows(products: RecommendationProduct[], productsPerRow: number, elementRenderer: ElementRenderer, composition?: string[], filterList?: FiltersResponse): string;
 /**
  * Prepares grid product rows with attribute-aligned structure.
  * Uses row-based rendering where each attribute type forms a single row across all products.
@@ -28,6 +28,6 @@ export declare function prepareGridProductRows(products: RecommendationProduct[]
  * @param composition - Array defining element order
  * @returns HTML string for product rows
  */
-export declare function prepareProductRows(products: RecommendationProduct[], productsPerRow: number, composition?: string[]): string;
+export declare function prepareProductRows(products: RecommendationProduct[], productsPerRow: number, composition?: string[], filterList?: FiltersResponse): string;
 export declare function getDefaultTemplate(recommendationId?: number): string;
 export declare function generateBlockTemplate(products: RecommendationProduct[], productsPerRow: number, title?: string, composition?: string[], mobileProductsPerRow?: number): string;

package/dist/src/extensions/Blocks/Recommendation/templates/list/template.d.ts

@@ -1,4 +1,4 @@
-import type { RecommendationProduct } from '@@/Types/recommendation';
+import type { FiltersResponse, RecommendationProduct } from '@@/Types/recommendation';
 /**
  * Generates a list product card with 3-column layout
  * Uses buildElementRenderer to render Image, Info content, and Button
@@ -11,7 +11,7 @@ import type { RecommendationProduct } from '@@/Types/recommendation';
  * @param composition - Array defining order of card elements
  * @returns HTML string for a single product card row
  */
-export declare function getListProductCard(product: RecommendationProduct, composition?: string[]): string;
+export declare function getListProductCard(product: RecommendationProduct, composition?: string[], filterList?: FiltersResponse): string;
 /**
  * Prepares list product rows
  * Each product is a full-width row with 3-column layout
@@ -19,6 +19,6 @@ export declare function getListProductCard(product: RecommendationProduct, compo
  * @param composition - Array defining order of card elements
  * @returns HTML string for product rows
  */
-export declare function prepareProductRows(products: RecommendationProduct[], composition?: string[]): string;
+export declare function prepareProductRows(products: RecommendationProduct[], composition?: string[], filterList?: FiltersResponse): string;
 export declare function getDefaultTemplate(): string;
 export declare function generateBlockTemplate(products: RecommendationProduct[], title?: string, composition?: string[]): string;

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

@@ -1,15 +1,29 @@
-import type { RecommendationProduct } from '@@/Types/recommendation';
+import type { FiltersResponse, RecommendationProduct } from '@@/Types/recommendation';
 import { ATTR_PRODUCT_IMAGE, ATTR_PRODUCT_NAME, ATTR_PRODUCT_PRICE, ATTR_PRODUCT_OLD_PRICE, ATTR_PRODUCT_OMNIBUS_PRICE, ATTR_PRODUCT_OMNIBUS_DISCOUNT, ATTR_PRODUCT_BUTTON } from '../constants';
 /**
  * Converts a snake_case attribute name to Title Case display name.
  * e.g., "rating_star" → "Rating Star"
  */
 export declare function toDisplayName(attrName: string): string;
+/**
+ * Checks whether an attribute is a default (top-level) product attribute
+ * vs a custom product attribute (nested under `product_attributes`).
+ * Returns false when filterList is empty or the attribute is not found.
+ */
+export declare function isDefaultAttribute(attrName: string, filterList: FiltersResponse): boolean;
+/**
+ * Resolves the `product-attr` HTML attribute value based on attribute type from the filter list.
+ * - Default attributes → attribute name directly (e.g., "brand") → compiles to `{{1_0_brand}}`
+ * - Product attributes → "product_attribute.<name>" (e.g., "product_attribute.rating_star")
+ */
+export declare function resolveProductAttrValue(attrName: string, filterList: FiltersResponse): string;
 /**
  * Callback that generates the cell HTML for a custom product attribute.
  * Layout-specific: grid returns `<td>…`, list returns `<tr><td>…</td></tr>`.
+ * @param productAttrValue - The resolved `product-attr` value (e.g., "brand" or "product_attribute.rating_star")
+ * @param content - The display content for the cell
  */
-export type CustomCellHtmlGetter = (attrName: string, content: string) => string;
+export type CustomCellHtmlGetter = (productAttrValue: string, content: string) => string;
 /**
  * Symbol key for embedding custom attribute HTML in an ElementRenderer.
  * Grid and list renderers store their custom-attribute cell template under this key
@@ -28,8 +42,9 @@ export declare const CUSTOM_CELL_HTML: unique symbol;
  * alongside built-in ones, so template code can use a uniform lookup for all attributes.
  * @param baseRenderer - The built-in element renderer (grid or list), must include a [CUSTOM_CELL_HTML] entry
  * @param composition - Array of attribute keys including `customAttr:*` entries
+ * @param filterList - Filter list from the store, used to determine attribute type for correct product-attr resolution
  */
-export declare function buildElementRenderer(baseRenderer: ElementRenderer, composition: string[]): ElementRenderer;
+export declare function buildElementRenderer(baseRenderer: ElementRenderer, composition: string[], filterList?: FiltersResponse): ElementRenderer;
 export type Orientation = 'list' | 'grid';
 /**
  * Options for prepareProductRows unified function
@@ -41,6 +56,8 @@ export interface PrepareProductRowsOptions {
     mobileProductsPerRow?: number;
     /** Array defining order of card elements */
     composition?: string[];
+    /** Filter list for attribute type resolution (default vs product attributes) */
+    filterList?: FiltersResponse;
 }
 /**
  * Element renderer interface for product card elements.

package/dist/src/extensions/Blocks/Recommendation/types/nodeConfig.d.ts

@@ -24,7 +24,7 @@ export interface CurrencyConfig {
     /** Number of decimal places (-1 for no formatting) */
     decimalCount: number;
     /** Character used for decimal separation */
-    decimalSeparator: '.' | ',';
+    decimalSeparator: '.' | ',' | ' ';
     /** Character used for thousands separation */
     thousandSeparator: '.' | ',' | ' ' | '';
 }

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

@@ -0,0 +1,21 @@
+/**
+ * Maps legacy algorithm strategy keys (used by templates authored against the
+ * old recommendation system) to the new keys used by `RecommendationFeedSourceMaps`.
+ *
+ * Renames are matched by feed-source id:
+ *   - `viewedTogether`    → `similarViewed`         (id 11, path `viewed-together`)
+ *   - `purchasedTogether` → `similarBought`         (id 12, path `purchased-together`)
+ *   - `trending`          → `trendingProducts`      (id 40, path `trending`)
+ *   - `mostValuable`      → `mostValuableOfPartner` (id 46, path `most-valuable`)
+ *   - `topSellers`        → `mostPurchased`         (id 62, path `top-sellers`)
+ *
+ * Used at two boundaries:
+ *   1. The migrator (`settingsMapper`), so freshly migrated node configs carry
+ *      the new key.
+ *   2. The algorithm dropdown control, so already-saved blocks that still carry
+ *      a legacy key resolve to a matching dropdown option.
+ *
+ * Unknown values pass through untouched so a future-added algorithm doesn't
+ * silently default.
+ */
+export declare function mapLegacyStrategy(legacy: string | undefined): string | undefined;

package/dist/src/extensions/Blocks/Recommendation/utils/legacyStrategyMap.test.d.ts

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

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

@@ -1,6 +1,3 @@
-/**
- * Utility for preserving text styling when updating innerHTML
- */
 import type { ImmutableHtmlNode } from '@stripoinc/ui-editor-extensions';
 /**
  * Preserves existing style tags when updating text content

package/dist/src/library.d.ts

@@ -1,5 +1,5 @@
 export { default as Guido } from './components/Guido.vue';
-export type { GuidoConfig, GuidoConfigInput, IdentityConfig, PartnerConfig, TemplateConfig, EditorConfig, UIConfig, FeaturesConfig, BlocksConfig, CompilerConfig, DynamicContent, EmailHeader, DefaultBlockType, CustomBlockType, ValidationResult, ValidationError, } from './@types/config';
+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 type { StripoEventType } from './@types/events';
 export type { PositionData, DynamicContentEvent, MergeTagClickEvent, MergeTag, BaseDynamicContent, TooltipOptions, TextValueObject, L10n, } from './@types/generic';

package/dist/src/services/templateLibraryApi.d.ts

@@ -3,5 +3,5 @@ export declare const useTemplateLibraryApi: () => {
     getCategories: () => Promise<Category[]>;
     checkTemplateNameAvailability: (value: string) => Promise<boolean>;
     createCategory: (category: string) => Promise<string>;
-    createTemplate: () => Promise<void>;
+    createTemplate: () => Promise<boolean>;
 };

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

@@ -0,0 +1,12 @@
+export declare const AUTOSAVE_STATUS: {
+    readonly IDLE: "idle";
+    readonly SAVING: "saving";
+    readonly SAVED: "saved";
+    readonly ERROR: "error";
+};
+export type AutosaveStatus = typeof AUTOSAVE_STATUS[keyof typeof AUTOSAVE_STATUS];
+export declare const useAutosaveStore: import("pinia").StoreDefinition<"guidoAutosave", {
+    isOn: boolean;
+    lastSavedAt: Date | null;
+    status: AutosaveStatus;
+}, {}, {}>;