@useinsider/guido 2.1.0-beta.5160aec → 2.1.0-beta.90d45e0
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.
- package/dist/composables/useActionsApi.js +13 -15
- package/dist/config/migrator/itemsBlockMigrator.js +140 -123
- package/dist/extensions/Blocks/Items/block.js +19 -28
- package/dist/extensions/Blocks/Items/controls/button/link.js +19 -31
- package/dist/extensions/Blocks/Items/controls/cardComposition.js +97 -81
- package/dist/extensions/Blocks/Items/controls/image/link.js +19 -31
- package/dist/extensions/Blocks/Items/controls/name/trimming.js +28 -40
- package/dist/extensions/Blocks/Items/controls/price/currencyLocation.js +34 -46
- package/dist/extensions/Blocks/Items/controls/price/currencySymbol.js +45 -50
- package/dist/extensions/Blocks/Items/controls/price/formattedPrice.js +40 -51
- package/dist/extensions/Blocks/Items/controls/price/hideDiscount.js +23 -35
- package/dist/extensions/Blocks/Items/controls/price/priceOrientation.js +45 -57
- package/dist/extensions/Blocks/Items/controls/price/singlePrice.js +42 -62
- package/dist/extensions/Blocks/Items/controls/settingsControl.js +184 -191
- package/dist/extensions/Blocks/Items/enums/settingsEnums.js +0 -2
- package/dist/extensions/Blocks/Items/extension.js +8 -9
- package/dist/extensions/Blocks/Items/template.js +181 -175
- package/dist/extensions/Blocks/Items/utils/nodeConfigUtils.js +65 -65
- package/dist/extensions/Blocks/Recommendation/utils/preserveTextStyles.js +3 -3
- package/dist/extensions/Blocks/common-control.js +91 -92
- package/dist/src/extensions/Blocks/Items/block.d.ts +0 -1
- package/dist/src/extensions/Blocks/Items/controls/button/link.d.ts +0 -1
- package/dist/src/extensions/Blocks/Items/controls/cardComposition.d.ts +0 -1
- package/dist/src/extensions/Blocks/Items/controls/image/link.d.ts +0 -1
- package/dist/src/extensions/Blocks/Items/controls/name/trimming.d.ts +0 -1
- package/dist/src/extensions/Blocks/Items/controls/price/currencyLocation.d.ts +0 -1
- package/dist/src/extensions/Blocks/Items/controls/price/currencySymbol.d.ts +0 -1
- package/dist/src/extensions/Blocks/Items/controls/price/formattedPrice.d.ts +0 -1
- package/dist/src/extensions/Blocks/Items/controls/price/hideDiscount.d.ts +0 -1
- package/dist/src/extensions/Blocks/Items/controls/price/priceOrientation.d.ts +0 -1
- package/dist/src/extensions/Blocks/Items/controls/price/singlePrice.d.ts +0 -5
- package/dist/src/extensions/Blocks/Items/controls/settingsControl.d.ts +10 -12
- package/dist/src/extensions/Blocks/Items/utils/nodeConfigUtils.d.ts +2 -1
- package/dist/src/extensions/Blocks/common-control.d.ts +4 -5
- package/package.json +1 -1
- package/dist/extensions/Blocks/Items/store/items-block.js +0 -79
- package/dist/src/extensions/Blocks/Items/store/items-block.d.ts +0 -45
|
@@ -1,13 +1,12 @@
|
|
|
1
|
-
var
|
|
2
|
-
var
|
|
3
|
-
var
|
|
4
|
-
import { ModificationDescription as
|
|
5
|
-
import { CommonControl as
|
|
6
|
-
import { ItemsBlockId as
|
|
7
|
-
import { SETTINGS_ENUMS as
|
|
8
|
-
import {
|
|
9
|
-
|
|
10
|
-
const b = "ui-elements-items-card-composition-block", i = {
|
|
1
|
+
var I = Object.defineProperty;
|
|
2
|
+
var p = (c, r, t) => r in c ? I(c, r, { enumerable: !0, configurable: !0, writable: !0, value: t }) : c[r] = t;
|
|
3
|
+
var y = (c, r, t) => p(c, typeof r != "symbol" ? r + "" : r, t);
|
|
4
|
+
import { ModificationDescription as a } from "../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
|
|
5
|
+
import { CommonControl as U } from "../../common-control.js";
|
|
6
|
+
import { ItemsBlockId as n } from "../enums/controlEnums.js";
|
|
7
|
+
import { SETTINGS_ENUMS as u } from "../enums/settingsEnums.js";
|
|
8
|
+
import { getItemsBlockConfig as h, setItemsBlockConfig as b } from "../utils/nodeConfigUtils.js";
|
|
9
|
+
const m = "ui-elements-items-card-composition-block", i = {
|
|
11
10
|
PRODUCT_IMAGE: "image",
|
|
12
11
|
PRODUCT_NAME: "name",
|
|
13
12
|
PRODUCT_QUANTITY: "quantity",
|
|
@@ -15,11 +14,10 @@ const b = "ui-elements-items-card-composition-block", i = {
|
|
|
15
14
|
PRODUCT_ORIGINAL_PRICE: "originalPrice",
|
|
16
15
|
PRODUCT_BUTTON: "button"
|
|
17
16
|
};
|
|
18
|
-
class S extends
|
|
17
|
+
class S extends U {
|
|
19
18
|
constructor() {
|
|
20
19
|
super(...arguments);
|
|
21
|
-
|
|
22
|
-
P(this, "visibilityState", {
|
|
20
|
+
y(this, "visibilityState", {
|
|
23
21
|
[i.PRODUCT_IMAGE]: !0,
|
|
24
22
|
[i.PRODUCT_NAME]: !0,
|
|
25
23
|
[i.PRODUCT_QUANTITY]: !0,
|
|
@@ -29,7 +27,7 @@ class S extends I {
|
|
|
29
27
|
});
|
|
30
28
|
}
|
|
31
29
|
getId() {
|
|
32
|
-
return
|
|
30
|
+
return m;
|
|
33
31
|
}
|
|
34
32
|
getTemplate() {
|
|
35
33
|
return `
|
|
@@ -41,7 +39,7 @@ class S extends I {
|
|
|
41
39
|
{ name: i.PRODUCT_PRICE, label: "Product Price" },
|
|
42
40
|
{ name: i.PRODUCT_ORIGINAL_PRICE, label: "Product Original Price" },
|
|
43
41
|
{ name: i.PRODUCT_BUTTON, label: "Product Button" }
|
|
44
|
-
].map((
|
|
42
|
+
].map((o) => this._getToggleContainer(o)).join("")}
|
|
45
43
|
</div>
|
|
46
44
|
`;
|
|
47
45
|
}
|
|
@@ -49,20 +47,15 @@ class S extends I {
|
|
|
49
47
|
this._syncVisibilityFromAttributes(), this._handleBrowsedItemsQuantity(), this._initializeToggles(), this._listenToFormUpdates();
|
|
50
48
|
}
|
|
51
49
|
onTemplateNodeUpdated(t) {
|
|
52
|
-
super.onTemplateNodeUpdated(t), this.handleBlockInstanceChange(
|
|
53
|
-
()
|
|
54
|
-
|
|
55
|
-
},
|
|
56
|
-
() => {
|
|
57
|
-
this._updateTogglesFromState();
|
|
58
|
-
}
|
|
59
|
-
);
|
|
50
|
+
super.onTemplateNodeUpdated(t), this.handleBlockInstanceChange(() => {
|
|
51
|
+
this._syncVisibilityFromAttributes(), this._handleBrowsedItemsQuantity(), this._applyVisibilityStyles(), this._updateTogglesFromState();
|
|
52
|
+
});
|
|
60
53
|
}
|
|
61
|
-
_getToggleContainer({ name: t, label:
|
|
54
|
+
_getToggleContainer({ name: t, label: o }) {
|
|
62
55
|
return `
|
|
63
56
|
<div class="container" name="${t}Container">
|
|
64
57
|
<div class="display-flex align-items-center justify-content-between">
|
|
65
|
-
${this._GuLabel({ text:
|
|
58
|
+
${this._GuLabel({ text: o, name: `${t}Label` })}
|
|
66
59
|
${this._GuToggle(t)}
|
|
67
60
|
</div>
|
|
68
61
|
</div>
|
|
@@ -82,10 +75,10 @@ class S extends I {
|
|
|
82
75
|
});
|
|
83
76
|
}
|
|
84
77
|
_syncVisibilityFromAttributes() {
|
|
85
|
-
const t =
|
|
78
|
+
const t = h(this.currentNode);
|
|
86
79
|
if (!t)
|
|
87
80
|
return;
|
|
88
|
-
const
|
|
81
|
+
const o = {
|
|
89
82
|
[i.PRODUCT_IMAGE]: "imageVisible",
|
|
90
83
|
[i.PRODUCT_NAME]: "nameVisible",
|
|
91
84
|
[i.PRODUCT_QUANTITY]: "quantityControlEnabled",
|
|
@@ -93,9 +86,9 @@ class S extends I {
|
|
|
93
86
|
[i.PRODUCT_ORIGINAL_PRICE]: "originalPriceVisible",
|
|
94
87
|
[i.PRODUCT_BUTTON]: "buttonVisible"
|
|
95
88
|
};
|
|
96
|
-
Object.entries(
|
|
97
|
-
const
|
|
98
|
-
this.visibilityState[
|
|
89
|
+
Object.entries(o).forEach(([e, s]) => {
|
|
90
|
+
const l = t[s];
|
|
91
|
+
this.visibilityState[e] = l !== !1;
|
|
99
92
|
});
|
|
100
93
|
}
|
|
101
94
|
/**
|
|
@@ -104,32 +97,34 @@ class S extends I {
|
|
|
104
97
|
* and mark it as '0'
|
|
105
98
|
*/
|
|
106
99
|
_handleBrowsedItemsQuantity() {
|
|
107
|
-
const t = this.
|
|
108
|
-
if (!
|
|
100
|
+
const t = h(this.currentNode), e = ((t == null ? void 0 : t.type) ?? u.ITEMS_TYPE.CART_ITEMS) !== u.ITEMS_TYPE.BROWSED_ITEMS;
|
|
101
|
+
if (!t)
|
|
109
102
|
return;
|
|
110
|
-
const
|
|
111
|
-
this.visibilityState[i.PRODUCT_QUANTITY] =
|
|
103
|
+
const s = t.quantityControlEnabled !== !1;
|
|
104
|
+
this.visibilityState[i.PRODUCT_QUANTITY] = e && s, this.api.setVisibility(`${i.PRODUCT_QUANTITY}Container`, e), this._updateVisibilityAttribute(i.PRODUCT_QUANTITY, e && s);
|
|
112
105
|
}
|
|
113
106
|
_applyVisibilityStyles() {
|
|
114
107
|
const t = {
|
|
115
|
-
[i.PRODUCT_IMAGE]:
|
|
116
|
-
[i.PRODUCT_NAME]:
|
|
117
|
-
[i.PRODUCT_QUANTITY]:
|
|
118
|
-
[i.PRODUCT_PRICE]:
|
|
119
|
-
[i.PRODUCT_ORIGINAL_PRICE]:
|
|
120
|
-
[i.PRODUCT_BUTTON]:
|
|
108
|
+
[i.PRODUCT_IMAGE]: n.IMAGE,
|
|
109
|
+
[i.PRODUCT_NAME]: n.NAME,
|
|
110
|
+
[i.PRODUCT_QUANTITY]: n.QUANTITY,
|
|
111
|
+
[i.PRODUCT_PRICE]: n.PRICE,
|
|
112
|
+
[i.PRODUCT_ORIGINAL_PRICE]: n.ORIGINAL_PRICE,
|
|
113
|
+
[i.PRODUCT_BUTTON]: n.BUTTON
|
|
121
114
|
};
|
|
122
|
-
Object.entries(t).forEach(([
|
|
123
|
-
var
|
|
124
|
-
const
|
|
125
|
-
if (!
|
|
115
|
+
Object.entries(t).forEach(([o, e]) => {
|
|
116
|
+
var C;
|
|
117
|
+
const s = (C = this.currentNode) == null ? void 0 : C.querySelectorAll(`[esd-extension-block-id="${e}"]`);
|
|
118
|
+
if (!s)
|
|
126
119
|
return;
|
|
127
|
-
const
|
|
128
|
-
|
|
120
|
+
const l = this.visibilityState[o], T = this.api.getDocumentModifier();
|
|
121
|
+
s.forEach((d) => {
|
|
122
|
+
T.modifyHtml(d).setStyle("display", l ? "table-cell" : "none");
|
|
123
|
+
}), T.apply(new a("Applied visibility from attributes"));
|
|
129
124
|
}), this._updatePriceCellWidthsForVerticalLayout();
|
|
130
125
|
}
|
|
131
|
-
_updateVisibilityAttribute(t,
|
|
132
|
-
const
|
|
126
|
+
_updateVisibilityAttribute(t, o) {
|
|
127
|
+
const s = {
|
|
133
128
|
[i.PRODUCT_IMAGE]: "imageVisible",
|
|
134
129
|
[i.PRODUCT_NAME]: "nameVisible",
|
|
135
130
|
[i.PRODUCT_QUANTITY]: "quantityControlEnabled",
|
|
@@ -137,8 +132,8 @@ class S extends I {
|
|
|
137
132
|
[i.PRODUCT_ORIGINAL_PRICE]: "originalPriceVisible",
|
|
138
133
|
[i.PRODUCT_BUTTON]: "buttonVisible"
|
|
139
134
|
}[t];
|
|
140
|
-
|
|
141
|
-
[
|
|
135
|
+
s && b(this.currentNode, this.api, {
|
|
136
|
+
[s]: o
|
|
142
137
|
});
|
|
143
138
|
}
|
|
144
139
|
_listenToFormUpdates() {
|
|
@@ -157,35 +152,51 @@ class S extends I {
|
|
|
157
152
|
});
|
|
158
153
|
}
|
|
159
154
|
_onProductImageChange(t) {
|
|
160
|
-
var
|
|
161
|
-
const
|
|
162
|
-
|
|
155
|
+
var e;
|
|
156
|
+
const o = (e = this.currentNode) == null ? void 0 : e.querySelector(`[esd-extension-block-id="${n.IMAGE}"]`);
|
|
157
|
+
o && (this.visibilityState[i.PRODUCT_IMAGE] = t, this.api.getDocumentModifier().modifyHtml(o).setStyle("display", t ? "table-cell" : "none").apply(new a(`Product image visibility changed to ${t ? "visible" : "hidden"}`)), this._updateVisibilityAttribute(i.PRODUCT_IMAGE, t));
|
|
163
158
|
}
|
|
164
159
|
_onProductNameChange(t) {
|
|
165
|
-
var
|
|
166
|
-
const
|
|
167
|
-
|
|
160
|
+
var e;
|
|
161
|
+
const o = (e = this.currentNode) == null ? void 0 : e.querySelector(`[esd-extension-block-id="${n.NAME}"]`);
|
|
162
|
+
o && (this.visibilityState[i.PRODUCT_NAME] = t, this.api.getDocumentModifier().modifyHtml(o).setStyle("display", t ? "table-cell" : "none").apply(new a(`Product name visibility changed to ${t ? "visible" : "hidden"}`)), this._updateVisibilityAttribute(i.PRODUCT_NAME, t));
|
|
168
163
|
}
|
|
169
164
|
_onProductQuantityChange(t) {
|
|
170
|
-
var
|
|
171
|
-
const
|
|
172
|
-
|
|
165
|
+
var e;
|
|
166
|
+
const o = (e = this.currentNode) == null ? void 0 : e.querySelector(`[esd-extension-block-id="${n.QUANTITY}"]`);
|
|
167
|
+
o && (this.visibilityState[i.PRODUCT_QUANTITY] = t, this.api.getDocumentModifier().modifyHtml(o).setStyle("display", t ? "table-cell" : "none").apply(new a(
|
|
173
168
|
`Product quantity visibility changed to ${t ? "visible" : "hidden"}`
|
|
174
169
|
)), this._updateVisibilityAttribute(i.PRODUCT_QUANTITY, t));
|
|
175
170
|
}
|
|
176
171
|
_onProductPriceChange(t) {
|
|
177
|
-
var
|
|
178
|
-
const
|
|
179
|
-
|
|
172
|
+
var s;
|
|
173
|
+
const o = (s = this.currentNode) == null ? void 0 : s.querySelectorAll(
|
|
174
|
+
`[esd-extension-block-id="${n.PRICE}"]`
|
|
175
|
+
);
|
|
176
|
+
if (!o)
|
|
177
|
+
return;
|
|
178
|
+
this.visibilityState[i.PRODUCT_PRICE] = t;
|
|
179
|
+
const e = this.api.getDocumentModifier();
|
|
180
|
+
o.forEach((l) => {
|
|
181
|
+
e.modifyHtml(l).setStyle("display", t ? "table-cell" : "none");
|
|
182
|
+
}), e.apply(
|
|
183
|
+
new a(`Product price visibility changed to ${t ? "visible" : "hidden"}`)
|
|
184
|
+
), this._updateVisibilityAttribute(i.PRODUCT_PRICE, t), this._updatePriceCellWidthsForVerticalLayout();
|
|
180
185
|
}
|
|
181
186
|
_onProductOriginalPriceChange(t) {
|
|
182
|
-
var
|
|
183
|
-
const
|
|
184
|
-
`[esd-extension-block-id="${
|
|
187
|
+
var s;
|
|
188
|
+
const o = (s = this.currentNode) == null ? void 0 : s.querySelectorAll(
|
|
189
|
+
`[esd-extension-block-id="${n.ORIGINAL_PRICE}"]`
|
|
185
190
|
);
|
|
186
|
-
|
|
191
|
+
if (!o)
|
|
192
|
+
return;
|
|
193
|
+
this.visibilityState[i.PRODUCT_ORIGINAL_PRICE] = t;
|
|
194
|
+
const e = this.api.getDocumentModifier();
|
|
195
|
+
o.forEach((l) => {
|
|
196
|
+
e.modifyHtml(l).setStyle("display", t ? "table-cell" : "none");
|
|
197
|
+
}), e.apply(new a(
|
|
187
198
|
`Product original price visibility changed to ${t ? "visible" : "hidden"}`
|
|
188
|
-
)), this._updateVisibilityAttribute(i.PRODUCT_ORIGINAL_PRICE, t), this._updatePriceCellWidthsForVerticalLayout()
|
|
199
|
+
)), this._updateVisibilityAttribute(i.PRODUCT_ORIGINAL_PRICE, t), this._updatePriceCellWidthsForVerticalLayout();
|
|
189
200
|
}
|
|
190
201
|
/**
|
|
191
202
|
* Updates both price cell widths in vertical layout based on priceOrientation and visibility.
|
|
@@ -196,27 +207,32 @@ class S extends I {
|
|
|
196
207
|
* - When both are visible, they share 50% each
|
|
197
208
|
*/
|
|
198
209
|
_updatePriceCellWidthsForVerticalLayout() {
|
|
199
|
-
var
|
|
200
|
-
|
|
210
|
+
var R, O;
|
|
211
|
+
const t = h(this.currentNode);
|
|
212
|
+
if (!((t == null ? void 0 : t.orientation) === u.ORIENTATION.VERTICAL))
|
|
201
213
|
return;
|
|
202
|
-
const e = (
|
|
203
|
-
if (e) {
|
|
204
|
-
const
|
|
205
|
-
|
|
214
|
+
const e = (R = this.currentNode) == null ? void 0 : R.querySelectorAll(".product-price-class"), s = (O = this.currentNode) == null ? void 0 : O.querySelectorAll(".product-original-price-class"), l = (t == null ? void 0 : t.priceOrientation) === "vertical", T = this.visibilityState[i.PRODUCT_PRICE], C = this.visibilityState[i.PRODUCT_ORIGINAL_PRICE], d = this.api.getDocumentModifier();
|
|
215
|
+
if (e && e.length > 0) {
|
|
216
|
+
const P = l || !C ? "100%" : "50%";
|
|
217
|
+
e.forEach((_) => {
|
|
218
|
+
d.modifyHtml(_).setStyle("width", P);
|
|
219
|
+
});
|
|
206
220
|
}
|
|
207
|
-
if (
|
|
208
|
-
const
|
|
209
|
-
|
|
221
|
+
if (s && s.length > 0) {
|
|
222
|
+
const P = l || !T ? "100%" : "50%";
|
|
223
|
+
s.forEach((_) => {
|
|
224
|
+
d.modifyHtml(_).setStyle("width", P);
|
|
225
|
+
});
|
|
210
226
|
}
|
|
211
|
-
|
|
227
|
+
d.apply(new a("Updated price cell widths for vertical layout"));
|
|
212
228
|
}
|
|
213
229
|
_onProductButtonChange(t) {
|
|
214
|
-
var
|
|
215
|
-
const
|
|
216
|
-
|
|
230
|
+
var e;
|
|
231
|
+
const o = (e = this.currentNode) == null ? void 0 : e.querySelector(`[esd-extension-block-id="${n.BUTTON}"]`);
|
|
232
|
+
o && (this.visibilityState[i.PRODUCT_BUTTON] = t, this.api.getDocumentModifier().modifyHtml(o).setStyle("display", t ? "table-cell" : "none").apply(new a(`Product button visibility changed to ${t ? "visible" : "hidden"}`)), this._updateVisibilityAttribute(i.PRODUCT_BUTTON, t));
|
|
217
233
|
}
|
|
218
234
|
}
|
|
219
235
|
export {
|
|
220
|
-
|
|
236
|
+
m as COMPOSITION_CONTROL_BLOCK_ID,
|
|
221
237
|
S as ItemsBlockCardCompositionControl
|
|
222
238
|
};
|
|
@@ -1,52 +1,40 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
import { ItemsBlockControlId as d } from "../../enums/controlEnums.js";
|
|
6
|
-
import { useItemsBlockStore as L } from "../../store/items-block.js";
|
|
7
|
-
import { getItemsBlockConfig as p } from "../../utils/nodeConfigUtils.js";
|
|
8
|
-
const r = d.IMAGE_LINK, i = {
|
|
1
|
+
import { CommonControl as a } from "../../../common-control.js";
|
|
2
|
+
import { ItemsBlockControlId as i } from "../../enums/controlEnums.js";
|
|
3
|
+
import { getItemsBlockConfig as o } from "../../utils/nodeConfigUtils.js";
|
|
4
|
+
const s = i.IMAGE_LINK, n = {
|
|
9
5
|
LINK: "link"
|
|
10
6
|
};
|
|
11
|
-
class
|
|
12
|
-
constructor() {
|
|
13
|
-
super(...arguments);
|
|
14
|
-
s(this, "store", L());
|
|
15
|
-
}
|
|
7
|
+
class p extends a {
|
|
16
8
|
getId() {
|
|
17
|
-
return
|
|
9
|
+
return s;
|
|
18
10
|
}
|
|
19
11
|
getTemplate() {
|
|
20
12
|
return `
|
|
21
|
-
<div class="container ${
|
|
13
|
+
<div class="container ${s}">
|
|
22
14
|
${this._getLink()}
|
|
23
15
|
</div>
|
|
24
16
|
`;
|
|
25
17
|
}
|
|
26
18
|
onRender() {
|
|
19
|
+
const e = o(this.currentNode);
|
|
27
20
|
this.api.updateValues({
|
|
28
|
-
[
|
|
21
|
+
[n.LINK]: (e == null ? void 0 : e.imageLink) ?? ""
|
|
29
22
|
});
|
|
30
23
|
}
|
|
31
|
-
onTemplateNodeUpdated(
|
|
32
|
-
super.onTemplateNodeUpdated(
|
|
33
|
-
()
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
this.api.updateValues({
|
|
39
|
-
[i.LINK]: this.store.imageLink
|
|
40
|
-
});
|
|
41
|
-
}
|
|
42
|
-
);
|
|
24
|
+
onTemplateNodeUpdated(e) {
|
|
25
|
+
super.onTemplateNodeUpdated(e), this.handleBlockInstanceChange(() => {
|
|
26
|
+
const t = o(this.currentNode);
|
|
27
|
+
this.api.updateValues({
|
|
28
|
+
[n.LINK]: (t == null ? void 0 : t.imageLink) ?? ""
|
|
29
|
+
});
|
|
30
|
+
});
|
|
43
31
|
}
|
|
44
32
|
_getLink() {
|
|
45
33
|
return `
|
|
46
34
|
${this._GuOneColumn([
|
|
47
35
|
this._GuLabel({ text: "Link" }),
|
|
48
36
|
this._GuTextInput({
|
|
49
|
-
name:
|
|
37
|
+
name: n.LINK,
|
|
50
38
|
placeholder: "Enter Link",
|
|
51
39
|
className: "es-100",
|
|
52
40
|
disabled: !0
|
|
@@ -56,6 +44,6 @@ class g extends l {
|
|
|
56
44
|
}
|
|
57
45
|
}
|
|
58
46
|
export {
|
|
59
|
-
|
|
60
|
-
|
|
47
|
+
s as CONTROL_BLOCK_ID,
|
|
48
|
+
p as ImageLinkControl
|
|
61
49
|
};
|
|
@@ -1,70 +1,58 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
|
|
7
|
-
import { SETTINGS_ENUMS as I } from "../../enums/settingsEnums.js";
|
|
8
|
-
import { useItemsBlockStore as N } from "../../store/items-block.js";
|
|
9
|
-
import { getItemsBlockConfig as f, setItemsBlockConfig as M } from "../../utils/nodeConfigUtils.js";
|
|
10
|
-
const y = p.NAME_TRIMMING, m = {
|
|
1
|
+
import { ModificationDescription as s, UIElementType as a, UEAttr as T } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
|
|
2
|
+
import { CommonControl as d } from "../../../common-control.js";
|
|
3
|
+
import { ItemsBlockControlId as l } from "../../enums/controlEnums.js";
|
|
4
|
+
import { SETTINGS_ENUMS as h } from "../../enums/settingsEnums.js";
|
|
5
|
+
import { getItemsBlockConfig as r, setItemsBlockConfig as c } from "../../utils/nodeConfigUtils.js";
|
|
6
|
+
const I = l.NAME_TRIMMING, n = {
|
|
11
7
|
TRIMMING: "trimming"
|
|
12
8
|
};
|
|
13
|
-
class
|
|
14
|
-
constructor() {
|
|
15
|
-
super(...arguments);
|
|
16
|
-
s(this, "store", N());
|
|
17
|
-
}
|
|
9
|
+
class S extends d {
|
|
18
10
|
getId() {
|
|
19
|
-
return
|
|
11
|
+
return I;
|
|
20
12
|
}
|
|
21
13
|
getTemplate() {
|
|
22
14
|
return `
|
|
23
|
-
<div class="container ${
|
|
15
|
+
<div class="container ${l.NAME_TRIMMING}">
|
|
24
16
|
${this._getTextTrimming()}
|
|
25
17
|
</div>
|
|
26
18
|
`;
|
|
27
19
|
}
|
|
28
20
|
onRender() {
|
|
29
|
-
|
|
30
|
-
|
|
21
|
+
const e = r(this.currentNode);
|
|
22
|
+
this.api.updateValues({ [n.TRIMMING]: (e == null ? void 0 : e.nameTrimming) ?? !0 }), this.api.onValueChanged(n.TRIMMING, (t) => {
|
|
23
|
+
this._onTrimmingChange(t);
|
|
31
24
|
});
|
|
32
25
|
}
|
|
33
26
|
onTemplateNodeUpdated(e) {
|
|
34
|
-
super.onTemplateNodeUpdated(e), this.handleBlockInstanceChange(
|
|
35
|
-
()
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
},
|
|
39
|
-
() => {
|
|
40
|
-
this.api.updateValues({ [m.TRIMMING]: this.store.nameTrimming });
|
|
41
|
-
}
|
|
42
|
-
);
|
|
27
|
+
super.onTemplateNodeUpdated(e), this.handleBlockInstanceChange(() => {
|
|
28
|
+
const t = r(this.currentNode);
|
|
29
|
+
this.api.updateValues({ [n.TRIMMING]: (t == null ? void 0 : t.nameTrimming) ?? !0 });
|
|
30
|
+
});
|
|
43
31
|
}
|
|
44
32
|
_onTrimmingChange(e) {
|
|
45
|
-
|
|
33
|
+
c(this.currentNode, this.api, { nameTrimming: e }), this.api.updateValues({ [n.TRIMMING]: e }), this._applyTrimmingStyles(e);
|
|
46
34
|
}
|
|
47
35
|
_applyTrimmingStyles(e) {
|
|
48
|
-
var
|
|
49
|
-
const
|
|
50
|
-
if (!
|
|
36
|
+
var m;
|
|
37
|
+
const t = (m = this.currentNode) == null ? void 0 : m.querySelector("p > a");
|
|
38
|
+
if (!t)
|
|
51
39
|
return;
|
|
52
|
-
const
|
|
53
|
-
|
|
40
|
+
const i = r(this.currentNode), p = e !== void 0 ? e : (i == null ? void 0 : i.nameTrimming) ?? !0, o = (i == null ? void 0 : i.orientation) === h.ORIENTATION.VERTICAL;
|
|
41
|
+
p ? this.api.getDocumentModifier().modifyHtml(t).setStyle("white-space", "nowrap").setStyle("overflow", "hidden").setStyle("text-overflow", "ellipsis").setStyle("max-width", o ? "130px" : "520px").apply(new s("Text Trimming Enabled")) : this.api.getDocumentModifier().modifyHtml(t).removeStyle("white-space").removeStyle("overflow").removeStyle("text-overflow").removeStyle("max-width").setStyle("max-width", o ? "130px" : "520px").apply(new s("Text Trimming Disabled"));
|
|
54
42
|
}
|
|
55
43
|
_getTextTrimming() {
|
|
56
44
|
return `
|
|
57
45
|
<div class="display-flex align-items-center justify-content-between">
|
|
58
|
-
<${
|
|
59
|
-
${
|
|
46
|
+
<${a.LABEL}
|
|
47
|
+
${T.LABEL.text}="${this.api.translate("Text Trimming")}"
|
|
60
48
|
>
|
|
61
|
-
</${
|
|
62
|
-
${this._GuToggle(
|
|
49
|
+
</${a.LABEL}>
|
|
50
|
+
${this._GuToggle(n.TRIMMING)}
|
|
63
51
|
</div>
|
|
64
52
|
`;
|
|
65
53
|
}
|
|
66
54
|
}
|
|
67
55
|
export {
|
|
68
|
-
|
|
69
|
-
|
|
56
|
+
I as CONTROL_BLOCK_ID,
|
|
57
|
+
S as NameTrimmingControl
|
|
70
58
|
};
|
|
@@ -1,60 +1,48 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
|
|
7
|
-
import { ItemsBlockControlId as h } from "../../enums/controlEnums.js";
|
|
8
|
-
import { useItemsBlockStore as f } from "../../store/items-block.js";
|
|
9
|
-
import { getItemsBlockConfig as E, setItemsBlockConfig as O } from "../../utils/nodeConfigUtils.js";
|
|
10
|
-
const b = h.PRICE_CURRENCY_LOCATION, a = {
|
|
1
|
+
import { currencyLocationMaps as p } from "../../../../../enums/extensions/recommendationBlock.js";
|
|
2
|
+
import { UEAttr as y, ModificationDescription as R } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
|
|
3
|
+
import { CommonControl as L } from "../../../common-control.js";
|
|
4
|
+
import { ItemsBlockControlId as u } from "../../enums/controlEnums.js";
|
|
5
|
+
import { getItemsBlockConfig as l, setItemsBlockConfig as N, escapeReplacement as I } from "../../utils/nodeConfigUtils.js";
|
|
6
|
+
const T = u.PRICE_CURRENCY_LOCATION, i = {
|
|
11
7
|
CURRENCY_LOCATION: "currencyLocation"
|
|
12
8
|
};
|
|
13
|
-
class
|
|
14
|
-
constructor() {
|
|
15
|
-
super(...arguments);
|
|
16
|
-
p(this, "store", f());
|
|
17
|
-
}
|
|
9
|
+
class $ extends L {
|
|
18
10
|
getId() {
|
|
19
|
-
return
|
|
11
|
+
return T;
|
|
20
12
|
}
|
|
21
13
|
getTemplate() {
|
|
22
14
|
return `
|
|
23
|
-
<div class="container ${
|
|
15
|
+
<div class="container ${u.PRICE_CURRENCY_LOCATION}">
|
|
24
16
|
${this._getCurrencyLocation()}
|
|
25
17
|
</div>
|
|
26
18
|
`;
|
|
27
19
|
}
|
|
28
20
|
onRender() {
|
|
29
|
-
|
|
30
|
-
|
|
21
|
+
const e = l(this.currentNode);
|
|
22
|
+
this.api.setUIEAttribute(i.CURRENCY_LOCATION, y.SELECTPICKER.items, p), this.api.updateValues({ [i.CURRENCY_LOCATION]: (e == null ? void 0 : e.priceCurrencyLocation) ?? "0" }), this.api.onValueChanged(i.CURRENCY_LOCATION, (t) => {
|
|
23
|
+
this._onCurrencyLocationChange(t);
|
|
31
24
|
});
|
|
32
25
|
}
|
|
33
26
|
onTemplateNodeUpdated(e) {
|
|
34
|
-
super.onTemplateNodeUpdated(e), this.handleBlockInstanceChange(
|
|
35
|
-
()
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
},
|
|
39
|
-
() => {
|
|
40
|
-
this.api.updateValues({ [a.CURRENCY_LOCATION]: this.store.currencyLocation });
|
|
41
|
-
}
|
|
42
|
-
);
|
|
27
|
+
super.onTemplateNodeUpdated(e), this.handleBlockInstanceChange(() => {
|
|
28
|
+
const t = l(this.currentNode);
|
|
29
|
+
this.api.updateValues({ [i.CURRENCY_LOCATION]: (t == null ? void 0 : t.priceCurrencyLocation) ?? "0" });
|
|
30
|
+
});
|
|
43
31
|
}
|
|
44
32
|
_onCurrencyLocationChange(e) {
|
|
45
|
-
if (console.debug("Currency location changed to: ", e),
|
|
33
|
+
if (console.debug("Currency location changed to: ", e), N(this.currentNode, this.api, { priceCurrencyLocation: e }), !this.currentNode)
|
|
46
34
|
return;
|
|
47
35
|
const t = this._getPriceBlocks();
|
|
48
36
|
if (!t || t.length === 0)
|
|
49
37
|
return;
|
|
50
|
-
const r = e || "0",
|
|
51
|
-
t.forEach((
|
|
52
|
-
const
|
|
53
|
-
if (!
|
|
38
|
+
const r = l(this.currentNode), n = e || "0", o = (r == null ? void 0 : r.priceCurrencySymbol) ?? "";
|
|
39
|
+
t.forEach((s) => {
|
|
40
|
+
const c = this._getParagraph(s);
|
|
41
|
+
if (!c)
|
|
54
42
|
return;
|
|
55
|
-
const
|
|
56
|
-
this.api.getDocumentModifier().modifyHtml(
|
|
57
|
-
`Updated currency location to ${
|
|
43
|
+
const m = c.getInnerHTML().trim() || "", a = c.getInnerText().trim() || "", C = (o == null ? void 0 : o.trim()) || "", h = this._removeCurrencySymbol(a, C), d = this._detectSymbolInText(a) || C, g = this._buildPriceContent(h, d, n), _ = m.replace(a, I(g));
|
|
44
|
+
this.api.getDocumentModifier().modifyHtml(c).setInnerHtml(_).apply(new R(
|
|
45
|
+
`Updated currency location to ${n === "1" ? "after" : "before"}`
|
|
58
46
|
));
|
|
59
47
|
});
|
|
60
48
|
}
|
|
@@ -72,13 +60,13 @@ class B extends T {
|
|
|
72
60
|
const r = e || "";
|
|
73
61
|
let n = r;
|
|
74
62
|
if (t) {
|
|
75
|
-
const
|
|
76
|
-
n = r.replace(
|
|
63
|
+
const o = new RegExp(`\\s*${this._escapeRegex(t)}\\s*`);
|
|
64
|
+
n = r.replace(o, "").trim();
|
|
77
65
|
} else {
|
|
78
|
-
const
|
|
79
|
-
if (
|
|
80
|
-
const s =
|
|
81
|
-
n = r.replace(
|
|
66
|
+
const o = r.match(/([^0-9.,\s]+)/);
|
|
67
|
+
if (o && o[1]) {
|
|
68
|
+
const s = o[1].trim(), c = new RegExp(`\\s*${this._escapeRegex(s)}\\s*`);
|
|
69
|
+
n = r.replace(c, "").trim();
|
|
82
70
|
}
|
|
83
71
|
}
|
|
84
72
|
return n;
|
|
@@ -95,15 +83,15 @@ class B extends T {
|
|
|
95
83
|
${this._GuTwoColumns([
|
|
96
84
|
this._GuLabel({ text: "Currency Location" }),
|
|
97
85
|
this._GuSelect({
|
|
98
|
-
name:
|
|
86
|
+
name: i.CURRENCY_LOCATION,
|
|
99
87
|
placeholder: "",
|
|
100
|
-
options:
|
|
88
|
+
options: p
|
|
101
89
|
})
|
|
102
90
|
])}
|
|
103
91
|
`;
|
|
104
92
|
}
|
|
105
93
|
}
|
|
106
94
|
export {
|
|
107
|
-
|
|
108
|
-
|
|
95
|
+
T as CONTROL_BLOCK_ID,
|
|
96
|
+
$ as PriceCurrencyLocationControl
|
|
109
97
|
};
|