@useinsider/guido 3.7.2-beta.1489585 → 3.7.2-beta.2220fb0

package/dist/extensions/Blocks/Recommendation/extension.js

@@ -1,45 +1,45 @@
 import { ExtensionBuilder as r } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
 import { RecommendationBlock as m } from "./block.js";
-import { RecommendationBlockControl as n } from "./controls/main/index.js";
+import n from "./canvasPreview.css.js";
+import { RecommendationBlockControl as i } from "./controls/main/index.js";
 import "./store/recommendation.js";
-import "./utils/captureStyleTemplates.js";
-import { NameControls as i } from "./controls/name/index.js";
-import { PriceControls as e } from "./controls/price/index.js";
-import { OldPriceControls as s } from "./controls/oldPrice/index.js";
-import { OmnibusPriceControls as l } from "./controls/omnibusPrice/index.js";
+import { NameControls as e } from "./controls/name/index.js";
+import { PriceControls as s } from "./controls/price/index.js";
+import { OldPriceControls as l } from "./controls/oldPrice/index.js";
+import { OmnibusPriceControls as a } from "./controls/omnibusPrice/index.js";
 import { OmnibusDiscountControls as p } from "./controls/omnibusDiscount/index.js";
-import { ButtonControls as a } from "./controls/button/index.js";
-import { ImageControls as c } from "./controls/image/index.js";
+import { ButtonControls as c } from "./controls/button/index.js";
+import { ImageControls as f } from "./controls/image/index.js";
 import { CustomAttributeControls as C } from "./controls/customAttribute/index.js";
-import { SpacingControl as f } from "./controls/spacing/index.js";
-import { CardBackgroundColorControl as d } from "./controls/cardBackground/index.js";
-import { RecommendationCardCompositionControl as u } from "./controls/cardComposition/index.js";
-import { SyncInfoMessageControl as g } from "./controls/syncInfoMessage.js";
-import { RecommendationIconsRegistry as R } from "./iconsRegistry.js";
-import y from "./recommendation.css.js";
-import { SettingsPanel as B } from "./settingsPanel.js";
-const b = [
-  i,
+import { SpacingControl as d } from "./controls/spacing/index.js";
+import { CardBackgroundColorControl as u } from "./controls/cardBackground/index.js";
+import { RecommendationCardCompositionControl as g } from "./controls/cardComposition/index.js";
+import { SyncInfoMessageControl as y } from "./controls/syncInfoMessage.js";
+import { RecommendationIconsRegistry as P } from "./iconsRegistry.js";
+import R from "./recommendation.css.js";
+import { SettingsPanel as S } from "./settingsPanel.js";
+const w = [
   e,
   s,
   l,
-  p,
   a,
+  p,
   c,
-  C
-], P = [
-  n,
-  d,
   f,
+  C
+], B = [
+  i,
   u,
-  g
-], S = [
-  ...P,
-  ...b.flatMap((o) => Object.values(o))
-], L = S.reduce(
+  d,
+  g,
+  y
+], b = [
+  ...B,
+  ...w.flatMap((o) => Object.values(o))
+], Q = b.reduce(
   (o, t) => o.addControl(t),
-  new r().addBlock(m).withSettingsPanelRegistry(B)
-).addStyles(y).withIconsRegistry(R).build();
+  new r().addBlock(m).withSettingsPanelRegistry(S)
+).addStyles(R).withPreviewStyles(n).withIconsRegistry(P).build();
 export {
-  L as default
+  Q as default
 };

package/dist/extensions/Blocks/Recommendation/iconsRegistry.js

@@ -1,8 +1,8 @@
 import r from "../../../static/assets/info.svg.js";
-import { IconsRegistry as t } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
-class h extends t {
-  registerIconsSvg(C) {
-    C["recommendation-icon"] = `
+import { IconsRegistry as C } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
+class h extends C {
+  registerIconsSvg(t) {
+    t["recommendation-icon"] = `
             <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
                 <path d="M10 4.4C10 4.73137 9.73012 4.99622 9.40108 5.0355C6.92202 5.33143 5 7.44126 5 10C5 12.5587 
                 6.92202 14.6686 9.40108 14.9645C9.73012 15.0038 10 15.2686 10 15.6V18.4C10 18.7314 9.73137 19 9.4 
@@ -44,14 +44,14 @@ class h extends t {
                 3.40029 12.0082 3.25285 11.7656 3.15234C11.365 2.98638 11.0001 2.64849 11 2.21484V2Z" 
                 fill="currentColor"/>
             </svg>
-        `, C["grid-orientation"] = `
+        `, t["grid-orientation"] = `
             <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="currentColor">
                 <rect x="1" y="1" width="7" height="7" rx="1" stroke="currentColor" stroke-width="2" fill="none"/>
                 <rect x="12" y="1" width="7" height="7" rx="1" stroke="currentColor" stroke-width="2" fill="none"/>
                 <rect x="1" y="12" width="7" height="7" rx="1" stroke="currentColor" stroke-width="2" fill="none"/>
                 <rect x="12" y="12" width="7" height="7" rx="1" stroke="currentColor" stroke-width="2" fill="none"/>
             </svg>
-        `, C["list-orientation"] = `
+        `, t["list-orientation"] = `
             <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="currentColor">
                 <circle cx="3" cy="4" r="1" stroke="currentColor" stroke-width="1"/>
                 <rect x="7" y="3" width="11" height="2" rx="1"/>
@@ -60,7 +60,21 @@ class h extends t {
                 <circle cx="3" cy="16" r="1" stroke="currentColor" stroke-width="1"/>
                 <rect x="7" y="15" width="11" height="2" rx="1"/>
             </svg>
-        `, C["migration-info-icon"] = r;
+        `, t["vertical-orientation"] = `
+            <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="currentColor">
+                <path d="M19 10V16C19 16.5523 18.5523 17 18 17H2C1.44772 17 1 16.5523 1 16V10H19Z"
+                    stroke="currentColor" stroke-width="2" fill="none"/>
+                <path d="M2 3H18C18.5523 3 19 3.44772 19 4V10H1V4C1 3.44772 1.44772 3 2 3Z" stroke="currentColor"
+                stroke-width="2" fill="none"/>
+            </svg>
+        `, t["horizontal-orientation"] = `
+            <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
+                <path d="M10 19H4C3.44772 19 3 18.5523 3 18V2C3 1.44772 3.44772 1 4 1H10V19Z" stroke="currentColor"
+                    stroke-width="2" fill="none"/>
+                <path d="M17 2V18C17 18.5523 16.5523 19 16 19H10V1H16C16.5523 1 17 1.44772 17 2Z" stroke="currentColor"
+                    stroke-width="2" fill="none"/>
+            </svg>
+        `, t["migration-info-icon"] = r;
   }
 }
 export {

package/dist/extensions/Blocks/Recommendation/recommendation.css.js

@@ -18,6 +18,13 @@ const n = `/* Utils */
     padding: 0
 }
 
+/* Group the two price-placement rows (orientation + hide-if-same) into one
+   container — drop the divider the editor adds between stacked setting rows.
+   Ancestor added so this out-specifies the editor's \`.two-columns:not(:first-child)\`. */
+.recommendation-controls-container .price-placement-control-container .container.two-columns {
+    border-top: none;
+}
+
 /* Right-align the mobile layout toggle within the two-column grid */
 .product-layout-control-container ue-switcher {
     justify-self: end;
@@ -143,15 +150,68 @@ ue-orderable.orderable-disabled .droppable-icon {
     color: var(--guido-color-danger-500);
 }
 
-/* Disable drag for list layout */
-.orderable-list.orderable-disabled .drag-handle {
-    display: none;
+/* ─── Inline "Product Prices" group: nested 2-item sub-drag ───────────── */
+.orderable-item.price-group-item {
+    flex-direction: column;
+    align-items: stretch;
+    gap: 8px;
 }
 
-.orderable-list.orderable-disabled .orderable-item {
+.price-group-header {
+    display: flex;
+    align-items: center;
+    gap: 4px;
+}
+
+.price-suborderable-list {
+    display: flex;
+    flex-direction: column;
+    margin-left: 4px;
+    padding-left: 8px;
+    border-left: 2px solid #eee;
+}
+
+.price-suborderable-item {
+    display: flex;
+    align-items: center;
+    gap: 4px;
+    padding: 8px 0;
+    background: var(--guido-color-white);
     cursor: default;
+    transition: background 0.15s;
+    box-sizing: border-box;
+}
+
+.price-suborderable-item:hover {
+    background: #fafafa;
+}
+
+.price-suborderable-item.dragging {
+    opacity: 0.5;
+    background: var(--guido-color-gray-1);
+}
+
+.price-suborderable-item.drag-over {
+    border-top: 2px solid var(--guido-color-primary-500, #0A2ECC);
+}
+
+.price-suborderable-item .item-label {
+    font-size: 13px;
 }
 
+.sub-drag-handle {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-shrink: 0;
+    width: 24px;
+    height: 24px;
+    cursor: move;
+    user-select: none;
+    color: var(--guido-color-gray-600);
+}
+
+
 /* ─── Migration Info Box ─────────────────────────────────────────────── */
 /* Shown in the settings panel title when a block was migrated from legacy */
 

package/dist/extensions/Blocks/Recommendation/settingsPanel.js

@@ -4,7 +4,6 @@ import { RecommendationBlockId as S } from "./constants/blockIds.js";
 import { RecommendationControlId as T } from "./constants/controlIds.js";
 import { CONTROL_BLOCK_ID as A } from "./controls/main/index.js";
 import "./store/recommendation.js";
-import "./utils/captureStyleTemplates.js";
 import "./controls/name/index.js";
 import "./controls/price/index.js";
 import "./controls/oldPrice/index.js";
@@ -16,7 +15,7 @@ import { SPACING_CONTROL_ID as L } from "./controls/spacing/index.js";
 import { CARD_BACKGROUND_COLOR_CONTROL_ID as D } from "./controls/cardBackground/index.js";
 import { COMPOSITION_CONTROL_BLOCK_ID as B } from "./controls/cardComposition/index.js";
 import { SYNC_INFO_MESSAGE_CONTROL_ID as N } from "./controls/syncInfoMessage.js";
-class a extends E {
+class Z extends E {
   registerBlockControls(I) {
     I[U] = [
       new _(
@@ -195,5 +194,5 @@ class a extends E {
   }
 }
 export {
-  a as SettingsPanel
+  Z as SettingsPanel
 };

package/dist/extensions/Blocks/Recommendation/store/recommendation.js

@@ -3,10 +3,10 @@ import { useRecommendationApi as y } from "../../../../services/recommendationAp
 import { useConfigStore as G } from "../../../../stores/config.js";
 import { defineStore as P } from "pinia";
 import { DEFAULT_MOBILE_CARDS_IN_ROW as D, DEFAULT_CARDS_IN_ROW as F } from "../constants/layout.js";
-import { EXCLUDED_ALGORITHM_IDS as w } from "../constants/defaultConfig.js";
+import { EXCLUDED_ALGORITHM_IDS as v } from "../constants/defaultConfig.js";
 import { getDefaultProducts as S } from "../templates/utils.js";
 import { generateCompleteFilterQuery as b } from "../utils/filterUtil.js";
-import { getPartnerRecommendationParams as v } from "../utils/partnerCustomizations.js";
+import { getPartnerRecommendationParams as w } from "../utils/partnerCustomizations.js";
 import { isFilterValid as N } from "../validation/filterSchema.js";
 import { isConfigValid as x } from "../validation/requiredFields.js";
 const h = y();
@@ -37,7 +37,9 @@ function k() {
     textTrimming: !0,
     unresponsive: !1,
     size: "6",
-    customAttributes: []
+    customAttributes: [],
+    priceMovedToNextLine: !0,
+    priceHideIfSameAsDiscounted: !1
   };
 }
 function I() {
@@ -117,7 +119,7 @@ const L = () => ({
     },
     getActivePredictiveAlgorithms: (t) => {
       const e = g(), r = [];
-      return t.activePredictiveAlgorithms.filter((n) => !w.includes(n)).forEach((n) => {
+      return t.activePredictiveAlgorithms.filter((n) => !v.includes(n)).forEach((n) => {
         r.push(...e.filter((c) => c.id === n));
       }), r.map((n) => ({
         text: n.name,
@@ -457,7 +459,7 @@ const L = () => ({
       };
       r.strategy === "manualMerchandising" ? a.productId = r.productIds.join(",") : r.strategy === "similarViewed" && (a.productId = "{itemId}"), r.strategy === "userBased" && (a.userId = "{user_id}"), c && (a.filter = c), r.shuffleProducts && (a.shuffle = !0), Object.assign(
         a,
-        v(o.partnerName, r.strategy)
+        w(o.partnerName, r.strategy)
       );
       let f;
       try {