@useinsider/guido 2.1.0-beta.bc18abc → 2.1.0-beta.e2d48fe
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/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 +124 -85
- 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 +189 -196
- 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 +5 -5
- 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,80 +1,75 @@
|
|
|
1
|
-
var
|
|
2
|
-
var
|
|
3
|
-
var
|
|
4
|
-
import { ModificationDescription as
|
|
5
|
-
import { CommonControl as
|
|
6
|
-
import { ItemsBlockControlId as
|
|
7
|
-
import {
|
|
8
|
-
|
|
9
|
-
const E = h.PRICE_CURRENCY_SYMBOL, m = {
|
|
1
|
+
var b = Object.defineProperty;
|
|
2
|
+
var R = (s, c, e) => c in s ? b(s, c, { enumerable: !0, configurable: !0, writable: !0, value: e }) : s[c] = e;
|
|
3
|
+
var h = (s, c, e) => R(s, typeof c != "symbol" ? c + "" : c, e);
|
|
4
|
+
import { ModificationDescription as N } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
|
|
5
|
+
import { CommonControl as B } from "../../../common-control.js";
|
|
6
|
+
import { ItemsBlockControlId as y } from "../../enums/controlEnums.js";
|
|
7
|
+
import { getItemsBlockConfig as m, setItemsBlockConfig as E, escapeReplacement as x } from "../../utils/nodeConfigUtils.js";
|
|
8
|
+
const I = y.PRICE_CURRENCY_SYMBOL, p = {
|
|
10
9
|
CURRENCY_SYMBOL: "currencySymbol"
|
|
11
10
|
};
|
|
12
|
-
class
|
|
11
|
+
class O extends B {
|
|
13
12
|
constructor() {
|
|
14
13
|
super(...arguments);
|
|
15
|
-
|
|
16
|
-
u(this, "originalPriceContents", /* @__PURE__ */ new Map());
|
|
14
|
+
h(this, "originalPriceContents", /* @__PURE__ */ new Map());
|
|
17
15
|
}
|
|
18
16
|
getId() {
|
|
19
|
-
return
|
|
17
|
+
return I;
|
|
20
18
|
}
|
|
21
19
|
getTemplate() {
|
|
22
20
|
return `
|
|
23
|
-
<div class="container ${
|
|
21
|
+
<div class="container ${y.PRICE_CURRENCY_SYMBOL}">
|
|
24
22
|
${this._getCurrencySymbol()}
|
|
25
23
|
</div>
|
|
26
24
|
`;
|
|
27
25
|
}
|
|
28
26
|
onRender() {
|
|
29
|
-
|
|
30
|
-
|
|
27
|
+
const e = m(this.currentNode);
|
|
28
|
+
this.api.updateValues({ [p.CURRENCY_SYMBOL]: (e == null ? void 0 : e.priceCurrencySymbol) ?? "" }), this._storeOriginalContents(), this.api.onValueChanged(p.CURRENCY_SYMBOL, (t) => {
|
|
29
|
+
this._onCurrencySymbolChange(t);
|
|
31
30
|
});
|
|
32
31
|
}
|
|
33
32
|
onDestroy() {
|
|
34
33
|
super.onDestroy(), this.originalPriceContents.clear();
|
|
35
34
|
}
|
|
36
35
|
onTemplateNodeUpdated(e) {
|
|
37
|
-
super.onTemplateNodeUpdated(e), this.handleBlockInstanceChange(
|
|
38
|
-
()
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
},
|
|
42
|
-
() => {
|
|
43
|
-
this.api.updateValues({ [m.CURRENCY_SYMBOL]: this.store.currencySymbol }), this._storeOriginalContents();
|
|
44
|
-
}
|
|
45
|
-
);
|
|
36
|
+
super.onTemplateNodeUpdated(e), this.handleBlockInstanceChange(() => {
|
|
37
|
+
const t = m(this.currentNode);
|
|
38
|
+
this.api.updateValues({ [p.CURRENCY_SYMBOL]: (t == null ? void 0 : t.priceCurrencySymbol) ?? "" }), this._storeOriginalContents();
|
|
39
|
+
});
|
|
46
40
|
}
|
|
47
41
|
_onCurrencySymbolChange(e) {
|
|
48
42
|
var i;
|
|
49
43
|
console.debug("Currency symbol changed to: ", e);
|
|
50
|
-
const t = ((i =
|
|
51
|
-
if (
|
|
44
|
+
const t = m(this.currentNode), o = ((i = t == null ? void 0 : t.priceCurrencySymbol) == null ? void 0 : i.trim()) || "";
|
|
45
|
+
if (E(this.currentNode, this.api, { priceCurrencySymbol: e }), !this.currentNode)
|
|
52
46
|
return;
|
|
53
47
|
const r = this._getPriceBlocks();
|
|
54
48
|
if (!r || r.length === 0)
|
|
55
49
|
return;
|
|
56
|
-
const
|
|
57
|
-
r.forEach((
|
|
58
|
-
const a = this._getParagraph(
|
|
50
|
+
const n = (e == null ? void 0 : e.trim()) || "", l = (t == null ? void 0 : t.priceCurrencyLocation) ?? "0";
|
|
51
|
+
r.forEach((u) => {
|
|
52
|
+
const a = this._getParagraph(u);
|
|
59
53
|
if (!a)
|
|
60
54
|
return;
|
|
61
|
-
const
|
|
62
|
-
this.api.getDocumentModifier().modifyHtml(a).setInnerHtml(
|
|
63
|
-
`Updated currency symbol to ${
|
|
55
|
+
const d = a.getInnerHTML().trim() || "", C = a.getInnerText().trim() || "", g = this._removeCurrencySymbol(C, o), _ = this._buildPriceContent(g, n, l), S = d.replace(C, x(_));
|
|
56
|
+
this.api.getDocumentModifier().modifyHtml(a).setInnerHtml(S).apply(new N(
|
|
57
|
+
`Updated currency symbol to ${n || "removed"}`
|
|
64
58
|
));
|
|
65
59
|
});
|
|
66
60
|
}
|
|
67
61
|
_storeOriginalContents() {
|
|
68
62
|
if (!this.currentNode)
|
|
69
63
|
return;
|
|
64
|
+
const e = m(this.currentNode);
|
|
70
65
|
this.currentNode.querySelectorAll(
|
|
71
66
|
".items-block-price"
|
|
72
|
-
).forEach((
|
|
73
|
-
var
|
|
74
|
-
const r =
|
|
67
|
+
).forEach((o) => {
|
|
68
|
+
var n;
|
|
69
|
+
const r = o.querySelector("p");
|
|
75
70
|
if (r && !this.originalPriceContents.has(r)) {
|
|
76
|
-
const
|
|
77
|
-
this.originalPriceContents.set(r,
|
|
71
|
+
const l = r.getInnerText() || "", i = ((n = e == null ? void 0 : e.priceCurrencySymbol) == null ? void 0 : n.trim()) || "", u = this._removeCurrencySymbol(l, i);
|
|
72
|
+
this.originalPriceContents.set(r, u);
|
|
78
73
|
}
|
|
79
74
|
});
|
|
80
75
|
}
|
|
@@ -89,29 +84,29 @@ class M extends R {
|
|
|
89
84
|
return e.replace(/[-\\^$*+?().|[\]{}]/g, "\\$&");
|
|
90
85
|
}
|
|
91
86
|
_removeCurrencySymbol(e, t) {
|
|
92
|
-
const
|
|
93
|
-
let
|
|
87
|
+
const o = e || "";
|
|
88
|
+
let r = o;
|
|
94
89
|
if (t) {
|
|
95
90
|
const n = new RegExp(`\\s*${this._escapeRegex(t)}\\s*`);
|
|
96
|
-
|
|
91
|
+
r = o.replace(n, "").trim();
|
|
97
92
|
} else {
|
|
98
|
-
const n =
|
|
93
|
+
const n = o.match(/([^0-9.,\s]+)/);
|
|
99
94
|
if (n && n[1]) {
|
|
100
|
-
const
|
|
101
|
-
|
|
95
|
+
const l = n[1].trim(), i = new RegExp(`\\s*${this._escapeRegex(l)}\\s*`);
|
|
96
|
+
r = o.replace(i, "").trim();
|
|
102
97
|
}
|
|
103
98
|
}
|
|
104
|
-
return
|
|
99
|
+
return r;
|
|
105
100
|
}
|
|
106
|
-
_buildPriceContent(e, t,
|
|
107
|
-
return t ?
|
|
101
|
+
_buildPriceContent(e, t, o) {
|
|
102
|
+
return t ? o === "1" ? `${e} ${t}` : `${t} ${e}` : e;
|
|
108
103
|
}
|
|
109
104
|
_getCurrencySymbol() {
|
|
110
105
|
return `
|
|
111
106
|
${this._GuTwoColumns([
|
|
112
107
|
this._GuLabel({ text: "Currency Symbol" }),
|
|
113
108
|
this._GuTextInput({
|
|
114
|
-
name:
|
|
109
|
+
name: p.CURRENCY_SYMBOL,
|
|
115
110
|
placeholder: "Enter Currency Symbol",
|
|
116
111
|
className: "es-180w"
|
|
117
112
|
})
|
|
@@ -120,6 +115,6 @@ class M extends R {
|
|
|
120
115
|
}
|
|
121
116
|
}
|
|
122
117
|
export {
|
|
123
|
-
|
|
124
|
-
|
|
118
|
+
I as CONTROL_BLOCK_ID,
|
|
119
|
+
O as PriceCurrencySymbolControl
|
|
125
120
|
};
|
|
@@ -1,82 +1,71 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
import { ModificationDescription as L, UIElementType as m, UEAttr as g } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
|
|
5
|
-
import { CommonControl as h } from "../../../common-control.js";
|
|
6
|
-
import { ItemsBlockControlId as l, ItemsBlockId as D } from "../../enums/controlEnums.js";
|
|
1
|
+
import { ModificationDescription as A, UIElementType as P, UEAttr as C } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
|
|
2
|
+
import { CommonControl as L } from "../../../common-control.js";
|
|
3
|
+
import { ItemsBlockControlId as p, ItemsBlockId as _ } from "../../enums/controlEnums.js";
|
|
7
4
|
import { productPairs as I } from "../../enums/productEnums.js";
|
|
8
|
-
import {
|
|
9
|
-
|
|
10
|
-
const N = l.PRICE_FORMATTED_PRICE, c = {
|
|
5
|
+
import { getItemsBlockConfig as d, setItemsBlockConfig as D, escapeReplacement as h } from "../../utils/nodeConfigUtils.js";
|
|
6
|
+
const g = p.PRICE_FORMATTED_PRICE, s = {
|
|
11
7
|
FORMATTED_PRICE: "formattedPrice"
|
|
12
8
|
};
|
|
13
|
-
class
|
|
14
|
-
constructor() {
|
|
15
|
-
super(...arguments);
|
|
16
|
-
_(this, "store", O());
|
|
17
|
-
}
|
|
9
|
+
class $ extends L {
|
|
18
10
|
getId() {
|
|
19
|
-
return
|
|
11
|
+
return g;
|
|
20
12
|
}
|
|
21
13
|
getTemplate() {
|
|
22
14
|
return `
|
|
23
|
-
<div class="container ${
|
|
15
|
+
<div class="container ${p.PRICE_FORMATTED_PRICE}">
|
|
24
16
|
${this._getFormattedPrice()}
|
|
25
17
|
</div>
|
|
26
18
|
`;
|
|
27
19
|
}
|
|
28
20
|
onRender() {
|
|
29
|
-
|
|
30
|
-
|
|
21
|
+
const e = d(this.currentNode);
|
|
22
|
+
this.api.updateValues({ [s.FORMATTED_PRICE]: (e == null ? void 0 : e.priceFormatted) ?? !0 }), this.api.onValueChanged(s.FORMATTED_PRICE, (t) => {
|
|
23
|
+
this._onFormattedPriceChange(t);
|
|
31
24
|
});
|
|
32
25
|
}
|
|
33
26
|
onTemplateNodeUpdated(e) {
|
|
34
|
-
super.onTemplateNodeUpdated(e), this.handleBlockInstanceChange(
|
|
35
|
-
()
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
},
|
|
39
|
-
() => {
|
|
40
|
-
this.api.updateValues({ [c.FORMATTED_PRICE]: this.store.formattedPrice });
|
|
41
|
-
}
|
|
42
|
-
);
|
|
27
|
+
super.onTemplateNodeUpdated(e), this.handleBlockInstanceChange(() => {
|
|
28
|
+
const t = d(this.currentNode);
|
|
29
|
+
this.api.updateValues({ [s.FORMATTED_PRICE]: (t == null ? void 0 : t.priceFormatted) ?? !0 });
|
|
30
|
+
});
|
|
43
31
|
}
|
|
44
32
|
_onFormattedPriceChange(e) {
|
|
45
|
-
if (console.debug("Formatted price changed to: ", e),
|
|
33
|
+
if (console.debug("Formatted price changed to: ", e), D(this.currentNode, this.api, { priceFormatted: e }), !this.currentNode)
|
|
46
34
|
return;
|
|
47
|
-
const
|
|
48
|
-
i ?
|
|
49
|
-
i ?
|
|
35
|
+
const t = d(this.currentNode), n = (t == null ? void 0 : t.type) ?? "CART_ITEMS", i = (t == null ? void 0 : t.priceSinglePrice) ?? !1, r = I.PAIRS_FOR_EXTENSION.price[n], o = I.PAIRS_FOR_EXTENSION.originalPrice[n], [E, R] = e ? [
|
|
36
|
+
i ? r.DEFAULT_SINGLE_PRICE : r.DEFAULT_PRICE,
|
|
37
|
+
i ? r.DEFAULT_SINGLE_PRICE_FORMATTED : r.DEFAULT_PRICE_FORMATTED
|
|
50
38
|
] : [
|
|
51
|
-
i ?
|
|
52
|
-
i ?
|
|
53
|
-
],
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
R,
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
39
|
+
i ? r.DEFAULT_SINGLE_PRICE_FORMATTED : r.DEFAULT_PRICE_FORMATTED,
|
|
40
|
+
i ? r.DEFAULT_SINGLE_PRICE : r.DEFAULT_PRICE
|
|
41
|
+
], l = i ? o.DEFAULT_SINGLE_PRICE : o.DEFAULT_PRICE, T = i ? o.DEFAULT_SINGLE_PRICE_FORMATTED : o.DEFAULT_PRICE_FORMATTED, [m, F] = e ? [l, T] : [T, l], c = this.currentNode.closest(".items-block");
|
|
42
|
+
((c == null ? void 0 : c.querySelectorAll(
|
|
43
|
+
`[esd-extension-block-id="${_.PRICE}"]`
|
|
44
|
+
)) || []).forEach((a) => {
|
|
45
|
+
this._updatePriceBlock(a, E, R, e, "price");
|
|
46
|
+
}), ((c == null ? void 0 : c.querySelectorAll(
|
|
47
|
+
`[esd-extension-block-id="${_.ORIGINAL_PRICE}"]`
|
|
48
|
+
)) || []).forEach((a) => {
|
|
49
|
+
this._updatePriceBlock(a, m, F, e, "original price");
|
|
50
|
+
});
|
|
62
51
|
}
|
|
63
|
-
_updatePriceBlock(e,
|
|
64
|
-
const
|
|
65
|
-
this.api.getDocumentModifier().modifyHtml(e).setInnerHtml(
|
|
52
|
+
_updatePriceBlock(e, t, n, i, r) {
|
|
53
|
+
const o = e.getInnerHTML().trim().replace(t, h(n)), E = `Updated ${r} to ${i ? "formatted" : "unformatted"}`;
|
|
54
|
+
this.api.getDocumentModifier().modifyHtml(e).setInnerHtml(o).apply(new A(E));
|
|
66
55
|
}
|
|
67
56
|
_getFormattedPrice() {
|
|
68
57
|
return `
|
|
69
58
|
<div class="display-flex align-items-center justify-content-between">
|
|
70
|
-
<${
|
|
71
|
-
${
|
|
59
|
+
<${P.LABEL}
|
|
60
|
+
${C.LABEL.text}="${this.api.translate("Formatted Price (e.g. $9.90)")}"
|
|
72
61
|
>
|
|
73
|
-
</${
|
|
74
|
-
${this._GuToggle(
|
|
62
|
+
</${P.LABEL}>
|
|
63
|
+
${this._GuToggle(s.FORMATTED_PRICE)}
|
|
75
64
|
</div>
|
|
76
65
|
`;
|
|
77
66
|
}
|
|
78
67
|
}
|
|
79
68
|
export {
|
|
80
|
-
|
|
81
|
-
|
|
69
|
+
g as CONTROL_BLOCK_ID,
|
|
70
|
+
$ as PriceFormattedPriceControl
|
|
82
71
|
};
|
|
@@ -1,63 +1,51 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
import {
|
|
5
|
-
|
|
6
|
-
import { ItemsBlockControlId as d } from "../../enums/controlEnums.js";
|
|
7
|
-
import { useItemsBlockStore as I } from "../../store/items-block.js";
|
|
8
|
-
import { getItemsBlockConfig as p, setItemsBlockConfig as h } from "../../utils/nodeConfigUtils.js";
|
|
9
|
-
const l = d.PRICE_HIDE_DISCOUNT, s = {
|
|
1
|
+
import { UIElementType as o, UEAttr as d } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
|
|
2
|
+
import { CommonControl as r } from "../../../common-control.js";
|
|
3
|
+
import { ItemsBlockControlId as n } from "../../enums/controlEnums.js";
|
|
4
|
+
import { getItemsBlockConfig as s, setItemsBlockConfig as a } from "../../utils/nodeConfigUtils.js";
|
|
5
|
+
const c = n.PRICE_HIDE_DISCOUNT, i = {
|
|
10
6
|
HIDE_DISCOUNT: "hideDiscount"
|
|
11
7
|
};
|
|
12
|
-
class
|
|
13
|
-
constructor() {
|
|
14
|
-
super(...arguments);
|
|
15
|
-
n(this, "store", I());
|
|
16
|
-
}
|
|
8
|
+
class C extends r {
|
|
17
9
|
getId() {
|
|
18
|
-
return
|
|
10
|
+
return c;
|
|
19
11
|
}
|
|
20
12
|
getTemplate() {
|
|
21
13
|
return `
|
|
22
|
-
<div class="container ${
|
|
14
|
+
<div class="container ${n.PRICE_HIDE_DISCOUNT}">
|
|
23
15
|
${this._getHideDiscount()}
|
|
24
16
|
</div>
|
|
25
17
|
`;
|
|
26
18
|
}
|
|
27
19
|
onRender() {
|
|
28
|
-
|
|
20
|
+
const e = s(this.currentNode);
|
|
21
|
+
this.api.updateValues({ [i.HIDE_DISCOUNT]: (e == null ? void 0 : e.priceHideDiscount) ?? !0 }), this.api.onValueChanged(i.HIDE_DISCOUNT, (t) => {
|
|
29
22
|
this._onHideDiscountChange(t);
|
|
30
23
|
});
|
|
31
24
|
}
|
|
32
|
-
onTemplateNodeUpdated(
|
|
33
|
-
super.onTemplateNodeUpdated(
|
|
34
|
-
()
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
},
|
|
38
|
-
() => {
|
|
39
|
-
this.api.updateValues({ [s.HIDE_DISCOUNT]: this.store.hideDiscount });
|
|
40
|
-
}
|
|
41
|
-
);
|
|
25
|
+
onTemplateNodeUpdated(e) {
|
|
26
|
+
super.onTemplateNodeUpdated(e), this.handleBlockInstanceChange(() => {
|
|
27
|
+
const t = s(this.currentNode);
|
|
28
|
+
this.api.updateValues({ [i.HIDE_DISCOUNT]: (t == null ? void 0 : t.priceHideDiscount) ?? !0 });
|
|
29
|
+
});
|
|
42
30
|
}
|
|
43
|
-
_onHideDiscountChange(
|
|
44
|
-
|
|
31
|
+
_onHideDiscountChange(e) {
|
|
32
|
+
a(this.currentNode, this.api, { priceHideDiscount: e }), this.api.updateValues({ [i.HIDE_DISCOUNT]: e });
|
|
45
33
|
}
|
|
46
34
|
_getHideDiscount() {
|
|
47
35
|
return `
|
|
48
36
|
|
|
49
37
|
<div class="display-flex align-items-center justify-content-between">
|
|
50
|
-
<${
|
|
51
|
-
${
|
|
38
|
+
<${o.LABEL}
|
|
39
|
+
${d.LABEL.text}="${this.api.translate("Hide if same as discounted ")}"
|
|
52
40
|
>
|
|
53
|
-
</${
|
|
54
|
-
${this._GuToggle(
|
|
41
|
+
</${o.LABEL}>
|
|
42
|
+
${this._GuToggle(i.HIDE_DISCOUNT)}
|
|
55
43
|
</div>
|
|
56
44
|
</div>
|
|
57
45
|
`;
|
|
58
46
|
}
|
|
59
47
|
}
|
|
60
48
|
export {
|
|
61
|
-
|
|
62
|
-
|
|
49
|
+
c as CONTROL_BLOCK_ID,
|
|
50
|
+
C as PriceHideDiscountControl
|
|
63
51
|
};
|
|
@@ -1,94 +1,82 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
|
|
7
|
-
import { SETTINGS_ENUMS as E } from "../../enums/settingsEnums.js";
|
|
8
|
-
import { useItemsBlockStore as N } from "../../store/items-block.js";
|
|
9
|
-
import { getItemsBlockConfig as T, setItemsBlockConfig as C } from "../../utils/nodeConfigUtils.js";
|
|
10
|
-
const _ = O.PRICE_ORIENTATION, p = {
|
|
1
|
+
import { ModificationDescription as p } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
|
|
2
|
+
import { CommonControl as O } from "../../../common-control.js";
|
|
3
|
+
import { ItemsBlockControlId as m } from "../../enums/controlEnums.js";
|
|
4
|
+
import { SETTINGS_ENUMS as h } from "../../enums/settingsEnums.js";
|
|
5
|
+
import { getItemsBlockConfig as u, setItemsBlockConfig as I } from "../../utils/nodeConfigUtils.js";
|
|
6
|
+
const N = m.PRICE_ORIENTATION, c = {
|
|
11
7
|
PRICE_ORIENTATION: "priceOrientation"
|
|
12
|
-
},
|
|
8
|
+
}, y = [
|
|
13
9
|
{ icon: "vertical-orientation", value: "vertical" },
|
|
14
10
|
{ icon: "horizontal-orientation", value: "horizontal" }
|
|
15
11
|
];
|
|
16
|
-
class
|
|
17
|
-
constructor() {
|
|
18
|
-
super(...arguments);
|
|
19
|
-
m(this, "store", N());
|
|
20
|
-
}
|
|
12
|
+
class P extends O {
|
|
21
13
|
getId() {
|
|
22
|
-
return
|
|
14
|
+
return N;
|
|
23
15
|
}
|
|
24
16
|
getTemplate() {
|
|
25
17
|
return `
|
|
26
|
-
<div class="container ${
|
|
18
|
+
<div class="container ${m.PRICE_ORIENTATION}">
|
|
27
19
|
${this._getPriceOrientation()}
|
|
28
20
|
</div>
|
|
29
21
|
`;
|
|
30
22
|
}
|
|
31
23
|
onRender() {
|
|
32
|
-
|
|
24
|
+
const i = u(this.currentNode);
|
|
25
|
+
this.api.updateValues({ [c.PRICE_ORIENTATION]: (i == null ? void 0 : i.priceOrientation) ?? "horizontal" }), this.api.onValueChanged(c.PRICE_ORIENTATION, (t) => {
|
|
33
26
|
typeof t == "string" && this._onPriceOrientationChange(t);
|
|
34
27
|
});
|
|
35
28
|
}
|
|
36
|
-
onTemplateNodeUpdated(
|
|
37
|
-
super.onTemplateNodeUpdated(
|
|
38
|
-
()
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
},
|
|
42
|
-
() => {
|
|
43
|
-
this.api.updateValues({ [p.PRICE_ORIENTATION]: this.store.priceOrientation });
|
|
44
|
-
}
|
|
45
|
-
);
|
|
29
|
+
onTemplateNodeUpdated(i) {
|
|
30
|
+
super.onTemplateNodeUpdated(i), this.handleBlockInstanceChange(() => {
|
|
31
|
+
const t = u(this.currentNode);
|
|
32
|
+
this.api.updateValues({ [c.PRICE_ORIENTATION]: (t == null ? void 0 : t.priceOrientation) ?? "horizontal" });
|
|
33
|
+
});
|
|
46
34
|
}
|
|
47
|
-
_onPriceOrientationChange(
|
|
48
|
-
if (
|
|
49
|
-
priceOrientation:
|
|
35
|
+
_onPriceOrientationChange(i) {
|
|
36
|
+
if (I(this.currentNode, this.api, {
|
|
37
|
+
priceOrientation: i
|
|
50
38
|
}), !this.currentNode)
|
|
51
39
|
return;
|
|
52
|
-
const
|
|
53
|
-
|
|
40
|
+
const t = u(this.currentNode), e = ((t == null ? void 0 : t.orientation) ?? h.ORIENTATION.VERTICAL) === h.ORIENTATION.VERTICAL, o = i === "horizontal";
|
|
41
|
+
e ? this._updateVerticalLayout(o) : this._updateHorizontalLayout(o);
|
|
54
42
|
}
|
|
55
|
-
_updateVerticalLayout(
|
|
56
|
-
var
|
|
57
|
-
const
|
|
58
|
-
if (!
|
|
43
|
+
_updateVerticalLayout(i) {
|
|
44
|
+
var a, s, l, n;
|
|
45
|
+
const t = ((s = (a = this.currentNode) == null ? void 0 : a.closest(".ins-product-td")) == null ? void 0 : s.querySelectorAll(".product-price-class")) || [], r = ((n = (l = this.currentNode) == null ? void 0 : l.closest(".ins-product-td")) == null ? void 0 : n.querySelectorAll(".product-original-price-class")) || [];
|
|
46
|
+
if (!t || !r)
|
|
59
47
|
return;
|
|
60
|
-
const e =
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
}), r.forEach((
|
|
64
|
-
|
|
65
|
-
}),
|
|
48
|
+
const e = i ? "50%" : "100%", o = this.api.getDocumentModifier();
|
|
49
|
+
t.forEach((d) => {
|
|
50
|
+
o.modifyHtml(d).setAttribute("width", e).setStyle("width", e);
|
|
51
|
+
}), r.forEach((d) => {
|
|
52
|
+
o.modifyHtml(d).setAttribute("width", e).setStyle("width", e);
|
|
53
|
+
}), o.apply(new p(`Updated original price element width to ${e}`));
|
|
66
54
|
}
|
|
67
|
-
_updateHorizontalLayout(
|
|
68
|
-
var
|
|
69
|
-
const
|
|
70
|
-
if (!
|
|
55
|
+
_updateHorizontalLayout(i) {
|
|
56
|
+
var o, a, s, l;
|
|
57
|
+
const t = ((a = (o = this.currentNode) == null ? void 0 : o.closest(".ins-product-td")) == null ? void 0 : a.querySelectorAll(".horizontal-price")) || [], r = (l = (s = this.currentNode) == null ? void 0 : s.closest(".ins-product-td")) == null ? void 0 : l.querySelector(".vertical-price");
|
|
58
|
+
if (!t || !r || t.length === 0)
|
|
71
59
|
return;
|
|
72
60
|
const e = this.api.getDocumentModifier();
|
|
73
|
-
|
|
74
|
-
e.modifyHtml(
|
|
75
|
-
}), e.modifyHtml(r).setStyle("display", "none"), e.apply(new
|
|
76
|
-
e.modifyHtml(
|
|
77
|
-
}), e.modifyHtml(r).setStyle("display", "table-cell"), e.apply(new
|
|
61
|
+
i ? (t.forEach((n) => {
|
|
62
|
+
e.modifyHtml(n).setStyle("display", "table-cell");
|
|
63
|
+
}), e.modifyHtml(r).setStyle("display", "none"), e.apply(new p("Show horizontal price orientation"))) : (t.forEach((n) => {
|
|
64
|
+
e.modifyHtml(n).setStyle("display", "none");
|
|
65
|
+
}), e.modifyHtml(r).setStyle("display", "table-cell"), e.apply(new p("Show vertical price orientation")));
|
|
78
66
|
}
|
|
79
67
|
_getPriceOrientation() {
|
|
80
68
|
return `
|
|
81
69
|
${this._GuTwoColumns([
|
|
82
70
|
this._GuLabel({ text: "Price Orientation" }),
|
|
83
71
|
this._GuRadioButton({
|
|
84
|
-
name:
|
|
85
|
-
buttons:
|
|
72
|
+
name: c.PRICE_ORIENTATION,
|
|
73
|
+
buttons: y
|
|
86
74
|
})
|
|
87
75
|
])}
|
|
88
76
|
`;
|
|
89
77
|
}
|
|
90
78
|
}
|
|
91
79
|
export {
|
|
92
|
-
|
|
93
|
-
|
|
80
|
+
N as CONTROL_BLOCK_ID,
|
|
81
|
+
P as PriceOrientationControl
|
|
94
82
|
};
|