@useinsider/guido 2.1.0-beta.e2d48fe → 2.1.0-beta.e4c3fa1

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

@@ -1,209 +0,0 @@
-import { ATTR_PRODUCT_IMAGE as h, ATTR_PRODUCT_NAME as C, ATTR_PRODUCT_OLD_PRICE as D, ATTR_PRODUCT_PRICE as b, ATTR_PRODUCT_OMNIBUS_PRICE as P, ATTR_PRODUCT_OMNIBUS_DISCOUNT as U, ATTR_PRODUCT_BUTTON as N } from "../constants.js";
-const E = {
-  TITLE: "You May Also Like!"
-}, I = `
-    <tr>
-        <td class="spacer" style="height: 10px;"></td>
-    </tr>
-`, A = `
-    <tr class="recommendation-product-row">
-        <td>
-            <table width="100%" height="100%" cellpadding="0" cellspacing="0" border="0">
-                {-{-PRODUCTS-}-}
-            </table>
-        </td>
-    </tr>
-`, o = `
-    <td width="{-{-COLUMN_WIDTH-}-}" style="padding: 0 5px;" valign="top" height="100%">
-        <table
-            width="100%"
-            height="100%"
-            cellpadding="0"
-            cellspacing="0"
-            border="0"
-            class="product-card-wrapper">
-            <tr>
-                <td
-                    class="product-attribute-cell"
-                    valign="top">
-                    <table cellpadding="0" cellspacing="0" role="presentation" width="100%">
-                        <tbody>
-                            {-{-PRODUCT_CONTENT-}-}
-                        </tbody>
-                    </table>
-                </td>
-            </tr>
-        </table>
-    </td>
-`, Y = [
-  h,
-  C,
-  D,
-  b,
-  P,
-  U,
-  N
-], S = {
-  [h]: !0,
-  [C]: !0,
-  [b]: !0,
-  [D]: !0,
-  [P]: !1,
-  [U]: !1,
-  [N]: !0
-};
-function M() {
-  return [
-    {
-      name: "Product Name",
-      image_url: "https://email-static.useinsider.com/stripo/modules/email-recommendation-v3/assets/images/image-placeholder.png",
-      price: { USD: 18 },
-      original_price: { USD: 20 },
-      discount: { USD: 2 },
-      url: "https://example.com/product/1",
-      item_id: "1",
-      in_stock: 1,
-      locale: "en",
-      product_attributes: {},
-      category: []
-    },
-    {
-      name: "Belt",
-      image_url: "https://inshoppingcart.com/ins-html/wp-content/uploads/2018/09/belt-2.jpg",
-      price: { TRY: 55 },
-      original_price: { TRY: 65 },
-      discount: { TRY: 10 },
-      url: "https://example.com/product/2",
-      item_id: "2",
-      in_stock: 1,
-      locale: "tr",
-      product_attributes: {},
-      category: []
-    },
-    {
-      name: "Beanie",
-      image_url: "https://inshoppingcart.com/ins-html/wp-content/uploads/2018/08/beanie-with-logo-1.jpg",
-      price: { TRY: 18 },
-      original_price: { TRY: 20 },
-      discount: { TRY: 2 },
-      url: "https://example.com/product/3",
-      item_id: "3",
-      in_stock: 1,
-      locale: "tr",
-      product_attributes: {},
-      category: []
-    },
-    {
-      name: "Album",
-      image_url: "https://inshoppingcart.com/ins-html/wp-content/uploads/2018/12/poster_2_up.jpg",
-      price: { TRY: 15 },
-      original_price: { TRY: 15 },
-      discount: { TRY: 0 },
-      url: "https://example.com/product/4",
-      item_id: "4",
-      in_stock: 1,
-      locale: "tr",
-      product_attributes: {},
-      category: []
-    },
-    {
-      name: "Flying Ninja with a very long product name",
-      image_url: "https://inshoppingcart.com/ins-html/wp-content/uploads/2018/09/belt-2.jpg",
-      price: { TRY: 12 },
-      original_price: { TRY: 15 },
-      discount: { TRY: 3 },
-      url: "https://example.com/product/5",
-      item_id: "5",
-      in_stock: 1,
-      locale: "tr",
-      product_attributes: {},
-      category: []
-    },
-    {
-      name: "Single",
-      image_url: "https://inshoppingcart.com/ins-html/wp-content/uploads/2018/12/poster_2_up.jpg",
-      price: { TRY: 22555 },
-      original_price: { TRY: 33989 },
-      discount: { TRY: 11434 },
-      url: "https://example.com/product/6",
-      item_id: "6",
-      in_stock: 1,
-      locale: "tr",
-      product_attributes: {},
-      category: []
-    }
-  ];
-}
-function f(a, r, e, l = Y) {
-  const s = (100 / r).toFixed(2), p = [];
-  for (let i = 0; i < a.length; i += r)
-    p.push(a.slice(i, i + r));
-  let c = "";
-  return p.forEach((i, w) => {
-    w > 0 && (c += I);
-    let n = "", u = "", d = "", T = "", m = "", _ = "", g = "";
-    i.forEach((t) => {
-      n += o.replace(
-        "{-{-PRODUCT_CONTENT-}-}",
-        e.productImage(t)
-      ), u += o.replace(
-        "{-{-PRODUCT_CONTENT-}-}",
-        e.productName(t)
-      ), d += o.replace(
-        "{-{-PRODUCT_CONTENT-}-}",
-        e.productPrice(t)
-      ), T += o.replace(
-        "{-{-PRODUCT_CONTENT-}-}",
-        e.productOldPrice(t)
-      ), m += o.replace(
-        "{-{-PRODUCT_CONTENT-}-}",
-        e.productOmnibusPrice(t)
-      ), _ += o.replace(
-        "{-{-PRODUCT_CONTENT-}-}",
-        e.productOmnibusDiscount(t)
-      ), g += o.replace(
-        "{-{-PRODUCT_CONTENT-}-}",
-        e.productButton(t)
-      );
-    });
-    const R = {
-      productImage: n,
-      productName: u,
-      productPrice: d,
-      productOldPrice: T,
-      productOmnibusPrice: m,
-      productOmnibusDiscount: _,
-      productButton: g
-    }, y = l.filter((t) => !!R[t]).map((t) => {
-      const O = S[t] ?? !0;
-      return `
-                <tr class="recommendation-attribute-row"
-                    data-attribute-type="${t}"
-                    data-visibility="${O ? "1" : "0"}"${O ? "" : ' style="display: none;"'}>
-                    ${R[t]}
-                </tr>
-            `;
-    }).join("");
-    c += A.replace("{-{-PRODUCTS-}-}", y);
-  }), c.replaceAll("{-{-COLUMN_WIDTH-}-}", `${s}%`);
-}
-function j(a, r, e, l, s = E.TITLE, p) {
-  const c = f(
-    r,
-    e,
-    l,
-    p
-  );
-  return a.replace("{-{-TITLE-}-}", s).replace("{-{-PRODUCT_ROWS-}-}", c);
-}
-export {
-  E as DEFAULTS,
-  Y as DEFAULT_CARD_COMPOSITION,
-  S as DEFAULT_CARD_VISIBILITY,
-  j as generateTemplate,
-  M as getDefaultProducts,
-  f as prepareProductRows,
-  o as productCardWrapper,
-  A as productRow,
-  I as spacer
-};

package/dist/src/extensions/Blocks/Recommendation/control.d.ts

@@ -1,38 +0,0 @@
-import { CommonControl } from '../common-control';
-export declare const CONTROL_BLOCK_ID = "ui-elements-recommendation-block";
-export declare class RecommendationBlockControl extends CommonControl {
-    private store;
-    private storeUnsubscription;
-    private addFilterListener;
-    private addFilterButton;
-    getId(): string;
-    getTemplate(): string;
-    onRender(): Promise<void>;
-    onDestroy(): void;
-    _setFormValues(): void;
-    _initializeSelectItems(): void;
-    _getAlgorithms(): string;
-    _getLanguages(): string;
-    _getCurrency(): string;
-    _getProductLayout(): string;
-    _getFilterStatus(): string;
-    _getShuffleProducts(): string;
-    _onFilterSelectClick(): void;
-    _onDataChange(item: string, value: string | number | string[]): void;
-    /**
-     * Get the current card composition from block data attribute or use default
-     */
-    _getCardComposition(): string[];
-    _regenerateProductRows(): void;
-    /**
-     * Reapply spacing values after product regeneration
-     * This ensures spacing persists when products are regenerated
-     */
-    _reapplySpacing(): void;
-    _debouncedRegenerateProductRows: import("@vueuse/shared").PromisifyFn<() => void>;
-    _onCurrencyConfigChange(item: string, value: string | number): void;
-    _onCurrencyChange(value: string): void;
-    _setProductIdsVisibility(): void;
-    _listenToFormUpdates(): void;
-    _listenStateUpdates(): void;
-}

package/dist/src/extensions/Blocks/Recommendation/controls/nameTextTrimControl.d.ts

@@ -1,16 +0,0 @@
-import { ImmutableHtmlNode } from '@stripoinc/ui-editor-extensions';
-import { CommonControl } from '../../common-control';
-/**
- * Control for enabling/disabling text trimming on product names
- * When enabled, adds a CSS class that applies text-overflow: ellipsis
- */
-export declare class NameTextTrimControl extends CommonControl {
-    getId(): string;
-    getTemplate(): string;
-    onRender(): void;
-    onTemplateNodeUpdated(node: ImmutableHtmlNode): void;
-    _setFormValues(): void;
-    _getCurrentTrimState(): boolean;
-    _onTextTrimChange(enabled: boolean): void;
-    _listenToFormUpdates(): void;
-}

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

@@ -1,16 +0,0 @@
-import type { RecommendationProduct } from '@@/Types/recommendation';
-import { DEFAULTS, getDefaultProducts, DEFAULT_CARD_COMPOSITION, DEFAULT_CARD_VISIBILITY } from './templateUtils';
-declare const blockTemplate = "\n    <td align=\"left\" class=\"ins-recommendation-v3-block-v2 esd-block-recommendation-v3-block es-p20\">\n        <table width=\"100%\" cellpadding=\"0\" cellspacing=\"0\" border=\"0\">\n            <tr>\n                <td align=\"center\">\n                    <table\n                        class=\"container\"\n                        width=\"100%\"\n                        cellpadding=\"0\"\n                        cellspacing=\"0\"\n                        border=\"0\">\n                        <tbody>\n                            <tr>\n                                <td>\n                                    <table\n                                        width=\"100%\"\n                                        cellpadding=\"0\"\n                                        cellspacing=\"0\"\n                                        border=\"0\">\n                                        <tbody>\n                                            <BLOCK_TEXT\n                                                class=\"es-p10t es-p10b es-p20l es-p20r\"\n                                                align=\"center\">\n                                                <p path=\"1\" style=\"font-size: 28px; color: #333333;\">\n                                                    <strong path=\"1,0\">{-{-TITLE-}-}</strong>\n                                                </p>\n                                            </BLOCK_TEXT>\n                                        </tbody>\n                                    </table>\n                                </td>\n                            </tr>\n                            \n    <tr>\n        <td class=\"spacer\" style=\"height: 10px;\"></td>\n    </tr>\n\n                            <tr>\n                                <td>\n                                    <table\n                                        class=\"ins-recommendation-product-container\"\n                                        width=\"100%\"\n                                        cellpadding=\"0\"\n                                        cellspacing=\"0\"\n                                        border=\"0\"\n                                    >\n                                        {-{-PRODUCT_ROWS-}-}\n                                    </table>\n                                </td>\n                            </tr>\n                        </tbody>\n                    </table>\n                </td>\n            </tr>\n        </table>\n    </td>\n";
-export declare function getDefaultTemplate(): string;
-/**
- * Generates a custom template with specified products and layout
- * @param products - Array of products to display
- * @param productsPerRow - Number of products per row
- * @param title - Optional title for the block
- * @param composition - Optional array defining order of card elements
- * @returns Complete HTML template
- */
-export declare function generateBlockTemplate(products: RecommendationProduct[], productsPerRow: number, title?: string, composition?: string[]): string;
-export declare function prepareProductRows(products: RecommendationProduct[], productsPerRow: number, composition?: string[]): string;
-export { DEFAULTS, DEFAULT_CARD_COMPOSITION, DEFAULT_CARD_VISIBILITY, getDefaultProducts, };
-export default blockTemplate;

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

@@ -1,52 +0,0 @@
-import type { 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';
-export interface ElementRenderer {
-    [ATTR_PRODUCT_IMAGE]: (product: RecommendationProduct) => string;
-    [ATTR_PRODUCT_NAME]: (product: RecommendationProduct) => string;
-    [ATTR_PRODUCT_PRICE]: (product: RecommendationProduct) => string;
-    [ATTR_PRODUCT_OLD_PRICE]: (product: RecommendationProduct) => string;
-    [ATTR_PRODUCT_OMNIBUS_PRICE]: (product: RecommendationProduct) => string;
-    [ATTR_PRODUCT_OMNIBUS_DISCOUNT]: (product: RecommendationProduct) => string;
-    [ATTR_PRODUCT_BUTTON]: (product: RecommendationProduct) => string;
-}
-export interface TemplateConfig {
-    spacer: string;
-    blockTemplate: string;
-    productRow: string;
-    productCardWrapper: string;
-    elementRenderer: ElementRenderer;
-}
-export declare const DEFAULTS: {
-    TITLE: string;
-    DESCRIPTION: string;
-};
-export declare const spacer = "\n    <tr>\n        <td class=\"spacer\" style=\"height: 10px;\"></td>\n    </tr>\n";
-export declare const productRow = "\n    <tr class=\"recommendation-product-row\">\n        <td>\n            <table width=\"100%\" height=\"100%\" cellpadding=\"0\" cellspacing=\"0\" border=\"0\">\n                {-{-PRODUCTS-}-}\n            </table>\n        </td>\n    </tr>\n";
-export declare const productCardWrapper = "\n    <td width=\"{-{-COLUMN_WIDTH-}-}\" style=\"padding: 0 5px;\" valign=\"top\" height=\"100%\">\n        <table\n            width=\"100%\"\n            height=\"100%\"\n            cellpadding=\"0\"\n            cellspacing=\"0\"\n            border=\"0\"\n            class=\"product-card-wrapper\">\n            <tr>\n                <td\n                    class=\"product-attribute-cell\"\n                    valign=\"top\">\n                    <table cellpadding=\"0\" cellspacing=\"0\" role=\"presentation\" width=\"100%\">\n                        <tbody>\n                            {-{-PRODUCT_CONTENT-}-}\n                        </tbody>\n                    </table>\n                </td>\n            </tr>\n        </table>\n    </td>\n";
-export declare const DEFAULT_CARD_COMPOSITION: string[];
-/**
- * Default visibility settings for card composition elements
- * Omnibus Price and Omnibus Discount are hidden by default
- */
-export declare const DEFAULT_CARD_VISIBILITY: Record<string, boolean>;
-export declare function getDefaultProducts(): RecommendationProduct[];
-/**
- * Core template generation logic that works with any element renderer
- * @param products - Array of products to display
- * @param productsPerRow - Number of products per row
- * @param elementRenderer - Object with methods to render each product element
- * @param composition - Optional array defining order of card elements
- * @returns HTML string for product rows
- */
-export declare function prepareProductRows(products: RecommendationProduct[], productsPerRow: number, elementRenderer: ElementRenderer, composition?: string[]): string;
-/**
- * Generates complete HTML template with dynamic products and layout
- * @param blockTemplate - The base block template string
- * @param products - Array of products to display
- * @param productsPerRow - Number of products per row
- * @param elementRenderer - Element renderer for generating product HTML
- * @param title - Title for the block
- * @param composition - Optional array defining order of card elements
- * @returns Complete HTML template
- */
-export declare function generateTemplate(blockTemplate: string, products: RecommendationProduct[], productsPerRow: number, elementRenderer: ElementRenderer, title?: string, composition?: string[]): string;