@useinsider/guido 3.2.0-beta.e01b42a → 3.2.0-beta.e0e56ef

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

@@ -7,5 +7,5 @@ export declare const useActionsApi: () => {
     getPreviewData: (options?: CompileEmailOptions) => Promise<CompiledEmailResult>;
     updateTimerInClonedTemplate: () => Promise<string | null>;
     updateHtmlAndCss: (html: string, css: string) => void;
-    editorSave: () => void;
+    editorSave: () => Promise<void>;
 };

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

@@ -17,6 +17,10 @@ export declare const useConfig: () => {
             productType: 60 | 49 | 97;
             messageType: 1 | 2;
             username: string;
+            fallbackFont?: {
+                name: string;
+                family: string;
+            } | undefined;
         };
         template: {
             html: string;
@@ -30,8 +34,37 @@ export declare const useConfig: () => {
                     value: string;
                 } | undefined;
             }[];
+            customFieldAttributes: string[];
             selectedUnsubscribePages: number[];
             forceRecreate: boolean;
+            migration: {
+                recommendationConfigs: {
+                    [x: string]: {
+                        id?: number | undefined;
+                        decimalCount?: string | number | undefined;
+                        productIds?: unknown[] | undefined;
+                        sendProductRequestFlag?: boolean | undefined;
+                        shuffleProducts?: boolean | undefined;
+                        filters?: unknown[] | undefined;
+                        currency?: string | undefined;
+                        currencySettings?: unknown;
+                        language?: string | undefined;
+                        strategy?: string | undefined;
+                        recommendedProducts?: unknown[] | undefined;
+                        cardsInRow?: number | undefined;
+                        mobileRightPadding?: number | undefined;
+                        mobileLeftPadding?: number | undefined;
+                        unresponsive?: boolean | undefined;
+                        orientation?: string | undefined;
+                        textTrimming?: boolean | undefined;
+                        blockType?: string | undefined;
+                        size?: string | number | undefined;
+                        verticalResponsiveness?: boolean | undefined;
+                    } & {
+                        [key: string]: unknown;
+                    };
+                };
+            };
         };
         editor: {
             locale: string;
@@ -56,6 +89,7 @@ export declare const useConfig: () => {
             displayConditions: boolean;
             unsubscribe: boolean;
             modulesDisabled: boolean;
+            liquidSyntax: boolean;
         };
         blocks: {
             excludeDefaults: ("amp-accordion" | "amp-carousel" | "amp-form-controls" | "banner-block" | "button-block" | "html-block" | "image-block" | "menu-block" | "social-block" | "spacer-block" | "text-block" | "timer-block" | "video-block")[];
@@ -108,6 +142,10 @@ export declare const useConfig: () => {
         productType: 60 | 49 | 97;
         messageType: 1 | 2;
         username: string;
+        fallbackFont?: {
+            name: string;
+            family: string;
+        } | undefined;
     } | null>;
     template: import("vue").ComputedRef<{
         html: string;
@@ -121,8 +159,37 @@ export declare const useConfig: () => {
                 value: string;
             } | undefined;
         }[];
+        customFieldAttributes: string[];
         selectedUnsubscribePages: number[];
         forceRecreate: boolean;
+        migration: {
+            recommendationConfigs: {
+                [x: string]: {
+                    id?: number | undefined;
+                    decimalCount?: string | number | undefined;
+                    productIds?: unknown[] | undefined;
+                    sendProductRequestFlag?: boolean | undefined;
+                    shuffleProducts?: boolean | undefined;
+                    filters?: unknown[] | undefined;
+                    currency?: string | undefined;
+                    currencySettings?: unknown;
+                    language?: string | undefined;
+                    strategy?: string | undefined;
+                    recommendedProducts?: unknown[] | undefined;
+                    cardsInRow?: number | undefined;
+                    mobileRightPadding?: number | undefined;
+                    mobileLeftPadding?: number | undefined;
+                    unresponsive?: boolean | undefined;
+                    orientation?: string | undefined;
+                    textTrimming?: boolean | undefined;
+                    blockType?: string | undefined;
+                    size?: string | number | undefined;
+                    verticalResponsiveness?: boolean | undefined;
+                } & {
+                    [key: string]: unknown;
+                };
+            };
+        };
     } | null>;
     editor: import("vue").ComputedRef<{
         locale: string;
@@ -147,6 +214,7 @@ export declare const useConfig: () => {
         displayConditions: boolean;
         unsubscribe: boolean;
         modulesDisabled: boolean;
+        liquidSyntax: boolean;
     } | null>;
     blocks: import("vue").ComputedRef<{
         excludeDefaults: ("amp-accordion" | "amp-carousel" | "amp-form-controls" | "banner-block" | "button-block" | "html-block" | "image-block" | "menu-block" | "social-block" | "spacer-block" | "text-block" | "timer-block" | "video-block")[];

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

@@ -0,0 +1,11 @@
+/**
+ * Injects the hosted FullStory bridge script into the Stripo editor iframe.
+ *
+ * The bridge script's origin is allowlisted via Stripo's
+ * `allowedScriptSourceDomains` in useStripo, so the iframe's CSP permits
+ * the load. The bundled script itself handles reading FS config from the
+ * parent window and booting the FullStory queue stub inside the iframe.
+ */
+export declare const useFullStoryBridge: () => {
+    injectFullStory: () => void;
+};

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

@@ -0,0 +1,4 @@
+export declare const useRibbonOffset: () => {
+    ribbonOffset: import("vue").Ref<number>;
+    getTopPosition: (baseTop: number) => string;
+};

package/dist/src/composables/validators/useLiquidValidator.d.ts

@@ -0,0 +1,3 @@
+export declare const useLiquidValidator: () => {
+    validateLiquidSyntax: (compiledHtml: string) => Promise<boolean>;
+};

package/dist/src/config/compiler/liquidCompilerRules.d.ts

@@ -0,0 +1,2 @@
+import type { CompilerRule } from '@@/Types/html-compiler';
+export declare const liquidCompilerRules: CompilerRule[];

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

@@ -6,7 +6,7 @@
  * @param alignment - Currency alignment from block config: 'before' or 'after'
  * @returns Formatted price string with currency variable in correct position
  */
-export declare function formatPriceVariable(campaignId: string, productIndex: number, attribute: string, alignment: string): string;
+export declare function formatPriceVariable(campaignId: string, productIndex: number, attribute: string, alignment: string, prefix?: string): string;
 /**
  * Transforms recommendation block HTML by replacing product data with
  * template variables.

package/dist/src/config/migrator/index.d.ts

@@ -1 +1,2 @@
-export declare const migrate: (html: string) => Promise<string>;
+import type { LegacyRecommendationConfig } from '@@/Types/config';
+export declare const migrate: (html: string, recommendationConfigs?: Record<string, LegacyRecommendationConfig>) => Promise<string>;

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

@@ -0,0 +1,2 @@
+import { type LegacyVariable, type MappedComposition } from './types';
+export declare function mapComposition(variables: LegacyVariable[] | undefined): MappedComposition;

package/dist/src/config/migrator/recommendation/compositionMapper.test.d.ts

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

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

@@ -0,0 +1,7 @@
+export declare function extractTitleText(block: Element): string;
+/**
+ * Card background lives on either the block (`bgcolor`/`style`) or per-card
+ * cells (`.product-card`). Returns empty string when no background is set —
+ * the caller treats that as "no segment background".
+ */
+export declare function extractCardBgColor(block: Element): string;

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

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

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

@@ -0,0 +1,11 @@
+import type { MappedComposition } from './types';
+import type { RecommendationNodeConfig } from '@@/Extensions/Blocks/Recommendation/types/nodeConfig';
+export declare function buildBlockHtml(params: {
+    nodeConfig: RecommendationNodeConfig;
+    composition: MappedComposition;
+    cardBg: string;
+    titleText: string;
+    extraClasses?: string;
+    legacyId?: string;
+    legacyBgColor?: string;
+}): string;

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

@@ -0,0 +1,15 @@
+import type { LegacyProductConfig } from './types';
+/**
+ * `esd-dev-product-config` is double-HTML-encoded JSON: serialization
+ * escapes once to embed inside the attribute, and Stripo's templating
+ * layer escapes a second time when round-tripping. Returns `null` when
+ * the attribute is missing or unable to be parsed — the caller treats
+ * either case as an abort.
+ */
+export declare function parseLegacyConfig(block: Element): LegacyProductConfig | null;
+/**
+ * Older legacy templates omitted the canonical
+ * `ins-recommendation-v3-campaign-id` attribute but always included the
+ * `ins-recommendation-v3-block-<id>` class — fall back to scraping it.
+ */
+export declare function parseRecommendationId(block: Element): number | null;

package/dist/src/config/migrator/recommendation/parseLegacyConfig.test.d.ts

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

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

@@ -0,0 +1,7 @@
+import type { LegacyProductConfig } from './types';
+import type { CurrencyConfig, RecommendationNodeConfig } from '@@/Extensions/Blocks/Recommendation/types/nodeConfig';
+import type { LegacyRecommendationConfig } from '@@/Types/config';
+/** Defensive against missing/malformed legacy `currencySettings` — defaults are per-field, not whole-object. */
+export declare function mapCurrency(legacy: unknown): CurrencyConfig;
+export type SettingsPartial = Pick<RecommendationNodeConfig, 'recommendationId' | 'strategy' | 'productIds' | 'size' | 'shuffleProducts' | 'language' | 'currency' | 'filters' | 'layout' | 'cardsInRow' | 'mobileCardsInRow' | 'mobileLayoutEnabled' | 'previousMobileCardsInRow' | 'columnSpacing' | 'rowSpacing' | 'mobileColumnSpacing' | 'mobileRowSpacing' | 'omnibusPrice' | 'omnibusDiscount' | 'configVersion'>;
+export declare function mapSettings(recCfg: LegacyRecommendationConfig, parsed: LegacyProductConfig, id: number): SettingsPartial;

package/dist/src/config/migrator/recommendation/settingsMapper.test.d.ts

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

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

@@ -0,0 +1,5 @@
+import type { LegacyButtonTheme, LegacyImageTheme, LegacyTextTheme, MappedButtonStyle, MappedImageStyle, MappedTextStyle } from './types';
+export declare function mapTextTheme(theme: LegacyTextTheme | undefined): MappedTextStyle;
+export declare function mapButtonTheme(theme: LegacyButtonTheme | undefined): MappedButtonStyle;
+export declare function mapImageTheme(theme: LegacyImageTheme | undefined): MappedImageStyle;
+export declare function appendStyle(existing: string | undefined, addition: string | undefined): string;

package/dist/src/config/migrator/recommendation/themeMapper.test.d.ts

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

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

@@ -0,0 +1,205 @@
+/**
+ * Internal types for the legacy Recommendation block migrator.
+ *
+ * The legacy block stores its full state as a JSON blob inside the
+ * `esd-dev-product-config` HTML attribute. These interfaces describe
+ * the subset of that schema we depend on. All fields are optional —
+ * legacy data is heterogeneous and we use defensive optional chaining
+ * everywhere downstream.
+ */
+/** Per-side numeric values used by border / padding theme fields. */
+export interface LegacySides<T = number> {
+    left?: T;
+    right?: T;
+    top?: T;
+    bottom?: T;
+}
+/** Padding shape used for both desktop and mobile in legacy theme. */
+export interface LegacyPaddingViewport {
+    all?: number;
+    top?: number;
+    right?: number;
+    bottom?: number;
+    left?: number;
+}
+/** Padding object covering both desktop and mobile breakpoints. */
+export interface LegacyPadding {
+    desktop?: LegacyPaddingViewport;
+    mobile?: LegacyPaddingViewport;
+}
+/** Border-radius shape — observed in two flavours: shorthand or per-corner. */
+export interface LegacyBorderRadius {
+    /** Single shorthand value (e.g. `radius: 4`). */
+    radius?: number;
+    /** Per-corner: top-left / top-right / bottom-right / bottom-left (in px). */
+    lt?: number;
+    rt?: number;
+    rb?: number;
+    lb?: number;
+}
+/** Theme attached to text-like variables (name, prices, omnibus, custom-attr). */
+export interface LegacyTextTheme {
+    textStyle?: {
+        'font-family'?: string;
+        'font-size'?: string;
+        'font-weight'?: string;
+        'font-style'?: string;
+    };
+    textColor?: {
+        color?: string;
+    };
+    textBackgroundColor?: {
+        color?: string;
+    };
+    textPadding?: LegacyPadding;
+    textLineSpacing?: {
+        lineSpacing?: string;
+        'font-lineSpacing'?: string;
+    };
+    textAlign?: {
+        align?: string;
+    };
+    textTrimming?: boolean;
+}
+/** Theme attached to image variables. */
+export interface LegacyImageTheme {
+    imageSize?: {
+        width?: number;
+        height?: number;
+    };
+}
+/** Theme attached to the button variable. */
+export interface LegacyButtonTheme {
+    buttonStyle?: {
+        'font-family'?: string;
+        'font-size'?: string;
+        'font-weight'?: string;
+        'font-style'?: string;
+    };
+    buttonStretch?: {
+        stretched?: boolean;
+    };
+    buttonInternalPadding?: LegacyPadding;
+    buttonExternalPadding?: LegacyPadding;
+    buttonText?: {
+        text?: string;
+    };
+    buttonColor?: {
+        color?: string;
+    };
+    textButtonColor?: {
+        color?: string;
+    };
+    buttonBorder?: {
+        width?: LegacySides<number>;
+        style?: LegacySides<string>;
+        color?: LegacySides<string>;
+    };
+    buttonBorderRadius?: LegacyBorderRadius;
+    buttonAlign?: {
+        align?: string;
+    };
+}
+/** Block-level theme. */
+export interface LegacyBlockTheme {
+    blockAdapt?: {
+        adapt?: boolean;
+    };
+    blockPadding?: LegacyPadding;
+}
+/** Single composition.variable entry from `esd-dev-product-config`. */
+export interface LegacyVariable {
+    /** e.g. `p_name`, `p_button`, `p_attribute_<ts>`. */
+    variable?: string;
+    /** Marker that distinguishes custom product attributes (`'p_attribute'`). */
+    variableType?: string;
+    /** Selector legacy used to address this element in the HTML. */
+    visibilityAreaSelector?: string;
+    /** Custom-attribute value (e.g. `product_attribute.brand`). */
+    value?: string;
+    /** Whether the element is hidden in the legacy block. */
+    hidden?: boolean;
+    /** Sort order across composition entries (lower = earlier). */
+    positionIdx?: number;
+    /** Element-kind-specific theme bag. */
+    theme?: LegacyTextTheme & LegacyImageTheme & LegacyButtonTheme;
+    /** Custom attribute marker. */
+    custom?: boolean;
+}
+/** Full decoded `esd-dev-product-config` shape. */
+export interface LegacyProductConfig {
+    rowCount?: number;
+    totalCount?: number;
+    orientation?: string;
+    composition?: {
+        variables?: LegacyVariable[];
+    };
+    theme?: LegacyBlockTheme;
+}
+/** Element kind dispatched from a legacy `variable` value. */
+export type ElementKind = 'image' | 'text' | 'button' | 'custom' | 'title';
+/** Mapping output from a single legacy variable. */
+export interface MappedVariable {
+    /** Composition key (`productName`, `customAttr:brand`, …) or `__title__` for titles. */
+    key: string;
+    kind: ElementKind;
+    hidden: boolean;
+    positionIdx: number;
+    /** Original legacy variable (kept for downstream theme mapping). */
+    legacy: LegacyVariable;
+    /** For custom attrs: bare attribute name (e.g. `brand`). */
+    customAttrName?: string;
+    /** For custom attrs: full `product-attr` value (e.g. `product_attribute.brand`). */
+    customAttrValue?: string;
+}
+/** CSS style strings + attributes resolved from a single text-like theme. */
+export interface MappedTextStyle {
+    /** Inline CSS for outer `<td>` (background, padding). */
+    tdStyle: string;
+    /** Inline CSS for inner `<p>` (typography, color, line-height, text-align). */
+    pStyle: string;
+    /** Value for `<td align>` attribute, if any. */
+    align?: string;
+    /** Whether to wrap content in `<strong>`. */
+    wrapBold: boolean;
+    /** Whether to wrap content in `<em>`. */
+    wrapItalic: boolean;
+    /** True if `textTrimming: true` in theme. */
+    textTrimming: boolean;
+}
+/** Resolved button styles. */
+export interface MappedButtonStyle {
+    /** Inline CSS for outer `<td>` (external padding). */
+    tdStyle: string;
+    /** Value for `<td align>`, if any. */
+    align?: string;
+    /** Inline CSS for `<span class="es-button-border">`. */
+    spanStyle: string;
+    /** Inline CSS for `<a class="es-button">`. */
+    aStyle: string;
+    /** Button label text. */
+    text?: string;
+}
+/** Resolved image styles. */
+export interface MappedImageStyle {
+    /** Width in pixels (number form) — applied as both `width=` attr and CSS. */
+    width?: number;
+    /** Height in pixels. */
+    height?: number;
+}
+/** Per-variable mapped style bag, keyed by composition key. */
+export type PerElementStyles = Record<string, MappedTextStyle | MappedButtonStyle | MappedImageStyle | undefined>;
+/** Composition mapper output. */
+export interface MappedComposition {
+    composition: string[];
+    visibility: Record<string, boolean>;
+    customAttributes: string[];
+    /** Mapping of customAttr key → full `product-attr` value. */
+    customAttrValues: Record<string, string>;
+    /** Title variable, if present (for separate title rendering). */
+    titleVariable?: LegacyVariable;
+    /** Resolved styles per composition key. */
+    perElementStyles: PerElementStyles;
+    /** Whether *any* element had `textTrimming: true`. */
+    anyTextTrimming: boolean;
+}

package/dist/src/config/migrator/recommendationMigrator.d.ts

@@ -1 +1,13 @@
-export declare function migrateRecommendation(html: string): string;
+/**
+ * Idempotent: the selector matches only blocks that have
+ * `esd-dev-product-config` AND lack `recommendation-block-v2`, so
+ * re-running on a migrated template is a no-op.
+ */
+import type { LegacyRecommendationConfig } from '@@/Types/config';
+/**
+ * Migrate all legacy Recommendation Blocks in the given HTML string.
+ * @param html              - Full template HTML.
+ * @param recommendationConfigs - Map of campaign-id → legacy config (`Record<string, LegacyRecommendationConfig>`).
+ * @returns Migrated HTML, or the original HTML if no legacy blocks exist.
+ */
+export declare function migrateRecommendation(html: string, recommendationConfigs?: Record<string, LegacyRecommendationConfig>): string;

package/dist/src/config/migrator/recommendationMigrator.test.d.ts

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

package/dist/src/enums/extensions/recommendationBlock.d.ts

@@ -3,6 +3,9 @@ import type { RecommendationFeedItem } from '@@/Types/recommendation';
 export declare const URLS: {
     RECOMMENDATION_API_URL: string;
 };
+export declare const QUERY_PARAMS: {
+    CLIENT_ID: string;
+};
 export declare const RecommendationFeedSourceMaps: RecommendationFeedItem[];
 export declare const PriceAttributes: string[];
 export declare const currencyLocationMaps: TextValueObject[];

package/dist/src/enums/onboarding.d.ts

@@ -3,3 +3,9 @@ export declare const UI_EDITOR_SELECTOR = "ui-editor";
 export declare const CARD_COMPOSITION_TAB_SELECTOR = "button[role=\"tab\"][aria-label=\"Card Composition\"]";
 export declare const SETTINGS_TAB_SELECTOR = "button[role=\"tab\"][aria-label=\"Settings\"]";
 export declare const RIBBON_SELECTOR = ".in-ribbons-wrapper";
+export declare const DYNAMIC_CONTENT_BUTTON_SELECTOR = "#guido__btn-add-dynamic-content";
+export declare const AMP_TOGGLE_BUTTON_SELECTOR = ".guido__amp-toggle-html";
+export declare const AMP_TOGGLE_WRAPPER_SELECTOR = ".in-segments-wrapper";
+export declare const HEADER_SELECTOR = "[data-testid=\"guido-header\"]";
+export declare const POPOVER_LEFT_OFFSET = 158;
+export declare const POPOVER_TOP_GAP = 10;

package/dist/src/enums/unsubscribe.d.ts

@@ -12,6 +12,11 @@ export declare const URLS: {
     UNSUBSCRIBE_URL: string;
     PREFERENCES_URL: string;
 };
+export declare const PRODUCT_TYPE_URL_SEGMENTS: {
+    readonly 60: "email";
+    readonly 49: "journey";
+    readonly 97: "email";
+};
 export declare const INSIDER_ID = "iid";
 export declare const DEFAULT_UNSUBSCRIBE_GROUP: {
     readonly name: "Global Unsubscribe";

package/dist/src/extensions/Blocks/CouponBlock/template.d.ts

@@ -1,3 +1,5 @@
+export declare const COUPON_PLACEHOLDER_DEFAULT = "{@COUPON_CODE}";
+export declare const COUPON_PLACEHOLDER_LIQUID = "{{ins_coupon_code}}";
 declare const migrationTemplate = "\n    <td\n        class=\"coupon-block coupon-block-v2 ins-coupon-code esd-block-text esd-extension-block\"\n        esd-extension-block-id=\"coupon-block\"\n    >\n        <p class=\"ins-title\" contenteditable=\"false\">{@COUPON_CODE}</p>\n    </td>\n";
 export declare function getDefaultTemplate(): string;
 export default migrationTemplate;

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

@@ -63,5 +63,6 @@ export declare enum RecommendationControlId {
     CUSTOM_ATTR_PADDINGS = "recommendation-block-custom-attr-paddings-control",
     CUSTOM_ATTR_SIZE = "recommendation-block-custom-attr-size-control",
     CUSTOM_ATTR_STYLE = "recommendation-block-custom-attr-style-control",
+    CUSTOM_ATTR_TEXT_TRIM = "recommendation-block-custom-attr-text-trim-control",
     SYNC_INFO_MESSAGE = "recommendation-block-sync-info-message"
 }

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, 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, } from './selectors';
+export { BLOCK_ROOT_SELECTOR, CONTAINER_SELECTOR, DESKTOP_CONTAINER_SELECTOR, MOBILE_CONTAINER_SELECTOR, MOBILE_ROW_SELECTOR, 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

@@ -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;
 }