@useinsider/guido 2.2.0-beta.eeefcc3 → 3.0.0-beta.5b2298c

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 (126) hide show
  1. package/README.md +41 -2
  2. package/dist/@types/config/schemas.js +1 -1
  3. package/dist/components/Guido.vue.js +1 -1
  4. package/dist/components/Guido.vue2.js +66 -66
  5. package/dist/components/organisms/base/Toaster.vue.js +4 -4
  6. package/dist/components/organisms/base/Toaster.vue2.js +12 -9
  7. package/dist/components/organisms/email-preview/desktop-preview/EmailSizeIndicator.vue.js +5 -5
  8. package/dist/components/organisms/email-preview/desktop-preview/EmailSizeIndicator.vue2.js +2 -2
  9. package/dist/components/organisms/extensions/recommendation/FilterItem.vue.js +11 -13
  10. package/dist/components/organisms/extensions/recommendation/FilterItem.vue2.js +54 -23
  11. package/dist/components/organisms/extensions/recommendation/FilterSelectionDrawer.vue.js +7 -5
  12. package/dist/components/organisms/extensions/recommendation/FilterSelectionDrawer.vue2.js +34 -21
  13. package/dist/components/organisms/extensions/recommendation/Filters.vue.js +11 -11
  14. package/dist/components/organisms/extensions/recommendation/Filters.vue2.js +48 -36
  15. package/dist/components/organisms/extensions/recommendation/LogicAdapter.vue2.js +11 -9
  16. package/dist/components/organisms/header/EditorActions.vue.js +10 -8
  17. package/dist/components/organisms/header/EditorActions.vue2.js +40 -30
  18. package/dist/components/organisms/header/MigrationConfirmModal.vue.js +17 -0
  19. package/dist/components/organisms/header/MigrationConfirmModal.vue2.js +39 -0
  20. package/dist/components/organisms/unsubscribe/UnsubscribePageSelection.vue.js +1 -1
  21. package/dist/components/organisms/unsubscribe/UnsubscribePageSelection.vue2.js +19 -19
  22. package/dist/composables/useRecommendation.js +9 -9
  23. package/dist/composables/useSave.js +16 -12
  24. package/dist/composables/useStripo.js +66 -62
  25. package/dist/composables/useStripoEventHandler.js +27 -12
  26. package/dist/composables/useSyncModuleExtractor.js +45 -0
  27. package/dist/config/compiler/utils/recommendationCompilerUtils.js +1 -1
  28. package/dist/config/i18n/en/labels.json.js +8 -3
  29. package/dist/config/migrator/itemsBlockMigrator.js +135 -131
  30. package/dist/config/migrator/recommendationMigrator.js +59 -55
  31. package/dist/enums/block.js +4 -0
  32. package/dist/enums/unsubscribe.js +25 -21
  33. package/dist/extensions/Blocks/Items/block.js +30 -21
  34. package/dist/extensions/Blocks/Items/iconsRegistry.js +7 -6
  35. package/dist/extensions/Blocks/Items/items.css.js +48 -0
  36. package/dist/extensions/Blocks/Recommendation/block.js +22 -13
  37. package/dist/extensions/Blocks/Recommendation/constants/defaultConfig.js +36 -33
  38. package/dist/extensions/Blocks/Recommendation/constants/layout.js +16 -14
  39. package/dist/extensions/Blocks/Recommendation/constants/selectors.js +15 -13
  40. package/dist/extensions/Blocks/Recommendation/controls/button/index.js +9 -9
  41. package/dist/extensions/Blocks/Recommendation/controls/image/index.js +1 -1
  42. package/dist/extensions/Blocks/Recommendation/controls/layout/index.js +41 -29
  43. package/dist/extensions/Blocks/Recommendation/controls/main/algorithm.js +16 -16
  44. package/dist/extensions/Blocks/Recommendation/controls/main/currency.js +30 -32
  45. package/dist/extensions/Blocks/Recommendation/controls/main/index.js +194 -104
  46. package/dist/extensions/Blocks/Recommendation/controls/main/locale.js +9 -9
  47. package/dist/extensions/Blocks/Recommendation/controls/main/productLayout.js +46 -38
  48. package/dist/extensions/Blocks/Recommendation/controls/main/shuffle.js +16 -16
  49. package/dist/extensions/Blocks/Recommendation/controls/main/utils.js +291 -217
  50. package/dist/extensions/Blocks/Recommendation/controls/mobileLayout/cssRules.js +14 -14
  51. package/dist/extensions/Blocks/Recommendation/controls/name/index.js +10 -10
  52. package/dist/extensions/Blocks/Recommendation/controls/name/textTrim.js +5 -5
  53. package/dist/extensions/Blocks/Recommendation/controls/oldPrice/index.js +14 -14
  54. package/dist/extensions/Blocks/Recommendation/controls/omnibusDiscount/index.js +9 -9
  55. package/dist/extensions/Blocks/Recommendation/controls/omnibusDiscount/textAfter.js +3 -3
  56. package/dist/extensions/Blocks/Recommendation/controls/omnibusDiscount/textBefore.js +1 -1
  57. package/dist/extensions/Blocks/Recommendation/controls/omnibusPrice/index.js +9 -9
  58. package/dist/extensions/Blocks/Recommendation/controls/omnibusPrice/textAfter.js +3 -3
  59. package/dist/extensions/Blocks/Recommendation/controls/omnibusPrice/textBefore.js +13 -13
  60. package/dist/extensions/Blocks/Recommendation/controls/price/index.js +3 -3
  61. package/dist/extensions/Blocks/Recommendation/controls/spacing/index.js +223 -99
  62. package/dist/extensions/Blocks/Recommendation/iconsRegistry.js +5 -4
  63. package/dist/extensions/Blocks/Recommendation/recommendation.css.js +48 -0
  64. package/dist/extensions/Blocks/Recommendation/store/recommendation.js +172 -85
  65. package/dist/extensions/Blocks/Recommendation/templates/grid/elementRenderer.js +2 -2
  66. package/dist/extensions/Blocks/Recommendation/templates/grid/migration.js +1 -1
  67. package/dist/extensions/Blocks/Recommendation/templates/list/elementRenderer.js +2 -2
  68. package/dist/extensions/Blocks/Recommendation/templates/utils.js +32 -32
  69. package/dist/extensions/Blocks/Recommendation/utils/filterUtil.js +8 -8
  70. package/dist/extensions/Blocks/Recommendation/validation/filterSchema.js +29 -0
  71. package/dist/extensions/Blocks/Unsubscribe/block.js +29 -29
  72. package/dist/extensions/Blocks/Unsubscribe/control.js +12 -9
  73. package/dist/extensions/Blocks/Unsubscribe/elements/preview.js +13 -11
  74. package/dist/extensions/Blocks/Unsubscribe/styles.css.js +31 -1
  75. package/dist/extensions/Blocks/common-control.js +12 -4
  76. package/dist/guido.css +1 -1
  77. package/dist/services/stripoApi.js +55 -19
  78. package/dist/src/@types/config/schemas.d.ts +1 -1
  79. package/dist/src/@types/events.d.ts +38 -2
  80. package/dist/src/@types/extensions/block.d.ts +2 -0
  81. package/dist/src/components/Guido.vue.d.ts +2 -2
  82. package/dist/src/components/organisms/extensions/recommendation/FilterItem.vue.d.ts +1 -0
  83. package/dist/src/components/organisms/extensions/recommendation/Filters.vue.d.ts +17 -1
  84. package/dist/src/components/organisms/header/EditorActions.vue.d.ts +1 -1
  85. package/dist/src/components/organisms/header/HeaderWrapper.vue.d.ts +1 -1
  86. package/dist/src/components/organisms/header/MigrationConfirmModal.vue.d.ts +6 -0
  87. package/dist/src/components/organisms/header/RightSlot.vue.d.ts +1 -1
  88. package/dist/src/components/wrappers/WpModal.vue.d.ts +2 -2
  89. package/dist/src/composables/useGuidoActions.d.ts +1 -1
  90. package/dist/src/composables/useSave.d.ts +2 -2
  91. package/dist/src/composables/useStripo.d.ts +2 -2
  92. package/dist/src/composables/useSyncModuleExtractor.d.ts +4 -0
  93. package/dist/src/enums/block.d.ts +4 -0
  94. package/dist/src/enums/unsubscribe.d.ts +3 -0
  95. package/dist/src/extensions/Blocks/Items/block.d.ts +3 -1
  96. package/dist/src/extensions/Blocks/Recommendation/block.d.ts +3 -1
  97. package/dist/src/extensions/Blocks/Recommendation/constants/defaultConfig.d.ts +6 -0
  98. package/dist/src/extensions/Blocks/Recommendation/constants/index.d.ts +3 -3
  99. package/dist/src/extensions/Blocks/Recommendation/constants/layout.d.ts +6 -2
  100. package/dist/src/extensions/Blocks/Recommendation/constants/selectors.d.ts +8 -1
  101. package/dist/src/extensions/Blocks/Recommendation/controls/main/index.d.ts +38 -10
  102. package/dist/src/extensions/Blocks/Recommendation/controls/main/utils.d.ts +27 -14
  103. package/dist/src/extensions/Blocks/Recommendation/controls/spacing/index.d.ts +50 -17
  104. package/dist/src/extensions/Blocks/Recommendation/store/recommendation.d.ts +19 -2
  105. package/dist/src/extensions/Blocks/Recommendation/templates/grid/migration.d.ts +1 -1
  106. package/dist/src/extensions/Blocks/Recommendation/templates/index.d.ts +4 -2
  107. package/dist/src/extensions/Blocks/Recommendation/templates/list/migration.d.ts +1 -1
  108. package/dist/src/extensions/Blocks/Recommendation/templates/utils.d.ts +1 -1
  109. package/dist/src/extensions/Blocks/Recommendation/types/nodeConfig.d.ts +8 -0
  110. package/dist/src/extensions/Blocks/Recommendation/validation/filterSchema.d.ts +15 -0
  111. package/dist/src/extensions/Blocks/Unsubscribe/control.d.ts +1 -0
  112. package/dist/src/extensions/Blocks/common-control.d.ts +5 -0
  113. package/dist/src/mock/api/settings.d.ts +2 -0
  114. package/dist/src/services/stripoApi.d.ts +5 -0
  115. package/dist/src/stores/editor.d.ts +23 -0
  116. package/dist/src/stores/template.d.ts +29 -0
  117. package/dist/src/utils/migrationBannerHtml.d.ts +2 -0
  118. package/dist/src/utils/templatePreparation.d.ts +1 -1
  119. package/dist/static/assets/info.svg.js +5 -0
  120. package/dist/static/styles/customEditorStyle.css.js +50 -23
  121. package/dist/stores/editor.js +2 -1
  122. package/dist/stores/template.js +15 -0
  123. package/dist/stores/unsubscribe.js +37 -34
  124. package/dist/utils/migrationBannerHtml.js +21 -0
  125. package/dist/utils/templatePreparation.js +1 -1
  126. package/package.json +2 -2
@@ -1,17 +1,17 @@
1
1
  import { useTranslations as e } from "../composables/useTranslations.js";
2
2
  import { getEnvironmentPrefix as R } from "../utils/environmentUtil.js";
3
- const I = {
3
+ const _ = {
4
4
  UNSUBSCRIBE_LINK_TYPE: 1,
5
5
  PREFERENCES_LINK_TYPE: 3
6
- }, r = {
6
+ }, I = {
7
7
  UNSUBSCRIBE_LINK_REGEX: /{{ins-unsubscribe-link}}/g,
8
8
  DATA_OGSB_BUTTON_CSS_REGEX: "\\[data-ogsb\\]\\s*\\.es-button\\.es-button-[0-9]+\\s*\\{(?:[^\\}]*)\\}",
9
9
  GLOBAL_UNSUBSCRIBE_LINK_REGEX: /{{ins-global-unsubscribe-link}}/g,
10
10
  PREFERENCES_UNSUBSCRIBE_LINK_REGEX: /{{ins-preferences-unsubscribe-link}}/g
11
- }, s = R(), _ = {
12
- UNSUBSCRIBE_URL: `https://mail.${s}.com/user/v1/unsub`,
13
- PREFERENCES_URL: `https://mail.${s}.com/user/v1/prefs`
14
- }, i = "iid", B = {
11
+ }, n = R(), r = {
12
+ UNSUBSCRIBE_URL: `https://mail.${n}.com/user/v1/unsub`,
13
+ PREFERENCES_URL: `https://mail.${n}.com/user/v1/prefs`
14
+ }, B = "iid", i = {
15
15
  name: "Global Unsubscribe",
16
16
  sendGridId: "G"
17
17
  }, C = "/email/unsubscribe-pages", E = {
@@ -20,6 +20,9 @@ const I = {
20
20
  SUBSCRIPTION_PREFERENCE_CENTER: 3,
21
21
  SUBSCRIPTION_PREFERENCE_CONFIRMATION: 4,
22
22
  RESUBSCRIBE: 5
23
+ }, U = {
24
+ [E.GLOBAL_UNSUBSCRIBE]: "custom-unsubscribe",
25
+ [E.SUBSCRIPTION_PREFERENCE_CENTER]: "custom-preferences"
23
26
  }, t = {
24
27
  [E.GLOBAL_UNSUBSCRIBE]: [
25
28
  E.GLOBAL_UNSUBSCRIBE,
@@ -30,29 +33,30 @@ const I = {
30
33
  E.SUBSCRIPTION_PREFERENCE_CENTER,
31
34
  E.SUBSCRIPTION_PREFERENCE_CONFIRMATION
32
35
  ]
33
- }, U = () => {
34
- const n = e();
36
+ }, c = () => {
37
+ const s = e();
35
38
  return {
36
- [E.GLOBAL_UNSUBSCRIBE]: n("unsubscription-preference.type-global-unsubscribe"),
37
- [E.GLOBAL_UNSUBSCRIBE_CONFIRMATION_PAGE]: n("unsubscription-preference.type-global-unsubscription-confirmation"),
38
- [E.RESUBSCRIBE]: n("unsubscription-preference.type-resubscribe"),
39
- [E.SUBSCRIPTION_PREFERENCE_CENTER]: n("unsubscription-preference.type-subscription-preferences-center"),
40
- [E.SUBSCRIPTION_PREFERENCE_CONFIRMATION]: n("unsubscription-preference.type-subscription-preferences-confirmation")
39
+ [E.GLOBAL_UNSUBSCRIBE]: s("unsubscription-preference.type-global-unsubscribe"),
40
+ [E.GLOBAL_UNSUBSCRIBE_CONFIRMATION_PAGE]: s("unsubscription-preference.type-global-unsubscription-confirmation"),
41
+ [E.RESUBSCRIBE]: s("unsubscription-preference.type-resubscribe"),
42
+ [E.SUBSCRIPTION_PREFERENCE_CENTER]: s("unsubscription-preference.type-subscription-preferences-center"),
43
+ [E.SUBSCRIPTION_PREFERENCE_CONFIRMATION]: s("unsubscription-preference.type-subscription-preferences-confirmation")
41
44
  };
42
- }, c = {
45
+ }, o = {
43
46
  default: "{{ins-unsubscribe-link}}",
44
47
  [E.GLOBAL_UNSUBSCRIBE]: "{{ins-global-unsubscribe-link}}",
45
48
  [E.SUBSCRIPTION_PREFERENCE_CENTER]: "{{ins-preferences-unsubscribe-link}}"
46
49
  };
47
50
  export {
48
- B as DEFAULT_UNSUBSCRIBE_GROUP,
49
- i as INSIDER_ID,
50
- r as LINK_REGEXES,
51
- I as LINK_TYPES,
52
- c as MERGE_TAGS,
51
+ i as DEFAULT_UNSUBSCRIBE_GROUP,
52
+ B as INSIDER_ID,
53
+ I as LINK_REGEXES,
54
+ _ as LINK_TYPES,
55
+ o as MERGE_TAGS,
53
56
  E as PAGE_TYPES,
54
57
  t as TYPE_COLLECTIONS,
55
58
  C as UNSUBSCRIBE_PAGES_LINK,
56
- _ as URLS,
57
- U as getTypeTranslations
59
+ U as UNSUBSCRIBE_SYNC_MODULE_TYPES,
60
+ r as URLS,
61
+ c as getTypeTranslations
58
62
  };
@@ -1,18 +1,20 @@
1
- import { useOnboardingStore as d } from "../../../stores/onboarding.js";
2
- import { Block as g, BlockCompositionType as f, ModificationDescription as o } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
3
- import { SETTINGS_ENUMS as c, DefaultConfigValues as i } from "./enums/settingsEnums.js";
4
- import { getDefaultTemplate as p } from "./template.js";
5
- import { getItemsBlockContainer as u, getItemsBlockConfig as C, getDefaultItemsBlockConfig as I } from "./utils/nodeConfigUtils.js";
6
- const y = "items-block";
7
- class B extends g {
1
+ import { BlockId as g } from "../../../enums/block.js";
2
+ import { useOnboardingStore as p } from "../../../stores/onboarding.js";
3
+ import { getMigrationBannerHtml as f } from "../../../utils/migrationBannerHtml.js";
4
+ import { Block as u, BlockCompositionType as I, ModificationDescription as o } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
5
+ import { SETTINGS_ENUMS as a, DefaultConfigValues as i } from "./enums/settingsEnums.js";
6
+ import { getDefaultTemplate as C } from "./template.js";
7
+ import { getItemsBlockContainer as y, getItemsBlockConfig as b, getDefaultItemsBlockConfig as h } from "./utils/nodeConfigUtils.js";
8
+ const c = g.Items;
9
+ class E extends u {
8
10
  getId() {
9
- return y;
11
+ return c;
10
12
  }
11
13
  getIcon() {
12
14
  return "items-icon";
13
15
  }
14
16
  getBlockCompositionType() {
15
- return f.CONTAINER;
17
+ return I.CONTAINER;
16
18
  }
17
19
  getName() {
18
20
  return this.api.translate("Items");
@@ -20,10 +22,17 @@ class B extends g {
20
22
  getDescription() {
21
23
  return this.api.translate("Items lets you display personalized products based on user behavior.");
22
24
  }
25
+ getSettingsPanelTitleHtml() {
26
+ return f(
27
+ c,
28
+ this.api.translate("Items"),
29
+ this.api.translate("This block is switched from the Old Version to the New Version. We recommend you check the Items block and test your message to ensure it works properly.")
30
+ );
31
+ }
23
32
  getTemplate() {
24
- return p({
25
- orientation: c.ORIENTATION.VERTICAL,
26
- itemsType: c.ITEMS_TYPE.CART_ITEMS,
33
+ return C({
34
+ orientation: a.ORIENTATION.VERTICAL,
35
+ itemsType: a.ITEMS_TYPE.CART_ITEMS,
27
36
  itemId: "{{Abandoned Cart Item (1) Url}}",
28
37
  currencySymbol: i.productPriceCurrencySymbolControlValue,
29
38
  currencyLocation: i.productPriceCurrencyLocationControlValue,
@@ -34,21 +43,21 @@ class B extends g {
34
43
  return !1;
35
44
  }
36
45
  onCreated(n) {
37
- const s = this.api.getDocumentModifier(), r = this.api.getDocumentRootCssNode();
38
- r.querySelector('[product-attr="imageSrc"] img') || s.modifyCss(r).appendRule('[product-attr="imageSrc"] img {object-fit: contain;}');
39
- const e = u(n);
46
+ const l = this.api.getDocumentModifier(), r = this.api.getDocumentRootCssNode();
47
+ r.querySelector('[product-attr="imageSrc"] img') || l.modifyCss(r).appendRule('[product-attr="imageSrc"] img {object-fit: contain;}');
48
+ const e = y(n);
40
49
  if (!e)
41
50
  return;
42
- const a = e.getNodeConfig(), l = a && Object.keys(a).length > 0, t = C(n);
51
+ const s = e.getNodeConfig(), m = s && Object.keys(s).length > 0, t = b(n);
43
52
  if (t != null && t.initialized)
44
- l ? t.blockInstanceId || this.api.getDocumentModifier().modifyHtml(e).setNodeConfig({ ...t, blockInstanceId: String(Date.now()) }).apply(new o("Assign block instance ID to block")) : this.api.getDocumentModifier().modifyHtml(e).setNodeConfig(t).apply(new o("Migrate legacy config to nodeConfig"));
53
+ m ? t.blockInstanceId || this.api.getDocumentModifier().modifyHtml(e).setNodeConfig({ ...t, blockInstanceId: String(Date.now()) }).apply(new o("Assign block instance ID to block")) : this.api.getDocumentModifier().modifyHtml(e).setNodeConfig(t).apply(new o("Migrate legacy config to nodeConfig"));
45
54
  else {
46
- const m = I();
47
- this.api.getDocumentModifier().modifyHtml(e).setNodeConfig(m).apply(new o("Initialize Items block with default configuration")), d().startOnboarding("itemsOnboarding");
55
+ const d = h();
56
+ this.api.getDocumentModifier().modifyHtml(e).setNodeConfig(d).apply(new o("Initialize Items block with default configuration")), p().startOnboarding("itemsOnboarding");
48
57
  }
49
58
  }
50
59
  }
51
60
  export {
52
- y as BLOCK_ID,
53
- B as ItemsBlock
61
+ c as BLOCK_ID,
62
+ E as ItemsBlock
54
63
  };
@@ -1,5 +1,6 @@
1
- import { IconsRegistry as o } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
2
- class i extends o {
1
+ import o from "../../../static/assets/info.svg.js";
2
+ import { IconsRegistry as r } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
3
+ class s extends r {
3
4
  registerIconsSvg(t) {
4
5
  t["items-icon"] = `
5
6
  <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
@@ -19,14 +20,14 @@ class i extends o {
19
20
  </svg>
20
21
  `, t["horizontal-orientation"] = `
21
22
  <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
22
- <path d="M10 19H4C3.44772 19 3 18.5523 3 18V2C3 1.44772 3.44772 1 4 1H10V19Z" stroke="currentColor"
23
+ <path d="M10 19H4C3.44772 19 3 18.5523 3 18V2C3 1.44772 3.44772 1 4 1H10V19Z" stroke="currentColor"
23
24
  stroke-width="2" fill="none"/>
24
- <path d="M17 2V18C17 18.5523 16.5523 19 16 19H10V1H16C16.5523 1 17 1.44772 17 2Z" stroke="currentColor"
25
+ <path d="M17 2V18C17 18.5523 16.5523 19 16 19H10V1H16C16.5523 1 17 1.44772 17 2Z" stroke="currentColor"
25
26
  stroke-width="2" fill="none"/>
26
27
  </svg>
27
- `;
28
+ `, t["migration-info-icon"] = o;
28
29
  }
29
30
  }
30
31
  export {
31
- i as ItemsIconsRegistry
32
+ s as ItemsIconsRegistry
32
33
  };
@@ -17,6 +17,54 @@ const n = `/* Utils */
17
17
  .container:has(.items-controls-container) {
18
18
  padding: 0
19
19
  }
20
+
21
+ /* ─── Migration Info Box ─────────────────────────────────────────────── */
22
+ /* Shown in the settings panel title when a block was migrated from legacy */
23
+
24
+ /* Layout variables for positioning the absolutely-placed info box */
25
+ :host {
26
+ --items-migration-padding: 16px;
27
+ --items-migration-title-height: 61px;
28
+ --items-migration-box-height: 98px;
29
+ }
30
+
31
+ /* Push tabs down when info box is present inside the control panel header */
32
+ .control-panel-header:has(.items-block-migration-info) {
33
+ position: relative;
34
+ margin-bottom: calc(2 * var(--items-migration-padding) + var(--items-migration-box-height));
35
+ }
36
+
37
+ /* Info box container */
38
+ .items-block-migration-info {
39
+ display: flex;
40
+ align-items: flex-start;
41
+ gap: 8px;
42
+ padding: 12px;
43
+ background: var(--guido-color-background-onpage-message-info);
44
+ border: 1px solid var(--guido-color-border-onpage-message-info);
45
+ border-radius: 4px;
46
+ box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.07);
47
+ position: absolute;
48
+ left: var(--items-migration-padding);
49
+ right: var(--items-migration-padding);
50
+ top: calc(var(--items-migration-padding) + var(--items-migration-title-height));
51
+ }
52
+
53
+ /* Icon — 18x19 icon inside a 24x24 bounding box (matches Figma) */
54
+ .items-block-migration-info__icon {
55
+ flex-shrink: 0;
56
+ width: 24px;
57
+ height: 24px;
58
+ }
59
+
60
+ /* Text content */
61
+ .items-block-migration-info__text {
62
+ margin: 4px 0;
63
+ white-space: normal;
64
+ font-size: 13px;
65
+ font-weight: 400;
66
+ line-height: 16px;
67
+ }
20
68
  `;
21
69
  export {
22
70
  n as default
@@ -1,13 +1,15 @@
1
- var p = Object.defineProperty;
2
- var f = (r, o, t) => o in r ? p(r, o, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[o] = t;
3
- var g = (r, o, t) => f(r, typeof o != "symbol" ? o + "" : o, t);
4
- import { Block as h, BlockCompositionType as I, ModificationDescription as _ } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
1
+ var f = Object.defineProperty;
2
+ var h = (r, o, t) => o in r ? f(r, o, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[o] = t;
3
+ var g = (r, o, t) => h(r, typeof o != "symbol" ? o + "" : o, t);
4
+ import { BlockId as I } from "../../../enums/block.js";
5
+ import { getMigrationBannerHtml as k } from "../../../utils/migrationBannerHtml.js";
6
+ import { Block as B, BlockCompositionType as _, ModificationDescription as R } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
5
7
  import { ensureMobileCssRulesExist as d } from "./controls/mobileLayout/cssRules.js";
6
8
  import { RecommendationConfigService as s } from "./services/configService.js";
7
9
  import { useRecommendationExtensionStore as u } from "./store/recommendation.js";
8
- import { getDefaultTemplate as k } from "./templates/grid/template.js";
9
- const B = "recommendation-block", c = "ins-recommendation-v3-block-v2", a = "recommendation-id";
10
- class y extends h {
10
+ import { getDefaultTemplate as A } from "./templates/grid/template.js";
11
+ const p = I.Recommendation, c = "recommendation-block-v2", a = "recommendation-id";
12
+ class T extends B {
11
13
  constructor() {
12
14
  super();
13
15
  /**
@@ -17,13 +19,13 @@ class y extends h {
17
19
  g(this, "_pendingBlockId", null);
18
20
  }
19
21
  getId() {
20
- return B;
22
+ return p;
21
23
  }
22
24
  getIcon() {
23
25
  return "recommendation-icon";
24
26
  }
25
27
  getBlockCompositionType() {
26
- return I.CONTAINER;
28
+ return _.CONTAINER;
27
29
  }
28
30
  getName() {
29
31
  return this.api.translate("Recommendation Block");
@@ -31,6 +33,13 @@ class y extends h {
31
33
  getDescription() {
32
34
  return this.api.translate("Recommendation Block Title Description");
33
35
  }
36
+ getSettingsPanelTitleHtml() {
37
+ return k(
38
+ p,
39
+ this.api.translate("Recommendation Block"),
40
+ this.api.translate("This block is switched from the Old Version to the New Version. We recommend you check the Recommendation block and test your message to ensure it works properly.")
41
+ );
42
+ }
34
43
  /**
35
44
  * Returns the template HTML for a new recommendation block.
36
45
  * Generates a unique recommendation ID and embeds the instance class
@@ -40,7 +49,7 @@ class y extends h {
40
49
  */
41
50
  getTemplate() {
42
51
  const t = this._generateNextId();
43
- return this._pendingBlockId = t, k(t);
52
+ return this._pendingBlockId = t, A(t);
44
53
  }
45
54
  /**
46
55
  * Called when a new block is dropped into the template
@@ -115,7 +124,7 @@ class y extends h {
115
124
  if (!n)
116
125
  return;
117
126
  const i = this.api.getDocumentModifier();
118
- i.modifyHtml(n).setAttribute(a, e.toString()), i.apply(new _(`Assign recommendation ID ${e}`));
127
+ i.modifyHtml(n).setAttribute(a, e.toString()), i.apply(new R(`Assign recommendation ID ${e}`));
119
128
  }
120
129
  /**
121
130
  * Gets the recommendation-id from a block node
@@ -149,6 +158,6 @@ class y extends h {
149
158
  }
150
159
  }
151
160
  export {
152
- B as BLOCK_ID,
153
- y as RecommendationBlock
161
+ p as BLOCK_ID,
162
+ T as RecommendationBlock
154
163
  };
@@ -1,66 +1,69 @@
1
- import { DEFAULT_ROW_SPACING as U, DEFAULT_COLUMN_SPACING as I, DEFAULT_MOBILE_CARDS_IN_ROW as n, DEFAULT_CARDS_IN_ROW as s } from "./layout.js";
2
- import { ATTR_PRODUCT_IMAGE as t, ATTR_PRODUCT_NAME as e, ATTR_PRODUCT_OLD_PRICE as o, ATTR_PRODUCT_PRICE as _, ATTR_PRODUCT_OMNIBUS_PRICE as T, ATTR_PRODUCT_OMNIBUS_DISCOUNT as r, ATTR_PRODUCT_BUTTON as R } from "./selectors.js";
3
- const O = {
1
+ import { DEFAULT_MOBILE_ROW_SPACING as U, DEFAULT_MOBILE_COLUMN_SPACING as R, DEFAULT_ROW_SPACING as n, DEFAULT_COLUMN_SPACING as O, DEFAULT_MOBILE_CARDS_IN_ROW as C, DEFAULT_CARDS_IN_ROW as D } from "./layout.js";
2
+ import { ATTR_PRODUCT_IMAGE as _, ATTR_PRODUCT_NAME as o, ATTR_PRODUCT_OLD_PRICE as t, ATTR_PRODUCT_PRICE as e, ATTR_PRODUCT_OMNIBUS_PRICE as T, ATTR_PRODUCT_OMNIBUS_DISCOUNT as I, ATTR_PRODUCT_BUTTON as r } from "./selectors.js";
3
+ const i = {
4
4
  code: "USD",
5
5
  symbol: "USD",
6
6
  alignment: "after",
7
7
  decimalCount: 2,
8
8
  decimalSeparator: ".",
9
9
  thousandSeparator: ","
10
- }, i = {
10
+ }, A = {
11
11
  textBefore: "",
12
12
  textAfter: ""
13
- }, C = {
13
+ }, s = {
14
14
  textBefore: "",
15
15
  textAfter: ""
16
- }, D = [
16
+ }, E = [
17
+ _,
18
+ o,
17
19
  t,
18
20
  e,
19
- o,
20
- _,
21
21
  T,
22
- r,
23
- R
24
- ], A = {
25
- [t]: !0,
26
- [e]: !0,
22
+ I,
23
+ r
24
+ ], c = {
27
25
  [_]: !0,
28
26
  [o]: !0,
27
+ [e]: !0,
28
+ [t]: !0,
29
29
  [T]: !1,
30
- [r]: !1,
31
- [R]: !0
32
- }, E = {
30
+ [I]: !1,
31
+ [r]: !0
32
+ }, N = {
33
33
  // Settings
34
34
  strategy: "mostPopular",
35
35
  productIds: [],
36
36
  size: "6",
37
37
  shuffleProducts: !1,
38
38
  language: "en_US",
39
- currency: O,
39
+ currency: i,
40
40
  filters: [],
41
41
  // Layout
42
42
  layout: "grid",
43
- cardsInRow: s,
44
- mobileCardsInRow: n,
45
- columnSpacing: I,
46
- rowSpacing: U,
43
+ cardsInRow: D,
44
+ mobileCardsInRow: C,
45
+ columnSpacing: O,
46
+ rowSpacing: n,
47
+ mobileColumnSpacing: R,
48
+ mobileRowSpacing: U,
47
49
  // Composition
48
- composition: D,
49
- visibility: A,
50
+ composition: E,
51
+ visibility: c,
50
52
  // Element settings
51
- omnibusPrice: i,
52
- omnibusDiscount: C,
53
+ omnibusPrice: A,
54
+ omnibusDiscount: s,
53
55
  textTrimming: !1,
54
56
  // Meta
55
57
  configVersion: 1,
56
58
  recommendationId: 0
57
- }, N = 1;
59
+ }, m = [11, 12], L = 1;
58
60
  export {
59
- N as CURRENT_CONFIG_VERSION,
60
- D as DEFAULT_COMPOSITION,
61
- O as DEFAULT_CURRENCY,
62
- E as DEFAULT_NODE_CONFIG,
63
- C as DEFAULT_OMNIBUS_DISCOUNT,
64
- i as DEFAULT_OMNIBUS_PRICE,
65
- A as DEFAULT_VISIBILITY
61
+ L as CURRENT_CONFIG_VERSION,
62
+ E as DEFAULT_COMPOSITION,
63
+ i as DEFAULT_CURRENCY,
64
+ N as DEFAULT_NODE_CONFIG,
65
+ s as DEFAULT_OMNIBUS_DISCOUNT,
66
+ A as DEFAULT_OMNIBUS_PRICE,
67
+ c as DEFAULT_VISIBILITY,
68
+ m as EXCLUDED_ALGORITHM_IDS
66
69
  };
@@ -1,22 +1,24 @@
1
1
  const _ = {
2
2
  GRID: "grid",
3
3
  LIST: "list"
4
- }, o = [
4
+ }, A = [
5
5
  { icon: "grid-orientation", value: _.GRID },
6
6
  { icon: "list-orientation", value: _.LIST }
7
- ], t = 3, n = 3, A = 9, O = 4, R = 1, T = 2, c = 10, s = 20, I = 0, S = 50, P = 5;
7
+ ], o = 3, t = 3, O = 9, n = 4, I = 1, L = 2, R = 10, T = 10, c = 10, s = 10, S = 0, U = 50, C = 5;
8
8
  export {
9
- n as DEFAULT_CARDS_IN_ROW,
10
- c as DEFAULT_COLUMN_SPACING,
11
- R as DEFAULT_MOBILE_CARDS_IN_ROW,
12
- t as DEFAULT_PRODUCTS_PER_ROW,
13
- s as DEFAULT_ROW_SPACING,
14
- o as LAYOUT_OPTIONS,
9
+ t as DEFAULT_CARDS_IN_ROW,
10
+ R as DEFAULT_COLUMN_SPACING,
11
+ I as DEFAULT_MOBILE_CARDS_IN_ROW,
12
+ c as DEFAULT_MOBILE_COLUMN_SPACING,
13
+ s as DEFAULT_MOBILE_ROW_SPACING,
14
+ o as DEFAULT_PRODUCTS_PER_ROW,
15
+ T as DEFAULT_ROW_SPACING,
16
+ A as LAYOUT_OPTIONS,
15
17
  _ as LAYOUT_VALUES,
16
- T as MAX_MOBILE_PRODUCTS_PER_ROW,
17
- O as MAX_PRODUCTS_PER_ROW,
18
- A as MAX_PRODUCT_COUNT,
19
- S as MAX_SPACING,
20
- I as MIN_SPACING,
21
- P as SPACING_STEP
18
+ L as MAX_MOBILE_PRODUCTS_PER_ROW,
19
+ n as MAX_PRODUCTS_PER_ROW,
20
+ O as MAX_PRODUCT_COUNT,
21
+ U as MAX_SPACING,
22
+ S as MIN_SPACING,
23
+ C as SPACING_STEP
22
24
  };
@@ -1,21 +1,23 @@
1
- const c = ".ins-recommendation-product-container", n = ".ins-recommendation-desktop-container", o = ".ins-recommendation-mobile-container", T = {
1
+ const c = ".recommendation-block-v2", n = ".ins-recommendation-product-container", o = ".ins-recommendation-desktop-container", T = ".ins-recommendation-mobile-container", t = ".ins-recommendation-mobile-row", r = {
2
2
  CURRENCY: "currency",
3
3
  SYMBOL: "currency-symbol",
4
4
  ALIGNMENT: "currency-alignment",
5
5
  THOUSAND_SEPARATOR: "currency-thousand-separator",
6
6
  DECIMAL_SEPARATOR: "currency-decimal-separator",
7
7
  DECIMAL_COUNT: "currency-decimal-count"
8
- }, t = "productImage", r = "productName", R = "productPrice", e = "productOldPrice", O = "productOmnibusPrice", _ = "productOmnibusDiscount", C = "productButton";
8
+ }, R = "productImage", O = "productName", e = "productPrice", _ = "productOldPrice", E = "productOmnibusPrice", C = "productOmnibusDiscount", s = "productButton";
9
9
  export {
10
- C as ATTR_PRODUCT_BUTTON,
11
- t as ATTR_PRODUCT_IMAGE,
12
- r as ATTR_PRODUCT_NAME,
13
- e as ATTR_PRODUCT_OLD_PRICE,
14
- _ as ATTR_PRODUCT_OMNIBUS_DISCOUNT,
15
- O as ATTR_PRODUCT_OMNIBUS_PRICE,
16
- R as ATTR_PRODUCT_PRICE,
17
- c as CONTAINER_SELECTOR,
18
- T as CURRENCY_ATTR,
19
- n as DESKTOP_CONTAINER_SELECTOR,
20
- o as MOBILE_CONTAINER_SELECTOR
10
+ s as ATTR_PRODUCT_BUTTON,
11
+ R as ATTR_PRODUCT_IMAGE,
12
+ O as ATTR_PRODUCT_NAME,
13
+ _ as ATTR_PRODUCT_OLD_PRICE,
14
+ C as ATTR_PRODUCT_OMNIBUS_DISCOUNT,
15
+ E as ATTR_PRODUCT_OMNIBUS_PRICE,
16
+ e as ATTR_PRODUCT_PRICE,
17
+ c as BLOCK_ROOT_SELECTOR,
18
+ n as CONTAINER_SELECTOR,
19
+ r as CURRENCY_ATTR,
20
+ o as DESKTOP_CONTAINER_SELECTOR,
21
+ T as MOBILE_CONTAINER_SELECTOR,
22
+ t as MOBILE_ROW_SELECTOR
21
23
  };
@@ -1,7 +1,7 @@
1
1
  import { createButtonFitToContainerControl as T, createButtonTextStyleAndFontColorControl as r, createButtonTextSizeControl as e, createButtonTextControl as B, createButtonPaddingsControl as l, createButtonMarginsControl as C, createButtonFontFamilyControl as O, createButtonColorControl as N, createButtonBorderRadiusControl as i, createButtonBorderControl as a, createButtonAlignControl as c } from "../../../controlFactories.js";
2
2
  import { RecommendationBlockId as o } from "../../constants/blockIds.js";
3
3
  import { RecommendationControlId as t } from "../../constants/controlIds.js";
4
- import { CONTAINER_SELECTOR as n } from "../../constants/selectors.js";
4
+ import { BLOCK_ROOT_SELECTOR as n } from "../../constants/selectors.js";
5
5
  const U = c(
6
6
  t.BUTTON_ALIGN,
7
7
  o.BUTTON,
@@ -34,19 +34,19 @@ const U = c(
34
34
  t.BUTTON_TEXT,
35
35
  o.BUTTON,
36
36
  n
37
- ), A = e(
37
+ ), S = e(
38
38
  t.BUTTON_TEXT_SIZE,
39
39
  o.BUTTON,
40
40
  n
41
- ), S = r(
41
+ ), A = r(
42
42
  t.BUTTON_TEXT_STYLE_AND_FONT_COLOR,
43
43
  o.BUTTON,
44
44
  n
45
- ), E = T(
45
+ ), x = T(
46
46
  t.BUTTON_FIT_TO_CONTENT,
47
47
  o.BUTTON,
48
48
  n
49
- ), p = {
49
+ ), f = {
50
50
  align: U,
51
51
  border: d,
52
52
  borderRadius: s,
@@ -55,10 +55,10 @@ const U = c(
55
55
  margins: u,
56
56
  paddings: R,
57
57
  text: F,
58
- textSize: A,
59
- textStyleAndFontColor: S,
60
- fitToContent: E
58
+ textSize: S,
59
+ textStyleAndFontColor: A,
60
+ fitToContent: x
61
61
  };
62
62
  export {
63
- p as ButtonControls
63
+ f as ButtonControls
64
64
  };
@@ -1,7 +1,7 @@
1
1
  import { createImageMarginsControl as m, createImageSizeControl as n } from "../../../controlFactories.js";
2
2
  import { RecommendationBlockId as o } from "../../constants/blockIds.js";
3
3
  import { RecommendationControlId as r } from "../../constants/controlIds.js";
4
- import { CONTAINER_SELECTOR as t } from "../../constants/selectors.js";
4
+ import { BLOCK_ROOT_SELECTOR as t } from "../../constants/selectors.js";
5
5
  const e = n(
6
6
  r.IMAGE_SIZE,
7
7
  o.IMAGE,