@useinsider/guido 2.1.0-beta.425dfd0 → 2.1.0-beta.4bc6068
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/components/organisms/header/HeaderWrapper.vue.js +9 -9
- package/dist/composables/useActionsApi.js +15 -13
- 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 +35 -47
- package/dist/extensions/Blocks/Items/controls/price/currencySymbol.js +49 -54
- package/dist/extensions/Blocks/Items/controls/price/formattedPrice.js +42 -51
- package/dist/extensions/Blocks/Items/controls/price/hideDiscount.js +23 -36
- package/dist/extensions/Blocks/Items/controls/price/priceOrientation.js +45 -57
- package/dist/extensions/Blocks/Items/controls/price/singlePrice.js +42 -60
- 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/settingsPanel.js +10 -15
- 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/guido.css +1 -1
- 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/dist/static/styles/components/notification.css.js +1 -0
- package/dist/static/styles/components/wide-panel.css.js +15 -0
- 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 R = Object.defineProperty;
|
|
2
|
+
var N = (s, c, e) => c in s ? R(s, c, { enumerable: !0, configurable: !0, writable: !0, value: e }) : s[c] = e;
|
|
3
|
+
var h = (s, c, e) => N(s, typeof c != "symbol" ? c + "" : c, e);
|
|
4
|
+
import { ModificationDescription as B } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
|
|
5
|
+
import { CommonControl as E } from "../../../common-control.js";
|
|
6
|
+
import { ItemsBlockControlId as y } from "../../enums/controlEnums.js";
|
|
7
|
+
import { getItemsBlockConfig as p, setItemsBlockConfig as x, escapeReplacement as f } from "../../utils/nodeConfigUtils.js";
|
|
8
|
+
const I = y.PRICE_CURRENCY_SYMBOL, u = {
|
|
10
9
|
CURRENCY_SYMBOL: "currencySymbol"
|
|
11
10
|
};
|
|
12
|
-
class
|
|
11
|
+
class P extends E {
|
|
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 = p(this.currentNode);
|
|
28
|
+
this.api.updateValues({ [u.CURRENCY_SYMBOL]: (e == null ? void 0 : e.priceCurrencySymbol) ?? "" }), this._storeOriginalContents(), this.api.onValueChanged(u.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 = p(this.currentNode);
|
|
38
|
+
this.api.updateValues({ [u.CURRENCY_SYMBOL]: (t == null ? void 0 : t.priceCurrencySymbol) ?? "" }), this._storeOriginalContents();
|
|
39
|
+
});
|
|
46
40
|
}
|
|
47
41
|
_onCurrencySymbolChange(e) {
|
|
48
|
-
var
|
|
42
|
+
var a;
|
|
49
43
|
console.debug("Currency symbol changed to: ", e);
|
|
50
|
-
const t = ((
|
|
51
|
-
if (
|
|
44
|
+
const t = p(this.currentNode), o = ((a = t == null ? void 0 : t.priceCurrencySymbol) == null ? void 0 : a.trim()) || "";
|
|
45
|
+
if (x(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
|
|
59
|
-
if (!
|
|
50
|
+
const n = (e == null ? void 0 : e.trim()) || "", l = (t == null ? void 0 : t.priceCurrencyLocation) ?? "0", i = this.api.getDocumentModifier();
|
|
51
|
+
r.forEach((d) => {
|
|
52
|
+
const m = this._getParagraph(d);
|
|
53
|
+
if (!m)
|
|
60
54
|
return;
|
|
61
|
-
const
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
55
|
+
const g = m.getInnerHTML().trim() || "", C = m.getInnerText().trim() || "", _ = this._removeCurrencySymbol(C, o), S = this._buildPriceContent(_, n, l), b = g.replace(C, f(S));
|
|
56
|
+
i.modifyHtml(m).setInnerHtml(b);
|
|
57
|
+
}), i.apply(new B(
|
|
58
|
+
`Updated currency symbol to ${n || "removed"}`
|
|
59
|
+
));
|
|
66
60
|
}
|
|
67
61
|
_storeOriginalContents() {
|
|
68
62
|
if (!this.currentNode)
|
|
69
63
|
return;
|
|
64
|
+
const e = p(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()) || "", a = this._removeCurrencySymbol(l, i);
|
|
72
|
+
this.originalPriceContents.set(r, a);
|
|
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: u.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
|
+
P as PriceCurrencySymbolControl
|
|
125
120
|
};
|
|
@@ -1,82 +1,73 @@
|
|
|
1
|
-
|
|
2
|
-
var A = (n, r, e) => r in n ? C(n, r, { enumerable: !0, configurable: !0, writable: !0, value: e }) : n[r] = e;
|
|
3
|
-
var _ = (n, r, e) => A(n, typeof r != "symbol" ? r + "" : r, e);
|
|
4
|
-
import { ModificationDescription as L, UIElementType as m, UEAttr as g } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
|
|
1
|
+
import { ModificationDescription as L, UIElementType as P, UEAttr as D } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
|
|
5
2
|
import { CommonControl as h } from "../../../common-control.js";
|
|
6
|
-
import { ItemsBlockControlId as
|
|
3
|
+
import { ItemsBlockControlId as R, 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 u, escapeReplacement as O } from "../../utils/nodeConfigUtils.js";
|
|
6
|
+
const g = R.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 k extends h {
|
|
18
10
|
getId() {
|
|
19
|
-
return
|
|
11
|
+
return g;
|
|
20
12
|
}
|
|
21
13
|
getTemplate() {
|
|
22
14
|
return `
|
|
23
|
-
<div class="container ${
|
|
15
|
+
<div class="container ${R.PRICE_FORMATTED_PRICE}">
|
|
24
16
|
${this._getFormattedPrice()}
|
|
25
17
|
</div>
|
|
26
18
|
`;
|
|
27
19
|
}
|
|
28
20
|
onRender() {
|
|
29
|
-
|
|
21
|
+
const t = d(this.currentNode);
|
|
22
|
+
this.api.updateValues({ [s.FORMATTED_PRICE]: (t == null ? void 0 : t.priceFormatted) ?? !0 }), this.api.onValueChanged(s.FORMATTED_PRICE, (e) => {
|
|
30
23
|
this._onFormattedPriceChange(e);
|
|
31
24
|
});
|
|
32
25
|
}
|
|
33
|
-
onTemplateNodeUpdated(
|
|
34
|
-
super.onTemplateNodeUpdated(
|
|
35
|
-
()
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
},
|
|
39
|
-
() => {
|
|
40
|
-
this.api.updateValues({ [c.FORMATTED_PRICE]: this.store.formattedPrice });
|
|
41
|
-
}
|
|
42
|
-
);
|
|
26
|
+
onTemplateNodeUpdated(t) {
|
|
27
|
+
super.onTemplateNodeUpdated(t), this.handleBlockInstanceChange(() => {
|
|
28
|
+
const e = d(this.currentNode);
|
|
29
|
+
this.api.updateValues({ [s.FORMATTED_PRICE]: (e == null ? void 0 : e.priceFormatted) ?? !0 });
|
|
30
|
+
});
|
|
43
31
|
}
|
|
44
|
-
_onFormattedPriceChange(
|
|
45
|
-
if (console.debug("Formatted price changed to: ",
|
|
32
|
+
_onFormattedPriceChange(t) {
|
|
33
|
+
if (console.debug("Formatted price changed to: ", t), u(this.currentNode, this.api, { priceFormatted: t }), !this.currentNode)
|
|
46
34
|
return;
|
|
47
|
-
const
|
|
48
|
-
i ?
|
|
49
|
-
i ?
|
|
35
|
+
const e = d(this.currentNode), n = (e == null ? void 0 : e.type) ?? "CART_ITEMS", i = (e == null ? void 0 : e.priceSinglePrice) ?? !1, r = I.PAIRS_FOR_EXTENSION.price[n], c = I.PAIRS_FOR_EXTENSION.originalPrice[n], [p, m] = t ? [
|
|
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
|
-
|
|
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 ? c.DEFAULT_SINGLE_PRICE : c.DEFAULT_PRICE, T = i ? c.DEFAULT_SINGLE_PRICE_FORMATTED : c.DEFAULT_PRICE_FORMATTED, [F, A] = t ? [l, T] : [T, l], o = this.currentNode.closest(".items-block"), C = (o == null ? void 0 : o.querySelectorAll(
|
|
42
|
+
`[esd-extension-block-id="${_.PRICE}"]`
|
|
43
|
+
)) || [], E = this.api.getDocumentModifier();
|
|
44
|
+
C.forEach((a) => {
|
|
45
|
+
this._updatePriceBlock(E, a, p, m);
|
|
46
|
+
}), ((o == null ? void 0 : o.querySelectorAll(
|
|
47
|
+
`[esd-extension-block-id="${_.ORIGINAL_PRICE}"]`
|
|
48
|
+
)) || []).forEach((a) => {
|
|
49
|
+
this._updatePriceBlock(E, a, F, A);
|
|
50
|
+
}), E.apply(new L(
|
|
51
|
+
`Updated price to ${t ? "formatted" : "unformatted"}`
|
|
52
|
+
));
|
|
62
53
|
}
|
|
63
|
-
_updatePriceBlock(e,
|
|
64
|
-
const
|
|
65
|
-
|
|
54
|
+
_updatePriceBlock(t, e, n, i) {
|
|
55
|
+
const r = e.getInnerHTML().trim().replace(n, O(i));
|
|
56
|
+
t.modifyHtml(e).setInnerHtml(r);
|
|
66
57
|
}
|
|
67
58
|
_getFormattedPrice() {
|
|
68
59
|
return `
|
|
69
60
|
<div class="display-flex align-items-center justify-content-between">
|
|
70
|
-
<${
|
|
71
|
-
${
|
|
61
|
+
<${P.LABEL}
|
|
62
|
+
${D.LABEL.text}="${this.api.translate("Formatted Price (e.g. $9.90)")}"
|
|
72
63
|
>
|
|
73
|
-
</${
|
|
74
|
-
${this._GuToggle(
|
|
64
|
+
</${P.LABEL}>
|
|
65
|
+
${this._GuToggle(s.FORMATTED_PRICE)}
|
|
75
66
|
</div>
|
|
76
67
|
`;
|
|
77
68
|
}
|
|
78
69
|
}
|
|
79
70
|
export {
|
|
80
|
-
|
|
81
|
-
|
|
71
|
+
g as CONTROL_BLOCK_ID,
|
|
72
|
+
k as PriceFormattedPriceControl
|
|
82
73
|
};
|
|
@@ -1,63 +1,50 @@
|
|
|
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
|
-
|
|
49
36
|
<div class="display-flex align-items-center justify-content-between">
|
|
50
|
-
<${
|
|
51
|
-
${
|
|
37
|
+
<${o.LABEL}
|
|
38
|
+
${d.LABEL.text}="${this.api.translate("Hide if same as discounted ")}"
|
|
52
39
|
>
|
|
53
|
-
</${
|
|
54
|
-
${this._GuToggle(
|
|
40
|
+
</${o.LABEL}>
|
|
41
|
+
${this._GuToggle(i.HIDE_DISCOUNT)}
|
|
55
42
|
</div>
|
|
56
43
|
</div>
|
|
57
44
|
`;
|
|
58
45
|
}
|
|
59
46
|
}
|
|
60
47
|
export {
|
|
61
|
-
|
|
62
|
-
|
|
48
|
+
c as CONTROL_BLOCK_ID,
|
|
49
|
+
C as PriceHideDiscountControl
|
|
63
50
|
};
|
|
@@ -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
|
};
|