@useinsider/guido 2.0.0-beta.da696d5 → 2.0.0-beta.dbde199

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (111) hide show
  1. package/dist/extensions/Blocks/Items/controls/cardComposition.js +13 -4
  2. package/dist/extensions/Blocks/Recommendation/cardCompositionControl.js +158 -68
  3. package/dist/extensions/Blocks/Recommendation/constants.js +10 -1
  4. package/dist/extensions/Blocks/Recommendation/control.js +91 -61
  5. package/dist/extensions/Blocks/Recommendation/controls/cardBackgroundColorControl.js +68 -0
  6. package/dist/extensions/Blocks/Recommendation/controls/index.js +272 -0
  7. package/dist/extensions/Blocks/Recommendation/controls/nameTextTrimControl.js +74 -0
  8. package/dist/extensions/Blocks/Recommendation/controls/omnibusDiscountTextAfterControl.js +71 -0
  9. package/dist/extensions/Blocks/Recommendation/controls/omnibusDiscountTextBeforeControl.js +71 -0
  10. package/dist/extensions/Blocks/Recommendation/controls/omnibusPriceTextAfterControl.js +71 -0
  11. package/dist/extensions/Blocks/Recommendation/controls/omnibusPriceTextBeforeControl.js +71 -0
  12. package/dist/extensions/Blocks/Recommendation/controls/priceHideControl.js +60 -0
  13. package/dist/extensions/Blocks/Recommendation/controls/priceInlineLayoutControl.js +160 -0
  14. package/dist/extensions/Blocks/Recommendation/controls/spacingControl.js +188 -0
  15. package/dist/extensions/Blocks/Recommendation/extension.js +16 -40
  16. package/dist/extensions/Blocks/Recommendation/settingsPanel.js +124 -71
  17. package/dist/extensions/Blocks/Recommendation/templates/blockTemplate.js +89 -65
  18. package/dist/extensions/Blocks/Recommendation/templates/migrationTemplate.js +56 -19
  19. package/dist/extensions/Blocks/Recommendation/templates/templateUtils.js +74 -45
  20. package/dist/extensions/Blocks/Recommendation/utils/preserveTextStyles.js +25 -0
  21. package/dist/extensions/Blocks/controlFactories.js +70 -70
  22. package/dist/node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js +363 -290
  23. package/dist/package.json.js +1 -1
  24. package/dist/src/extensions/Blocks/Recommendation/cardCompositionControl.d.ts +54 -3
  25. package/dist/src/extensions/Blocks/Recommendation/constants.d.ts +41 -1
  26. package/dist/src/extensions/Blocks/Recommendation/control.d.ts +5 -2
  27. package/dist/src/extensions/Blocks/Recommendation/controls/cardBackgroundColorControl.d.ts +25 -0
  28. package/dist/src/extensions/Blocks/Recommendation/controls/index.d.ts +654 -0
  29. package/dist/src/extensions/Blocks/Recommendation/controls/nameTextTrimControl.d.ts +16 -0
  30. package/dist/src/extensions/Blocks/Recommendation/controls/omnibusDiscountTextAfterControl.d.ts +15 -0
  31. package/dist/src/extensions/Blocks/Recommendation/controls/omnibusDiscountTextBeforeControl.d.ts +15 -0
  32. package/dist/src/extensions/Blocks/Recommendation/controls/omnibusPriceTextAfterControl.d.ts +15 -0
  33. package/dist/src/extensions/Blocks/Recommendation/controls/omnibusPriceTextBeforeControl.d.ts +15 -0
  34. package/dist/src/extensions/Blocks/Recommendation/controls/priceHideControl.d.ts +16 -0
  35. package/dist/src/extensions/Blocks/Recommendation/controls/priceInlineLayoutControl.d.ts +50 -0
  36. package/dist/src/extensions/Blocks/Recommendation/controls/spacingControl.d.ts +60 -0
  37. package/dist/src/extensions/Blocks/Recommendation/templates/blockTemplate.d.ts +3 -3
  38. package/dist/src/extensions/Blocks/Recommendation/templates/migrationTemplate.d.ts +1 -1
  39. package/dist/src/extensions/Blocks/Recommendation/templates/templateUtils.d.ts +15 -7
  40. package/dist/src/extensions/Blocks/Recommendation/utils/preserveTextStyles.d.ts +19 -0
  41. package/dist/static/styles/components/wide-panel.css.js +0 -4
  42. package/dist/static/styles/customEditorStyle.css.js +13 -0
  43. package/package.json +3 -3
  44. package/dist/extensions/Blocks/Recommendation/controls/button/align.js +0 -13
  45. package/dist/extensions/Blocks/Recommendation/controls/button/border.js +0 -13
  46. package/dist/extensions/Blocks/Recommendation/controls/button/borderRadius.js +0 -13
  47. package/dist/extensions/Blocks/Recommendation/controls/button/color.js +0 -13
  48. package/dist/extensions/Blocks/Recommendation/controls/button/fitToContent.js +0 -13
  49. package/dist/extensions/Blocks/Recommendation/controls/button/fontFamily.js +0 -13
  50. package/dist/extensions/Blocks/Recommendation/controls/button/margins.js +0 -13
  51. package/dist/extensions/Blocks/Recommendation/controls/button/paddings.js +0 -13
  52. package/dist/extensions/Blocks/Recommendation/controls/button/text.js +0 -13
  53. package/dist/extensions/Blocks/Recommendation/controls/button/textSize.js +0 -13
  54. package/dist/extensions/Blocks/Recommendation/controls/button/textStyleAndFontColor.js +0 -13
  55. package/dist/extensions/Blocks/Recommendation/controls/image/margins.js +0 -13
  56. package/dist/extensions/Blocks/Recommendation/controls/image/size.js +0 -13
  57. package/dist/extensions/Blocks/Recommendation/controls/name/align.js +0 -13
  58. package/dist/extensions/Blocks/Recommendation/controls/name/background.js +0 -13
  59. package/dist/extensions/Blocks/Recommendation/controls/name/color.js +0 -13
  60. package/dist/extensions/Blocks/Recommendation/controls/name/fontFamily.js +0 -13
  61. package/dist/extensions/Blocks/Recommendation/controls/name/paddings.js +0 -13
  62. package/dist/extensions/Blocks/Recommendation/controls/name/size.js +0 -13
  63. package/dist/extensions/Blocks/Recommendation/controls/name/style.js +0 -13
  64. package/dist/extensions/Blocks/Recommendation/controls/oldPrice/align.js +0 -13
  65. package/dist/extensions/Blocks/Recommendation/controls/oldPrice/background.js +0 -13
  66. package/dist/extensions/Blocks/Recommendation/controls/oldPrice/color.js +0 -13
  67. package/dist/extensions/Blocks/Recommendation/controls/oldPrice/fontFamily.js +0 -13
  68. package/dist/extensions/Blocks/Recommendation/controls/oldPrice/paddings.js +0 -13
  69. package/dist/extensions/Blocks/Recommendation/controls/oldPrice/size.js +0 -13
  70. package/dist/extensions/Blocks/Recommendation/controls/oldPrice/style.js +0 -13
  71. package/dist/extensions/Blocks/Recommendation/controls/price/align.js +0 -13
  72. package/dist/extensions/Blocks/Recommendation/controls/price/background.js +0 -13
  73. package/dist/extensions/Blocks/Recommendation/controls/price/color.js +0 -13
  74. package/dist/extensions/Blocks/Recommendation/controls/price/fontFamily.js +0 -13
  75. package/dist/extensions/Blocks/Recommendation/controls/price/paddings.js +0 -13
  76. package/dist/extensions/Blocks/Recommendation/controls/price/size.js +0 -13
  77. package/dist/extensions/Blocks/Recommendation/controls/price/style.js +0 -13
  78. package/dist/src/extensions/Blocks/Recommendation/controls/button/align.d.ts +0 -5
  79. package/dist/src/extensions/Blocks/Recommendation/controls/button/border.d.ts +0 -5
  80. package/dist/src/extensions/Blocks/Recommendation/controls/button/borderRadius.d.ts +0 -5
  81. package/dist/src/extensions/Blocks/Recommendation/controls/button/color.d.ts +0 -5
  82. package/dist/src/extensions/Blocks/Recommendation/controls/button/fitToContent.d.ts +0 -5
  83. package/dist/src/extensions/Blocks/Recommendation/controls/button/fontFamily.d.ts +0 -5
  84. package/dist/src/extensions/Blocks/Recommendation/controls/button/margins.d.ts +0 -5
  85. package/dist/src/extensions/Blocks/Recommendation/controls/button/paddings.d.ts +0 -5
  86. package/dist/src/extensions/Blocks/Recommendation/controls/button/text.d.ts +0 -5
  87. package/dist/src/extensions/Blocks/Recommendation/controls/button/textSize.d.ts +0 -5
  88. package/dist/src/extensions/Blocks/Recommendation/controls/button/textStyleAndFontColor.d.ts +0 -5
  89. package/dist/src/extensions/Blocks/Recommendation/controls/image/margins.d.ts +0 -5
  90. package/dist/src/extensions/Blocks/Recommendation/controls/image/size.d.ts +0 -5
  91. package/dist/src/extensions/Blocks/Recommendation/controls/name/align.d.ts +0 -5
  92. package/dist/src/extensions/Blocks/Recommendation/controls/name/background.d.ts +0 -5
  93. package/dist/src/extensions/Blocks/Recommendation/controls/name/color.d.ts +0 -5
  94. package/dist/src/extensions/Blocks/Recommendation/controls/name/fontFamily.d.ts +0 -5
  95. package/dist/src/extensions/Blocks/Recommendation/controls/name/paddings.d.ts +0 -5
  96. package/dist/src/extensions/Blocks/Recommendation/controls/name/size.d.ts +0 -5
  97. package/dist/src/extensions/Blocks/Recommendation/controls/name/style.d.ts +0 -5
  98. package/dist/src/extensions/Blocks/Recommendation/controls/oldPrice/align.d.ts +0 -5
  99. package/dist/src/extensions/Blocks/Recommendation/controls/oldPrice/background.d.ts +0 -5
  100. package/dist/src/extensions/Blocks/Recommendation/controls/oldPrice/color.d.ts +0 -5
  101. package/dist/src/extensions/Blocks/Recommendation/controls/oldPrice/fontFamily.d.ts +0 -5
  102. package/dist/src/extensions/Blocks/Recommendation/controls/oldPrice/paddings.d.ts +0 -5
  103. package/dist/src/extensions/Blocks/Recommendation/controls/oldPrice/size.d.ts +0 -5
  104. package/dist/src/extensions/Blocks/Recommendation/controls/oldPrice/style.d.ts +0 -5
  105. package/dist/src/extensions/Blocks/Recommendation/controls/price/align.d.ts +0 -5
  106. package/dist/src/extensions/Blocks/Recommendation/controls/price/background.d.ts +0 -5
  107. package/dist/src/extensions/Blocks/Recommendation/controls/price/color.d.ts +0 -5
  108. package/dist/src/extensions/Blocks/Recommendation/controls/price/fontFamily.d.ts +0 -5
  109. package/dist/src/extensions/Blocks/Recommendation/controls/price/paddings.d.ts +0 -5
  110. package/dist/src/extensions/Blocks/Recommendation/controls/price/size.d.ts +0 -5
  111. package/dist/src/extensions/Blocks/Recommendation/controls/price/style.d.ts +0 -5
@@ -0,0 +1,16 @@
1
+ import { ImmutableHtmlNode } from '@stripoinc/ui-editor-extensions';
2
+ import { CommonControl } from '../../common-control';
3
+ /**
4
+ * Control for enabling/disabling text trimming on product names
5
+ * When enabled, adds a CSS class that applies text-overflow: ellipsis
6
+ */
7
+ export declare class NameTextTrimControl extends CommonControl {
8
+ getId(): string;
9
+ getTemplate(): string;
10
+ onRender(): void;
11
+ onTemplateNodeUpdated(node: ImmutableHtmlNode): void;
12
+ _setFormValues(): void;
13
+ _getCurrentTrimState(): boolean;
14
+ _onTextTrimChange(enabled: boolean): void;
15
+ _listenToFormUpdates(): void;
16
+ }
@@ -0,0 +1,15 @@
1
+ import { ImmutableHtmlNode } from '@stripoinc/ui-editor-extensions';
2
+ import { CommonControl } from '../../common-control';
3
+ /**
4
+ * Control for setting text after Omnibus Discount value
5
+ */
6
+ export declare class OmnibusDiscountTextAfterControl extends CommonControl {
7
+ getId(): string;
8
+ getTemplate(): string;
9
+ onRender(): void;
10
+ onTemplateNodeUpdated(node: ImmutableHtmlNode): void;
11
+ _setFormValues(): void;
12
+ _getCurrentText(): string;
13
+ _onTextChange(newText: string): void;
14
+ _listenToFormUpdates(): void;
15
+ }
@@ -0,0 +1,15 @@
1
+ import { ImmutableHtmlNode } from '@stripoinc/ui-editor-extensions';
2
+ import { CommonControl } from '../../common-control';
3
+ /**
4
+ * Control for setting text before Omnibus Discount value
5
+ */
6
+ export declare class OmnibusDiscountTextBeforeControl extends CommonControl {
7
+ getId(): string;
8
+ getTemplate(): string;
9
+ onRender(): void;
10
+ onTemplateNodeUpdated(node: ImmutableHtmlNode): void;
11
+ _setFormValues(): void;
12
+ _getCurrentText(): string;
13
+ _onTextChange(newText: string): void;
14
+ _listenToFormUpdates(): void;
15
+ }
@@ -0,0 +1,15 @@
1
+ import { ImmutableHtmlNode } from '@stripoinc/ui-editor-extensions';
2
+ import { CommonControl } from '../../common-control';
3
+ /**
4
+ * Control for setting text after Omnibus Price value
5
+ */
6
+ export declare class OmnibusPriceTextAfterControl extends CommonControl {
7
+ getId(): string;
8
+ getTemplate(): string;
9
+ onRender(): void;
10
+ onTemplateNodeUpdated(node: ImmutableHtmlNode): void;
11
+ _setFormValues(): void;
12
+ _getCurrentText(): string;
13
+ _onTextChange(newText: string): void;
14
+ _listenToFormUpdates(): void;
15
+ }
@@ -0,0 +1,15 @@
1
+ import { ImmutableHtmlNode } from '@stripoinc/ui-editor-extensions';
2
+ import { CommonControl } from '../../common-control';
3
+ /**
4
+ * Control for setting text before Omnibus Price value
5
+ */
6
+ export declare class OmnibusPriceTextBeforeControl extends CommonControl {
7
+ getId(): string;
8
+ getTemplate(): string;
9
+ onRender(): void;
10
+ onTemplateNodeUpdated(node: ImmutableHtmlNode): void;
11
+ _setFormValues(): void;
12
+ _getCurrentText(): string;
13
+ _onTextChange(newText: string): void;
14
+ _listenToFormUpdates(): void;
15
+ }
@@ -0,0 +1,16 @@
1
+ import { ImmutableHtmlNode } from '@stripoinc/ui-editor-extensions';
2
+ import { CommonControl } from '../../common-control';
3
+ /**
4
+ * Control for hiding the price when it's the same as the discounted price
5
+ * When enabled, adds an attribute hide-price="true" to the recommendation block container
6
+ */
7
+ export declare class PriceHideControl extends CommonControl {
8
+ getId(): string;
9
+ getTemplate(): string;
10
+ onRender(): void;
11
+ onTemplateNodeUpdated(node: ImmutableHtmlNode): void;
12
+ _setFormValues(): void;
13
+ _getCurrentHideState(): boolean;
14
+ _onHidePriceChange(enabled: boolean): void;
15
+ _listenToFormUpdates(): void;
16
+ }
@@ -0,0 +1,50 @@
1
+ import { ImmutableHtmlNode } from '@stripoinc/ui-editor-extensions';
2
+ import { CommonControl } from '../../common-control';
3
+ import { RecommendationControlId } from '../constants';
4
+ export declare const PRICE_INLINE_LAYOUT_CONTROL_ID = RecommendationControlId.PRICE_INLINE_LAYOUT;
5
+ /**
6
+ * Price Inline Layout Control
7
+ *
8
+ * Provides a toggle to switch between inline and separate row layouts for Price and Old Price.
9
+ * - Toggle OFF (default): Price and Old Price in separate rows
10
+ * - Toggle ON: Price and Old Price side by side in the same row (inline)
11
+ *
12
+ * Uses DOM manipulation (not regeneration) to restructure the existing elements,
13
+ * preserving all styles and content.
14
+ */
15
+ export declare class PriceInlineLayoutControl extends CommonControl {
16
+ getId(): string;
17
+ getTemplate(): string;
18
+ onRender(): void;
19
+ onTemplateNodeUpdated(node: ImmutableHtmlNode): void;
20
+ /**
21
+ * Reads the current price inline state from the block's data attribute
22
+ * and updates the toggle UI
23
+ * Note: Toggle ON = separate rows (next line), Toggle OFF = inline (same row)
24
+ */
25
+ private _initializePriceInlineState;
26
+ /**
27
+ * Reads the price inline state from the block wrapper's data attribute
28
+ */
29
+ private _readPriceInlineState;
30
+ /**
31
+ * Registers listener for toggle changes
32
+ */
33
+ private _registerValueChangeListener;
34
+ /**
35
+ * Applies the price inline layout by restructuring the DOM
36
+ * When enabling inline: Merges Old Price content into Price row (side by side)
37
+ * When disabling inline: Separates them back into individual rows
38
+ */
39
+ private _applyPriceInlineLayout;
40
+ /**
41
+ * Merges Old Price content into the same row as Price (inline layout)
42
+ * Creates a structure where both prices are side by side in one row
43
+ */
44
+ private _mergeOldPriceIntoPrice;
45
+ /**
46
+ * Separates Old Price from Price row back into individual rows
47
+ * Restores the original separate row structure
48
+ */
49
+ private _separateOldPriceFromPrice;
50
+ }
@@ -0,0 +1,60 @@
1
+ import { ImmutableHtmlNode } from '@stripoinc/ui-editor-extensions';
2
+ import { CommonControl } from '../../common-control';
3
+ export declare const SPACING_CONTROL_ID = "recommendation-spacing-control";
4
+ /**
5
+ * Control for managing spacing between product cards
6
+ * - Column spacing: horizontal gap between cards in the same row
7
+ * - Row spacing: vertical gap between different rows
8
+ */
9
+ export declare class SpacingControl extends CommonControl {
10
+ getId(): string;
11
+ getTemplate(): string;
12
+ onRender(): void;
13
+ onTemplateNodeUpdated(node: ImmutableHtmlNode): void;
14
+ /**
15
+ * Reads spacing values from data attributes or returns defaults
16
+ */
17
+ _setFormValues(): void;
18
+ /**
19
+ * Gets stored column spacing from the first product card wrapper's parent element's padding
20
+ * Reads the actual padding value instead of relying on data attributes
21
+ *
22
+ * The padding is applied as "0 {halfSpacing}px" on the parent TD element,
23
+ * so we need to extract the horizontal padding value and multiply by 2 to get total spacing.
24
+ */
25
+ _getStoredColumnSpacing(): number;
26
+ /**
27
+ * Gets stored row spacing from the first spacer element's height style
28
+ * Reads the actual height value instead of relying on data attributes
29
+ */
30
+ _getStoredRowSpacing(): number;
31
+ /**
32
+ * Handles column spacing changes
33
+ * Applies horizontal padding to all product card wrappers
34
+ */
35
+ _onColumnSpacingChange(spacing: number): void;
36
+ /**
37
+ * Handles row spacing changes
38
+ * Applies height to all spacer elements between product rows
39
+ */
40
+ _onRowSpacingChange(spacing: number): void;
41
+ /**
42
+ * Stores column spacing value in block data attribute
43
+ */
44
+ _storeColumnSpacing(spacing: number): void;
45
+ /**
46
+ * Stores row spacing value in block data attribute
47
+ */
48
+ _storeRowSpacing(spacing: number): void;
49
+ _listenToFormUpdates(): void;
50
+ /**
51
+ * Debounced version of _onColumnSpacingChange
52
+ * Prevents excessive DOM updates when user rapidly adjusts the counter
53
+ */
54
+ _debouncedOnColumnSpacingChange: import("@vueuse/shared").PromisifyFn<(spacing: number) => void>;
55
+ /**
56
+ * Debounced version of _onRowSpacingChange
57
+ * Prevents excessive DOM updates when user rapidly adjusts the counter
58
+ */
59
+ _debouncedOnRowSpacingChange: import("@vueuse/shared").PromisifyFn<(spacing: number) => void>;
60
+ }
@@ -1,6 +1,6 @@
1
1
  import type { RecommendationProduct } from '@@/Types/recommendation';
2
- import { DEFAULTS, getDefaultProducts, DEFAULT_CARD_COMPOSITION } from './templateUtils';
3
- 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: 20px;\"></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";
2
+ import { DEFAULTS, getDefaultProducts, DEFAULT_CARD_COMPOSITION, DEFAULT_CARD_VISIBILITY } from './templateUtils';
3
+ declare const blockTemplate = "\n <td\n align=\"left\"\n class=\"ins-recommendation-v3-block-v2 es-p20\"\n data-price-inline=\"0\">\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";
4
4
  export declare function getDefaultTemplate(): string;
5
5
  /**
6
6
  * Generates a custom template with specified products and layout
@@ -12,5 +12,5 @@ export declare function getDefaultTemplate(): string;
12
12
  */
13
13
  export declare function generateBlockTemplate(products: RecommendationProduct[], productsPerRow: number, title?: string, composition?: string[]): string;
14
14
  export declare function prepareProductRows(products: RecommendationProduct[], productsPerRow: number, composition?: string[]): string;
15
- export { DEFAULTS, DEFAULT_CARD_COMPOSITION, getDefaultProducts, };
15
+ export { DEFAULTS, DEFAULT_CARD_COMPOSITION, DEFAULT_CARD_VISIBILITY, getDefaultProducts, };
16
16
  export default blockTemplate;
@@ -1,6 +1,6 @@
1
1
  import type { RecommendationProduct } from '@@/Types/recommendation';
2
2
  import { DEFAULTS, getDefaultProducts } from './templateUtils';
3
- declare const migrationTemplate = "\n <td\n align=\"left\"\n esd-extension-block-id=\"recommendation-block\"\n esd-handler-name=\"esd-extension-RecommendationBlock\"\n class=\"ins-recommendation-v3-block-v2 esd-block-recommendation-v3-block esd-extension-block es-p20\"\n >\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 <tr>\n {-{-TITLE-}-}\n </tr>\n </tbody>\n </table>\n </td>\n </tr>\n <tr>\n <td class=\"spacer\" style=\"height: 20px;\"></td>\n </tr>\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";
3
+ declare const migrationTemplate = "\n <td\n align=\"left\"\n esd-extension-block-id=\"recommendation-block\"\n esd-handler-name=\"esd-extension-RecommendationBlock\"\n class=\"ins-recommendation-v3-block-v2 es-p20 esd-recommendation-block esd-extension-block esd-container-frame\"\n data-price-inline=\"0\">\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 <tr>\n {-{-TITLE-}-}\n </tr>\n </tbody>\n </table>\n </td>\n </tr>\n <tr>\n <td class=\"spacer\" style=\"height: 20px;\"></td>\n </tr>\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";
4
4
  export declare function getMigrationTemplate(): string;
5
5
  /**
6
6
  * Generates a custom migration template with specified products and layout
@@ -1,10 +1,13 @@
1
1
  import type { RecommendationProduct } from '@@/Types/recommendation';
2
+ 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';
2
3
  export interface ElementRenderer {
3
- productImage: (product: RecommendationProduct) => string;
4
- productName: (product: RecommendationProduct) => string;
5
- productPrice: (product: RecommendationProduct) => string;
6
- productOldPrice: (product: RecommendationProduct) => string;
7
- productButton: (product: RecommendationProduct) => string;
4
+ [ATTR_PRODUCT_IMAGE]: (product: RecommendationProduct) => string;
5
+ [ATTR_PRODUCT_NAME]: (product: RecommendationProduct) => string;
6
+ [ATTR_PRODUCT_PRICE]: (product: RecommendationProduct) => string;
7
+ [ATTR_PRODUCT_OLD_PRICE]: (product: RecommendationProduct) => string;
8
+ [ATTR_PRODUCT_OMNIBUS_PRICE]: (product: RecommendationProduct) => string;
9
+ [ATTR_PRODUCT_OMNIBUS_DISCOUNT]: (product: RecommendationProduct) => string;
10
+ [ATTR_PRODUCT_BUTTON]: (product: RecommendationProduct) => string;
8
11
  }
9
12
  export interface TemplateConfig {
10
13
  spacer: string;
@@ -17,10 +20,15 @@ export declare const DEFAULTS: {
17
20
  TITLE: string;
18
21
  DESCRIPTION: string;
19
22
  };
20
- export declare const spacer = "\n <tr>\n <td class=\"spacer\" style=\"height: 20px;\"></td>\n </tr>\n";
21
- export declare const productRow = "\n <tr>\n <td>\n <table width=\"100%\" height=\"100%\" cellpadding=\"0\" cellspacing=\"0\" border=\"0\">\n {-{-PRODUCTS-}-}\n </table>\n </td>\n </tr>\n";
23
+ export declare const spacer = "\n <tr>\n <td class=\"spacer\" style=\"height: 10px;\"></td>\n </tr>\n";
24
+ 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";
22
25
  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";
23
26
  export declare const DEFAULT_CARD_COMPOSITION: string[];
27
+ /**
28
+ * Default visibility settings for card composition elements
29
+ * Omnibus Price and Omnibus Discount are hidden by default
30
+ */
31
+ export declare const DEFAULT_CARD_VISIBILITY: Record<string, boolean>;
24
32
  export declare function getDefaultProducts(): RecommendationProduct[];
25
33
  /**
26
34
  * Core template generation logic that works with any element renderer
@@ -0,0 +1,19 @@
1
+ /**
2
+ * Utility for preserving text styling when updating innerHTML
3
+ */
4
+ import type { ImmutableHtmlNode } from '@stripoinc/ui-editor-extensions';
5
+ /**
6
+ * Preserves existing style tags when updating text content
7
+ *
8
+ * When users apply text styles (bold, italic, etc.) in Stripo, the editor wraps
9
+ * content in tags like <strong>, <em>, <u>, <s>. This function extracts those
10
+ * style tags from the original HTML and re-applies them to the new text content.
11
+ * @example
12
+ * // Original: <span class="omnibus-text-before"><strong>Lowest price: </strong></span>
13
+ * // After calling preserveTextStyles(element, 'Best price: ')
14
+ * // Result: <strong>Best price: </strong>
15
+ * @param element - The DOM element or ImmutableHtmlNode containing the styled text
16
+ * @param newText - The new text content to insert
17
+ * @returns The new text wrapped in the original style tags
18
+ */
19
+ export declare function preserveTextStyles(element: ImmutableHtmlNode | Element, newText: string): string;
@@ -6,10 +6,6 @@ ue-main-editor-container[panel-position=SETTINGS_BLOCKS] ue-wide-panel {
6
6
  right: calc(100% - calc(var(--ue-spacing-step, 5px) * 3) - 425px);
7
7
  }
8
8
 
9
- ue-main-tabs-panel-component .fixed-panel-header {
10
- display: none;
11
- }
12
-
13
9
  /* Remove with this writing task DT-28355 */
14
10
  ue-description a {
15
11
  display: none;
@@ -23,6 +23,19 @@ const n = `.esd-x,
23
23
  .ins-recommendation-v3-block-v2 .product-attribute-cell ue-node-panel {
24
24
  display: none !important;
25
25
  }
26
+
27
+ /* Apply to the table cell (td) with text-trim-enabled class */
28
+ .text-trim-enabled {
29
+ max-width: 0 !important;
30
+ }
31
+
32
+ .text-trim-enabled p {
33
+ overflow: hidden !important;
34
+ text-overflow: ellipsis !important;
35
+ white-space: nowrap !important;
36
+ margin: 0 !important;
37
+ display: block !important;
38
+ }
26
39
  `;
27
40
  export {
28
41
  n as default
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@useinsider/guido",
3
- "version": "2.0.0-beta.da696d5",
3
+ "version": "2.0.0-beta.dbde199",
4
4
  "description": "Guido is a Vue + TypeScript wrapper for Email Plugin. Easily embed the email editor in your Vue applications.",
5
5
  "main": "./dist/guido.umd.cjs",
6
6
  "module": "./dist/library.js",
@@ -31,7 +31,7 @@
31
31
  "author": "",
32
32
  "license": "ISC",
33
33
  "dependencies": {
34
- "@stripoinc/ui-editor-extensions": "3.3.0",
34
+ "@stripoinc/ui-editor-extensions": "3.5.0",
35
35
  "@useinsider/design-system-vue": "0.14.20",
36
36
  "@vueuse/core": "11.3.0",
37
37
  "lodash-es": "4.17.21",
@@ -85,7 +85,7 @@
85
85
  },
86
86
  "guido": {
87
87
  "stripo": {
88
- "version": "2.47.0"
88
+ "version": "2.52.0"
89
89
  }
90
90
  }
91
91
  }
@@ -1,13 +0,0 @@
1
- import { ButtonAlignBuiltInControl as t } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
2
- import { RecommendationControlId as e, RecommendationBlockId as n } from "../../constants.js";
3
- class c extends t {
4
- getId() {
5
- return e.BUTTON_ALIGN;
6
- }
7
- getTargetNodes(o) {
8
- return o.closest(".ins-recommendation-product-container").querySelectorAll(`[esd-extension-block-id="${n.BUTTON}"]`);
9
- }
10
- }
11
- export {
12
- c as ButtonAlignControl
13
- };
@@ -1,13 +0,0 @@
1
- import { ButtonBorderBuiltInControl as t } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
2
- import { RecommendationControlId as e, RecommendationBlockId as n } from "../../constants.js";
3
- class s extends t {
4
- getId() {
5
- return e.BUTTON_BORDER;
6
- }
7
- getTargetNodes(o) {
8
- return o.closest(".ins-recommendation-product-container").querySelectorAll(`[esd-extension-block-id="${n.BUTTON}"]`);
9
- }
10
- }
11
- export {
12
- s as ButtonBorderControl
13
- };
@@ -1,13 +0,0 @@
1
- import { ButtonBorderRadiusBuiltInControl as t } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
2
- import { RecommendationControlId as e, RecommendationBlockId as n } from "../../constants.js";
3
- class i extends t {
4
- getId() {
5
- return e.BUTTON_BORDER_RADIUS;
6
- }
7
- getTargetNodes(o) {
8
- return o.closest(".ins-recommendation-product-container").querySelectorAll(`[esd-extension-block-id="${n.BUTTON}"]`);
9
- }
10
- }
11
- export {
12
- i as ButtonBorderRadiusControl
13
- };
@@ -1,13 +0,0 @@
1
- import { ButtonColorBuiltInControl as t } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
2
- import { RecommendationControlId as e, RecommendationBlockId as n } from "../../constants.js";
3
- class c extends t {
4
- getId() {
5
- return e.BUTTON_COLOR;
6
- }
7
- getTargetNodes(o) {
8
- return o.closest(".ins-recommendation-product-container").querySelectorAll(`[esd-extension-block-id="${n.BUTTON}"]`);
9
- }
10
- }
11
- export {
12
- c as ButtonColorControl
13
- };
@@ -1,13 +0,0 @@
1
- import { ButtonFitToContainerBuiltInControl as o } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
2
- import { RecommendationControlId as e, RecommendationBlockId as n } from "../../constants.js";
3
- class s extends o {
4
- getId() {
5
- return e.BUTTON_FIT_TO_CONTENT;
6
- }
7
- getTargetNodes(t) {
8
- return t.closest(".ins-recommendation-product-container").querySelectorAll(`[esd-extension-block-id="${n.BUTTON}"]`);
9
- }
10
- }
11
- export {
12
- s as ButtonFitToContentControl
13
- };
@@ -1,13 +0,0 @@
1
- import { ButtonFontFamilyBuiltInControl as o } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
2
- import { RecommendationControlId as e, RecommendationBlockId as n } from "../../constants.js";
3
- class s extends o {
4
- getId() {
5
- return e.BUTTON_FONT_FAMILY;
6
- }
7
- getTargetNodes(t) {
8
- return t.closest(".ins-recommendation-product-container").querySelectorAll(`[esd-extension-block-id="${n.BUTTON}"]`);
9
- }
10
- }
11
- export {
12
- s as ButtonFontFamilyControl
13
- };
@@ -1,13 +0,0 @@
1
- import { ButtonMarginsBuiltInControl as o } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
2
- import { RecommendationControlId as e, RecommendationBlockId as n } from "../../constants.js";
3
- class m extends o {
4
- getId() {
5
- return e.BUTTON_MARGINS;
6
- }
7
- getTargetNodes(t) {
8
- return t.closest(".ins-recommendation-product-container").querySelectorAll(`[esd-extension-block-id="${n.BUTTON}"]`);
9
- }
10
- }
11
- export {
12
- m as ButtonMarginsControl
13
- };
@@ -1,13 +0,0 @@
1
- import { ButtonPaddingsBuiltInControl as o } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
2
- import { RecommendationControlId as e, RecommendationBlockId as n } from "../../constants.js";
3
- class i extends o {
4
- getId() {
5
- return e.BUTTON_PADDINGS;
6
- }
7
- getTargetNodes(t) {
8
- return t.closest(".ins-recommendation-product-container").querySelectorAll(`[esd-extension-block-id="${n.BUTTON}"]`);
9
- }
10
- }
11
- export {
12
- i as ButtonPaddingsControl
13
- };
@@ -1,13 +0,0 @@
1
- import { ButtonTextBuiltInControl as o } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
2
- import { RecommendationControlId as e, RecommendationBlockId as n } from "../../constants.js";
3
- class c extends o {
4
- getId() {
5
- return e.BUTTON_TEXT;
6
- }
7
- getTargetNodes(t) {
8
- return t.closest(".ins-recommendation-product-container").querySelectorAll(`[esd-extension-block-id="${n.BUTTON}"]`);
9
- }
10
- }
11
- export {
12
- c as ButtonTextControl
13
- };
@@ -1,13 +0,0 @@
1
- import { ButtonTextSizeBuiltInControl as e } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
2
- import { RecommendationControlId as o, RecommendationBlockId as n } from "../../constants.js";
3
- class s extends e {
4
- getId() {
5
- return o.BUTTON_TEXT_SIZE;
6
- }
7
- getTargetNodes(t) {
8
- return t.closest(".ins-recommendation-product-container").querySelectorAll(`[esd-extension-block-id="${n.BUTTON}"]`);
9
- }
10
- }
11
- export {
12
- s as ButtonTextSizeControl
13
- };
@@ -1,13 +0,0 @@
1
- import { ButtonTextStyleAndFontColorBuiltInControl as o } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
2
- import { RecommendationControlId as e, RecommendationBlockId as n } from "../../constants.js";
3
- class s extends o {
4
- getId() {
5
- return e.BUTTON_TEXT_STYLE_AND_FONT_COLOR;
6
- }
7
- getTargetNodes(t) {
8
- return t.closest(".ins-recommendation-product-container").querySelectorAll(`[esd-extension-block-id="${n.BUTTON}"]`);
9
- }
10
- }
11
- export {
12
- s as ButtonTextStyleAndFontColorControl
13
- };
@@ -1,13 +0,0 @@
1
- import { ImageMarginsBuiltInControl as o } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
2
- import { RecommendationControlId as t, RecommendationBlockId as n } from "../../constants.js";
3
- class l extends o {
4
- getId() {
5
- return t.IMAGE_MARGINS;
6
- }
7
- getTargetNodes(e) {
8
- return e.closest(".ins-recommendation-product-container").querySelectorAll(`[esd-extension-block-id="${n.IMAGE}"]`);
9
- }
10
- }
11
- export {
12
- l as ImageMarginsControl
13
- };
@@ -1,13 +0,0 @@
1
- import { ImageSizeBuiltInControl as o } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
2
- import { RecommendationControlId as t, RecommendationBlockId as n } from "../../constants.js";
3
- class s extends o {
4
- getId() {
5
- return t.IMAGE_SIZE;
6
- }
7
- getTargetNodes(e) {
8
- return e.closest(".ins-recommendation-product-container").querySelectorAll(`[esd-extension-block-id="${n.IMAGE}"]`);
9
- }
10
- }
11
- export {
12
- s as ImageSizeControl
13
- };
@@ -1,13 +0,0 @@
1
- import { TextAlignBuiltInControl as o } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
2
- import { RecommendationControlId as t, RecommendationBlockId as n } from "../../constants.js";
3
- class m extends o {
4
- getId() {
5
- return t.NAME_ALIGN;
6
- }
7
- getTargetNodes(e) {
8
- return e.closest(".ins-recommendation-product-container").querySelectorAll(`[esd-extension-block-id="${n.NAME}"]`);
9
- }
10
- }
11
- export {
12
- m as NameAlignControl
13
- };
@@ -1,13 +0,0 @@
1
- import { TextBlockBackgroundBuiltInControl as e } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
2
- import { RecommendationControlId as t, RecommendationBlockId as r } from "../../constants.js";
3
- class m extends e {
4
- getId() {
5
- return t.NAME_BACKGROUND;
6
- }
7
- getTargetNodes(o) {
8
- return o.closest(".ins-recommendation-product-container").querySelectorAll(`[esd-extension-block-id="${r.NAME}"]`);
9
- }
10
- }
11
- export {
12
- m as NameBackgroundControl
13
- };
@@ -1,13 +0,0 @@
1
- import { TextColorBuiltInControl as e } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
2
- import { RecommendationControlId as t, RecommendationBlockId as r } from "../../constants.js";
3
- class m extends e {
4
- getId() {
5
- return t.NAME_COLOR;
6
- }
7
- getTargetNodes(o) {
8
- return o.closest(".ins-recommendation-product-container").querySelectorAll(`[esd-extension-block-id="${r.NAME}"]`);
9
- }
10
- }
11
- export {
12
- m as NameColorControl
13
- };
@@ -1,13 +0,0 @@
1
- import { TextFontFamilyBuiltInControl as e } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
2
- import { RecommendationControlId as t, RecommendationBlockId as n } from "../../constants.js";
3
- class d extends e {
4
- getId() {
5
- return t.NAME_FONT_FAMILY;
6
- }
7
- getTargetNodes(o) {
8
- return o.closest(".ins-recommendation-product-container").querySelectorAll(`[esd-extension-block-id="${n.NAME}"]`);
9
- }
10
- }
11
- export {
12
- d as NameFontFamilyControl
13
- };