@useinsider/guido 2.1.0-beta.9ba2e9d → 2.1.0-beta.a67f307

package/dist/services/recommendationApi.js

@@ -1,7 +1,7 @@
-import { useHttp as a } from "../composables/useHttp.js";
-import { URLS as s } from "../enums/extensions/recommendationBlock.js";
-const u = () => {
-  const { get: o } = a();
+import { useHttp as c } from "../composables/useHttp.js";
+import { URLS as m } from "../enums/extensions/recommendationBlock.js";
+const f = () => {
+  const { get: o } = c();
   return {
     fetchRecommendationCreateData: async () => {
       try {
@@ -18,13 +18,15 @@ const u = () => {
         throw console.error("fetchRecommendationFilters error:", e), e;
       }
     },
-    fetchRecommendationProducts: async (e, c) => {
+    fetchRecommendationProducts: async (e, a) => {
       var n;
       try {
-        const t = decodeURIComponent(new URLSearchParams(Object.entries(c)).toString());
+        const t = decodeURIComponent(new URLSearchParams(Object.entries(a)).toString());
         console.debug("🏁 Recommendation API Query:", t);
-        const r = await o(
-          `${s.RECOMMENDATION_API_URL}/v2/${e}?${t}`
+        const { get: s } = c({
+          headers: {}
+        }), r = await s(
+          `${m.RECOMMENDATION_API_URL}/v2/${e}?${t}`
         );
         return ((n = r == null ? void 0 : r.data) == null ? void 0 : n.data) ?? [];
       } catch (t) {
@@ -34,5 +36,5 @@ const u = () => {
   };
 };
 export {
-  u as useRecommendationApi
+  f as useRecommendationApi
 };

package/dist/src/@types/config/schemas.d.ts

@@ -129,6 +129,10 @@ export declare const EditorSchema: v.ObjectSchema<{
         readonly senderName: "";
         readonly subject: "";
     }>;
+    /** Folder name for user-saved modules (used by Stripo plugin panel for path construction) */
+    readonly savedModulesFolderName: v.OptionalSchema<v.StringSchema<undefined>, "savedModules">;
+    /** Folder name for default/prebuilt modules (used by Stripo plugin panel for path construction) */
+    readonly defaultModulesFolderName: v.OptionalSchema<v.StringSchema<undefined>, "defaultModules">;
 }, undefined>;
 /**
  * UI configuration - visual elements and layout
@@ -441,6 +445,10 @@ export declare const GuidoConfigSchema: v.ObjectSchema<{
             readonly senderName: "";
             readonly subject: "";
         }>;
+        /** Folder name for user-saved modules (used by Stripo plugin panel for path construction) */
+        readonly savedModulesFolderName: v.OptionalSchema<v.StringSchema<undefined>, "savedModules">;
+        /** Folder name for default/prebuilt modules (used by Stripo plugin panel for path construction) */
+        readonly defaultModulesFolderName: v.OptionalSchema<v.StringSchema<undefined>, "defaultModules">;
     }, undefined>, {}>;
     /** UI configuration */
     readonly ui: v.OptionalSchema<v.ObjectSchema<{

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

@@ -41,6 +41,8 @@ export declare const useConfig: () => {
                 senderName: string;
                 subject: string;
             };
+            savedModulesFolderName: string;
+            defaultModulesFolderName: string;
         };
         ui: {
             showHeader: boolean;
@@ -130,6 +132,8 @@ export declare const useConfig: () => {
             senderName: string;
             subject: string;
         };
+        savedModulesFolderName: string;
+        defaultModulesFolderName: string;
     } | null>;
     ui: import("vue").ComputedRef<{
         showHeader: boolean;

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

@@ -9,7 +9,7 @@
 export declare function formatPriceVariable(campaignId: string, productIndex: number, attribute: string, alignment: string): string;
 /**
  * Transforms recommendation block HTML by replacing product data with
- * template variables and adding conditional wrappers.
+ * template variables.
  * Preserves the full document structure (DOCTYPE, html, head, body).
  * @param html - The raw template HTML
  * @returns HTML with template variables replacing product data

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

@@ -9,3 +9,7 @@ export declare const TemplateTypes: {
 export declare const EditorType: number;
 export declare const MAX_DEFAULT_TEMPLATE_ID = 13;
 export declare const ProductIds: Record<string, number>;
+export declare const ModuleFolderDefaults: {
+    readonly SAVED_MODULES: "savedModules";
+    readonly DEFAULT_MODULES: "defaultModules";
+};

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

@@ -8,6 +8,6 @@
  */
 export { RecommendationBlockId } from './blockIds';
 export { RecommendationControlId } from './controlIds';
-export { CONTAINER_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, } from './selectors';
-export { LAYOUT_VALUES, LAYOUT_OPTIONS, DEFAULT_PRODUCTS_PER_ROW, DEFAULT_CARDS_IN_ROW, MAX_PRODUCT_COUNT, MIN_PRODUCT_COUNT, MAX_PRODUCTS_PER_ROW, MIN_PRODUCTS_PER_ROW, DEFAULT_COLUMN_SPACING, DEFAULT_ROW_SPACING, MIN_SPACING, MAX_SPACING, SPACING_STEP, } from './layout';
+export { CONTAINER_SELECTOR, DESKTOP_CONTAINER_SELECTOR, MOBILE_CONTAINER_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, } 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, MIN_SPACING, MAX_SPACING, SPACING_STEP, } from './layout';
 export { DEFAULT_NODE_CONFIG, DEFAULT_CURRENCY, DEFAULT_COMPOSITION, DEFAULT_VISIBILITY, CURRENT_CONFIG_VERSION, } from './defaultConfig';

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

@@ -23,6 +23,12 @@ export declare const MIN_PRODUCT_COUNT = 1;
 export declare const MAX_PRODUCTS_PER_ROW = 4;
 /** Minimum number of products per row in grid layout */
 export declare const MIN_PRODUCTS_PER_ROW = 1;
+/** Default number of products per row on mobile */
+export declare const DEFAULT_MOBILE_CARDS_IN_ROW = 1;
+/** Maximum products per row on mobile */
+export declare const MAX_MOBILE_PRODUCTS_PER_ROW = 2;
+/** Minimum products per row on mobile */
+export declare const MIN_MOBILE_PRODUCTS_PER_ROW = 1;
 /** Default column spacing between product cards (5px on each side = 10px total) */
 export declare const DEFAULT_COLUMN_SPACING = 10;
 /** Default row spacing between product rows */

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

@@ -6,6 +6,10 @@
  * Used across controls to target elements within the recommendation block
  */
 export declare const CONTAINER_SELECTOR = ".ins-recommendation-product-container";
+/** Desktop product container selector */
+export declare const DESKTOP_CONTAINER_SELECTOR = ".ins-recommendation-desktop-container";
+/** Mobile product container selector */
+export declare const MOBILE_CONTAINER_SELECTOR = ".ins-recommendation-mobile-container";
 /**
  * Currency HTML attributes set on the block element
  * These are read by the HTML compiler at runtime to format prices

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

@@ -16,7 +16,6 @@ export * from './utils';
 export declare class RecommendationBlockControl extends CommonControl {
     private store;
     private storeUnsubscription;
-    private initializedBlocks;
     private algorithmControl;
     private localeControl;
     private currencyControl;
@@ -38,6 +37,18 @@ export declare class RecommendationBlockControl extends CommonControl {
      * Each sub-control manages its own form values and event listeners
      */
     _initializeSubControls(): void;
+    /**
+     * Syncs persisted node config into the Pinia store's block state.
+     *
+     * setCurrentBlock() creates a default entry (USD, en_US, mostPopular).
+     * For saved templates, the real config lives in the node (e.g., TRY, tr_TR).
+     * This method reads it and patches the store so fetchRecommendationProducts()
+     * uses the correct values.
+     *
+     * Uses triggerRefetch: false because the fetch hasn't happened yet —
+     * values are being prepared for the upcoming initial fetch.
+     */
+    private _syncNodeConfigToStore;
     /**
      * Fetches initial data for a block (filters, algorithms, products).
      * Shared by onRender() and onTemplateNodeUpdated() to avoid duplication.

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

@@ -3,9 +3,13 @@
  *
  * Handles product display configuration:
  * - Number of products to show
- * - Products per row (hidden for list layout)
+ * - Products per row on desktop (hidden for list layout)
+ * - Products per row on mobile (hidden for list layout)
  * - Triggers product row regeneration on changes
  *
+ * Desktop/mobile counters swap visibility based on editor mode
+ * (detected via Stripo's EditorStatePropertyType.previewDeviceMode).
+ *
  * Configuration is stored via node config (persists with template).
  */
 import type { ImmutableHtmlNode } from '@stripoinc/ui-editor-extensions';
@@ -13,6 +17,7 @@ import { CommonControl } from '../../../common-control';
 export declare const PRODUCT_LAYOUT_CONTROL_ID = "recommendation-product-layout-control";
 /**
  * Control for configuring product count and layout density
+ * Includes both desktop and mobile "products per row" counters
  */
 export declare class ProductLayoutControl extends CommonControl {
     private store;
@@ -24,13 +29,26 @@ export declare class ProductLayoutControl extends CommonControl {
     onDestroy(): void;
     _setFormValues(): void;
     /**
-     * Updates "Products in One Row" visibility based on layout orientation
-     * This control is hidden for list layout (products always take full width)
-     * Reads from node config first, falls back to DOM
+     * Checks if the editor is currently in mobile preview mode
+     * using Stripo's EditorStatePropertyType API.
+     */
+    _isMobileMode(): boolean;
+    /**
+     * Updates counter visibility based on layout orientation and editor mode.
+     * - List layout: hide both counters (products always full-width)
+     * - Grid + desktop mode: show desktop counter, hide mobile counter
+     * - Grid + mobile mode: show mobile counter, hide desktop counter
      */
     _updateProductsInRowVisibility(): void;
+    /**
+     * Subscribes to editor preview mode changes via Stripo API.
+     * When the user switches between desktop/mobile preview, toggles
+     * which "Products in One Row" counter is visible.
+     */
+    _subscribeToEditorModeChanges(): void;
     _onProductCountChange(value: string): void;
     _onProductsInRowChange(value: number): void;
+    _onMobileCardsInRowChange(value: number): void;
     _regenerateProductRows(): void;
     _debouncedRegenerateProductRows: import("@vueuse/shared").PromisifyFn<() => void>;
     _listenToFormUpdates(): void;

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

@@ -58,8 +58,15 @@ export interface RegenerateProductRowsOptions {
     layout?: Orientation;
 }
 /**
- * Regenerates product rows based on current store configuration
- * Reads products, layout, and composition from store/DOM and rebuilds the HTML
+ * Regenerates only the mobile product container rows.
+ * Used when mobile-specific settings change (mobileCardsInRow)
+ * or when the desktop container is regenerated (to keep both in sync).
+ */
+export declare function regenerateMobileProductRows(options: Omit<RegenerateProductRowsOptions, 'afterRegenerate'>): void;
+/**
+ * Regenerates product rows in the desktop container based on current store configuration.
+ * Also regenerates the mobile container to keep both in sync.
+ * Reads products, layout, and composition from store/DOM and rebuilds the HTML.
  * @param options - Configuration options for regeneration
  */
 export declare function regenerateProductRows(options: RegenerateProductRowsOptions): void;

package/dist/src/extensions/Blocks/Recommendation/controls/mobileLayout/cssRules.d.ts

@@ -0,0 +1,29 @@
+/**
+ * CSS rules for mobile grid layout visibility switching
+ *
+ * Follows the modifyCss pattern from textTrim control.
+ * Rules are injected into the document's stylesheet via modifyCss
+ * so they appear in the compiled HTML export.
+ */
+import type { ImmutableCssNode } from '@stripoinc/ui-editor-extensions';
+import { ModificationDescription } from '@stripoinc/ui-editor-extensions';
+/** CSS class for desktop product container */
+export declare const CSS_CLASS_DESKTOP_CONTAINER = "ins-recommendation-desktop-container";
+/** CSS class for mobile product container */
+export declare const CSS_CLASS_MOBILE_CONTAINER = "ins-recommendation-mobile-container";
+interface CssModifierApi {
+    getDocumentRootCssNode: () => ImmutableCssNode | null;
+    getDocumentModifier: () => {
+        modifyCss: (node: ImmutableCssNode) => {
+            appendRule: (rule: string) => void;
+        };
+        apply: (desc: ModificationDescription) => void;
+    };
+}
+/**
+ * Ensures mobile layout CSS rules exist in the document stylesheet.
+ * Only adds rules if they don't already exist (prevents duplicates across multiple blocks).
+ * Follows the same pattern as textTrim's _ensureCssRulesExist().
+ */
+export declare function ensureMobileCssRulesExist(api: CssModifierApi): void;
+export {};

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

@@ -29,6 +29,8 @@ interface PerBlockState {
     filterStatus: boolean;
     filterSelectionDrawerStatus: boolean;
     filterGroup: number;
+    /** Whether initial API data (filters, algorithms, products) has been fetched for this block */
+    isInitialized: boolean;
 }
 interface StoreState {
     recommendationCampaignUrls: Record<string, string>;
@@ -189,6 +191,11 @@ export declare const useRecommendationExtensionStore: import("pinia").StoreDefin
      * Resets currentRecommendationId if it was the deleted block.
      */
     removeBlockState(id: number): void;
+    /**
+     * Marks a block as initialized (initial API data has been fetched).
+     * Automatically cleaned up when removeBlockState deletes the block entry.
+     */
+    markBlockInitialized(id: number): void;
     /**
      * Patches the current block's recommendationConfigs.
      * Replaces `store.$patch({ recommendationConfigs: { ... } })` pattern.

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

@@ -30,4 +30,4 @@ export declare function prepareGridProductRows(products: RecommendationProduct[]
  */
 export declare function prepareProductRows(products: RecommendationProduct[], productsPerRow: number, composition?: string[]): string;
 export declare function getDefaultTemplate(recommendationId?: number): string;
-export declare function generateBlockTemplate(products: RecommendationProduct[], productsPerRow: number, title?: string, composition?: string[]): string;
+export declare function generateBlockTemplate(products: RecommendationProduct[], productsPerRow: number, title?: string, composition?: string[], mobileProductsPerRow?: number): string;

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

@@ -24,12 +24,14 @@ export { DEFAULTS, DEFAULT_CARD_COMPOSITION, DEFAULT_CARD_VISIBILITY, getDefault
 export declare function prepareProductRows(products: RecommendationProduct[], layout: Orientation, options?: PrepareProductRowsOptions): string;
 /**
  * Generates the default template for a given layout.
+ * Includes both desktop and mobile product containers for grid layouts.
  * @param layout - The layout orientation ('list' or 'grid')
  * @returns Complete HTML template with default products
  */
 export declare function getDefaultTemplate(layout?: Orientation): string;
 /**
  * Generates a complete block template with custom products.
+ * Includes both desktop and mobile product containers for grid layouts.
  * @param products - Array of products to display
  * @param layout - The layout orientation ('list' or 'grid')
  * @param title - Title for the block

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

@@ -7,6 +7,8 @@ export type Orientation = 'list' | 'grid';
 export interface PrepareProductRowsOptions {
     /** Number of products per row (only for grid layout, defaults to 3) */
     productsPerRow?: number;
+    /** Number of products per row on mobile (only for grid layout, defaults to 1) */
+    mobileProductsPerRow?: number;
     /** Array defining order of card elements */
     composition?: string[];
 }
@@ -44,14 +46,21 @@ export declare const PLACEHOLDER_IMAGE = "https://email-static.useinsider.com/st
  * @returns Sanitized HTTPS URL or placeholder
  */
 export declare function sanitizeImageUrl(url: string | undefined | null): string;
-export declare function getDefaultProducts(): RecommendationProduct[];
+export declare function getDefaultProducts(count?: number): RecommendationProduct[];
 /**
  * Creates the block template wrapper HTML for recommendation blocks.
- * The template includes title placeholder and product container.
+ * The template includes title placeholder and both desktop/mobile product containers.
+ *
+ * The dual-container approach generates two `ins-recommendation-product-container` tables:
+ * - Desktop container: visible by default, hidden on mobile via CSS media query
+ * - Mobile container: hidden by default (`display: none`), shown on mobile
+ *
+ * Both share the `.ins-recommendation-product-container` class so existing selectors
+ * (spacing, background color, compiler rules) apply automatically to both.
  * @param layout - The layout orientation ('list' or 'grid')
  * @param instanceClass - Optional instance-specific class (e.g., 'ins-recommendation-v3-block-1')
  *   for CSS scoping per block instance. Must be included in the initial template HTML because
  *   Stripo's Angular rendering manages the class attribute and overwrites dynamic setAttribute changes.
- * @returns HTML template string with {-{-TITLE-}-} and {-{-PRODUCT_ROWS-}-} placeholders
+ * @returns HTML template string with {-{-TITLE-}-}, {-{-PRODUCT_ROWS-}-}, and {-{-MOBILE_PRODUCT_ROWS-}-} placeholders
  */
 export declare function createBlockTemplate(layout?: Orientation, instanceClass?: string): string;

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

@@ -92,6 +92,12 @@ export interface RecommendationNodeConfig {
      * Number of products per row (grid layout only)
      */
     cardsInRow: number;
+    /**
+     * Number of products per row on mobile (grid layout only)
+     * Only applicable when layout is 'grid'
+     * @default 1
+     */
+    mobileCardsInRow: number;
     /**
      * Horizontal spacing between product cards in pixels (grid layout only)
      */

package/dist/src/extensions/ModulesTabIcons/extension.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("@stripoinc/ui-editor-extensions").Extension;
+export default _default;

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

@@ -46,6 +46,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -141,6 +143,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -236,6 +240,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -331,6 +337,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -426,6 +434,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -521,6 +531,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -616,6 +628,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -711,6 +725,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -806,6 +822,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -901,6 +919,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -996,6 +1016,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -1091,6 +1113,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -1186,6 +1210,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -1281,6 +1307,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -1376,6 +1404,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -1471,6 +1501,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -1566,6 +1598,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -1661,6 +1695,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;

package/dist/static/styles/components/notification.css.js

@@ -4,6 +4,7 @@ const n = `ue-notifications-container {
     bottom: 32px;
     top: unset;
     width: unset;
+    position: fixed;
 }
 
 ue-notifications-container ue-message + ue-message {

package/dist/static/styles/components/version-history.css.js

@@ -1,4 +1,4 @@
-const o = `.patch-session-container {
+const n = `.patch-session-container {
     row-gap: 16px;
 }
 
@@ -24,7 +24,15 @@ ue-vh-patch.selected .patch-wrapper {
     background-color: var(--guido-color-primary-100);
     box-shadow: 0 0 0 1px var(--guido-color-primary-500);
 }
+
+.change-history-panel-wrapper .control-panel-header {
+    padding: 16px 0 16px 16px;
+}
+
+.change-history-panel-wrapper .header-control-panel-label {
+    grid-area: 1 / 1 / 2 / 12;
+}
 `;
 export {
-  o as default
+  n as default
 };

package/dist/static/styles/components/wide-panel.css.js

@@ -60,7 +60,6 @@ ue-control-panel,
 
 .control-panel-header {
     grid-template-columns: repeat(12, 1fr);
-    padding: 16px 0px 16px 16px;
 }
 
 .control-panel-header > * {
@@ -94,7 +93,9 @@ ue-control-panel,
 .container.droppable-header-container ue-button:last-child {
     margin-right: 0;
 }
-
+.container.droppable-header-container  {
+    margin-top: 13px;
+}
 .secondary-control-group {
     gap: 16px;
 }
@@ -133,6 +134,21 @@ ue-label.accent-dot:after {
     font-size: 13px;
 }
 
+ .e2e-container-video-size {
+    grid-template-columns: 1fr !important;
+ }
+
+ .e2e-container-video-size .control-shadow-wrapper:not(ue-button) {
+    display: flex;
+    width: 100%;
+    justify-content: flex-end;
+    background-color: transparent !important;
+ }
+
+ .e2e-container-video-size .control-shadow-wrapper input {
+    background-color: var(--guido-color-gray-0);
+ }
+
 .e2e-size,
 .e2e-timer-size {
     grid-auto-flow: row;

package/dist/static/styles/customEditorStyle.css.js

@@ -47,17 +47,18 @@ const n = `.esd-x,
     display: none !important;
 }
 
-/* Apply to the table cell (td) with text-trim-enabled class */
-.text-trim-enabled {
-    max-width: 0 !important;
+/* Mobile layout: hide mobile container by default in editor */
+.ins-recommendation-mobile-container {
+    display: none;
 }
 
-.text-trim-enabled p {
-    overflow: hidden !important;
-    text-overflow: ellipsis !important;
-    white-space: nowrap !important;
-    margin: 0 !important;
-    display: block !important;
+/* Mobile layout: when Stripo mobile mode is active, swap containers */
+.ue-mobile-mode .ins-recommendation-desktop-container {
+    display: none !important;
+}
+
+.ue-mobile-mode .ins-recommendation-mobile-container {
+    display: table !important;
 }
 `;
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@useinsider/guido",
-  "version": "2.1.0-beta.9ba2e9d",
+  "version": "2.1.0-beta.a67f307",
   "description": "Guido is a Vue + TypeScript wrapper for Email Plugin. Easily embed the email editor in your Vue applications.",
   "main": "./dist/guido.umd.cjs",
   "module": "./dist/library.js",
@@ -32,7 +32,7 @@
   "license": "ISC",
   "dependencies": {
     "@stripoinc/ui-editor-extensions": "3.5.0",
-    "@useinsider/design-system-vue": "0.14.20",
+    "@useinsider/design-system-vue": "0.14.28",
     "@vueuse/core": "11.3.0",
     "lodash-es": "4.17.21",
     "pinia": "2.3.1",