@useinsider/guido 2.0.0-beta.b46bbf6 → 2.0.0-beta.b889d81

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 (35) hide show
  1. package/dist/composables/useStripo.js +37 -35
  2. package/dist/config/migrator/index.js +8 -9
  3. package/dist/extensions/Blocks/CouponBlock/constants.js +4 -0
  4. package/dist/extensions/Blocks/CouponBlock/controls/index.js +29 -0
  5. package/dist/extensions/Blocks/CouponBlock/extension.js +5 -4
  6. package/dist/extensions/Blocks/CouponBlock/settingsPanel.js +20 -14
  7. package/dist/extensions/Blocks/CouponBlock/template.js +22 -11
  8. package/dist/extensions/Blocks/Items/block.js +40 -39
  9. package/dist/extensions/Blocks/Items/controls/cardComposition.js +49 -46
  10. package/dist/extensions/Blocks/Items/controls/price/priceOrientation.js +26 -28
  11. package/dist/extensions/Blocks/Items/controls/settingsControl.js +127 -132
  12. package/dist/extensions/Blocks/Items/enums/settingsEnums.js +2 -2
  13. package/dist/extensions/Blocks/Items/layouts/horizontal.html.js +48 -58
  14. package/dist/extensions/Blocks/Items/layouts/vertical.html.js +58 -48
  15. package/dist/extensions/Blocks/Items/store/items-block.js +2 -2
  16. package/dist/extensions/Blocks/Items/template.js +123 -296
  17. package/dist/extensions/Blocks/Items/utils/syncAttributesFromConfigBlock.js +20 -11
  18. package/dist/extensions/Blocks/Recommendation/control.js +1 -1
  19. package/dist/extensions/Blocks/common-control.js +53 -64
  20. package/dist/extensions/Blocks/controlFactories.js +122 -111
  21. package/dist/node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js +290 -364
  22. package/dist/package.json.js +7 -0
  23. package/dist/src/extensions/Blocks/CouponBlock/constants.d.ts +14 -0
  24. package/dist/src/extensions/Blocks/CouponBlock/controls/index.d.ts +108 -0
  25. package/dist/src/extensions/Blocks/CouponBlock/template.d.ts +1 -1
  26. package/dist/src/extensions/Blocks/Items/controls/price/priceOrientation.d.ts +1 -1
  27. package/dist/src/extensions/Blocks/Items/controls/settingsControl.d.ts +4 -0
  28. package/dist/src/extensions/Blocks/Items/template.d.ts +1 -20
  29. package/dist/src/extensions/Blocks/common-control.d.ts +8 -13
  30. package/dist/src/extensions/Blocks/controlFactories.d.ts +30 -7
  31. package/package.json +3 -3
  32. package/dist/config/migrator/itemsBlockMigrator.js +0 -283
  33. package/dist/extensions/Blocks/Items/utils/nodeConfigUtils.js +0 -172
  34. package/dist/src/config/migrator/itemsBlockMigrator.d.ts +0 -6
  35. package/dist/src/extensions/Blocks/Items/utils/nodeConfigUtils.d.ts +0 -71
@@ -0,0 +1,7 @@
1
+ const o = { stripo: { version: "2.47.0" } }, s = {
2
+ guido: o
3
+ };
4
+ export {
5
+ s as default,
6
+ o as guido
7
+ };
@@ -0,0 +1,14 @@
1
+ /**
2
+ * Control IDs used in the CouponBlock Extension
3
+ * These IDs are returned by the getId() method of each control
4
+ */
5
+ export declare enum CouponControlId {
6
+ TEXT_ALIGN = "coupon-block-text-align-control",
7
+ TEXT_COLOR = "coupon-block-text-color-control",
8
+ TEXT_SIZE = "coupon-block-text-size-control",
9
+ TEXT_STYLE = "coupon-block-text-style-control",
10
+ TEXT_FONT_FAMILY = "coupon-block-text-font-family-control",
11
+ TEXT_BACKGROUND = "coupon-block-text-background-control",
12
+ TEXT_PADDINGS = "coupon-block-text-paddings-control",
13
+ TEXT_LINE_SPACING = "coupon-block-text-line-spacing-control"
14
+ }
@@ -0,0 +1,108 @@
1
+ /**
2
+ * CouponBlock Control Instances
3
+ *
4
+ * This file generates all control instances for the CouponBlock
5
+ * using the reusable factory functions from controlFactories.ts
6
+ *
7
+ * Note: Factory-generated controls use runtime class generation which TypeScript
8
+ * cannot fully type-check. The controls are type-safe at runtime.
9
+ *
10
+ * These controls apply directly to the selected root element (no targetBlockId/containerSelector)
11
+ * to ensure styles are applied correctly regardless of nested element structure.
12
+ */
13
+ export declare const TextAlignControl: {
14
+ new (): {
15
+ getId(): string;
16
+ getTargetNodes(root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode[];
17
+ getParentControlId(): string;
18
+ api: import("@stripoinc/ui-editor-extensions").ControlApi;
19
+ getLabels(): import("@stripoinc/ui-editor-extensions").ControlLabels | undefined;
20
+ getModificationDescription(): import("@stripoinc/ui-editor-extensions").ModificationDescription | undefined;
21
+ getAdditionalModifications(_root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").TemplateModifier<import("@stripoinc/ui-editor-extensions").HtmlNodeModifier, import("@stripoinc/ui-editor-extensions").CssNodeModifier> | undefined;
22
+ isVisible(_node: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): boolean;
23
+ };
24
+ };
25
+ export declare const TextColorControl: {
26
+ new (): {
27
+ getId(): string;
28
+ getTargetNodes(root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode[];
29
+ getParentControlId(): string;
30
+ api: import("@stripoinc/ui-editor-extensions").ControlApi;
31
+ getLabels(): import("@stripoinc/ui-editor-extensions").ControlLabels | undefined;
32
+ getModificationDescription(): import("@stripoinc/ui-editor-extensions").ModificationDescription | undefined;
33
+ getAdditionalModifications(_root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").TemplateModifier<import("@stripoinc/ui-editor-extensions").HtmlNodeModifier, import("@stripoinc/ui-editor-extensions").CssNodeModifier> | undefined;
34
+ isVisible(_node: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): boolean;
35
+ };
36
+ };
37
+ export declare const TextSizeControl: {
38
+ new (): {
39
+ getId(): string;
40
+ getTargetNodes(root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode[];
41
+ getParentControlId(): string;
42
+ api: import("@stripoinc/ui-editor-extensions").ControlApi;
43
+ getLabels(): import("@stripoinc/ui-editor-extensions").ControlLabels | undefined;
44
+ getModificationDescription(): import("@stripoinc/ui-editor-extensions").ModificationDescription | undefined;
45
+ getAdditionalModifications(_root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").TemplateModifier<import("@stripoinc/ui-editor-extensions").HtmlNodeModifier, import("@stripoinc/ui-editor-extensions").CssNodeModifier> | undefined;
46
+ isVisible(_node: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): boolean;
47
+ };
48
+ };
49
+ export declare const TextStyleControl: {
50
+ new (): {
51
+ getId(): string;
52
+ getTargetNodes(root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode[];
53
+ getParentControlId(): string;
54
+ api: import("@stripoinc/ui-editor-extensions").ControlApi;
55
+ getLabels(): import("@stripoinc/ui-editor-extensions").ControlLabels | undefined;
56
+ getModificationDescription(): import("@stripoinc/ui-editor-extensions").ModificationDescription | undefined;
57
+ getAdditionalModifications(_root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").TemplateModifier<import("@stripoinc/ui-editor-extensions").HtmlNodeModifier, import("@stripoinc/ui-editor-extensions").CssNodeModifier> | undefined;
58
+ isVisible(_node: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): boolean;
59
+ };
60
+ };
61
+ export declare const TextFontFamilyControl: {
62
+ new (): {
63
+ getId(): string;
64
+ getTargetNodes(root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode[];
65
+ getParentControlId(): string;
66
+ api: import("@stripoinc/ui-editor-extensions").ControlApi;
67
+ getLabels(): import("@stripoinc/ui-editor-extensions").ControlLabels | undefined;
68
+ getModificationDescription(): import("@stripoinc/ui-editor-extensions").ModificationDescription | undefined;
69
+ getAdditionalModifications(_root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").TemplateModifier<import("@stripoinc/ui-editor-extensions").HtmlNodeModifier, import("@stripoinc/ui-editor-extensions").CssNodeModifier> | undefined;
70
+ isVisible(_node: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): boolean;
71
+ };
72
+ };
73
+ export declare const TextBackgroundControl: {
74
+ new (): {
75
+ getId(): string;
76
+ getTargetNodes(root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode[];
77
+ getParentControlId(): string;
78
+ api: import("@stripoinc/ui-editor-extensions").ControlApi;
79
+ getLabels(): import("@stripoinc/ui-editor-extensions").ControlLabels | undefined;
80
+ getModificationDescription(): import("@stripoinc/ui-editor-extensions").ModificationDescription | undefined;
81
+ getAdditionalModifications(_root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").TemplateModifier<import("@stripoinc/ui-editor-extensions").HtmlNodeModifier, import("@stripoinc/ui-editor-extensions").CssNodeModifier> | undefined;
82
+ isVisible(_node: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): boolean;
83
+ };
84
+ };
85
+ export declare const TextPaddingsControl: {
86
+ new (): {
87
+ getId(): string;
88
+ getTargetNodes(root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode[];
89
+ getParentControlId(): string;
90
+ api: import("@stripoinc/ui-editor-extensions").ControlApi;
91
+ getLabels(): import("@stripoinc/ui-editor-extensions").ControlLabels | undefined;
92
+ getModificationDescription(): import("@stripoinc/ui-editor-extensions").ModificationDescription | undefined;
93
+ getAdditionalModifications(_root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").TemplateModifier<import("@stripoinc/ui-editor-extensions").HtmlNodeModifier, import("@stripoinc/ui-editor-extensions").CssNodeModifier> | undefined;
94
+ isVisible(_node: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): boolean;
95
+ };
96
+ };
97
+ export declare const TextLineSpacingControl: {
98
+ new (): {
99
+ getId(): string;
100
+ getTargetNodes(root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode[];
101
+ getParentControlId(): string;
102
+ api: import("@stripoinc/ui-editor-extensions").ControlApi;
103
+ getLabels(): import("@stripoinc/ui-editor-extensions").ControlLabels | undefined;
104
+ getModificationDescription(): import("@stripoinc/ui-editor-extensions").ModificationDescription | undefined;
105
+ getAdditionalModifications(_root: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").TemplateModifier<import("@stripoinc/ui-editor-extensions").HtmlNodeModifier, import("@stripoinc/ui-editor-extensions").CssNodeModifier> | undefined;
106
+ isVisible(_node: import("@stripoinc/ui-editor-extensions").ImmutableHtmlNode): boolean;
107
+ };
108
+ };
@@ -1,3 +1,3 @@
1
- declare const migrationTemplate = "\n <td \n class=\"coupon-block coupon-block-v2 ins-coupon-code esd-block-text esd-extension-block\" \n esd-extension-block-id=\"coupon-block\"\n >\n <p class=\"ins-title\" contenteditable=\"false\">{@COUPON_CODE}</p>\n </td>\n";
1
+ declare const migrationTemplate = "\n <td\n class=\"coupon-block coupon-block-v2 ins-coupon-code esd-block-text esd-extension-block\"\n esd-extension-block-id=\"coupon-block\"\n >\n <p class=\"ins-title\" contenteditable=\"false\">{@COUPON_CODE}</p>\n </td>\n";
2
2
  export declare function getDefaultTemplate(): string;
3
3
  export default migrationTemplate;
@@ -9,7 +9,7 @@ export declare class PriceOrientationControl extends CommonControl {
9
9
  onRender(): void;
10
10
  onTemplateNodeUpdated(node: ImmutableHtmlNode): void;
11
11
  _onPriceOrientationChange(value: string): void;
12
- private _updateVerticalLayout;
13
12
  private _updateHorizontalLayout;
13
+ private _updateVerticalLayout;
14
14
  _getPriceOrientation(): string;
15
15
  }
@@ -31,6 +31,10 @@ export declare class ItemsBlockControl extends CommonControl {
31
31
  _updatePrice(price: string): void;
32
32
  _updateOriginalPrice(originalPrice: string): void;
33
33
  _updateQuantity(quantity: string): void;
34
+ /**
35
+ * @todo Optimize template reordering for performance.
36
+ * @description Reorders the template structure based on current orientation and visibility settings.
37
+ */
34
38
  _reOrderTemplate(): void;
35
39
  _updateDataTypeAttributes(itemsType: ProductType): void;
36
40
  _updateDataNumberAttributes(itemId: string): void;
@@ -1,8 +1,6 @@
1
- import type { ItemsBlockConfig } from './utils/nodeConfigUtils';
2
1
  declare const migrationTemplate = "ADD YOUR MIGRATION HERE";
3
2
  type ProductType = 'CART_ITEMS' | 'BROWSED_ITEMS' | 'PURCHASED_ITEMS';
4
3
  type OrientationType = 'vertical' | 'horizontal';
5
- type PriceOrientationType = 'vertical' | 'horizontal';
6
4
  type TemplateParameters = {
7
5
  orientation: OrientationType;
8
6
  itemsType: ProductType;
@@ -10,23 +8,6 @@ type TemplateParameters = {
10
8
  currencySymbol?: string;
11
9
  currencyLocation?: string;
12
10
  formattedPrice?: boolean;
13
- migrate?: boolean;
14
- /** Legacy config format (data-* attributes from esd-config-block) */
15
- configBlockAttributes?: Record<string, string>;
16
- /** New config format (Stripo V2 nodeConfig from esd-ext-config) */
17
- nodeConfig?: Partial<ItemsBlockConfig>;
18
- /** Extracted styles from a[product-attr="name"] for migration */
19
- nameStyles?: string;
20
- /** Extracted styles from a.es-button for migration */
21
- buttonStyles?: string;
22
- /** Extracted styles from p[product-attr="price"] for migration */
23
- priceStyles?: string;
24
- /** Extracted styles from p[product-attr="originalPrice"] for migration */
25
- originalPriceStyles?: string;
26
- /** Extracted styles from p[product-attr="quantity"] for migration */
27
- quantityStyles?: string;
28
- /** Price orientation within the card ('vertical' = stacked, 'horizontal' = side-by-side) */
29
- priceOrientation?: PriceOrientationType;
30
11
  };
31
12
  /**
32
13
  * Generates the default template for the Items Block.
@@ -39,5 +20,5 @@ type TemplateParameters = {
39
20
  * @param params.formattedPrice - Whether to use formatted price display
40
21
  * @returns HTML template string for the Items Block
41
22
  */
42
- export declare function getDefaultTemplate({ orientation, itemsType, itemId, currencySymbol, currencyLocation, migrate, formattedPrice, configBlockAttributes, nodeConfig, nameStyles, buttonStyles, priceStyles, originalPriceStyles, quantityStyles, priceOrientation, }: TemplateParameters): string;
23
+ export declare function getDefaultTemplate({ orientation, itemsType, itemId, currencySymbol, currencyLocation, formattedPrice, }: TemplateParameters): string;
43
24
  export default migrationTemplate;
@@ -56,30 +56,25 @@ export declare abstract class CommonControl extends Control {
56
56
  onTemplateNodeUpdated(node: ImmutableHtmlNode): void;
57
57
  onDestroy(): void;
58
58
  /**
59
- * Gets the Items block container element from the current node.
60
- * @returns The container element or null if not found
61
- */
62
- protected getItemsBlockContainer(): ImmutableHtmlElementNode | null;
63
- /**
64
- * Gets the config block element from the current node (legacy support).
65
- * @deprecated Use getNodeConfig() from nodeConfigUtils instead for Stripo V2
59
+ * Gets the config block element from the current node.
66
60
  * @returns The config block element or null if not found
67
61
  */
68
62
  protected getConfigBlock(): ImmutableHtmlElementNode | null;
69
63
  /**
70
- * Gets the current block instance ID from the node config (Stripo V2) or legacy config block.
64
+ * Gets the current block instance ID from the config block.
65
+ * @param blockInstanceIdAttribute - The attribute name for block instance ID (default: 'data-block-instance-id')
71
66
  * @returns The block instance ID or null if not found
72
67
  */
73
- protected getBlockInstanceId(): string | null;
68
+ protected getBlockInstanceId(blockInstanceIdAttribute?: string): string | null;
74
69
  /**
75
70
  * Handles block instance change detection and syncing.
76
- * This is a helper method for controls that need to sync config when switching between block instances.
77
- * Uses Stripo V2 nodeConfig API for block instance tracking.
78
- * @param syncFunction - Function to call when block instance changes (to sync from node config)
71
+ * This is a helper method for controls that need to sync attributes when switching between block instances.
72
+ * @param syncFunction - Function to call when block instance changes (to sync from attributes)
79
73
  * @param updateUI - Function to call to update the UI (called both on change and when same block)
74
+ * @param blockInstanceIdAttribute - The attribute name for block instance ID (default: 'data-block-instance-id')
80
75
  * @returns true if block instance changed, false otherwise
81
76
  */
82
- protected handleBlockInstanceChange(syncFunction: (node: ImmutableHtmlNode) => void, updateUI: () => void): boolean;
77
+ protected handleBlockInstanceChange(syncFunction: (node: ImmutableHtmlNode) => void, updateUI: () => void, blockInstanceIdAttribute?: string): boolean;
83
78
  _GuLabel({ text, name, position }: LabelProps): string;
84
79
  _GuToggle(name: string): string;
85
80
  _GuSelectItem({ text, value }: {
@@ -12,8 +12,9 @@
12
12
  import { ImmutableHtmlNode } from '@stripoinc/ui-editor-extensions';
13
13
  /**
14
14
  * Factory function to create text align controls for different block elements
15
+ * When targetBlockId and containerSelector are not provided, applies directly to root
15
16
  */
16
- export declare function createTextAlignControl(controlId: string, targetBlockId: string, containerSelector: string): {
17
+ export declare function createTextAlignControl(controlId: string, targetBlockId?: string, containerSelector?: string): {
17
18
  new (): {
18
19
  getId(): string;
19
20
  getTargetNodes(root: ImmutableHtmlNode): ImmutableHtmlNode[];
@@ -27,8 +28,9 @@ export declare function createTextAlignControl(controlId: string, targetBlockId:
27
28
  };
28
29
  /**
29
30
  * Factory function to create text color controls for different block elements
31
+ * When targetBlockId and containerSelector are not provided, applies directly to root
30
32
  */
31
- export declare function createTextColorControl(controlId: string, targetBlockId: string, containerSelector?: string): {
33
+ export declare function createTextColorControl(controlId: string, targetBlockId?: string, containerSelector?: string): {
32
34
  new (): {
33
35
  getId(): string;
34
36
  getTargetNodes(root: ImmutableHtmlNode): ImmutableHtmlNode[];
@@ -42,8 +44,9 @@ export declare function createTextColorControl(controlId: string, targetBlockId:
42
44
  };
43
45
  /**
44
46
  * Factory function to create text size controls for different block elements
47
+ * When targetBlockId and containerSelector are not provided, applies directly to root
45
48
  */
46
- export declare function createTextSizeControl(controlId: string, targetBlockId: string, containerSelector?: string): {
49
+ export declare function createTextSizeControl(controlId: string, targetBlockId?: string, containerSelector?: string): {
47
50
  new (): {
48
51
  getId(): string;
49
52
  getTargetNodes(root: ImmutableHtmlNode): ImmutableHtmlNode[];
@@ -57,8 +60,9 @@ export declare function createTextSizeControl(controlId: string, targetBlockId:
57
60
  };
58
61
  /**
59
62
  * Factory function to create text style controls for different block elements
63
+ * When targetBlockId and containerSelector are not provided, applies directly to root
60
64
  */
61
- export declare function createTextStyleControl(controlId: string, targetBlockId: string, containerSelector?: string): {
65
+ export declare function createTextStyleControl(controlId: string, targetBlockId?: string, containerSelector?: string): {
62
66
  new (): {
63
67
  getId(): string;
64
68
  getTargetNodes(root: ImmutableHtmlNode): ImmutableHtmlNode[];
@@ -72,8 +76,9 @@ export declare function createTextStyleControl(controlId: string, targetBlockId:
72
76
  };
73
77
  /**
74
78
  * Factory function to create text font family controls for different block elements
79
+ * When targetBlockId and containerSelector are not provided, applies directly to root
75
80
  */
76
- export declare function createTextFontFamilyControl(controlId: string, targetBlockId: string, containerSelector?: string): {
81
+ export declare function createTextFontFamilyControl(controlId: string, targetBlockId?: string, containerSelector?: string): {
77
82
  new (): {
78
83
  getId(): string;
79
84
  getTargetNodes(root: ImmutableHtmlNode): ImmutableHtmlNode[];
@@ -87,8 +92,9 @@ export declare function createTextFontFamilyControl(controlId: string, targetBlo
87
92
  };
88
93
  /**
89
94
  * Factory function to create text background color controls for different block elements
95
+ * When targetBlockId and containerSelector are not provided, applies directly to root
90
96
  */
91
- export declare function createTextBackgroundColorControl(controlId: string, targetBlockId: string, containerSelector?: string): {
97
+ export declare function createTextBackgroundColorControl(controlId: string, targetBlockId?: string, containerSelector?: string): {
92
98
  new (): {
93
99
  getId(): string;
94
100
  getTargetNodes(root: ImmutableHtmlNode): ImmutableHtmlNode[];
@@ -102,8 +108,25 @@ export declare function createTextBackgroundColorControl(controlId: string, targ
102
108
  };
103
109
  /**
104
110
  * Factory function to create paddings controls for different block elements
111
+ * When targetBlockId and containerSelector are not provided, applies directly to root
105
112
  */
106
- export declare function createPaddingsControl(controlId: string, targetBlockId: string, containerSelector?: string): {
113
+ export declare function createPaddingsControl(controlId: string, targetBlockId?: string, containerSelector?: string): {
114
+ new (): {
115
+ getId(): string;
116
+ getTargetNodes(root: ImmutableHtmlNode): ImmutableHtmlNode[];
117
+ getParentControlId(): string;
118
+ api: import("@stripoinc/ui-editor-extensions").ControlApi;
119
+ getLabels(): import("@stripoinc/ui-editor-extensions").ControlLabels | undefined;
120
+ getModificationDescription(): import("@stripoinc/ui-editor-extensions").ModificationDescription | undefined;
121
+ getAdditionalModifications(_root: ImmutableHtmlNode): import("@stripoinc/ui-editor-extensions").TemplateModifier<import("@stripoinc/ui-editor-extensions").HtmlNodeModifier, import("@stripoinc/ui-editor-extensions").CssNodeModifier> | undefined;
122
+ isVisible(_node: ImmutableHtmlNode): boolean;
123
+ };
124
+ };
125
+ /**
126
+ * Factory function to create text line spacing controls for different block elements
127
+ * When targetBlockId and containerSelector are not provided, applies directly to root
128
+ */
129
+ export declare function createTextLineSpacingControl(controlId: string, targetBlockId?: string, containerSelector?: string): {
107
130
  new (): {
108
131
  getId(): string;
109
132
  getTargetNodes(root: ImmutableHtmlNode): ImmutableHtmlNode[];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@useinsider/guido",
3
- "version": "2.0.0-beta.b46bbf6",
3
+ "version": "2.0.0-beta.b889d81",
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.5.0",
34
+ "@stripoinc/ui-editor-extensions": "3.3.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.52.0"
88
+ "version": "2.47.0"
89
89
  }
90
90
  }
91
91
  }
@@ -1,283 +0,0 @@
1
- var B = Object.defineProperty;
2
- var q = (o, t, r) => t in o ? B(o, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : o[t] = r;
3
- var A = (o, t, r) => q(o, typeof t != "symbol" ? t + "" : t, r);
4
- import { productPairs as L } from "../../extensions/Blocks/Items/enums/productEnums.js";
5
- import { ItemInCartOptions as I, DefaultConfigValues as m, SETTINGS_ENUMS as l } from "../../extensions/Blocks/Items/enums/settingsEnums.js";
6
- import { getDefaultTemplate as K } from "../../extensions/Blocks/Items/template.js";
7
- const V = {
8
- ins_apr_img: {
9
- pairsKey: "imageSrc",
10
- defaultKey: "DEFAULT",
11
- isArray: !0
12
- },
13
- ins_apr_name: {
14
- pairsKey: "name",
15
- defaultKey: "DEFAULT",
16
- isArray: !0
17
- },
18
- ins_apr_url: {
19
- pairsKey: "button",
20
- defaultKey: "DEFAULT_HREF",
21
- isArray: !1
22
- },
23
- ins_apr_formattedprice: {
24
- pairsKey: "price",
25
- defaultKey: "DEFAULT_PRICE_FORMATTED",
26
- isArray: !1
27
- },
28
- ins_apr_productcurrency: {
29
- pairsKey: "price",
30
- defaultKey: "DEFAULT_CURRENCY",
31
- isArray: !1
32
- },
33
- ins_apr_quantity: {
34
- pairsKey: "quantity",
35
- defaultKey: "DEFAULT",
36
- isArray: !1
37
- },
38
- ins_apr_price: {
39
- pairsKey: "price",
40
- defaultKey: "DEFAULT_PRICE",
41
- isArray: !1
42
- },
43
- ins_apr_originalprice: {
44
- pairsKey: "originalPrice",
45
- defaultKey: "DEFAULT_PRICE",
46
- isArray: !1
47
- },
48
- ins_apr_originalformattedprice: {
49
- pairsKey: "originalPrice",
50
- defaultKey: "DEFAULT_PRICE_FORMATTED",
51
- isArray: !1
52
- }
53
- };
54
- function U() {
55
- return String(Date.now() + Math.floor(Math.random() * 1e3));
56
- }
57
- function F(o) {
58
- return o ? {
59
- CartItems: l.ITEMS_TYPE.CART_ITEMS,
60
- BrowsedItems: l.ITEMS_TYPE.BROWSED_ITEMS,
61
- PurchasedItems: l.ITEMS_TYPE.PURCHASED_ITEMS,
62
- CART_ITEMS: l.ITEMS_TYPE.CART_ITEMS,
63
- BROWSED_ITEMS: l.ITEMS_TYPE.BROWSED_ITEMS,
64
- PURCHASED_ITEMS: l.ITEMS_TYPE.PURCHASED_ITEMS
65
- }[o] || l.ITEMS_TYPE.CART_ITEMS : l.ITEMS_TYPE.CART_ITEMS;
66
- }
67
- function D(o) {
68
- const t = (e, a) => e == null ? a : e === "1" || e === "true", r = (e, a) => e || a, c = o["data-type"] || o["data-source"], n = F(c);
69
- let i = o["data-cart_items_select_control_value"] || m.cartItemsSelectControlValue;
70
- if (i && !i.includes("{{") && /^\d+$/.test(i)) {
71
- const e = parseInt(i) - 1, a = I[n];
72
- a && a[e] && (i = a[e].value);
73
- }
74
- return {
75
- initialized: !0,
76
- blockInstanceId: r(o["data-block-instance-id"], U()),
77
- source: n,
78
- type: n,
79
- itemsSelectValue: i,
80
- orientation: o["data-card_orientation_control_value"] || l.ORIENTATION.VERTICAL,
81
- nameTrimming: t(o["data-product_name_trimming"], !0),
82
- nameControlEnabled: t(o["data-product_name_control_enabled"], !0),
83
- priceHideDiscount: t(o["data-product_price_hide_discount"], !1),
84
- priceFormatted: t(o["data-product_price_formatted"], !0),
85
- priceCurrencySymbol: r(
86
- o["data-product_price_currency_symbol"],
87
- m.productPriceCurrencySymbolControlValue
88
- ),
89
- priceCurrencyLocation: r(
90
- o["data-product_price_currency_location"],
91
- m.productPriceCurrencyLocationControlValue
92
- ),
93
- priceControlOpened: t(o["data-product_price_control_opened"], !0),
94
- priceOrientation: o["data-product_original_price_control_orientation"] || "horizontal",
95
- quantityControlEnabled: t(o["data-product_quantity_control_enabled"], !0),
96
- buttonLink: r(o["data-product_button_link"], m.productButtonLinkControlValue),
97
- imageLink: r(o["data-product_image_link"], m.productImageLinkControlValue),
98
- buttonLabel: r(o["data-product_button_control_label"], "Buy"),
99
- imageVisible: t(o["data-product_image_visible"], !0),
100
- nameVisible: t(o["data-product_name_visible"], !0),
101
- quantityVisible: t(o["data-product_quantity_visible"], !0),
102
- priceVisible: t(o["data-product_price_visible"], !0),
103
- originalPriceVisible: t(o["data-product_original_price_control_enabled"], !0),
104
- buttonVisible: t(o["data-product_button_visible"], !0)
105
- };
106
- }
107
- class w {
108
- constructor() {
109
- A(this, "parser");
110
- A(this, "DATA_TYPE", "CART_ITEMS");
111
- this.parser = new DOMParser();
112
- }
113
- migrate(t) {
114
- try {
115
- let r = this.removeJinjaConditionals(t);
116
- r = this.replaceTemplateVariables(r);
117
- const c = this.parser.parseFromString(r, "text/html"), n = c.querySelectorAll("td.esd-cart-items-block");
118
- return n.length === 0 ? (console.warn('ItemsBlockMigrator: No blocks found with selector "td.esd-cart-items-block"'), r) : (n.forEach((i) => {
119
- const e = this.extractConfiguration(i), a = K({
120
- orientation: e.orientation,
121
- itemsType: e.itemsType,
122
- itemId: e.itemId,
123
- currencySymbol: e.currencySymbol,
124
- currencyLocation: e.currencyLocation,
125
- formattedPrice: e.formattedPrice,
126
- configBlockAttributes: e.configBlockAttributes,
127
- migrate: !0,
128
- nameStyles: e.nameStyles,
129
- buttonStyles: e.buttonStyles,
130
- priceStyles: e.priceStyles,
131
- originalPriceStyles: e.originalPriceStyles,
132
- quantityStyles: e.quantityStyles,
133
- nodeConfig: D(e.configBlockAttributes)
134
- }), u = this.parser.parseFromString(
135
- `<table><tbody><tr>${a}</tr></tbody></table>`,
136
- "text/html"
137
- ).querySelector("td");
138
- if (u && i.parentNode) {
139
- const s = D(e.configBlockAttributes);
140
- u.setAttribute("esd-ext-config", JSON.stringify(s));
141
- const p = u.querySelector("esd-config-block");
142
- p && p.remove(), i.parentNode.replaceChild(u, i);
143
- }
144
- }), c.documentElement.outerHTML);
145
- } catch (r) {
146
- return console.error("ItemsBlockMigrator failed:", r), t;
147
- }
148
- }
149
- /**
150
- * Extracts configuration from legacy HTML block
151
- * Parses data attributes and structure to determine:
152
- * - orientation, itemsType, itemNumber, currency settings, esd-config-block attributes
153
- * - UI styles from product elements (name, price, button, quantity, etc.)
154
- */
155
- extractConfiguration(t) {
156
- var E, C, P;
157
- const r = ((E = t.querySelector("[data-type]")) == null ? void 0 : E.getAttribute("data-type")) || "CART_ITEMS", c = ((C = t.querySelector("[data-number]")) == null ? void 0 : C.getAttribute("data-number")) || "1", n = parseInt(c) - 1, i = I[r], e = ((P = i == null ? void 0 : i[n]) == null ? void 0 : P.value) || i[0].value, a = t.querySelector('[product-attr="price"]'), _ = (a == null ? void 0 : a.getAttribute("data-currency_symbol")) || void 0, s = ((a == null ? void 0 : a.getAttribute("data-curency")) || "before") === "after" ? "1" : "0", p = (a == null ? void 0 : a.getAttribute("data-formated")) !== "false", y = this.extractConfigBlockAttributes(t, r), f = y["data-product_original_price_control_orientation"] === "vertical" ? "vertical" : "horizontal", d = t.querySelector('a[product-attr="name"]'), v = (d == null ? void 0 : d.getAttribute("style")) || void 0, b = t.querySelector('a[product-attr="button"]'), M = (b == null ? void 0 : b.getAttribute("style")) || void 0, h = (a == null ? void 0 : a.getAttribute("style")) || void 0, S = t.querySelector('[product-attr="originalPrice"]'), R = (S == null ? void 0 : S.getAttribute("style")) || void 0, T = t.querySelector('[product-attr="quantity"]'), k = (T == null ? void 0 : T.getAttribute("style")) || void 0;
158
- return {
159
- orientation: f,
160
- itemsType: r,
161
- itemId: e,
162
- currencySymbol: _,
163
- currencyLocation: s,
164
- formattedPrice: p,
165
- configBlockAttributes: y,
166
- nameStyles: v,
167
- buttonStyles: M,
168
- priceStyles: h,
169
- originalPriceStyles: R,
170
- quantityStyles: k
171
- };
172
- }
173
- /**
174
- * Extracts all data-* attributes from the esd-config-block element
175
- * Returns a key-value mapping of all configuration attributes
176
- * @param block - The block element containing the esd-config-block
177
- * @param itemsType - The type of items (CART_ITEMS, BROWSED_ITEMS, PURCHASED_ITEMS)
178
- */
179
- extractConfigBlockAttributes(t, r) {
180
- const c = t.querySelector("esd-config-block"), n = {};
181
- if (!c)
182
- return this.getDefaultConfigBlockAttributes();
183
- if (Array.from(c.attributes).forEach((e) => {
184
- e.name.startsWith("data-") && (n[e.name] = e.value);
185
- }), n["data-cart_items_select_control_value"]) {
186
- const e = n["data-cart_items_select_control_value"];
187
- if (/^\d+$/.test(e)) {
188
- const a = parseInt(e) - 1, _ = I[r];
189
- _ && _[a] && (n["data-cart_items_select_control_value"] = _[a].value);
190
- }
191
- }
192
- if (n["data-product_price_control_curency"]) {
193
- const e = n["data-product_price_control_curency"];
194
- e === "before" ? n["data-product_price_control_curency"] = "0" : e === "after" && (n["data-product_price_control_curency"] = "1");
195
- }
196
- (!n["data-product_price_currency_symbol"] || n["data-product_price_currency_symbol"].trim() === "") && (n["data-product_price_currency_symbol"] = "USD");
197
- const i = { ...this.getDefaultConfigBlockAttributes(), ...n };
198
- return i["data-type"] = r, i["data-source"] = r, i;
199
- }
200
- /**
201
- * Returns default esd-config-block attributes based on the old template structure
202
- * These serve as fallbacks when attributes are missing
203
- */
204
- getDefaultConfigBlockAttributes() {
205
- return {
206
- "data-type": "CART_ITEMS",
207
- "data-product_image_control_opened": "false",
208
- "data-product_image_control_image-width": "250",
209
- "data-product_image_control_image-height": "250",
210
- "data-product_image_control_align_button": "true",
211
- "data-product_image_control_padding_mobile": "true",
212
- "data-product_name_control_opened": "false",
213
- "data-product_quantity_control_opened": "true",
214
- // DONE
215
- "data-product_quantity_control_enabled": "false",
216
- "data-product_name_control_font_font_size": "20",
217
- "data-product_price_control_opened": "false",
218
- "data-product_price_control_font_font_size": "20",
219
- "data-product_price_control_color": "#060606",
220
- "data-product_price_control_curency": "0",
221
- "data-product_price_currency_symbol": "USD",
222
- "data-product_original_price_control_opened": "false",
223
- "data-product_original_price_control_font_font_size": "19",
224
- "data-product_original_price_control_align_align_desktop": "center",
225
- "data-product_original_price_control_orientation": "vertical",
226
- "data-product_button_control_opened": "true",
227
- "data-product_button_control_label": "Comprar",
228
- // DONE
229
- "data-product_button_control_font_font_size": "17",
230
- "data-product_button_control_color": "#ffffff",
231
- "data-product_button_control_background": "#010101",
232
- "data-product_button_control_atw": "false",
233
- "data-product_original_price_control_enabled": "false"
234
- };
235
- }
236
- /**
237
- * Removes Jinja2 conditional statements from HTML
238
- * - Removes {% if ins_apr_total_product_kind > N %}
239
- * - Removes {% if ins_apr_price_N != ins_apr_originalprice_N %}
240
- * - Removes {% endif %}
241
- */
242
- removeJinjaConditionals(t) {
243
- let r = t.replace(/\{%\s*if\s+ins_apr_total_product_kind\s*(&gt;|>)\s*\d+\s*%\}/g, "");
244
- return r = r.replace(/\{%\s*if\s+ins_apr_price_\d+\s*(!&#61;|!=)\s*ins_apr_originalprice_\d+\s*%\}/g, ""), r = r.replace(/\{%\s*endif\s*%\}/g, ""), r = r.replace(/\n\s*\n\s*\n/g, `
245
-
246
- `), r;
247
- }
248
- /**
249
- * Replaces template variables with default values from productPairs
250
- *
251
- * Examples:
252
- * - {{ins_apr_img_1}} → https://s3.../ins_apr_img_1.jpeg (array-based, uses index 0)
253
- * - {{ins_apr_name_2}} → 'Set of Sprite Yoga Straps' (array-based, uses index 1)
254
- * - {{ins_apr_formattedprice_1}} → '1,100.00' (single value, ignores index)
255
- * - {{ins_apr_url_3}} → '#!' (single value, ignores index)
256
- */
257
- replaceTemplateVariables(t) {
258
- const { PAIRS_FOR_EXTENSION: r } = L;
259
- return t.replace(/{{([^}]+)}}/g, (c, n) => {
260
- const i = n.match(/^(ins_apr_[a-z]+)_(\d+)$/);
261
- if (!i)
262
- return c;
263
- const [, e, a] = i, _ = V[e];
264
- if (!_)
265
- return console.warn(`Unknown variable mapping for: ${e}`), c;
266
- const { pairsKey: u, defaultKey: s, isArray: p } = _, y = r[u][this.DATA_TYPE];
267
- if (!y)
268
- return console.warn(`No data found for: ${u}.${this.DATA_TYPE}`), c;
269
- if (p) {
270
- const f = parseInt(a) - 1, d = y[s];
271
- return Array.isArray(d) && d[f] ? d[f] : (console.warn(`Array value not found: ${u}.${this.DATA_TYPE}.${s}[${f}]`), c);
272
- }
273
- const g = y[s];
274
- return g !== void 0 ? String(g) : (console.warn(`Default value not found: ${u}.${this.DATA_TYPE}.${s}`), c);
275
- });
276
- }
277
- }
278
- function $(o) {
279
- return new w().migrate(o);
280
- }
281
- export {
282
- $ as migrateItemsBlock
283
- };