@useinsider/guido 2.1.0-beta.786853a → 2.1.0-beta.7d0f92a

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

@@ -1,548 +1,211 @@
 import type { Orientation, Languages, Currency, NumericSeparator, FiltersResponse, Filter, RecommendationProduct } from '@@/Types/recommendation';
-interface StoreState {
-    recommendationCampaignUrls: Record<string, string>;
-    recommendationConfigs: {
-        cardsInRow: number;
-        currencySettings: {
-            name: string;
-            value: string;
-            symbol: string;
-            alignment: string;
-            decimalCount: string;
-            decimalSeparator: NumericSeparator;
-            thousandSeparator: NumericSeparator;
-        };
-        filters: Filter[];
-        id: number;
-        language: string;
-        orientation: Orientation;
-        productIds: string[];
-        recommendedProducts: [];
-        sendProductRequestFlag: false;
-        shuffleProducts: false;
-        strategy: string;
-        textTrimming: boolean;
-        unresponsive: boolean;
-        size: string;
+interface PerBlockConfigs {
+    cardsInRow: number;
+    currencySettings: {
+        name: string;
+        value: string;
+        symbol: string;
+        alignment: string;
+        decimalCount: string;
+        decimalSeparator: NumericSeparator;
+        thousandSeparator: NumericSeparator;
     };
+    filters: Filter[];
+    id: number;
+    language: string;
+    orientation: Orientation;
+    productIds: string[];
+    recommendedProducts: [];
+    sendProductRequestFlag: boolean;
+    shuffleProducts: boolean;
+    strategy: string;
+    textTrimming: boolean;
+    unresponsive: boolean;
+    size: string;
+}
+interface PerBlockState {
+    recommendationConfigs: PerBlockConfigs;
     recommendationProducts: RecommendationProduct[];
+    filterStatus: boolean;
+    filterSelectionDrawerStatus: boolean;
+    filterGroup: number;
+}
+interface StoreState {
+    recommendationCampaignUrls: Record<string, string>;
     activePredictiveAlgorithms: number[];
     languages: Languages;
     currencyList: Currency[];
-    filterStatus: boolean;
-    filterSelectionDrawerStatus: boolean;
     filterList: FiltersResponse;
-    filterGroup: number;
+    blockStates: Record<number, PerBlockState>;
+    currentRecommendationId: number | null;
+    configVersion: number;
 }
 export declare const useRecommendationExtensionStore: import("pinia").StoreDefinition<"guidoRecommendationExtension", StoreState, {
-    hasFilters: (state: {
+    /**
+     * Proxy getter: delegates to blockStates[currentRecommendationId].recommendationConfigs
+     * This allows all existing code that reads `store.recommendationConfigs` to work unchanged.
+     */
+    recommendationConfigs(state: {
         recommendationCampaignUrls: Record<string, string>;
-        recommendationConfigs: {
-            cardsInRow: number;
-            currencySettings: {
-                name: string;
-                value: string;
-                symbol: string;
-                alignment: string;
-                decimalCount: string;
-                decimalSeparator: NumericSeparator;
-                thousandSeparator: NumericSeparator;
-            };
-            filters: {
-                type: string;
-                attribute: string;
-                operatorReplace: string;
-                operator: string;
-                innerGroupOperator: string;
-                outerGroupOperator: string;
-                value: string;
-                filterGroup: number;
-                filterNumber: number;
-                isValid: boolean;
-            }[];
-            id: number;
-            language: string;
-            orientation: Orientation;
-            productIds: string[];
-            recommendedProducts: [];
-            sendProductRequestFlag: false;
-            shuffleProducts: false;
-            strategy: string;
-            textTrimming: boolean;
-            unresponsive: boolean;
-            size: string;
-        };
-        recommendationProducts: {
-            image_url: string;
-            name: string;
-            item_id: string;
-            url: string;
-            in_stock: number;
-            price: {
-                [key: string]: number;
-            };
-            locale: string;
-            product_attributes: {
-                [key: string]: string;
-            };
-            category: string[];
-            discount: {
-                [key: string]: number;
-            };
-            original_price: {
-                [key: string]: number;
-            };
-        }[];
         activePredictiveAlgorithms: number[];
         languages: Languages;
         currencyList: {
             text: string;
             value: string;
         }[];
-        filterStatus: boolean;
-        filterSelectionDrawerStatus: boolean;
         filterList: FiltersResponse;
-        filterGroup: number;
-    } & import("pinia").PiniaCustomStateProperties<StoreState>) => boolean;
-    getFilterGroupCount: (state: {
+        blockStates: Record<number, PerBlockState>;
+        currentRecommendationId: number | null;
+        configVersion: number;
+    } & import("pinia").PiniaCustomStateProperties<StoreState>): PerBlockConfigs;
+    /**
+     * Proxy getter: delegates to blockStates[currentRecommendationId].recommendationProducts
+     */
+    recommendationProducts(state: {
         recommendationCampaignUrls: Record<string, string>;
-        recommendationConfigs: {
-            cardsInRow: number;
-            currencySettings: {
-                name: string;
-                value: string;
-                symbol: string;
-                alignment: string;
-                decimalCount: string;
-                decimalSeparator: NumericSeparator;
-                thousandSeparator: NumericSeparator;
-            };
-            filters: {
-                type: string;
-                attribute: string;
-                operatorReplace: string;
-                operator: string;
-                innerGroupOperator: string;
-                outerGroupOperator: string;
-                value: string;
-                filterGroup: number;
-                filterNumber: number;
-                isValid: boolean;
-            }[];
-            id: number;
-            language: string;
-            orientation: Orientation;
-            productIds: string[];
-            recommendedProducts: [];
-            sendProductRequestFlag: false;
-            shuffleProducts: false;
-            strategy: string;
-            textTrimming: boolean;
-            unresponsive: boolean;
-            size: string;
-        };
-        recommendationProducts: {
-            image_url: string;
-            name: string;
-            item_id: string;
-            url: string;
-            in_stock: number;
-            price: {
-                [key: string]: number;
-            };
-            locale: string;
-            product_attributes: {
-                [key: string]: string;
-            };
-            category: string[];
-            discount: {
-                [key: string]: number;
-            };
-            original_price: {
-                [key: string]: number;
-            };
-        }[];
         activePredictiveAlgorithms: number[];
         languages: Languages;
         currencyList: {
             text: string;
             value: string;
         }[];
-        filterStatus: boolean;
-        filterSelectionDrawerStatus: boolean;
         filterList: FiltersResponse;
-        filterGroup: number;
-    } & import("pinia").PiniaCustomStateProperties<StoreState>) => number;
-    getActivePredictiveAlgorithms: (state: {
+        blockStates: Record<number, PerBlockState>;
+        currentRecommendationId: number | null;
+        configVersion: number;
+    } & import("pinia").PiniaCustomStateProperties<StoreState>): RecommendationProduct[];
+    /**
+     * Proxy getter: delegates to blockStates[currentRecommendationId].filterSelectionDrawerStatus
+     */
+    filterSelectionDrawerStatus(state: {
         recommendationCampaignUrls: Record<string, string>;
-        recommendationConfigs: {
-            cardsInRow: number;
-            currencySettings: {
-                name: string;
-                value: string;
-                symbol: string;
-                alignment: string;
-                decimalCount: string;
-                decimalSeparator: NumericSeparator;
-                thousandSeparator: NumericSeparator;
-            };
-            filters: {
-                type: string;
-                attribute: string;
-                operatorReplace: string;
-                operator: string;
-                innerGroupOperator: string;
-                outerGroupOperator: string;
-                value: string;
-                filterGroup: number;
-                filterNumber: number;
-                isValid: boolean;
-            }[];
-            id: number;
-            language: string;
-            orientation: Orientation;
-            productIds: string[];
-            recommendedProducts: [];
-            sendProductRequestFlag: false;
-            shuffleProducts: false;
-            strategy: string;
-            textTrimming: boolean;
-            unresponsive: boolean;
-            size: string;
-        };
-        recommendationProducts: {
-            image_url: string;
-            name: string;
-            item_id: string;
-            url: string;
-            in_stock: number;
-            price: {
-                [key: string]: number;
-            };
-            locale: string;
-            product_attributes: {
-                [key: string]: string;
-            };
-            category: string[];
-            discount: {
-                [key: string]: number;
-            };
-            original_price: {
-                [key: string]: number;
-            };
-        }[];
         activePredictiveAlgorithms: number[];
         languages: Languages;
         currencyList: {
             text: string;
             value: string;
         }[];
-        filterStatus: boolean;
-        filterSelectionDrawerStatus: boolean;
         filterList: FiltersResponse;
-        filterGroup: number;
-    } & import("pinia").PiniaCustomStateProperties<StoreState>) => {
-        text: string;
-        value: string;
-    }[];
-    getLanguages: (state: {
+        blockStates: Record<number, PerBlockState>;
+        currentRecommendationId: number | null;
+        configVersion: number;
+    } & import("pinia").PiniaCustomStateProperties<StoreState>): boolean;
+    /**
+     * Proxy getter: delegates to blockStates[currentRecommendationId].filterStatus
+     */
+    filterStatus(state: {
         recommendationCampaignUrls: Record<string, string>;
-        recommendationConfigs: {
-            cardsInRow: number;
-            currencySettings: {
-                name: string;
-                value: string;
-                symbol: string;
-                alignment: string;
-                decimalCount: string;
-                decimalSeparator: NumericSeparator;
-                thousandSeparator: NumericSeparator;
-            };
-            filters: {
-                type: string;
-                attribute: string;
-                operatorReplace: string;
-                operator: string;
-                innerGroupOperator: string;
-                outerGroupOperator: string;
-                value: string;
-                filterGroup: number;
-                filterNumber: number;
-                isValid: boolean;
-            }[];
-            id: number;
-            language: string;
-            orientation: Orientation;
-            productIds: string[];
-            recommendedProducts: [];
-            sendProductRequestFlag: false;
-            shuffleProducts: false;
-            strategy: string;
-            textTrimming: boolean;
-            unresponsive: boolean;
-            size: string;
-        };
-        recommendationProducts: {
-            image_url: string;
-            name: string;
-            item_id: string;
-            url: string;
-            in_stock: number;
-            price: {
-                [key: string]: number;
-            };
-            locale: string;
-            product_attributes: {
-                [key: string]: string;
-            };
-            category: string[];
-            discount: {
-                [key: string]: number;
-            };
-            original_price: {
-                [key: string]: number;
-            };
-        }[];
         activePredictiveAlgorithms: number[];
         languages: Languages;
         currencyList: {
             text: string;
             value: string;
         }[];
-        filterStatus: boolean;
-        filterSelectionDrawerStatus: boolean;
         filterList: FiltersResponse;
-        filterGroup: number;
-    } & import("pinia").PiniaCustomStateProperties<StoreState>) => {
-        text: string;
-        value: string;
-    }[];
-    getCurrencySymbolList: (state: {
+        blockStates: Record<number, PerBlockState>;
+        currentRecommendationId: number | null;
+        configVersion: number;
+    } & import("pinia").PiniaCustomStateProperties<StoreState>): boolean;
+    /**
+     * Proxy getter: delegates to blockStates[currentRecommendationId].filterGroup
+     */
+    filterGroup(state: {
         recommendationCampaignUrls: Record<string, string>;
-        recommendationConfigs: {
-            cardsInRow: number;
-            currencySettings: {
-                name: string;
-                value: string;
-                symbol: string;
-                alignment: string;
-                decimalCount: string;
-                decimalSeparator: NumericSeparator;
-                thousandSeparator: NumericSeparator;
-            };
-            filters: {
-                type: string;
-                attribute: string;
-                operatorReplace: string;
-                operator: string;
-                innerGroupOperator: string;
-                outerGroupOperator: string;
-                value: string;
-                filterGroup: number;
-                filterNumber: number;
-                isValid: boolean;
-            }[];
-            id: number;
-            language: string;
-            orientation: Orientation;
-            productIds: string[];
-            recommendedProducts: [];
-            sendProductRequestFlag: false;
-            shuffleProducts: false;
-            strategy: string;
-            textTrimming: boolean;
-            unresponsive: boolean;
-            size: string;
-        };
-        recommendationProducts: {
-            image_url: string;
-            name: string;
-            item_id: string;
-            url: string;
-            in_stock: number;
-            price: {
-                [key: string]: number;
-            };
-            locale: string;
-            product_attributes: {
-                [key: string]: string;
-            };
-            category: string[];
-            discount: {
-                [key: string]: number;
-            };
-            original_price: {
-                [key: string]: number;
-            };
+        activePredictiveAlgorithms: number[];
+        languages: Languages;
+        currencyList: {
+            text: string;
+            value: string;
         }[];
+        filterList: FiltersResponse;
+        blockStates: Record<number, PerBlockState>;
+        currentRecommendationId: number | null;
+        configVersion: number;
+    } & import("pinia").PiniaCustomStateProperties<StoreState>): number;
+    hasFilters(): boolean;
+    getFilterGroupCount(): number;
+    getActivePredictiveAlgorithms: (state: {
+        recommendationCampaignUrls: Record<string, string>;
         activePredictiveAlgorithms: number[];
         languages: Languages;
         currencyList: {
             text: string;
             value: string;
         }[];
-        filterStatus: boolean;
-        filterSelectionDrawerStatus: boolean;
         filterList: FiltersResponse;
-        filterGroup: number;
+        blockStates: Record<number, PerBlockState>;
+        currentRecommendationId: number | null;
+        configVersion: number;
     } & import("pinia").PiniaCustomStateProperties<StoreState>) => {
         text: string;
         value: string;
     }[];
-    getFilterList: (state: {
+    getLanguages: (state: {
         recommendationCampaignUrls: Record<string, string>;
-        recommendationConfigs: {
-            cardsInRow: number;
-            currencySettings: {
-                name: string;
-                value: string;
-                symbol: string;
-                alignment: string;
-                decimalCount: string;
-                decimalSeparator: NumericSeparator;
-                thousandSeparator: NumericSeparator;
-            };
-            filters: {
-                type: string;
-                attribute: string;
-                operatorReplace: string;
-                operator: string;
-                innerGroupOperator: string;
-                outerGroupOperator: string;
-                value: string;
-                filterGroup: number;
-                filterNumber: number;
-                isValid: boolean;
-            }[];
-            id: number;
-            language: string;
-            orientation: Orientation;
-            productIds: string[];
-            recommendedProducts: [];
-            sendProductRequestFlag: false;
-            shuffleProducts: false;
-            strategy: string;
-            textTrimming: boolean;
-            unresponsive: boolean;
-            size: string;
-        };
-        recommendationProducts: {
-            image_url: string;
-            name: string;
-            item_id: string;
-            url: string;
-            in_stock: number;
-            price: {
-                [key: string]: number;
-            };
-            locale: string;
-            product_attributes: {
-                [key: string]: string;
-            };
-            category: string[];
-            discount: {
-                [key: string]: number;
-            };
-            original_price: {
-                [key: string]: number;
-            };
-        }[];
         activePredictiveAlgorithms: number[];
         languages: Languages;
         currencyList: {
             text: string;
             value: string;
         }[];
-        filterStatus: boolean;
-        filterSelectionDrawerStatus: boolean;
         filterList: FiltersResponse;
-        filterGroup: number;
+        blockStates: Record<number, PerBlockState>;
+        currentRecommendationId: number | null;
+        configVersion: number;
     } & import("pinia").PiniaCustomStateProperties<StoreState>) => {
         text: string;
         value: string;
-        type: string;
     }[];
-    getSelectedFilterGroup: (state: {
+    getCurrencySymbolList: (state: {
         recommendationCampaignUrls: Record<string, string>;
-        recommendationConfigs: {
-            cardsInRow: number;
-            currencySettings: {
-                name: string;
-                value: string;
-                symbol: string;
-                alignment: string;
-                decimalCount: string;
-                decimalSeparator: NumericSeparator;
-                thousandSeparator: NumericSeparator;
-            };
-            filters: {
-                type: string;
-                attribute: string;
-                operatorReplace: string;
-                operator: string;
-                innerGroupOperator: string;
-                outerGroupOperator: string;
-                value: string;
-                filterGroup: number;
-                filterNumber: number;
-                isValid: boolean;
-            }[];
-            id: number;
-            language: string;
-            orientation: Orientation;
-            productIds: string[];
-            recommendedProducts: [];
-            sendProductRequestFlag: false;
-            shuffleProducts: false;
-            strategy: string;
-            textTrimming: boolean;
-            unresponsive: boolean;
-            size: string;
-        };
-        recommendationProducts: {
-            image_url: string;
-            name: string;
-            item_id: string;
-            url: string;
-            in_stock: number;
-            price: {
-                [key: string]: number;
-            };
-            locale: string;
-            product_attributes: {
-                [key: string]: string;
-            };
-            category: string[];
-            discount: {
-                [key: string]: number;
-            };
-            original_price: {
-                [key: string]: number;
-            };
-        }[];
         activePredictiveAlgorithms: number[];
         languages: Languages;
         currencyList: {
             text: string;
             value: string;
         }[];
-        filterStatus: boolean;
-        filterSelectionDrawerStatus: boolean;
         filterList: FiltersResponse;
-        filterGroup: number;
-    } & import("pinia").PiniaCustomStateProperties<StoreState>) => (groupId: number) => {
-        type: string;
-        attribute: string;
-        operatorReplace: string;
-        operator: string;
-        innerGroupOperator: string;
-        outerGroupOperator: string;
+        blockStates: Record<number, PerBlockState>;
+        currentRecommendationId: number | null;
+        configVersion: number;
+    } & import("pinia").PiniaCustomStateProperties<StoreState>) => {
+        text: string;
+        value: string;
+    }[];
+    getFilterList(): {
+        text: string;
         value: string;
-        filterGroup: number;
-        filterNumber: number;
-        isValid: boolean;
+        type: string;
     }[];
+    getSelectedFilterGroup(): (groupId: number) => Filter[];
 }, {
+    /**
+     * Sets the currently active block ID.
+     * Creates a new entry in blockStates if one doesn't exist.
+     */
+    setCurrentBlock(id: number): void;
+    /**
+     * Removes a block's state from the store.
+     * Resets currentRecommendationId if it was the deleted block.
+     */
+    removeBlockState(id: number): void;
+    /**
+     * Patches the current block's recommendationConfigs.
+     * Replaces `store.$patch({ recommendationConfigs: { ... } })` pattern.
+     */
+    patchCurrentBlockConfig(updates: Partial<PerBlockConfigs>, options?: {
+        triggerRefetch?: boolean;
+    }): void;
+    /**
+     * Opens the filter selection drawer for the current block.
+     * If no filters exist, initializes with a default empty filter
+     * so the user has a starting point for input.
+     */
+    openFilterDrawer(): void;
+    /**
+     * Closes the filter selection drawer for the current block
+     */
+    closeFilterDrawer(): void;
     fetchRecommendationCreateData(): Promise<void>;
     fetchRecommendationFilters(): Promise<void>;
     addFilterGroup(filterGroup: number): void;

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

@@ -0,0 +1,20 @@
+import type { ElementRenderer } from '../utils';
+/**
+ * Grid element renderer
+ * Each element returns a `<td>` containing a nested table structure:
+ * - Outer `<td>` has padding for column spacing
+ * - Inner `<table class="product-card-segment">` supports background color
+ * - Content is inside the inner table
+ *
+ * This structure allows:
+ * 1. Row-based alignment (all same attributes in one row)
+ * 2. Per-card background color via inner table
+ * 3. Column spacing via outer cell padding
+ */
+export declare const DEFAULT_CELL_PADDING = "0 5px";
+/**
+ * Class name for outer cells in attribute rows
+ * Used by controls to reliably select direct children for spacing adjustments
+ */
+export declare const ATTRIBUTE_CELL_CLASS = "attribute-cell";
+export declare const gridElementRenderer: ElementRenderer;